@lit/reactive-element
Advanced tools
Comparing version 1.6.1 to 2.0.0-pre.0
@@ -17,8 +17,8 @@ /** | ||
*/ | ||
export declare type CSSResultOrNative = CSSResult | CSSStyleSheet; | ||
export declare type CSSResultArray = Array<CSSResultOrNative | CSSResultArray>; | ||
export type CSSResultOrNative = CSSResult | CSSStyleSheet; | ||
export type CSSResultArray = Array<CSSResultOrNative | CSSResultArray>; | ||
/** | ||
* A single CSSResult, CSSStyleSheet, or an array or nested arrays of those. | ||
*/ | ||
export declare type CSSResultGroup = CSSResultOrNative | CSSResultArray; | ||
export type CSSResultGroup = CSSResultOrNative | CSSResultArray; | ||
/** | ||
@@ -25,0 +25,0 @@ * A container for a string of CSS text, that may be used to create a CSSStyleSheet. |
@@ -6,3 +6,3 @@ /** | ||
*/ | ||
const t=window,e=t.ShadowRoot&&(void 0===t.ShadyCSS||t.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,s=Symbol(),n=new WeakMap;class o{constructor(t,e,n){if(this._$cssResult$=!0,n!==s)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t,this.t=e}get styleSheet(){let t=this.o;const s=this.t;if(e&&void 0===t){const e=void 0!==s&&1===s.length;e&&(t=n.get(s)),void 0===t&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),e&&n.set(s,t))}return t}toString(){return this.cssText}}const r=t=>new o("string"==typeof t?t:t+"",void 0,s),i=(t,...e)=>{const n=1===t.length?t[0]:e.reduce(((e,s,n)=>e+(t=>{if(!0===t._$cssResult$)return t.cssText;if("number"==typeof t)return t;throw Error("Value passed to 'css' function must be a 'css' function result: "+t+". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.")})(s)+t[n+1]),t[0]);return new o(n,t,s)},S=(s,n)=>{e?s.adoptedStyleSheets=n.map((t=>t instanceof CSSStyleSheet?t:t.styleSheet)):n.forEach((e=>{const n=document.createElement("style"),o=t.litNonce;void 0!==o&&n.setAttribute("nonce",o),n.textContent=e.cssText,s.appendChild(n)}))},c=e?t=>t:t=>t instanceof CSSStyleSheet?(t=>{let e="";for(const s of t.cssRules)e+=s.cssText;return r(e)})(t):t;export{o as CSSResult,S as adoptStyles,i as css,c as getCompatibleStyle,e as supportsAdoptingStyleSheets,r as unsafeCSS}; | ||
const t=globalThis,e=t.ShadowRoot&&(void 0===t.ShadyCSS||t.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,s=Symbol(),o=new WeakMap;class n{constructor(t,e,o){if(this._$cssResult$=!0,o!==s)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t,this.t=e}get styleSheet(){let t=this.o;const s=this.t;if(e&&void 0===t){const e=void 0!==s&&1===s.length;e&&(t=o.get(s)),void 0===t&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),e&&o.set(s,t))}return t}toString(){return this.cssText}}const r=t=>new n("string"==typeof t?t:t+"",void 0,s),i=(t,...e)=>{const o=1===t.length?t[0]:e.reduce(((e,s,o)=>e+(t=>{if(!0===t._$cssResult$)return t.cssText;if("number"==typeof t)return t;throw Error("Value passed to 'css' function must be a 'css' function result: "+t+". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.")})(s)+t[o+1]),t[0]);return new n(o,t,s)},S=(s,o)=>{if(e)s.adoptedStyleSheets=o.map((t=>t instanceof CSSStyleSheet?t:t.styleSheet));else for(const e of o){const o=document.createElement("style"),n=t.litNonce;void 0!==n&&o.setAttribute("nonce",n),o.textContent=e.cssText,s.appendChild(o)}},c=e?t=>t:t=>t instanceof CSSStyleSheet?(t=>{let e="";for(const s of t.cssRules)e+=s.cssText;return r(e)})(t):t;export{n as CSSResult,S as adoptStyles,i as css,c as getCompatibleStyle,e as supportsAdoptingStyleSheets,r as unsafeCSS}; | ||
//# sourceMappingURL=css-tag.js.map |
@@ -7,3 +7,3 @@ /** | ||
import { ReactiveElement } from '../reactive-element.js'; | ||
export declare type Constructor<T> = { | ||
export type Constructor<T> = { | ||
new (...args: any[]): T; | ||
@@ -10,0 +10,0 @@ }; |
@@ -6,3 +6,3 @@ /** | ||
*/ | ||
const e=(e,t,o)=>{Object.defineProperty(t,o,e)},t=(e,t)=>({kind:"method",placement:"prototype",key:t.key,descriptor:e}),o=({finisher:e,descriptor:t})=>(o,n)=>{var r;if(void 0===n){const n=null!==(r=o.originalKey)&&void 0!==r?r:o.key,i=null!=t?{kind:"method",placement:"prototype",key:n,descriptor:t(o.key)}:{...o,key:n};return null!=e&&(i.finisher=function(t){e(t,n)}),i}{const r=o.constructor;void 0!==t&&Object.defineProperty(o,n,t(n)),null==e||e(r,n)}};export{o as decorateProperty,e as legacyPrototypeMethod,t as standardPrototypeMethod}; | ||
const e=(e,t,o)=>{Object.defineProperty(t,o,e)},t=(e,t)=>({kind:"method",placement:"prototype",key:t.key,descriptor:e}),o=({finisher:e,descriptor:t})=>(o,n)=>{if(void 0===n){const n=o.originalKey??o.key,r=null!=t?{kind:"method",placement:"prototype",key:n,descriptor:t(o.key)}:{...o,key:n};return null!=e&&(r.finisher=function(t){e(t,n)}),r}{const r=o.constructor;void 0!==t&&Object.defineProperty(o,n,t(n)),e?.(r,n)}};export{o as decorateProperty,e as legacyPrototypeMethod,t as standardPrototypeMethod}; | ||
//# sourceMappingURL=base.js.map |
@@ -10,3 +10,3 @@ /** | ||
*/ | ||
declare type CustomElementClass = Omit<typeof HTMLElement, 'new'>; | ||
type CustomElementClass = Omit<typeof HTMLElement, 'new'>; | ||
/** | ||
@@ -13,0 +13,0 @@ * Class decorator factory that defines the decorated class as a custom element. |
@@ -6,3 +6,3 @@ /** | ||
*/ | ||
const i=(i,e)=>"method"===e.kind&&e.descriptor&&!("value"in e.descriptor)?{...e,finisher(n){n.createProperty(e.key,i)}}:{kind:"field",key:Symbol(),placement:"own",descriptor:{},originalKey:e.key,initializer(){"function"==typeof e.initializer&&(this[e.key]=e.initializer.call(this))},finisher(n){n.createProperty(e.key,i)}};function e(e){return(n,t)=>void 0!==t?((i,e,n)=>{e.constructor.createProperty(n,i)})(e,n,t):i(e,n)}export{e as property}; | ||
const i=(i,e)=>"method"===e.kind&&e.descriptor&&!("value"in e.descriptor)?{...e,finisher(n){n.createProperty(e.key,i)}}:{kind:"field",key:Symbol(),placement:"own",descriptor:{},originalKey:e.key,initializer(){"function"==typeof e.initializer&&(this[e.key]=e.initializer.call(this))},finisher(n){n.createProperty(e.key,i)}},e=(i,e,n)=>{e.constructor.createProperty(n,i)};function n(n){return(t,o)=>void 0!==o?e(n,t,o):i(n,t)}export{n as property}; | ||
//# sourceMappingURL=property.js.map |
@@ -6,3 +6,3 @@ import{decorateProperty as r}from"./base.js"; | ||
* SPDX-License-Identifier: BSD-3-Clause | ||
*/function e(e){return r({descriptor:r=>({get(){var r,o;return null!==(o=null===(r=this.renderRoot)||void 0===r?void 0:r.querySelectorAll(e))&&void 0!==o?o:[]},enumerable:!0,configurable:!0})})}export{e as queryAll}; | ||
*/function e(e){return r({descriptor:r=>({get(){return this.renderRoot?.querySelectorAll(e)??[]},enumerable:!0,configurable:!0})})}export{e as queryAll}; | ||
//# sourceMappingURL=query-all.js.map |
@@ -1,2 +0,2 @@ | ||
import{decorateProperty as o}from"./base.js"; | ||
import{decorateProperty as e}from"./base.js"; | ||
/** | ||
@@ -6,3 +6,3 @@ * @license | ||
* SPDX-License-Identifier: BSD-3-Clause | ||
*/var n;const e=null!=(null===(n=window.HTMLSlotElement)||void 0===n?void 0:n.prototype.assignedElements)?(o,n)=>o.assignedElements(n):(o,n)=>o.assignedNodes(n).filter((o=>o.nodeType===Node.ELEMENT_NODE));function l(n){const{slot:l,selector:t}=null!=n?n:{};return o({descriptor:o=>({get(){var o;const r="slot"+(l?`[name=${l}]`:":not([name])"),i=null===(o=this.renderRoot)||void 0===o?void 0:o.querySelector(r),s=null!=i?e(i,n):[];return t?s.filter((o=>o.matches(t))):s},enumerable:!0,configurable:!0})})}export{l as queryAssignedElements}; | ||
*/const o=null!=globalThis.HTMLSlotElement?.prototype.assignedElements?(e,o)=>e.assignedElements(o):(e,o)=>e.assignedNodes(o).filter((e=>e.nodeType===Node.ELEMENT_NODE));function t(t){const{slot:n,selector:r}=t??{};return e({descriptor:e=>({get(){const e="slot"+(n?`[name=${n}]`:":not([name])"),l=this.renderRoot?.querySelector(e),s=null!=l?o(l,t):[];return r?s.filter((e=>e.matches(r))):s},enumerable:!0,configurable:!0})})}export{t as queryAssignedElements}; | ||
//# sourceMappingURL=query-assigned-elements.js.map |
@@ -16,3 +16,3 @@ /** | ||
} | ||
declare type TSDecoratorReturnType = void | any; | ||
type TSDecoratorReturnType = void | any; | ||
/** | ||
@@ -38,3 +38,5 @@ * A property decorator that converts a class property into a getter that | ||
* | ||
* Note the type of this property should be annotated as `Array<Node>`. | ||
* Note the type of this property should be annotated as `Array<Node>`. Use the | ||
* queryAssignedElements decorator to list only elements, and optionally filter | ||
* the element list using a CSS selector. | ||
* | ||
@@ -44,40 +46,3 @@ * @category Decorator | ||
export declare function queryAssignedNodes(options?: QueryAssignedNodesOptions): TSDecoratorReturnType; | ||
/** | ||
* A property decorator that converts a class property into a getter that | ||
* returns the `assignedNodes` of the given named `slot`. | ||
* | ||
* Example usage: | ||
* ```ts | ||
* class MyElement { | ||
* @queryAssignedNodes('list', true, '.item') | ||
* listItems!: Array<HTMLElement>; | ||
* | ||
* render() { | ||
* return html` | ||
* <slot name="list"></slot> | ||
* `; | ||
* } | ||
* } | ||
* ``` | ||
* | ||
* Note the type of this property should be annotated as `Array<Node>` if used | ||
* without a `selector` or `Array<HTMLElement>` if a selector is provided. | ||
* Use {@linkcode queryAssignedElements @queryAssignedElements} to list only | ||
* elements, and optionally filter the element list using a CSS selector. | ||
* | ||
* @param slotName A string name of the slot. | ||
* @param flatten A boolean which when true flattens the assigned nodes, | ||
* meaning any assigned nodes that are slot elements are replaced with their | ||
* assigned nodes. | ||
* @param selector A CSS selector used to filter the elements returned. | ||
* | ||
* @category Decorator | ||
* @deprecated Prefer passing in a single options object, i.e. `{slot: 'list'}`. | ||
* If using `selector` please use `@queryAssignedElements`. | ||
* `@queryAssignedNodes('', false, '.item')` is functionally identical to | ||
* `@queryAssignedElements({slot: '', flatten: false, selector: '.item'})` or | ||
* `@queryAssignedElements({selector: '.item'})`. | ||
*/ | ||
export declare function queryAssignedNodes(slotName?: string, flatten?: boolean, selector?: string): TSDecoratorReturnType; | ||
export {}; | ||
//# sourceMappingURL=query-assigned-nodes.d.ts.map |
@@ -1,2 +0,2 @@ | ||
import{decorateProperty as e}from"./base.js";import{queryAssignedElements as t}from"./query-assigned-elements.js"; | ||
import{decorateProperty as e}from"./base.js"; | ||
/** | ||
@@ -6,3 +6,3 @@ * @license | ||
* SPDX-License-Identifier: BSD-3-Clause | ||
*/function o(o,n,r){let l,s=o;return"object"==typeof o?(s=o.slot,l=o):l={flatten:n},r?t({slot:s,flatten:n,selector:r}):e({descriptor:e=>({get(){var e,t;const o="slot"+(s?`[name=${s}]`:":not([name])"),n=null===(e=this.renderRoot)||void 0===e?void 0:e.querySelector(o);return null!==(t=null==n?void 0:n.assignedNodes(l))&&void 0!==t?t:[]},enumerable:!0,configurable:!0})})}export{o as queryAssignedNodes}; | ||
*/function t(t){const n=t?.slot,r=t;return e({descriptor:e=>({get(){const e="slot"+(n?`[name=${n}]`:":not([name])"),t=this.renderRoot?.querySelector(e);return t?.assignedNodes(r)??[]},enumerable:!0,configurable:!0})})}export{t as queryAssignedNodes}; | ||
//# sourceMappingURL=query-assigned-nodes.js.map |
@@ -7,3 +7,3 @@ import{decorateProperty as r}from"./base.js"; | ||
*/ | ||
function e(e){return r({descriptor:r=>({async get(){var r;return await this.updateComplete,null===(r=this.renderRoot)||void 0===r?void 0:r.querySelector(e)},enumerable:!0,configurable:!0})})}export{e as queryAsync}; | ||
function e(e){return r({descriptor:r=>({async get(){return await this.updateComplete,this.renderRoot?.querySelector(e)},enumerable:!0,configurable:!0})})}export{e as queryAsync}; | ||
//# sourceMappingURL=query-async.js.map |
@@ -1,2 +0,2 @@ | ||
import{decorateProperty as o}from"./base.js"; | ||
import{decorateProperty as t}from"./base.js"; | ||
/** | ||
@@ -6,3 +6,3 @@ * @license | ||
* SPDX-License-Identifier: BSD-3-Clause | ||
*/function i(i,n){return o({descriptor:o=>{const t={get(){var o,n;return null!==(n=null===(o=this.renderRoot)||void 0===o?void 0:o.querySelector(i))&&void 0!==n?n:null},enumerable:!0,configurable:!0};if(n){const n="symbol"==typeof o?Symbol():"__"+o;t.get=function(){var o,t;return void 0===this[n]&&(this[n]=null!==(t=null===(o=this.renderRoot)||void 0===o?void 0:o.querySelector(i))&&void 0!==t?t:null),this[n]}}return t}})}export{i as query}; | ||
*/function r(r,n){return t({descriptor:t=>{const e={get(){return this.renderRoot?.querySelector(r)??null},enumerable:!0,configurable:!0};if(n){const t=Symbol();e.get=function(){return void 0===this[t]&&(this[t]=this.renderRoot?.querySelector(r)??null),this[t]}}return e}})}export{r as query}; | ||
//# sourceMappingURL=query.js.map |
@@ -17,8 +17,8 @@ /** | ||
*/ | ||
export declare type CSSResultOrNative = CSSResult | CSSStyleSheet; | ||
export declare type CSSResultArray = Array<CSSResultOrNative | CSSResultArray>; | ||
export type CSSResultOrNative = CSSResult | CSSStyleSheet; | ||
export type CSSResultArray = Array<CSSResultOrNative | CSSResultArray>; | ||
/** | ||
* A single CSSResult, CSSStyleSheet, or an array or nested arrays of those. | ||
*/ | ||
export declare type CSSResultGroup = CSSResultOrNative | CSSResultArray; | ||
export type CSSResultGroup = CSSResultOrNative | CSSResultArray; | ||
/** | ||
@@ -25,0 +25,0 @@ * A container for a string of CSS text, that may be used to create a CSSStyleSheet. |
@@ -7,3 +7,4 @@ /** | ||
const NODE_MODE = false; | ||
const global = NODE_MODE ? globalThis : window; | ||
// Allows minifiers to rename references to globalThis | ||
const global = globalThis; | ||
/** | ||
@@ -110,3 +111,3 @@ * Whether the current browser supports `adoptedStyleSheets`. | ||
else { | ||
styles.forEach((s) => { | ||
for (const s of styles) { | ||
const style = document.createElement('style'); | ||
@@ -120,3 +121,3 @@ // eslint-disable-next-line @typescript-eslint/no-explicit-any | ||
renderRoot.appendChild(style); | ||
}); | ||
} | ||
} | ||
@@ -123,0 +124,0 @@ }; |
@@ -7,3 +7,3 @@ /** | ||
import { ReactiveElement } from '../reactive-element.js'; | ||
export declare type Constructor<T> = { | ||
export type Constructor<T> = { | ||
new (...args: any[]): T; | ||
@@ -10,0 +10,0 @@ }; |
@@ -32,3 +32,2 @@ /** | ||
) => { | ||
var _a; | ||
// TypeScript / Babel legacy mode | ||
@@ -41,3 +40,3 @@ if (name !== undefined) { | ||
} | ||
finisher === null || finisher === void 0 ? void 0 : finisher(ctor, name); | ||
finisher?.(ctor, name); | ||
// Babel standard mode | ||
@@ -50,3 +49,4 @@ } | ||
// eslint-disable-next-line @typescript-eslint/no-explicit-any | ||
(_a = protoOrDescriptor.originalKey) !== null && _a !== void 0 ? _a : protoOrDescriptor.key; | ||
protoOrDescriptor.originalKey ?? | ||
protoOrDescriptor.key; | ||
const info = descriptor != undefined | ||
@@ -53,0 +53,0 @@ ? { |
@@ -10,3 +10,3 @@ /** | ||
*/ | ||
declare type CustomElementClass = Omit<typeof HTMLElement, 'new'>; | ||
type CustomElementClass = Omit<typeof HTMLElement, 'new'>; | ||
/** | ||
@@ -13,0 +13,0 @@ * Class decorator factory that defines the decorated class as a custom element. |
@@ -35,4 +35,3 @@ /** | ||
get() { | ||
var _a, _b; | ||
return (_b = (_a = this.renderRoot) === null || _a === void 0 ? void 0 : _a.querySelectorAll(selector)) !== null && _b !== void 0 ? _b : []; | ||
return this.renderRoot?.querySelectorAll(selector) ?? []; | ||
}, | ||
@@ -39,0 +38,0 @@ enumerable: true, |
@@ -6,3 +6,2 @@ /** | ||
*/ | ||
var _a; | ||
/* | ||
@@ -15,8 +14,6 @@ * IMPORTANT: For compatibility with tsickle and the Closure JS compiler, all | ||
import { decorateProperty } from './base.js'; | ||
const NODE_MODE = false; | ||
const global = NODE_MODE ? globalThis : window; | ||
/** | ||
* A tiny module scoped polyfill for HTMLSlotElement.assignedElements. | ||
*/ | ||
const slotAssignedElements = ((_a = global.HTMLSlotElement) === null || _a === void 0 ? void 0 : _a.prototype.assignedElements) != null | ||
const slotAssignedElements = globalThis.HTMLSlotElement?.prototype.assignedElements != null | ||
? (slot, opts) => slot.assignedElements(opts) | ||
@@ -56,9 +53,8 @@ : (slot, opts) => slot | ||
export function queryAssignedElements(options) { | ||
const { slot, selector } = options !== null && options !== void 0 ? options : {}; | ||
const { slot, selector } = options ?? {}; | ||
return decorateProperty({ | ||
descriptor: (_name) => ({ | ||
get() { | ||
var _a; | ||
const slotSelector = `slot${slot ? `[name=${slot}]` : ':not([name])'}`; | ||
const slotEl = (_a = this.renderRoot) === null || _a === void 0 ? void 0 : _a.querySelector(slotSelector); | ||
const slotEl = this.renderRoot?.querySelector(slotSelector); | ||
const elements = slotEl != null ? slotAssignedElements(slotEl, options) : []; | ||
@@ -65,0 +61,0 @@ if (selector) { |
@@ -16,3 +16,3 @@ /** | ||
} | ||
declare type TSDecoratorReturnType = void | any; | ||
type TSDecoratorReturnType = void | any; | ||
/** | ||
@@ -38,3 +38,5 @@ * A property decorator that converts a class property into a getter that | ||
* | ||
* Note the type of this property should be annotated as `Array<Node>`. | ||
* Note the type of this property should be annotated as `Array<Node>`. Use the | ||
* queryAssignedElements decorator to list only elements, and optionally filter | ||
* the element list using a CSS selector. | ||
* | ||
@@ -44,40 +46,3 @@ * @category Decorator | ||
export declare function queryAssignedNodes(options?: QueryAssignedNodesOptions): TSDecoratorReturnType; | ||
/** | ||
* A property decorator that converts a class property into a getter that | ||
* returns the `assignedNodes` of the given named `slot`. | ||
* | ||
* Example usage: | ||
* ```ts | ||
* class MyElement { | ||
* @queryAssignedNodes('list', true, '.item') | ||
* listItems!: Array<HTMLElement>; | ||
* | ||
* render() { | ||
* return html` | ||
* <slot name="list"></slot> | ||
* `; | ||
* } | ||
* } | ||
* ``` | ||
* | ||
* Note the type of this property should be annotated as `Array<Node>` if used | ||
* without a `selector` or `Array<HTMLElement>` if a selector is provided. | ||
* Use {@linkcode queryAssignedElements @queryAssignedElements} to list only | ||
* elements, and optionally filter the element list using a CSS selector. | ||
* | ||
* @param slotName A string name of the slot. | ||
* @param flatten A boolean which when true flattens the assigned nodes, | ||
* meaning any assigned nodes that are slot elements are replaced with their | ||
* assigned nodes. | ||
* @param selector A CSS selector used to filter the elements returned. | ||
* | ||
* @category Decorator | ||
* @deprecated Prefer passing in a single options object, i.e. `{slot: 'list'}`. | ||
* If using `selector` please use `@queryAssignedElements`. | ||
* `@queryAssignedNodes('', false, '.item')` is functionally identical to | ||
* `@queryAssignedElements({slot: '', flatten: false, selector: '.item'})` or | ||
* `@queryAssignedElements({selector: '.item'})`. | ||
*/ | ||
export declare function queryAssignedNodes(slotName?: string, flatten?: boolean, selector?: string): TSDecoratorReturnType; | ||
export {}; | ||
//# sourceMappingURL=query-assigned-nodes.d.ts.map |
@@ -13,30 +13,37 @@ /** | ||
import { decorateProperty } from './base.js'; | ||
import { queryAssignedElements } from './query-assigned-elements.js'; | ||
export function queryAssignedNodes(slotOrOptions, flatten, selector) { | ||
// Normalize the overloaded arguments. | ||
let slot = slotOrOptions; | ||
let assignedNodesOptions; | ||
if (typeof slotOrOptions === 'object') { | ||
slot = slotOrOptions.slot; | ||
assignedNodesOptions = slotOrOptions; | ||
} | ||
else { | ||
assignedNodesOptions = { flatten }; | ||
} | ||
// For backwards compatibility, queryAssignedNodes with a selector behaves | ||
// exactly like queryAssignedElements with a selector. | ||
if (selector) { | ||
return queryAssignedElements({ | ||
slot: slot, | ||
flatten, | ||
selector, | ||
}); | ||
} | ||
/** | ||
* A property decorator that converts a class property into a getter that | ||
* returns the `assignedNodes` of the given `slot`. | ||
* | ||
* Can be passed an optional {@linkcode QueryAssignedNodesOptions} object. | ||
* | ||
* Example usage: | ||
* ```ts | ||
* class MyElement { | ||
* @queryAssignedNodes({slot: 'list', flatten: true}) | ||
* listItems!: Array<Node>; | ||
* | ||
* render() { | ||
* return html` | ||
* <slot name="list"></slot> | ||
* `; | ||
* } | ||
* } | ||
* ``` | ||
* | ||
* Note the type of this property should be annotated as `Array<Node>`. Use the | ||
* queryAssignedElements decorator to list only elements, and optionally filter | ||
* the element list using a CSS selector. | ||
* | ||
* @category Decorator | ||
*/ | ||
export function queryAssignedNodes(options) { | ||
const slot = options?.slot; | ||
const assignedNodesOptions = options; | ||
return decorateProperty({ | ||
descriptor: (_name) => ({ | ||
get() { | ||
var _a, _b; | ||
const slotSelector = `slot${slot ? `[name=${slot}]` : ':not([name])'}`; | ||
const slotEl = (_a = this.renderRoot) === null || _a === void 0 ? void 0 : _a.querySelector(slotSelector); | ||
return (_b = slotEl === null || slotEl === void 0 ? void 0 : slotEl.assignedNodes(assignedNodesOptions)) !== null && _b !== void 0 ? _b : []; | ||
const slotEl = this.renderRoot?.querySelector(slotSelector); | ||
return slotEl?.assignedNodes(assignedNodesOptions) ?? []; | ||
}, | ||
@@ -43,0 +50,0 @@ enumerable: true, |
@@ -48,5 +48,4 @@ /** | ||
async get() { | ||
var _a; | ||
await this.updateComplete; | ||
return (_a = this.renderRoot) === null || _a === void 0 ? void 0 : _a.querySelector(selector); | ||
return this.renderRoot?.querySelector(selector); | ||
}, | ||
@@ -53,0 +52,0 @@ enumerable: true, |
@@ -7,2 +7,3 @@ /** | ||
import { decorateProperty } from './base.js'; | ||
const DEV_MODE = true; | ||
/** | ||
@@ -38,4 +39,3 @@ * A property decorator that converts a class property into a getter that | ||
get() { | ||
var _a, _b; | ||
return (_b = (_a = this.renderRoot) === null || _a === void 0 ? void 0 : _a.querySelector(selector)) !== null && _b !== void 0 ? _b : null; | ||
return this.renderRoot?.querySelector(selector) ?? null; | ||
}, | ||
@@ -46,7 +46,10 @@ enumerable: true, | ||
if (cache) { | ||
const key = typeof name === 'symbol' ? Symbol() : `__${name}`; | ||
const key = DEV_MODE | ||
? Symbol(`${String(name)} (@query() cache)`) | ||
: Symbol(); | ||
descriptor.get = function () { | ||
var _a, _b; | ||
if (this[key] === undefined) { | ||
this[key] = (_b = (_a = this.renderRoot) === null || _a === void 0 ? void 0 : _a.querySelector(selector)) !== null && _b !== void 0 ? _b : null; | ||
if (this[key] === | ||
undefined) { | ||
this[key] = | ||
this.renderRoot?.querySelector(selector) ?? null; | ||
} | ||
@@ -53,0 +56,0 @@ return this[key]; |
@@ -56,3 +56,3 @@ /** | ||
} | ||
declare type AttributeConverter<Type = unknown, TypeHint = unknown> = ComplexAttributeConverter<Type> | ((value: string | null, type?: TypeHint) => Type); | ||
type AttributeConverter<Type = unknown, TypeHint = unknown> = ComplexAttributeConverter<Type> | ((value: string | null, type?: TypeHint) => Type); | ||
/** | ||
@@ -129,3 +129,3 @@ * Defines options for a property accessor. | ||
} | ||
declare type PropertyDeclarationMap = Map<PropertyKey, PropertyDeclaration>; | ||
type PropertyDeclarationMap = Map<PropertyKey, PropertyDeclaration>; | ||
/** | ||
@@ -142,3 +142,3 @@ * A Map of property keys to values. | ||
*/ | ||
export declare type PropertyValues<T = any> = T extends object ? PropertyValueMap<T> : Map<PropertyKey, unknown>; | ||
export type PropertyValues<T = any> = T extends object ? PropertyValueMap<T> : Map<PropertyKey, unknown>; | ||
/** | ||
@@ -172,4 +172,4 @@ * Do not use, instead prefer {@linkcode PropertyValues}. | ||
*/ | ||
export declare type WarningKind = 'change-in-update' | 'migration'; | ||
export declare type Initializer = (element: ReactiveElement) => void; | ||
export type WarningKind = 'change-in-update' | 'migration'; | ||
export type Initializer = (element: ReactiveElement) => void; | ||
/** | ||
@@ -176,0 +176,0 @@ * Base element class which manages element properties and attributes. When |
@@ -6,4 +6,3 @@ /** | ||
*/ | ||
var _a, _b, _c, _d; | ||
var _e; | ||
var _a; | ||
/** | ||
@@ -19,8 +18,8 @@ * Use this module if you want to create your own base class extending | ||
const NODE_MODE = false; | ||
const global = NODE_MODE ? globalThis : window; | ||
// Lets a minifier replace globalThis references with a minified name | ||
const global = globalThis; | ||
if (NODE_MODE) { | ||
(_a = global.customElements) !== null && _a !== void 0 ? _a : (global.customElements = customElements); | ||
global.customElements ??= customElements; | ||
} | ||
const DEV_MODE = true; | ||
let requestUpdateThenable; | ||
let issueWarning; | ||
@@ -42,3 +41,4 @@ const trustedTypes = global | ||
// are loaded. | ||
const issuedWarnings = ((_b = global.litIssuedWarnings) !== null && _b !== void 0 ? _b : (global.litIssuedWarnings = new Set())); | ||
const issuedWarnings = (global.litIssuedWarnings ??= | ||
new Set()); | ||
// Issue a warning, if we haven't already. | ||
@@ -54,15 +54,6 @@ issueWarning = (code, warning) => { | ||
// Issue polyfill support warning. | ||
if (((_c = global.ShadyDOM) === null || _c === void 0 ? void 0 : _c.inUse) && polyfillSupport === undefined) { | ||
if (global.ShadyDOM?.inUse && polyfillSupport === undefined) { | ||
issueWarning('polyfill-support-missing', `Shadow DOM is being polyfilled via \`ShadyDOM\` but ` + | ||
`the \`polyfill-support\` module has not been loaded.`); | ||
} | ||
requestUpdateThenable = (name) => ({ | ||
then: (onfulfilled, _onrejected) => { | ||
issueWarning('request-update-promise', `The \`requestUpdate\` method should no longer return a Promise but ` + | ||
`does so on \`${name}\`. Use \`updateComplete\` instead.`); | ||
if (onfulfilled !== undefined) { | ||
onfulfilled(false); | ||
} | ||
}, | ||
}); | ||
} | ||
@@ -163,3 +154,3 @@ /** | ||
*/ | ||
export class ReactiveElement | ||
class ReactiveElement | ||
// In the Node build, this `extends` clause will be substituted with | ||
@@ -174,23 +165,2 @@ // `(globalThis.HTMLElement ?? HTMLElement)`. | ||
extends HTMLElement { | ||
constructor() { | ||
super(); | ||
this.__instanceProperties = new Map(); | ||
/** | ||
* True if there is a pending update as a result of calling `requestUpdate()`. | ||
* Should only be read. | ||
* @category updates | ||
*/ | ||
this.isUpdatePending = false; | ||
/** | ||
* Is set to `true` after the first update. The element code cannot assume | ||
* that `renderRoot` exists before the element `hasUpdated`. | ||
* @category updates | ||
*/ | ||
this.hasUpdated = false; | ||
/** | ||
* Name of currently reflecting property | ||
*/ | ||
this.__reflectingProperty = null; | ||
this._initialize(); | ||
} | ||
/** | ||
@@ -230,5 +200,4 @@ * Adds an initializer function to the class that is called during instance | ||
static addInitializer(initializer) { | ||
var _a; | ||
this.finalize(); | ||
((_a = this._initializers) !== null && _a !== void 0 ? _a : (this._initializers = [])).push(initializer); | ||
(this._initializers ??= []).push(initializer); | ||
} | ||
@@ -244,5 +213,3 @@ /** | ||
const attributes = []; | ||
// Use forEach so this works even if for/of loops are compiled to for loops | ||
// expecting arrays | ||
this.elementProperties.forEach((v, p) => { | ||
for (const [p, v] of this.elementProperties) { | ||
const attr = this.__attributeNameForProperty(p, v); | ||
@@ -253,3 +220,3 @@ if (attr !== undefined) { | ||
} | ||
}); | ||
} | ||
return attributes; | ||
@@ -283,3 +250,2 @@ } | ||
static createProperty(name, options = defaultPropertyDeclaration) { | ||
var _a; | ||
// if this is a state property, force the attribute to false. | ||
@@ -301,3 +267,7 @@ if (options.state) { | ||
if (!options.noAccessor && !this.prototype.hasOwnProperty(name)) { | ||
const key = typeof name === 'symbol' ? Symbol() : `__${name}`; | ||
const key = DEV_MODE | ||
? // Use Symbol.for in dev mode to make it easier to maintain state | ||
// when doing HMR. | ||
Symbol.for(`${String(name)} (@property() cache)`) | ||
: Symbol(); | ||
const descriptor = this.getPropertyDescriptor(name, key, options); | ||
@@ -310,3 +280,3 @@ if (descriptor !== undefined) { | ||
if (!this.hasOwnProperty('__reactivePropertyKeys')) { | ||
this.__reactivePropertyKeys = new Set((_a = this.__reactivePropertyKeys) !== null && _a !== void 0 ? _a : []); | ||
this.__reactivePropertyKeys = new Set(this.__reactivePropertyKeys ?? []); | ||
} | ||
@@ -420,15 +390,2 @@ this.__reactivePropertyKeys.add(name); | ||
this.elementStyles = this.finalizeStyles(this.styles); | ||
// DEV mode warnings | ||
if (DEV_MODE) { | ||
const warnRemovedOrRenamed = (name, renamed = false) => { | ||
if (this.prototype.hasOwnProperty(name)) { | ||
issueWarning(renamed ? 'renamed-api' : 'removed-api', `\`${name}\` is implemented on class ${this.name}. It ` + | ||
`has been ${renamed ? 'renamed' : 'removed'} ` + | ||
`in this version of LitElement.`); | ||
} | ||
}; | ||
warnRemovedOrRenamed('initialize'); | ||
warnRemovedOrRenamed('requestUpdateInternal'); | ||
warnRemovedOrRenamed('_getUpdateComplete', true); | ||
} | ||
return true; | ||
@@ -481,2 +438,23 @@ } | ||
} | ||
constructor() { | ||
super(); | ||
this.__instanceProperties = new Map(); | ||
/** | ||
* True if there is a pending update as a result of calling `requestUpdate()`. | ||
* Should only be read. | ||
* @category updates | ||
*/ | ||
this.isUpdatePending = false; | ||
/** | ||
* Is set to `true` after the first update. The element code cannot assume | ||
* that `renderRoot` exists before the element `hasUpdated`. | ||
* @category updates | ||
*/ | ||
this.hasUpdated = false; | ||
/** | ||
* Name of currently reflecting property | ||
*/ | ||
this.__reflectingProperty = null; | ||
this._initialize(); | ||
} | ||
/** | ||
@@ -489,3 +467,2 @@ * Internal only override point for customizing work done when elements | ||
_initialize() { | ||
var _a; | ||
this.__updatePromise = new Promise((res) => (this.enableUpdating = res)); | ||
@@ -497,3 +474,3 @@ this._$changedProperties = new Map(); | ||
this.requestUpdate(); | ||
(_a = this.constructor._initializers) === null || _a === void 0 ? void 0 : _a.forEach((i) => i(this)); | ||
this.constructor._initializers?.forEach((i) => i(this)); | ||
} | ||
@@ -510,4 +487,3 @@ /** | ||
addController(controller) { | ||
var _a, _b; | ||
((_a = this.__controllers) !== null && _a !== void 0 ? _a : (this.__controllers = [])).push(controller); | ||
(this.__controllers ??= []).push(controller); | ||
// If a controller is added after the element has been connected, | ||
@@ -518,3 +494,3 @@ // call hostConnected. Note, re-using existence of `renderRoot` here | ||
if (this.renderRoot !== undefined && this.isConnected) { | ||
(_b = controller.hostConnected) === null || _b === void 0 ? void 0 : _b.call(controller); | ||
controller.hostConnected?.(); | ||
} | ||
@@ -527,6 +503,5 @@ } | ||
removeController(controller) { | ||
var _a; | ||
// Note, if the indexOf is -1, the >>> will flip the sign which makes the | ||
// splice do nothing. | ||
(_a = this.__controllers) === null || _a === void 0 ? void 0 : _a.splice(this.__controllers.indexOf(controller) >>> 0, 1); | ||
this.__controllers?.splice(this.__controllers.indexOf(controller) >>> 0, 1); | ||
} | ||
@@ -546,5 +521,5 @@ /** | ||
__saveInstanceProperties() { | ||
// Use forEach so this works even if for/of loops are compiled to for loops | ||
// expecting arrays | ||
this.constructor.elementProperties.forEach((_v, p) => { | ||
const elementProperties = this.constructor | ||
.elementProperties; | ||
for (const p of elementProperties.keys()) { | ||
if (this.hasOwnProperty(p)) { | ||
@@ -554,3 +529,3 @@ this.__instanceProperties.set(p, this[p]); | ||
} | ||
}); | ||
} | ||
} | ||
@@ -567,4 +542,4 @@ /** | ||
createRenderRoot() { | ||
var _a; | ||
const renderRoot = (_a = this.shadowRoot) !== null && _a !== void 0 ? _a : this.attachShadow(this.constructor.shadowRootOptions); | ||
const renderRoot = this.shadowRoot ?? | ||
this.attachShadow(this.constructor.shadowRootOptions); | ||
adoptStyles(renderRoot, this.constructor.elementStyles); | ||
@@ -579,3 +554,2 @@ return renderRoot; | ||
connectedCallback() { | ||
var _a; | ||
// create renderRoot before first update. | ||
@@ -586,3 +560,3 @@ if (this.renderRoot === undefined) { | ||
this.enableUpdating(true); | ||
(_a = this.__controllers) === null || _a === void 0 ? void 0 : _a.forEach((c) => { var _a; return (_a = c.hostConnected) === null || _a === void 0 ? void 0 : _a.call(c); }); | ||
this.__controllers?.forEach((c) => c.hostConnected?.()); | ||
} | ||
@@ -603,4 +577,3 @@ /** | ||
disconnectedCallback() { | ||
var _a; | ||
(_a = this.__controllers) === null || _a === void 0 ? void 0 : _a.forEach((c) => { var _a; return (_a = c.hostDisconnected) === null || _a === void 0 ? void 0 : _a.call(c); }); | ||
this.__controllers?.forEach((c) => c.hostDisconnected?.()); | ||
} | ||
@@ -623,6 +596,5 @@ /** | ||
__propertyToAttribute(name, value, options = defaultPropertyDeclaration) { | ||
var _a; | ||
const attr = this.constructor.__attributeNameForProperty(name, options); | ||
if (attr !== undefined && options.reflect === true) { | ||
const converter = ((_a = options.converter) === null || _a === void 0 ? void 0 : _a.toAttribute) !== | ||
const converter = options.converter?.toAttribute !== | ||
undefined | ||
@@ -661,3 +633,2 @@ ? options.converter | ||
_$attributeToProperty(name, value) { | ||
var _a; | ||
const ctor = this.constructor; | ||
@@ -673,3 +644,3 @@ // Note, hint this as an `AttributeMap` so closure clearly understands | ||
? { fromAttribute: options.converter } | ||
: ((_a = options.converter) === null || _a === void 0 ? void 0 : _a.fromAttribute) !== undefined | ||
: options.converter?.fromAttribute !== undefined | ||
? options.converter | ||
@@ -731,7 +702,2 @@ : defaultConverter; | ||
} | ||
// Note, since this no longer returns a promise, in dev mode we return a | ||
// thenable which warns if it's called. | ||
return DEV_MODE | ||
? requestUpdateThenable(this.localName) | ||
: undefined; | ||
} | ||
@@ -802,3 +768,2 @@ /** | ||
performUpdate() { | ||
var _a, _b; | ||
// Abort any update if one is not pending when this is called. | ||
@@ -810,3 +775,3 @@ // This can happen if `performUpdate` is called early to "flush" | ||
} | ||
debugLogEvent === null || debugLogEvent === void 0 ? void 0 : debugLogEvent({ kind: 'update' }); | ||
debugLogEvent?.({ kind: 'update' }); | ||
// create renderRoot before first update. | ||
@@ -817,5 +782,4 @@ if (!this.hasUpdated) { | ||
const shadowedProperties = []; | ||
(_a = this.constructor.__reactivePropertyKeys) === null || _a === void 0 ? void 0 : _a.forEach((p) => { | ||
var _a; | ||
if (this.hasOwnProperty(p) && !((_a = this.__instanceProperties) === null || _a === void 0 ? void 0 : _a.has(p))) { | ||
this.constructor.__reactivePropertyKeys?.forEach((p) => { | ||
if (this.hasOwnProperty(p) && !this.__instanceProperties?.has(p)) { | ||
shadowedProperties.push(p); | ||
@@ -836,9 +800,8 @@ } | ||
// Mixin instance properties once, if they exist. | ||
if (this.__instanceProperties) { | ||
// Use forEach so this works even if for/of loops are compiled to for loops | ||
// expecting arrays | ||
// eslint-disable-next-line @typescript-eslint/no-explicit-any | ||
this.__instanceProperties.forEach((v, p) => (this[p] = v)); | ||
this.__instanceProperties = undefined; | ||
} | ||
// The forEach() expression will only run when when __instanceProperties is | ||
// defined, and it returns undefined, setting __instanceProperties to | ||
// undefined | ||
this.__instanceProperties &&= this.__instanceProperties.forEach( | ||
// eslint-disable-next-line @typescript-eslint/no-explicit-any | ||
(v, p) => (this[p] = v)); | ||
let shouldUpdate = false; | ||
@@ -850,3 +813,3 @@ const changedProperties = this._$changedProperties; | ||
this.willUpdate(changedProperties); | ||
(_b = this.__controllers) === null || _b === void 0 ? void 0 : _b.forEach((c) => { var _a; return (_a = c.hostUpdate) === null || _a === void 0 ? void 0 : _a.call(c); }); | ||
this.__controllers?.forEach((c) => c.hostUpdate?.()); | ||
this.update(changedProperties); | ||
@@ -896,4 +859,3 @@ } | ||
_$didUpdate(changedProperties) { | ||
var _a; | ||
(_a = this.__controllers) === null || _a === void 0 ? void 0 : _a.forEach((c) => { var _a; return (_a = c.hostUpdated) === null || _a === void 0 ? void 0 : _a.call(c); }); | ||
this.__controllers?.forEach((c) => c.hostUpdated?.()); | ||
if (!this.hasUpdated) { | ||
@@ -984,8 +946,6 @@ this.hasUpdated = true; | ||
update(_changedProperties) { | ||
if (this.__reflectingProperties !== undefined) { | ||
// Use forEach so this works even if for/of loops are compiled to for | ||
// loops expecting arrays | ||
this.__reflectingProperties.forEach((v, k) => this.__propertyToAttribute(k, this[k], v)); | ||
this.__reflectingProperties = undefined; | ||
} | ||
// The forEach() expression will only run when when __reflectingProperties is | ||
// defined, and it returns undefined, setting __reflectingProperties to | ||
// undefined | ||
this.__reflectingProperties &&= this.__reflectingProperties.forEach((v, k) => this.__propertyToAttribute(k, this[k], v)); | ||
this.__markUpdated(); | ||
@@ -1022,7 +982,7 @@ } | ||
} | ||
_e = finalized; | ||
_a = finalized; | ||
/** | ||
* Marks class as having finished creating properties. | ||
*/ | ||
ReactiveElement[_e] = true; | ||
ReactiveElement[_a] = true; | ||
/** | ||
@@ -1053,4 +1013,5 @@ * Memoized list of all element properties, including any superclass properties. | ||
ReactiveElement.shadowRootOptions = { mode: 'open' }; | ||
export { ReactiveElement }; | ||
// Apply polyfills if available | ||
polyfillSupport === null || polyfillSupport === void 0 ? void 0 : polyfillSupport({ ReactiveElement }); | ||
polyfillSupport?.({ ReactiveElement }); | ||
// Dev mode warnings... | ||
@@ -1081,3 +1042,3 @@ if (DEV_MODE) { | ||
// This line will be used in regexes to search for ReactiveElement usage. | ||
((_d = global.reactiveElementVersions) !== null && _d !== void 0 ? _d : (global.reactiveElementVersions = [])).push('1.6.1'); | ||
(global.reactiveElementVersions ??= []).push('2.0.0-pre.0'); | ||
if (DEV_MODE && global.reactiveElementVersions.length > 1) { | ||
@@ -1084,0 +1045,0 @@ issueWarning('multiple-versions', `Multiple versions of Lit loaded. Loading multiple versions ` + |
@@ -6,3 +6,3 @@ /** | ||
*/ | ||
const t=globalThis,e=t.ShadowRoot&&(void 0===t.ShadyCSS||t.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,s=Symbol(),n=new WeakMap;class o{constructor(t,e,n){if(this._$cssResult$=!0,n!==s)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t,this.t=e}get styleSheet(){let t=this.o;const s=this.t;if(e&&void 0===t){const e=void 0!==s&&1===s.length;e&&(t=n.get(s)),void 0===t&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),e&&n.set(s,t))}return t}toString(){return this.cssText}}const r=t=>new o("string"==typeof t?t:t+"",void 0,s),i=(t,...e)=>{const n=1===t.length?t[0]:e.reduce(((e,s,n)=>e+(t=>{if(!0===t._$cssResult$)return t.cssText;if("number"==typeof t)return t;throw Error("Value passed to 'css' function must be a 'css' function result: "+t+". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.")})(s)+t[n+1]),t[0]);return new o(n,t,s)},S=(s,n)=>{e?s.adoptedStyleSheets=n.map((t=>t instanceof CSSStyleSheet?t:t.styleSheet)):n.forEach((e=>{const n=document.createElement("style"),o=t.litNonce;void 0!==o&&n.setAttribute("nonce",o),n.textContent=e.cssText,s.appendChild(n)}))},c=e||void 0===t.CSSStyleSheet?t=>t:t=>t instanceof CSSStyleSheet?(t=>{let e="";for(const s of t.cssRules)e+=s.cssText;return r(e)})(t):t;export{o as CSSResult,S as adoptStyles,i as css,c as getCompatibleStyle,e as supportsAdoptingStyleSheets,r as unsafeCSS}; | ||
const t=globalThis,e=t.ShadowRoot&&(void 0===t.ShadyCSS||t.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,s=Symbol(),o=new WeakMap;class n{constructor(t,e,o){if(this._$cssResult$=!0,o!==s)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t,this.t=e}get styleSheet(){let t=this.o;const s=this.t;if(e&&void 0===t){const e=void 0!==s&&1===s.length;e&&(t=o.get(s)),void 0===t&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),e&&o.set(s,t))}return t}toString(){return this.cssText}}const r=t=>new n("string"==typeof t?t:t+"",void 0,s),i=(t,...e)=>{const o=1===t.length?t[0]:e.reduce(((e,s,o)=>e+(t=>{if(!0===t._$cssResult$)return t.cssText;if("number"==typeof t)return t;throw Error("Value passed to 'css' function must be a 'css' function result: "+t+". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.")})(s)+t[o+1]),t[0]);return new n(o,t,s)},S=(s,o)=>{if(e)s.adoptedStyleSheets=o.map((t=>t instanceof CSSStyleSheet?t:t.styleSheet));else for(const e of o){const o=document.createElement("style"),n=t.litNonce;void 0!==n&&o.setAttribute("nonce",n),o.textContent=e.cssText,s.appendChild(o)}},c=e||void 0===t.CSSStyleSheet?t=>t:t=>t instanceof CSSStyleSheet?(t=>{let e="";for(const s of t.cssRules)e+=s.cssText;return r(e)})(t):t;export{n as CSSResult,S as adoptStyles,i as css,c as getCompatibleStyle,e as supportsAdoptingStyleSheets,r as unsafeCSS}; | ||
//# sourceMappingURL=css-tag.js.map |
@@ -6,3 +6,3 @@ /** | ||
*/ | ||
const e=(e,t,o)=>{Object.defineProperty(t,o,e)},t=(e,t)=>({kind:"method",placement:"prototype",key:t.key,descriptor:e}),o=({finisher:e,descriptor:t})=>(o,n)=>{var r;if(void 0===n){const n=null!==(r=o.originalKey)&&void 0!==r?r:o.key,i=null!=t?{kind:"method",placement:"prototype",key:n,descriptor:t(o.key)}:{...o,key:n};return null!=e&&(i.finisher=function(t){e(t,n)}),i}{const r=o.constructor;void 0!==t&&Object.defineProperty(o,n,t(n)),null==e||e(r,n)}};export{o as decorateProperty,e as legacyPrototypeMethod,t as standardPrototypeMethod}; | ||
const e=(e,t,o)=>{Object.defineProperty(t,o,e)},t=(e,t)=>({kind:"method",placement:"prototype",key:t.key,descriptor:e}),o=({finisher:e,descriptor:t})=>(o,n)=>{if(void 0===n){const n=o.originalKey??o.key,r=null!=t?{kind:"method",placement:"prototype",key:n,descriptor:t(o.key)}:{...o,key:n};return null!=e&&(r.finisher=function(t){e(t,n)}),r}{const r=o.constructor;void 0!==t&&Object.defineProperty(o,n,t(n)),e?.(r,n)}};export{o as decorateProperty,e as legacyPrototypeMethod,t as standardPrototypeMethod}; | ||
//# sourceMappingURL=base.js.map |
@@ -6,3 +6,3 @@ /** | ||
*/ | ||
const i=(i,e)=>"method"===e.kind&&e.descriptor&&!("value"in e.descriptor)?{...e,finisher(n){n.createProperty(e.key,i)}}:{kind:"field",key:Symbol(),placement:"own",descriptor:{},originalKey:e.key,initializer(){"function"==typeof e.initializer&&(this[e.key]=e.initializer.call(this))},finisher(n){n.createProperty(e.key,i)}};function e(e){return(n,t)=>void 0!==t?((i,e,n)=>{e.constructor.createProperty(n,i)})(e,n,t):i(e,n)}export{e as property}; | ||
const i=(i,e)=>"method"===e.kind&&e.descriptor&&!("value"in e.descriptor)?{...e,finisher(n){n.createProperty(e.key,i)}}:{kind:"field",key:Symbol(),placement:"own",descriptor:{},originalKey:e.key,initializer(){"function"==typeof e.initializer&&(this[e.key]=e.initializer.call(this))},finisher(n){n.createProperty(e.key,i)}},e=(i,e,n)=>{e.constructor.createProperty(n,i)};function n(n){return(t,o)=>void 0!==o?e(n,t,o):i(n,t)}export{n as property}; | ||
//# sourceMappingURL=property.js.map |
@@ -6,3 +6,3 @@ import{decorateProperty as r}from"./base.js"; | ||
* SPDX-License-Identifier: BSD-3-Clause | ||
*/function e(e){return r({descriptor:r=>({get(){var r,o;return null!==(o=null===(r=this.renderRoot)||void 0===r?void 0:r.querySelectorAll(e))&&void 0!==o?o:[]},enumerable:!0,configurable:!0})})}export{e as queryAll}; | ||
*/function e(e){return r({descriptor:r=>({get(){return this.renderRoot?.querySelectorAll(e)??[]},enumerable:!0,configurable:!0})})}export{e as queryAll}; | ||
//# sourceMappingURL=query-all.js.map |
@@ -1,2 +0,2 @@ | ||
import{decorateProperty as o}from"./base.js"; | ||
import{decorateProperty as e}from"./base.js"; | ||
/** | ||
@@ -6,3 +6,3 @@ * @license | ||
* SPDX-License-Identifier: BSD-3-Clause | ||
*/var l;const n=null!=(null===(l=globalThis.HTMLSlotElement)||void 0===l?void 0:l.prototype.assignedElements)?(o,l)=>o.assignedElements(l):(o,l)=>o.assignedNodes(l).filter((o=>o.nodeType===Node.ELEMENT_NODE));function e(l){const{slot:e,selector:t}=null!=l?l:{};return o({descriptor:o=>({get(){var o;const r="slot"+(e?`[name=${e}]`:":not([name])"),s=null===(o=this.renderRoot)||void 0===o?void 0:o.querySelector(r),i=null!=s?n(s,l):[];return t?i.filter((o=>o.matches(t))):i},enumerable:!0,configurable:!0})})}export{e as queryAssignedElements}; | ||
*/const o=null!=globalThis.HTMLSlotElement?.prototype.assignedElements?(e,o)=>e.assignedElements(o):(e,o)=>e.assignedNodes(o).filter((e=>e.nodeType===Node.ELEMENT_NODE));function t(t){const{slot:n,selector:r}=t??{};return e({descriptor:e=>({get(){const e="slot"+(n?`[name=${n}]`:":not([name])"),l=this.renderRoot?.querySelector(e),s=null!=l?o(l,t):[];return r?s.filter((e=>e.matches(r))):s},enumerable:!0,configurable:!0})})}export{t as queryAssignedElements}; | ||
//# sourceMappingURL=query-assigned-elements.js.map |
@@ -1,2 +0,2 @@ | ||
import{decorateProperty as e}from"./base.js";import{queryAssignedElements as t}from"./query-assigned-elements.js"; | ||
import{decorateProperty as e}from"./base.js"; | ||
/** | ||
@@ -6,3 +6,3 @@ * @license | ||
* SPDX-License-Identifier: BSD-3-Clause | ||
*/function o(o,n,r){let l,s=o;return"object"==typeof o?(s=o.slot,l=o):l={flatten:n},r?t({slot:s,flatten:n,selector:r}):e({descriptor:e=>({get(){var e,t;const o="slot"+(s?`[name=${s}]`:":not([name])"),n=null===(e=this.renderRoot)||void 0===e?void 0:e.querySelector(o);return null!==(t=null==n?void 0:n.assignedNodes(l))&&void 0!==t?t:[]},enumerable:!0,configurable:!0})})}export{o as queryAssignedNodes}; | ||
*/function t(t){const n=t?.slot,r=t;return e({descriptor:e=>({get(){const e="slot"+(n?`[name=${n}]`:":not([name])"),t=this.renderRoot?.querySelector(e);return t?.assignedNodes(r)??[]},enumerable:!0,configurable:!0})})}export{t as queryAssignedNodes}; | ||
//# sourceMappingURL=query-assigned-nodes.js.map |
@@ -7,3 +7,3 @@ import{decorateProperty as r}from"./base.js"; | ||
*/ | ||
function e(e){return r({descriptor:r=>({async get(){var r;return await this.updateComplete,null===(r=this.renderRoot)||void 0===r?void 0:r.querySelector(e)},enumerable:!0,configurable:!0})})}export{e as queryAsync}; | ||
function e(e){return r({descriptor:r=>({async get(){return await this.updateComplete,this.renderRoot?.querySelector(e)},enumerable:!0,configurable:!0})})}export{e as queryAsync}; | ||
//# sourceMappingURL=query-async.js.map |
@@ -1,2 +0,2 @@ | ||
import{decorateProperty as o}from"./base.js"; | ||
import{decorateProperty as t}from"./base.js"; | ||
/** | ||
@@ -6,3 +6,3 @@ * @license | ||
* SPDX-License-Identifier: BSD-3-Clause | ||
*/function i(i,n){return o({descriptor:o=>{const t={get(){var o,n;return null!==(n=null===(o=this.renderRoot)||void 0===o?void 0:o.querySelector(i))&&void 0!==n?n:null},enumerable:!0,configurable:!0};if(n){const n="symbol"==typeof o?Symbol():"__"+o;t.get=function(){var o,t;return void 0===this[n]&&(this[n]=null!==(t=null===(o=this.renderRoot)||void 0===o?void 0:o.querySelector(i))&&void 0!==t?t:null),this[n]}}return t}})}export{i as query}; | ||
*/function r(r,n){return t({descriptor:t=>{const e={get(){return this.renderRoot?.querySelector(r)??null},enumerable:!0,configurable:!0};if(n){const t=Symbol();e.get=function(){return void 0===this[t]&&(this[t]=this.renderRoot?.querySelector(r)??null),this[t]}}return e}})}export{r as query}; | ||
//# sourceMappingURL=query.js.map |
@@ -6,3 +6,4 @@ /** | ||
*/ | ||
const global = globalThis ; | ||
// Allows minifiers to rename references to globalThis | ||
const global = globalThis; | ||
/** | ||
@@ -109,3 +110,3 @@ * Whether the current browser supports `adoptedStyleSheets`. | ||
else { | ||
styles.forEach((s) => { | ||
for (const s of styles) { | ||
const style = document.createElement('style'); | ||
@@ -119,3 +120,3 @@ // eslint-disable-next-line @typescript-eslint/no-explicit-any | ||
renderRoot.appendChild(style); | ||
}); | ||
} | ||
} | ||
@@ -122,0 +123,0 @@ }; |
@@ -32,3 +32,2 @@ /** | ||
) => { | ||
var _a; | ||
// TypeScript / Babel legacy mode | ||
@@ -41,3 +40,3 @@ if (name !== undefined) { | ||
} | ||
finisher === null || finisher === void 0 ? void 0 : finisher(ctor, name); | ||
finisher?.(ctor, name); | ||
// Babel standard mode | ||
@@ -50,3 +49,4 @@ } | ||
// eslint-disable-next-line @typescript-eslint/no-explicit-any | ||
(_a = protoOrDescriptor.originalKey) !== null && _a !== void 0 ? _a : protoOrDescriptor.key; | ||
protoOrDescriptor.originalKey ?? | ||
protoOrDescriptor.key; | ||
const info = descriptor != undefined | ||
@@ -53,0 +53,0 @@ ? { |
@@ -36,4 +36,3 @@ import { decorateProperty } from './base.js'; | ||
get() { | ||
var _a, _b; | ||
return (_b = (_a = this.renderRoot) === null || _a === void 0 ? void 0 : _a.querySelectorAll(selector)) !== null && _b !== void 0 ? _b : []; | ||
return this.renderRoot?.querySelectorAll(selector) ?? []; | ||
}, | ||
@@ -40,0 +39,0 @@ enumerable: true, |
@@ -8,8 +8,6 @@ import { decorateProperty } from './base.js'; | ||
*/ | ||
var _a; | ||
const global = globalThis ; | ||
/** | ||
* A tiny module scoped polyfill for HTMLSlotElement.assignedElements. | ||
*/ | ||
const slotAssignedElements = ((_a = global.HTMLSlotElement) === null || _a === void 0 ? void 0 : _a.prototype.assignedElements) != null | ||
const slotAssignedElements = globalThis.HTMLSlotElement?.prototype.assignedElements != null | ||
? (slot, opts) => slot.assignedElements(opts) | ||
@@ -49,9 +47,8 @@ : (slot, opts) => slot | ||
function queryAssignedElements(options) { | ||
const { slot, selector } = options !== null && options !== void 0 ? options : {}; | ||
const { slot, selector } = options ?? {}; | ||
return decorateProperty({ | ||
descriptor: (_name) => ({ | ||
get() { | ||
var _a; | ||
const slotSelector = `slot${slot ? `[name=${slot}]` : ':not([name])'}`; | ||
const slotEl = (_a = this.renderRoot) === null || _a === void 0 ? void 0 : _a.querySelector(slotSelector); | ||
const slotEl = this.renderRoot?.querySelector(slotSelector); | ||
const elements = slotEl != null ? slotAssignedElements(slotEl, options) : []; | ||
@@ -58,0 +55,0 @@ if (selector) { |
import { decorateProperty } from './base.js'; | ||
import { queryAssignedElements } from './query-assigned-elements.js'; | ||
@@ -9,29 +8,37 @@ /** | ||
*/ | ||
function queryAssignedNodes(slotOrOptions, flatten, selector) { | ||
// Normalize the overloaded arguments. | ||
let slot = slotOrOptions; | ||
let assignedNodesOptions; | ||
if (typeof slotOrOptions === 'object') { | ||
slot = slotOrOptions.slot; | ||
assignedNodesOptions = slotOrOptions; | ||
} | ||
else { | ||
assignedNodesOptions = { flatten }; | ||
} | ||
// For backwards compatibility, queryAssignedNodes with a selector behaves | ||
// exactly like queryAssignedElements with a selector. | ||
if (selector) { | ||
return queryAssignedElements({ | ||
slot: slot, | ||
flatten, | ||
selector, | ||
}); | ||
} | ||
/** | ||
* A property decorator that converts a class property into a getter that | ||
* returns the `assignedNodes` of the given `slot`. | ||
* | ||
* Can be passed an optional {@linkcode QueryAssignedNodesOptions} object. | ||
* | ||
* Example usage: | ||
* ```ts | ||
* class MyElement { | ||
* @queryAssignedNodes({slot: 'list', flatten: true}) | ||
* listItems!: Array<Node>; | ||
* | ||
* render() { | ||
* return html` | ||
* <slot name="list"></slot> | ||
* `; | ||
* } | ||
* } | ||
* ``` | ||
* | ||
* Note the type of this property should be annotated as `Array<Node>`. Use the | ||
* queryAssignedElements decorator to list only elements, and optionally filter | ||
* the element list using a CSS selector. | ||
* | ||
* @category Decorator | ||
*/ | ||
function queryAssignedNodes(options) { | ||
const slot = options?.slot; | ||
const assignedNodesOptions = options; | ||
return decorateProperty({ | ||
descriptor: (_name) => ({ | ||
get() { | ||
var _a, _b; | ||
const slotSelector = `slot${slot ? `[name=${slot}]` : ':not([name])'}`; | ||
const slotEl = (_a = this.renderRoot) === null || _a === void 0 ? void 0 : _a.querySelector(slotSelector); | ||
return (_b = slotEl === null || slotEl === void 0 ? void 0 : slotEl.assignedNodes(assignedNodesOptions)) !== null && _b !== void 0 ? _b : []; | ||
const slotEl = this.renderRoot?.querySelector(slotSelector); | ||
return slotEl?.assignedNodes(assignedNodesOptions) ?? []; | ||
}, | ||
@@ -38,0 +45,0 @@ enumerable: true, |
@@ -49,5 +49,4 @@ import { decorateProperty } from './base.js'; | ||
async get() { | ||
var _a; | ||
await this.updateComplete; | ||
return (_a = this.renderRoot) === null || _a === void 0 ? void 0 : _a.querySelector(selector); | ||
return this.renderRoot?.querySelector(selector); | ||
}, | ||
@@ -54,0 +53,0 @@ enumerable: true, |
@@ -38,4 +38,3 @@ import { decorateProperty } from './base.js'; | ||
get() { | ||
var _a, _b; | ||
return (_b = (_a = this.renderRoot) === null || _a === void 0 ? void 0 : _a.querySelector(selector)) !== null && _b !== void 0 ? _b : null; | ||
return this.renderRoot?.querySelector(selector) ?? null; | ||
}, | ||
@@ -46,7 +45,9 @@ enumerable: true, | ||
if (cache) { | ||
const key = typeof name === 'symbol' ? Symbol() : `__${name}`; | ||
const key = Symbol(`${String(name)} (@query() cache)`) | ||
; | ||
descriptor.get = function () { | ||
var _a, _b; | ||
if (this[key] === undefined) { | ||
this[key] = (_b = (_a = this.renderRoot) === null || _a === void 0 ? void 0 : _a.querySelector(selector)) !== null && _b !== void 0 ? _b : null; | ||
if (this[key] === | ||
undefined) { | ||
this[key] = | ||
this.renderRoot?.querySelector(selector) ?? null; | ||
} | ||
@@ -53,0 +54,0 @@ return this[key]; |
@@ -10,9 +10,8 @@ import { customElements, HTMLElement } from '@lit-labs/ssr-dom-shim'; | ||
*/ | ||
var _a, _b, _c, _d; | ||
var _e; | ||
const global = globalThis ; | ||
var _a; | ||
// Lets a minifier replace globalThis references with a minified name | ||
const global = globalThis; | ||
{ | ||
(_a = global.customElements) !== null && _a !== void 0 ? _a : (global.customElements = customElements); | ||
global.customElements ??= customElements; | ||
} | ||
let requestUpdateThenable; | ||
let issueWarning; | ||
@@ -33,3 +32,4 @@ const trustedTypes = global | ||
// are loaded. | ||
const issuedWarnings = ((_b = global.litIssuedWarnings) !== null && _b !== void 0 ? _b : (global.litIssuedWarnings = new Set())); | ||
const issuedWarnings = (global.litIssuedWarnings ??= | ||
new Set()); | ||
// Issue a warning, if we haven't already. | ||
@@ -45,15 +45,6 @@ issueWarning = (code, warning) => { | ||
// Issue polyfill support warning. | ||
if (((_c = global.ShadyDOM) === null || _c === void 0 ? void 0 : _c.inUse) && polyfillSupport === undefined) { | ||
if (global.ShadyDOM?.inUse && polyfillSupport === undefined) { | ||
issueWarning('polyfill-support-missing', `Shadow DOM is being polyfilled via \`ShadyDOM\` but ` + | ||
`the \`polyfill-support\` module has not been loaded.`); | ||
} | ||
requestUpdateThenable = (name) => ({ | ||
then: (onfulfilled, _onrejected) => { | ||
issueWarning('request-update-promise', `The \`requestUpdate\` method should no longer return a Promise but ` + | ||
`does so on \`${name}\`. Use \`updateComplete\` instead.`); | ||
if (onfulfilled !== undefined) { | ||
onfulfilled(false); | ||
} | ||
}, | ||
}); | ||
} | ||
@@ -163,23 +154,2 @@ /** | ||
extends (globalThis.HTMLElement ?? HTMLElement) { | ||
constructor() { | ||
super(); | ||
this.__instanceProperties = new Map(); | ||
/** | ||
* True if there is a pending update as a result of calling `requestUpdate()`. | ||
* Should only be read. | ||
* @category updates | ||
*/ | ||
this.isUpdatePending = false; | ||
/** | ||
* Is set to `true` after the first update. The element code cannot assume | ||
* that `renderRoot` exists before the element `hasUpdated`. | ||
* @category updates | ||
*/ | ||
this.hasUpdated = false; | ||
/** | ||
* Name of currently reflecting property | ||
*/ | ||
this.__reflectingProperty = null; | ||
this._initialize(); | ||
} | ||
/** | ||
@@ -219,5 +189,4 @@ * Adds an initializer function to the class that is called during instance | ||
static addInitializer(initializer) { | ||
var _a; | ||
this.finalize(); | ||
((_a = this._initializers) !== null && _a !== void 0 ? _a : (this._initializers = [])).push(initializer); | ||
(this._initializers ??= []).push(initializer); | ||
} | ||
@@ -233,5 +202,3 @@ /** | ||
const attributes = []; | ||
// Use forEach so this works even if for/of loops are compiled to for loops | ||
// expecting arrays | ||
this.elementProperties.forEach((v, p) => { | ||
for (const [p, v] of this.elementProperties) { | ||
const attr = this.__attributeNameForProperty(p, v); | ||
@@ -242,3 +209,3 @@ if (attr !== undefined) { | ||
} | ||
}); | ||
} | ||
return attributes; | ||
@@ -272,3 +239,2 @@ } | ||
static createProperty(name, options = defaultPropertyDeclaration) { | ||
var _a; | ||
// if this is a state property, force the attribute to false. | ||
@@ -290,3 +256,6 @@ if (options.state) { | ||
if (!options.noAccessor && !this.prototype.hasOwnProperty(name)) { | ||
const key = typeof name === 'symbol' ? Symbol() : `__${name}`; | ||
const key = // Use Symbol.for in dev mode to make it easier to maintain state | ||
// when doing HMR. | ||
Symbol.for(`${String(name)} (@property() cache)`) | ||
; | ||
const descriptor = this.getPropertyDescriptor(name, key, options); | ||
@@ -299,3 +268,3 @@ if (descriptor !== undefined) { | ||
if (!this.hasOwnProperty('__reactivePropertyKeys')) { | ||
this.__reactivePropertyKeys = new Set((_a = this.__reactivePropertyKeys) !== null && _a !== void 0 ? _a : []); | ||
this.__reactivePropertyKeys = new Set(this.__reactivePropertyKeys ?? []); | ||
} | ||
@@ -409,15 +378,2 @@ this.__reactivePropertyKeys.add(name); | ||
this.elementStyles = this.finalizeStyles(this.styles); | ||
// DEV mode warnings | ||
{ | ||
const warnRemovedOrRenamed = (name, renamed = false) => { | ||
if (this.prototype.hasOwnProperty(name)) { | ||
issueWarning(renamed ? 'renamed-api' : 'removed-api', `\`${name}\` is implemented on class ${this.name}. It ` + | ||
`has been ${renamed ? 'renamed' : 'removed'} ` + | ||
`in this version of LitElement.`); | ||
} | ||
}; | ||
warnRemovedOrRenamed('initialize'); | ||
warnRemovedOrRenamed('requestUpdateInternal'); | ||
warnRemovedOrRenamed('_getUpdateComplete', true); | ||
} | ||
return true; | ||
@@ -470,2 +426,23 @@ } | ||
} | ||
constructor() { | ||
super(); | ||
this.__instanceProperties = new Map(); | ||
/** | ||
* True if there is a pending update as a result of calling `requestUpdate()`. | ||
* Should only be read. | ||
* @category updates | ||
*/ | ||
this.isUpdatePending = false; | ||
/** | ||
* Is set to `true` after the first update. The element code cannot assume | ||
* that `renderRoot` exists before the element `hasUpdated`. | ||
* @category updates | ||
*/ | ||
this.hasUpdated = false; | ||
/** | ||
* Name of currently reflecting property | ||
*/ | ||
this.__reflectingProperty = null; | ||
this._initialize(); | ||
} | ||
/** | ||
@@ -478,3 +455,2 @@ * Internal only override point for customizing work done when elements | ||
_initialize() { | ||
var _a; | ||
this.__updatePromise = new Promise((res) => (this.enableUpdating = res)); | ||
@@ -486,3 +462,3 @@ this._$changedProperties = new Map(); | ||
this.requestUpdate(); | ||
(_a = this.constructor._initializers) === null || _a === void 0 ? void 0 : _a.forEach((i) => i(this)); | ||
this.constructor._initializers?.forEach((i) => i(this)); | ||
} | ||
@@ -499,4 +475,3 @@ /** | ||
addController(controller) { | ||
var _a, _b; | ||
((_a = this.__controllers) !== null && _a !== void 0 ? _a : (this.__controllers = [])).push(controller); | ||
(this.__controllers ??= []).push(controller); | ||
// If a controller is added after the element has been connected, | ||
@@ -507,3 +482,3 @@ // call hostConnected. Note, re-using existence of `renderRoot` here | ||
if (this.renderRoot !== undefined && this.isConnected) { | ||
(_b = controller.hostConnected) === null || _b === void 0 ? void 0 : _b.call(controller); | ||
controller.hostConnected?.(); | ||
} | ||
@@ -516,6 +491,5 @@ } | ||
removeController(controller) { | ||
var _a; | ||
// Note, if the indexOf is -1, the >>> will flip the sign which makes the | ||
// splice do nothing. | ||
(_a = this.__controllers) === null || _a === void 0 ? void 0 : _a.splice(this.__controllers.indexOf(controller) >>> 0, 1); | ||
this.__controllers?.splice(this.__controllers.indexOf(controller) >>> 0, 1); | ||
} | ||
@@ -535,5 +509,5 @@ /** | ||
__saveInstanceProperties() { | ||
// Use forEach so this works even if for/of loops are compiled to for loops | ||
// expecting arrays | ||
this.constructor.elementProperties.forEach((_v, p) => { | ||
const elementProperties = this.constructor | ||
.elementProperties; | ||
for (const p of elementProperties.keys()) { | ||
if (this.hasOwnProperty(p)) { | ||
@@ -543,3 +517,3 @@ this.__instanceProperties.set(p, this[p]); | ||
} | ||
}); | ||
} | ||
} | ||
@@ -556,4 +530,4 @@ /** | ||
createRenderRoot() { | ||
var _a; | ||
const renderRoot = (_a = this.shadowRoot) !== null && _a !== void 0 ? _a : this.attachShadow(this.constructor.shadowRootOptions); | ||
const renderRoot = this.shadowRoot ?? | ||
this.attachShadow(this.constructor.shadowRootOptions); | ||
adoptStyles(renderRoot, this.constructor.elementStyles); | ||
@@ -568,3 +542,2 @@ return renderRoot; | ||
connectedCallback() { | ||
var _a; | ||
// create renderRoot before first update. | ||
@@ -575,3 +548,3 @@ if (this.renderRoot === undefined) { | ||
this.enableUpdating(true); | ||
(_a = this.__controllers) === null || _a === void 0 ? void 0 : _a.forEach((c) => { var _a; return (_a = c.hostConnected) === null || _a === void 0 ? void 0 : _a.call(c); }); | ||
this.__controllers?.forEach((c) => c.hostConnected?.()); | ||
} | ||
@@ -592,4 +565,3 @@ /** | ||
disconnectedCallback() { | ||
var _a; | ||
(_a = this.__controllers) === null || _a === void 0 ? void 0 : _a.forEach((c) => { var _a; return (_a = c.hostDisconnected) === null || _a === void 0 ? void 0 : _a.call(c); }); | ||
this.__controllers?.forEach((c) => c.hostDisconnected?.()); | ||
} | ||
@@ -612,6 +584,5 @@ /** | ||
__propertyToAttribute(name, value, options = defaultPropertyDeclaration) { | ||
var _a; | ||
const attr = this.constructor.__attributeNameForProperty(name, options); | ||
if (attr !== undefined && options.reflect === true) { | ||
const converter = ((_a = options.converter) === null || _a === void 0 ? void 0 : _a.toAttribute) !== | ||
const converter = options.converter?.toAttribute !== | ||
undefined | ||
@@ -649,3 +620,2 @@ ? options.converter | ||
_$attributeToProperty(name, value) { | ||
var _a; | ||
const ctor = this.constructor; | ||
@@ -661,3 +631,3 @@ // Note, hint this as an `AttributeMap` so closure clearly understands | ||
? { fromAttribute: options.converter } | ||
: ((_a = options.converter) === null || _a === void 0 ? void 0 : _a.fromAttribute) !== undefined | ||
: options.converter?.fromAttribute !== undefined | ||
? options.converter | ||
@@ -719,6 +689,2 @@ : defaultConverter; | ||
} | ||
// Note, since this no longer returns a promise, in dev mode we return a | ||
// thenable which warns if it's called. | ||
return requestUpdateThenable(this.localName) | ||
; | ||
} | ||
@@ -789,3 +755,2 @@ /** | ||
performUpdate() { | ||
var _a, _b; | ||
// Abort any update if one is not pending when this is called. | ||
@@ -797,3 +762,3 @@ // This can happen if `performUpdate` is called early to "flush" | ||
} | ||
debugLogEvent === null || debugLogEvent === void 0 ? void 0 : debugLogEvent({ kind: 'update' }); | ||
debugLogEvent?.({ kind: 'update' }); | ||
// create renderRoot before first update. | ||
@@ -804,5 +769,4 @@ if (!this.hasUpdated) { | ||
const shadowedProperties = []; | ||
(_a = this.constructor.__reactivePropertyKeys) === null || _a === void 0 ? void 0 : _a.forEach((p) => { | ||
var _a; | ||
if (this.hasOwnProperty(p) && !((_a = this.__instanceProperties) === null || _a === void 0 ? void 0 : _a.has(p))) { | ||
this.constructor.__reactivePropertyKeys?.forEach((p) => { | ||
if (this.hasOwnProperty(p) && !this.__instanceProperties?.has(p)) { | ||
shadowedProperties.push(p); | ||
@@ -823,9 +787,8 @@ } | ||
// Mixin instance properties once, if they exist. | ||
if (this.__instanceProperties) { | ||
// Use forEach so this works even if for/of loops are compiled to for loops | ||
// expecting arrays | ||
// eslint-disable-next-line @typescript-eslint/no-explicit-any | ||
this.__instanceProperties.forEach((v, p) => (this[p] = v)); | ||
this.__instanceProperties = undefined; | ||
} | ||
// The forEach() expression will only run when when __instanceProperties is | ||
// defined, and it returns undefined, setting __instanceProperties to | ||
// undefined | ||
this.__instanceProperties &&= this.__instanceProperties.forEach( | ||
// eslint-disable-next-line @typescript-eslint/no-explicit-any | ||
(v, p) => (this[p] = v)); | ||
let shouldUpdate = false; | ||
@@ -837,3 +800,3 @@ const changedProperties = this._$changedProperties; | ||
this.willUpdate(changedProperties); | ||
(_b = this.__controllers) === null || _b === void 0 ? void 0 : _b.forEach((c) => { var _a; return (_a = c.hostUpdate) === null || _a === void 0 ? void 0 : _a.call(c); }); | ||
this.__controllers?.forEach((c) => c.hostUpdate?.()); | ||
this.update(changedProperties); | ||
@@ -883,4 +846,3 @@ } | ||
_$didUpdate(changedProperties) { | ||
var _a; | ||
(_a = this.__controllers) === null || _a === void 0 ? void 0 : _a.forEach((c) => { var _a; return (_a = c.hostUpdated) === null || _a === void 0 ? void 0 : _a.call(c); }); | ||
this.__controllers?.forEach((c) => c.hostUpdated?.()); | ||
if (!this.hasUpdated) { | ||
@@ -970,8 +932,6 @@ this.hasUpdated = true; | ||
update(_changedProperties) { | ||
if (this.__reflectingProperties !== undefined) { | ||
// Use forEach so this works even if for/of loops are compiled to for | ||
// loops expecting arrays | ||
this.__reflectingProperties.forEach((v, k) => this.__propertyToAttribute(k, this[k], v)); | ||
this.__reflectingProperties = undefined; | ||
} | ||
// The forEach() expression will only run when when __reflectingProperties is | ||
// defined, and it returns undefined, setting __reflectingProperties to | ||
// undefined | ||
this.__reflectingProperties &&= this.__reflectingProperties.forEach((v, k) => this.__propertyToAttribute(k, this[k], v)); | ||
this.__markUpdated(); | ||
@@ -1008,7 +968,7 @@ } | ||
} | ||
_e = finalized; | ||
_a = finalized; | ||
/** | ||
* Marks class as having finished creating properties. | ||
*/ | ||
ReactiveElement[_e] = true; | ||
ReactiveElement[_a] = true; | ||
/** | ||
@@ -1040,3 +1000,3 @@ * Memoized list of all element properties, including any superclass properties. | ||
// Apply polyfills if available | ||
polyfillSupport === null || polyfillSupport === void 0 ? void 0 : polyfillSupport({ ReactiveElement }); | ||
polyfillSupport?.({ ReactiveElement }); | ||
// Dev mode warnings... | ||
@@ -1067,3 +1027,3 @@ { | ||
// This line will be used in regexes to search for ReactiveElement usage. | ||
((_d = global.reactiveElementVersions) !== null && _d !== void 0 ? _d : (global.reactiveElementVersions = [])).push('1.6.1'); | ||
(global.reactiveElementVersions ??= []).push('2.0.0-pre.0'); | ||
if (global.reactiveElementVersions.length > 1) { | ||
@@ -1070,0 +1030,0 @@ issueWarning('multiple-versions', `Multiple versions of Lit loaded. Loading multiple versions ` + |
@@ -1,2 +0,2 @@ | ||
import{customElements as t,HTMLElement as i}from"@lit-labs/ssr-dom-shim";import{getCompatibleStyle as s,adoptStyles as e}from"./css-tag.js";export{CSSResult,adoptStyles,css,getCompatibleStyle,supportsAdoptingStyleSheets,unsafeCSS}from"./css-tag.js"; | ||
import{customElements as t,HTMLElement as s}from"@lit-labs/ssr-dom-shim";import{getCompatibleStyle as i,adoptStyles as e}from"./css-tag.js";export{CSSResult,adoptStyles,css,getCompatibleStyle,supportsAdoptingStyleSheets,unsafeCSS}from"./css-tag.js"; | ||
/** | ||
@@ -6,3 +6,3 @@ * @license | ||
* SPDX-License-Identifier: BSD-3-Clause | ||
*/var r,h;const o=globalThis;null!==(r=o.customElements)&&void 0!==r||(o.customElements=t);const n=o.trustedTypes,l=n?n.emptyScript:"",a=o.reactiveElementPolyfillSupport,d={toAttribute(t,i){switch(i){case Boolean:t=t?l:null;break;case Object:case Array:t=null==t?t:JSON.stringify(t)}return t},fromAttribute(t,i){let s=t;switch(i){case Boolean:s=null!==t;break;case Number:s=null===t?null:Number(t);break;case Object:case Array:try{s=JSON.parse(t)}catch(t){s=null}}return s}},u=(t,i)=>i!==t&&(i==i||t==t),c={attribute:!0,type:String,converter:d,reflect:!1,hasChanged:u};class v extends(globalThis.HTMLElement??i){constructor(){super(),this._$Ei=new Map,this.isUpdatePending=!1,this.hasUpdated=!1,this._$El=null,this.u()}static addInitializer(t){var i;this.finalize(),(null!==(i=this.h)&&void 0!==i?i:this.h=[]).push(t)}static get observedAttributes(){this.finalize();const t=[];return this.elementProperties.forEach(((i,s)=>{const e=this._$Ep(s,i);void 0!==e&&(this._$Ev.set(e,s),t.push(e))})),t}static createProperty(t,i=c){if(i.state&&(i.attribute=!1),this.finalize(),this.elementProperties.set(t,i),!i.noAccessor&&!this.prototype.hasOwnProperty(t)){const s="symbol"==typeof t?Symbol():"__"+t,e=this.getPropertyDescriptor(t,s,i);void 0!==e&&Object.defineProperty(this.prototype,t,e)}}static getPropertyDescriptor(t,i,s){return{get(){return this[i]},set(e){const r=this[t];this[i]=e,this.requestUpdate(t,r,s)},configurable:!0,enumerable:!0}}static getPropertyOptions(t){return this.elementProperties.get(t)||c}static finalize(){if(this.hasOwnProperty("finalized"))return!1;this.finalized=!0;const t=Object.getPrototypeOf(this);if(t.finalize(),void 0!==t.h&&(this.h=[...t.h]),this.elementProperties=new Map(t.elementProperties),this._$Ev=new Map,this.hasOwnProperty("properties")){const t=this.properties,i=[...Object.getOwnPropertyNames(t),...Object.getOwnPropertySymbols(t)];for(const s of i)this.createProperty(s,t[s])}return this.elementStyles=this.finalizeStyles(this.styles),!0}static finalizeStyles(t){const i=[];if(Array.isArray(t)){const e=new Set(t.flat(1/0).reverse());for(const t of e)i.unshift(s(t))}else void 0!==t&&i.push(s(t));return i}static _$Ep(t,i){const s=i.attribute;return!1===s?void 0:"string"==typeof s?s:"string"==typeof t?t.toLowerCase():void 0}u(){var t;this._$E_=new Promise((t=>this.enableUpdating=t)),this._$AL=new Map,this._$Eg(),this.requestUpdate(),null===(t=this.constructor.h)||void 0===t||t.forEach((t=>t(this)))}addController(t){var i,s;(null!==(i=this._$ES)&&void 0!==i?i:this._$ES=[]).push(t),void 0!==this.renderRoot&&this.isConnected&&(null===(s=t.hostConnected)||void 0===s||s.call(t))}removeController(t){var i;null===(i=this._$ES)||void 0===i||i.splice(this._$ES.indexOf(t)>>>0,1)}_$Eg(){this.constructor.elementProperties.forEach(((t,i)=>{this.hasOwnProperty(i)&&(this._$Ei.set(i,this[i]),delete this[i])}))}createRenderRoot(){var t;const i=null!==(t=this.shadowRoot)&&void 0!==t?t:this.attachShadow(this.constructor.shadowRootOptions);return e(i,this.constructor.elementStyles),i}connectedCallback(){var t;void 0===this.renderRoot&&(this.renderRoot=this.createRenderRoot()),this.enableUpdating(!0),null===(t=this._$ES)||void 0===t||t.forEach((t=>{var i;return null===(i=t.hostConnected)||void 0===i?void 0:i.call(t)}))}enableUpdating(t){}disconnectedCallback(){var t;null===(t=this._$ES)||void 0===t||t.forEach((t=>{var i;return null===(i=t.hostDisconnected)||void 0===i?void 0:i.call(t)}))}attributeChangedCallback(t,i,s){this._$AK(t,s)}_$EO(t,i,s=c){var e;const r=this.constructor._$Ep(t,s);if(void 0!==r&&!0===s.reflect){const h=(void 0!==(null===(e=s.converter)||void 0===e?void 0:e.toAttribute)?s.converter:d).toAttribute(i,s.type);this._$El=t,null==h?this.removeAttribute(r):this.setAttribute(r,h),this._$El=null}}_$AK(t,i){var s;const e=this.constructor,r=e._$Ev.get(t);if(void 0!==r&&this._$El!==r){const t=e.getPropertyOptions(r),h="function"==typeof t.converter?{fromAttribute:t.converter}:void 0!==(null===(s=t.converter)||void 0===s?void 0:s.fromAttribute)?t.converter:d;this._$El=r,this[r]=h.fromAttribute(i,t.type),this._$El=null}}requestUpdate(t,i,s){let e=!0;void 0!==t&&(((s=s||this.constructor.getPropertyOptions(t)).hasChanged||u)(this[t],i)?(this._$AL.has(t)||this._$AL.set(t,i),!0===s.reflect&&this._$El!==t&&(void 0===this._$EC&&(this._$EC=new Map),this._$EC.set(t,s))):e=!1),!this.isUpdatePending&&e&&(this._$E_=this._$Ej())}async _$Ej(){this.isUpdatePending=!0;try{await this._$E_}catch(t){Promise.reject(t)}const t=this.scheduleUpdate();return null!=t&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){var t;if(!this.isUpdatePending)return;this.hasUpdated,this._$Ei&&(this._$Ei.forEach(((t,i)=>this[i]=t)),this._$Ei=void 0);let i=!1;const s=this._$AL;try{i=this.shouldUpdate(s),i?(this.willUpdate(s),null===(t=this._$ES)||void 0===t||t.forEach((t=>{var i;return null===(i=t.hostUpdate)||void 0===i?void 0:i.call(t)})),this.update(s)):this._$Ek()}catch(t){throw i=!1,this._$Ek(),t}i&&this._$AE(s)}willUpdate(t){}_$AE(t){var i;null===(i=this._$ES)||void 0===i||i.forEach((t=>{var i;return null===(i=t.hostUpdated)||void 0===i?void 0:i.call(t)})),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(t)),this.updated(t)}_$Ek(){this._$AL=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$E_}shouldUpdate(t){return!0}update(t){void 0!==this._$EC&&(this._$EC.forEach(((t,i)=>this._$EO(i,this[i],t))),this._$EC=void 0),this._$Ek()}updated(t){}firstUpdated(t){}}v.finalized=!0,v.elementProperties=new Map,v.elementStyles=[],v.shadowRootOptions={mode:"open"},null==a||a({ReactiveElement:v}),(null!==(h=o.reactiveElementVersions)&&void 0!==h?h:o.reactiveElementVersions=[]).push("1.6.1");export{v as ReactiveElement,d as defaultConverter,u as notEqual}; | ||
*/const h=globalThis;h.customElements??=t;const r=h.trustedTypes,o=r?r.emptyScript:"",n=h.reactiveElementPolyfillSupport,a={toAttribute(t,s){switch(s){case Boolean:t=t?o:null;break;case Object:case Array:t=null==t?t:JSON.stringify(t)}return t},fromAttribute(t,s){let i=t;switch(s){case Boolean:i=null!==t;break;case Number:i=null===t?null:Number(t);break;case Object:case Array:try{i=JSON.parse(t)}catch(t){i=null}}return i}},c=(t,s)=>s!==t&&(s==s||t==t),l={attribute:!0,type:String,converter:a,reflect:!1,hasChanged:c},u="finalized";class d extends(globalThis.HTMLElement??s){static addInitializer(t){this.finalize(),(this.i??=[]).push(t)}static get observedAttributes(){this.finalize();const t=[];for(const[s,i]of this.elementProperties){const e=this._$El(s,i);void 0!==e&&(this._$Eh.set(e,s),t.push(e))}return t}static createProperty(t,s=l){if(s.state&&(s.attribute=!1),this.finalize(),this.elementProperties.set(t,s),!s.noAccessor&&!this.prototype.hasOwnProperty(t)){const i=Symbol(),e=this.getPropertyDescriptor(t,i,s);void 0!==e&&Object.defineProperty(this.prototype,t,e)}}static getPropertyDescriptor(t,s,i){return{get(){return this[s]},set(e){const h=this[t];this[s]=e,this.requestUpdate(t,h,i)},configurable:!0,enumerable:!0}}static getPropertyOptions(t){return this.elementProperties.get(t)||l}static finalize(){if(this.hasOwnProperty(u))return!1;this[u]=!0;const t=Object.getPrototypeOf(this);if(t.finalize(),void 0!==t.i&&(this.i=[...t.i]),this.elementProperties=new Map(t.elementProperties),this._$Eh=new Map,this.hasOwnProperty("properties")){const t=this.properties,s=[...Object.getOwnPropertyNames(t),...Object.getOwnPropertySymbols(t)];for(const i of s)this.createProperty(i,t[i])}return this.elementStyles=this.finalizeStyles(this.styles),!0}static finalizeStyles(t){const s=[];if(Array.isArray(t)){const e=new Set(t.flat(1/0).reverse());for(const t of e)s.unshift(i(t))}else void 0!==t&&s.push(i(t));return s}static _$El(t,s){const i=s.attribute;return!1===i?void 0:"string"==typeof i?i:"string"==typeof t?t.toLowerCase():void 0}constructor(){super(),this._$Ep=new Map,this.isUpdatePending=!1,this.hasUpdated=!1,this._$Em=null,this.v()}v(){this._$E_=new Promise((t=>this.enableUpdating=t)),this._$AL=new Map,this._$Eg(),this.requestUpdate(),this.constructor.i?.forEach((t=>t(this)))}addController(t){(this._$ES??=[]).push(t),void 0!==this.renderRoot&&this.isConnected&&t.hostConnected?.()}removeController(t){this._$ES?.splice(this._$ES.indexOf(t)>>>0,1)}_$Eg(){const t=this.constructor.elementProperties;for(const s of t.keys())this.hasOwnProperty(s)&&(this._$Ep.set(s,this[s]),delete this[s])}createRenderRoot(){const t=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return e(t,this.constructor.elementStyles),t}connectedCallback(){void 0===this.renderRoot&&(this.renderRoot=this.createRenderRoot()),this.enableUpdating(!0),this._$ES?.forEach((t=>t.hostConnected?.()))}enableUpdating(t){}disconnectedCallback(){this._$ES?.forEach((t=>t.hostDisconnected?.()))}attributeChangedCallback(t,s,i){this._$AK(t,i)}_$EO(t,s,i=l){const e=this.constructor._$El(t,i);if(void 0!==e&&!0===i.reflect){const h=(void 0!==i.converter?.toAttribute?i.converter:a).toAttribute(s,i.type);this._$Em=t,null==h?this.removeAttribute(e):this.setAttribute(e,h),this._$Em=null}}_$AK(t,s){const i=this.constructor,e=i._$Eh.get(t);if(void 0!==e&&this._$Em!==e){const t=i.getPropertyOptions(e),h="function"==typeof t.converter?{fromAttribute:t.converter}:void 0!==t.converter?.fromAttribute?t.converter:a;this._$Em=e,this[e]=h.fromAttribute(s,t.type),this._$Em=null}}requestUpdate(t,s,i){let e=!0;void 0!==t&&(((i=i||this.constructor.getPropertyOptions(t)).hasChanged||c)(this[t],s)?(this._$AL.has(t)||this._$AL.set(t,s),!0===i.reflect&&this._$Em!==t&&(void 0===this._$EC&&(this._$EC=new Map),this._$EC.set(t,i))):e=!1),!this.isUpdatePending&&e&&(this._$E_=this._$Ej())}async _$Ej(){this.isUpdatePending=!0;try{await this._$E_}catch(t){Promise.reject(t)}const t=this.scheduleUpdate();return null!=t&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){if(!this.isUpdatePending)return;this.hasUpdated,this._$Ep&&=this._$Ep.forEach(((t,s)=>this[s]=t));let t=!1;const s=this._$AL;try{t=this.shouldUpdate(s),t?(this.willUpdate(s),this._$ES?.forEach((t=>t.hostUpdate?.())),this.update(s)):this._$Ek()}catch(s){throw t=!1,this._$Ek(),s}t&&this._$AE(s)}willUpdate(t){}_$AE(t){this._$ES?.forEach((t=>t.hostUpdated?.())),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(t)),this.updated(t)}_$Ek(){this._$AL=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$E_}shouldUpdate(t){return!0}update(t){this._$EC&&=this._$EC.forEach(((t,s)=>this._$EO(s,this[s],t))),this._$Ek()}updated(t){}firstUpdated(t){}}d[u]=!0,d.elementProperties=new Map,d.elementStyles=[],d.shadowRootOptions={mode:"open"},n?.({ReactiveElement:d}),(h.reactiveElementVersions??=[]).push("2.0.0-pre.0");export{d as ReactiveElement,a as defaultConverter,c as notEqual}; | ||
//# sourceMappingURL=reactive-element.js.map |
{ | ||
"name": "@lit/reactive-element", | ||
"version": "1.6.1", | ||
"version": "2.0.0-pre.0", | ||
"publishConfig": { | ||
@@ -187,2 +187,3 @@ "access": "public" | ||
"dependencies": [ | ||
"../labs/testing:build:ts:utils", | ||
"../labs/ssr-dom-shim:build:ts" | ||
@@ -359,3 +360,3 @@ ], | ||
"dependencies": { | ||
"@lit-labs/ssr-dom-shim": "^1.0.0" | ||
"@lit-labs/ssr-dom-shim": "^1.1.2-pre.0" | ||
}, | ||
@@ -368,6 +369,6 @@ "devDependencies": { | ||
"@babel/plugin-transform-typescript": "^7.14.6", | ||
"@lit-internal/scripts": "^1.0.1-pre.0", | ||
"@webcomponents/shadycss": "^1.8.0", | ||
"@webcomponents/template": "^1.4.4", | ||
"@webcomponents/webcomponentsjs": "^2.6.0", | ||
"@lit-internal/scripts": "^1.0.0" | ||
"@webcomponents/webcomponentsjs": "^2.8.0" | ||
}, | ||
@@ -374,0 +375,0 @@ "typings": "reactive-element.d.ts", |
@@ -56,3 +56,3 @@ /** | ||
} | ||
declare type AttributeConverter<Type = unknown, TypeHint = unknown> = ComplexAttributeConverter<Type> | ((value: string | null, type?: TypeHint) => Type); | ||
type AttributeConverter<Type = unknown, TypeHint = unknown> = ComplexAttributeConverter<Type> | ((value: string | null, type?: TypeHint) => Type); | ||
/** | ||
@@ -129,3 +129,3 @@ * Defines options for a property accessor. | ||
} | ||
declare type PropertyDeclarationMap = Map<PropertyKey, PropertyDeclaration>; | ||
type PropertyDeclarationMap = Map<PropertyKey, PropertyDeclaration>; | ||
/** | ||
@@ -142,3 +142,3 @@ * A Map of property keys to values. | ||
*/ | ||
export declare type PropertyValues<T = any> = T extends object ? PropertyValueMap<T> : Map<PropertyKey, unknown>; | ||
export type PropertyValues<T = any> = T extends object ? PropertyValueMap<T> : Map<PropertyKey, unknown>; | ||
/** | ||
@@ -172,4 +172,4 @@ * Do not use, instead prefer {@linkcode PropertyValues}. | ||
*/ | ||
export declare type WarningKind = 'change-in-update' | 'migration'; | ||
export declare type Initializer = (element: ReactiveElement) => void; | ||
export type WarningKind = 'change-in-update' | 'migration'; | ||
export type Initializer = (element: ReactiveElement) => void; | ||
/** | ||
@@ -176,0 +176,0 @@ * Base element class which manages element properties and attributes. When |
@@ -1,2 +0,2 @@ | ||
import{getCompatibleStyle as t,adoptStyles as i}from"./css-tag.js";export{CSSResult,adoptStyles,css,getCompatibleStyle,supportsAdoptingStyleSheets,unsafeCSS}from"./css-tag.js"; | ||
import{getCompatibleStyle as t,adoptStyles as s}from"./css-tag.js";export{CSSResult,adoptStyles,css,getCompatibleStyle,supportsAdoptingStyleSheets,unsafeCSS}from"./css-tag.js"; | ||
/** | ||
@@ -6,3 +6,3 @@ * @license | ||
* SPDX-License-Identifier: BSD-3-Clause | ||
*/var s;const e=window,r=e.trustedTypes,h=r?r.emptyScript:"",o=e.reactiveElementPolyfillSupport,n={toAttribute(t,i){switch(i){case Boolean:t=t?h:null;break;case Object:case Array:t=null==t?t:JSON.stringify(t)}return t},fromAttribute(t,i){let s=t;switch(i){case Boolean:s=null!==t;break;case Number:s=null===t?null:Number(t);break;case Object:case Array:try{s=JSON.parse(t)}catch(t){s=null}}return s}},a=(t,i)=>i!==t&&(i==i||t==t),l={attribute:!0,type:String,converter:n,reflect:!1,hasChanged:a};class d extends HTMLElement{constructor(){super(),this._$Ei=new Map,this.isUpdatePending=!1,this.hasUpdated=!1,this._$El=null,this.u()}static addInitializer(t){var i;this.finalize(),(null!==(i=this.h)&&void 0!==i?i:this.h=[]).push(t)}static get observedAttributes(){this.finalize();const t=[];return this.elementProperties.forEach(((i,s)=>{const e=this._$Ep(s,i);void 0!==e&&(this._$Ev.set(e,s),t.push(e))})),t}static createProperty(t,i=l){if(i.state&&(i.attribute=!1),this.finalize(),this.elementProperties.set(t,i),!i.noAccessor&&!this.prototype.hasOwnProperty(t)){const s="symbol"==typeof t?Symbol():"__"+t,e=this.getPropertyDescriptor(t,s,i);void 0!==e&&Object.defineProperty(this.prototype,t,e)}}static getPropertyDescriptor(t,i,s){return{get(){return this[i]},set(e){const r=this[t];this[i]=e,this.requestUpdate(t,r,s)},configurable:!0,enumerable:!0}}static getPropertyOptions(t){return this.elementProperties.get(t)||l}static finalize(){if(this.hasOwnProperty("finalized"))return!1;this.finalized=!0;const t=Object.getPrototypeOf(this);if(t.finalize(),void 0!==t.h&&(this.h=[...t.h]),this.elementProperties=new Map(t.elementProperties),this._$Ev=new Map,this.hasOwnProperty("properties")){const t=this.properties,i=[...Object.getOwnPropertyNames(t),...Object.getOwnPropertySymbols(t)];for(const s of i)this.createProperty(s,t[s])}return this.elementStyles=this.finalizeStyles(this.styles),!0}static finalizeStyles(i){const s=[];if(Array.isArray(i)){const e=new Set(i.flat(1/0).reverse());for(const i of e)s.unshift(t(i))}else void 0!==i&&s.push(t(i));return s}static _$Ep(t,i){const s=i.attribute;return!1===s?void 0:"string"==typeof s?s:"string"==typeof t?t.toLowerCase():void 0}u(){var t;this._$E_=new Promise((t=>this.enableUpdating=t)),this._$AL=new Map,this._$Eg(),this.requestUpdate(),null===(t=this.constructor.h)||void 0===t||t.forEach((t=>t(this)))}addController(t){var i,s;(null!==(i=this._$ES)&&void 0!==i?i:this._$ES=[]).push(t),void 0!==this.renderRoot&&this.isConnected&&(null===(s=t.hostConnected)||void 0===s||s.call(t))}removeController(t){var i;null===(i=this._$ES)||void 0===i||i.splice(this._$ES.indexOf(t)>>>0,1)}_$Eg(){this.constructor.elementProperties.forEach(((t,i)=>{this.hasOwnProperty(i)&&(this._$Ei.set(i,this[i]),delete this[i])}))}createRenderRoot(){var t;const s=null!==(t=this.shadowRoot)&&void 0!==t?t:this.attachShadow(this.constructor.shadowRootOptions);return i(s,this.constructor.elementStyles),s}connectedCallback(){var t;void 0===this.renderRoot&&(this.renderRoot=this.createRenderRoot()),this.enableUpdating(!0),null===(t=this._$ES)||void 0===t||t.forEach((t=>{var i;return null===(i=t.hostConnected)||void 0===i?void 0:i.call(t)}))}enableUpdating(t){}disconnectedCallback(){var t;null===(t=this._$ES)||void 0===t||t.forEach((t=>{var i;return null===(i=t.hostDisconnected)||void 0===i?void 0:i.call(t)}))}attributeChangedCallback(t,i,s){this._$AK(t,s)}_$EO(t,i,s=l){var e;const r=this.constructor._$Ep(t,s);if(void 0!==r&&!0===s.reflect){const h=(void 0!==(null===(e=s.converter)||void 0===e?void 0:e.toAttribute)?s.converter:n).toAttribute(i,s.type);this._$El=t,null==h?this.removeAttribute(r):this.setAttribute(r,h),this._$El=null}}_$AK(t,i){var s;const e=this.constructor,r=e._$Ev.get(t);if(void 0!==r&&this._$El!==r){const t=e.getPropertyOptions(r),h="function"==typeof t.converter?{fromAttribute:t.converter}:void 0!==(null===(s=t.converter)||void 0===s?void 0:s.fromAttribute)?t.converter:n;this._$El=r,this[r]=h.fromAttribute(i,t.type),this._$El=null}}requestUpdate(t,i,s){let e=!0;void 0!==t&&(((s=s||this.constructor.getPropertyOptions(t)).hasChanged||a)(this[t],i)?(this._$AL.has(t)||this._$AL.set(t,i),!0===s.reflect&&this._$El!==t&&(void 0===this._$EC&&(this._$EC=new Map),this._$EC.set(t,s))):e=!1),!this.isUpdatePending&&e&&(this._$E_=this._$Ej())}async _$Ej(){this.isUpdatePending=!0;try{await this._$E_}catch(t){Promise.reject(t)}const t=this.scheduleUpdate();return null!=t&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){var t;if(!this.isUpdatePending)return;this.hasUpdated,this._$Ei&&(this._$Ei.forEach(((t,i)=>this[i]=t)),this._$Ei=void 0);let i=!1;const s=this._$AL;try{i=this.shouldUpdate(s),i?(this.willUpdate(s),null===(t=this._$ES)||void 0===t||t.forEach((t=>{var i;return null===(i=t.hostUpdate)||void 0===i?void 0:i.call(t)})),this.update(s)):this._$Ek()}catch(t){throw i=!1,this._$Ek(),t}i&&this._$AE(s)}willUpdate(t){}_$AE(t){var i;null===(i=this._$ES)||void 0===i||i.forEach((t=>{var i;return null===(i=t.hostUpdated)||void 0===i?void 0:i.call(t)})),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(t)),this.updated(t)}_$Ek(){this._$AL=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$E_}shouldUpdate(t){return!0}update(t){void 0!==this._$EC&&(this._$EC.forEach(((t,i)=>this._$EO(i,this[i],t))),this._$EC=void 0),this._$Ek()}updated(t){}firstUpdated(t){}}d.finalized=!0,d.elementProperties=new Map,d.elementStyles=[],d.shadowRootOptions={mode:"open"},null==o||o({ReactiveElement:d}),(null!==(s=e.reactiveElementVersions)&&void 0!==s?s:e.reactiveElementVersions=[]).push("1.6.1");export{d as ReactiveElement,n as defaultConverter,a as notEqual}; | ||
*/const i=globalThis,e=i.trustedTypes,h=e?e.emptyScript:"",r=i.reactiveElementPolyfillSupport,o={toAttribute(t,s){switch(s){case Boolean:t=t?h:null;break;case Object:case Array:t=null==t?t:JSON.stringify(t)}return t},fromAttribute(t,s){let i=t;switch(s){case Boolean:i=null!==t;break;case Number:i=null===t?null:Number(t);break;case Object:case Array:try{i=JSON.parse(t)}catch(t){i=null}}return i}},n=(t,s)=>s!==t&&(s==s||t==t),a={attribute:!0,type:String,converter:o,reflect:!1,hasChanged:n},c="finalized";class l extends HTMLElement{static addInitializer(t){this.finalize(),(this.i??=[]).push(t)}static get observedAttributes(){this.finalize();const t=[];for(const[s,i]of this.elementProperties){const e=this._$El(s,i);void 0!==e&&(this._$Eh.set(e,s),t.push(e))}return t}static createProperty(t,s=a){if(s.state&&(s.attribute=!1),this.finalize(),this.elementProperties.set(t,s),!s.noAccessor&&!this.prototype.hasOwnProperty(t)){const i=Symbol(),e=this.getPropertyDescriptor(t,i,s);void 0!==e&&Object.defineProperty(this.prototype,t,e)}}static getPropertyDescriptor(t,s,i){return{get(){return this[s]},set(e){const h=this[t];this[s]=e,this.requestUpdate(t,h,i)},configurable:!0,enumerable:!0}}static getPropertyOptions(t){return this.elementProperties.get(t)||a}static finalize(){if(this.hasOwnProperty(c))return!1;this[c]=!0;const t=Object.getPrototypeOf(this);if(t.finalize(),void 0!==t.i&&(this.i=[...t.i]),this.elementProperties=new Map(t.elementProperties),this._$Eh=new Map,this.hasOwnProperty("properties")){const t=this.properties,s=[...Object.getOwnPropertyNames(t),...Object.getOwnPropertySymbols(t)];for(const i of s)this.createProperty(i,t[i])}return this.elementStyles=this.finalizeStyles(this.styles),!0}static finalizeStyles(s){const i=[];if(Array.isArray(s)){const e=new Set(s.flat(1/0).reverse());for(const s of e)i.unshift(t(s))}else void 0!==s&&i.push(t(s));return i}static _$El(t,s){const i=s.attribute;return!1===i?void 0:"string"==typeof i?i:"string"==typeof t?t.toLowerCase():void 0}constructor(){super(),this._$Ep=new Map,this.isUpdatePending=!1,this.hasUpdated=!1,this._$Em=null,this.v()}v(){this._$E_=new Promise((t=>this.enableUpdating=t)),this._$AL=new Map,this._$Eg(),this.requestUpdate(),this.constructor.i?.forEach((t=>t(this)))}addController(t){(this._$ES??=[]).push(t),void 0!==this.renderRoot&&this.isConnected&&t.hostConnected?.()}removeController(t){this._$ES?.splice(this._$ES.indexOf(t)>>>0,1)}_$Eg(){const t=this.constructor.elementProperties;for(const s of t.keys())this.hasOwnProperty(s)&&(this._$Ep.set(s,this[s]),delete this[s])}createRenderRoot(){const t=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return s(t,this.constructor.elementStyles),t}connectedCallback(){void 0===this.renderRoot&&(this.renderRoot=this.createRenderRoot()),this.enableUpdating(!0),this._$ES?.forEach((t=>t.hostConnected?.()))}enableUpdating(t){}disconnectedCallback(){this._$ES?.forEach((t=>t.hostDisconnected?.()))}attributeChangedCallback(t,s,i){this._$AK(t,i)}_$EO(t,s,i=a){const e=this.constructor._$El(t,i);if(void 0!==e&&!0===i.reflect){const h=(void 0!==i.converter?.toAttribute?i.converter:o).toAttribute(s,i.type);this._$Em=t,null==h?this.removeAttribute(e):this.setAttribute(e,h),this._$Em=null}}_$AK(t,s){const i=this.constructor,e=i._$Eh.get(t);if(void 0!==e&&this._$Em!==e){const t=i.getPropertyOptions(e),h="function"==typeof t.converter?{fromAttribute:t.converter}:void 0!==t.converter?.fromAttribute?t.converter:o;this._$Em=e,this[e]=h.fromAttribute(s,t.type),this._$Em=null}}requestUpdate(t,s,i){let e=!0;void 0!==t&&(((i=i||this.constructor.getPropertyOptions(t)).hasChanged||n)(this[t],s)?(this._$AL.has(t)||this._$AL.set(t,s),!0===i.reflect&&this._$Em!==t&&(void 0===this._$EC&&(this._$EC=new Map),this._$EC.set(t,i))):e=!1),!this.isUpdatePending&&e&&(this._$E_=this._$Ej())}async _$Ej(){this.isUpdatePending=!0;try{await this._$E_}catch(t){Promise.reject(t)}const t=this.scheduleUpdate();return null!=t&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){if(!this.isUpdatePending)return;this.hasUpdated,this._$Ep&&=this._$Ep.forEach(((t,s)=>this[s]=t));let t=!1;const s=this._$AL;try{t=this.shouldUpdate(s),t?(this.willUpdate(s),this._$ES?.forEach((t=>t.hostUpdate?.())),this.update(s)):this._$Ek()}catch(s){throw t=!1,this._$Ek(),s}t&&this._$AE(s)}willUpdate(t){}_$AE(t){this._$ES?.forEach((t=>t.hostUpdated?.())),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(t)),this.updated(t)}_$Ek(){this._$AL=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$E_}shouldUpdate(t){return!0}update(t){this._$EC&&=this._$EC.forEach(((t,s)=>this._$EO(s,this[s],t))),this._$Ek()}updated(t){}firstUpdated(t){}}l[c]=!0,l.elementProperties=new Map,l.elementStyles=[],l.shadowRootOptions={mode:"open"},r?.({ReactiveElement:l}),(i.reactiveElementVersions??=[]).push("2.0.0-pre.0");export{l as ReactiveElement,o as defaultConverter,n as notEqual}; | ||
//# sourceMappingURL=reactive-element.js.map |
# ReactiveElement 1.0 | ||
[![Build Status](https://github.com/lit/lit/workflows/Tests/badge.svg)](https://github.com/lit/lit/actions?query=workflow%3ATests) | ||
[![Published on npm](https://img.shields.io/npm/v/lit-element/next-major)](https://www.npmjs.com/package/lit-html) | ||
[![Join our Slack](https://img.shields.io/badge/slack-join%20chat-4a154b.svg)](https://www.polymer-project.org/slack-invite) | ||
[![Published on npm](https://img.shields.io/npm/v/@lit/reactive-element?logo=npm)](https://www.npmjs.com/package/@lit/reactive-element) | ||
[![Join our Discord](https://img.shields.io/badge/discord-join%20chat-5865F2.svg?logo=discord&logoColor=fff)](https://lit.dev/discord/) | ||
[![Mentioned in Awesome Lit](https://awesome.re/mentioned-badge.svg)](https://github.com/web-padawan/awesome-lit) | ||
@@ -14,4 +14,16 @@ | ||
This is a stable release of `@lit/reactive-element` 1.0.0 (part of the Lit 2.0 release). If upgrading from previous versions of `UpdatingElement`, please see the [Upgrade Guide](https://lit.dev/docs/releases/upgrade/). | ||
This is a pre-release of Lit 3.0, the next major version of Lit. | ||
Lit 3.0 has very few breaking changes from Lit 2.0: | ||
- Drops support for IE11 | ||
- Published as ES2021 | ||
- Removes a couple of deprecated Lit 1.x APIs | ||
Lit 3.0 should require no changes to upgrade from Lit 2.0 for the vast majority of users. Once the full release is published, most apps and libraries will be able to extend their npm version ranges to include both 2.x and 3.x, like `"^2.7.0 || ^3.0.0"`. | ||
Lit 2.x and 3.0 are _interoperable_: templates, base classes, directives, decorators, etc., from one version of Lit will work with those from another. | ||
Please file any issues you find on our [issue tracker](https://github.com/lit/lit/issues). | ||
## Documentation | ||
@@ -18,0 +30,0 @@ |
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
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
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
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
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
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
No v1
QualityPackage is not semver >=1. This means it is not stable and does not support ^ ranges.
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
104
750451
6283
1