saby-customizer 0.0.0 → 0.0.2

package/material.js

@@ -1,62 +1,66 @@
 var extendStatics = function(d, b) {
-    extendStatics = Object.setPrototypeOf ||
-        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-        function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
-    return extendStatics(d, b);
+  extendStatics = Object.setPrototypeOf ||
+      ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+      function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+  return extendStatics(d, b);
 };
 function __extends(d, b) {
-    if (typeof b !== "function" && b !== null)
-        throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
-    extendStatics(d, b);
-    function __() { this.constructor = d; }
-    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+  if (typeof b !== "function" && b !== null)
+      throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+  extendStatics(d, b);
+  function __() { this.constructor = d; }
+  d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
 }
 var __assign = function() {
-    __assign = Object.assign || function __assign(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
+  __assign = Object.assign || function __assign(t) {
+      for (var s, i = 1, n = arguments.length; i < n; i++) {
+          s = arguments[i];
+          for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+      }
+      return t;
+  };
+  return __assign.apply(this, arguments);
 };
 function __decorate(decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
+  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
 }
 function __values(o) {
-    var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
-    if (m) return m.call(o);
-    if (o && typeof o.length === "number") return {
-        next: function () {
-            if (o && i >= o.length) o = void 0;
-            return { value: o && o[i++], done: !o };
-        }
-    };
-    throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
+  var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
+  if (m) return m.call(o);
+  if (o && typeof o.length === "number") return {
+      next: function () {
+          if (o && i >= o.length) o = void 0;
+          return { value: o && o[i++], done: !o };
+      }
+  };
+  throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
 }
 function __read(o, n) {
-    var m = typeof Symbol === "function" && o[Symbol.iterator];
-    if (!m) return o;
-    var i = m.call(o), r, ar = [], e;
-    try {
-        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
-    }
-    catch (error) { e = { error: error }; }
-    finally {
-        try {
-            if (r && !r.done && (m = i["return"])) m.call(i);
-        }
-        finally { if (e) throw e.error; }
-    }
-    return ar;
+  var m = typeof Symbol === "function" && o[Symbol.iterator];
+  if (!m) return o;
+  var i = m.call(o), r, ar = [], e;
+  try {
+      while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+  }
+  catch (error) { e = { error: error }; }
+  finally {
+      try {
+          if (r && !r.done && (m = i["return"])) m.call(i);
+      }
+      finally { if (e) throw e.error; }
+  }
+  return ar;
 }
+typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
+  var e = new Error(message);
+  return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
+};
 
 const legacyCustomElement = (tagName, clazz) => {
-    window.customElements.define(tagName, clazz);
+    customElements.define(tagName, clazz);
     return clazz;
 };
 const standardCustomElement = (tagName, descriptor) => {
@@ -65,7 +69,7 @@ const standardCustomElement = (tagName, descriptor) => {
         kind,
         elements,
         finisher(clazz) {
-            window.customElements.define(tagName, clazz);
+            customElements.define(tagName, clazz);
         },
     };
 };
@@ -152,7 +156,8 @@ const decorateProperty = ({ finisher, descriptor, }) => (protoOrDescriptor, name
 function eventOptions(options) {
     return decorateProperty({
         finisher: (ctor, name) => {
-            Object.assign(ctor.prototype[name], options);
+            Object.assign(
+            ctor.prototype[name], options);
         },
     });
 }
@@ -197,8 +202,9 @@ function queryAsync(selector) {
     });
 }
 
-var _a$6;
-const slotAssignedElements = ((_a$6 = window.HTMLSlotElement) === null || _a$6 === void 0 ? void 0 : _a$6.prototype.assignedElements) != null
+var _a$5;
+const global$3 = window;
+const slotAssignedElements = ((_a$5 = global$3.HTMLSlotElement) === null || _a$5 === void 0 ? void 0 : _a$5.prototype.assignedElements) != null
     ? (slot, opts) => slot.assignedElements(opts)
     : (slot, opts) => slot
         .assignedNodes(opts)
@@ -929,9 +935,9 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
     style.textContent = '\n' + '[inert] {\n' + '  pointer-events: none;\n' + '  cursor: default;\n' + '}\n' + '\n' + '[inert], [inert] * {\n' + '  -webkit-user-select: none;\n' + '  -moz-user-select: none;\n' + '  -ms-user-select: none;\n' + '  user-select: none;\n' + '}\n';
     node.appendChild(style);
   }
-  if (!Element.prototype.hasOwnProperty('inert')) {
+  if (!HTMLElement.prototype.hasOwnProperty('inert')) {
     var inertManager = new InertManager(document);
-    Object.defineProperty(Element.prototype, 'inert', {
+    Object.defineProperty(HTMLElement.prototype, 'inert', {
       enumerable: true,
       get: function get() {
         return this.hasAttribute('inert');
@@ -1407,25 +1413,37 @@ function matches(element, selector) {
     return nativeMatches.call(element, selector);
 }
 
-const supportsAdoptingStyleSheets = window.ShadowRoot &&
-    (window.ShadyCSS === undefined || window.ShadyCSS.nativeShadow) &&
+const NODE_MODE = false;
+const global$2 = window;
+const supportsAdoptingStyleSheets = global$2.ShadowRoot &&
+    (global$2.ShadyCSS === undefined || global$2.ShadyCSS.nativeShadow) &&
     'adoptedStyleSheets' in Document.prototype &&
     'replace' in CSSStyleSheet.prototype;
 const constructionToken = Symbol();
-const styleSheetCache = new Map();
+const cssTagCache = new WeakMap();
 class CSSResult {
-    constructor(cssText, safeToken) {
+    constructor(cssText, strings, safeToken) {
         this['_$cssResult$'] = true;
         if (safeToken !== constructionToken) {
             throw new Error('CSSResult is not constructable. Use `unsafeCSS` or `css` instead.');
         }
         this.cssText = cssText;
+        this._strings = strings;
     }
     get styleSheet() {
-        let styleSheet = styleSheetCache.get(this.cssText);
+        let styleSheet = this._styleSheet;
+        const strings = this._strings;
         if (supportsAdoptingStyleSheets && styleSheet === undefined) {
-            styleSheetCache.set(this.cssText, (styleSheet = new CSSStyleSheet()));
-            styleSheet.replaceSync(this.cssText);
+            const cacheable = strings !== undefined && strings.length === 1;
+            if (cacheable) {
+                styleSheet = cssTagCache.get(strings);
+            }
+            if (styleSheet === undefined) {
+                (this._styleSheet = styleSheet = new CSSStyleSheet()).replaceSync(this.cssText);
+                if (cacheable) {
+                    cssTagCache.set(strings, styleSheet);
+                }
+            }
         }
         return styleSheet;
     }
@@ -1446,12 +1464,12 @@ const textFromCSSResult = (value) => {
             `to ensure page security.`);
     }
 };
-const unsafeCSS = (value) => new CSSResult(typeof value === 'string' ? value : String(value), constructionToken);
+const unsafeCSS = (value) => new CSSResult(typeof value === 'string' ? value : String(value), undefined, constructionToken);
 const css = (strings, ...values) => {
     const cssText = strings.length === 1
         ? strings[0]
         : values.reduce((acc, v, idx) => acc + textFromCSSResult(v) + strings[idx + 1], strings[0]);
-    return new CSSResult(cssText, constructionToken);
+    return new CSSResult(cssText, strings, constructionToken);
 };
 const adoptStyles = (renderRoot, styles) => {
     if (supportsAdoptingStyleSheets) {
@@ -1460,7 +1478,7 @@ const adoptStyles = (renderRoot, styles) => {
     else {
         styles.forEach((s) => {
             const style = document.createElement('style');
-            const nonce = window['litNonce'];
+            const nonce = global$2['litNonce'];
             if (nonce !== undefined) {
                 style.setAttribute('nonce', nonce);
             }
@@ -1476,23 +1494,25 @@ const cssResultFromStyleSheet = (sheet) => {
     }
     return unsafeCSS(cssText);
 };
-const getCompatibleStyle = supportsAdoptingStyleSheets
+const getCompatibleStyle = supportsAdoptingStyleSheets ||
+    (NODE_MODE )
     ? (s) => s
     : (s) => s instanceof CSSStyleSheet ? cssResultFromStyleSheet(s) : s;
 
-var _a$5, _b$5, _c$2;
-var _d$1;
+var _b$5, _c$2, _d$1;
+var _e;
+const global$1 = window;
 let requestUpdateThenable;
 let issueWarning$2;
-const trustedTypes$1 = window
+const trustedTypes$1 = global$1
     .trustedTypes;
 const emptyStringForBooleanAttribute$1 = trustedTypes$1
     ? trustedTypes$1.emptyScript
     : '';
-const polyfillSupport$2 = window.reactiveElementPolyfillSupportDevMode
+const polyfillSupport$2 = global$1.reactiveElementPolyfillSupportDevMode
     ;
 {
-    const issuedWarnings = ((_a$5 = globalThis.litIssuedWarnings) !== null && _a$5 !== void 0 ? _a$5 : (globalThis.litIssuedWarnings = new Set()));
+    const issuedWarnings = ((_b$5 = global$1.litIssuedWarnings) !== null && _b$5 !== void 0 ? _b$5 : (global$1.litIssuedWarnings = new Set()));
     issueWarning$2 = (code, warning) => {
         warning += ` See https://lit.dev/msg/${code} for more information.`;
         if (!issuedWarnings.has(warning)) {
@@ -1501,7 +1521,7 @@ const polyfillSupport$2 = window.reactiveElementPolyfillSupportDevMode
         }
     };
     issueWarning$2('dev-mode', `Lit is in dev mode. Not recommended for production!`);
-    if (((_b$5 = window.ShadyDOM) === null || _b$5 === void 0 ? void 0 : _b$5.inUse) && polyfillSupport$2 === undefined) {
+    if (((_c$2 = global$1.ShadyDOM) === null || _c$2 === void 0 ? void 0 : _c$2.inUse) && polyfillSupport$2 === undefined) {
         issueWarning$2('polyfill-support-missing', `Shadow DOM is being polyfilled via \`ShadyDOM\` but ` +
             `the \`polyfill-support\` module has not been loaded.`);
     }
@@ -1516,12 +1536,12 @@ const polyfillSupport$2 = window.reactiveElementPolyfillSupportDevMode
     });
 }
 const debugLogEvent$1 = (event) => {
-        const shouldEmit = window
+        const shouldEmit = global$1
             .emitLitDebugLogEvents;
         if (!shouldEmit) {
             return;
         }
-        window.dispatchEvent(new CustomEvent('lit-debug', {
+        global$1.dispatchEvent(new CustomEvent('lit-debug', {
             detail: event,
         }));
     }
@@ -1573,19 +1593,20 @@ const defaultPropertyDeclaration = {
     hasChanged: notEqual,
 };
 const finalized = 'finalized';
-class ReactiveElement extends HTMLElement {
+class ReactiveElement
+ extends HTMLElement {
     constructor() {
         super();
         this.__instanceProperties = new Map();
         this.isUpdatePending = false;
         this.hasUpdated = false;
         this.__reflectingProperty = null;
-        this._initialize();
+        this.__initialize();
     }
     static addInitializer(initializer) {
         var _a;
-        (_a = this._initializers) !== null && _a !== void 0 ? _a : (this._initializers = []);
-        this._initializers.push(initializer);
+        this.finalize();
+        ((_a = this._initializers) !== null && _a !== void 0 ? _a : (this._initializers = [])).push(initializer);
     }
     static get observedAttributes() {
         this.finalize();
@@ -1644,6 +1665,9 @@ class ReactiveElement extends HTMLElement {
         this[finalized] = true;
         const superCtor = Object.getPrototypeOf(this);
         superCtor.finalize();
+        if (superCtor._initializers !== undefined) {
+            this._initializers = [...superCtor._initializers];
+        }
         this.elementProperties = new Map(superCtor.elementProperties);
         this.__attributeToPropertyMap = new Map();
         if (this.hasOwnProperty(JSCompiler_renameProperty('properties'))) {
@@ -1694,7 +1718,7 @@ class ReactiveElement extends HTMLElement {
                     ? name.toLowerCase()
                     : undefined;
     }
-    _initialize() {
+    __initialize() {
         var _a;
         this.__updatePromise = new Promise((res) => (this.enableUpdating = res));
         this._$changedProperties = new Map();
@@ -1744,11 +1768,14 @@ class ReactiveElement extends HTMLElement {
         this._$attributeToProperty(name, value);
     }
     __propertyToAttribute(name, value, options = defaultPropertyDeclaration) {
-        var _a, _b;
+        var _a;
         const attr = this.constructor.__attributeNameForProperty(name, options);
         if (attr !== undefined && options.reflect === true) {
-            const toAttribute = (_b = (_a = options.converter) === null || _a === void 0 ? void 0 : _a.toAttribute) !== null && _b !== void 0 ? _b : defaultConverter.toAttribute;
-            const attrValue = toAttribute(value, options.type);
+            const converter = ((_a = options.converter) === null || _a === void 0 ? void 0 : _a.toAttribute) !==
+                undefined
+                ? options.converter
+                : defaultConverter;
+            const attrValue = converter.toAttribute(value, options.type);
             if (this.constructor.enabledWarnings.indexOf('migration') >= 0 &&
                 attrValue === undefined) {
                 issueWarning$2('undefined-attribute-value', `The attribute value for the ${name} property is ` +
@@ -1767,17 +1794,19 @@ class ReactiveElement extends HTMLElement {
         }
     }
     _$attributeToProperty(name, value) {
-        var _a, _b, _c;
+        var _a;
         const ctor = this.constructor;
         const propName = ctor.__attributeToPropertyMap.get(name);
         if (propName !== undefined && this.__reflectingProperty !== propName) {
             const options = ctor.getPropertyOptions(propName);
-            const converter = options.converter;
-            const fromAttribute = (_c = (_b = (_a = converter) === null || _a === void 0 ? void 0 : _a.fromAttribute) !== null && _b !== void 0 ? _b : (typeof converter === 'function'
-                ? converter
-                : null)) !== null && _c !== void 0 ? _c : defaultConverter.fromAttribute;
+            const converter = typeof options.converter === 'function'
+                ? { fromAttribute: options.converter }
+                : ((_a = options.converter) === null || _a === void 0 ? void 0 : _a.fromAttribute) !== undefined
+                    ? options.converter
+                    : defaultConverter;
             this.__reflectingProperty = propName;
-            this[propName] = fromAttribute(value, options.type);
+            this[propName] = converter.fromAttribute(value, options.type
+            );
             this.__reflectingProperty = null;
         }
     }
@@ -1919,8 +1948,8 @@ class ReactiveElement extends HTMLElement {
     updated(_changedProperties) { }
     firstUpdated(_changedProperties) { }
 }
-_d$1 = finalized;
-ReactiveElement[_d$1] = true;
+_e = finalized;
+ReactiveElement[_e] = true;
 ReactiveElement.elementProperties = new Map();
 ReactiveElement.elementStyles = [];
 ReactiveElement.shadowRootOptions = { mode: 'open' };
@@ -1946,20 +1975,21 @@ polyfillSupport$2 === null || polyfillSupport$2 === void 0 ? void 0 : polyfillSu
         }
     };
 }
-((_c$2 = globalThis.reactiveElementVersions) !== null && _c$2 !== void 0 ? _c$2 : (globalThis.reactiveElementVersions = [])).push('1.3.2');
-if (globalThis.reactiveElementVersions.length > 1) {
+((_d$1 = global$1.reactiveElementVersions) !== null && _d$1 !== void 0 ? _d$1 : (global$1.reactiveElementVersions = [])).push('1.6.3');
+if (global$1.reactiveElementVersions.length > 1) {
     issueWarning$2('multiple-versions', `Multiple versions of Lit loaded. Loading multiple versions ` +
         `is not recommended.`);
 }
 
 var _a$4, _b$4, _c$1, _d;
+const global = window;
 const debugLogEvent = (event) => {
-        const shouldEmit = window
+        const shouldEmit = global
             .emitLitDebugLogEvents;
         if (!shouldEmit) {
             return;
         }
-        window.dispatchEvent(new CustomEvent('lit-debug', {
+        global.dispatchEvent(new CustomEvent('lit-debug', {
             detail: event,
         }));
     }
@@ -1967,23 +1997,23 @@ const debugLogEvent = (event) => {
 let debugLogRenderId = 0;
 let issueWarning$1;
 {
-    (_a$4 = globalThis.litIssuedWarnings) !== null && _a$4 !== void 0 ? _a$4 : (globalThis.litIssuedWarnings = new Set());
+    (_a$4 = global.litIssuedWarnings) !== null && _a$4 !== void 0 ? _a$4 : (global.litIssuedWarnings = new Set());
     issueWarning$1 = (code, warning) => {
         warning += code
             ? ` See https://lit.dev/msg/${code} for more information.`
             : '';
-        if (!globalThis.litIssuedWarnings.has(warning)) {
+        if (!global.litIssuedWarnings.has(warning)) {
             console.warn(warning);
-            globalThis.litIssuedWarnings.add(warning);
+            global.litIssuedWarnings.add(warning);
         }
     };
     issueWarning$1('dev-mode', `Lit is in dev mode. Not recommended for production!`);
 }
-const wrap = ((_b$4 = window.ShadyDOM) === null || _b$4 === void 0 ? void 0 : _b$4.inUse) &&
-    ((_c$1 = window.ShadyDOM) === null || _c$1 === void 0 ? void 0 : _c$1.noPatch) === true
-    ? window.ShadyDOM.wrap
+const wrap = ((_b$4 = global.ShadyDOM) === null || _b$4 === void 0 ? void 0 : _b$4.inUse) &&
+    ((_c$1 = global.ShadyDOM) === null || _c$1 === void 0 ? void 0 : _c$1.noPatch) === true
+    ? global.ShadyDOM.wrap
     : (node) => node;
-const trustedTypes = globalThis.trustedTypes;
+const trustedTypes = global.trustedTypes;
 const policy = trustedTypes
     ? trustedTypes.createPolicy('lit-html', {
         createHTML: (s) => s,
@@ -2009,7 +2039,7 @@ const marker = `lit$${String(Math.random()).slice(9)}$`;
 const markerMatch = '?' + marker;
 const nodeMarker = `<${markerMatch}>`;
 const d = document;
-const createMarker = (v = '') => d.createComment(v);
+const createMarker = () => d.createComment('');
 const isPrimitive = (value) => value === null || (typeof value != 'object' && typeof value != 'function');
 const isArray = Array.isArray;
 const isIterable = (value) => isArray(value) ||
@@ -2055,47 +2085,32 @@ const html = tag(HTML_RESULT);
 const noChange = Symbol.for('lit-noChange');
 const nothing = Symbol.for('lit-nothing');
 const templateCache = new WeakMap();
-const render = (value, container, options) => {
-    var _a, _b;
-    if (container == null) {
-        throw new TypeError(`The container to render into may not be ${container}`);
-    }
-    const renderId = debugLogRenderId++ ;
-    const partOwnerNode = (_a = options === null || options === void 0 ? void 0 : options.renderBefore) !== null && _a !== void 0 ? _a : container;
-    let part = partOwnerNode['_$litPart$'];
-    debugLogEvent === null || debugLogEvent === void 0 ? void 0 : debugLogEvent({
-        kind: 'begin render',
-        id: renderId,
-        value,
-        container,
-        options,
-        part,
-    });
-    if (part === undefined) {
-        const endNode = (_b = options === null || options === void 0 ? void 0 : options.renderBefore) !== null && _b !== void 0 ? _b : null;
-        partOwnerNode['_$litPart$'] = part = new ChildPart(container.insertBefore(createMarker(), endNode), endNode, undefined, options !== null && options !== void 0 ? options : {});
-    }
-    part._$setValue(value);
-    debugLogEvent === null || debugLogEvent === void 0 ? void 0 : debugLogEvent({
-        kind: 'end render',
-        id: renderId,
-        value,
-        container,
-        options,
-        part,
-    });
-    return part;
-};
-{
-    render.setSanitizer = setSanitizer;
-    render.createSanitizer = createSanitizer;
-    {
-        render._testOnlyClearSanitizerFactoryDoNotCallOrElse =
-            _testOnlyClearSanitizerFactoryDoNotCallOrElse;
-    }
-}
 const walker = d.createTreeWalker(d, 129 , null, false);
 let sanitizerFactoryInternal = noopSanitizer;
+function trustFromTemplateString(tsa, stringFromTSA) {
+    if (!Array.isArray(tsa) || !tsa.hasOwnProperty('raw')) {
+        let message = 'invalid template strings array';
+        {
+            message = `
+          Internal Error: expected template strings to be an array
+          with a 'raw' field. Faking a template strings array by
+          calling html or svg like an ordinary function is effectively
+          the same as calling unsafeHtml and can lead to major security
+          issues, e.g. opening your code up to XSS attacks.
+          If you're using the html or svg tagged template functions normally
+          and still seeing this error, please file a bug at
+          https://github.com/lit/lit/issues/new?template=bug_report.md
+          and include information about your build tooling, if any.
+        `
+                .trim()
+                .replace(/\n */g, '\n');
+        }
+        throw new Error(message);
+    }
+    return policy !== undefined
+        ? policy.createHTML(stringFromTSA)
+        : stringFromTSA;
+}
 const getTemplateHtml = (strings, type) => {
     const l = strings.length - 1;
     const attrNames = [];
@@ -2188,32 +2203,7 @@ const getTemplateHtml = (strings, type) => {
                         (attrNameEndIndex === -2 ? (attrNames.push(undefined), i) : end);
     }
     const htmlResult = html + (strings[l] || '<?>') + (type === SVG_RESULT ? '</svg>' : '');
-    if (!Array.isArray(strings) || !strings.hasOwnProperty('raw')) {
-        let message = 'invalid template strings array';
-        {
-            message = `
-          Internal Error: expected template strings to be an array
-          with a 'raw' field. Faking a template strings array by
-          calling html or svg like an ordinary function is effectively
-          the same as calling unsafeHtml and can lead to major security
-          issues, e.g. opening your code up to XSS attacks.
-
-          If you're using the html or svg tagged template functions normally
-          and and still seeing this error, please file a bug at
-          https://github.com/lit/lit/issues/new?template=bug_report.md
-          and include information about your build tooling, if any.
-        `
-                .trim()
-                .replace(/\n */g, '\n');
-        }
-        throw new Error(message);
-    }
-    return [
-        policy !== undefined
-            ? policy.createHTML(htmlResult)
-            : htmlResult,
-        attrNames,
-    ];
+    return [trustFromTemplateString(strings, htmlResult), attrNames];
 };
 class Template {
     constructor(
@@ -2368,7 +2358,7 @@ function resolveDirective(part, value, parent = part, attributeIndex) {
 }
 class TemplateInstance {
     constructor(template, parent) {
-        this._parts = [];
+        this._$parts = [];
         this._$disconnectableChildren = undefined;
         this._$template = template;
         this._$parent = parent;
@@ -2400,7 +2390,7 @@ class TemplateInstance {
                 else if (templatePart.type === ELEMENT_PART) {
                     part = new ElementPart(node, this, options);
                 }
-                this._parts.push(part);
+                this._$parts.push(part);
                 templatePart = parts[++partIndex];
             }
             if (nodeIndex !== (templatePart === null || templatePart === void 0 ? void 0 : templatePart.index)) {
@@ -2408,11 +2398,12 @@ class TemplateInstance {
                 nodeIndex++;
             }
         }
+        walker.currentNode = d;
         return fragment;
     }
     _update(values) {
         let i = 0;
-        for (const part of this._parts) {
+        for (const part of this._$parts) {
             if (part !== undefined) {
                 debugLogEvent === null || debugLogEvent === void 0 ? void 0 : debugLogEvent({
                     kind: 'set part',
@@ -2457,7 +2448,7 @@ class ChildPart {
         let parentNode = wrap(this._$startNode).parentNode;
         const parent = this._$parent;
         if (parent !== undefined &&
-            parentNode.nodeType === 11 ) {
+            (parentNode === null || parentNode === void 0 ? void 0 : parentNode.nodeType) === 11 ) {
             parentNode = parent.parentNode;
         }
         return parentNode;
@@ -2469,6 +2460,7 @@ class ChildPart {
         return this._$endNode;
     }
     _$setValue(value, directiveParent = this) {
+        var _a;
         if (this.parentNode === null) {
             throw new Error(`This \`ChildPart\` has no \`parentNode\` and therefore cannot accept a value. This likely means the element containing the part was manipulated in an unsupported way outside of Lit's control such that the part's marker nodes were ejected from DOM. For example, setting the element's \`innerHTML\` or \`textContent\` can do this.`);
         }
@@ -2495,6 +2487,12 @@ class ChildPart {
             this._commitTemplateResult(value);
         }
         else if (value.nodeType !== undefined) {
+            if (((_a = this.options) === null || _a === void 0 ? void 0 : _a.host) === value) {
+                this._commitText(`[probable mistake: rendered a template's host in itself ` +
+                    `(commonly caused by writing \${this} in a template]`);
+                console.warn(`Attempted to render the template host`, value, `inside itself. This is almost always a mistake, and in dev mode `, `we render some warning text. In production however, we'll `, `render it, which will usually result in an error, and sometimes `, `in the element disappearing from the DOM.`);
+                return;
+            }
             this._commitNode(value);
         }
         else if (isIterable(value)) {
@@ -2504,8 +2502,8 @@ class ChildPart {
             this._commitText(value);
         }
     }
-    _insert(node, ref = this._$endNode) {
-        return wrap(wrap(this._$startNode).parentNode).insertBefore(node, ref);
+    _insert(node) {
+        return wrap(wrap(this._$startNode).parentNode).insertBefore(node, this._$endNode);
     }
     _commitNode(value) {
         var _a;
@@ -2566,7 +2564,7 @@ class ChildPart {
         }
         else {
             {
-                const textNode = document.createTextNode('');
+                const textNode = d.createTextNode('');
                 this._commitNode(textNode);
                 if (this._textSanitizer === undefined) {
                     this._textSanitizer = createSanitizer(textNode, 'data', 'property');
@@ -2589,14 +2587,14 @@ class ChildPart {
         const template = typeof type === 'number'
             ? this._$getTemplate(result)
             : (type.el === undefined &&
-                (type.el = Template.createElement(type.h, this.options)),
+                (type.el = Template.createElement(trustFromTemplateString(type.h, type.h[0]), this.options)),
                 type);
         if (((_a = this._$committedValue) === null || _a === void 0 ? void 0 : _a._$template) === template) {
             debugLogEvent === null || debugLogEvent === void 0 ? void 0 : debugLogEvent({
                 kind: 'template updating',
                 template,
                 instance: this._$committedValue,
-                parts: this._$committedValue._parts,
+                parts: this._$committedValue._$parts,
                 options: this.options,
                 values,
             });
@@ -2609,7 +2607,7 @@ class ChildPart {
                 kind: 'template instantiated',
                 template,
                 instance,
-                parts: instance._parts,
+                parts: instance._$parts,
                 options: this.options,
                 fragment,
                 values,
@@ -2619,7 +2617,7 @@ class ChildPart {
                 kind: 'template instantiated and updated',
                 template,
                 instance,
-                parts: instance._parts,
+                parts: instance._$parts,
                 options: this.options,
                 fragment,
                 values,
@@ -2884,14 +2882,53 @@ class ElementPart {
         resolveDirective(this, value);
     }
 }
-const polyfillSupport$1 = window.litHtmlPolyfillSupportDevMode
+const polyfillSupport$1 = global.litHtmlPolyfillSupportDevMode
     ;
 polyfillSupport$1 === null || polyfillSupport$1 === void 0 ? void 0 : polyfillSupport$1(Template, ChildPart);
-((_d = globalThis.litHtmlVersions) !== null && _d !== void 0 ? _d : (globalThis.litHtmlVersions = [])).push('2.2.4');
-if (globalThis.litHtmlVersions.length > 1) {
+((_d = global.litHtmlVersions) !== null && _d !== void 0 ? _d : (global.litHtmlVersions = [])).push('2.8.0');
+if (global.litHtmlVersions.length > 1) {
     issueWarning$1('multiple-versions', `Multiple versions of Lit loaded. ` +
         `Loading multiple versions is not recommended.`);
 }
+const render = (value, container, options) => {
+    var _a, _b;
+    if (container == null) {
+        throw new TypeError(`The container to render into may not be ${container}`);
+    }
+    const renderId = debugLogRenderId++ ;
+    const partOwnerNode = (_a = options === null || options === void 0 ? void 0 : options.renderBefore) !== null && _a !== void 0 ? _a : container;
+    let part = partOwnerNode['_$litPart$'];
+    debugLogEvent === null || debugLogEvent === void 0 ? void 0 : debugLogEvent({
+        kind: 'begin render',
+        id: renderId,
+        value,
+        container,
+        options,
+        part,
+    });
+    if (part === undefined) {
+        const endNode = (_b = options === null || options === void 0 ? void 0 : options.renderBefore) !== null && _b !== void 0 ? _b : null;
+        partOwnerNode['_$litPart$'] = part = new ChildPart(container.insertBefore(createMarker(), endNode), endNode, undefined, options !== null && options !== void 0 ? options : {});
+    }
+    part._$setValue(value);
+    debugLogEvent === null || debugLogEvent === void 0 ? void 0 : debugLogEvent({
+        kind: 'end render',
+        id: renderId,
+        value,
+        container,
+        options,
+        part,
+    });
+    return part;
+};
+{
+    render.setSanitizer = setSanitizer;
+    render.createSanitizer = createSanitizer;
+    {
+        render._testOnlyClearSanitizerFactoryDoNotCallOrElse =
+            _testOnlyClearSanitizerFactoryDoNotCallOrElse;
+    }
+}
 
 var _a$3, _b$3, _c;
 let issueWarning;
@@ -2967,7 +3004,7 @@ polyfillSupport === null || polyfillSupport === void 0 ? void 0 : polyfillSuppor
         return true;
     };
 }
-((_c = globalThis.litElementVersions) !== null && _c !== void 0 ? _c : (globalThis.litElementVersions = [])).push('3.2.0');
+((_c = globalThis.litElementVersions) !== null && _c !== void 0 ? _c : (globalThis.litElementVersions = [])).push('3.3.3');
 if (globalThis.litElementVersions.length > 1) {
     issueWarning('multiple-versions', `Multiple versions of Lit loaded. Loading multiple versions ` +
         `is not recommended.`);
@@ -4020,6 +4057,9 @@ var MDCRippleFoundation =  (function (_super) {
 }(MDCFoundation));
 var MDCRippleFoundation$1 = MDCRippleFoundation;
 
+const important = 'important';
+const importantFlag = ' !' + important;
+const flagTrim = 0 - importantFlag.length;
 class StyleMapDirective extends Directive {
     constructor(partInfo) {
         var _a;
@@ -4037,9 +4077,11 @@ class StyleMapDirective extends Directive {
             if (value == null) {
                 return style;
             }
-            prop = prop
-                .replace(/(?:^(webkit|moz|ms|o)|)(?=[A-Z])/g, '-$&')
-                .toLowerCase();
+            prop = prop.includes('-')
+                ? prop
+                : prop
+                    .replace(/(?:^(webkit|moz|ms|o)|)(?=[A-Z])/g, '-$&')
+                    .toLowerCase();
             return style + `${prop}:${value};`;
         }, '');
     }
@@ -4067,8 +4109,11 @@ class StyleMapDirective extends Directive {
             const value = styleInfo[name];
             if (value != null) {
                 this._previousStyleProperties.add(name);
-                if (name.includes('-')) {
-                    style.setProperty(name, value);
+                const isImportant = typeof value === 'string' && value.endsWith(importantFlag);
+                if (name.includes('-') || isImportant) {
+                    style.setProperty(name, isImportant
+                        ? value.slice(0, flagTrim)
+                        : value, isImportant ? important : '');
                 }
                 else {
                     style[name] = value;