lit-html
Advanced tools
Comparing version 0.11.0 to 0.11.1
@@ -15,2 +15,41 @@ # Change Log | ||
## [0.11.1] - 2018-09-02 | ||
### Changed | ||
* Eliminated a cycle in the module import graph (#472) | ||
* Remove the default value for the templateProcessor parameter in TemplateResult#constuctor, making it a required paremeter (#472) | ||
## [0.11.0] - 2018-08-28 | ||
### Added | ||
* Added support for property, event, and boolean bindings to default syntax (#398) | ||
* Added guard directive (#438) | ||
* Added when directive (#439) | ||
### Changed | ||
* Split implementation into multiple small modules and merged lit-html.js and core.js (#436) | ||
* Moved directives into top-level `directives/` directory (#436) | ||
* Replaced `PartCallback` with `TemplateProcessor` (#405) | ||
* Unified `NodePart` and `AttributePart` interfaces (#400) | ||
* AttributePart#setValue() takes a single value | ||
* `Part` has separate `setValue()` and `commit()` phases | ||
* Added `AttributeCommitter` to commit attribute values once for multiple `AttributeParts` | ||
### Removed | ||
* Removed lit-extended.js (#436) | ||
### Fixed | ||
* Render initial undefined values in attributes (#377) | ||
* Handle case-sensitive attributes like `viewBox` correctly (#376) | ||
* Support bindings in `<template>` elements (#343) | ||
* Don’t break templates when HTML comments have bindings in them (#446) | ||
* IE: Don't use Set() constructor arguments (#401) | ||
* Handle forms as Node instead of iterable (#404) | ||
* Update values after upgrading custom elements (#385) | ||
* Dirty check primitive values passed to unsafeHTML() (#384) | ||
* Handle forms as Node instead of iterable (#404) | ||
* Upgrade disconnected custom elements before setting properties on them. (#442) | ||
* Fix style attribute bindings in IE (#448) | ||
## [0.10.1] - 2018-06-13 | ||
@@ -17,0 +56,0 @@ |
@@ -14,3 +14,3 @@ /** | ||
*/ | ||
import { Part } from './parts.js'; | ||
import { Part } from './part.js'; | ||
export interface Directive<P = Part> { | ||
@@ -17,0 +17,0 @@ (part: P): void; |
@@ -19,3 +19,3 @@ /** | ||
}; | ||
export const isDirective = (o) => directives.has(o); | ||
export const isDirective = (o) => typeof o === 'function' && directives.has(o); | ||
//# sourceMappingURL=directive.js.map |
@@ -14,24 +14,4 @@ /** | ||
*/ | ||
import { Part } from './part.js'; | ||
import { TemplateFactory } from './template-factory.js'; | ||
/** | ||
* The Part interface represents a dynamic part of a template instance rendered | ||
* by lit-html. | ||
*/ | ||
export interface Part { | ||
value: any; | ||
/** | ||
* Sets the current part value, but does not write it to the DOM. | ||
* @param value The value that will be committed. | ||
*/ | ||
setValue(value: any): void; | ||
/** | ||
* Commits the current part value, cause it to actually be written to the DOM. | ||
*/ | ||
commit(): void; | ||
} | ||
/** | ||
* A sentinel value that signals that a value was handled by a directive and | ||
* should not be written to the DOM. | ||
*/ | ||
export declare const noChange: {}; | ||
export declare const isPrimitive: (value: any) => boolean; | ||
@@ -38,0 +18,0 @@ /** |
@@ -16,10 +16,6 @@ /** | ||
import { isCEPolyfill, removeNodes } from './dom.js'; | ||
import { noChange } from './part.js'; | ||
import { TemplateInstance } from './template-instance.js'; | ||
import { TemplateResult } from './template-result.js'; | ||
import { createMarker } from './template.js'; | ||
/** | ||
* A sentinel value that signals that a value was handled by a directive and | ||
* should not be written to the DOM. | ||
*/ | ||
export const noChange = {}; | ||
export const isPrimitive = (value) => (value === null || | ||
@@ -26,0 +22,0 @@ !(typeof value === 'object' || typeof value === 'function')); |
@@ -17,5 +17,3 @@ /** | ||
import { TemplateResult } from './template-result.js'; | ||
export declare type TemplateContainer = (Element | DocumentFragment) & { | ||
__templateInstance?: TemplateInstance; | ||
}; | ||
export declare const templateInstances: WeakMap<Node, TemplateInstance>; | ||
/** | ||
@@ -22,0 +20,0 @@ * Renders a template to a container. |
@@ -17,2 +17,3 @@ /** | ||
import { TemplateInstance } from './template-instance.js'; | ||
export const templateInstances = new WeakMap(); | ||
/** | ||
@@ -34,3 +35,3 @@ * Renders a template to a container. | ||
const template = templateFactory(result); | ||
let instance = container.__templateInstance; | ||
let instance = templateInstances.get(container); | ||
// Repeat render, just call update() | ||
@@ -44,3 +45,3 @@ if (instance !== undefined && instance.template === template && | ||
instance = new TemplateInstance(template, result.processor, templateFactory); | ||
container.__templateInstance = instance; | ||
templateInstances.set(container, instance); | ||
const fragment = instance._clone(); | ||
@@ -47,0 +48,0 @@ removeNodes(container, container.firstChild); |
@@ -16,2 +16,3 @@ /** | ||
import { insertNodeIntoTemplate, removeNodesFromTemplate } from './modify-template.js'; | ||
import { templateInstances } from './render.js'; | ||
import { templateCaches } from './template-factory.js'; | ||
@@ -125,3 +126,3 @@ import { TemplateInstance } from './template-instance.js'; | ||
const template = templateFactory(result); | ||
let instance = container.__templateInstance; | ||
let instance = templateInstances.get(container); | ||
// Repeat render, just call update() | ||
@@ -135,3 +136,3 @@ if (instance !== undefined && instance.template === template && | ||
instance = new TemplateInstance(template, result.processor, templateFactory); | ||
container.__templateInstance = instance; | ||
templateInstances.set(container, instance); | ||
const fragment = instance._clone(); | ||
@@ -138,0 +139,0 @@ instance.update(result.values); |
@@ -14,3 +14,3 @@ /** | ||
*/ | ||
import { Part } from './parts.js'; | ||
import { Part } from './part.js'; | ||
import { TemplateFactory } from './template-factory.js'; | ||
@@ -17,0 +17,0 @@ import { TemplateProcessor } from './template-processor.js'; |
@@ -14,8 +14,6 @@ /** | ||
*/ | ||
import { NodePart, Part } from './parts.js'; | ||
import { Part } from './part.js'; | ||
import { NodePart } from './parts.js'; | ||
import { TemplateFactory } from './template-factory.js'; | ||
/** | ||
* Creates Parts when a template is instantiated. | ||
*/ | ||
export declare class TemplateProcessor { | ||
export interface TemplateProcessor { | ||
/** | ||
@@ -37,2 +35,1 @@ * Create parts for an attribute-position binding, given the event, attribute | ||
} | ||
export declare const defaultTemplateProcessor: TemplateProcessor; |
@@ -14,40 +14,2 @@ /** | ||
*/ | ||
import { AttributeCommitter, BooleanAttributePart, EventPart, NodePart, PropertyCommitter } from './parts.js'; | ||
/** | ||
* Creates Parts when a template is instantiated. | ||
*/ | ||
export class TemplateProcessor { | ||
/** | ||
* Create parts for an attribute-position binding, given the event, attribute | ||
* name, and string literals. | ||
* | ||
* @param element The element containing the binding | ||
* @param name The attribute name | ||
* @param strings The string literals. There are always at least two strings, | ||
* event for fully-controlled bindings with a single expression. | ||
*/ | ||
handleAttributeExpressions(element, name, strings) { | ||
const prefix = name[0]; | ||
if (prefix === '.') { | ||
const comitter = new PropertyCommitter(element, name.slice(1), strings); | ||
return comitter.parts; | ||
} | ||
if (prefix === '@') { | ||
return [new EventPart(element, name.slice(1))]; | ||
} | ||
if (prefix === '?') { | ||
return [new BooleanAttributePart(element, name.slice(1), strings)]; | ||
} | ||
const comitter = new AttributeCommitter(element, name, strings); | ||
return comitter.parts; | ||
} | ||
/** | ||
* Create parts for a text-position binding. | ||
* @param templateFactory | ||
*/ | ||
handleTextExpression(templateFactory) { | ||
return new NodePart(templateFactory); | ||
} | ||
} | ||
export const defaultTemplateProcessor = new TemplateProcessor(); | ||
//# sourceMappingURL=template-processor.js.map |
@@ -24,3 +24,3 @@ /** | ||
processor: TemplateProcessor; | ||
constructor(strings: TemplateStringsArray, values: any[], type: string, processor?: TemplateProcessor); | ||
constructor(strings: TemplateStringsArray, values: any[], type: string, processor: TemplateProcessor); | ||
/** | ||
@@ -27,0 +27,0 @@ * Returns a string of HTML used to create a <template> element. |
@@ -15,3 +15,2 @@ /** | ||
import { reparentNodes } from './dom.js'; | ||
import { defaultTemplateProcessor } from './template-processor.js'; | ||
import { lastAttributeNameRegex, marker, nodeMarker, rewritesStyleAttribute } from './template.js'; | ||
@@ -23,3 +22,3 @@ /** | ||
export class TemplateResult { | ||
constructor(strings, values, type, processor = defaultTemplateProcessor) { | ||
constructor(strings, values, type, processor) { | ||
this.strings = strings; | ||
@@ -26,0 +25,0 @@ this.values = values; |
@@ -18,3 +18,5 @@ /** | ||
export * from './lib/template-processor.js'; | ||
export * from './lib/default-template-processor.js'; | ||
export * from './lib/template-instance.js'; | ||
export * from './lib/part.js'; | ||
export * from './lib/parts.js'; | ||
@@ -21,0 +23,0 @@ export * from './lib/dom.js'; |
@@ -14,7 +14,9 @@ /** | ||
*/ | ||
import { defaultTemplateProcessor } from './lib/default-template-processor.js'; | ||
import { SVGTemplateResult, TemplateResult } from './lib/template-result.js'; | ||
export * from './lib/template-result.js'; | ||
export * from './lib/template.js'; | ||
export * from './lib/template-processor.js'; | ||
export * from './lib/default-template-processor.js'; | ||
export * from './lib/template-instance.js'; | ||
export * from './lib/part.js'; | ||
export * from './lib/parts.js'; | ||
@@ -29,3 +31,3 @@ export * from './lib/dom.js'; | ||
*/ | ||
export const html = (strings, ...values) => new TemplateResult(strings, values, 'html'); | ||
export const html = (strings, ...values) => new TemplateResult(strings, values, 'html', defaultTemplateProcessor); | ||
/** | ||
@@ -35,3 +37,3 @@ * Interprets a template literal as an SVG template that can efficiently | ||
*/ | ||
export const svg = (strings, ...values) => new SVGTemplateResult(strings, values, 'svg'); | ||
export const svg = (strings, ...values) => new SVGTemplateResult(strings, values, 'svg', defaultTemplateProcessor); | ||
//# sourceMappingURL=lit-html.js.map |
{ | ||
"name": "lit-html", | ||
"version": "0.11.0", | ||
"version": "0.11.1", | ||
"description": "HTML template literals in JavaScript", | ||
@@ -5,0 +5,0 @@ "license": "BSD-3-Clause", |
@@ -15,3 +15,3 @@ /** | ||
import {Part} from './parts.js'; | ||
import {Part} from './part.js'; | ||
@@ -29,2 +29,3 @@ const directives = new WeakMap<any, Boolean>(); | ||
export const isDirective = (o: any) => directives.has(o); | ||
export const isDirective = (o: any) => | ||
typeof o === 'function' && directives.has(o); |
@@ -17,2 +17,3 @@ /** | ||
import {isCEPolyfill, removeNodes} from './dom.js'; | ||
import {noChange, Part} from './part.js'; | ||
import {TemplateFactory} from './template-factory.js'; | ||
@@ -23,27 +24,2 @@ import {TemplateInstance} from './template-instance.js'; | ||
/** | ||
* The Part interface represents a dynamic part of a template instance rendered | ||
* by lit-html. | ||
*/ | ||
export interface Part { | ||
value: any; | ||
/** | ||
* Sets the current part value, but does not write it to the DOM. | ||
* @param value The value that will be committed. | ||
*/ | ||
setValue(value: any): void; | ||
/** | ||
* Commits the current part value, cause it to actually be written to the DOM. | ||
*/ | ||
commit(): void; | ||
} | ||
/** | ||
* A sentinel value that signals that a value was handled by a directive and | ||
* should not be written to the DOM. | ||
*/ | ||
export const noChange = {}; | ||
export const isPrimitive = (value: any) => | ||
@@ -50,0 +26,0 @@ (value === null || |
@@ -20,5 +20,3 @@ /** | ||
export type TemplateContainer = (Element|DocumentFragment)&{ | ||
__templateInstance?: TemplateInstance; | ||
}; | ||
export const templateInstances = new WeakMap<Node, TemplateInstance>(); | ||
@@ -44,3 +42,3 @@ /** | ||
const template = templateFactory(result); | ||
let instance = (container as TemplateContainer).__templateInstance; | ||
let instance = templateInstances.get(container); | ||
// Repeat render, just call update() | ||
@@ -54,3 +52,3 @@ if (instance !== undefined && instance.template === template && | ||
instance = new TemplateInstance(template, result.processor, templateFactory); | ||
(container as TemplateContainer).__templateInstance = instance; | ||
templateInstances.set(container, instance); | ||
const fragment = instance._clone(); | ||
@@ -57,0 +55,0 @@ removeNodes(container, container.firstChild); |
@@ -17,3 +17,3 @@ /** | ||
import {insertNodeIntoTemplate, removeNodesFromTemplate} from './modify-template.js'; | ||
import {TemplateContainer} from './render.js'; | ||
import {templateInstances} from './render.js'; | ||
import {templateCaches} from './template-factory.js'; | ||
@@ -155,4 +155,5 @@ import {TemplateInstance} from './template-instance.js'; | ||
const template = templateFactory(result); | ||
let instance = (container as TemplateContainer).__templateInstance; | ||
let instance = templateInstances.get(container); | ||
// Repeat render, just call update() | ||
@@ -167,3 +168,3 @@ if (instance !== undefined && instance.template === template && | ||
instance = new TemplateInstance(template, result.processor, templateFactory); | ||
(container as TemplateContainer).__templateInstance = instance; | ||
templateInstances.set(container, instance); | ||
@@ -170,0 +171,0 @@ const fragment = instance._clone(); |
@@ -17,3 +17,3 @@ /** | ||
import {isCEPolyfill} from './dom.js'; | ||
import {Part} from './parts.js'; | ||
import {Part} from './part.js'; | ||
import {TemplateFactory} from './template-factory.js'; | ||
@@ -20,0 +20,0 @@ import {TemplateProcessor} from './template-processor.js'; |
@@ -15,9 +15,7 @@ /** | ||
import {AttributeCommitter, BooleanAttributePart, EventPart, NodePart, Part, PropertyCommitter} from './parts.js'; | ||
import {Part} from './part.js'; | ||
import {NodePart} from './parts.js'; | ||
import {TemplateFactory} from './template-factory.js'; | ||
/** | ||
* Creates Parts when a template is instantiated. | ||
*/ | ||
export class TemplateProcessor { | ||
export interface TemplateProcessor { | ||
/** | ||
@@ -33,17 +31,4 @@ * Create parts for an attribute-position binding, given the event, attribute | ||
handleAttributeExpressions(element: Element, name: string, strings: string[]): | ||
Part[] { | ||
const prefix = name[0]; | ||
if (prefix === '.') { | ||
const comitter = new PropertyCommitter(element, name.slice(1), strings); | ||
return comitter.parts; | ||
} | ||
if (prefix === '@') { | ||
return [new EventPart(element, name.slice(1))]; | ||
} | ||
if (prefix === '?') { | ||
return [new BooleanAttributePart(element, name.slice(1), strings)]; | ||
} | ||
const comitter = new AttributeCommitter(element, name, strings); | ||
return comitter.parts; | ||
} | ||
Part[]; | ||
/** | ||
@@ -53,7 +38,3 @@ * Create parts for a text-position binding. | ||
*/ | ||
handleTextExpression(templateFactory: TemplateFactory) { | ||
return new NodePart(templateFactory); | ||
} | ||
handleTextExpression(templateFactory: TemplateFactory): NodePart; | ||
} | ||
export const defaultTemplateProcessor = new TemplateProcessor(); |
@@ -16,3 +16,3 @@ /** | ||
import {reparentNodes} from './dom.js'; | ||
import {defaultTemplateProcessor, TemplateProcessor} from './template-processor.js'; | ||
import {TemplateProcessor} from './template-processor.js'; | ||
import {lastAttributeNameRegex, marker, nodeMarker, rewritesStyleAttribute} from './template.js'; | ||
@@ -32,3 +32,3 @@ | ||
strings: TemplateStringsArray, values: any[], type: string, | ||
processor: TemplateProcessor = defaultTemplateProcessor) { | ||
processor: TemplateProcessor) { | ||
this.strings = strings; | ||
@@ -35,0 +35,0 @@ this.values = values; |
@@ -15,2 +15,3 @@ /** | ||
import {defaultTemplateProcessor} from './lib/default-template-processor.js'; | ||
import {SVGTemplateResult, TemplateResult} from './lib/template-result.js'; | ||
@@ -21,3 +22,5 @@ | ||
export * from './lib/template-processor.js'; | ||
export * from './lib/default-template-processor.js'; | ||
export * from './lib/template-instance.js'; | ||
export * from './lib/part.js'; | ||
export * from './lib/parts.js'; | ||
@@ -34,3 +37,3 @@ export * from './lib/dom.js'; | ||
export const html = (strings: TemplateStringsArray, ...values: any[]) => | ||
new TemplateResult(strings, values, 'html'); | ||
new TemplateResult(strings, values, 'html', defaultTemplateProcessor); | ||
@@ -42,2 +45,2 @@ /** | ||
export const svg = (strings: TemplateStringsArray, ...values: any[]) => | ||
new SVGTemplateResult(strings, values, 'svg'); | ||
new SVGTemplateResult(strings, values, 'svg', defaultTemplateProcessor); |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
New author
Supply chain riskA new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.
Found 1 instance in 1 package
0
308815
92
4497