Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

lit-element

Package Overview
Dependencies
Maintainers
11
Versions
84
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

lit-element - npm Package Compare versions

Comparing version 3.0.0-pre.4 to 3.0.0-rc.1

development/experimental-hydrate-support.d.ts

11

CHANGELOG.md

@@ -20,2 +20,13 @@ # Change Log

## 3.0.0-rc.1 - 2021-04-20
### Added
- Added `defer-hydration` attribute handling to `experimental-hydrate-support`,
which helps coordinate ordered wakeup of custom elements during hydration.
### Changed
- (Since 3.0.0-pre.4) Renamed `hydrate-support` module to `experimental-hydrate-support` to reflect its experimental nature. Experimental modules may undergo breaking changes within otherwise non-major releases.
## 3.0.0-pre.4 - 2021-03-31

@@ -22,0 +33,0 @@

1

decorators.d.ts

@@ -6,2 +6,3 @@ /**

*/
export * from '@lit/reactive-element/decorators/base.js';
export * from '@lit/reactive-element/decorators/custom-element.js';

@@ -8,0 +9,0 @@ export * from '@lit/reactive-element/decorators/property.js';

2

decorators.js

@@ -1,2 +0,2 @@

export*from"@lit/reactive-element/decorators/custom-element.js";export*from"@lit/reactive-element/decorators/property.js";export*from"@lit/reactive-element/decorators/state.js";export*from"@lit/reactive-element/decorators/event-options.js";export*from"@lit/reactive-element/decorators/query.js";export*from"@lit/reactive-element/decorators/query-all.js";export*from"@lit/reactive-element/decorators/query-async.js";export*from"@lit/reactive-element/decorators/query-assigned-nodes.js";
export*from"@lit/reactive-element/decorators/base.js";export*from"@lit/reactive-element/decorators/custom-element.js";export*from"@lit/reactive-element/decorators/property.js";export*from"@lit/reactive-element/decorators/state.js";export*from"@lit/reactive-element/decorators/event-options.js";export*from"@lit/reactive-element/decorators/query.js";export*from"@lit/reactive-element/decorators/query-all.js";export*from"@lit/reactive-element/decorators/query-async.js";export*from"@lit/reactive-element/decorators/query-assigned-nodes.js";
//# sourceMappingURL=decorators.js.map

@@ -6,2 +6,3 @@ /**

*/
export * from '@lit/reactive-element/decorators/base.js';
export * from '@lit/reactive-element/decorators/custom-element.js';

@@ -8,0 +9,0 @@ export * from '@lit/reactive-element/decorators/property.js';

@@ -12,2 +12,3 @@ /**

*/
export * from '@lit/reactive-element/decorators/base.js';
export * from '@lit/reactive-element/decorators/custom-element.js';

@@ -14,0 +15,0 @@ export * from '@lit/reactive-element/decorators/property.js';

@@ -75,4 +75,11 @@ /**

protected static ['finalized']: boolean;
static _$litElement$: boolean;
/**
* @category rendering
*/
readonly renderOptions: RenderOptions;
private __childPart;
/**
* @category rendering
*/
protected createRenderRoot(): ShadowRoot | Element;

@@ -84,5 +91,12 @@ /**

* @param changedProperties Map of changed properties with old values
* @category updates
*/
protected update(changedProperties: PropertyValues): void;
/**
* @category lifecycle
*/
connectedCallback(): void;
/**
* @category lifecycle
*/
disconnectedCallback(): void;

@@ -94,2 +108,3 @@ /**

* the element to update.
* @category rendering
*/

@@ -96,0 +111,0 @@ protected render(): unknown;

@@ -62,3 +62,3 @@ /**

// eslint-disable-next-line @typescript-eslint/no-explicit-any
((_a = (_f = globalThis)['litElementVersions']) !== null && _a !== void 0 ? _a : (_f['litElementVersions'] = [])).push('3.0.0-pre.4');
((_a = (_f = globalThis)['litElementVersions']) !== null && _a !== void 0 ? _a : (_f['litElementVersions'] = [])).push('3.0.0-rc.1');
/**

@@ -75,5 +75,11 @@ * Base element class that manages element properties and attributes, and

super(...arguments);
/**
* @category rendering
*/
this.renderOptions = { host: this };
this.__childPart = undefined;
}
/**
* @category rendering
*/
createRenderRoot() {

@@ -96,2 +102,3 @@ var _a;

* @param changedProperties Map of changed properties with old values
* @category updates
*/

@@ -109,2 +116,5 @@ update(changedProperties) {

// https://github.com/Polymer/lit-html/issues/1457
/**
* @category lifecycle
*/
connectedCallback() {

@@ -115,2 +125,5 @@ var _a;

}
/**
* @category lifecycle
*/
disconnectedCallback() {

@@ -126,2 +139,3 @@ var _a;

* the element to update.
* @category rendering
*/

@@ -140,2 +154,3 @@ render() {

LitElement['finalized'] = true;
LitElement._$litElement$ = true;
// Install hydration if available

@@ -164,3 +179,3 @@ // eslint-disable-next-line @typescript-eslint/no-explicit-any

// TODO(sorvell): add link to changelog when location has stabilized.
// + See the changelog at https://github.com/Polymer/lit-html/blob/lit-next/packages/lit-element/CHANGELOG.md`
// + See the changelog at https://github.com/Polymer/lit-html/blob/main/packages/lit-element/CHANGELOG.md`
);

@@ -167,0 +182,0 @@ }

@@ -56,12 +56,75 @@ /**

customElements.define(name, E);
const el = document.createElement(name);
container.appendChild(el);
// Workaround for Safari 9 Promise timing bugs.
(await el.updateComplete) && (await el.inner.updateComplete);
await nextFrame();
const div = el
.shadowRoot.querySelector('x-inner2')
.shadowRoot.querySelector('div');
assert.equal(getComputedStyleValue(div, 'border-top-width').trim(), '10px');
const testInstance = async () => {
const el = document.createElement(name);
container.appendChild(el);
// Workaround for Safari 9 Promise timing bugs.
(await el.updateComplete) && (await el.inner.updateComplete);
await nextFrame();
const div = el
.shadowRoot.querySelector('x-inner2')
.shadowRoot.querySelector('div');
assert.equal(getComputedStyleValue(div, 'border-top-width').trim(), '10px');
};
await testInstance();
await testInstance();
await testInstance();
});
test('part values correct when @apply is used in multiple instances', async () => {
customElements.define('x-inner3', class extends LitElement {
render() {
return htmlWithStyles `
<style>
div {
@apply --bag;
}
</style>
<div>Testing...</div>`;
}
});
const name = generateElementName();
class E extends LitElement {
constructor() {
super(...arguments);
this.inner = null;
}
render() {
return htmlWithStyles `
<style>
div {
border: 4px solid blue;
}
x-inner3 {
--bag: {
border: 10px solid red;
}
}
</style>
Outer Element
<div ?some-attr="${true}">${'Button Text'}</div>
<x-inner3></x-inner3>`;
}
firstUpdated() {
this.inner = this.shadowRoot.querySelector('x-inner3');
this.div = this.shadowRoot.querySelector('div');
}
}
customElements.define(name, E);
const testInstance = async () => {
const el = document.createElement(name);
container.appendChild(el);
// Workaround for Safari 9 Promise timing bugs.
(await el.updateComplete) && (await el.inner.updateComplete);
await nextFrame();
await new Promise((r) => setTimeout(r, 100));
const div = el
.shadowRoot.querySelector('x-inner3')
.shadowRoot.querySelector('div');
assert.equal(getComputedStyleValue(div, 'border-top-width').trim(), '10px');
assert.ok(el.div.hasAttribute('some-attr'));
assert.equal(el.div.textContent, 'Button Text');
};
await testInstance();
await testInstance();
await testInstance();
});
test('@apply renders in nested elements when sub-element renders separately first', async () => {

@@ -68,0 +131,0 @@ class I extends LitElement {

@@ -1,2 +0,2 @@

export*from"@lit/reactive-element";export*from"lit-html";export{LitElement,UpdatingElement,_Φ}from"./lit-element.js";export*from"@lit/reactive-element/decorators/custom-element.js";export*from"@lit/reactive-element/decorators/property.js";export*from"@lit/reactive-element/decorators/state.js";export*from"@lit/reactive-element/decorators/event-options.js";export*from"@lit/reactive-element/decorators/query.js";export*from"@lit/reactive-element/decorators/query-all.js";export*from"@lit/reactive-element/decorators/query-async.js";export*from"@lit/reactive-element/decorators/query-assigned-nodes.js";
export*from"@lit/reactive-element";export*from"lit-html";export{LitElement,UpdatingElement,_Φ}from"./lit-element.js";export*from"@lit/reactive-element/decorators/base.js";export*from"@lit/reactive-element/decorators/custom-element.js";export*from"@lit/reactive-element/decorators/property.js";export*from"@lit/reactive-element/decorators/state.js";export*from"@lit/reactive-element/decorators/event-options.js";export*from"@lit/reactive-element/decorators/query.js";export*from"@lit/reactive-element/decorators/query-all.js";export*from"@lit/reactive-element/decorators/query-async.js";export*from"@lit/reactive-element/decorators/query-assigned-nodes.js";
/**

@@ -3,0 +3,0 @@ * @license

@@ -75,4 +75,11 @@ /**

protected static ['finalized']: boolean;
static _$litElement$: boolean;
/**
* @category rendering
*/
readonly renderOptions: RenderOptions;
private __childPart;
/**
* @category rendering
*/
protected createRenderRoot(): ShadowRoot | Element;

@@ -84,5 +91,12 @@ /**

* @param changedProperties Map of changed properties with old values
* @category updates
*/
protected update(changedProperties: PropertyValues): void;
/**
* @category lifecycle
*/
connectedCallback(): void;
/**
* @category lifecycle
*/
disconnectedCallback(): void;

@@ -94,2 +108,3 @@ /**

* the element to update.
* @category rendering
*/

@@ -96,0 +111,0 @@ protected render(): unknown;

@@ -6,3 +6,3 @@ import{ReactiveElement as t}from"@lit/reactive-element";export*from"@lit/reactive-element";import{render as e,noChange as r}from"lit-html";export*from"lit-html";

* SPDX-License-Identifier: BSD-3-Clause
*/var i,l,o,s,n,a;const c=t;(null!==(i=(a=globalThis).litElementVersions)&&void 0!==i?i:a.litElementVersions=[]).push("3.0.0-pre.4");class h extends t{constructor(){super(...arguments),this.renderOptions={host:this},this.Φo=void 0}createRenderRoot(){var t,e;const r=super.createRenderRoot();return null!==(t=(e=this.renderOptions).renderBefore)&&void 0!==t||(e.renderBefore=r.firstChild),r}update(t){const r=this.render();super.update(t),this.Φo=e(r,this.renderRoot,this.renderOptions)}connectedCallback(){var t;super.connectedCallback(),null===(t=this.Φo)||void 0===t||t.setConnected(!0)}disconnectedCallback(){var t;super.disconnectedCallback(),null===(t=this.Φo)||void 0===t||t.setConnected(!1)}render(){return r}}h.finalized=!0,null===(o=(l=globalThis).litElementHydrateSupport)||void 0===o||o.call(l,{LitElement:h}),null===(n=(s=globalThis).litElementPlatformSupport)||void 0===n||n.call(s,{LitElement:h});const u={K:(t,e,r)=>{t.K(e,r)},L:t=>t.L};export{h as LitElement,c as UpdatingElement,u as _Φ};
*/var i,l,o,s,n,a;const c=t;(null!==(i=(a=globalThis).litElementVersions)&&void 0!==i?i:a.litElementVersions=[]).push("3.0.0-rc.1");class h extends t{constructor(){super(...arguments),this.renderOptions={host:this},this.Φt=void 0}createRenderRoot(){var t,e;const r=super.createRenderRoot();return null!==(t=(e=this.renderOptions).renderBefore)&&void 0!==t||(e.renderBefore=r.firstChild),r}update(t){const r=this.render();super.update(t),this.Φt=e(r,this.renderRoot,this.renderOptions)}connectedCallback(){var t;super.connectedCallback(),null===(t=this.Φt)||void 0===t||t.setConnected(!0)}disconnectedCallback(){var t;super.disconnectedCallback(),null===(t=this.Φt)||void 0===t||t.setConnected(!1)}render(){return r}}h.finalized=!0,h._$litElement$=!0,null===(o=(l=globalThis).litElementHydrateSupport)||void 0===o||o.call(l,{LitElement:h}),null===(n=(s=globalThis).litElementPlatformSupport)||void 0===n||n.call(s,{LitElement:h});const u={K:(t,e,r)=>{t.K(e,r)},L:t=>t.L};export{h as LitElement,c as UpdatingElement,u as _Φ};
//# sourceMappingURL=lit-element.js.map
{
"name": "lit-element",
"version": "3.0.0-pre.4",
"version": "3.0.0-rc.1",
"publishConfig": {

@@ -9,5 +9,9 @@ "access": "public"

"license": "BSD-3-Clause",
"repository": "Polymer/lit-html",
"repository": {
"type": "git",
"url": "https://github.com/lit/lit.git",
"directory": "packages/lit-element"
},
"author": "Google LLC",
"homepage": "https://lit-element.polymer-project.org/",
"homepage": "https://lit.dev/",
"main": "index.js",

@@ -34,5 +38,5 @@ "module": "index.js",

},
"./hydrate-support.js": {
"development": "./development/hydrate-support.js",
"default": "./hydrate-support.js"
"./experimental-hydrate-support.js": {
"development": "./development/experimental-hydrate-support.js",
"default": "./experimental-hydrate-support.js"
},

@@ -56,3 +60,3 @@ "./decorators.js": {

"checksize": "rollup -c --environment=CHECKSIZE",
"clean": "rm -rf {decorators,hydrate-support,index,lit-element,polyfill-support,private-ssr-support,lit.min}.{js,js.map,d.ts} test/ decorators/ development/ *.tsbuildinfo",
"clean": "rm -rf {decorators,experimental-hydrate-support,index,lit-element,polyfill-support,private-ssr-support,lit.min}.{js,js.map,d.ts} test/ decorators/ development/ *.tsbuildinfo",
"dev": "scripts/dev.sh",

@@ -71,3 +75,3 @@ "prepublishOnly": "npm run check-version",

"/decorators.{d.ts,d.ts.map,js,js.map}",
"/hydrate-support.{d.ts,d.ts.map,js,js.map}",
"/experimental-hydrate-support.{d.ts,d.ts.map,js,js.map}",
"/index.{d.ts,d.ts.map,js,js.map}",

@@ -84,4 +88,4 @@ "/lit-element.{d.ts,d.ts.map,js,js.map}",

"dependencies": {
"@lit/reactive-element": "^1.0.0-pre.3",
"lit-html": "^2.0.0-pre.7"
"@lit/reactive-element": "^1.0.0-rc.1",
"lit-html": "^2.0.0-rc.1"
},

@@ -88,0 +92,0 @@ "devDependencies": {

@@ -13,3 +13,3 @@ !function(i){"function"==typeof define&&define.amd?define(i):i()}((function(){"use strict";var i,n,o;i=function(){

*/
var i,n,o=new Set,t=new Map;null!==(i=(n=globalThis).litHtmlPlatformSupport)&&void 0!==i||(n.litHtmlPlatformSupport=function(i,n){if(void 0!==window.ShadyCSS&&(!window.ShadyCSS.nativeShadow||window.ShadyCSS.ApplyShim)){var d=function(i){var n=t.get(i);return void 0===n&&t.set(i,n=[]),n},e=new Map,v=i.createElement;i.createElement=function(n,o){var t=v.call(i,n,o),e=null==o?void 0:o.scope;if(void 0!==e){window.ShadyCSS.nativeShadow||window.ShadyCSS.prepareTemplateDom(t,e);var u=d(e),r=t.content.querySelectorAll("style");u.push.apply(u,Array.from(r).map((function(i){var n;return null===(n=i.parentNode)||void 0===n||n.removeChild(i),i.textContent})))}return t};var u=document.createDocumentFragment(),r=document.createComment(""),w=n.prototype,f=w.I;w.I=function(i,n){var e,v,w;void 0===n&&(n=this);var s,a=this.A.parentNode,l=null===(e=this.options)||void 0===e?void 0:e.scope;if(a instanceof ShadowRoot&&void 0!==(s=l)&&!o.has(s)){var h=this.A,c=this.B;u.appendChild(r),this.A=r,this.B=null,f.call(this,i,n);var p=(null===(v=i)||void 0===v?void 0:v._$litType$)?this.H.D.el:document.createElement("template");if(function(i,n){var e=d(i);if(e.length){var v=document.createElement("style");v.textContent=e.join("\n"),n.content.appendChild(v)}o.add(i),t.delete(i),window.ShadyCSS.prepareTemplateStyles(n,i)}(l,p),u.removeChild(r),null===(w=window.ShadyCSS)||void 0===w?void 0:w.nativeShadow){var y=p.content.querySelector("style");null!==y&&u.appendChild(y.cloneNode(!0))}a.insertBefore(u,c),this.A=h,this.B=c}else f.call(this,i,n)},w.C=function(n){var o,t=null===(o=this.options)||void 0===o?void 0:o.scope,d=e.get(t);void 0===d&&e.set(t,d=new Map);var v=d.get(n.strings);return void 0===v&&d.set(n.strings,v=new i(n,this.options)),v}}})})),null!==(n=(o=globalThis).litElementPlatformSupport)&&void 0!==n||(o.litElementPlatformSupport=function(i){var n=i.LitElement;if(void 0!==window.ShadyCSS&&(!window.ShadyCSS.nativeShadow||window.ShadyCSS.ApplyShim)){n.J=!0;var o=n.prototype,t=o.createRenderRoot;o.createRenderRoot=function(){return this.renderOptions.scope=this.localName,t.call(this)}}})}));
var i,n,o=new Set,t=new Map;null!==(i=(n=globalThis).litHtmlPlatformSupport)&&void 0!==i||(n.litHtmlPlatformSupport=function(i,n){if(void 0!==window.ShadyCSS&&(!window.ShadyCSS.nativeShadow||window.ShadyCSS.ApplyShim)){var d=function(i){var n=t.get(i);return void 0===n&&t.set(i,n=[]),n},e=new Map,v=i.createElement;i.createElement=function(n,o){var t=v.call(i,n,o),e=null==o?void 0:o.scope;if(void 0!==e){window.ShadyCSS.nativeShadow||window.ShadyCSS.prepareTemplateDom(t,e);var u=d(e),w=t.content.querySelectorAll("style");u.push.apply(u,Array.from(w).map((function(i){var n;return null===(n=i.parentNode)||void 0===n||n.removeChild(i),i.textContent})))}return t};var u=document.createDocumentFragment(),w=document.createComment(""),r=n.prototype,f=r.I;r.I=function(i,n){var e,v,r;void 0===n&&(n=this);var s,l=this.A.parentNode,a=null===(e=this.options)||void 0===e?void 0:e.scope;if(l instanceof ShadowRoot&&void 0!==(s=a)&&!o.has(s)){var h=this.A,c=this.B;u.appendChild(w),this.A=w,this.B=null,f.call(this,i,n);var y=(null===(v=i)||void 0===v?void 0:v._$litType$)?this.H.D.el:document.createElement("template");if(function(i,n){var e=d(i),v=0!==e.length;if(v){var u=document.createElement("style");u.textContent=e.join("\n"),n.content.appendChild(u)}o.add(i),t.delete(i),window.ShadyCSS.prepareTemplateStyles(n,i),v&&window.ShadyCSS.nativeShadow&&n.content.appendChild(n.content.querySelector("style"))}(a,y),u.removeChild(w),null===(r=window.ShadyCSS)||void 0===r?void 0:r.nativeShadow){var p=y.content.querySelector("style");null!==p&&u.appendChild(p.cloneNode(!0))}l.insertBefore(u,c),this.A=h,this.B=c}else f.call(this,i,n)},r.C=function(n){var o,t=null===(o=this.options)||void 0===o?void 0:o.scope,d=e.get(t);void 0===d&&e.set(t,d=new Map);var v=d.get(n.strings);return void 0===v&&d.set(n.strings,v=new i(n,this.options)),v}}})})),null!==(n=(o=globalThis).litElementPlatformSupport)&&void 0!==n||(o.litElementPlatformSupport=function(i){var n=i.LitElement;if(void 0!==window.ShadyCSS&&(!window.ShadyCSS.nativeShadow||window.ShadyCSS.ApplyShim)){n.J=!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
# LitElement 3.0 Pre-release
[![Build Status](https://github.com/polymer/lit-html/workflows/Tests/badge.svg?branch=lit-next)](https://github.com/Polymer/lit-html/actions?query=workflow%3ATests)
[![Build Status](https://github.com/polymer/lit-html/workflows/Tests/badge.svg)](https://github.com/Polymer/lit-html/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)
[![Mentioned in Awesome lit-html](https://awesome.re/mentioned-badge.svg)](https://github.com/web-padawan/awesome-lit-html)
[![Mentioned in Awesome Lit](https://awesome.re/mentioned-badge.svg)](https://github.com/web-padawan/awesome-lit)

@@ -8,0 +8,0 @@ ## 🚨 About this pre-release

@@ -14,2 +14,3 @@ /**

export * from '@lit/reactive-element/decorators/base.js';
export * from '@lit/reactive-element/decorators/custom-element.js';

@@ -16,0 +17,0 @@ export * from '@lit/reactive-element/decorators/property.js';

@@ -70,3 +70,3 @@ /**

// eslint-disable-next-line @typescript-eslint/no-explicit-any
((globalThis as any)['litElementVersions'] ??= []).push('3.0.0-pre.4');
((globalThis as any)['litElementVersions'] ??= []).push('3.0.0-rc.1');

@@ -91,2 +91,7 @@ /**

static _$litElement$ = true;
/**
* @category rendering
*/
readonly renderOptions: RenderOptions = {host: this};

@@ -96,2 +101,5 @@

/**
* @category rendering
*/
protected createRenderRoot() {

@@ -113,2 +121,3 @@ const renderRoot = super.createRenderRoot();

* @param changedProperties Map of changed properties with old values
* @category updates
*/

@@ -127,2 +136,5 @@ protected update(changedProperties: PropertyValues) {

// https://github.com/Polymer/lit-html/issues/1457
/**
* @category lifecycle
*/
connectedCallback() {

@@ -133,2 +145,5 @@ super.connectedCallback();

/**
* @category lifecycle
*/
disconnectedCallback() {

@@ -144,2 +159,3 @@ super.disconnectedCallback();

* the element to update.
* @category rendering
*/

@@ -177,3 +193,3 @@ protected render(): unknown {

// TODO(sorvell): add link to changelog when location has stabilized.
// + See the changelog at https://github.com/Polymer/lit-html/blob/lit-next/packages/lit-element/CHANGELOG.md`
// + See the changelog at https://github.com/Polymer/lit-html/blob/main/packages/lit-element/CHANGELOG.md`
);

@@ -180,0 +196,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

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc