lit-element - npm Package Compare versions

Comparing version 3.0.0-rc.4 to 3.0.0

development/lit-element.d.ts

@@ -89,2 +89,19 @@ /**
     /**
+     * Invoked when the component is added to the document's DOM.
+     *
+     * In `connectedCallback()` you should setup tasks that should only occur when
+     * the element is connected to the document. The most common of these is
+     * adding event listeners to nodes external to the element, like a keydown
+     * event handler added to the window.
+     *
+     * ```ts
+     * connectedCallback() {
+     *   super.connectedCallback();
+     *   addEventListener('keydown', this._handleKeydown);
+     * }
+     * ```
+     *
+     * Typically, anything done in `connectedCallback()` should be undone when the
+     * element is disconnected, in `disconnectedCallback()`.
+     *
      * @category lifecycle
@@ -94,2 +111,18 @@ */
     /**
+     * Invoked when the component is removed from the document's DOM.
+     *
+     * This callback is the main signal to the element that it may no longer be
+     * used. `disconnectedCallback()` should ensure that nothing is holding a
+     * reference to the element (such as event listeners added to nodes external
+     * to the element), so that it is free to be garbage collected.
+     *
+     * ```ts
+     * disconnectedCallback() {
+     *   super.disconnectedCallback();
+     *   window.removeEventListener('keydown', this._handleKeydown);
+     * }
+     * ```
+     *
+     * An element may be re-connected after being disconnected.
+     *
      * @category lifecycle
@@ -96,0 +129,0 @@ */

development/lit-element.js

@@ -122,2 +122,19 @@ /**
     /**
+     * Invoked when the component is added to the document's DOM.
+     *
+     * In `connectedCallback()` you should setup tasks that should only occur when
+     * the element is connected to the document. The most common of these is
+     * adding event listeners to nodes external to the element, like a keydown
+     * event handler added to the window.
+     *
+     * ```ts
+     * connectedCallback() {
+     *   super.connectedCallback();
+     *   addEventListener('keydown', this._handleKeydown);
+     * }
+     * ```
+     *
+     * Typically, anything done in `connectedCallback()` should be undone when the
+     * element is disconnected, in `disconnectedCallback()`.
+     *
      * @category lifecycle
@@ -131,2 +148,18 @@ */
     /**
+     * Invoked when the component is removed from the document's DOM.
+     *
+     * This callback is the main signal to the element that it may no longer be
+     * used. `disconnectedCallback()` should ensure that nothing is holding a
+     * reference to the element (such as event listeners added to nodes external
+     * to the element), so that it is free to be garbage collected.
+     *
+     * ```ts
+     * disconnectedCallback() {
+     *   super.disconnectedCallback();
+     *   window.removeEventListener('keydown', this._handleKeydown);
+     * }
+     * ```
+     *
+     * An element may be re-connected after being disconnected.
+     *
      * @category lifecycle
@@ -163,3 +196,5 @@ */
 // Apply polyfills if available
-(_c = globalThis.litElementPlatformSupport) === null || _c === void 0 ? void 0 : _c.call(globalThis, { LitElement });
+(_c = globalThis[`litElementPolyfillSupport${DEV_MODE ? `DevMode` : ``}`]) === null || _c === void 0 ? void 0 : _c.call(globalThis, {
+    LitElement,
+});
 // DEV mode warnings
@@ -220,3 +255,3 @@ if (DEV_MODE) {
 // TODO(justinfagnani): inject version number at build time
-((_d = globalThis.litElementVersions) !== null && _d !== void 0 ? _d : (globalThis.litElementVersions = [])).push('3.0.0-rc.4');
+((_d = globalThis.litElementVersions) !== null && _d !== void 0 ? _d : (globalThis.litElementVersions = [])).push('3.0.0');
 if (DEV_MODE && globalThis.litElementVersions.length > 1) {
@@ -223,0 +258,0 @@ issueWarning('multiple-versions', `Multiple versions of Lit loaded. Loading multiple versions ` +

development/polyfill-support.js

@@ -7,2 +7,3 @@ /**
 var _a;
+var _b;
 /**
@@ -27,3 +28,7 @@ * LitElement patch to support browsers without native web components.
 import 'lit-html/polyfill-support.js';
-(_a = globalThis.litElementPlatformSupport) !== null && _a !== void 0 ? _a : (globalThis.litElementPlatformSupport = function (_a) {
+// Note, explicitly use `var` here so that this can be re-defined when
+// bundled.
+// eslint-disable-next-line no-var
+var DEV_MODE = true;
+(_a = globalThis[_b = "litElementPolyfillSupport" + (DEV_MODE ? "DevMode" : "")]) !== null && _a !== void 0 ? _a : (globalThis[_b] = function (_a) {
     var LitElement = _a.LitElement;
@@ -30,0 +35,0 @@ // polyfill-support is only needed if ShadyCSS or the ApplyShim is in use

lit-element.d.ts

@@ -89,2 +89,19 @@ /**
     /**
+     * Invoked when the component is added to the document's DOM.
+     *
+     * In `connectedCallback()` you should setup tasks that should only occur when
+     * the element is connected to the document. The most common of these is
+     * adding event listeners to nodes external to the element, like a keydown
+     * event handler added to the window.
+     *
+     * ```ts
+     * connectedCallback() {
+     *   super.connectedCallback();
+     *   addEventListener('keydown', this._handleKeydown);
+     * }
+     * ```
+     *
+     * Typically, anything done in `connectedCallback()` should be undone when the
+     * element is disconnected, in `disconnectedCallback()`.
+     *
      * @category lifecycle
@@ -94,2 +111,18 @@ */
     /**
+     * Invoked when the component is removed from the document's DOM.
+     *
+     * This callback is the main signal to the element that it may no longer be
+     * used. `disconnectedCallback()` should ensure that nothing is holding a
+     * reference to the element (such as event listeners added to nodes external
+     * to the element), so that it is free to be garbage collected.
+     *
+     * ```ts
+     * disconnectedCallback() {
+     *   super.disconnectedCallback();
+     *   window.removeEventListener('keydown', this._handleKeydown);
+     * }
+     * ```
+     *
+     * An element may be re-connected after being disconnected.
+     *
      * @category lifecycle
@@ -96,0 +129,0 @@ */

lit-element.js

@@ -6,3 +6,3 @@ import{ReactiveElement as t}from"@lit/reactive-element";export*from"@lit/reactive-element";import{render as e,noChange as i}from"lit-html";export*from"lit-html";
  * SPDX-License-Identifier: BSD-3-Clause
- */var l,o,r;const s=t;class n extends t{constructor(){super(...arguments),this.renderOptions={host:this},this._$Dt=void 0}createRenderRoot(){var t,e;const i=super.createRenderRoot();return null!==(t=(e=this.renderOptions).renderBefore)&&void 0!==t||(e.renderBefore=i.firstChild),i}update(t){const i=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this._$Dt=e(i,this.renderRoot,this.renderOptions)}connectedCallback(){var t;super.connectedCallback(),null===(t=this._$Dt)||void 0===t||t.setConnected(!0)}disconnectedCallback(){var t;super.disconnectedCallback(),null===(t=this._$Dt)||void 0===t||t.setConnected(!1)}render(){return i}}n.finalized=!0,n._$litElement$=!0,null===(l=globalThis.litElementHydrateSupport)||void 0===l||l.call(globalThis,{LitElement:n}),null===(o=globalThis.litElementPlatformSupport)||void 0===o||o.call(globalThis,{LitElement:n});const h={_$AK:(t,e,i)=>{t._$AK(e,i)},_$AL:t=>t._$AL};(null!==(r=globalThis.litElementVersions)&&void 0!==r?r:globalThis.litElementVersions=[]).push("3.0.0-rc.4");export{n as LitElement,s as UpdatingElement,h as _$LE};
+ */var l,o,r;const s=t;class n extends t{constructor(){super(...arguments),this.renderOptions={host:this},this._$Dt=void 0}createRenderRoot(){var t,e;const i=super.createRenderRoot();return null!==(t=(e=this.renderOptions).renderBefore)&&void 0!==t||(e.renderBefore=i.firstChild),i}update(t){const i=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this._$Dt=e(i,this.renderRoot,this.renderOptions)}connectedCallback(){var t;super.connectedCallback(),null===(t=this._$Dt)||void 0===t||t.setConnected(!0)}disconnectedCallback(){var t;super.disconnectedCallback(),null===(t=this._$Dt)||void 0===t||t.setConnected(!1)}render(){return i}}n.finalized=!0,n._$litElement$=!0,null===(l=globalThis.litElementHydrateSupport)||void 0===l||l.call(globalThis,{LitElement:n}),null===(o=globalThis.litElementPolyfillSupport)||void 0===o||o.call(globalThis,{LitElement:n});const h={_$AK:(t,e,i)=>{t._$AK(e,i)},_$AL:t=>t._$AL};(null!==(r=globalThis.litElementVersions)&&void 0!==r?r:globalThis.litElementVersions=[]).push("3.0.0");export{n as LitElement,s as UpdatingElement,h as _$LE};
 //# sourceMappingURL=lit-element.js.map

package.json

 {
   "name": "lit-element",
-  "version": "3.0.0-rc.4",
+  "version": "3.0.0",
   "publishConfig": {
@@ -110,4 +110,4 @@ "access": "public"
   "dependencies": {
-    "@lit/reactive-element": "^1.0.0-rc.2",
-    "lit-html": "^2.0.0-rc.4"
+    "@lit/reactive-element": "^1.0.0",
+    "lit-html": "^2.0.0"
   },
@@ -114,0 +114,0 @@ "devDependencies": {

polyfill-support.js

@@ -7,3 +7,3 @@ !function(i){"function"==typeof define&&define.amd?define(i):i()}((function(){"use strict";var i,n;i=function(){
           */
-var i,n="__scoped";null!==(i=globalThis.reactiveElementPlatformSupport)&&void 0!==i||(globalThis.reactiveElementPlatformSupport=function(i){var o=i.ReactiveElement;if(void 0!==window.ShadyCSS&&(!window.ShadyCSS.nativeShadow||window.ShadyCSS.ApplyShim)){var t=o.prototype;window.ShadyDOM&&window.ShadyDOM.inUse&&!0===window.ShadyDOM.noPatch&&window.ShadyDOM.patchElementProto(t);var d=t.createRenderRoot;t.createRenderRoot=function(){var i,o,t,e=this.localName;if(window.ShadyCSS.nativeShadow)return d.call(this);if(!this.constructor.hasOwnProperty(n)){this.constructor[n]=!0;var u=this.constructor.elementStyles.map((function(i){return i instanceof CSSStyleSheet?Array.from(i.cssRules).reduce((function(i,n){return i+n.cssText}),""):i.cssText}));null===(o=null===(i=window.ShadyCSS)||void 0===i?void 0:i.ScopingShim)||void 0===o||o.prepareAdoptedCssText(u,e),void 0===this.constructor._$AJ&&window.ShadyCSS.prepareTemplateStyles(document.createElement("template"),e)}return null!==(t=this.shadowRoot)&&void 0!==t?t:this.attachShadow(this.constructor.shadowRootOptions)};var e=t.connectedCallback;t.connectedCallback=function(){e.call(this),this.hasUpdated&&window.ShadyCSS.styleElement(this)};var u=t._$AE;t._$AE=function(i){this.hasUpdated||window.ShadyCSS.styleElement(this),u.call(this,i)}}})},"function"==typeof define&&define.amd?define(i):i(),function(i){"function"==typeof define&&define.amd?define(i):i()}((function(){
+var i,n="__scoped";null!==(i=globalThis.reactiveElementPolyfillSupport)&&void 0!==i||(globalThis.reactiveElementPolyfillSupport=function(i){var o=i.ReactiveElement;if(void 0!==window.ShadyCSS&&(!window.ShadyCSS.nativeShadow||window.ShadyCSS.ApplyShim)){var t=o.prototype;window.ShadyDOM&&window.ShadyDOM.inUse&&!0===window.ShadyDOM.noPatch&&window.ShadyDOM.patchElementProto(t);var d=t.createRenderRoot;t.createRenderRoot=function(){var i,o,t,e=this.localName;if(window.ShadyCSS.nativeShadow)return d.call(this);if(!this.constructor.hasOwnProperty(n)){this.constructor[n]=!0;var u=this.constructor.elementStyles.map((function(i){return i instanceof CSSStyleSheet?Array.from(i.cssRules).reduce((function(i,n){return i+n.cssText}),""):i.cssText}));null===(o=null===(i=window.ShadyCSS)||void 0===i?void 0:i.ScopingShim)||void 0===o||o.prepareAdoptedCssText(u,e),void 0===this.constructor._$AJ&&window.ShadyCSS.prepareTemplateStyles(document.createElement("template"),e)}return null!==(t=this.shadowRoot)&&void 0!==t?t:this.attachShadow(this.constructor.shadowRootOptions)};var e=t.connectedCallback;t.connectedCallback=function(){e.call(this),this.hasUpdated&&window.ShadyCSS.styleElement(this)};var u=t._$AE;t._$AE=function(i){this.hasUpdated||window.ShadyCSS.styleElement(this),u.call(this,i)}}})},"function"==typeof define&&define.amd?define(i):i(),function(i){"function"==typeof define&&define.amd?define(i):i()}((function(){
 /**
@@ -14,3 +14,3 @@ * @license
           */
-var i,n=new Set,o=new Map;null!==(i=globalThis.litHtmlPlatformSupport)&&void 0!==i||(globalThis.litHtmlPlatformSupport=function(i,t){if(void 0!==window.ShadyCSS&&(!window.ShadyCSS.nativeShadow||window.ShadyCSS.ApplyShim)){var d=function(i){return void 0!==i&&!n.has(i)},e=function(i){var n=o.get(i);return void 0===n&&o.set(i,n=[]),n},u=new Map,v=i.createElement;i.createElement=function(n,o){var t=v.call(i,n,o),u=null==o?void 0:o.scope;if(void 0!==u&&(window.ShadyCSS.nativeShadow||window.ShadyCSS.prepareTemplateDom(t,u),d(u))){var w=e(u),r=t.content.querySelectorAll("style");w.push.apply(w,Array.from(r).map((function(i){var n;return null===(n=i.parentNode)||void 0===n||n.removeChild(i),i.textContent})))}return t};var w=document.createDocumentFragment(),r=document.createComment(""),l=t.prototype,s=l._$AI;l._$AI=function(i,t){var u,v,l;void 0===t&&(t=this);var f=this._$AA.parentNode,a=null===(u=this.options)||void 0===u?void 0:u.scope;if(f instanceof ShadowRoot&&d(a)){var h=this._$AA,c=this._$AB;w.appendChild(r),this._$AA=r,this._$AB=null,s.call(this,i,t);var y=(null===(v=i)||void 0===v?void 0:v._$litType$)?this._$AH._$AD.el:document.createElement("template");if(function(i,t){var d,u=e(i),v=0!==u.length;v&&((d=document.createElement("style")).textContent=u.join("\n"),t.content.appendChild(d)),n.add(i),o.delete(i),window.ShadyCSS.prepareTemplateStyles(t,i),v&&window.ShadyCSS.nativeShadow&&null!==(d=t.content.querySelector("style"))&&t.content.appendChild(d)}(a,y),w.removeChild(r),null===(l=window.ShadyCSS)||void 0===l?void 0:l.nativeShadow){var p=y.content.querySelector("style");null!==p&&w.appendChild(p.cloneNode(!0))}f.insertBefore(w,c),this._$AA=h,this._$AB=c}else s.call(this,i,t)},l._$AC=function(n){var o,t=null===(o=this.options)||void 0===o?void 0:o.scope,d=u.get(t);void 0===d&&u.set(t,d=new Map);var e=d.get(n.strings);return void 0===e&&d.set(n.strings,e=new i(n,this.options)),e}}})})),null!==(n=globalThis.litElementPlatformSupport)&&void 0!==n||(globalThis.litElementPlatformSupport=function(i){var n=i.LitElement;if(void 0!==window.ShadyCSS&&(!window.ShadyCSS.nativeShadow||window.ShadyCSS.ApplyShim)){n._$AJ=!0;var o=n.prototype,t=o.createRenderRoot;o.createRenderRoot=function(){return this.renderOptions.scope=this.localName,t.call(this)}}})}));
+var i,n=new Set,o=new Map;null!==(i=globalThis.litHtmlPolyfillSupport)&&void 0!==i||(globalThis.litHtmlPolyfillSupport=function(i,t){if(void 0!==window.ShadyCSS&&(!window.ShadyCSS.nativeShadow||window.ShadyCSS.ApplyShim)){var d=function(i){return void 0!==i&&!n.has(i)},e=function(i){var n=o.get(i);return void 0===n&&o.set(i,n=[]),n},u=new Map,v=i.createElement;i.createElement=function(n,o){var t=v.call(i,n,o),u=null==o?void 0:o.scope;if(void 0!==u&&(window.ShadyCSS.nativeShadow||window.ShadyCSS.prepareTemplateDom(t,u),d(u))){var w=e(u),r=t.content.querySelectorAll("style");w.push.apply(w,Array.from(r).map((function(i){var n;return null===(n=i.parentNode)||void 0===n||n.removeChild(i),i.textContent})))}return t};var w=document.createDocumentFragment(),r=document.createComment(""),l=t.prototype,s=l._$AI;l._$AI=function(i,t){var u,v,l;void 0===t&&(t=this);var f=this._$AA.parentNode,a=null===(u=this.options)||void 0===u?void 0:u.scope;if(f instanceof ShadowRoot&&d(a)){var h=this._$AA,c=this._$AB;w.appendChild(r),this._$AA=r,this._$AB=null,s.call(this,i,t);var y=(null===(v=i)||void 0===v?void 0:v._$litType$)?this._$AH._$AD.el:document.createElement("template");if(function(i,t){var d,u=e(i),v=0!==u.length;v&&((d=document.createElement("style")).textContent=u.join("\n"),t.content.appendChild(d)),n.add(i),o.delete(i),window.ShadyCSS.prepareTemplateStyles(t,i),v&&window.ShadyCSS.nativeShadow&&null!==(d=t.content.querySelector("style"))&&t.content.appendChild(d)}(a,y),w.removeChild(r),null===(l=window.ShadyCSS)||void 0===l?void 0:l.nativeShadow){var p=y.content.querySelector("style");null!==p&&w.appendChild(p.cloneNode(!0))}f.insertBefore(w,c),this._$AA=h,this._$AB=c}else s.call(this,i,t)},l._$AC=function(n){var o,t=null===(o=this.options)||void 0===o?void 0:o.scope,d=u.get(t);void 0===d&&u.set(t,d=new Map);var e=d.get(n.strings);return void 0===e&&d.set(n.strings,e=new i(n,this.options)),e}}})})),null!==(n=globalThis.litElementPolyfillSupport)&&void 0!==n||(globalThis.litElementPolyfillSupport=function(i){var n=i.LitElement;if(void 0!==window.ShadyCSS&&(!window.ShadyCSS.nativeShadow||window.ShadyCSS.ApplyShim)){n._$AJ=!0;var o=n.prototype,t=o.createRenderRoot;o.createRenderRoot=function(){return this.renderOptions.scope=this.localName,t.call(this)}}})}));
 //# sourceMappingURL=polyfill-support.js.map

README.md

@@ -1,2 +0,2 @@
-# LitElement 3.0 Release Candidate
+# LitElement 3.0
 
@@ -10,7 +10,7 @@ A simple base class for creating fast, lightweight web components.
 
-LitElement is the base class that powers the [Lit](https://lit.dev) library for building fast web components.
+LitElement is the base class that powers the [Lit](https://lit.dev) library for building fast web components. Most users should import `LitElement` from the [`lit`](https://www.npmjs.com/package/lit) package rather than installing and importing from the `lit-element` package directly.
 
 ## About this release
 
-This release candidate of lit-element 3.0 is intended to be feature complete and API stable. Please note the minor breaking changes from lit-element 2.0 in the [lit.dev upgrade guide](https://lit.dev/docs/releases/upgrade/).
+This is a stable release of `lit-element` 3.0.0 (part of the Lit 2.0 release). If upgrading from previous versions of `lit-element`, please see the [Upgrade Guide](https://lit.dev/docs/releases/upgrade/) for a step-by-step guide on upgrading.
 
@@ -17,0 +17,0 @@ ## Documentation

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

134167

increased by6.24%

Lines of code

1126

increased by10.39%

Number of low quality alerts

0

decreased by-100%

Worsened metrics

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• Updated@lit/reactive-element@^1.0.0

• Updatedlit-html@^2.0.0