lit-element - npm Package Compare versions

Comparing version 2.4.0 to 2.5.0

CHANGELOG.md

@@ -20,2 +20,16 @@ # Change Log
 
+## [2.5.0] - 2021-04-29
+
+### Changed
+
+* Added the `@state()` decorator as an alias for `@internalProperty()`, and deprecated `@internalProperty()` which will be renamed to `@state` in lit-element 3.0. [#1162](https://github.com/Polymer/lit-element/issues/1162).
+* Added `UpdatingElement.prototype.getUpdateComplete()` and deprecated `_getUpdateComplete()` for forward compibility with lit-element 3.0.
+
+### Added
+* Adds a `static shadowRootOptions` property for specifying shadow root options. This is a slightly simpler alternative to implementing a custom `createRenderRoot` method [#1147](https://github.com/Polymer/lit-element/issues/1147).
+* Adds an export of `UpdatingElement` as `ReactiveElement` for forward-compatibility with lit-element 3.0 [#1177](https://github.com/Polymer/lit-element/issues/1177).
+
+### Fixed
+* Fixes an issue with `queryAssignedNodes` when applying a selector on a slot that included text nodes on older browsers not supporting Element.matches [#1088](https://github.com/Polymer/lit-element/issues/1088).
+
 ## [2.4.0] - 2020-08-19
@@ -22,0 +36,0 @@

lib/css-tag.d.ts

@@ -36,3 +36,3 @@ /**
  */
-export declare const css: (strings: TemplateStringsArray, ...values: (number | CSSResult)[]) => CSSResult;
+export declare const css: (strings: TemplateStringsArray, ...values: (CSSResult | number)[]) => CSSResult;
 //# sourceMappingURL=css-tag.d.ts.map

lib/decorators.d.ts

@@ -46,3 +46,3 @@ /**
  */
-export declare const customElement: (tagName: string) => (classOrDescriptor: ClassDescriptor | Constructor<HTMLElement>) => any;
+export declare const customElement: (tagName: string) => (classOrDescriptor: Constructor<HTMLElement> | ClassDescriptor) => any;
 /**
@@ -66,3 +66,3 @@ * A property decorator which creates a LitElement property which reflects a
  */
-export declare function property(options?: PropertyDeclaration): (protoOrDescriptor: Object | ClassElement, name?: string | number | symbol | undefined) => any;
+export declare function property(options?: PropertyDeclaration): (protoOrDescriptor: Object | ClassElement, name?: PropertyKey | undefined) => any;
 export interface InternalPropertyDeclaration<Type = unknown> {
@@ -84,5 +84,17 @@ /**
  * @category Decorator
+ * @deprecated `internalProperty` will be renamed to `state` in lit-element 3.0.
+ *     Please update to `state` now to be compatible with 3.0.
  */
-export declare function internalProperty(options?: InternalPropertyDeclaration): (protoOrDescriptor: Object | ClassElement, name?: string | number | symbol | undefined) => any;
+export declare function internalProperty(options?: InternalPropertyDeclaration): (protoOrDescriptor: Object | ClassElement, name?: PropertyKey | undefined) => any;
 /**
+ * Declares a private or protected property that still triggers updates to the
+ * element when it changes.
+ *
+ * Properties declared this way must not be used from HTML or HTML templating
+ * systems, they're solely for properties internal to the element. These
+ * properties may be renamed by optimization tools like closure compiler.
+ * @category Decorator
+ */
+export declare const state: typeof internalProperty;
+/**
  * A property decorator that converts a class property into a getter that
@@ -114,3 +126,3 @@ * executes a querySelector on the element's renderRoot.
  */
-export declare function query(selector: string, cache?: boolean): (protoOrDescriptor: Object | ClassElement, name?: string | number | symbol | undefined) => any;
+export declare function query(selector: string, cache?: boolean): (protoOrDescriptor: Object | ClassElement, name?: PropertyKey | undefined) => any;
 /**
@@ -149,3 +161,3 @@ * A property decorator that converts a class property into a getter that
  */
-export declare function queryAsync(selector: string): (protoOrDescriptor: Object | ClassElement, name?: string | number | symbol | undefined) => any;
+export declare function queryAsync(selector: string): (protoOrDescriptor: Object | ClassElement, name?: PropertyKey | undefined) => any;
 /**
@@ -176,3 +188,3 @@ * A property decorator that converts a class property into a getter
  */
-export declare function queryAll(selector: string): (protoOrDescriptor: Object | ClassElement, name?: string | number | symbol | undefined) => any;
+export declare function queryAll(selector: string): (protoOrDescriptor: Object | ClassElement, name?: PropertyKey | undefined) => any;
 /**
@@ -237,4 +249,4 @@ * Adds event listener options to a method used as an event listener in a
  */
-export declare function queryAssignedNodes(slotName?: string, flatten?: boolean, selector?: string): (protoOrDescriptor: Object | ClassElement, name?: string | number | symbol | undefined) => any;
+export declare function queryAssignedNodes(slotName?: string, flatten?: boolean, selector?: string): (protoOrDescriptor: Object | ClassElement, name?: PropertyKey | undefined) => any;
 export {};
 //# sourceMappingURL=decorators.d.ts.map

lib/decorators.js

@@ -127,2 +127,4 @@ /**
  * @category Decorator
+ * @deprecated `internalProperty` will be renamed to `state` in lit-element 3.0.
+ *     Please update to `state` now to be compatible with 3.0.
  */
@@ -133,2 +135,12 @@ export function internalProperty(options) {
 /**
+ * Declares a private or protected property that still triggers updates to the
+ * element when it changes.
+ *
+ * Properties declared this way must not be used from HTML or HTML templating
+ * systems, they're solely for properties internal to the element. These
+ * properties may be renamed by optimization tools like closure compiler.
+ * @category Decorator
+ */
+export const state = internalProperty;
+/**
  * A property decorator that converts a class property into a getter that
@@ -172,3 +184,4 @@ * executes a querySelector on the element's renderRoot.
         if (cache) {
-            const key = typeof name === 'symbol' ? Symbol() : `__${name}`;
+            const prop = name !== undefined ? name : protoOrDescriptor.key;
+            const key = typeof prop === 'symbol' ? Symbol() : `__${prop}`;
             descriptor.get = function () {
@@ -385,5 +398,6 @@ if (this[key] === undefined) {
                     nodes = nodes.filter((node) => node.nodeType === Node.ELEMENT_NODE &&
-                        node.matches ?
-                        node.matches(selector) :
-                        legacyMatches.call(node, selector));
+                        // tslint:disable-next-line:no-any testing existence on older browsers
+                        (node.matches ?
+                            node.matches(selector) :
+                            legacyMatches.call(node, selector)));
                 }
@@ -390,0 +404,0 @@ return nodes;

lib/updating-element.d.ts

@@ -387,5 +387,24 @@ /**
      *   }
+     * @deprecated Override `getUpdateComplete()` instead for forward
+     *     compatibility with `lit-element` 3.0 / `@lit/reactive-element`.
      */
     protected _getUpdateComplete(): Promise<unknown>;
     /**
+     * Override point for the `updateComplete` promise.
+     *
+     * It is not safe to override the `updateComplete` getter directly due to a
+     * limitation in TypeScript which means it is not possible to call a
+     * superclass getter (e.g. `super.updateComplete.then(...)`) when the target
+     * language is ES5 (https://github.com/microsoft/TypeScript/issues/338).
+     * This method should be overridden instead. For example:
+     *
+     *   class MyElement extends LitElement {
+     *     async getUpdateComplete() {
+     *       await super.getUpdateComplete();
+     *       await this._myChild.updateComplete;
+     *     }
+     *   }
+     */
+    protected getUpdateComplete(): Promise<unknown>;
+    /**
      * Controls whether or not `update` should be called when the element requests
@@ -392,0 +411,0 @@ * an update. By default, this method always returns `true`, but this can be

lib/updating-element.js

@@ -49,2 +49,3 @@ /**
             case Array:
+                // Type assert to adhere to Bazel's "must type assert JSON parse" rule.
                 return JSON.parse(value);
@@ -614,4 +615,25 @@ }
      *   }
+     * @deprecated Override `getUpdateComplete()` instead for forward
+     *     compatibility with `lit-element` 3.0 / `@lit/reactive-element`.
      */
     _getUpdateComplete() {
+        return this.getUpdateComplete();
+    }
+    /**
+     * Override point for the `updateComplete` promise.
+     *
+     * It is not safe to override the `updateComplete` getter directly due to a
+     * limitation in TypeScript which means it is not possible to call a
+     * superclass getter (e.g. `super.updateComplete.then(...)`) when the target
+     * language is ES5 (https://github.com/microsoft/TypeScript/issues/338).
+     * This method should be overridden instead. For example:
+     *
+     *   class MyElement extends LitElement {
+     *     async getUpdateComplete() {
+     *       await super.getUpdateComplete();
+     *       await this._myChild.updateComplete;
+     *     }
+     *   }
+     */
+    getUpdateComplete() {
         return this._updatePromise;
@@ -618,0 +640,0 @@ }

lit-element.d.ts

@@ -59,2 +59,3 @@ /**
 export * from './lib/updating-element.js';
+export { UpdatingElement as ReactiveElement } from './lib/updating-element.js';
 export * from './lib/decorators.js';
@@ -72,2 +73,3 @@ export { html, svg, TemplateResult, SVGTemplateResult } from 'lit-html/lit-html.js';
 }
+export declare type CSSResultGroup = CSSResultOrNative | CSSResultArray;
 /**
@@ -112,3 +114,5 @@ * Base element class that manages element properties and attributes, and
      */
-    static styles?: CSSResultOrNative | CSSResultArray;
+    static styles?: CSSResultGroup;
+    /** @nocollapse */
+    static shadowRootOptions: ShadowRootInit;
     private static _styles;
@@ -121,3 +125,3 @@ /**
      */
-    static getStyles(): CSSResultOrNative | CSSResultArray | undefined;
+    static getStyles(): CSSResultGroup | undefined;
     /** @nocollapse */
@@ -124,0 +128,0 @@ private static _getUniqueStyles;

lit-element.js

@@ -59,2 +59,3 @@ /**
 export * from './lib/updating-element.js';
+export { UpdatingElement as ReactiveElement } from './lib/updating-element.js';
 export * from './lib/decorators.js';
@@ -68,3 +69,3 @@ export { html, svg, TemplateResult, SVGTemplateResult } from 'lit-html/lit-html.js';
 (window['litElementVersions'] || (window['litElementVersions'] = []))
-    .push('2.4.0');
+    .push('2.5.0');
 /**
@@ -169,3 +170,3 @@ * Sentinal value used to avoid calling lit-html's render function when
     createRenderRoot() {
-        return this.attachShadow({ mode: 'open' });
+        return this.attachShadow(this.constructor.shadowRootOptions);
     }
@@ -277,2 +278,4 @@ /**
 LitElement.render = render;
+/** @nocollapse */
+LitElement.shadowRootOptions = { mode: 'open' };
 //# sourceMappingURL=lit-element.js.map

package.json

 {
   "name": "lit-element",
-  "version": "2.4.0",
+  "version": "2.5.0",
   "description": "A simple base class for creating fast, lightweight web components",
   "license": "BSD-3-Clause",
   "homepage": "https://lit-element.polymer-project.org/",
-  "repository": "Polymer/lit-element",
+  "repository": "lit/lit-element",
   "type": "module",
@@ -35,3 +35,3 @@ "main": "lit-element.js",
     "lint": "tslint --project ./",
-    "prepublishOnly": "node check-version-tracker.cjs && npm run lint && npm test",
+    "prepublishOnly": "node check-version-tracker.cjs && npm run lint",
     "prepare": "npm run build",
@@ -42,26 +42,28 @@ "regen-package-lock": "rm -rf node_modules package-lock.json; npm install",
   },
-  "author": "The Polymer Authors",
+  "author": "Google LLC",
   "devDependencies": {
-    "@babel/cli": "^7.2.3",
-    "@babel/plugin-proposal-class-properties": "^7.2.3",
-    "@babel/plugin-proposal-decorators": "^7.2.3",
-    "@babel/plugin-transform-typescript": "^7.2.0",
-    "@types/chai": "^4.0.1",
+    "@babel/cli": "^7.13.10",
+    "@babel/helper-define-map": "^7.13.12",
+    "@babel/helper-regex": "^7.10.5",
+    "@babel/plugin-proposal-class-properties": "^7.13.0",
+    "@babel/plugin-proposal-decorators": "^7.13.5",
+    "@babel/plugin-transform-typescript": "^7.13.0",
+    "@types/chai": "^4.2.15",
     "@types/mocha": "^5.2.4",
-    "@webcomponents/shadycss": "^1.8.0",
-    "@webcomponents/webcomponentsjs": "^2.2.3",
-    "chai": "^4.0.2",
-    "clang-format": "^1.2.4",
-    "downlevel-dts": "^0.6.0",
+    "@webcomponents/shadycss": "^1.10.2",
+    "@webcomponents/webcomponentsjs": "^2.5.0",
+    "chai": "^4.3.3",
+    "clang-format": "^1.5.0",
+    "downlevel-dts": "^0.7.0",
     "lit-element-benchmarks": "^0.1.0",
     "mocha": "^6.2.2",
-    "np": "^5.2.1",
+    "np": "^7.4.0",
     "rollup": "^1.26.0",
     "rollup-plugin-filesize": "^6.2.0",
     "rollup-plugin-node-resolve": "^5.2.0",
-    "rollup-plugin-terser": "^5.1.0",
-    "tachometer": "^0.4.16",
+    "rollup-plugin-terser": "^5.3.1",
+    "tachometer": "^0.5.8",
     "tslint": "^5.20.1",
     "typedoc": "^0.17.0-3",
-    "typescript": "~3.8.2",
+    "typescript": "^4.2.3",
     "uglify-es": "^3.3.9",
@@ -68,0 +70,0 @@ "wct-mocha": "^1.0.0",

README.md

 # LitElement
-A simple base class for creating fast, lightweight web components with [lit-html](https://lit-html.polymer-project.org/).
 
-[![Build Status](https://travis-ci.org/Polymer/lit-element.svg?branch=master)](https://travis-ci.org/Polymer/lit-element)
+LitElement is simple base class for creating fast, lightweight web components with [lit-html](https://lit-html.polymer-project.org/).
+
+[![Build Status](https://travis-ci.org/lit/lit-element.svg?branch=master)](https://travis-ci.org/lit/lit-element)
 [![Published on npm](https://img.shields.io/npm/v/lit-element.svg)](https://www.npmjs.com/package/lit-element)
-[![Join our Slack](https://img.shields.io/badge/slack-join%20chat-4a154b.svg)](https://www.polymer-project.org/slack-invite)
-[![Published on webcomponents.org](https://img.shields.io/badge/webcomponents.org-published-blue.svg)](https://www.webcomponents.org/element/lit-element)
-[![Mentioned in Awesome lit-html](https://awesome.re/mentioned-badge.svg)](https://github.com/web-padawan/awesome-lit-html)
+[![Join our Slack](https://img.shields.io/badge/slack-join%20chat-4a154b.svg)](https://lit.dev/slack-invite/)
+[![Mentioned in Awesome lit-html](https://awesome.re/mentioned-badge.svg)](https://github.com/web-padawan/awesome-lit)
 
+## Looking for Lit?
+
+LitElement is now part of the [Lit library monorepo](https://github.com/lit/lit). Lit 2 includes lit-html 2.x and LitElement 3.x. 
+
+This repo contains the code for LitElement 2.x.
+
 ## Documentation
 
-Full documentation is available at [lit-element.polymer-project.org](https://lit-element.polymer-project.org).
+For LitElement 2.x documentation, see the [legacy documentation site](https://lit-element.polymer-project.org).
 
+For Lit 2, the next version of LitElement and lit-html, see the [Lit site](https://lit.dev). 
+
 ## Overview
@@ -84,4 +92,17 @@
 
+## Forward Compatibility With Lit 2 
+
+Lit 2 (LitElement 3.0) has a few breaking changes and deprecations that have been back-ported to LitElement 2.5 in order to ease upgrading.
+
+To prepare for Lit 2, update these APIs:
+
+| LitElement 2.4         | LitElement 2.5/Lit 2  |
+|------------------------|-----------------------|
+| Decorator imports:<br>`import {customElement} from 'lit-element';` | `import {customElement} from 'lit-element/decorators.js';`
+| `@internalProperty() foo;`  | `@state() foo;`            |
+| Override `_getUpdateComplete()` | Override `getUpdateComplete()` |
+| Shadow root options:</br> Override `createRenderRoot()`. | Add `static shadowRootOptions`.
+| `import {UpdatingElement} from 'lit-element';` |  `import {ReactiveElement} from 'lit-element';`  |
 ## Contributing
 
 Please see [CONTRIBUTING.md](./CONTRIBUTING.md).

src/lib/decorators.ts

@@ -186,2 +186,4 @@ /**
  * @category Decorator
+ * @deprecated `internalProperty` will be renamed to `state` in lit-element 3.0.
+ *     Please update to `state` now to be compatible with 3.0.
  */
@@ -193,2 +195,13 @@ export function internalProperty(options?: InternalPropertyDeclaration) {
 /**
+ * Declares a private or protected property that still triggers updates to the
+ * element when it changes.
+ *
+ * Properties declared this way must not be used from HTML or HTML templating
+ * systems, they're solely for properties internal to the element. These
+ * properties may be renamed by optimization tools like closure compiler.
+ * @category Decorator
+ */
+export const state = internalProperty;
+
+/**
  * A property decorator that converts a class property into a getter that
@@ -232,3 +245,5 @@ * executes a querySelector on the element's renderRoot.
     if (cache) {
-      const key = typeof name === 'symbol' ? Symbol() : `__${name}`;
+      const prop =
+          name !== undefined ? name : (protoOrDescriptor as ClassElement).key;
+      const key = typeof prop === 'symbol' ? Symbol() : `__${prop}`;
       descriptor.get = function(this: LitElement) {
@@ -471,5 +486,6 @@ if ((this as unknown as
               (node) => node.nodeType === Node.ELEMENT_NODE &&
-                      (node as Element).matches ?
-                  (node as Element).matches(selector) :
-                  legacyMatches.call(node as Element, selector));
+                  // tslint:disable-next-line:no-any testing existence on older browsers
+                  ((node as any).matches ?
+                       (node as Element).matches(selector) :
+                       legacyMatches.call(node as Element, selector)));
         }
@@ -476,0 +492,0 @@ return nodes;

src/lib/updating-element.ts

@@ -168,3 +168,4 @@ /**
       case Array:
-        return JSON.parse(value!);
+        // Type assert to adhere to Bazel's "must type assert JSON parse" rule.
+        return JSON.parse(value!) as unknown;
     }
@@ -501,3 +502,3 @@ return value;
   private _updatePromise!: Promise<unknown>;
-  private _enableUpdatingResolver: (() => void)|undefined;
+  private _enableUpdatingResolver: ((r?: unknown) => void)|undefined;
 
@@ -836,4 +837,26 @@ /**
    *   }
+   * @deprecated Override `getUpdateComplete()` instead for forward
+   *     compatibility with `lit-element` 3.0 / `@lit/reactive-element`.
    */
   protected _getUpdateComplete() {
+    return this.getUpdateComplete();
+  }
+
+  /**
+   * Override point for the `updateComplete` promise.
+   *
+   * It is not safe to override the `updateComplete` getter directly due to a
+   * limitation in TypeScript which means it is not possible to call a
+   * superclass getter (e.g. `super.updateComplete.then(...)`) when the target
+   * language is ES5 (https://github.com/microsoft/TypeScript/issues/338).
+   * This method should be overridden instead. For example:
+   *
+   *   class MyElement extends LitElement {
+   *     async getUpdateComplete() {
+   *       await super.getUpdateComplete();
+   *       await this._myChild.updateComplete;
+   *     }
+   *   }
+   */
+  protected getUpdateComplete() {
     return this._updatePromise;
@@ -840,0 +863,0 @@ }

src/lit-element.ts

@@ -62,2 +62,3 @@ /**
 export * from './lib/updating-element.js';
+export {UpdatingElement as ReactiveElement} from './lib/updating-element.js';
 export * from './lib/decorators.js';
@@ -78,3 +79,3 @@ export {html, svg, TemplateResult, SVGTemplateResult} from 'lit-html/lit-html.js';
 (window['litElementVersions'] || (window['litElementVersions'] = []))
-    .push('2.4.0');
+    .push('2.5.0');
 
@@ -86,2 +87,4 @@ export type CSSResultOrNative = CSSResult|CSSStyleSheet;
 
+export type CSSResultGroup = CSSResultOrNative|CSSResultArray;
+
 /**
@@ -136,4 +139,7 @@ * Sentinal value used to avoid calling lit-html's render function when
    */
-  static styles?: CSSResultOrNative|CSSResultArray;
+  static styles?: CSSResultGroup;
 
+  /** @nocollapse */
+  static shadowRootOptions: ShadowRootInit = {mode: 'open'};
+
   private static _styles: Array<CSSResultOrNative|CSSResult>|undefined;
@@ -147,3 +153,3 @@
    */
-  static getStyles(): CSSResultOrNative|CSSResultArray|undefined {
+  static getStyles(): CSSResultGroup|undefined {
     return this.styles;
@@ -244,3 +250,4 @@ }
   protected createRenderRoot(): Element|ShadowRoot {
-    return this.attachShadow({mode: 'open'});
+    return this.attachShadow(
+        (this.constructor as typeof LitElement).shadowRootOptions);
   }
@@ -269,3 +276,3 @@
       window.ShadyCSS.ScopingShim!.prepareAdoptedCssText(
-          styles.map((s) => s.cssText), this.localName);
+          styles.map((s) => (s as CSSResult).cssText), this.localName);
     } else if (supportsAdoptingStyleSheets) {
@@ -317,3 +324,3 @@ (this.renderRoot as ShadowRoot).adoptedStyleSheets =
         const style = document.createElement('style');
-        style.textContent = s.cssText;
+        style.textContent = (s as CSSResult).cssText;
         this.renderRoot.appendChild(style);
@@ -320,0 +327,0 @@ });

ts3.4/lib/css-tag.d.ts

@@ -36,3 +36,3 @@ /**
  */
-export declare const css: (strings: TemplateStringsArray, ...values: (number | CSSResult)[]) => CSSResult;
+export declare const css: (strings: TemplateStringsArray, ...values: (CSSResult | number)[]) => CSSResult;
 //# sourceMappingURL=css-tag.d.ts.map

ts3.4/lib/decorators.d.ts

@@ -46,3 +46,3 @@ /**
  */
-export declare const customElement: (tagName: string) => (classOrDescriptor: ClassDescriptor | Constructor<HTMLElement>) => any;
+export declare const customElement: (tagName: string) => (classOrDescriptor: Constructor<HTMLElement> | ClassDescriptor) => any;
 /**
@@ -66,3 +66,3 @@ * A property decorator which creates a LitElement property which reflects a
  */
-export declare function property(options?: PropertyDeclaration): (protoOrDescriptor: Object | ClassElement, name?: string | number | symbol | undefined) => any;
+export declare function property(options?: PropertyDeclaration): (protoOrDescriptor: Object | ClassElement, name?: PropertyKey | undefined) => any;
 export interface InternalPropertyDeclaration<Type = unknown> {
@@ -84,5 +84,17 @@ /**
  * @category Decorator
+ * @deprecated `internalProperty` will be renamed to `state` in lit-element 3.0.
+ *     Please update to `state` now to be compatible with 3.0.
  */
-export declare function internalProperty(options?: InternalPropertyDeclaration): (protoOrDescriptor: Object | ClassElement, name?: string | number | symbol | undefined) => any;
+export declare function internalProperty(options?: InternalPropertyDeclaration): (protoOrDescriptor: Object | ClassElement, name?: PropertyKey | undefined) => any;
 /**
+ * Declares a private or protected property that still triggers updates to the
+ * element when it changes.
+ *
+ * Properties declared this way must not be used from HTML or HTML templating
+ * systems, they're solely for properties internal to the element. These
+ * properties may be renamed by optimization tools like closure compiler.
+ * @category Decorator
+ */
+export declare const state: typeof internalProperty;
+/**
  * A property decorator that converts a class property into a getter that
@@ -114,3 +126,3 @@ * executes a querySelector on the element's renderRoot.
  */
-export declare function query(selector: string, cache?: boolean): (protoOrDescriptor: Object | ClassElement, name?: string | number | symbol | undefined) => any;
+export declare function query(selector: string, cache?: boolean): (protoOrDescriptor: Object | ClassElement, name?: PropertyKey | undefined) => any;
 /**
@@ -149,3 +161,3 @@ * A property decorator that converts a class property into a getter that
  */
-export declare function queryAsync(selector: string): (protoOrDescriptor: Object | ClassElement, name?: string | number | symbol | undefined) => any;
+export declare function queryAsync(selector: string): (protoOrDescriptor: Object | ClassElement, name?: PropertyKey | undefined) => any;
 /**
@@ -176,3 +188,3 @@ * A property decorator that converts a class property into a getter
  */
-export declare function queryAll(selector: string): (protoOrDescriptor: Object | ClassElement, name?: string | number | symbol | undefined) => any;
+export declare function queryAll(selector: string): (protoOrDescriptor: Object | ClassElement, name?: PropertyKey | undefined) => any;
 /**
@@ -237,4 +249,4 @@ * Adds event listener options to a method used as an event listener in a
  */
-export declare function queryAssignedNodes(slotName?: string, flatten?: boolean, selector?: string): (protoOrDescriptor: Object | ClassElement, name?: string | number | symbol | undefined) => any;
+export declare function queryAssignedNodes(slotName?: string, flatten?: boolean, selector?: string): (protoOrDescriptor: Object | ClassElement, name?: PropertyKey | undefined) => any;
 export {};
 //# sourceMappingURL=decorators.d.ts.map

ts3.4/lib/updating-element.d.ts

@@ -387,5 +387,24 @@ /**
      *   }
+     * @deprecated Override `getUpdateComplete()` instead for forward
+     *     compatibility with `lit-element` 3.0 / `@lit/reactive-element`.
      */
     protected _getUpdateComplete(): Promise<unknown>;
     /**
+     * Override point for the `updateComplete` promise.
+     *
+     * It is not safe to override the `updateComplete` getter directly due to a
+     * limitation in TypeScript which means it is not possible to call a
+     * superclass getter (e.g. `super.updateComplete.then(...)`) when the target
+     * language is ES5 (https://github.com/microsoft/TypeScript/issues/338).
+     * This method should be overridden instead. For example:
+     *
+     *   class MyElement extends LitElement {
+     *     async getUpdateComplete() {
+     *       await super.getUpdateComplete();
+     *       await this._myChild.updateComplete;
+     *     }
+     *   }
+     */
+    protected getUpdateComplete(): Promise<unknown>;
+    /**
      * Controls whether or not `update` should be called when the element requests
@@ -392,0 +411,0 @@ * an update. By default, this method always returns `true`, but this can be

ts3.4/lit-element.d.ts

@@ -59,2 +59,3 @@ /**
 export * from './lib/updating-element.js';
+export { UpdatingElement as ReactiveElement } from './lib/updating-element.js';
 export * from './lib/decorators.js';
@@ -72,2 +73,3 @@ export { html, svg, TemplateResult, SVGTemplateResult } from 'lit-html/lit-html.js';
 }
+export declare type CSSResultGroup = CSSResultOrNative | CSSResultArray;
 /**
@@ -112,3 +114,5 @@ * Base element class that manages element properties and attributes, and
      */
-    static styles?: CSSResultOrNative | CSSResultArray;
+    static styles?: CSSResultGroup;
+    /** @nocollapse */
+    static shadowRootOptions: ShadowRootInit;
     private static _styles;
@@ -121,3 +125,3 @@ /**
      */
-    static getStyles(): CSSResultOrNative | CSSResultArray | undefined;
+    static getStyles(): CSSResultGroup | undefined;
     /** @nocollapse */
@@ -124,0 +128,0 @@ private static _getUniqueStyles;

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

No repository

Supply chain risk

Package does not have a linked source code repository. Without this field, a package will have no reference to the location of the source code use to generate the 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 repository

Supply chain risk

Package does not have a linked source code repository. Without this field, a package will have no reference to the location of the source code use to generate the package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

330817

increased by4.11%

Number of package files

41

increased by5.13%

Lines of code

5191

increased by3.59%

Number of lines in readme file

108

increased by24.14%

Worsened metrics

Dev dependency count

27

increased by8%

No dependency changes