@neuronet.io/vido - npm Package Compare versions

Comparing version 3.2.11 to 4.0.0

dist/ActionsCollector.js

@@ -1,23 +0,15 @@
-import { Directive } from 'lit-html-optimised';
+import { Directive } from 'lit-html/directive';
+import { nothing } from 'lit-html';
 export default function getActionsCollector(actionsByInstance) {
     return class ActionsCollector extends Directive {
-        constructor(instance) {
-            super();
-            this.actions = [];
-            this.instance = instance;
-        }
-        set(actions, props) {
-            this.actions = actions;
-            this.props = props;
-            // props must be mutable! (do not do this -> {...props})
-            // because we will modify action props with onChange and can reuse existin instance
-            return this;
-        }
-        body(part) {
-            const element = part.committer.element;
-            for (const create of this.actions) {
+        update(part, props) {
+            const element = part.element;
+            const instance = props[0];
+            const actions = props[1];
+            const actionProps = props[2];
+            for (const create of actions) {
                 if (typeof create !== 'undefined') {
                     let exists;
-                    if (actionsByInstance.has(this.instance)) {
-                        for (const action of actionsByInstance.get(this.instance)) {
+                    if (actionsByInstance.has(instance)) {
+                        for (const action of actionsByInstance.get(instance)) {
                             if (action.componentAction.create === create && action.element === element) {
@@ -38,12 +30,12 @@ exists = action;
                         };
-                        const action = { instance: this.instance, componentAction, element, props: this.props };
+                        const action = { instance: instance, componentAction, element, props: actionProps };
                         let byInstance = [];
-                        if (actionsByInstance.has(this.instance)) {
-                            byInstance = actionsByInstance.get(this.instance);
+                        if (actionsByInstance.has(instance)) {
+                            byInstance = actionsByInstance.get(instance);
                         }
                         byInstance.push(action);
-                        actionsByInstance.set(this.instance, byInstance);
+                        actionsByInstance.set(instance, byInstance);
                     }
                     else {
-                        exists.props = this.props;
+                        exists.props = actionProps;
                     }
@@ -53,3 +45,6 @@ }
         }
+        render(instance, actions, props) {
+            return nothing;
+        }
     };
 }

dist/Detach.js

@@ -1,11 +0,18 @@
-import { Directive } from 'lit-html-optimised';
+import { nothing } from 'lit-html';
+import { Directive } from 'lit-html/directive';
 const detached = new WeakMap();
 export default class Detach extends Directive {
-    constructor(ifFn) {
-        super();
+    constructor() {
+        super(...arguments);
+        this.ifFn = () => false;
+    }
+    set(ifFn) {
         this.ifFn = ifFn;
     }
-    body(part) {
+    render() {
+        return nothing;
+    }
+    update(part) {
         const detach = this.ifFn();
-        const element = part.committer.element;
+        const element = part.element;
         if (detach) {
@@ -37,3 +44,4 @@ if (!detached.has(part)) {
         }
+        return this.render();
     }
 }

dist/GetElement.js

@@ -1,7 +0,13 @@
-export default function prepareGetElement(directive) {
-    return function getElement(callback) {
-        return directive(() => (part) => {
-            callback(part.committer.element);
-        })();
-    };
+import { Directive } from 'lit-html/directive';
+export default class GetElementDirective extends Directive {
+    update(part, props) {
+        const callback = props[0];
+        if (typeof callback !== 'function') {
+            throw new Error('[vido] Argument for getElement directive should be a function.');
+        }
+        callback(part.element);
+    }
+    render() {
+        return null;
+    }
 }

dist/StyleMap.js

@@ -1,33 +0,26 @@
-import { Directive } from 'lit-html-optimised';
+import { Directive } from 'lit-html/directive';
 export default class StyleMap extends Directive {
-    constructor(styleInfo, detach = false) {
-        super();
+    constructor() {
+        super(...arguments);
+        this.style = {};
+        this.previous = {};
+        this.detach = false;
         this.toRemove = [];
         this.toUpdate = [];
         this.debug = false;
+    }
+    update(part, props) {
+        var _a;
         this.previous = {};
-        this.style = styleInfo;
-        this.detach = detach;
-    }
-    setStyle(styleInfo) {
-        this.style = styleInfo;
-    }
-    setDebug(debug = true) {
-        this.debug = debug;
-    }
-    setDetach(detach) {
-        this.detach = detach;
-    }
-    body(part) {
+        this.style = props[0];
+        this.detach = (_a = props[1]) !== null && _a !== void 0 ? _a : false;
         this.toRemove.length = 0;
         this.toUpdate.length = 0;
-        // @ts-ignore
-        const element = part.committer.element;
+        const element = part.element;
         const elementStyle = element.style;
         let previous = this.previous;
-        if (element.attributes.getNamedItem('style')) {
-            // @ts-ignore
-            const currentElementStyles = element.attributes
-                .getNamedItem('style')
-                .value.split(';')
+        const namedItem = element.attributes.getNamedItem('style');
+        if (namedItem) {
+            const currentElementStyles = namedItem.value
+                .split(';')
                 .map((item) => item.substr(0, item.indexOf(':')).trim())
@@ -100,3 +93,15 @@ .filter((item) => !!item);
         }
+        return this.render(this.style, this.detach);
     }
+    render(styleMap, detach = false) { }
+    setStyle(styleInfo) {
+        this.style = styleInfo;
+    }
+    setDebug(debug = true) {
+        this.debug = debug;
+    }
+    setDetach(detach) {
+        this.detach = detach;
+    }
+    body(part) { }
 }

dist/vido.esm.min.js

 /**
  * @license
- * Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
- * This code may only be used under the BSD style license found at
- * http://polymer.github.io/LICENSE.txt
- * The complete set of authors may be found at
- * http://polymer.github.io/AUTHORS.txt
- * The complete set of contributors may be found at
- * http://polymer.github.io/CONTRIBUTORS.txt
- * Code distributed by Google as part of the polymer project is also
- * subject to an additional IP rights grant found at
- * http://polymer.github.io/PATENTS.txt
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
  */
-const t=t=>(...e)=>{const n=t(...e);return n.isDirective=!0,n};class e{constructor(){this.isDirective=!0,this.isClass=!0}body(t){}}const n=t=>null!=t&&"boolean"==typeof t.isDirective,s="undefined"!=typeof window&&null!=window.customElements&&void 0!==window.customElements.polyfillWrapFlushCallback,o=(t,e,n=null,s=null)=>{for(;e!==n;){const n=e.nextSibling;t.insertBefore(e,s),e=n}},i=(t,e,n=null)=>{for(;e!==n;){const n=e.nextSibling;t.removeChild(e),e=n}},r={},a={},l=`{{lit-${String(Math.random()).slice(2)}}}`,c=`\x3c!--${l}--\x3e`,h=new RegExp(`${l}|${c}`);
+var t;const e=globalThis.trustedTypes,s=e?e.createPolicy("lit-html",{createHTML:t=>t}):void 0,n=`lit$${(Math.random()+"").slice(9)}$`,i="?"+n,o=`<${i}>`,r=document,h=(t="")=>r.createComment(t),l=t=>null===t||"object"!=typeof t&&"function"!=typeof t,c=Array.isArray,a=t=>{var e;return c(t)||"function"==typeof(null===(e=t)||void 0===e?void 0:e[Symbol.iterator])},d=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,u=/-->/g,p=/>/g,v=/>|[ 	\n\r](?:([^\s"'>=/]+)([ 	\n\r]*=[ 	\n\r]*(?:[^ 	\n\r"'`<>=]|("|')|))|$)/g,f=/'/g,m=/"/g,g=/^(?:script|style|textarea)$/i,y=t=>(e,...s)=>({_$litType$:t,strings:e,values:s}),$=y(1),A=y(2),_=Symbol.for("lit-noChange"),b=Symbol.for("lit-nothing"),x=new WeakMap,C=(t,e,s)=>{var n,i;const o=null!==(n=null==s?void 0:s.renderBefore)&&void 0!==n?n:e;let r=o._$litPart$;if(void 0===r){const t=null!==(i=null==s?void 0:s.renderBefore)&&void 0!==i?i:null;o._$litPart$=r=new P(e.insertBefore(h(),t),t,void 0,null!=s?s:{})}return r._$AI(t),r},w=r.createTreeWalker(r,129,null,!1),M=(t,e)=>{const i=t.length-1,r=[];let h,l=2===e?"<svg>":"",c=d;for(let e=0;e<i;e++){const s=t[e];let i,a,y=-1,$=0;for(;$<s.length&&(c.lastIndex=$,a=c.exec(s),null!==a);)$=c.lastIndex,c===d?"!--"===a[1]?c=u:void 0!==a[1]?c=p:void 0!==a[2]?(g.test(a[2])&&(h=RegExp("</"+a[2],"g")),c=v):void 0!==a[3]&&(c=v):c===v?">"===a[0]?(c=null!=h?h:d,y=-1):void 0===a[1]?y=-2:(y=c.lastIndex-a[2].length,i=a[1],c=void 0===a[3]?v:'"'===a[3]?m:f):c===m||c===f?c=v:c===u||c===p?c=d:(c=v,h=void 0);const A=c===v&&t[e+1].startsWith("/>")?" ":"";l+=c===d?s+o:y>=0?(r.push(i),s.slice(0,y)+"$lit$"+s.slice(y)+n+A):s+n+(-2===y?(r.push(void 0),e):A)}const a=l+(t[i]||"<?>")+(2===e?"</svg>":"");return[void 0!==s?s.createHTML(a):a,r]};class I{constructor({strings:t,_$litType$:s},o){let r;this.parts=[];let l=0,c=0;const a=t.length-1,d=this.parts,[u,p]=M(t,s);if(this.el=I.createElement(u,o),w.currentNode=this.el.content,2===s){const t=this.el.content,e=t.firstChild;e.remove(),t.append(...e.childNodes)}for(;null!==(r=w.nextNode())&&d.length<a;){if(1===r.nodeType){if(r.hasAttributes()){const t=[];for(const e of r.getAttributeNames())if(e.endsWith("$lit$")||e.startsWith(n)){const s=p[c++];if(t.push(e),void 0!==s){const t=r.getAttribute(s.toLowerCase()+"$lit$").split(n),e=/([.?@])?(.*)/.exec(s);d.push({type:1,index:l,name:e[2],strings:t,ctor:"."===e[1]?T:"?"===e[1]?H:"@"===e[1]?N:E})}else d.push({type:6,index:l})}for(const e of t)r.removeAttribute(e)}if(g.test(r.tagName)){const t=r.textContent.split(n),s=t.length-1;if(s>0){r.textContent=e?e.emptyScript:"";for(let e=0;e<s;e++)r.append(t[e],h()),w.nextNode(),d.push({type:2,index:++l});r.append(t[s],h())}}}else if(8===r.nodeType)if(r.data===i)d.push({type:2,index:l});else{let t=-1;for(;-1!==(t=r.data.indexOf(n,t+1));)d.push({type:7,index:l}),t+=n.length-1}l++}}static createElement(t,e){const s=r.createElement("template");return s.innerHTML=t,s}}function Y(t,e,s=t,n){var i,o,r,h;if(e===_)return e;let c=void 0!==n?null===(i=s._$Cl)||void 0===i?void 0:i[n]:s._$Cu;const a=l(e)?void 0:e._$litDirective$;return(null==c?void 0:c.constructor)!==a&&(null===(o=null==c?void 0:c._$AO)||void 0===o||o.call(c,!1),void 0===a?c=void 0:(c=new a(t),c._$AT(t,s,n)),void 0!==n?(null!==(r=(h=s)._$Cl)&&void 0!==r?r:h._$Cl=[])[n]=c:s._$Cu=c),void 0!==c&&(e=Y(t,c._$AS(t,e.values),c,n)),e}class X{constructor(t,e){this.v=[],this._$AN=void 0,this._$AD=t,this._$AM=e}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}p(t){var e;const{el:{content:s},parts:n}=this._$AD,i=(null!==(e=null==t?void 0:t.creationScope)&&void 0!==e?e:r).importNode(s,!0);w.currentNode=i;let o=w.nextNode(),h=0,l=0,c=n[0];for(;void 0!==c;){if(h===c.index){let e;2===c.type?e=new P(o,o.nextSibling,this,t):1===c.type?e=new c.ctor(o,c.name,c.strings,this,t):6===c.type&&(e=new S(o,this,t)),this.v.push(e),c=n[++l]}h!==(null==c?void 0:c.index)&&(o=w.nextNode(),h++)}return i}m(t){let e=0;for(const s of this.v)void 0!==s&&(void 0!==s.strings?(s._$AI(t,s,e),e+=s.strings.length-2):s._$AI(t[e])),e++}}class P{constructor(t,e,s,n){var i;this.type=2,this._$AH=b,this._$AN=void 0,this._$AA=t,this._$AB=e,this._$AM=s,this.options=n,this._$Cg=null===(i=null==n?void 0:n.isConnected)||void 0===i||i}get _$AU(){var t,e;return null!==(e=null===(t=this._$AM)||void 0===t?void 0:t._$AU)&&void 0!==e?e:this._$Cg}get parentNode(){let t=this._$AA.parentNode;const e=this._$AM;return void 0!==e&&11===t.nodeType&&(t=e.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,e=this){t=Y(this,t,e),l(t)?t===b||null==t||""===t?(this._$AH!==b&&this._$AR(),this._$AH=b):t!==this._$AH&&t!==_&&this.$(t):void 0!==t._$litType$?this.T(t):void 0!==t.nodeType?this.S(t):a(t)?this.M(t):this.$(t)}A(t,e=this._$AB){return this._$AA.parentNode.insertBefore(t,e)}S(t){this._$AH!==t&&(this._$AR(),this._$AH=this.A(t))}$(t){this._$AH!==b&&l(this._$AH)?this._$AA.nextSibling.data=t:this.S(r.createTextNode(t)),this._$AH=t}T(t){var e;const{values:s,_$litType$:n}=t,i="number"==typeof n?this._$AC(t):(void 0===n.el&&(n.el=I.createElement(n.h,this.options)),n);if((null===(e=this._$AH)||void 0===e?void 0:e._$AD)===i)this._$AH.m(s);else{const t=new X(i,this),e=t.p(this.options);t.m(s),this.S(e),this._$AH=t}}_$AC(t){let e=x.get(t.strings);return void 0===e&&x.set(t.strings,e=new I(t)),e}M(t){c(this._$AH)||(this._$AH=[],this._$AR());const e=this._$AH;let s,n=0;for(const i of t)n===e.length?e.push(s=new P(this.A(h()),this.A(h()),this,this.options)):s=e[n],s._$AI(i),n++;n<e.length&&(this._$AR(s&&s._$AB.nextSibling,n),e.length=n)}_$AR(t=this._$AA.nextSibling,e){var s;for(null===(s=this._$AP)||void 0===s||s.call(this,!1,!0,e);t&&t!==this._$AB;){const e=t.nextSibling;t.remove(),t=e}}setConnected(t){var e;void 0===this._$AM&&(this._$Cg=t,null===(e=this._$AP)||void 0===e||e.call(this,t))}}class E{constructor(t,e,s,n,i){this.type=1,this._$AH=b,this._$AN=void 0,this.element=t,this.name=e,this._$AM=n,this.options=i,s.length>2||""!==s[0]||""!==s[1]?(this._$AH=Array(s.length-1).fill(new String),this.strings=s):this._$AH=b}get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}_$AI(t,e=this,s,n){const i=this.strings;let o=!1;if(void 0===i)t=Y(this,t,e,0),o=!l(t)||t!==this._$AH&&t!==_,o&&(this._$AH=t);else{const n=t;let r,h;for(t=i[0],r=0;r<i.length-1;r++)h=Y(this,n[s+r],e,r),h===_&&(h=this._$AH[r]),o||(o=!l(h)||h!==this._$AH[r]),h===b?t=b:t!==b&&(t+=(null!=h?h:"")+i[r+1]),this._$AH[r]=h}o&&!n&&this.k(t)}k(t){t===b?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,null!=t?t:"")}}class T extends E{constructor(){super(...arguments),this.type=3}k(t){this.element[this.name]=t===b?void 0:t}}class H extends E{constructor(){super(...arguments),this.type=4}k(t){t&&t!==b?this.element.setAttribute(this.name,""):this.element.removeAttribute(this.name)}}class N extends E{constructor(t,e,s,n,i){super(t,e,s,n,i),this.type=5}_$AI(t,e=this){var s;if((t=null!==(s=Y(this,t,e,0))&&void 0!==s?s:b)===_)return;const n=this._$AH,i=t===b&&n!==b||t.capture!==n.capture||t.once!==n.once||t.passive!==n.passive,o=t!==b&&(n===b||i);i&&this.element.removeEventListener(this.name,this,n),o&&this.element.addEventListener(this.name,this,t),this._$AH=t}handleEvent(t){var e,s;"function"==typeof this._$AH?this._$AH.call(null!==(s=null===(e=this.options)||void 0===e?void 0:e.host)&&void 0!==s?s:this.element,t):this._$AH.handleEvent(t)}}class S{constructor(t,e,s){this.element=t,this.type=6,this._$AN=void 0,this._$AM=e,this.options=s}get _$AU(){return this._$AM._$AU}_$AI(t){Y(this,t)}}const L={P:"$lit$",V:n,L:i,I:1,N:M,R:X,D:a,j:Y,H:P,O:E,F:H,B:N,W:T,Z:S},D=window.litHtmlPolyfillSupport;null==D||D(I,P),(null!==(t=globalThis.litHtmlVersions)&&void 0!==t?t:globalThis.litHtmlVersions=[]).push("2.0.1");var U=Object.freeze({__proto__:null,_$LH:L,html:$,noChange:_,nothing:b,render:C,svg:A});
 /**
  * @license
- * Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
- * This code may only be used under the BSD style license found at
- * http://polymer.github.io/LICENSE.txt
- * The complete set of authors may be found at
- * http://polymer.github.io/AUTHORS.txt
- * The complete set of contributors may be found at
- * http://polymer.github.io/CONTRIBUTORS.txt
- * Code distributed by Google as part of the polymer project is also
- * subject to an additional IP rights grant found at
- * http://polymer.github.io/PATENTS.txt
- */class d{constructor(t,e){this.parts=[],this.element=e;const n=[],s=[],o=document.createTreeWalker(e.content,133,null,!1);let i=0,r=-1,a=0;const{strings:c,values:{length:d}}=t;for(;a<d;){const t=o.nextNode();if(null!==t){if(r++,1===t.nodeType){if(t.hasAttributes()){const e=t.attributes,{length:n}=e;let s=0;for(let t=0;t<n;t++)p(e[t].name,"$lit$")&&s++;for(;s-- >0;){const e=c[a],n=f.exec(e)[2],s=n.toLowerCase()+"$lit$",o=t.getAttribute(s);t.removeAttribute(s);const i=o.split(h);this.parts.push({type:"attribute",index:r,name:n,strings:i}),a+=i.length-1}}"TEMPLATE"===t.tagName&&(s.push(t),o.currentNode=t.content)}else if(3===t.nodeType){const e=t.data;if(e.indexOf(l)>=0){const s=t.parentNode,o=e.split(h),i=o.length-1;for(let e=0;e<i;e++){let n,i=o[e];if(""===i)n=v();else{const t=f.exec(i);null!==t&&p(t[2],"$lit$")&&(i=i.slice(0,t.index)+t[1]+t[2].slice(0,-"$lit$".length)+t[3]),n=document.createTextNode(i)}s.insertBefore(n,t),this.parts.push({type:"node",index:++r})}""===o[i]?(s.insertBefore(v(),t),n.push(t)):t.data=o[i],a+=i}}else if(8===t.nodeType)if(t.data===l){const e=t.parentNode;null!==t.previousSibling&&r!==i||(r++,e.insertBefore(v(),t)),i=r,this.parts.push({type:"node",index:r}),null===t.nextSibling?t.data="":(n.push(t),r--),a++}else{let e=-1;for(;-1!==(e=t.data.indexOf(l,e+1));)this.parts.push({type:"node",index:-1}),a++}}else o.currentNode=s.pop()}for(const t of n)t.parentNode.removeChild(t)}}const p=(t,e)=>{const n=t.length-e.length;return n>=0&&t.slice(n)===e},u=t=>-1!==t.index,m=document.createComment(""),v=()=>m.cloneNode(),f=/([ \x09\x0a\x0c\x0d])([^\0-\x1F\x7F-\x9F "'>=/]+)([ \x09\x0a\x0c\x0d]*=[ \x09\x0a\x0c\x0d]*(?:[^ \x09\x0a\x0c\x0d"'`<>=]*|"[^"]*|'[^']*))$/;
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */const k=1,B=2,W=3,O=4,j=t=>(...e)=>({_$litDirective$:t,values:e});class z{constructor(t){}get _$AU(){return this._$AM._$AU}_$AT(t,e,s){this._$Ct=t,this._$AM=e,this._$Ci=s}_$AS(t,e){return this.update(t,e)}update(t,e){return this.render(...e)}}
 /**
  * @license
- * Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
- * This code may only be used under the BSD style license found at
- * http://polymer.github.io/LICENSE.txt
- * The complete set of authors may be found at
- * http://polymer.github.io/AUTHORS.txt
- * The complete set of contributors may be found at
- * http://polymer.github.io/CONTRIBUTORS.txt
- * Code distributed by Google as part of the polymer project is also
- * subject to an additional IP rights grant found at
- * http://polymer.github.io/PATENTS.txt
- */
-class g{constructor(t,e,n){this.__parts=[],this.template=t,this.processor=e,this.options=n}update(t){let e=0;for(const n of this.__parts)void 0!==n&&n.setValue(t[e]),e++;for(const t of this.__parts)void 0!==t&&t.commit()}_clone(){const t=s?this.template.element.content.cloneNode(!0):document.importNode(this.template.element.content,!0),e=[],n=this.template.parts,o=document.createTreeWalker(t,133,null,!1);let i,r=0,a=0,l=o.nextNode();for(;r<n.length;)if(i=n[r],u(i)){for(;a<i.index;)a++,"TEMPLATE"===l.nodeName&&(e.push(l),o.currentNode=l.content),null===(l=o.nextNode())&&(o.currentNode=e.pop(),l=o.nextNode());if("node"===i.type){const t=this.processor.handleTextExpression(this.options);t.insertAfterNode(l.previousSibling),this.__parts.push(t)}else this.__parts.push(...this.processor.handleAttributeExpressions(l,i.name,i.strings,this.options));r++}else this.__parts.push(void 0),r++;return s&&(document.adoptNode(t),customElements.upgrade(t)),t}}
+ * Copyright 2020 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */const{H:F}=L,R=(t,e)=>{var s,n;return void 0===e?void 0!==(null===(s=t)||void 0===s?void 0:s._$litType$):(null===(n=t)||void 0===n?void 0:n._$litType$)===e},V=t=>void 0===t.strings,G=()=>document.createComment(""),K=(t,e,s)=>{var n;const i=t._$AA.parentNode,o=void 0===e?t._$AB:e._$AA;if(void 0===s){const e=i.insertBefore(G(),o),n=i.insertBefore(G(),o);s=new F(e,n,t,t.options)}else{const e=s._$AB.nextSibling,r=s._$AM,h=r!==t;if(h){let e;null===(n=s._$AQ)||void 0===n||n.call(s,t),s._$AM=t,void 0!==s._$AP&&(e=t._$AU)!==r._$AU&&s._$AP(e)}if(e!==o||h){let t=s._$AA;for(;t!==e;){const e=t.nextSibling;i.insertBefore(t,o),t=e}}}return s},q=(t,e,s=t)=>(t._$AI(e,s),t),Z={},J=(t,e=Z)=>t._$AH=e,Q=t=>t._$AH,tt=t=>{var e;null===(e=t._$AP)||void 0===e||e.call(t,!1,!0);let s=t._$AA;const n=t._$AB.nextSibling;for(;s!==n;){const t=s.nextSibling;s.remove(),s=t}},et=t=>{t._$AR()},st=(t,e)=>{var s,n;const i=t._$AN;if(void 0===i)return!1;for(const t of i)null===(n=(s=t)._$AO)||void 0===n||n.call(s,e,!1),st(t,e);return!0},nt=t=>{let e,s;do{if(void 0===(e=t._$AM))break;s=e._$AN,s.delete(t),t=e}while(0===(null==s?void 0:s.size))},it=t=>{for(let e;e=t._$AM;t=e){let s=e._$AN;if(void 0===s)e._$AN=s=new Set;else if(s.has(t))break;s.add(t),ht(e)}};
 /**
  * @license
- * Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
- * This code may only be used under the BSD style license found at
- * http://polymer.github.io/LICENSE.txt
- * The complete set of authors may be found at
- * http://polymer.github.io/AUTHORS.txt
- * The complete set of contributors may be found at
- * http://polymer.github.io/CONTRIBUTORS.txt
- * Code distributed by Google as part of the polymer project is also
- * subject to an additional IP rights grant found at
- * http://polymer.github.io/PATENTS.txt
- */const y=window.trustedTypes&&trustedTypes.createPolicy("lit-html",{createHTML:t=>t}),b=` ${l} `,x=document.createElement("template");class _{constructor(t,e,n,s){this.strings=t,this.values=e,this.type=n,this.processor=s}getHTML(){const t=this.strings.length-1;let e="",n=!1;for(let s=0;s<t;s++){const t=this.strings[s],o=t.lastIndexOf("\x3c!--");n=(o>-1||n)&&-1===t.indexOf("--\x3e",o+1);const i=f.exec(t);e+=null===i?t+(n?b:c):t.substr(0,i.index)+i[1]+i[2]+"$lit$"+i[3]+l}return e+=this.strings[t],e}getTemplateElement(){const t=x.cloneNode();let e=this.getHTML();return void 0!==y&&(e=y.createHTML(e)),t.innerHTML=e,t}}class w extends _{getHTML(){return`<svg>${super.getHTML()}</svg>`}getTemplateElement(){const t=super.getTemplateElement(),e=t.content,n=e.firstChild;return e.removeChild(n),o(e,n.firstChild),t}}
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */function ot(t){void 0!==this._$AN?(nt(this),this._$AM=t,it(this)):this._$AM=t}function rt(t,e=!1,s=0){const n=this._$AH,i=this._$AN;if(void 0!==i&&0!==i.size)if(e)if(Array.isArray(n))for(let t=s;t<n.length;t++)st(n[t],!1),nt(n[t]);else null!=n&&(st(n,!1),nt(n));else st(this,t)}const ht=t=>{var e,s,n,i;t.type==B&&(null!==(e=(n=t)._$AP)&&void 0!==e||(n._$AP=rt),null!==(s=(i=t)._$AQ)&&void 0!==s||(i._$AQ=ot))};class lt extends z{constructor(){super(...arguments),this._$AN=void 0}_$AT(t,e,s){super._$AT(t,e,s),it(this),this.isConnected=t._$AU}_$AO(t,e=!0){var s,n;t!==this.isConnected&&(this.isConnected=t,t?null===(s=this.reconnected)||void 0===s||s.call(this):null===(n=this.disconnected)||void 0===n||n.call(this)),e&&(st(this,t),nt(this))}setValue(t){if(V(this._$Ct))this._$Ct._$AI(t,this);else{const e=[...this._$Ct._$AH];e[this._$Ci]=t,this._$Ct._$AI(e,this,0)}}disconnected(){}reconnected(){}}
 /**
  * @license
- * Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
- * This code may only be used under the BSD style license found at
- * http://polymer.github.io/LICENSE.txt
- * The complete set of authors may be found at
- * http://polymer.github.io/AUTHORS.txt
- * The complete set of contributors may be found at
- * http://polymer.github.io/CONTRIBUTORS.txt
- * Code distributed by Google as part of the polymer project is also
- * subject to an additional IP rights grant found at
- * http://polymer.github.io/PATENTS.txt
- */const N=t=>null===t||!("object"==typeof t||"function"==typeof t),E=t=>Array.isArray(t)||!(!t||!t[Symbol.iterator]),I=document.createTextNode("");class P{constructor(t,e,n){this.dirty=!0,this.element=t,this.name=e,this.strings=n,this.parts=[];for(let t=0;t<n.length-1;t++)this.parts[t]=this._createPart()}_createPart(){return new A(this)}_getValue(){const t=this.strings,e=t.length-1,n=this.parts;if(1===e&&""===t[0]&&""===t[1]){const t=n[0].value;if("symbol"==typeof t)return String(t);if("string"==typeof t||!E(t))return t}let s="";for(let o=0;o<e;o++){s+=t[o];const e=n[o];if(void 0!==e){const t=e.value;if(N(t)||!E(t))s+="string"==typeof t?t:String(t);else for(const e of t)s+="string"==typeof e?e:String(e)}}return s+=t[e],s}commit(){this.dirty&&(this.dirty=!1,this.element.setAttribute(this.name,this._getValue()))}}class A{constructor(t){this.value=void 0,this.committer=t}setValue(t){t===r||N(t)&&t===this.value||(this.value=t,n(t)||(this.committer.dirty=!0))}commit(){for(;n(this.value);){const t=this.value;this.value=r,t.isClass?t.body(this):t(this)}this.value!==r&&this.committer.commit()}}class M{constructor(t){this.value=void 0,this.__pendingValue=void 0,this.options=t}appendInto(t){this.startNode=t.appendChild(v()),this.endNode=t.appendChild(v())}insertAfterNode(t){this.startNode=t,this.endNode=t.nextSibling}appendIntoPart(t){t.__insert(this.startNode=v()),t.__insert(this.endNode=v())}insertAfterPart(t){t.__insert(this.startNode=v()),this.endNode=t.endNode,t.endNode=this.startNode}setValue(t){this.__pendingValue=t}commit(){if(null===this.startNode.parentNode)return;for(;n(this.__pendingValue);){const t=this.__pendingValue;this.__pendingValue=r,t.isClass?t.body(this):t(this)}const t=this.__pendingValue;t!==r&&(N(t)?t!==this.value&&this.__commitText(t):t instanceof _?this.__commitTemplateResult(t):t instanceof Node?this.__commitNode(t):E(t)?this.__commitIterable(t):t===a?(this.value=a,this.clear()):this.__commitText(t))}__insert(t){this.endNode.parentNode.insertBefore(t,this.endNode)}__commitNode(t){this.value!==t&&(this.clear(),this.__insert(t),this.value=t)}__commitText(t){const e=this.startNode.nextSibling,n="string"==typeof(t=null==t?"":t)?t:String(t);if(e===this.endNode.previousSibling&&3===e.nodeType)e.data=n;else{const t=I.cloneNode();t.textContent=n,this.__commitNode(t)}this.value=t}__commitTemplateResult(t){const e=this.options.templateFactory(t);if(this.value instanceof g&&this.value.template===e)this.value.update(t.values);else{const n=new g(e,t.processor,this.options),s=n._clone();n.update(t.values),this.__commitNode(s),this.value=n}}__commitIterable(t){Array.isArray(this.value)||(this.value=[],this.clear());const e=this.value;let n,s=0;for(const o of t)n=e[s],void 0===n&&(n=new M(this.options),e.push(n),0===s?n.appendIntoPart(this):n.insertAfterPart(e[s-1])),n.setValue(o),n.commit(),s++;s<e.length&&(e.length=s,this.clear(n&&n.endNode))}clear(t=this.startNode){i(this.startNode.parentNode,t.nextSibling,this.endNode)}}class C{constructor(t,e,n){if(this.value=void 0,this.__pendingValue=void 0,2!==n.length||""!==n[0]||""!==n[1])throw new Error("Boolean attributes can only contain a single expression");this.element=t,this.name=e,this.strings=n}setValue(t){this.__pendingValue=t}commit(){for(;n(this.__pendingValue);){const t=this.__pendingValue;this.__pendingValue=r,t.isClass?t.body(this):t(this)}if(this.__pendingValue===r)return;const t=!!this.__pendingValue;this.value!==t&&(t?this.element.setAttribute(this.name,""):this.element.removeAttribute(this.name),this.value=t),this.__pendingValue=r}}class X extends P{constructor(t,e,n){super(t,e,n),this.single=2===n.length&&""===n[0]&&""===n[1]}_createPart(){return new Y(this)}_getValue(){return this.single?this.parts[0].value:super._getValue()}commit(){this.dirty&&(this.dirty=!1,this.element[this.name]=this._getValue())}}class Y extends A{}let T=!1;(()=>{try{const t={get capture(){return T=!0,!1}};window.addEventListener("test",t,t),window.removeEventListener("test",t,t)}catch(t){}})();class S{constructor(t,e,n){this.value=void 0,this.__pendingValue=void 0,this.element=t,this.eventName=e,this.eventContext=n,this.__boundHandleEvent=t=>this.handleEvent(t)}setValue(t){this.__pendingValue=t}commit(){for(;n(this.__pendingValue);){const t=this.__pendingValue;this.__pendingValue=r,t.isClass?t.body(this):t(this)}if(this.__pendingValue===r)return;const t=this.__pendingValue,e=this.value,s=null==t||null!=e&&(t.capture!==e.capture||t.once!==e.once||t.passive!==e.passive),o=null!=t&&(null==e||s);s&&this.element.removeEventListener(this.eventName,this.__boundHandleEvent,this.__options),o&&(this.__options=V(t),this.element.addEventListener(this.eventName,this.__boundHandleEvent,this.__options)),this.value=t,this.__pendingValue=r}handleEvent(t){"function"==typeof this.value?this.value.call(this.eventContext||this.element,t):this.value.handleEvent(t)}}const V=t=>t&&(T?{capture:t.capture,passive:t.passive,once:t.once}:t.capture)
+ * Copyright 2021 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */class ct{constructor(t){this.U=t}disconnect(){this.U=void 0}reconnect(t){this.U=t}deref(){return this.U}}class at{constructor(){this.Y=void 0,this.q=void 0}get(){return this.Y}pause(){var t;null!==(t=this.Y)&&void 0!==t||(this.Y=new Promise(t=>this.q=t))}resume(){var t;null===(t=this.q)||void 0===t||t.call(this),this.Y=this.q=void 0}}
 /**
  * @license
- * Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
- * This code may only be used under the BSD style license found at
- * http://polymer.github.io/LICENSE.txt
- * The complete set of authors may be found at
- * http://polymer.github.io/AUTHORS.txt
- * The complete set of contributors may be found at
- * http://polymer.github.io/CONTRIBUTORS.txt
- * Code distributed by Google as part of the polymer project is also
- * subject to an additional IP rights grant found at
- * http://polymer.github.io/PATENTS.txt
- */;class L{handleAttributeExpressions(t,e,n,s){const o=e[0];if("."===o){return new X(t,e.slice(1),n).parts}return"@"===o?[new S(t,e.slice(1),s.eventContext)]:"?"===o?[new C(t,e.slice(1),n)]:new P(t,e,n).parts}handleTextExpression(t){return new M(t)}}const k=new L;
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */class dt extends lt{constructor(){super(...arguments),this._$CG=new ct(this),this._$CK=new at}render(t,e){return _}update(t,[e,s]){if(this.isConnected||this.disconnected(),e===this._$CJ)return;this._$CJ=e;let n=0;const{_$CG:i,_$CK:o}=this;return(async(t,e)=>{for await(const s of t)if(!1===await e(s))return})(e,async t=>{for(;o.get();)await o.get();const r=i.deref();if(void 0!==r){if(r._$CJ!==e)return!1;void 0!==s&&(t=s(t,n)),r.commitValue(t,n),n++}return!0}),_}commitValue(t,e){this.setValue(t)}disconnected(){this._$CG.disconnect(),this._$CK.pause()}reconnected(){this._$CG.reconnect(this),this._$CK.resume()}}const ut=j(dt),pt=j(class extends dt{constructor(t){if(super(t),t.type!==B)throw Error("asyncAppend can only be used in child expressions")}update(t,e){return this._$CX=t,super.update(t,e)}commitValue(t,e){0===e&&et(this._$CX);const s=K(this._$CX);q(s,t)}}),vt=j(class extends z{constructor(t){super(t),this.tt=new WeakMap}render(t){return[t]}update(t,[e]){if(R(this.it)&&(!R(e)||this.it.strings!==e.strings)){const e=Q(t).pop();let s=this.tt.get(this.it.strings);if(void 0===s){const t=document.createDocumentFragment();s=C(b,t),s.setConnected(!1),this.tt.set(this.it.strings,s)}J(s,[e]),K(s,void 0,e)}if(R(e)){if(!R(this.it)||this.it.strings!==e.strings){const s=this.tt.get(e.strings);if(void 0!==s){const e=Q(s).pop();et(t),K(t,void 0,e),J(t,[e])}}this.it=e}else this.it=void 0;return this.render(e)}}),ft={},mt=j(class extends z{constructor(){super(...arguments),this.ot=ft}render(t,e){return e()}update(t,[e,s]){if(Array.isArray(e)){if(Array.isArray(this.ot)&&this.ot.length===e.length&&e.every((t,e)=>t===this.ot[e]))return _}else if(this.ot===e)return _;return this.ot=Array.isArray(e)?Array.from(e):e,this.render(e,s)}}),gt=t=>null!=t?t:b
 /**
  * @license
- * Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
- * This code may only be used under the BSD style license found at
- * http://polymer.github.io/LICENSE.txt
- * The complete set of authors may be found at
- * http://polymer.github.io/AUTHORS.txt
- * The complete set of contributors may be found at
- * http://polymer.github.io/CONTRIBUTORS.txt
- * Code distributed by Google as part of the polymer project is also
- * subject to an additional IP rights grant found at
- * http://polymer.github.io/PATENTS.txt
- */function D(t){let e=$.get(t.type);void 0===e&&(e={stringsArray:new WeakMap,keyString:new Map},$.set(t.type,e));let n=e.stringsArray.get(t.strings);if(void 0!==n)return n;const s=t.strings.join(l);return n=e.keyString.get(s),void 0===n&&(n=new d(t,t.getTemplateElement()),e.keyString.set(s,n)),e.stringsArray.set(t.strings,n),n}const $=new Map,R=new WeakMap,W=(t,e,n)=>{let s=R.get(e);void 0===s&&(i(e,e.firstChild),R.set(e,s=new M(Object.assign({templateFactory:D},n))),s.appendInto(e)),s.setValue(t),s.commit()};
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */,yt=(t,e,s)=>{const n=new Map;for(let i=e;i<=s;i++)n.set(t[i],i);return n},$t=j(class extends z{constructor(t){if(super(t),t.type!==B)throw Error("repeat() can only be used in text expressions")}dt(t,e,s){let n;void 0===s?s=e:void 0!==e&&(n=e);const i=[],o=[];let r=0;for(const e of t)i[r]=n?n(e,r):r,o[r]=s(e,r),r++;return{values:o,keys:i}}render(t,e,s){return this.dt(t,e,s).values}update(t,[e,s,n]){var i;const o=Q(t),{values:r,keys:h}=this.dt(e,s,n);if(!Array.isArray(o))return this.ct=h,r;const l=null!==(i=this.ct)&&void 0!==i?i:this.ct=[],c=[];let a,d,u=0,p=o.length-1,v=0,f=r.length-1;for(;u<=p&&v<=f;)if(null===o[u])u++;else if(null===o[p])p--;else if(l[u]===h[v])c[v]=q(o[u],r[v]),u++,v++;else if(l[p]===h[f])c[f]=q(o[p],r[f]),p--,f--;else if(l[u]===h[f])c[f]=q(o[u],r[f]),K(t,c[f+1],o[u]),u++,f--;else if(l[p]===h[v])c[v]=q(o[p],r[v]),K(t,o[u],o[p]),p--,v++;else if(void 0===a&&(a=yt(h,v,f),d=yt(l,u,p)),a.has(l[u]))if(a.has(l[p])){const e=d.get(h[v]),s=void 0!==e?o[e]:null;if(null===s){const e=K(t,o[u]);q(e,r[v]),c[v]=e}else c[v]=q(s,r[v]),K(t,o[u],s),o[e]=null;v++}else tt(o[p]),p--;else tt(o[u]),u++;for(;v<=f;){const e=K(t,c[f+1]);q(e,r[v]),c[v++]=e}for(;u<=p;){const t=o[u++];null!==t&&tt(t)}return this.ct=h,J(t,c),_}});
 /**
  * @license
- * Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
- * This code may only be used under the BSD style license found at
- * http://polymer.github.io/LICENSE.txt
- * The complete set of authors may be found at
- * http://polymer.github.io/AUTHORS.txt
- * The complete set of contributors may be found at
- * http://polymer.github.io/CONTRIBUTORS.txt
- * Code distributed by Google as part of the polymer project is also
- * subject to an additional IP rights grant found at
- * http://polymer.github.io/PATENTS.txt
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
  */
 /**
  * @license
- * Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
- * This code may only be used under the BSD style license found at
- * http://polymer.github.io/LICENSE.txt
- * The complete set of authors may be found at
- * http://polymer.github.io/AUTHORS.txt
- * The complete set of contributors may be found at
- * http://polymer.github.io/CONTRIBUTORS.txt
- * Code distributed by Google as part of the polymer project is also
- * subject to an additional IP rights grant found at
- * http://polymer.github.io/PATENTS.txt
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
  */
-"undefined"!=typeof window&&(window.litHtmlVersions||(window.litHtmlVersions=[])).push("1.3.0");const B=(t,...e)=>new _(t,e,"html",k),F=(t,...e)=>new w(t,e,"svg",k);var U=Object.freeze({__proto__:null,html:B,svg:F,DefaultTemplateProcessor:L,defaultTemplateProcessor:k,directive:t,Directive:e,isDirective:n,removeNodes:i,reparentNodes:o,noChange:r,nothing:a,AttributeCommitter:P,AttributePart:A,BooleanAttributePart:C,EventPart:S,isIterable:E,isPrimitive:N,NodePart:M,PropertyCommitter:X,PropertyPart:Y,parts:R,render:W,templateCaches:$,templateFactory:D,TemplateInstance:g,SVGTemplateResult:w,TemplateResult:_,createMarker:v,isTemplatePartActive:u,Template:d}),O=function(t){if(!Symbol.asyncIterator)throw new TypeError("Symbol.asyncIterator is not defined.");var e,n=t[Symbol.asyncIterator];return n?n.call(t):(t="function"==typeof __values?__values(t):t[Symbol.iterator](),e={},s("next"),s("throw"),s("return"),e[Symbol.asyncIterator]=function(){return this},e);function s(n){e[n]=t[n]&&function(e){return new Promise((function(s,o){(function(t,e,n,s){Promise.resolve(s).then((function(e){t({value:e,done:n})}),e)})(s,o,(e=t[n](e)).done,e.value)}))}}};
+class At extends z{constructor(t){if(super(t),this.it=b,t.type!==B)throw Error(this.constructor.directiveName+"() can only be used in child bindings")}render(t){if(t===b||null==t)return this.vt=void 0,this.it=t;if(t===_)return t;if("string"!=typeof t)throw Error(this.constructor.directiveName+"() called with a non-string value");if(t===this.it)return this.vt;this.it=t;const e=[t];return e.raw=e,this.vt={_$litType$:this.constructor.resultType,strings:e,values:[]}}}At.directiveName="unsafeHTML",At.resultType=1;const _t=j(At),bt=t=>!(t=>null===t||"object"!=typeof t&&"function"!=typeof t)(t)&&"function"==typeof t.then;
 /**
  * @license
- * Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
- * This code may only be used under the BSD style license found at
- * http://polymer.github.io/LICENSE.txt
- * The complete set of authors may be found at
- * http://polymer.github.io/AUTHORS.txt
- * The complete set of contributors may be found at
- * http://polymer.github.io/CONTRIBUTORS.txt
- * Code distributed by Google as part of the polymer project is also
- * subject to an additional IP rights grant found at
- * http://polymer.github.io/PATENTS.txt
- */const H=t((t,e)=>async n=>{var s,o;if(!(n instanceof M))throw new Error("asyncAppend can only be used in text bindings");if(t===n.value)return;let i;n.value=t;let r=0;try{for(var a,l=O(t);!(a=await l.next()).done;){let s=a.value;if(n.value!==t)break;0===r&&n.clear(),void 0!==e&&(s=e(s,r));let o=n.startNode;void 0!==i&&(o=v(),i.endNode=o,n.endNode.parentNode.insertBefore(o,n.endNode)),i=new M(n.options),i.insertAfterNode(o),i.setValue(s),i.commit(),r++}}catch(t){s={error:t}}finally{try{a&&!a.done&&(o=l.return)&&await o.call(l)}finally{if(s)throw s.error}}});
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */const xt=j(class extends lt{constructor(){super(...arguments),this._$Cft=1073741823,this._$Cwt=[],this._$CG=new ct(this),this._$CK=new at}render(...t){var e;return null!==(e=t.find(t=>!bt(t)))&&void 0!==e?e:_}update(t,e){const s=this._$Cwt;let n=s.length;this._$Cwt=e;const i=this._$CG,o=this._$CK;this.isConnected||this.disconnected();for(let t=0;t<e.length&&!(t>this._$Cft);t++){const r=e[t];if(!bt(r))return this._$Cft=t,r;t<n&&r===s[t]||(this._$Cft=1073741823,n=0,Promise.resolve(r).then(async t=>{for(;o.get();)await o.get();const e=i.deref();if(void 0!==e){const s=e._$Cwt.indexOf(r);s>-1&&s<e._$Cft&&(e._$Cft=s,e.setValue(t))}}))}return _}disconnected(){this._$CG.disconnect(),this._$CK.pause()}reconnected(){this._$CG.reconnect(this),this._$CK.resume()}}),Ct=j(class extends z{constructor(t){if(super(t),t.type!==W&&t.type!==k&&t.type!==O)throw Error("The `live` directive is not allowed on child or event bindings");if(!V(t))throw Error("`live` bindings can only contain a single expression")}render(t){return t}update(t,[e]){if(e===_||e===b)return e;const s=t.element,n=t.name;if(t.type===W){if(e===s[n])return _}else if(t.type===O){if(!!e===s.hasAttribute(n))return _}else if(t.type===k&&s.getAttribute(n)===e+"")return _;return J(t),e}}),wt=new WeakMap;
 /**
  * @license
- * Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
- * This code may only be used under the BSD style license found at
- * http://polymer.github.io/LICENSE.txt
- * The complete set of authors may be found at
- * http://polymer.github.io/AUTHORS.txt
- * The complete set of contributors may be found at
- * http://polymer.github.io/CONTRIBUTORS.txt
- * Code distributed by Google as part of the polymer project is also
- * subject to an additional IP rights grant found at
- * http://polymer.github.io/PATENTS.txt
- */var j=function(t){if(!Symbol.asyncIterator)throw new TypeError("Symbol.asyncIterator is not defined.");var e,n=t[Symbol.asyncIterator];return n?n.call(t):(t="function"==typeof __values?__values(t):t[Symbol.iterator](),e={},s("next"),s("throw"),s("return"),e[Symbol.asyncIterator]=function(){return this},e);function s(n){e[n]=t[n]&&function(e){return new Promise((function(s,o){(function(t,e,n,s){Promise.resolve(s).then((function(e){t({value:e,done:n})}),e)})(s,o,(e=t[n](e)).done,e.value)}))}}};const z=t((t,e)=>async n=>{var s,o;if(!(n instanceof M))throw new Error("asyncReplace can only be used in text bindings");if(t===n.value)return;const i=new M(n.options);n.value=t;let r=0;try{for(var a,l=j(t);!(a=await l.next()).done;){let s=a.value;if(n.value!==t)break;0===r&&(n.clear(),i.appendIntoPart(n)),void 0!==e&&(s=e(s,r)),i.setValue(s),i.commit(),r++}}catch(t){s={error:t}}finally{try{a&&!a.done&&(o=l.return)&&await o.call(l)}finally{if(s)throw s.error}}}),q=new WeakMap,G=t(t=>e=>{if(!(e instanceof M))throw new Error("cache can only be used in text bindings");let n=q.get(e);void 0===n&&(n=new WeakMap,q.set(e,n));const s=e.value;if(s instanceof g){if(t instanceof _&&s.template===e.options.templateFactory(t))return void e.setValue(t);{let t=n.get(s.template);void 0===t&&(t={instance:s,nodes:document.createDocumentFragment()},n.set(s.template,t)),o(t.nodes,e.startNode.nextSibling,e.endNode)}}if(t instanceof _){const s=e.options.templateFactory(t),o=n.get(s);void 0!==o&&(e.setValue(o.nodes),e.commit(),e.value=o.instance)}e.setValue(t)});
+ * Copyright 2020 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */class Mt extends z{constructor(){super(...arguments),this.ifFn=()=>!1}set(t){this.ifFn=t}render(){return b}update(t){const e=this.ifFn(),s=t.element;if(e)wt.has(t)||wt.set(t,{element:s,nextSibling:s.nextSibling,previousSibling:s.previousSibling,parent:s.parentNode}),s.remove();else{const e=wt.get(t);e&&(e.nextSibling&&e.nextSibling.parentNode?e.nextSibling.parentNode.insertBefore(e.element,e.nextSibling):e.previousSibling&&e.previousSibling.parentNode?e.previousSibling.parentNode.appendChild(e.element):e.parent&&e.parent.appendChild(e.element),wt.delete(t))}return this.render()}}
 /**
  * @license
- * Copyright (c) 2018 The Polymer Project Authors. All rights reserved.
- * This code may only be used under the BSD style license found at
- * http://polymer.github.io/LICENSE.txt
- * The complete set of authors may be found at
- * http://polymer.github.io/AUTHORS.txt
- * The complete set of contributors may be found at
- * http://polymer.github.io/CONTRIBUTORS.txt
- * Code distributed by Google as part of the polymer project is also
- * subject to an additional IP rights grant found at
- * http://polymer.github.io/PATENTS.txt
- */
+ * Copyright 2018 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */const It=j(class extends z{constructor(t){var e;if(super(t),t.type!==k||"style"!==t.name||(null===(e=t.strings)||void 0===e?void 0:e.length)>2)throw Error("The `styleMap` directive must be used in the `style` attribute and must be the only part in the attribute.")}render(t){return Object.keys(t).reduce((e,s)=>{const n=t[s];return null==n?e:e+`${s=s.replace(/(?:^(webkit|moz|ms|o)|)(?=[A-Z])/g,"-$&").toLowerCase()}:${n};`},"")}update(t,[e]){const{style:s}=t.element;if(void 0===this.ut){this.ut=new Set;for(const t in e)this.ut.add(t);return this.render(e)}this.ut.forEach(t=>{null==e[t]&&(this.ut.delete(t),t.includes("-")?s.removeProperty(t):s[t]="")});for(const t in e){const n=e[t];null!=n&&(this.ut.add(t),t.includes("-")?s.setProperty(t,n):s[t]=n)}return _}}),Yt=j(class extends z{constructor(t){var e;if(super(t),t.type!==k||"class"!==t.name||(null===(e=t.strings)||void 0===e?void 0:e.length)>2)throw Error("`classMap()` can only be used in the `class` attribute and must be the only part in the attribute.")}render(t){return" "+Object.keys(t).filter(e=>t[e]).join(" ")+" "}update(t,[e]){var s,n;if(void 0===this.st){this.st=new Set,void 0!==t.strings&&(this.et=new Set(t.strings.join(" ").split(/\s/).filter(t=>""!==t)));for(const t in e)e[t]&&!(null===(s=this.et)||void 0===s?void 0:s.has(t))&&this.st.add(t);return this.render(e)}const i=t.element.classList;this.st.forEach(t=>{t in e||(i.remove(t),this.st.delete(t))});for(const t in e){const s=!!e[t];s===this.st.has(t)||(null===(n=this.et)||void 0===n?void 0:n.has(t))||(s?(i.add(t),this.st.add(t)):(i.remove(t),this.st.delete(t)))}return _}});
 /**
  * @license
- * Copyright (c) 2018 The Polymer Project Authors. All rights reserved.
- * This code may only be used under the BSD style license found at
- * http://polymer.github.io/LICENSE.txt
- * The complete set of authors may be found at
- * http://polymer.github.io/AUTHORS.txt
- * The complete set of contributors may be found at
- * http://polymer.github.io/CONTRIBUTORS.txt
- * Code distributed by Google as part of the polymer project is also
- * subject to an additional IP rights grant found at
- * http://polymer.github.io/PATENTS.txt
- */
-class Z{constructor(t){this.classes=new Set,this.changed=!1,this.element=t;const e=(t.getAttribute("class")||"").split(/\s+/);for(const t of e)this.classes.add(t)}add(t){this.classes.add(t),this.changed=!0}remove(t){this.classes.delete(t),this.changed=!0}commit(){if(this.changed){let t="";this.classes.forEach(e=>t+=e+" "),this.element.setAttribute("class",t)}}}const J=new WeakMap,K=t(t=>e=>{if(!(e instanceof A)||e instanceof Y||"class"!==e.committer.name||e.committer.parts.length>1)throw new Error("The `classMap` directive must be used in the `class` attribute and must be the only part in the attribute.");const{committer:n}=e,{element:s}=n;let o=J.get(e);void 0===o&&(s.setAttribute("class",n.strings.join(" ")),J.set(e,o=new Set));const i=s.classList||new Z(s);o.forEach(e=>{e in t||(i.remove(e),o.delete(e))});for(const e in t){const n=t[e];n!=o.has(e)&&(n?(i.add(e),o.add(e)):(i.remove(e),o.delete(e)))}"function"==typeof i.commit&&i.commit()}),Q=new WeakMap,tt=t((t,e)=>n=>{const s=Q.get(n);if(Array.isArray(t)){if(Array.isArray(s)&&s.length===t.length&&t.every((t,e)=>t===s[e]))return}else if(s===t&&(void 0!==t||Q.has(n)))return;n.setValue(e()),Q.set(n,Array.isArray(t)?Array.from(t):t)}),et=new WeakMap,nt=t(t=>e=>{const n=et.get(e);if(void 0===t&&e instanceof A){if(void 0!==n||!et.has(e)){const t=e.committer.name;e.committer.element.removeAttribute(t)}}else t!==n&&e.setValue(t);et.set(e,t)}),st=(t,e)=>{const n=t.startNode.parentNode,s=void 0===e?t.endNode:e.startNode,o=n.insertBefore(v(),s);n.insertBefore(v(),s);const i=new M(t.options);return i.insertAfterNode(o),i},ot=(t,e)=>(t.setValue(e),t.commit(),t),it=(t,e,n)=>{const s=t.startNode.parentNode,i=n?n.startNode:t.endNode,r=e.endNode.nextSibling;r!==i&&o(s,e.startNode,r,i)},rt=t=>{i(t.startNode.parentNode,t.startNode,t.endNode.nextSibling)},at=(t,e,n)=>{const s=new Map;for(let o=e;o<=n;o++)s.set(t[o],o);return s},lt=new WeakMap,ct=new WeakMap,ht=t((t,e,n)=>{let s;return void 0===n?n=e:void 0!==e&&(s=e),e=>{if(!(e instanceof M))throw new Error("repeat can only be used in text bindings");const o=lt.get(e)||[],i=ct.get(e)||[],r=[],a=[],l=[];let c,h,d=0;for(const e of t)l[d]=s?s(e,d):d,a[d]=n(e,d),d++;let p=0,u=o.length-1,m=0,v=a.length-1;for(;p<=u&&m<=v;)if(null===o[p])p++;else if(null===o[u])u--;else if(i[p]===l[m])r[m]=ot(o[p],a[m]),p++,m++;else if(i[u]===l[v])r[v]=ot(o[u],a[v]),u--,v--;else if(i[p]===l[v])r[v]=ot(o[p],a[v]),it(e,o[p],r[v+1]),p++,v--;else if(i[u]===l[m])r[m]=ot(o[u],a[m]),it(e,o[u],o[p]),u--,m++;else if(void 0===c&&(c=at(l,m,v),h=at(i,p,u)),c.has(i[p]))if(c.has(i[u])){const t=h.get(l[m]),n=void 0!==t?o[t]:null;if(null===n){const t=st(e,o[p]);ot(t,a[m]),r[m]=t}else r[m]=ot(n,a[m]),it(e,n,o[p]),o[t]=null;m++}else rt(o[u]),u--;else rt(o[p]),p++;for(;m<=v;){const t=st(e,r[v+1]);ot(t,a[m]),r[m++]=t}for(;p<=u;){const t=o[p++];null!==t&&rt(t)}lt.set(e,r),ct.set(e,l)}}),dt=new WeakMap,pt=document.createElement("template"),ut=t(t=>e=>{if(!(e instanceof M))throw new Error("unsafeHTML can only be used in text bindings");const n=dt.get(e);if(void 0!==n&&N(t)&&t===n.value&&e.value===n.fragment)return;const s=pt.cloneNode();s.innerHTML=t;const o=document.importNode(s.content,!0);e.setValue(o),dt.set(e,{value:t,fragment:o})}),mt=new WeakMap,vt=t((...t)=>e=>{let n=mt.get(e);void 0===n&&(n={lastRenderedIndex:2147483647,values:[]},mt.set(e,n));const s=n.values;let o=s.length;n.values=t;for(let i=0;i<t.length&&!(i>n.lastRenderedIndex);i++){const r=t[i];if(N(r)||"function"!=typeof r.then){e.setValue(r),n.lastRenderedIndex=i;break}i<o&&r===s[i]||(n.lastRenderedIndex=2147483647,o=0,Promise.resolve(r).then(t=>{const s=n.values.indexOf(r);s>-1&&s<n.lastRenderedIndex&&(n.lastRenderedIndex=s,e.setValue(t),e.commit())}))}}),ft=t(t=>e=>{let n;if(e instanceof S||e instanceof M)throw new Error("The `live` directive is not allowed on text or event bindings");if(e instanceof C)gt(e.strings),n=e.element.hasAttribute(e.name),e.value=n;else{const{element:s,name:o,strings:i}=e.committer;if(gt(i),e instanceof Y){if(n=s[o],n===t)return}else e instanceof A&&(n=s.getAttribute(o));if(n===String(t))return}e.setValue(t)}),gt=t=>{if(2!==t.length||""!==t[0]||""!==t[1])throw new Error("`live` bindings can only contain a single expression")},yt=new WeakMap;class bt extends e{constructor(t){super(),this.ifFn=t}body(t){const e=this.ifFn(),n=t.committer.element;if(e)yt.has(t)||yt.set(t,{element:n,nextSibling:n.nextSibling,previousSibling:n.previousSibling,parent:n.parentNode}),n.remove();else{const e=yt.get(t);e&&(e.nextSibling&&e.nextSibling.parentNode?e.nextSibling.parentNode.insertBefore(e.element,e.nextSibling):e.previousSibling&&e.previousSibling.parentNode?e.previousSibling.parentNode.appendChild(e.element):e.parent&&e.parent.appendChild(e.element),yt.delete(t))}}}class xt extends e{constructor(t,e=!1){super(),this.toRemove=[],this.toUpdate=[],this.debug=!1,this.previous={},this.style=t,this.detach=e}setStyle(t){this.style=t}setDebug(t=!0){this.debug=t}setDetach(t){this.detach=t}body(t){this.toRemove.length=0,this.toUpdate.length=0;const e=t.committer.element,n=e.style;let s=this.previous;if(e.attributes.getNamedItem("style")){const t=e.attributes.getNamedItem("style").value.split(";").map(t=>t.substr(0,t.indexOf(":")).trim()).filter(t=>!!t);for(const e of t)void 0===this.style[e]&&(this.toRemove.includes(e)||this.toRemove.push(e))}for(const t in s)this.style.hasOwnProperty(t)&&void 0===this.style[t]&&(this.toRemove.includes(t)||this.toRemove.push(t));for(const t in this.style){if(!this.style.hasOwnProperty(t))continue;const e=this.style[t],n=s[t];void 0!==n&&n===e||this.toUpdate.push(t)}if(this.debug&&(console.log("[StyleMap] to remove",[...this.toRemove]),console.log("[StyleMap] to update",[...this.toUpdate])),this.toRemove.length||this.toUpdate.length){let t,s;this.detach&&(t=e.parentNode,t&&(s=e.nextSibling,e.remove()));for(const t of this.toRemove)n.removeProperty(t),n[t]&&delete n[t];for(const t of this.toUpdate){const e=this.style[t];t.includes("-")?n.setProperty(t,e):n[t]=e}this.detach&&t&&t.insertBefore(e,s),this.previous=Object.assign({},this.style)}}}class _t{constructor(){this.isAction=!0}}_t.prototype.isAction=!0;const wt={element:document.createTextNode(""),axis:"xy",threshold:10,onDown(){},onMove(){},onUp(){},onWheel(){}},Nt="undefined"!=typeof PointerEvent;let Et=0;class It extends _t{constructor(t,e){super(),this.moving="",this.initialX=0,this.initialY=0,this.lastY=0,this.lastX=0,this.onPointerDown=this.onPointerDown.bind(this),this.onPointerMove=this.onPointerMove.bind(this),this.onPointerUp=this.onPointerUp.bind(this),this.onWheel=this.onWheel.bind(this),this.element=t,this.id=++Et,this.options=Object.assign(Object.assign({},wt),e.pointerOptions),Nt?(t.addEventListener("pointerdown",this.onPointerDown),document.addEventListener("pointermove",this.onPointerMove),document.addEventListener("pointerup",this.onPointerUp)):(t.addEventListener("touchstart",this.onPointerDown),document.addEventListener("touchmove",this.onPointerMove,{passive:!1}),document.addEventListener("touchend",this.onPointerUp),document.addEventListener("touchcancel",this.onPointerUp),t.addEventListener("mousedown",this.onPointerDown),document.addEventListener("mousemove",this.onPointerMove,{passive:!1}),document.addEventListener("mouseup",this.onPointerUp))}normalizeMouseWheelEvent(t){let e=t.deltaX||0,n=t.deltaY||0,s=t.deltaZ||0;const o=t.deltaMode,i=parseInt(getComputedStyle(t.target).getPropertyValue("line-height"));let r=1;switch(o){case 1:r=i;break;case 2:r=window.height}return e*=r,n*=r,s*=r,{x:e,y:n,z:s,event:t}}onWheel(t){const e=this.normalizeMouseWheelEvent(t);this.options.onWheel(e)}normalizePointerEvent(t){let e={x:0,y:0,pageX:0,pageY:0,clientX:0,clientY:0,screenX:0,screenY:0,event:t};switch(t.type){case"wheel":const n=this.normalizeMouseWheelEvent(t);e.x=n.x,e.y=n.y,e.pageX=e.x,e.pageY=e.y,e.screenX=e.x,e.screenY=e.y,e.clientX=e.x,e.clientY=e.y;break;case"touchstart":case"touchmove":case"touchend":case"touchcancel":e.x=t.changedTouches[0].screenX,e.y=t.changedTouches[0].screenY,e.pageX=t.changedTouches[0].pageX,e.pageY=t.changedTouches[0].pageY,e.screenX=t.changedTouches[0].screenX,e.screenY=t.changedTouches[0].screenY,e.clientX=t.changedTouches[0].clientX,e.clientY=t.changedTouches[0].clientY;break;default:e.x=t.x,e.y=t.y,e.pageX=t.pageX,e.pageY=t.pageY,e.screenX=t.screenX,e.screenY=t.screenY,e.clientX=t.clientX,e.clientY=t.clientY}return e}onPointerDown(t){if("mousedown"===t.type&&0!==t.button)return;this.moving="xy";const e=this.normalizePointerEvent(t);this.lastX=e.x,this.lastY=e.y,this.initialX=e.x,this.initialY=e.y,this.options.onDown(e)}handleX(t){let e=t.x-this.lastX;return this.lastY=t.y,this.lastX=t.x,e}handleY(t){let e=t.y-this.lastY;return this.lastY=t.y,this.lastX=t.x,e}onPointerMove(t){if(""===this.moving||"mousemove"===t.type&&0!==t.button)return;const e=this.normalizePointerEvent(t);if("x|y"===this.options.axis){let n=0,s=0;("x"===this.moving||"xy"===this.moving&&Math.abs(e.x-this.initialX)>this.options.threshold)&&(this.moving="x",n=this.handleX(e)),("y"===this.moving||"xy"===this.moving&&Math.abs(e.y-this.initialY)>this.options.threshold)&&(this.moving="y",s=this.handleY(e)),this.options.onMove({movementX:n,movementY:s,x:e.x,y:e.y,initialX:this.initialX,initialY:this.initialY,lastX:this.lastX,lastY:this.lastY,event:t})}else if("xy"===this.options.axis){let n=0,s=0;Math.abs(e.x-this.initialX)>this.options.threshold&&(n=this.handleX(e)),Math.abs(e.y-this.initialY)>this.options.threshold&&(s=this.handleY(e)),this.options.onMove({movementX:n,movementY:s,x:e.x,y:e.y,initialX:this.initialX,initialY:this.initialY,lastX:this.lastX,lastY:this.lastY,event:t})}else if("x"===this.options.axis)("x"===this.moving||"xy"===this.moving&&Math.abs(e.x-this.initialX)>this.options.threshold)&&(this.moving="x",this.options.onMove({movementX:this.handleX(e),movementY:0,initialX:this.initialX,initialY:this.initialY,lastX:this.lastX,lastY:this.lastY,event:t}));else if("y"===this.options.axis){let n=0;("y"===this.moving||"xy"===this.moving&&Math.abs(e.y-this.initialY)>this.options.threshold)&&(this.moving="y",n=this.handleY(e)),this.options.onMove({movementX:0,movementY:n,x:e.x,y:e.y,initialX:this.initialX,initialY:this.initialY,lastX:this.lastX,lastY:this.lastY,event:t})}}onPointerUp(t){this.moving="";const e=this.normalizePointerEvent(t);this.options.onUp({movementX:0,movementY:0,x:e.x,y:e.y,initialX:this.initialX,initialY:this.initialY,lastX:this.lastX,lastY:this.lastY,event:t}),this.lastY=0,this.lastX=0}destroy(t){Nt?(t.removeEventListener("pointerdown",this.onPointerDown),document.removeEventListener("pointermove",this.onPointerMove),document.removeEventListener("pointerup",this.onPointerUp)):(t.removeEventListener("mousedown",this.onPointerDown),document.removeEventListener("mousemove",this.onPointerMove),document.removeEventListener("mouseup",this.onPointerUp),t.removeEventListener("touchstart",this.onPointerDown),document.removeEventListener("touchmove",this.onPointerMove),document.removeEventListener("touchend",this.onPointerUp),document.removeEventListener("touchcancel",this.onPointerUp))}}function Pt(t){let e=0;return function(n){e||(e=requestAnimationFrame((function(){e=0,t.apply(void 0,[n])})))}}function At(t){return t&&t.constructor?"Object"===t.constructor.name:"object"==typeof t&&null!==t}function Mt(t,...e){const n=e.shift();if(At(t)&&At(n))for(const e in n)if(At(n[e]))"function"==typeof n[e].clone?t[e]=n[e].clone():(void 0===t[e]&&(t[e]={}),t[e]=Mt(t[e],n[e]));else if(Array.isArray(n[e])){t[e]=new Array(n[e].length);let s=0;for(let o of n[e])At(o)?"function"==typeof o.clone?t[e][s]=o.clone():t[e][s]=Mt({},o):t[e][s]=o,s++}else t[e]=n[e];return e.length?Mt(t,...e):t}function Ct(t){if(void 0!==t.actions){const e=t.actions.map(t=>{const e=Object.assign({},t),n=Object.assign({},e.props);return delete n.state,delete n.api,delete e.element,e.props=n,e});t.actions=e}return Mt({},t)}var Xt={mergeDeep:Mt,clone:Ct,schedule:Pt};class Yt{constructor(t,e){this.slotInstances={},this.destroyed=!1,this.vido=t,this.props=e,this.destroy=this.destroy.bind(this),this.change=this.change.bind(this),this.html=this.html.bind(this),this.getInstances=this.getInstances.bind(this),this.setComponents=this.setComponents.bind(this),this.vido.onDestroy(()=>{this.destroy()})}setComponents(t){if(t&&!this.destroyed){for(const e in t){const n=t[e];void 0===this.slotInstances[e]&&(this.slotInstances[e]=[]);for(const t of this.slotInstances[e])t.destroy();this.slotInstances[e].length=0;for(const t of n)this.slotInstances[e].push(this.vido.createComponent(t,this.props))}this.vido.update()}}destroy(){if(!this.destroyed){for(const t in this.slotInstances){for(const e of this.slotInstances[t])e.destroy();this.slotInstances[t].length=0}this.destroyed=!0}}change(t,e){if(!this.destroyed)for(const n in this.slotInstances){const s=this.slotInstances[n];for(const n of s)n.change(t,e)}}getInstances(t){return this.destroyed?[]:void 0===t?this.slotInstances:this.slotInstances[t]}html(t,e){if(this.destroyed)return;if(!this.slotInstances[t]||0===this.slotInstances[t].length)return e;let n=e;for(const e of this.slotInstances[t])n=e.html(n);return n}getProps(){return this.props}isDestroyed(){return this.destroyed}}function Tt(n,s){let o=0;const i=new Map;let r,a,l=new Map,c=0;const h=[],d=Promise.resolve(),p={},u=function(t){return class extends e{constructor(t){super(),this.actions=[],this.instance=t}set(t,e){return this.actions=t,this.props=e,this}body(e){const n=e.committer.element;for(const e of this.actions)if(void 0!==e){let s;if(t.has(this.instance))for(const o of t.get(this.instance))if(o.componentAction.create===e&&o.element===n){s=o;break}if(s)s.props=this.props;else{void 0!==n.vido&&delete n.vido;const s={create:e,update(){},destroy(){}},o={instance:this.instance,componentAction:s,element:n,props:this.props};let i=[];t.has(this.instance)&&(i=t.get(this.instance)),i.push(o),t.set(this.instance,i)}}}}}(l);class m{constructor(t){this.instance=t}create(t,e){const n=new u(this.instance);return n.set(t,e),n}}const v=function(t,e,n){return class{constructor(t,e,n={}){this.destroyed=!1,this.instance=t,this.name=e.name,this.vidoInstance=e,this.props=n,this.destroy=this.destroy.bind(this),this.update=this.update.bind(this),this.change=this.change.bind(this),this.html=this.html.bind(this)}destroy(){this.destroyed||(this.vidoInstance.debug&&(console.groupCollapsed(`destroying component ${this.instance}`),console.log(n({components:t.keys(),actionsByInstance:e})),console.trace(),console.groupEnd()),this.vidoInstance.destroyComponent(this.instance,this.vidoInstance),this.destroyed=!0)}update(s){return this.vidoInstance.debug&&(console.groupCollapsed(`updating component ${this.instance}`),console.log(n({components:t.keys(),actionsByInstance:e})),console.trace(),console.groupEnd()),this.vidoInstance.updateTemplate(s)}change(s,o={}){this.vidoInstance.debug&&(console.groupCollapsed(`changing component ${this.instance}`),console.log(n({props:this.props,newProps:s,components:t.keys(),actionsByInstance:e})),console.trace(),console.groupEnd());const i=t.get(this.instance);i&&i.change(s,o)}html(e={}){const n=t.get(this.instance);if(n&&!n.destroyed)return n.update(e,this.vidoInstance)}_getComponents(){return t}_getActions(){return e}}}(i,l,Ct),f=function(t,e,n){return class{constructor(t,e,n){this.destroyed=!1,this.instance=t,this.vidoInstance=e,this.renderFunction=n,this.destroy=this.destroy.bind(this),this.update=this.update.bind(this),this.change=this.change.bind(this)}destroy(){if(!this.destroyed){this.vidoInstance.debug&&(console.groupCollapsed(`component destroy method fired ${this.instance}`),console.log(n({props:this.vidoInstance.props,components:t.keys(),destroyable:this.vidoInstance.destroyable,actionsByInstance:e})),console.trace(),console.groupEnd()),this.content&&"function"==typeof this.content.destroy&&this.content.destroy();for(const t of this.vidoInstance.destroyable)t();this.vidoInstance.onChangeFunctions.length=0,this.vidoInstance.destroyable.length=0,this.vidoInstance.destroyed=!0,this.destroyed=!0,this.vidoInstance.update()}}update(s={}){return this.vidoInstance.debug&&(console.groupCollapsed(`component update method fired ${this.instance}`),console.log(n({components:t.keys(),actionsByInstance:e})),console.trace(),console.groupEnd()),this.renderFunction(s)}change(s,o={leave:!1}){const i=s;this.vidoInstance.debug&&(console.groupCollapsed(`component change method fired ${this.instance}`),console.log(n({props:i,components:t.keys(),onChangeFunctions:this.vidoInstance.onChangeFunctions,changedProps:s,actionsByInstance:e})),console.trace(),console.groupEnd());for(const t of this.vidoInstance.onChangeFunctions)t(s,o)}}}(i,l,Ct);class g{constructor(e="",o=""){this.instance="",this.name="",this.destroyable=[],this.destroyed=!1,this.onChangeFunctions=[],this.debug=!1,this.state=n,this.api=s,this.lastProps={},this.html=B,this.svg=F,this.directive=t,this.asyncAppend=H,this.asyncReplace=z,this.cache=G,this.classMap=K,this.guard=tt,this.live=ft,this.ifDefined=nt,this.repeat=ht,this.unsafeHTML=ut,this.until=vt,this.schedule=Pt,this.getElement=function(t){return function(e){return t(()=>t=>{e(t.committer.element)})()}}(t),this.actionsByInstance=()=>{},this.StyleMap=xt,this.Detach=bt,this.PointerAction=It,this.Action=_t,this.Slots=Yt,this._components=i,this._actions=l,this.instance=e,this.reuseComponents=this.reuseComponents.bind(this),this.onDestroy=this.onDestroy.bind(this),this.onChange=this.onChange.bind(this),this.update=this.update.bind(this),this.destroyComponent=this.destroyComponent.bind(this);for(const t in p)this[t]=p[t].bind(this);this.name=o,this.Actions=new m(e)}static addMethod(t,e){p[t]=e}onDestroy(t){this.destroyable.push(t)}onChange(t){this.onChangeFunctions.push(t)}update(t){return this.updateTemplate(t)}reuseComponents(t,e,n,s,o=!0,i=!1){const r=[],a=t.length,l=e.length;let c=!1;!o||void 0!==e&&0!==e.length||(c=!0);let h=0;if(a<l){let o=l-a;for(;o;){const i=e[l-o],a=this.createComponent(s,n(i));t.push(a),r.push(a),o--}}else if(a>l){let e=a-l;for(o&&(c=!0,h=a-e);e;){const n=a-e;o||(r.push(t[n]),t[n].destroy()),e--}o||(t.length=l)}let d=0;i&&console.log("modified components",r),i&&console.log("current components",t),i&&console.log("data array",e);for(const s of t){const t=e[d];i&&console.log(`reuse components data at '${d}'`,t),s&&!r.includes(s)&&(i&&console.log("getProps fn result",n(t)),s.change(n(t),{leave:c&&d>=h})),d++}}createComponent(t,e={}){const n=t.name+":"+o++;let s;s=new g(n,t.name);const r=new v(n,s,e),a=new f(n,s,t(s,e));return i.set(n,a),i.get(n).change(e),s.debug&&(console.groupCollapsed(`component created ${n}`),console.log(Ct({props:e,components:i.keys(),actionsByInstance:l})),console.trace(),console.groupEnd()),r}destroyComponent(t,e){if(e.debug&&(console.groupCollapsed(`destroying component ${t}...`),console.log(Ct({components:i.keys(),actionsByInstance:l})),console.trace(),console.groupEnd()),l.has(t))for(const e of l.get(t))"function"==typeof e.componentAction.destroy&&e.componentAction.destroy(e.element,e.props);l.delete(t);const n=i.get(t);n?(n.destroy(),i.delete(t),e.debug&&(console.groupCollapsed(`component destroyed ${t}`),console.log(Ct({components:i.keys(),actionsByInstance:l})),console.trace(),console.groupEnd())):console.warn(`No component to destroy! [${t}]`)}executeActions(){for(const t of l.values()){for(const e of t)if(void 0===e.element.vido){const t=i.get(e.instance);e.isActive=function(){return t&&!1===t.destroyed};const n=e.componentAction,s=n.create;if(void 0!==s){let t;t=s.prototype&&(s.prototype.isAction||s.prototype.update||s.prototype.destroy)||s.isAction?new s(e.element,e.props):s(e.element,e.props),void 0!==t&&("function"==typeof t?n.destroy=t:("function"==typeof t.update&&(n.update=t.update.bind(t)),"function"==typeof t.destroy&&(n.destroy=t.destroy.bind(t))))}}else e.element.vido=e.props,"function"==typeof e.componentAction.update&&e.isActive()&&e.componentAction.update(e.element,e.props);for(const e of t)e.element.vido=e.props}}updateTemplate(t){return t&&h.push(t),new Promise(t=>{const e=++c,n=this;d.then((function(){if(e===c){c=0,n.render();for(const t of h)t();h.length=0,t(null)}}))})}createApp(t){a=t.element;const e=this.createComponent(t.component,t.props);return r=e.instance,this.render(),e}render(){const t=i.get(r);t?(W(t.update(),a),this.executeActions()):a&&a.remove()}}return new g}Tt.prototype.lithtml=U,Tt.prototype.Action=_t,Tt.prototype.Directive=e,Tt.prototype.schedule=Pt,Tt.prototype.Detach=bt,Tt.prototype.StyleMap=xt,Tt.prototype.PointerAction=It,Tt.prototype.asyncAppend=H,Tt.prototype.asyncReplace=z,Tt.prototype.cache=G,Tt.prototype.classMap=K,Tt.prototype.guard=tt,Tt.prototype.live=ft,Tt.prototype.ifDefined=nt,Tt.prototype.repeat=ht,Tt.prototype.unsafeHTML=ut,Tt.prototype.until=vt,Tt.prototype.Slots=Yt;export default Tt;export{_t as Action,bt as Detach,e as Directive,It as PointerAction,Yt as Slots,xt as StyleMap,H as asyncAppend,z as asyncReplace,G as cache,K as classMap,tt as guard,Xt as helpers,nt as ifDefined,U as lithtml,ht as repeat,Pt as schedule,ut as unsafeHTML,vt as until};
+ * Copyright 2018 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */class Xt{constructor(){this.isAction=!0}}Xt.prototype.isAction=!0;const Pt={element:document.createTextNode(""),axis:"xy",threshold:10,onDown(){},onMove(){},onUp(){},onWheel(){}},Et="undefined"!=typeof PointerEvent;let Tt=0;class Ht extends Xt{constructor(t,e){super(),this.moving="",this.initialX=0,this.initialY=0,this.lastY=0,this.lastX=0,this.onPointerDown=this.onPointerDown.bind(this),this.onPointerMove=this.onPointerMove.bind(this),this.onPointerUp=this.onPointerUp.bind(this),this.onWheel=this.onWheel.bind(this),this.element=t,this.id=++Tt,this.options=Object.assign(Object.assign({},Pt),e.pointerOptions),Et?(t.addEventListener("pointerdown",this.onPointerDown),document.addEventListener("pointermove",this.onPointerMove),document.addEventListener("pointerup",this.onPointerUp)):(t.addEventListener("touchstart",this.onPointerDown),document.addEventListener("touchmove",this.onPointerMove,{passive:!1}),document.addEventListener("touchend",this.onPointerUp),document.addEventListener("touchcancel",this.onPointerUp),t.addEventListener("mousedown",this.onPointerDown),document.addEventListener("mousemove",this.onPointerMove,{passive:!1}),document.addEventListener("mouseup",this.onPointerUp))}normalizeMouseWheelEvent(t){let e=t.deltaX||0,s=t.deltaY||0,n=t.deltaZ||0;const i=t.deltaMode,o=parseInt(getComputedStyle(t.target).getPropertyValue("line-height"));let r=1;switch(i){case 1:r=o;break;case 2:r=window.height}return e*=r,s*=r,n*=r,{x:e,y:s,z:n,event:t}}onWheel(t){const e=this.normalizeMouseWheelEvent(t);this.options.onWheel(e)}normalizePointerEvent(t){let e={x:0,y:0,pageX:0,pageY:0,clientX:0,clientY:0,screenX:0,screenY:0,event:t};switch(t.type){case"wheel":const s=this.normalizeMouseWheelEvent(t);e.x=s.x,e.y=s.y,e.pageX=e.x,e.pageY=e.y,e.screenX=e.x,e.screenY=e.y,e.clientX=e.x,e.clientY=e.y;break;case"touchstart":case"touchmove":case"touchend":case"touchcancel":e.x=t.changedTouches[0].screenX,e.y=t.changedTouches[0].screenY,e.pageX=t.changedTouches[0].pageX,e.pageY=t.changedTouches[0].pageY,e.screenX=t.changedTouches[0].screenX,e.screenY=t.changedTouches[0].screenY,e.clientX=t.changedTouches[0].clientX,e.clientY=t.changedTouches[0].clientY;break;default:e.x=t.x,e.y=t.y,e.pageX=t.pageX,e.pageY=t.pageY,e.screenX=t.screenX,e.screenY=t.screenY,e.clientX=t.clientX,e.clientY=t.clientY}return e}onPointerDown(t){if("mousedown"===t.type&&0!==t.button)return;this.moving="xy";const e=this.normalizePointerEvent(t);this.lastX=e.x,this.lastY=e.y,this.initialX=e.x,this.initialY=e.y,this.options.onDown(e)}handleX(t){let e=t.x-this.lastX;return this.lastY=t.y,this.lastX=t.x,e}handleY(t){let e=t.y-this.lastY;return this.lastY=t.y,this.lastX=t.x,e}onPointerMove(t){if(""===this.moving||"mousemove"===t.type&&0!==t.button)return;const e=this.normalizePointerEvent(t);if("x|y"===this.options.axis){let s=0,n=0;("x"===this.moving||"xy"===this.moving&&Math.abs(e.x-this.initialX)>this.options.threshold)&&(this.moving="x",s=this.handleX(e)),("y"===this.moving||"xy"===this.moving&&Math.abs(e.y-this.initialY)>this.options.threshold)&&(this.moving="y",n=this.handleY(e)),this.options.onMove({movementX:s,movementY:n,x:e.x,y:e.y,initialX:this.initialX,initialY:this.initialY,lastX:this.lastX,lastY:this.lastY,event:t})}else if("xy"===this.options.axis){let s=0,n=0;Math.abs(e.x-this.initialX)>this.options.threshold&&(s=this.handleX(e)),Math.abs(e.y-this.initialY)>this.options.threshold&&(n=this.handleY(e)),this.options.onMove({movementX:s,movementY:n,x:e.x,y:e.y,initialX:this.initialX,initialY:this.initialY,lastX:this.lastX,lastY:this.lastY,event:t})}else if("x"===this.options.axis)("x"===this.moving||"xy"===this.moving&&Math.abs(e.x-this.initialX)>this.options.threshold)&&(this.moving="x",this.options.onMove({movementX:this.handleX(e),movementY:0,initialX:this.initialX,initialY:this.initialY,lastX:this.lastX,lastY:this.lastY,event:t}));else if("y"===this.options.axis){let s=0;("y"===this.moving||"xy"===this.moving&&Math.abs(e.y-this.initialY)>this.options.threshold)&&(this.moving="y",s=this.handleY(e)),this.options.onMove({movementX:0,movementY:s,x:e.x,y:e.y,initialX:this.initialX,initialY:this.initialY,lastX:this.lastX,lastY:this.lastY,event:t})}}onPointerUp(t){this.moving="";const e=this.normalizePointerEvent(t);this.options.onUp({movementX:0,movementY:0,x:e.x,y:e.y,initialX:this.initialX,initialY:this.initialY,lastX:this.lastX,lastY:this.lastY,event:t}),this.lastY=0,this.lastX=0}destroy(t){Et?(t.removeEventListener("pointerdown",this.onPointerDown),document.removeEventListener("pointermove",this.onPointerMove),document.removeEventListener("pointerup",this.onPointerUp)):(t.removeEventListener("mousedown",this.onPointerDown),document.removeEventListener("mousemove",this.onPointerMove),document.removeEventListener("mouseup",this.onPointerUp),t.removeEventListener("touchstart",this.onPointerDown),document.removeEventListener("touchmove",this.onPointerMove),document.removeEventListener("touchend",this.onPointerUp),document.removeEventListener("touchcancel",this.onPointerUp))}}function Nt(t){let e=0;return function(s){e||(e=requestAnimationFrame((function(){e=0,t.apply(void 0,[s])})))}}function St(t){return t&&t.constructor?"Object"===t.constructor.name:"object"==typeof t&&null!==t}function Lt(t,...e){const s=e.shift();if(St(t)&&St(s))for(const e in s)if(St(s[e]))"function"==typeof s[e].clone?t[e]=s[e].clone():(void 0===t[e]&&(t[e]={}),t[e]=Lt(t[e],s[e]));else if(Array.isArray(s[e])){t[e]=new Array(s[e].length);let n=0;for(let i of s[e])St(i)?"function"==typeof i.clone?t[e][n]=i.clone():t[e][n]=Lt({},i):t[e][n]=i,n++}else t[e]=s[e];return e.length?Lt(t,...e):t}function Dt(t){if(void 0!==t.actions){const e=t.actions.map(t=>{const e=Object.assign({},t),s=Object.assign({},e.props);return delete s.state,delete s.api,delete e.element,e.props=s,e});t.actions=e}return Lt({},t)}var Ut={mergeDeep:Lt,clone:Dt,schedule:Nt};class kt{constructor(t,e){this.slotInstances={},this.destroyed=!1,this.vido=t,this.props=e,this.destroy=this.destroy.bind(this),this.change=this.change.bind(this),this.html=this.html.bind(this),this.getInstances=this.getInstances.bind(this),this.setComponents=this.setComponents.bind(this),this.vido.onDestroy(()=>{this.destroy()})}setComponents(t){if(t&&!this.destroyed){for(const e in t){const s=t[e];void 0===this.slotInstances[e]&&(this.slotInstances[e]=[]);for(const t of this.slotInstances[e])t.destroy();this.slotInstances[e].length=0;for(const t of s)this.slotInstances[e].push(this.vido.createComponent(t,this.props))}this.vido.update()}}destroy(){if(!this.destroyed){for(const t in this.slotInstances){for(const e of this.slotInstances[t])e.destroy();this.slotInstances[t].length=0}this.destroyed=!0}}change(t,e){if(!this.destroyed)for(const s in this.slotInstances){const n=this.slotInstances[s];for(const s of n)s.change(t,e)}}getInstances(t){return this.destroyed?[]:void 0===t?this.slotInstances:this.slotInstances[t]}html(t,e){if(this.destroyed)return;if(!this.slotInstances[t]||0===this.slotInstances[t].length)return e;let s=e;for(const e of this.slotInstances[t])s=e.html(s);return s}getProps(){return this.props}isDestroyed(){return this.destroyed}}class Bt extends z{update(t,e){const s=e[0];if("function"!=typeof s)throw new Error("[vido] Argument for getElement directive should be a function.");s(t.element)}render(){return null}}function Wt(t,e){let s=0;const n=new Map;let i,o,r=new Map,h=0;const l=[],c=Promise.resolve(),a={},d=function(t){return class extends z{update(e,s){const n=e.element,i=s[0],o=s[1],r=s[2];for(const e of o)if(void 0!==e){let s;if(t.has(i))for(const o of t.get(i))if(o.componentAction.create===e&&o.element===n){s=o;break}if(s)s.props=r;else{void 0!==n.vido&&delete n.vido;const s={instance:i,componentAction:{create:e,update(){},destroy(){}},element:n,props:r};let o=[];t.has(i)&&(o=t.get(i)),o.push(s),t.set(i,o)}}}render(t,e,s){return b}}}(r);class u{constructor(t){this.instance=t}create(t,e){const s=j(d);return()=>s(this.instance,t,e)}}const p=function(t,e,s){return class{constructor(t,e,s={}){this.destroyed=!1,this.instance=t,this.name=e.name,this.vidoInstance=e,this.props=s,this.destroy=this.destroy.bind(this),this.update=this.update.bind(this),this.change=this.change.bind(this),this.html=this.html.bind(this)}destroy(){this.destroyed||(this.vidoInstance.debug&&(console.groupCollapsed("destroying component "+this.instance),console.log(s({components:t.keys(),actionsByInstance:e})),console.trace(),console.groupEnd()),this.vidoInstance.destroyComponent(this.instance,this.vidoInstance),this.destroyed=!0)}update(n){return this.vidoInstance.debug&&(console.groupCollapsed("updating component "+this.instance),console.log(s({components:t.keys(),actionsByInstance:e})),console.trace(),console.groupEnd()),this.vidoInstance.updateTemplate(n)}change(n,i={}){this.vidoInstance.debug&&(console.groupCollapsed("changing component "+this.instance),console.log(s({props:this.props,newProps:n,components:t.keys(),actionsByInstance:e})),console.trace(),console.groupEnd());const o=t.get(this.instance);o&&o.change(n,i)}html(e={}){const s=t.get(this.instance);if(s&&!s.destroyed)return s.update(e,this.vidoInstance)}_getComponents(){return t}_getActions(){return e}}}(n,r,Dt),v=function(t,e,s){return class{constructor(t,e,s){this.destroyed=!1,this.instance=t,this.vidoInstance=e,this.renderFunction=s,this.destroy=this.destroy.bind(this),this.update=this.update.bind(this),this.change=this.change.bind(this)}destroy(){if(!this.destroyed){this.vidoInstance.debug&&(console.groupCollapsed("component destroy method fired "+this.instance),console.log(s({props:this.vidoInstance.props,components:t.keys(),destroyable:this.vidoInstance.destroyable,actionsByInstance:e})),console.trace(),console.groupEnd()),this.content&&"function"==typeof this.content.destroy&&this.content.destroy();for(const t of this.vidoInstance.destroyable)t();this.vidoInstance.onChangeFunctions.length=0,this.vidoInstance.destroyable.length=0,this.vidoInstance.destroyed=!0,this.destroyed=!0,this.vidoInstance.update()}}update(n={}){return this.vidoInstance.debug&&(console.groupCollapsed("component update method fired "+this.instance),console.log(s({components:t.keys(),actionsByInstance:e})),console.trace(),console.groupEnd()),this.renderFunction(n)}change(n,i={leave:!1}){const o=n;this.vidoInstance.debug&&(console.groupCollapsed("component change method fired "+this.instance),console.log(s({props:o,components:t.keys(),onChangeFunctions:this.vidoInstance.onChangeFunctions,changedProps:n,actionsByInstance:e})),console.trace(),console.groupEnd());for(const t of this.vidoInstance.onChangeFunctions)t(n,i)}}}(n,r,Dt);class f{constructor(s="",i=""){this.instance="",this.name="",this.destroyable=[],this.destroyed=!1,this.onChangeFunctions=[],this.debug=!1,this.state=t,this.api=e,this.lastProps={},this.html=$,this.svg=A,this.directive=j,this.asyncAppend=pt,this.asyncReplace=ut,this.cache=vt,this.classMap=Yt,this.styleMap=It,this.guard=mt,this.live=Ct,this.ifDefined=gt,this.repeat=$t,this.unsafeHTML=_t,this.until=xt,this.schedule=Nt,this.getElement=j(Bt),this.actionsByInstance=()=>{},this.Detach=Mt,this.PointerAction=Ht,this.Action=Xt,this.Slots=kt,this._components=n,this._actions=r,this.instance=s,this.reuseComponents=this.reuseComponents.bind(this),this.onDestroy=this.onDestroy.bind(this),this.onChange=this.onChange.bind(this),this.update=this.update.bind(this),this.destroyComponent=this.destroyComponent.bind(this);for(const t in a)this[t]=a[t].bind(this);this.name=i,this.Actions=new u(s)}static addMethod(t,e){a[t]=e}onDestroy(t){this.destroyable.push(t)}onChange(t){this.onChangeFunctions.push(t)}update(t){return this.updateTemplate(t)}reuseComponents(t,e,s,n,i=!0,o=!1){const r=[],h=t.length,l=e.length;let c=!1;!i||void 0!==e&&0!==e.length||(c=!0);let a=0;if(h<l){let i=l-h;for(;i;){const o=e[l-i],h=this.createComponent(n,s(o));t.push(h),r.push(h),i--}}else if(h>l){let e=h-l;for(i&&(c=!0,a=h-e);e;){const s=h-e;i||(r.push(t[s]),t[s].destroy()),e--}i||(t.length=l)}let d=0;o&&console.log("modified components",r),o&&console.log("current components",t),o&&console.log("data array",e);for(const n of t){const t=e[d];o&&console.log(`reuse components data at '${d}'`,t),n&&!r.includes(n)&&(o&&console.log("getProps fn result",s(t)),n.change(s(t),{leave:c&&d>=a})),d++}}createComponent(t,e={}){const i=t.name+":"+s++;let o;o=new f(i,t.name);const h=new p(i,o,e),l=new v(i,o,t(o,e));return n.set(i,l),n.get(i).change(e),o.debug&&(console.groupCollapsed("component created "+i),console.log(Dt({props:e,components:n.keys(),actionsByInstance:r})),console.trace(),console.groupEnd()),h}destroyComponent(t,e){if(e.debug&&(console.groupCollapsed(`destroying component ${t}...`),console.log(Dt({components:n.keys(),actionsByInstance:r})),console.trace(),console.groupEnd()),r.has(t))for(const e of r.get(t))"function"==typeof e.componentAction.destroy&&e.componentAction.destroy(e.element,e.props);r.delete(t);const s=n.get(t);s?(s.destroy(),n.delete(t),e.debug&&(console.groupCollapsed("component destroyed "+t),console.log(Dt({components:n.keys(),actionsByInstance:r})),console.trace(),console.groupEnd())):console.warn(`No component to destroy! [${t}]`)}executeActions(){for(const t of r.values()){for(const e of t)if(void 0===e.element.vido){const t=n.get(e.instance);e.isActive=function(){return t&&!1===t.destroyed};const s=e.componentAction,i=s.create;if(void 0!==i){let t;t=i.prototype&&(i.prototype.isAction||i.prototype.update||i.prototype.destroy)||i.isAction?new i(e.element,e.props):i(e.element,e.props),void 0!==t&&("function"==typeof t?s.destroy=t:("function"==typeof t.update&&(s.update=t.update.bind(t)),"function"==typeof t.destroy&&(s.destroy=t.destroy.bind(t))))}}else e.element.vido=e.props,"function"==typeof e.componentAction.update&&e.isActive()&&e.componentAction.update(e.element,e.props);for(const e of t)e.element.vido=e.props}}updateTemplate(t){return t&&l.push(t),new Promise(t=>{const e=++h,s=this;c.then((function(){if(e===h){h=0,s.render();for(const t of l)t();l.length=0,t(null)}}))})}createApp(t){o=t.element;const e=this.createComponent(t.component,t.props);return i=e.instance,this.render(),e}render(){const t=n.get(i);t?(C(t.update(),o),this.executeActions()):o&&o.remove()}}return new f}Wt.prototype.lithtml=U,Wt.prototype.Action=Xt,Wt.prototype.Directive=z,Wt.prototype.schedule=Nt,Wt.prototype.Detach=Mt,Wt.prototype.styleMap=It,Wt.prototype.classMap=Yt,Wt.prototype.PointerAction=Ht,Wt.prototype.asyncAppend=pt,Wt.prototype.asyncReplace=ut,Wt.prototype.cache=vt,Wt.prototype.guard=mt,Wt.prototype.live=Ct,Wt.prototype.ifDefined=gt,Wt.prototype.repeat=$t,Wt.prototype.unsafeHTML=_t,Wt.prototype.until=xt,Wt.prototype.Slots=kt;export default Wt;export{Xt as Action,Mt as Detach,z as Directive,Ht as PointerAction,kt as Slots,pt as asyncAppend,ut as asyncReplace,vt as cache,Yt as classMap,mt as guard,Ut as helpers,gt as ifDefined,U as lithtml,$t as repeat,Nt as schedule,It as styleMap,_t as unsafeHTML,xt as until};
 //# sourceMappingURL=vido.esm.min.js.map

dist/vido.js

@@ -1,14 +0,15 @@
-import { render, html, directive, svg, Directive } from 'lit-html-optimised';
-import { asyncAppend } from 'lit-html-optimised/directives/async-append';
-import { asyncReplace } from 'lit-html-optimised/directives/async-replace';
-import { cache } from 'lit-html-optimised/directives/cache';
-import { classMap } from 'lit-html-optimised/directives/class-map';
-import { guard } from 'lit-html-optimised/directives/guard';
-import { ifDefined } from 'lit-html-optimised/directives/if-defined';
-import { repeat } from 'lit-html-optimised/directives/repeat';
-import { unsafeHTML } from 'lit-html-optimised/directives/unsafe-html';
-import { until } from 'lit-html-optimised/directives/until';
-import { live } from 'lit-html-optimised/directives/live';
+import { render, html, svg } from 'lit-html';
+import { directive, Directive } from 'lit-html/directive';
+import { asyncAppend } from 'lit-html/directives/async-append';
+import { asyncReplace } from 'lit-html/directives/async-replace';
+import { cache } from 'lit-html/directives/cache';
+import { guard } from 'lit-html/directives/guard';
+import { ifDefined } from 'lit-html/directives/if-defined';
+import { repeat } from 'lit-html/directives/repeat';
+import { unsafeHTML } from 'lit-html/directives/unsafe-html';
+import { until } from 'lit-html/directives/until';
+import { live } from 'lit-html/directives/live';
 import Detach from './Detach';
-import StyleMap from './StyleMap';
+import { styleMap } from 'lit-html/directives/style-map';
+import { classMap } from 'lit-html/directives/class-map';
 import PointerAction from './PointerAction';
@@ -21,5 +22,5 @@ import getPublicComponentMethods from './PublicComponentMethods';
 import { Slots } from './Slots';
-import prepareGetElement from './GetElement';
+import GetElementDirective from './GetElement';
 import helpers from './helpers';
-import * as lithtml from 'lit-html-optimised';
+import * as lithtml from 'lit-html';
 export default function Vido(state, api) {
@@ -40,4 +41,6 @@ let componentId = 0;
         create(actions, props) {
-            const actionsInstance = new ActionsCollector(this.instance);
-            actionsInstance.set(actions, props);
+            const actionsInstanceDirective = directive(ActionsCollector);
+            const actionsInstance = () => {
+                return actionsInstanceDirective(this.instance, actions, props);
+            };
             return actionsInstance;
@@ -66,2 +69,3 @@ }
             this.classMap = classMap;
+            this.styleMap = styleMap;
             this.guard = guard;
@@ -74,5 +78,4 @@ this.live = live;
             this.schedule = schedule;
-            this.getElement = prepareGetElement(directive);
+            this.getElement = directive(GetElementDirective);
             this.actionsByInstance = ( /* componentActions, props */) => { };
-            this.StyleMap = StyleMap;
             this.Detach = Detach;
@@ -314,3 +317,4 @@ this.PointerAction = PointerAction;
 Vido.prototype.Detach = Detach;
-Vido.prototype.StyleMap = StyleMap;
+Vido.prototype.styleMap = styleMap;
+Vido.prototype.classMap = classMap;
 Vido.prototype.PointerAction = PointerAction;
@@ -320,3 +324,2 @@ Vido.prototype.asyncAppend = asyncAppend;
 Vido.prototype.cache = cache;
-Vido.prototype.classMap = classMap;
 Vido.prototype.guard = guard;
@@ -329,2 +332,2 @@ Vido.prototype.live = live;
 Vido.prototype.Slots = Slots;
-export { lithtml, Action, Directive, schedule, Detach, StyleMap, PointerAction, asyncAppend, asyncReplace, cache, classMap, guard, ifDefined, repeat, unsafeHTML, until, Slots, helpers, };
+export { lithtml, Action, Directive, schedule, Detach, styleMap, classMap, PointerAction, asyncAppend, asyncReplace, cache, guard, ifDefined, repeat, unsafeHTML, until, Slots, helpers, };

dist/vido.umd.min.js

 !function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(t=t||self).Vido=e()}(this,(function(){"use strict";
 /**
-     * @license
-     * Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
-     * This code may only be used under the BSD style license found at
-     * http://polymer.github.io/LICENSE.txt
-     * The complete set of authors may be found at
-     * http://polymer.github.io/AUTHORS.txt
-     * The complete set of contributors may be found at
-     * http://polymer.github.io/CONTRIBUTORS.txt
-     * Code distributed by Google as part of the polymer project is also
-     * subject to an additional IP rights grant found at
-     * http://polymer.github.io/PATENTS.txt
-     */const t=t=>(...e)=>{const n=t(...e);return n.isDirective=!0,n};class e{constructor(){this.isDirective=!0,this.isClass=!0}body(t){}}const n=t=>null!=t&&"boolean"==typeof t.isDirective,s="undefined"!=typeof window&&null!=window.customElements&&void 0!==window.customElements.polyfillWrapFlushCallback,o=(t,e,n=null,s=null)=>{for(;e!==n;){const n=e.nextSibling;t.insertBefore(e,s),e=n}},i=(t,e,n=null)=>{for(;e!==n;){const n=e.nextSibling;t.removeChild(e),e=n}},r={},a={},l=`{{lit-${String(Math.random()).slice(2)}}}`,c=`\x3c!--${l}--\x3e`,h=new RegExp(`${l}|${c}`);
+   * @license
+   * Copyright 2017 Google LLC
+   * SPDX-License-Identifier: BSD-3-Clause
+   */var t;const e=globalThis.trustedTypes,s=e?e.createPolicy("lit-html",{createHTML:t=>t}):void 0,n=`lit$${(Math.random()+"").slice(9)}$`,i="?"+n,o=`<${i}>`,r=document,h=(t="")=>r.createComment(t),l=t=>null===t||"object"!=typeof t&&"function"!=typeof t,c=Array.isArray,a=t=>{var e;return c(t)||"function"==typeof(null===(e=t)||void 0===e?void 0:e[Symbol.iterator])},d=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,u=/-->/g,p=/>/g,v=/>|[ 	\n\r](?:([^\s"'>=/]+)([ 	\n\r]*=[ 	\n\r]*(?:[^ 	\n\r"'`<>=]|("|')|))|$)/g,f=/'/g,m=/"/g,g=/^(?:script|style|textarea)$/i,y=t=>(e,...s)=>({_$litType$:t,strings:e,values:s}),$=y(1),A=y(2),_=Symbol.for("lit-noChange"),b=Symbol.for("lit-nothing"),x=new WeakMap,C=(t,e,s)=>{var n,i;const o=null!==(n=null==s?void 0:s.renderBefore)&&void 0!==n?n:e;let r=o._$litPart$;if(void 0===r){const t=null!==(i=null==s?void 0:s.renderBefore)&&void 0!==i?i:null;o._$litPart$=r=new P(e.insertBefore(h(),t),t,void 0,null!=s?s:{})}return r._$AI(t),r},w=r.createTreeWalker(r,129,null,!1),I=(t,e)=>{const i=t.length-1,r=[];let h,l=2===e?"<svg>":"",c=d;for(let e=0;e<i;e++){const s=t[e];let i,a,y=-1,$=0;for(;$<s.length&&(c.lastIndex=$,a=c.exec(s),null!==a);)$=c.lastIndex,c===d?"!--"===a[1]?c=u:void 0!==a[1]?c=p:void 0!==a[2]?(g.test(a[2])&&(h=RegExp("</"+a[2],"g")),c=v):void 0!==a[3]&&(c=v):c===v?">"===a[0]?(c=null!=h?h:d,y=-1):void 0===a[1]?y=-2:(y=c.lastIndex-a[2].length,i=a[1],c=void 0===a[3]?v:'"'===a[3]?m:f):c===m||c===f?c=v:c===u||c===p?c=d:(c=v,h=void 0);const A=c===v&&t[e+1].startsWith("/>")?" ":"";l+=c===d?s+o:y>=0?(r.push(i),s.slice(0,y)+"$lit$"+s.slice(y)+n+A):s+n+(-2===y?(r.push(void 0),e):A)}const a=l+(t[i]||"<?>")+(2===e?"</svg>":"");return[void 0!==s?s.createHTML(a):a,r]};class M{constructor({strings:t,_$litType$:s},o){let r;this.parts=[];let l=0,c=0;const a=t.length-1,d=this.parts,[u,p]=I(t,s);if(this.el=M.createElement(u,o),w.currentNode=this.el.content,2===s){const t=this.el.content,e=t.firstChild;e.remove(),t.append(...e.childNodes)}for(;null!==(r=w.nextNode())&&d.length<a;){if(1===r.nodeType){if(r.hasAttributes()){const t=[];for(const e of r.getAttributeNames())if(e.endsWith("$lit$")||e.startsWith(n)){const s=p[c++];if(t.push(e),void 0!==s){const t=r.getAttribute(s.toLowerCase()+"$lit$").split(n),e=/([.?@])?(.*)/.exec(s);d.push({type:1,index:l,name:e[2],strings:t,ctor:"."===e[1]?T:"?"===e[1]?H:"@"===e[1]?N:E})}else d.push({type:6,index:l})}for(const e of t)r.removeAttribute(e)}if(g.test(r.tagName)){const t=r.textContent.split(n),s=t.length-1;if(s>0){r.textContent=e?e.emptyScript:"";for(let e=0;e<s;e++)r.append(t[e],h()),w.nextNode(),d.push({type:2,index:++l});r.append(t[s],h())}}}else if(8===r.nodeType)if(r.data===i)d.push({type:2,index:l});else{let t=-1;for(;-1!==(t=r.data.indexOf(n,t+1));)d.push({type:7,index:l}),t+=n.length-1}l++}}static createElement(t,e){const s=r.createElement("template");return s.innerHTML=t,s}}function Y(t,e,s=t,n){var i,o,r,h;if(e===_)return e;let c=void 0!==n?null===(i=s._$Cl)||void 0===i?void 0:i[n]:s._$Cu;const a=l(e)?void 0:e._$litDirective$;return(null==c?void 0:c.constructor)!==a&&(null===(o=null==c?void 0:c._$AO)||void 0===o||o.call(c,!1),void 0===a?c=void 0:(c=new a(t),c._$AT(t,s,n)),void 0!==n?(null!==(r=(h=s)._$Cl)&&void 0!==r?r:h._$Cl=[])[n]=c:s._$Cu=c),void 0!==c&&(e=Y(t,c._$AS(t,e.values),c,n)),e}class X{constructor(t,e){this.v=[],this._$AN=void 0,this._$AD=t,this._$AM=e}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}p(t){var e;const{el:{content:s},parts:n}=this._$AD,i=(null!==(e=null==t?void 0:t.creationScope)&&void 0!==e?e:r).importNode(s,!0);w.currentNode=i;let o=w.nextNode(),h=0,l=0,c=n[0];for(;void 0!==c;){if(h===c.index){let e;2===c.type?e=new P(o,o.nextSibling,this,t):1===c.type?e=new c.ctor(o,c.name,c.strings,this,t):6===c.type&&(e=new S(o,this,t)),this.v.push(e),c=n[++l]}h!==(null==c?void 0:c.index)&&(o=w.nextNode(),h++)}return i}m(t){let e=0;for(const s of this.v)void 0!==s&&(void 0!==s.strings?(s._$AI(t,s,e),e+=s.strings.length-2):s._$AI(t[e])),e++}}class P{constructor(t,e,s,n){var i;this.type=2,this._$AH=b,this._$AN=void 0,this._$AA=t,this._$AB=e,this._$AM=s,this.options=n,this._$Cg=null===(i=null==n?void 0:n.isConnected)||void 0===i||i}get _$AU(){var t,e;return null!==(e=null===(t=this._$AM)||void 0===t?void 0:t._$AU)&&void 0!==e?e:this._$Cg}get parentNode(){let t=this._$AA.parentNode;const e=this._$AM;return void 0!==e&&11===t.nodeType&&(t=e.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,e=this){t=Y(this,t,e),l(t)?t===b||null==t||""===t?(this._$AH!==b&&this._$AR(),this._$AH=b):t!==this._$AH&&t!==_&&this.$(t):void 0!==t._$litType$?this.T(t):void 0!==t.nodeType?this.S(t):a(t)?this.M(t):this.$(t)}A(t,e=this._$AB){return this._$AA.parentNode.insertBefore(t,e)}S(t){this._$AH!==t&&(this._$AR(),this._$AH=this.A(t))}$(t){this._$AH!==b&&l(this._$AH)?this._$AA.nextSibling.data=t:this.S(r.createTextNode(t)),this._$AH=t}T(t){var e;const{values:s,_$litType$:n}=t,i="number"==typeof n?this._$AC(t):(void 0===n.el&&(n.el=M.createElement(n.h,this.options)),n);if((null===(e=this._$AH)||void 0===e?void 0:e._$AD)===i)this._$AH.m(s);else{const t=new X(i,this),e=t.p(this.options);t.m(s),this.S(e),this._$AH=t}}_$AC(t){let e=x.get(t.strings);return void 0===e&&x.set(t.strings,e=new M(t)),e}M(t){c(this._$AH)||(this._$AH=[],this._$AR());const e=this._$AH;let s,n=0;for(const i of t)n===e.length?e.push(s=new P(this.A(h()),this.A(h()),this,this.options)):s=e[n],s._$AI(i),n++;n<e.length&&(this._$AR(s&&s._$AB.nextSibling,n),e.length=n)}_$AR(t=this._$AA.nextSibling,e){var s;for(null===(s=this._$AP)||void 0===s||s.call(this,!1,!0,e);t&&t!==this._$AB;){const e=t.nextSibling;t.remove(),t=e}}setConnected(t){var e;void 0===this._$AM&&(this._$Cg=t,null===(e=this._$AP)||void 0===e||e.call(this,t))}}class E{constructor(t,e,s,n,i){this.type=1,this._$AH=b,this._$AN=void 0,this.element=t,this.name=e,this._$AM=n,this.options=i,s.length>2||""!==s[0]||""!==s[1]?(this._$AH=Array(s.length-1).fill(new String),this.strings=s):this._$AH=b}get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}_$AI(t,e=this,s,n){const i=this.strings;let o=!1;if(void 0===i)t=Y(this,t,e,0),o=!l(t)||t!==this._$AH&&t!==_,o&&(this._$AH=t);else{const n=t;let r,h;for(t=i[0],r=0;r<i.length-1;r++)h=Y(this,n[s+r],e,r),h===_&&(h=this._$AH[r]),o||(o=!l(h)||h!==this._$AH[r]),h===b?t=b:t!==b&&(t+=(null!=h?h:"")+i[r+1]),this._$AH[r]=h}o&&!n&&this.k(t)}k(t){t===b?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,null!=t?t:"")}}class T extends E{constructor(){super(...arguments),this.type=3}k(t){this.element[this.name]=t===b?void 0:t}}class H extends E{constructor(){super(...arguments),this.type=4}k(t){t&&t!==b?this.element.setAttribute(this.name,""):this.element.removeAttribute(this.name)}}class N extends E{constructor(t,e,s,n,i){super(t,e,s,n,i),this.type=5}_$AI(t,e=this){var s;if((t=null!==(s=Y(this,t,e,0))&&void 0!==s?s:b)===_)return;const n=this._$AH,i=t===b&&n!==b||t.capture!==n.capture||t.once!==n.once||t.passive!==n.passive,o=t!==b&&(n===b||i);i&&this.element.removeEventListener(this.name,this,n),o&&this.element.addEventListener(this.name,this,t),this._$AH=t}handleEvent(t){var e,s;"function"==typeof this._$AH?this._$AH.call(null!==(s=null===(e=this.options)||void 0===e?void 0:e.host)&&void 0!==s?s:this.element,t):this._$AH.handleEvent(t)}}class S{constructor(t,e,s){this.element=t,this.type=6,this._$AN=void 0,this._$AM=e,this.options=s}get _$AU(){return this._$AM._$AU}_$AI(t){Y(this,t)}}const L={P:"$lit$",V:n,L:i,I:1,N:I,R:X,D:a,j:Y,H:P,O:E,F:H,B:N,W:T,Z:S},U=window.litHtmlPolyfillSupport;null==U||U(M,P),(null!==(t=globalThis.litHtmlVersions)&&void 0!==t?t:globalThis.litHtmlVersions=[]).push("2.0.1");var k=Object.freeze({__proto__:null,_$LH:L,html:$,noChange:_,nothing:b,render:C,svg:A});
 /**
-     * @license
-     * Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
-     * This code may only be used under the BSD style license found at
-     * http://polymer.github.io/LICENSE.txt
-     * The complete set of authors may be found at
-     * http://polymer.github.io/AUTHORS.txt
-     * The complete set of contributors may be found at
-     * http://polymer.github.io/CONTRIBUTORS.txt
-     * Code distributed by Google as part of the polymer project is also
-     * subject to an additional IP rights grant found at
-     * http://polymer.github.io/PATENTS.txt
-     */class d{constructor(t,e){this.parts=[],this.element=e;const n=[],s=[],o=document.createTreeWalker(e.content,133,null,!1);let i=0,r=-1,a=0;const{strings:c,values:{length:d}}=t;for(;a<d;){const t=o.nextNode();if(null!==t){if(r++,1===t.nodeType){if(t.hasAttributes()){const e=t.attributes,{length:n}=e;let s=0;for(let t=0;t<n;t++)p(e[t].name,"$lit$")&&s++;for(;s-- >0;){const e=c[a],n=v.exec(e)[2],s=n.toLowerCase()+"$lit$",o=t.getAttribute(s);t.removeAttribute(s);const i=o.split(h);this.parts.push({type:"attribute",index:r,name:n,strings:i}),a+=i.length-1}}"TEMPLATE"===t.tagName&&(s.push(t),o.currentNode=t.content)}else if(3===t.nodeType){const e=t.data;if(e.indexOf(l)>=0){const s=t.parentNode,o=e.split(h),i=o.length-1;for(let e=0;e<i;e++){let n,i=o[e];if(""===i)n=f();else{const t=v.exec(i);null!==t&&p(t[2],"$lit$")&&(i=i.slice(0,t.index)+t[1]+t[2].slice(0,-"$lit$".length)+t[3]),n=document.createTextNode(i)}s.insertBefore(n,t),this.parts.push({type:"node",index:++r})}""===o[i]?(s.insertBefore(f(),t),n.push(t)):t.data=o[i],a+=i}}else if(8===t.nodeType)if(t.data===l){const e=t.parentNode;null!==t.previousSibling&&r!==i||(r++,e.insertBefore(f(),t)),i=r,this.parts.push({type:"node",index:r}),null===t.nextSibling?t.data="":(n.push(t),r--),a++}else{let e=-1;for(;-1!==(e=t.data.indexOf(l,e+1));)this.parts.push({type:"node",index:-1}),a++}}else o.currentNode=s.pop()}for(const t of n)t.parentNode.removeChild(t)}}const p=(t,e)=>{const n=t.length-e.length;return n>=0&&t.slice(n)===e},u=t=>-1!==t.index,m=document.createComment(""),f=()=>m.cloneNode(),v=/([ \x09\x0a\x0c\x0d])([^\0-\x1F\x7F-\x9F "'>=/]+)([ \x09\x0a\x0c\x0d]*=[ \x09\x0a\x0c\x0d]*(?:[^ \x09\x0a\x0c\x0d"'`<>=]*|"[^"]*|'[^']*))$/;
+   * @license
+   * Copyright 2017 Google LLC
+   * SPDX-License-Identifier: BSD-3-Clause
+   */const D=1,B=2,W=3,j=4,O=t=>(...e)=>({_$litDirective$:t,values:e});class z{constructor(t){}get _$AU(){return this._$AM._$AU}_$AT(t,e,s){this._$Ct=t,this._$AM=e,this._$Ci=s}_$AS(t,e){return this.update(t,e)}update(t,e){return this.render(...e)}}
 /**
-     * @license
-     * Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
-     * This code may only be used under the BSD style license found at
-     * http://polymer.github.io/LICENSE.txt
-     * The complete set of authors may be found at
-     * http://polymer.github.io/AUTHORS.txt
-     * The complete set of contributors may be found at
-     * http://polymer.github.io/CONTRIBUTORS.txt
-     * Code distributed by Google as part of the polymer project is also
-     * subject to an additional IP rights grant found at
-     * http://polymer.github.io/PATENTS.txt
-     */
-class g{constructor(t,e,n){this.__parts=[],this.template=t,this.processor=e,this.options=n}update(t){let e=0;for(const n of this.__parts)void 0!==n&&n.setValue(t[e]),e++;for(const t of this.__parts)void 0!==t&&t.commit()}_clone(){const t=s?this.template.element.content.cloneNode(!0):document.importNode(this.template.element.content,!0),e=[],n=this.template.parts,o=document.createTreeWalker(t,133,null,!1);let i,r=0,a=0,l=o.nextNode();for(;r<n.length;)if(i=n[r],u(i)){for(;a<i.index;)a++,"TEMPLATE"===l.nodeName&&(e.push(l),o.currentNode=l.content),null===(l=o.nextNode())&&(o.currentNode=e.pop(),l=o.nextNode());if("node"===i.type){const t=this.processor.handleTextExpression(this.options);t.insertAfterNode(l.previousSibling),this.__parts.push(t)}else this.__parts.push(...this.processor.handleAttributeExpressions(l,i.name,i.strings,this.options));r++}else this.__parts.push(void 0),r++;return s&&(document.adoptNode(t),customElements.upgrade(t)),t}}
+   * @license
+   * Copyright 2020 Google LLC
+   * SPDX-License-Identifier: BSD-3-Clause
+   */const{H:F}=L,V=(t,e)=>{var s,n;return void 0===e?void 0!==(null===(s=t)||void 0===s?void 0:s._$litType$):(null===(n=t)||void 0===n?void 0:n._$litType$)===e},R=t=>void 0===t.strings,G=()=>document.createComment(""),K=(t,e,s)=>{var n;const i=t._$AA.parentNode,o=void 0===e?t._$AB:e._$AA;if(void 0===s){const e=i.insertBefore(G(),o),n=i.insertBefore(G(),o);s=new F(e,n,t,t.options)}else{const e=s._$AB.nextSibling,r=s._$AM,h=r!==t;if(h){let e;null===(n=s._$AQ)||void 0===n||n.call(s,t),s._$AM=t,void 0!==s._$AP&&(e=t._$AU)!==r._$AU&&s._$AP(e)}if(e!==o||h){let t=s._$AA;for(;t!==e;){const e=t.nextSibling;i.insertBefore(t,o),t=e}}}return s},q=(t,e,s=t)=>(t._$AI(e,s),t),Z={},J=(t,e=Z)=>t._$AH=e,Q=t=>t._$AH,tt=t=>{var e;null===(e=t._$AP)||void 0===e||e.call(t,!1,!0);let s=t._$AA;const n=t._$AB.nextSibling;for(;s!==n;){const t=s.nextSibling;s.remove(),s=t}},et=t=>{t._$AR()},st=(t,e)=>{var s,n;const i=t._$AN;if(void 0===i)return!1;for(const t of i)null===(n=(s=t)._$AO)||void 0===n||n.call(s,e,!1),st(t,e);return!0},nt=t=>{let e,s;do{if(void 0===(e=t._$AM))break;s=e._$AN,s.delete(t),t=e}while(0===(null==s?void 0:s.size))},it=t=>{for(let e;e=t._$AM;t=e){let s=e._$AN;if(void 0===s)e._$AN=s=new Set;else if(s.has(t))break;s.add(t),ht(e)}};
 /**
-     * @license
-     * Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
-     * This code may only be used under the BSD style license found at
-     * http://polymer.github.io/LICENSE.txt
-     * The complete set of authors may be found at
-     * http://polymer.github.io/AUTHORS.txt
-     * The complete set of contributors may be found at
-     * http://polymer.github.io/CONTRIBUTORS.txt
-     * Code distributed by Google as part of the polymer project is also
-     * subject to an additional IP rights grant found at
-     * http://polymer.github.io/PATENTS.txt
-     */const y=window.trustedTypes&&trustedTypes.createPolicy("lit-html",{createHTML:t=>t}),b=` ${l} `,x=document.createElement("template");class _{constructor(t,e,n,s){this.strings=t,this.values=e,this.type=n,this.processor=s}getHTML(){const t=this.strings.length-1;let e="",n=!1;for(let s=0;s<t;s++){const t=this.strings[s],o=t.lastIndexOf("\x3c!--");n=(o>-1||n)&&-1===t.indexOf("--\x3e",o+1);const i=v.exec(t);e+=null===i?t+(n?b:c):t.substr(0,i.index)+i[1]+i[2]+"$lit$"+i[3]+l}return e+=this.strings[t],e}getTemplateElement(){const t=x.cloneNode();let e=this.getHTML();return void 0!==y&&(e=y.createHTML(e)),t.innerHTML=e,t}}class w extends _{getHTML(){return`<svg>${super.getHTML()}</svg>`}getTemplateElement(){const t=super.getTemplateElement(),e=t.content,n=e.firstChild;return e.removeChild(n),o(e,n.firstChild),t}}
+   * @license
+   * Copyright 2017 Google LLC
+   * SPDX-License-Identifier: BSD-3-Clause
+   */function ot(t){void 0!==this._$AN?(nt(this),this._$AM=t,it(this)):this._$AM=t}function rt(t,e=!1,s=0){const n=this._$AH,i=this._$AN;if(void 0!==i&&0!==i.size)if(e)if(Array.isArray(n))for(let t=s;t<n.length;t++)st(n[t],!1),nt(n[t]);else null!=n&&(st(n,!1),nt(n));else st(this,t)}const ht=t=>{var e,s,n,i;t.type==B&&(null!==(e=(n=t)._$AP)&&void 0!==e||(n._$AP=rt),null!==(s=(i=t)._$AQ)&&void 0!==s||(i._$AQ=ot))};class lt extends z{constructor(){super(...arguments),this._$AN=void 0}_$AT(t,e,s){super._$AT(t,e,s),it(this),this.isConnected=t._$AU}_$AO(t,e=!0){var s,n;t!==this.isConnected&&(this.isConnected=t,t?null===(s=this.reconnected)||void 0===s||s.call(this):null===(n=this.disconnected)||void 0===n||n.call(this)),e&&(st(this,t),nt(this))}setValue(t){if(R(this._$Ct))this._$Ct._$AI(t,this);else{const e=[...this._$Ct._$AH];e[this._$Ci]=t,this._$Ct._$AI(e,this,0)}}disconnected(){}reconnected(){}}
 /**
-     * @license
-     * Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
-     * This code may only be used under the BSD style license found at
-     * http://polymer.github.io/LICENSE.txt
-     * The complete set of authors may be found at
-     * http://polymer.github.io/AUTHORS.txt
-     * The complete set of contributors may be found at
-     * http://polymer.github.io/CONTRIBUTORS.txt
-     * Code distributed by Google as part of the polymer project is also
-     * subject to an additional IP rights grant found at
-     * http://polymer.github.io/PATENTS.txt
-     */const N=t=>null===t||!("object"==typeof t||"function"==typeof t),E=t=>Array.isArray(t)||!(!t||!t[Symbol.iterator]),I=document.createTextNode("");class P{constructor(t,e,n){this.dirty=!0,this.element=t,this.name=e,this.strings=n,this.parts=[];for(let t=0;t<n.length-1;t++)this.parts[t]=this._createPart()}_createPart(){return new A(this)}_getValue(){const t=this.strings,e=t.length-1,n=this.parts;if(1===e&&""===t[0]&&""===t[1]){const t=n[0].value;if("symbol"==typeof t)return String(t);if("string"==typeof t||!E(t))return t}let s="";for(let o=0;o<e;o++){s+=t[o];const e=n[o];if(void 0!==e){const t=e.value;if(N(t)||!E(t))s+="string"==typeof t?t:String(t);else for(const e of t)s+="string"==typeof e?e:String(e)}}return s+=t[e],s}commit(){this.dirty&&(this.dirty=!1,this.element.setAttribute(this.name,this._getValue()))}}class A{constructor(t){this.value=void 0,this.committer=t}setValue(t){t===r||N(t)&&t===this.value||(this.value=t,n(t)||(this.committer.dirty=!0))}commit(){for(;n(this.value);){const t=this.value;this.value=r,t.isClass?t.body(this):t(this)}this.value!==r&&this.committer.commit()}}class M{constructor(t){this.value=void 0,this.__pendingValue=void 0,this.options=t}appendInto(t){this.startNode=t.appendChild(f()),this.endNode=t.appendChild(f())}insertAfterNode(t){this.startNode=t,this.endNode=t.nextSibling}appendIntoPart(t){t.__insert(this.startNode=f()),t.__insert(this.endNode=f())}insertAfterPart(t){t.__insert(this.startNode=f()),this.endNode=t.endNode,t.endNode=this.startNode}setValue(t){this.__pendingValue=t}commit(){if(null===this.startNode.parentNode)return;for(;n(this.__pendingValue);){const t=this.__pendingValue;this.__pendingValue=r,t.isClass?t.body(this):t(this)}const t=this.__pendingValue;t!==r&&(N(t)?t!==this.value&&this.__commitText(t):t instanceof _?this.__commitTemplateResult(t):t instanceof Node?this.__commitNode(t):E(t)?this.__commitIterable(t):t===a?(this.value=a,this.clear()):this.__commitText(t))}__insert(t){this.endNode.parentNode.insertBefore(t,this.endNode)}__commitNode(t){this.value!==t&&(this.clear(),this.__insert(t),this.value=t)}__commitText(t){const e=this.startNode.nextSibling,n="string"==typeof(t=null==t?"":t)?t:String(t);if(e===this.endNode.previousSibling&&3===e.nodeType)e.data=n;else{const t=I.cloneNode();t.textContent=n,this.__commitNode(t)}this.value=t}__commitTemplateResult(t){const e=this.options.templateFactory(t);if(this.value instanceof g&&this.value.template===e)this.value.update(t.values);else{const n=new g(e,t.processor,this.options),s=n._clone();n.update(t.values),this.__commitNode(s),this.value=n}}__commitIterable(t){Array.isArray(this.value)||(this.value=[],this.clear());const e=this.value;let n,s=0;for(const o of t)n=e[s],void 0===n&&(n=new M(this.options),e.push(n),0===s?n.appendIntoPart(this):n.insertAfterPart(e[s-1])),n.setValue(o),n.commit(),s++;s<e.length&&(e.length=s,this.clear(n&&n.endNode))}clear(t=this.startNode){i(this.startNode.parentNode,t.nextSibling,this.endNode)}}class C{constructor(t,e,n){if(this.value=void 0,this.__pendingValue=void 0,2!==n.length||""!==n[0]||""!==n[1])throw new Error("Boolean attributes can only contain a single expression");this.element=t,this.name=e,this.strings=n}setValue(t){this.__pendingValue=t}commit(){for(;n(this.__pendingValue);){const t=this.__pendingValue;this.__pendingValue=r,t.isClass?t.body(this):t(this)}if(this.__pendingValue===r)return;const t=!!this.__pendingValue;this.value!==t&&(t?this.element.setAttribute(this.name,""):this.element.removeAttribute(this.name),this.value=t),this.__pendingValue=r}}class X extends P{constructor(t,e,n){super(t,e,n),this.single=2===n.length&&""===n[0]&&""===n[1]}_createPart(){return new Y(this)}_getValue(){return this.single?this.parts[0].value:super._getValue()}commit(){this.dirty&&(this.dirty=!1,this.element[this.name]=this._getValue())}}class Y extends A{}let T=!1;(()=>{try{const t={get capture(){return T=!0,!1}};window.addEventListener("test",t,t),window.removeEventListener("test",t,t)}catch(t){}})();class S{constructor(t,e,n){this.value=void 0,this.__pendingValue=void 0,this.element=t,this.eventName=e,this.eventContext=n,this.__boundHandleEvent=t=>this.handleEvent(t)}setValue(t){this.__pendingValue=t}commit(){for(;n(this.__pendingValue);){const t=this.__pendingValue;this.__pendingValue=r,t.isClass?t.body(this):t(this)}if(this.__pendingValue===r)return;const t=this.__pendingValue,e=this.value,s=null==t||null!=e&&(t.capture!==e.capture||t.once!==e.once||t.passive!==e.passive),o=null!=t&&(null==e||s);s&&this.element.removeEventListener(this.eventName,this.__boundHandleEvent,this.__options),o&&(this.__options=V(t),this.element.addEventListener(this.eventName,this.__boundHandleEvent,this.__options)),this.value=t,this.__pendingValue=r}handleEvent(t){"function"==typeof this.value?this.value.call(this.eventContext||this.element,t):this.value.handleEvent(t)}}const V=t=>t&&(T?{capture:t.capture,passive:t.passive,once:t.once}:t.capture)
+   * @license
+   * Copyright 2021 Google LLC
+   * SPDX-License-Identifier: BSD-3-Clause
+   */class ct{constructor(t){this.U=t}disconnect(){this.U=void 0}reconnect(t){this.U=t}deref(){return this.U}}class at{constructor(){this.Y=void 0,this.q=void 0}get(){return this.Y}pause(){var t;null!==(t=this.Y)&&void 0!==t||(this.Y=new Promise(t=>this.q=t))}resume(){var t;null===(t=this.q)||void 0===t||t.call(this),this.Y=this.q=void 0}}
 /**
-     * @license
-     * Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
-     * This code may only be used under the BSD style license found at
-     * http://polymer.github.io/LICENSE.txt
-     * The complete set of authors may be found at
-     * http://polymer.github.io/AUTHORS.txt
-     * The complete set of contributors may be found at
-     * http://polymer.github.io/CONTRIBUTORS.txt
-     * Code distributed by Google as part of the polymer project is also
-     * subject to an additional IP rights grant found at
-     * http://polymer.github.io/PATENTS.txt
-     */;class L{handleAttributeExpressions(t,e,n,s){const o=e[0];if("."===o){return new X(t,e.slice(1),n).parts}return"@"===o?[new S(t,e.slice(1),s.eventContext)]:"?"===o?[new C(t,e.slice(1),n)]:new P(t,e,n).parts}handleTextExpression(t){return new M(t)}}const k=new L;
+   * @license
+   * Copyright 2017 Google LLC
+   * SPDX-License-Identifier: BSD-3-Clause
+   */class dt extends lt{constructor(){super(...arguments),this._$CG=new ct(this),this._$CK=new at}render(t,e){return _}update(t,[e,s]){if(this.isConnected||this.disconnected(),e===this._$CJ)return;this._$CJ=e;let n=0;const{_$CG:i,_$CK:o}=this;return(async(t,e)=>{for await(const s of t)if(!1===await e(s))return})(e,async t=>{for(;o.get();)await o.get();const r=i.deref();if(void 0!==r){if(r._$CJ!==e)return!1;void 0!==s&&(t=s(t,n)),r.commitValue(t,n),n++}return!0}),_}commitValue(t,e){this.setValue(t)}disconnected(){this._$CG.disconnect(),this._$CK.pause()}reconnected(){this._$CG.reconnect(this),this._$CK.resume()}}const ut=O(dt),pt=O(class extends dt{constructor(t){if(super(t),t.type!==B)throw Error("asyncAppend can only be used in child expressions")}update(t,e){return this._$CX=t,super.update(t,e)}commitValue(t,e){0===e&&et(this._$CX);const s=K(this._$CX);q(s,t)}}),vt=O(class extends z{constructor(t){super(t),this.tt=new WeakMap}render(t){return[t]}update(t,[e]){if(V(this.it)&&(!V(e)||this.it.strings!==e.strings)){const e=Q(t).pop();let s=this.tt.get(this.it.strings);if(void 0===s){const t=document.createDocumentFragment();s=C(b,t),s.setConnected(!1),this.tt.set(this.it.strings,s)}J(s,[e]),K(s,void 0,e)}if(V(e)){if(!V(this.it)||this.it.strings!==e.strings){const s=this.tt.get(e.strings);if(void 0!==s){const e=Q(s).pop();et(t),K(t,void 0,e),J(t,[e])}}this.it=e}else this.it=void 0;return this.render(e)}}),ft={},mt=O(class extends z{constructor(){super(...arguments),this.ot=ft}render(t,e){return e()}update(t,[e,s]){if(Array.isArray(e)){if(Array.isArray(this.ot)&&this.ot.length===e.length&&e.every((t,e)=>t===this.ot[e]))return _}else if(this.ot===e)return _;return this.ot=Array.isArray(e)?Array.from(e):e,this.render(e,s)}}),gt=t=>null!=t?t:b
 /**
-     * @license
-     * Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
-     * This code may only be used under the BSD style license found at
-     * http://polymer.github.io/LICENSE.txt
-     * The complete set of authors may be found at
-     * http://polymer.github.io/AUTHORS.txt
-     * The complete set of contributors may be found at
-     * http://polymer.github.io/CONTRIBUTORS.txt
-     * Code distributed by Google as part of the polymer project is also
-     * subject to an additional IP rights grant found at
-     * http://polymer.github.io/PATENTS.txt
-     */function D(t){let e=$.get(t.type);void 0===e&&(e={stringsArray:new WeakMap,keyString:new Map},$.set(t.type,e));let n=e.stringsArray.get(t.strings);if(void 0!==n)return n;const s=t.strings.join(l);return n=e.keyString.get(s),void 0===n&&(n=new d(t,t.getTemplateElement()),e.keyString.set(s,n)),e.stringsArray.set(t.strings,n),n}const $=new Map,R=new WeakMap,W=(t,e,n)=>{let s=R.get(e);void 0===s&&(i(e,e.firstChild),R.set(e,s=new M(Object.assign({templateFactory:D},n))),s.appendInto(e)),s.setValue(t),s.commit()};
+   * @license
+   * Copyright 2017 Google LLC
+   * SPDX-License-Identifier: BSD-3-Clause
+   */,yt=(t,e,s)=>{const n=new Map;for(let i=e;i<=s;i++)n.set(t[i],i);return n},$t=O(class extends z{constructor(t){if(super(t),t.type!==B)throw Error("repeat() can only be used in text expressions")}dt(t,e,s){let n;void 0===s?s=e:void 0!==e&&(n=e);const i=[],o=[];let r=0;for(const e of t)i[r]=n?n(e,r):r,o[r]=s(e,r),r++;return{values:o,keys:i}}render(t,e,s){return this.dt(t,e,s).values}update(t,[e,s,n]){var i;const o=Q(t),{values:r,keys:h}=this.dt(e,s,n);if(!Array.isArray(o))return this.ct=h,r;const l=null!==(i=this.ct)&&void 0!==i?i:this.ct=[],c=[];let a,d,u=0,p=o.length-1,v=0,f=r.length-1;for(;u<=p&&v<=f;)if(null===o[u])u++;else if(null===o[p])p--;else if(l[u]===h[v])c[v]=q(o[u],r[v]),u++,v++;else if(l[p]===h[f])c[f]=q(o[p],r[f]),p--,f--;else if(l[u]===h[f])c[f]=q(o[u],r[f]),K(t,c[f+1],o[u]),u++,f--;else if(l[p]===h[v])c[v]=q(o[p],r[v]),K(t,o[u],o[p]),p--,v++;else if(void 0===a&&(a=yt(h,v,f),d=yt(l,u,p)),a.has(l[u]))if(a.has(l[p])){const e=d.get(h[v]),s=void 0!==e?o[e]:null;if(null===s){const e=K(t,o[u]);q(e,r[v]),c[v]=e}else c[v]=q(s,r[v]),K(t,o[u],s),o[e]=null;v++}else tt(o[p]),p--;else tt(o[u]),u++;for(;v<=f;){const e=K(t,c[f+1]);q(e,r[v]),c[v++]=e}for(;u<=p;){const t=o[u++];null!==t&&tt(t)}return this.ct=h,J(t,c),_}});
 /**
-     * @license
-     * Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
-     * This code may only be used under the BSD style license found at
-     * http://polymer.github.io/LICENSE.txt
-     * The complete set of authors may be found at
-     * http://polymer.github.io/AUTHORS.txt
-     * The complete set of contributors may be found at
-     * http://polymer.github.io/CONTRIBUTORS.txt
-     * Code distributed by Google as part of the polymer project is also
-     * subject to an additional IP rights grant found at
-     * http://polymer.github.io/PATENTS.txt
-     */
+   * @license
+   * Copyright 2017 Google LLC
+   * SPDX-License-Identifier: BSD-3-Clause
+   */
 /**
-     * @license
-     * Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
-     * This code may only be used under the BSD style license found at
-     * http://polymer.github.io/LICENSE.txt
-     * The complete set of authors may be found at
-     * http://polymer.github.io/AUTHORS.txt
-     * The complete set of contributors may be found at
-     * http://polymer.github.io/CONTRIBUTORS.txt
-     * Code distributed by Google as part of the polymer project is also
-     * subject to an additional IP rights grant found at
-     * http://polymer.github.io/PATENTS.txt
-     */
-"undefined"!=typeof window&&(window.litHtmlVersions||(window.litHtmlVersions=[])).push("1.3.0");const B=(t,...e)=>new _(t,e,"html",k),F=(t,...e)=>new w(t,e,"svg",k);var U=Object.freeze({__proto__:null,html:B,svg:F,DefaultTemplateProcessor:L,defaultTemplateProcessor:k,directive:t,Directive:e,isDirective:n,removeNodes:i,reparentNodes:o,noChange:r,nothing:a,AttributeCommitter:P,AttributePart:A,BooleanAttributePart:C,EventPart:S,isIterable:E,isPrimitive:N,NodePart:M,PropertyCommitter:X,PropertyPart:Y,parts:R,render:W,templateCaches:$,templateFactory:D,TemplateInstance:g,SVGTemplateResult:w,TemplateResult:_,createMarker:f,isTemplatePartActive:u,Template:d}),O=function(t){if(!Symbol.asyncIterator)throw new TypeError("Symbol.asyncIterator is not defined.");var e,n=t[Symbol.asyncIterator];return n?n.call(t):(t="function"==typeof __values?__values(t):t[Symbol.iterator](),e={},s("next"),s("throw"),s("return"),e[Symbol.asyncIterator]=function(){return this},e);function s(n){e[n]=t[n]&&function(e){return new Promise((function(s,o){(function(t,e,n,s){Promise.resolve(s).then((function(e){t({value:e,done:n})}),e)})(s,o,(e=t[n](e)).done,e.value)}))}}};
+   * @license
+   * Copyright 2017 Google LLC
+   * SPDX-License-Identifier: BSD-3-Clause
+   */
+class At extends z{constructor(t){if(super(t),this.it=b,t.type!==B)throw Error(this.constructor.directiveName+"() can only be used in child bindings")}render(t){if(t===b||null==t)return this.vt=void 0,this.it=t;if(t===_)return t;if("string"!=typeof t)throw Error(this.constructor.directiveName+"() called with a non-string value");if(t===this.it)return this.vt;this.it=t;const e=[t];return e.raw=e,this.vt={_$litType$:this.constructor.resultType,strings:e,values:[]}}}At.directiveName="unsafeHTML",At.resultType=1;const _t=O(At),bt=t=>!(t=>null===t||"object"!=typeof t&&"function"!=typeof t)(t)&&"function"==typeof t.then;
 /**
-     * @license
-     * Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
-     * This code may only be used under the BSD style license found at
-     * http://polymer.github.io/LICENSE.txt
-     * The complete set of authors may be found at
-     * http://polymer.github.io/AUTHORS.txt
-     * The complete set of contributors may be found at
-     * http://polymer.github.io/CONTRIBUTORS.txt
-     * Code distributed by Google as part of the polymer project is also
-     * subject to an additional IP rights grant found at
-     * http://polymer.github.io/PATENTS.txt
-     */const H=t((t,e)=>async n=>{var s,o;if(!(n instanceof M))throw new Error("asyncAppend can only be used in text bindings");if(t===n.value)return;let i;n.value=t;let r=0;try{for(var a,l=O(t);!(a=await l.next()).done;){let s=a.value;if(n.value!==t)break;0===r&&n.clear(),void 0!==e&&(s=e(s,r));let o=n.startNode;void 0!==i&&(o=f(),i.endNode=o,n.endNode.parentNode.insertBefore(o,n.endNode)),i=new M(n.options),i.insertAfterNode(o),i.setValue(s),i.commit(),r++}}catch(t){s={error:t}}finally{try{a&&!a.done&&(o=l.return)&&await o.call(l)}finally{if(s)throw s.error}}});
+   * @license
+   * Copyright 2017 Google LLC
+   * SPDX-License-Identifier: BSD-3-Clause
+   */const xt=O(class extends lt{constructor(){super(...arguments),this._$Cft=1073741823,this._$Cwt=[],this._$CG=new ct(this),this._$CK=new at}render(...t){var e;return null!==(e=t.find(t=>!bt(t)))&&void 0!==e?e:_}update(t,e){const s=this._$Cwt;let n=s.length;this._$Cwt=e;const i=this._$CG,o=this._$CK;this.isConnected||this.disconnected();for(let t=0;t<e.length&&!(t>this._$Cft);t++){const r=e[t];if(!bt(r))return this._$Cft=t,r;t<n&&r===s[t]||(this._$Cft=1073741823,n=0,Promise.resolve(r).then(async t=>{for(;o.get();)await o.get();const e=i.deref();if(void 0!==e){const s=e._$Cwt.indexOf(r);s>-1&&s<e._$Cft&&(e._$Cft=s,e.setValue(t))}}))}return _}disconnected(){this._$CG.disconnect(),this._$CK.pause()}reconnected(){this._$CG.reconnect(this),this._$CK.resume()}}),Ct=O(class extends z{constructor(t){if(super(t),t.type!==W&&t.type!==D&&t.type!==j)throw Error("The `live` directive is not allowed on child or event bindings");if(!R(t))throw Error("`live` bindings can only contain a single expression")}render(t){return t}update(t,[e]){if(e===_||e===b)return e;const s=t.element,n=t.name;if(t.type===W){if(e===s[n])return _}else if(t.type===j){if(!!e===s.hasAttribute(n))return _}else if(t.type===D&&s.getAttribute(n)===e+"")return _;return J(t),e}}),wt=new WeakMap;
 /**
-     * @license
-     * Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
-     * This code may only be used under the BSD style license found at
-     * http://polymer.github.io/LICENSE.txt
-     * The complete set of authors may be found at
-     * http://polymer.github.io/AUTHORS.txt
-     * The complete set of contributors may be found at
-     * http://polymer.github.io/CONTRIBUTORS.txt
-     * Code distributed by Google as part of the polymer project is also
-     * subject to an additional IP rights grant found at
-     * http://polymer.github.io/PATENTS.txt
-     */var j=function(t){if(!Symbol.asyncIterator)throw new TypeError("Symbol.asyncIterator is not defined.");var e,n=t[Symbol.asyncIterator];return n?n.call(t):(t="function"==typeof __values?__values(t):t[Symbol.iterator](),e={},s("next"),s("throw"),s("return"),e[Symbol.asyncIterator]=function(){return this},e);function s(n){e[n]=t[n]&&function(e){return new Promise((function(s,o){(function(t,e,n,s){Promise.resolve(s).then((function(e){t({value:e,done:n})}),e)})(s,o,(e=t[n](e)).done,e.value)}))}}};const z=t((t,e)=>async n=>{var s,o;if(!(n instanceof M))throw new Error("asyncReplace can only be used in text bindings");if(t===n.value)return;const i=new M(n.options);n.value=t;let r=0;try{for(var a,l=j(t);!(a=await l.next()).done;){let s=a.value;if(n.value!==t)break;0===r&&(n.clear(),i.appendIntoPart(n)),void 0!==e&&(s=e(s,r)),i.setValue(s),i.commit(),r++}}catch(t){s={error:t}}finally{try{a&&!a.done&&(o=l.return)&&await o.call(l)}finally{if(s)throw s.error}}}),q=new WeakMap,G=t(t=>e=>{if(!(e instanceof M))throw new Error("cache can only be used in text bindings");let n=q.get(e);void 0===n&&(n=new WeakMap,q.set(e,n));const s=e.value;if(s instanceof g){if(t instanceof _&&s.template===e.options.templateFactory(t))return void e.setValue(t);{let t=n.get(s.template);void 0===t&&(t={instance:s,nodes:document.createDocumentFragment()},n.set(s.template,t)),o(t.nodes,e.startNode.nextSibling,e.endNode)}}if(t instanceof _){const s=e.options.templateFactory(t),o=n.get(s);void 0!==o&&(e.setValue(o.nodes),e.commit(),e.value=o.instance)}e.setValue(t)});
+   * @license
+   * Copyright 2020 Google LLC
+   * SPDX-License-Identifier: BSD-3-Clause
+   */class It extends z{constructor(){super(...arguments),this.ifFn=()=>!1}set(t){this.ifFn=t}render(){return b}update(t){const e=this.ifFn(),s=t.element;if(e)wt.has(t)||wt.set(t,{element:s,nextSibling:s.nextSibling,previousSibling:s.previousSibling,parent:s.parentNode}),s.remove();else{const e=wt.get(t);e&&(e.nextSibling&&e.nextSibling.parentNode?e.nextSibling.parentNode.insertBefore(e.element,e.nextSibling):e.previousSibling&&e.previousSibling.parentNode?e.previousSibling.parentNode.appendChild(e.element):e.parent&&e.parent.appendChild(e.element),wt.delete(t))}return this.render()}}
 /**
-     * @license
-     * Copyright (c) 2018 The Polymer Project Authors. All rights reserved.
-     * This code may only be used under the BSD style license found at
-     * http://polymer.github.io/LICENSE.txt
-     * The complete set of authors may be found at
-     * http://polymer.github.io/AUTHORS.txt
-     * The complete set of contributors may be found at
-     * http://polymer.github.io/CONTRIBUTORS.txt
-     * Code distributed by Google as part of the polymer project is also
-     * subject to an additional IP rights grant found at
-     * http://polymer.github.io/PATENTS.txt
-     */
+   * @license
+   * Copyright 2018 Google LLC
+   * SPDX-License-Identifier: BSD-3-Clause
+   */const Mt=O(class extends z{constructor(t){var e;if(super(t),t.type!==D||"style"!==t.name||(null===(e=t.strings)||void 0===e?void 0:e.length)>2)throw Error("The `styleMap` directive must be used in the `style` attribute and must be the only part in the attribute.")}render(t){return Object.keys(t).reduce((e,s)=>{const n=t[s];return null==n?e:e+`${s=s.replace(/(?:^(webkit|moz|ms|o)|)(?=[A-Z])/g,"-$&").toLowerCase()}:${n};`},"")}update(t,[e]){const{style:s}=t.element;if(void 0===this.ut){this.ut=new Set;for(const t in e)this.ut.add(t);return this.render(e)}this.ut.forEach(t=>{null==e[t]&&(this.ut.delete(t),t.includes("-")?s.removeProperty(t):s[t]="")});for(const t in e){const n=e[t];null!=n&&(this.ut.add(t),t.includes("-")?s.setProperty(t,n):s[t]=n)}return _}}),Yt=O(class extends z{constructor(t){var e;if(super(t),t.type!==D||"class"!==t.name||(null===(e=t.strings)||void 0===e?void 0:e.length)>2)throw Error("`classMap()` can only be used in the `class` attribute and must be the only part in the attribute.")}render(t){return" "+Object.keys(t).filter(e=>t[e]).join(" ")+" "}update(t,[e]){var s,n;if(void 0===this.st){this.st=new Set,void 0!==t.strings&&(this.et=new Set(t.strings.join(" ").split(/\s/).filter(t=>""!==t)));for(const t in e)e[t]&&!(null===(s=this.et)||void 0===s?void 0:s.has(t))&&this.st.add(t);return this.render(e)}const i=t.element.classList;this.st.forEach(t=>{t in e||(i.remove(t),this.st.delete(t))});for(const t in e){const s=!!e[t];s===this.st.has(t)||(null===(n=this.et)||void 0===n?void 0:n.has(t))||(s?(i.add(t),this.st.add(t)):(i.remove(t),this.st.delete(t)))}return _}});
 /**
-     * @license
-     * Copyright (c) 2018 The Polymer Project Authors. All rights reserved.
-     * This code may only be used under the BSD style license found at
-     * http://polymer.github.io/LICENSE.txt
-     * The complete set of authors may be found at
-     * http://polymer.github.io/AUTHORS.txt
-     * The complete set of contributors may be found at
-     * http://polymer.github.io/CONTRIBUTORS.txt
-     * Code distributed by Google as part of the polymer project is also
-     * subject to an additional IP rights grant found at
-     * http://polymer.github.io/PATENTS.txt
-     */
-class Z{constructor(t){this.classes=new Set,this.changed=!1,this.element=t;const e=(t.getAttribute("class")||"").split(/\s+/);for(const t of e)this.classes.add(t)}add(t){this.classes.add(t),this.changed=!0}remove(t){this.classes.delete(t),this.changed=!0}commit(){if(this.changed){let t="";this.classes.forEach(e=>t+=e+" "),this.element.setAttribute("class",t)}}}const J=new WeakMap,K=t(t=>e=>{if(!(e instanceof A)||e instanceof Y||"class"!==e.committer.name||e.committer.parts.length>1)throw new Error("The `classMap` directive must be used in the `class` attribute and must be the only part in the attribute.");const{committer:n}=e,{element:s}=n;let o=J.get(e);void 0===o&&(s.setAttribute("class",n.strings.join(" ")),J.set(e,o=new Set));const i=s.classList||new Z(s);o.forEach(e=>{e in t||(i.remove(e),o.delete(e))});for(const e in t){const n=t[e];n!=o.has(e)&&(n?(i.add(e),o.add(e)):(i.remove(e),o.delete(e)))}"function"==typeof i.commit&&i.commit()}),Q=new WeakMap,tt=t((t,e)=>n=>{const s=Q.get(n);if(Array.isArray(t)){if(Array.isArray(s)&&s.length===t.length&&t.every((t,e)=>t===s[e]))return}else if(s===t&&(void 0!==t||Q.has(n)))return;n.setValue(e()),Q.set(n,Array.isArray(t)?Array.from(t):t)}),et=new WeakMap,nt=t(t=>e=>{const n=et.get(e);if(void 0===t&&e instanceof A){if(void 0!==n||!et.has(e)){const t=e.committer.name;e.committer.element.removeAttribute(t)}}else t!==n&&e.setValue(t);et.set(e,t)}),st=(t,e)=>{const n=t.startNode.parentNode,s=void 0===e?t.endNode:e.startNode,o=n.insertBefore(f(),s);n.insertBefore(f(),s);const i=new M(t.options);return i.insertAfterNode(o),i},ot=(t,e)=>(t.setValue(e),t.commit(),t),it=(t,e,n)=>{const s=t.startNode.parentNode,i=n?n.startNode:t.endNode,r=e.endNode.nextSibling;r!==i&&o(s,e.startNode,r,i)},rt=t=>{i(t.startNode.parentNode,t.startNode,t.endNode.nextSibling)},at=(t,e,n)=>{const s=new Map;for(let o=e;o<=n;o++)s.set(t[o],o);return s},lt=new WeakMap,ct=new WeakMap,ht=t((t,e,n)=>{let s;return void 0===n?n=e:void 0!==e&&(s=e),e=>{if(!(e instanceof M))throw new Error("repeat can only be used in text bindings");const o=lt.get(e)||[],i=ct.get(e)||[],r=[],a=[],l=[];let c,h,d=0;for(const e of t)l[d]=s?s(e,d):d,a[d]=n(e,d),d++;let p=0,u=o.length-1,m=0,f=a.length-1;for(;p<=u&&m<=f;)if(null===o[p])p++;else if(null===o[u])u--;else if(i[p]===l[m])r[m]=ot(o[p],a[m]),p++,m++;else if(i[u]===l[f])r[f]=ot(o[u],a[f]),u--,f--;else if(i[p]===l[f])r[f]=ot(o[p],a[f]),it(e,o[p],r[f+1]),p++,f--;else if(i[u]===l[m])r[m]=ot(o[u],a[m]),it(e,o[u],o[p]),u--,m++;else if(void 0===c&&(c=at(l,m,f),h=at(i,p,u)),c.has(i[p]))if(c.has(i[u])){const t=h.get(l[m]),n=void 0!==t?o[t]:null;if(null===n){const t=st(e,o[p]);ot(t,a[m]),r[m]=t}else r[m]=ot(n,a[m]),it(e,n,o[p]),o[t]=null;m++}else rt(o[u]),u--;else rt(o[p]),p++;for(;m<=f;){const t=st(e,r[f+1]);ot(t,a[m]),r[m++]=t}for(;p<=u;){const t=o[p++];null!==t&&rt(t)}lt.set(e,r),ct.set(e,l)}}),dt=new WeakMap,pt=document.createElement("template"),ut=t(t=>e=>{if(!(e instanceof M))throw new Error("unsafeHTML can only be used in text bindings");const n=dt.get(e);if(void 0!==n&&N(t)&&t===n.value&&e.value===n.fragment)return;const s=pt.cloneNode();s.innerHTML=t;const o=document.importNode(s.content,!0);e.setValue(o),dt.set(e,{value:t,fragment:o})}),mt=new WeakMap,ft=t((...t)=>e=>{let n=mt.get(e);void 0===n&&(n={lastRenderedIndex:2147483647,values:[]},mt.set(e,n));const s=n.values;let o=s.length;n.values=t;for(let i=0;i<t.length&&!(i>n.lastRenderedIndex);i++){const r=t[i];if(N(r)||"function"!=typeof r.then){e.setValue(r),n.lastRenderedIndex=i;break}i<o&&r===s[i]||(n.lastRenderedIndex=2147483647,o=0,Promise.resolve(r).then(t=>{const s=n.values.indexOf(r);s>-1&&s<n.lastRenderedIndex&&(n.lastRenderedIndex=s,e.setValue(t),e.commit())}))}}),vt=t(t=>e=>{let n;if(e instanceof S||e instanceof M)throw new Error("The `live` directive is not allowed on text or event bindings");if(e instanceof C)gt(e.strings),n=e.element.hasAttribute(e.name),e.value=n;else{const{element:s,name:o,strings:i}=e.committer;if(gt(i),e instanceof Y){if(n=s[o],n===t)return}else e instanceof A&&(n=s.getAttribute(o));if(n===String(t))return}e.setValue(t)}),gt=t=>{if(2!==t.length||""!==t[0]||""!==t[1])throw new Error("`live` bindings can only contain a single expression")},yt=new WeakMap;class bt extends e{constructor(t){super(),this.ifFn=t}body(t){const e=this.ifFn(),n=t.committer.element;if(e)yt.has(t)||yt.set(t,{element:n,nextSibling:n.nextSibling,previousSibling:n.previousSibling,parent:n.parentNode}),n.remove();else{const e=yt.get(t);e&&(e.nextSibling&&e.nextSibling.parentNode?e.nextSibling.parentNode.insertBefore(e.element,e.nextSibling):e.previousSibling&&e.previousSibling.parentNode?e.previousSibling.parentNode.appendChild(e.element):e.parent&&e.parent.appendChild(e.element),yt.delete(t))}}}class xt extends e{constructor(t,e=!1){super(),this.toRemove=[],this.toUpdate=[],this.debug=!1,this.previous={},this.style=t,this.detach=e}setStyle(t){this.style=t}setDebug(t=!0){this.debug=t}setDetach(t){this.detach=t}body(t){this.toRemove.length=0,this.toUpdate.length=0;const e=t.committer.element,n=e.style;let s=this.previous;if(e.attributes.getNamedItem("style")){const t=e.attributes.getNamedItem("style").value.split(";").map(t=>t.substr(0,t.indexOf(":")).trim()).filter(t=>!!t);for(const e of t)void 0===this.style[e]&&(this.toRemove.includes(e)||this.toRemove.push(e))}for(const t in s)this.style.hasOwnProperty(t)&&void 0===this.style[t]&&(this.toRemove.includes(t)||this.toRemove.push(t));for(const t in this.style){if(!this.style.hasOwnProperty(t))continue;const e=this.style[t],n=s[t];void 0!==n&&n===e||this.toUpdate.push(t)}if(this.debug&&(console.log("[StyleMap] to remove",[...this.toRemove]),console.log("[StyleMap] to update",[...this.toUpdate])),this.toRemove.length||this.toUpdate.length){let t,s;this.detach&&(t=e.parentNode,t&&(s=e.nextSibling,e.remove()));for(const t of this.toRemove)n.removeProperty(t),n[t]&&delete n[t];for(const t of this.toUpdate){const e=this.style[t];t.includes("-")?n.setProperty(t,e):n[t]=e}this.detach&&t&&t.insertBefore(e,s),this.previous=Object.assign({},this.style)}}}class _t{constructor(){this.isAction=!0}}_t.prototype.isAction=!0;const wt={element:document.createTextNode(""),axis:"xy",threshold:10,onDown(){},onMove(){},onUp(){},onWheel(){}},Nt="undefined"!=typeof PointerEvent;let Et=0;class It extends _t{constructor(t,e){super(),this.moving="",this.initialX=0,this.initialY=0,this.lastY=0,this.lastX=0,this.onPointerDown=this.onPointerDown.bind(this),this.onPointerMove=this.onPointerMove.bind(this),this.onPointerUp=this.onPointerUp.bind(this),this.onWheel=this.onWheel.bind(this),this.element=t,this.id=++Et,this.options=Object.assign(Object.assign({},wt),e.pointerOptions),Nt?(t.addEventListener("pointerdown",this.onPointerDown),document.addEventListener("pointermove",this.onPointerMove),document.addEventListener("pointerup",this.onPointerUp)):(t.addEventListener("touchstart",this.onPointerDown),document.addEventListener("touchmove",this.onPointerMove,{passive:!1}),document.addEventListener("touchend",this.onPointerUp),document.addEventListener("touchcancel",this.onPointerUp),t.addEventListener("mousedown",this.onPointerDown),document.addEventListener("mousemove",this.onPointerMove,{passive:!1}),document.addEventListener("mouseup",this.onPointerUp))}normalizeMouseWheelEvent(t){let e=t.deltaX||0,n=t.deltaY||0,s=t.deltaZ||0;const o=t.deltaMode,i=parseInt(getComputedStyle(t.target).getPropertyValue("line-height"));let r=1;switch(o){case 1:r=i;break;case 2:r=window.height}return e*=r,n*=r,s*=r,{x:e,y:n,z:s,event:t}}onWheel(t){const e=this.normalizeMouseWheelEvent(t);this.options.onWheel(e)}normalizePointerEvent(t){let e={x:0,y:0,pageX:0,pageY:0,clientX:0,clientY:0,screenX:0,screenY:0,event:t};switch(t.type){case"wheel":const n=this.normalizeMouseWheelEvent(t);e.x=n.x,e.y=n.y,e.pageX=e.x,e.pageY=e.y,e.screenX=e.x,e.screenY=e.y,e.clientX=e.x,e.clientY=e.y;break;case"touchstart":case"touchmove":case"touchend":case"touchcancel":e.x=t.changedTouches[0].screenX,e.y=t.changedTouches[0].screenY,e.pageX=t.changedTouches[0].pageX,e.pageY=t.changedTouches[0].pageY,e.screenX=t.changedTouches[0].screenX,e.screenY=t.changedTouches[0].screenY,e.clientX=t.changedTouches[0].clientX,e.clientY=t.changedTouches[0].clientY;break;default:e.x=t.x,e.y=t.y,e.pageX=t.pageX,e.pageY=t.pageY,e.screenX=t.screenX,e.screenY=t.screenY,e.clientX=t.clientX,e.clientY=t.clientY}return e}onPointerDown(t){if("mousedown"===t.type&&0!==t.button)return;this.moving="xy";const e=this.normalizePointerEvent(t);this.lastX=e.x,this.lastY=e.y,this.initialX=e.x,this.initialY=e.y,this.options.onDown(e)}handleX(t){let e=t.x-this.lastX;return this.lastY=t.y,this.lastX=t.x,e}handleY(t){let e=t.y-this.lastY;return this.lastY=t.y,this.lastX=t.x,e}onPointerMove(t){if(""===this.moving||"mousemove"===t.type&&0!==t.button)return;const e=this.normalizePointerEvent(t);if("x|y"===this.options.axis){let n=0,s=0;("x"===this.moving||"xy"===this.moving&&Math.abs(e.x-this.initialX)>this.options.threshold)&&(this.moving="x",n=this.handleX(e)),("y"===this.moving||"xy"===this.moving&&Math.abs(e.y-this.initialY)>this.options.threshold)&&(this.moving="y",s=this.handleY(e)),this.options.onMove({movementX:n,movementY:s,x:e.x,y:e.y,initialX:this.initialX,initialY:this.initialY,lastX:this.lastX,lastY:this.lastY,event:t})}else if("xy"===this.options.axis){let n=0,s=0;Math.abs(e.x-this.initialX)>this.options.threshold&&(n=this.handleX(e)),Math.abs(e.y-this.initialY)>this.options.threshold&&(s=this.handleY(e)),this.options.onMove({movementX:n,movementY:s,x:e.x,y:e.y,initialX:this.initialX,initialY:this.initialY,lastX:this.lastX,lastY:this.lastY,event:t})}else if("x"===this.options.axis)("x"===this.moving||"xy"===this.moving&&Math.abs(e.x-this.initialX)>this.options.threshold)&&(this.moving="x",this.options.onMove({movementX:this.handleX(e),movementY:0,initialX:this.initialX,initialY:this.initialY,lastX:this.lastX,lastY:this.lastY,event:t}));else if("y"===this.options.axis){let n=0;("y"===this.moving||"xy"===this.moving&&Math.abs(e.y-this.initialY)>this.options.threshold)&&(this.moving="y",n=this.handleY(e)),this.options.onMove({movementX:0,movementY:n,x:e.x,y:e.y,initialX:this.initialX,initialY:this.initialY,lastX:this.lastX,lastY:this.lastY,event:t})}}onPointerUp(t){this.moving="";const e=this.normalizePointerEvent(t);this.options.onUp({movementX:0,movementY:0,x:e.x,y:e.y,initialX:this.initialX,initialY:this.initialY,lastX:this.lastX,lastY:this.lastY,event:t}),this.lastY=0,this.lastX=0}destroy(t){Nt?(t.removeEventListener("pointerdown",this.onPointerDown),document.removeEventListener("pointermove",this.onPointerMove),document.removeEventListener("pointerup",this.onPointerUp)):(t.removeEventListener("mousedown",this.onPointerDown),document.removeEventListener("mousemove",this.onPointerMove),document.removeEventListener("mouseup",this.onPointerUp),t.removeEventListener("touchstart",this.onPointerDown),document.removeEventListener("touchmove",this.onPointerMove),document.removeEventListener("touchend",this.onPointerUp),document.removeEventListener("touchcancel",this.onPointerUp))}}function Pt(t){let e=0;return function(n){e||(e=requestAnimationFrame((function(){e=0,t.apply(void 0,[n])})))}}function At(t){return t&&t.constructor?"Object"===t.constructor.name:"object"==typeof t&&null!==t}function Mt(t){if(void 0!==t.actions){const e=t.actions.map(t=>{const e=Object.assign({},t),n=Object.assign({},e.props);return delete n.state,delete n.api,delete e.element,e.props=n,e});t.actions=e}return function t(e,...n){const s=n.shift();if(At(e)&&At(s))for(const n in s)if(At(s[n]))"function"==typeof s[n].clone?e[n]=s[n].clone():(void 0===e[n]&&(e[n]={}),e[n]=t(e[n],s[n]));else if(Array.isArray(s[n])){e[n]=new Array(s[n].length);let o=0;for(let i of s[n])At(i)?"function"==typeof i.clone?e[n][o]=i.clone():e[n][o]=t({},i):e[n][o]=i,o++}else e[n]=s[n];return n.length?t(e,...n):e}({},t)}class Ct{constructor(t,e){this.slotInstances={},this.destroyed=!1,this.vido=t,this.props=e,this.destroy=this.destroy.bind(this),this.change=this.change.bind(this),this.html=this.html.bind(this),this.getInstances=this.getInstances.bind(this),this.setComponents=this.setComponents.bind(this),this.vido.onDestroy(()=>{this.destroy()})}setComponents(t){if(t&&!this.destroyed){for(const e in t){const n=t[e];void 0===this.slotInstances[e]&&(this.slotInstances[e]=[]);for(const t of this.slotInstances[e])t.destroy();this.slotInstances[e].length=0;for(const t of n)this.slotInstances[e].push(this.vido.createComponent(t,this.props))}this.vido.update()}}destroy(){if(!this.destroyed){for(const t in this.slotInstances){for(const e of this.slotInstances[t])e.destroy();this.slotInstances[t].length=0}this.destroyed=!0}}change(t,e){if(!this.destroyed)for(const n in this.slotInstances){const s=this.slotInstances[n];for(const n of s)n.change(t,e)}}getInstances(t){return this.destroyed?[]:void 0===t?this.slotInstances:this.slotInstances[t]}html(t,e){if(this.destroyed)return;if(!this.slotInstances[t]||0===this.slotInstances[t].length)return e;let n=e;for(const e of this.slotInstances[t])n=e.html(n);return n}getProps(){return this.props}isDestroyed(){return this.destroyed}}function Xt(n,s){let o=0;const i=new Map;let r,a,l=new Map,c=0;const h=[],d=Promise.resolve(),p={},u=function(t){return class extends e{constructor(t){super(),this.actions=[],this.instance=t}set(t,e){return this.actions=t,this.props=e,this}body(e){const n=e.committer.element;for(const e of this.actions)if(void 0!==e){let s;if(t.has(this.instance))for(const o of t.get(this.instance))if(o.componentAction.create===e&&o.element===n){s=o;break}if(s)s.props=this.props;else{void 0!==n.vido&&delete n.vido;const s={create:e,update(){},destroy(){}},o={instance:this.instance,componentAction:s,element:n,props:this.props};let i=[];t.has(this.instance)&&(i=t.get(this.instance)),i.push(o),t.set(this.instance,i)}}}}}(l);class m{constructor(t){this.instance=t}create(t,e){const n=new u(this.instance);return n.set(t,e),n}}const f=function(t,e,n){return class{constructor(t,e,n={}){this.destroyed=!1,this.instance=t,this.name=e.name,this.vidoInstance=e,this.props=n,this.destroy=this.destroy.bind(this),this.update=this.update.bind(this),this.change=this.change.bind(this),this.html=this.html.bind(this)}destroy(){this.destroyed||(this.vidoInstance.debug&&(console.groupCollapsed(`destroying component ${this.instance}`),console.log(n({components:t.keys(),actionsByInstance:e})),console.trace(),console.groupEnd()),this.vidoInstance.destroyComponent(this.instance,this.vidoInstance),this.destroyed=!0)}update(s){return this.vidoInstance.debug&&(console.groupCollapsed(`updating component ${this.instance}`),console.log(n({components:t.keys(),actionsByInstance:e})),console.trace(),console.groupEnd()),this.vidoInstance.updateTemplate(s)}change(s,o={}){this.vidoInstance.debug&&(console.groupCollapsed(`changing component ${this.instance}`),console.log(n({props:this.props,newProps:s,components:t.keys(),actionsByInstance:e})),console.trace(),console.groupEnd());const i=t.get(this.instance);i&&i.change(s,o)}html(e={}){const n=t.get(this.instance);if(n&&!n.destroyed)return n.update(e,this.vidoInstance)}_getComponents(){return t}_getActions(){return e}}}(i,l,Mt),v=function(t,e,n){return class{constructor(t,e,n){this.destroyed=!1,this.instance=t,this.vidoInstance=e,this.renderFunction=n,this.destroy=this.destroy.bind(this),this.update=this.update.bind(this),this.change=this.change.bind(this)}destroy(){if(!this.destroyed){this.vidoInstance.debug&&(console.groupCollapsed(`component destroy method fired ${this.instance}`),console.log(n({props:this.vidoInstance.props,components:t.keys(),destroyable:this.vidoInstance.destroyable,actionsByInstance:e})),console.trace(),console.groupEnd()),this.content&&"function"==typeof this.content.destroy&&this.content.destroy();for(const t of this.vidoInstance.destroyable)t();this.vidoInstance.onChangeFunctions.length=0,this.vidoInstance.destroyable.length=0,this.vidoInstance.destroyed=!0,this.destroyed=!0,this.vidoInstance.update()}}update(s={}){return this.vidoInstance.debug&&(console.groupCollapsed(`component update method fired ${this.instance}`),console.log(n({components:t.keys(),actionsByInstance:e})),console.trace(),console.groupEnd()),this.renderFunction(s)}change(s,o={leave:!1}){const i=s;this.vidoInstance.debug&&(console.groupCollapsed(`component change method fired ${this.instance}`),console.log(n({props:i,components:t.keys(),onChangeFunctions:this.vidoInstance.onChangeFunctions,changedProps:s,actionsByInstance:e})),console.trace(),console.groupEnd());for(const t of this.vidoInstance.onChangeFunctions)t(s,o)}}}(i,l,Mt);class g{constructor(e="",o=""){this.instance="",this.name="",this.destroyable=[],this.destroyed=!1,this.onChangeFunctions=[],this.debug=!1,this.state=n,this.api=s,this.lastProps={},this.html=B,this.svg=F,this.directive=t,this.asyncAppend=H,this.asyncReplace=z,this.cache=G,this.classMap=K,this.guard=tt,this.live=vt,this.ifDefined=nt,this.repeat=ht,this.unsafeHTML=ut,this.until=ft,this.schedule=Pt,this.getElement=function(t){return function(e){return t(()=>t=>{e(t.committer.element)})()}}(t),this.actionsByInstance=()=>{},this.StyleMap=xt,this.Detach=bt,this.PointerAction=It,this.Action=_t,this.Slots=Ct,this._components=i,this._actions=l,this.instance=e,this.reuseComponents=this.reuseComponents.bind(this),this.onDestroy=this.onDestroy.bind(this),this.onChange=this.onChange.bind(this),this.update=this.update.bind(this),this.destroyComponent=this.destroyComponent.bind(this);for(const t in p)this[t]=p[t].bind(this);this.name=o,this.Actions=new m(e)}static addMethod(t,e){p[t]=e}onDestroy(t){this.destroyable.push(t)}onChange(t){this.onChangeFunctions.push(t)}update(t){return this.updateTemplate(t)}reuseComponents(t,e,n,s,o=!0,i=!1){const r=[],a=t.length,l=e.length;let c=!1;!o||void 0!==e&&0!==e.length||(c=!0);let h=0;if(a<l){let o=l-a;for(;o;){const i=e[l-o],a=this.createComponent(s,n(i));t.push(a),r.push(a),o--}}else if(a>l){let e=a-l;for(o&&(c=!0,h=a-e);e;){const n=a-e;o||(r.push(t[n]),t[n].destroy()),e--}o||(t.length=l)}let d=0;i&&console.log("modified components",r),i&&console.log("current components",t),i&&console.log("data array",e);for(const s of t){const t=e[d];i&&console.log(`reuse components data at '${d}'`,t),s&&!r.includes(s)&&(i&&console.log("getProps fn result",n(t)),s.change(n(t),{leave:c&&d>=h})),d++}}createComponent(t,e={}){const n=t.name+":"+o++;let s;s=new g(n,t.name);const r=new f(n,s,e),a=new v(n,s,t(s,e));return i.set(n,a),i.get(n).change(e),s.debug&&(console.groupCollapsed(`component created ${n}`),console.log(Mt({props:e,components:i.keys(),actionsByInstance:l})),console.trace(),console.groupEnd()),r}destroyComponent(t,e){if(e.debug&&(console.groupCollapsed(`destroying component ${t}...`),console.log(Mt({components:i.keys(),actionsByInstance:l})),console.trace(),console.groupEnd()),l.has(t))for(const e of l.get(t))"function"==typeof e.componentAction.destroy&&e.componentAction.destroy(e.element,e.props);l.delete(t);const n=i.get(t);n?(n.destroy(),i.delete(t),e.debug&&(console.groupCollapsed(`component destroyed ${t}`),console.log(Mt({components:i.keys(),actionsByInstance:l})),console.trace(),console.groupEnd())):console.warn(`No component to destroy! [${t}]`)}executeActions(){for(const t of l.values()){for(const e of t)if(void 0===e.element.vido){const t=i.get(e.instance);e.isActive=function(){return t&&!1===t.destroyed};const n=e.componentAction,s=n.create;if(void 0!==s){let t;t=s.prototype&&(s.prototype.isAction||s.prototype.update||s.prototype.destroy)||s.isAction?new s(e.element,e.props):s(e.element,e.props),void 0!==t&&("function"==typeof t?n.destroy=t:("function"==typeof t.update&&(n.update=t.update.bind(t)),"function"==typeof t.destroy&&(n.destroy=t.destroy.bind(t))))}}else e.element.vido=e.props,"function"==typeof e.componentAction.update&&e.isActive()&&e.componentAction.update(e.element,e.props);for(const e of t)e.element.vido=e.props}}updateTemplate(t){return t&&h.push(t),new Promise(t=>{const e=++c,n=this;d.then((function(){if(e===c){c=0,n.render();for(const t of h)t();h.length=0,t(null)}}))})}createApp(t){a=t.element;const e=this.createComponent(t.component,t.props);return r=e.instance,this.render(),e}render(){const t=i.get(r);t?(W(t.update(),a),this.executeActions()):a&&a.remove()}}return new g}return Xt.prototype.lithtml=U,Xt.prototype.Action=_t,Xt.prototype.Directive=e,Xt.prototype.schedule=Pt,Xt.prototype.Detach=bt,Xt.prototype.StyleMap=xt,Xt.prototype.PointerAction=It,Xt.prototype.asyncAppend=H,Xt.prototype.asyncReplace=z,Xt.prototype.cache=G,Xt.prototype.classMap=K,Xt.prototype.guard=tt,Xt.prototype.live=vt,Xt.prototype.ifDefined=nt,Xt.prototype.repeat=ht,Xt.prototype.unsafeHTML=ut,Xt.prototype.until=ft,Xt.prototype.Slots=Ct,Xt}));
+   * @license
+   * Copyright 2018 Google LLC
+   * SPDX-License-Identifier: BSD-3-Clause
+   */class Xt{constructor(){this.isAction=!0}}Xt.prototype.isAction=!0;const Pt={element:document.createTextNode(""),axis:"xy",threshold:10,onDown(){},onMove(){},onUp(){},onWheel(){}},Et="undefined"!=typeof PointerEvent;let Tt=0;class Ht extends Xt{constructor(t,e){super(),this.moving="",this.initialX=0,this.initialY=0,this.lastY=0,this.lastX=0,this.onPointerDown=this.onPointerDown.bind(this),this.onPointerMove=this.onPointerMove.bind(this),this.onPointerUp=this.onPointerUp.bind(this),this.onWheel=this.onWheel.bind(this),this.element=t,this.id=++Tt,this.options=Object.assign(Object.assign({},Pt),e.pointerOptions),Et?(t.addEventListener("pointerdown",this.onPointerDown),document.addEventListener("pointermove",this.onPointerMove),document.addEventListener("pointerup",this.onPointerUp)):(t.addEventListener("touchstart",this.onPointerDown),document.addEventListener("touchmove",this.onPointerMove,{passive:!1}),document.addEventListener("touchend",this.onPointerUp),document.addEventListener("touchcancel",this.onPointerUp),t.addEventListener("mousedown",this.onPointerDown),document.addEventListener("mousemove",this.onPointerMove,{passive:!1}),document.addEventListener("mouseup",this.onPointerUp))}normalizeMouseWheelEvent(t){let e=t.deltaX||0,s=t.deltaY||0,n=t.deltaZ||0;const i=t.deltaMode,o=parseInt(getComputedStyle(t.target).getPropertyValue("line-height"));let r=1;switch(i){case 1:r=o;break;case 2:r=window.height}return e*=r,s*=r,n*=r,{x:e,y:s,z:n,event:t}}onWheel(t){const e=this.normalizeMouseWheelEvent(t);this.options.onWheel(e)}normalizePointerEvent(t){let e={x:0,y:0,pageX:0,pageY:0,clientX:0,clientY:0,screenX:0,screenY:0,event:t};switch(t.type){case"wheel":const s=this.normalizeMouseWheelEvent(t);e.x=s.x,e.y=s.y,e.pageX=e.x,e.pageY=e.y,e.screenX=e.x,e.screenY=e.y,e.clientX=e.x,e.clientY=e.y;break;case"touchstart":case"touchmove":case"touchend":case"touchcancel":e.x=t.changedTouches[0].screenX,e.y=t.changedTouches[0].screenY,e.pageX=t.changedTouches[0].pageX,e.pageY=t.changedTouches[0].pageY,e.screenX=t.changedTouches[0].screenX,e.screenY=t.changedTouches[0].screenY,e.clientX=t.changedTouches[0].clientX,e.clientY=t.changedTouches[0].clientY;break;default:e.x=t.x,e.y=t.y,e.pageX=t.pageX,e.pageY=t.pageY,e.screenX=t.screenX,e.screenY=t.screenY,e.clientX=t.clientX,e.clientY=t.clientY}return e}onPointerDown(t){if("mousedown"===t.type&&0!==t.button)return;this.moving="xy";const e=this.normalizePointerEvent(t);this.lastX=e.x,this.lastY=e.y,this.initialX=e.x,this.initialY=e.y,this.options.onDown(e)}handleX(t){let e=t.x-this.lastX;return this.lastY=t.y,this.lastX=t.x,e}handleY(t){let e=t.y-this.lastY;return this.lastY=t.y,this.lastX=t.x,e}onPointerMove(t){if(""===this.moving||"mousemove"===t.type&&0!==t.button)return;const e=this.normalizePointerEvent(t);if("x|y"===this.options.axis){let s=0,n=0;("x"===this.moving||"xy"===this.moving&&Math.abs(e.x-this.initialX)>this.options.threshold)&&(this.moving="x",s=this.handleX(e)),("y"===this.moving||"xy"===this.moving&&Math.abs(e.y-this.initialY)>this.options.threshold)&&(this.moving="y",n=this.handleY(e)),this.options.onMove({movementX:s,movementY:n,x:e.x,y:e.y,initialX:this.initialX,initialY:this.initialY,lastX:this.lastX,lastY:this.lastY,event:t})}else if("xy"===this.options.axis){let s=0,n=0;Math.abs(e.x-this.initialX)>this.options.threshold&&(s=this.handleX(e)),Math.abs(e.y-this.initialY)>this.options.threshold&&(n=this.handleY(e)),this.options.onMove({movementX:s,movementY:n,x:e.x,y:e.y,initialX:this.initialX,initialY:this.initialY,lastX:this.lastX,lastY:this.lastY,event:t})}else if("x"===this.options.axis)("x"===this.moving||"xy"===this.moving&&Math.abs(e.x-this.initialX)>this.options.threshold)&&(this.moving="x",this.options.onMove({movementX:this.handleX(e),movementY:0,initialX:this.initialX,initialY:this.initialY,lastX:this.lastX,lastY:this.lastY,event:t}));else if("y"===this.options.axis){let s=0;("y"===this.moving||"xy"===this.moving&&Math.abs(e.y-this.initialY)>this.options.threshold)&&(this.moving="y",s=this.handleY(e)),this.options.onMove({movementX:0,movementY:s,x:e.x,y:e.y,initialX:this.initialX,initialY:this.initialY,lastX:this.lastX,lastY:this.lastY,event:t})}}onPointerUp(t){this.moving="";const e=this.normalizePointerEvent(t);this.options.onUp({movementX:0,movementY:0,x:e.x,y:e.y,initialX:this.initialX,initialY:this.initialY,lastX:this.lastX,lastY:this.lastY,event:t}),this.lastY=0,this.lastX=0}destroy(t){Et?(t.removeEventListener("pointerdown",this.onPointerDown),document.removeEventListener("pointermove",this.onPointerMove),document.removeEventListener("pointerup",this.onPointerUp)):(t.removeEventListener("mousedown",this.onPointerDown),document.removeEventListener("mousemove",this.onPointerMove),document.removeEventListener("mouseup",this.onPointerUp),t.removeEventListener("touchstart",this.onPointerDown),document.removeEventListener("touchmove",this.onPointerMove),document.removeEventListener("touchend",this.onPointerUp),document.removeEventListener("touchcancel",this.onPointerUp))}}function Nt(t){let e=0;return function(s){e||(e=requestAnimationFrame((function(){e=0,t.apply(void 0,[s])})))}}function St(t){return t&&t.constructor?"Object"===t.constructor.name:"object"==typeof t&&null!==t}function Lt(t){if(void 0!==t.actions){const e=t.actions.map(t=>{const e=Object.assign({},t),s=Object.assign({},e.props);return delete s.state,delete s.api,delete e.element,e.props=s,e});t.actions=e}return function t(e,...s){const n=s.shift();if(St(e)&&St(n))for(const s in n)if(St(n[s]))"function"==typeof n[s].clone?e[s]=n[s].clone():(void 0===e[s]&&(e[s]={}),e[s]=t(e[s],n[s]));else if(Array.isArray(n[s])){e[s]=new Array(n[s].length);let i=0;for(let o of n[s])St(o)?"function"==typeof o.clone?e[s][i]=o.clone():e[s][i]=t({},o):e[s][i]=o,i++}else e[s]=n[s];return s.length?t(e,...s):e}({},t)}class Ut{constructor(t,e){this.slotInstances={},this.destroyed=!1,this.vido=t,this.props=e,this.destroy=this.destroy.bind(this),this.change=this.change.bind(this),this.html=this.html.bind(this),this.getInstances=this.getInstances.bind(this),this.setComponents=this.setComponents.bind(this),this.vido.onDestroy(()=>{this.destroy()})}setComponents(t){if(t&&!this.destroyed){for(const e in t){const s=t[e];void 0===this.slotInstances[e]&&(this.slotInstances[e]=[]);for(const t of this.slotInstances[e])t.destroy();this.slotInstances[e].length=0;for(const t of s)this.slotInstances[e].push(this.vido.createComponent(t,this.props))}this.vido.update()}}destroy(){if(!this.destroyed){for(const t in this.slotInstances){for(const e of this.slotInstances[t])e.destroy();this.slotInstances[t].length=0}this.destroyed=!0}}change(t,e){if(!this.destroyed)for(const s in this.slotInstances){const n=this.slotInstances[s];for(const s of n)s.change(t,e)}}getInstances(t){return this.destroyed?[]:void 0===t?this.slotInstances:this.slotInstances[t]}html(t,e){if(this.destroyed)return;if(!this.slotInstances[t]||0===this.slotInstances[t].length)return e;let s=e;for(const e of this.slotInstances[t])s=e.html(s);return s}getProps(){return this.props}isDestroyed(){return this.destroyed}}class kt extends z{update(t,e){const s=e[0];if("function"!=typeof s)throw new Error("[vido] Argument for getElement directive should be a function.");s(t.element)}render(){return null}}function Dt(t,e){let s=0;const n=new Map;let i,o,r=new Map,h=0;const l=[],c=Promise.resolve(),a={},d=function(t){return class extends z{update(e,s){const n=e.element,i=s[0],o=s[1],r=s[2];for(const e of o)if(void 0!==e){let s;if(t.has(i))for(const o of t.get(i))if(o.componentAction.create===e&&o.element===n){s=o;break}if(s)s.props=r;else{void 0!==n.vido&&delete n.vido;const s={instance:i,componentAction:{create:e,update(){},destroy(){}},element:n,props:r};let o=[];t.has(i)&&(o=t.get(i)),o.push(s),t.set(i,o)}}}render(t,e,s){return b}}}(r);class u{constructor(t){this.instance=t}create(t,e){const s=O(d);return()=>s(this.instance,t,e)}}const p=function(t,e,s){return class{constructor(t,e,s={}){this.destroyed=!1,this.instance=t,this.name=e.name,this.vidoInstance=e,this.props=s,this.destroy=this.destroy.bind(this),this.update=this.update.bind(this),this.change=this.change.bind(this),this.html=this.html.bind(this)}destroy(){this.destroyed||(this.vidoInstance.debug&&(console.groupCollapsed("destroying component "+this.instance),console.log(s({components:t.keys(),actionsByInstance:e})),console.trace(),console.groupEnd()),this.vidoInstance.destroyComponent(this.instance,this.vidoInstance),this.destroyed=!0)}update(n){return this.vidoInstance.debug&&(console.groupCollapsed("updating component "+this.instance),console.log(s({components:t.keys(),actionsByInstance:e})),console.trace(),console.groupEnd()),this.vidoInstance.updateTemplate(n)}change(n,i={}){this.vidoInstance.debug&&(console.groupCollapsed("changing component "+this.instance),console.log(s({props:this.props,newProps:n,components:t.keys(),actionsByInstance:e})),console.trace(),console.groupEnd());const o=t.get(this.instance);o&&o.change(n,i)}html(e={}){const s=t.get(this.instance);if(s&&!s.destroyed)return s.update(e,this.vidoInstance)}_getComponents(){return t}_getActions(){return e}}}(n,r,Lt),v=function(t,e,s){return class{constructor(t,e,s){this.destroyed=!1,this.instance=t,this.vidoInstance=e,this.renderFunction=s,this.destroy=this.destroy.bind(this),this.update=this.update.bind(this),this.change=this.change.bind(this)}destroy(){if(!this.destroyed){this.vidoInstance.debug&&(console.groupCollapsed("component destroy method fired "+this.instance),console.log(s({props:this.vidoInstance.props,components:t.keys(),destroyable:this.vidoInstance.destroyable,actionsByInstance:e})),console.trace(),console.groupEnd()),this.content&&"function"==typeof this.content.destroy&&this.content.destroy();for(const t of this.vidoInstance.destroyable)t();this.vidoInstance.onChangeFunctions.length=0,this.vidoInstance.destroyable.length=0,this.vidoInstance.destroyed=!0,this.destroyed=!0,this.vidoInstance.update()}}update(n={}){return this.vidoInstance.debug&&(console.groupCollapsed("component update method fired "+this.instance),console.log(s({components:t.keys(),actionsByInstance:e})),console.trace(),console.groupEnd()),this.renderFunction(n)}change(n,i={leave:!1}){const o=n;this.vidoInstance.debug&&(console.groupCollapsed("component change method fired "+this.instance),console.log(s({props:o,components:t.keys(),onChangeFunctions:this.vidoInstance.onChangeFunctions,changedProps:n,actionsByInstance:e})),console.trace(),console.groupEnd());for(const t of this.vidoInstance.onChangeFunctions)t(n,i)}}}(n,r,Lt);class f{constructor(s="",i=""){this.instance="",this.name="",this.destroyable=[],this.destroyed=!1,this.onChangeFunctions=[],this.debug=!1,this.state=t,this.api=e,this.lastProps={},this.html=$,this.svg=A,this.directive=O,this.asyncAppend=pt,this.asyncReplace=ut,this.cache=vt,this.classMap=Yt,this.styleMap=Mt,this.guard=mt,this.live=Ct,this.ifDefined=gt,this.repeat=$t,this.unsafeHTML=_t,this.until=xt,this.schedule=Nt,this.getElement=O(kt),this.actionsByInstance=()=>{},this.Detach=It,this.PointerAction=Ht,this.Action=Xt,this.Slots=Ut,this._components=n,this._actions=r,this.instance=s,this.reuseComponents=this.reuseComponents.bind(this),this.onDestroy=this.onDestroy.bind(this),this.onChange=this.onChange.bind(this),this.update=this.update.bind(this),this.destroyComponent=this.destroyComponent.bind(this);for(const t in a)this[t]=a[t].bind(this);this.name=i,this.Actions=new u(s)}static addMethod(t,e){a[t]=e}onDestroy(t){this.destroyable.push(t)}onChange(t){this.onChangeFunctions.push(t)}update(t){return this.updateTemplate(t)}reuseComponents(t,e,s,n,i=!0,o=!1){const r=[],h=t.length,l=e.length;let c=!1;!i||void 0!==e&&0!==e.length||(c=!0);let a=0;if(h<l){let i=l-h;for(;i;){const o=e[l-i],h=this.createComponent(n,s(o));t.push(h),r.push(h),i--}}else if(h>l){let e=h-l;for(i&&(c=!0,a=h-e);e;){const s=h-e;i||(r.push(t[s]),t[s].destroy()),e--}i||(t.length=l)}let d=0;o&&console.log("modified components",r),o&&console.log("current components",t),o&&console.log("data array",e);for(const n of t){const t=e[d];o&&console.log(`reuse components data at '${d}'`,t),n&&!r.includes(n)&&(o&&console.log("getProps fn result",s(t)),n.change(s(t),{leave:c&&d>=a})),d++}}createComponent(t,e={}){const i=t.name+":"+s++;let o;o=new f(i,t.name);const h=new p(i,o,e),l=new v(i,o,t(o,e));return n.set(i,l),n.get(i).change(e),o.debug&&(console.groupCollapsed("component created "+i),console.log(Lt({props:e,components:n.keys(),actionsByInstance:r})),console.trace(),console.groupEnd()),h}destroyComponent(t,e){if(e.debug&&(console.groupCollapsed(`destroying component ${t}...`),console.log(Lt({components:n.keys(),actionsByInstance:r})),console.trace(),console.groupEnd()),r.has(t))for(const e of r.get(t))"function"==typeof e.componentAction.destroy&&e.componentAction.destroy(e.element,e.props);r.delete(t);const s=n.get(t);s?(s.destroy(),n.delete(t),e.debug&&(console.groupCollapsed("component destroyed "+t),console.log(Lt({components:n.keys(),actionsByInstance:r})),console.trace(),console.groupEnd())):console.warn(`No component to destroy! [${t}]`)}executeActions(){for(const t of r.values()){for(const e of t)if(void 0===e.element.vido){const t=n.get(e.instance);e.isActive=function(){return t&&!1===t.destroyed};const s=e.componentAction,i=s.create;if(void 0!==i){let t;t=i.prototype&&(i.prototype.isAction||i.prototype.update||i.prototype.destroy)||i.isAction?new i(e.element,e.props):i(e.element,e.props),void 0!==t&&("function"==typeof t?s.destroy=t:("function"==typeof t.update&&(s.update=t.update.bind(t)),"function"==typeof t.destroy&&(s.destroy=t.destroy.bind(t))))}}else e.element.vido=e.props,"function"==typeof e.componentAction.update&&e.isActive()&&e.componentAction.update(e.element,e.props);for(const e of t)e.element.vido=e.props}}updateTemplate(t){return t&&l.push(t),new Promise(t=>{const e=++h,s=this;c.then((function(){if(e===h){h=0,s.render();for(const t of l)t();l.length=0,t(null)}}))})}createApp(t){o=t.element;const e=this.createComponent(t.component,t.props);return i=e.instance,this.render(),e}render(){const t=n.get(i);t?(C(t.update(),o),this.executeActions()):o&&o.remove()}}return new f}return Dt.prototype.lithtml=k,Dt.prototype.Action=Xt,Dt.prototype.Directive=z,Dt.prototype.schedule=Nt,Dt.prototype.Detach=It,Dt.prototype.styleMap=Mt,Dt.prototype.classMap=Yt,Dt.prototype.PointerAction=Ht,Dt.prototype.asyncAppend=pt,Dt.prototype.asyncReplace=ut,Dt.prototype.cache=vt,Dt.prototype.guard=mt,Dt.prototype.live=Ct,Dt.prototype.ifDefined=gt,Dt.prototype.repeat=$t,Dt.prototype.unsafeHTML=_t,Dt.prototype.until=xt,Dt.prototype.Slots=Ut,Dt}));
 //# sourceMappingURL=vido.umd.min.js.map

package.json

 {
   "name": "@neuronet.io/vido",
-  "version": "3.2.11",
+  "version": "4.0.0",
   "description": "Compilation-less and eval free frontend framework for fast scalable apps.",
@@ -35,8 +35,8 @@ "main": "dist/vido.umd.min.js",
   "devDependencies": {
-    "expect": "^24.9.0",
-    "jest": "^26.0.1",
-    "jest-puppeteer": "^4.4.0",
+    "expect": "^27.2.5",
+    "jest": "^27.2.5",
+    "jest-puppeteer": "^6.0.0",
     "npm-run-all": "^4.1.5",
     "prettier": "^2.0.5",
-    "puppeteer": "^3.0.4",
+    "puppeteer": "^10.4.0",
     "rollup": "^1.32.1",
@@ -52,4 +52,4 @@ "rollup-plugin-commonjs": "^10.1.0",
     "csstype": "^2.6.10",
-    "lit-html-optimised": "^1.3.0"
+    "lit-html": "^2.0.1"
   }
 }

src/ActionsCollector.ts

@@ -1,29 +0,17 @@
-import { Directive, AttributePart } from 'lit-html-optimised';
+import { Directive, AttributePart } from 'lit-html/directive';
+import { nothing } from 'lit-html';
 
 export default function getActionsCollector(actionsByInstance: Map<string, any>) {
   return class ActionsCollector extends Directive {
-    instance: string;
-    actions: unknown[] = [];
-    props: unknown;
+    public update(part: AttributePart, props: unknown[]) {
+      const element = part.element;
+      const instance = props[0] as string;
+      const actions = props[1] as unknown[];
+      const actionProps = props[2] as object;
 
-    constructor(instance: string) {
-      super();
-      this.instance = instance;
-    }
-
-    public set(actions: unknown[], props: object) {
-      this.actions = actions;
-      this.props = props;
-      // props must be mutable! (do not do this -> {...props})
-      // because we will modify action props with onChange and can reuse existin instance
-      return this;
-    }
-
-    public body(part: AttributePart) {
-      const element = part.committer.element as HTMLElement;
-      for (const create of this.actions) {
+      for (const create of actions) {
         if (typeof create !== 'undefined') {
           let exists;
-          if (actionsByInstance.has(this.instance)) {
-            for (const action of actionsByInstance.get(this.instance)) {
+          if (actionsByInstance.has(instance)) {
+            for (const action of actionsByInstance.get(instance)) {
               if (action.componentAction.create === create && action.element === element) {
@@ -43,11 +31,11 @@ exists = action;
             };
-            const action = { instance: this.instance, componentAction, element, props: this.props };
+            const action = { instance: instance, componentAction, element, props: actionProps };
             let byInstance = [];
-            if (actionsByInstance.has(this.instance)) {
-              byInstance = actionsByInstance.get(this.instance);
+            if (actionsByInstance.has(instance)) {
+              byInstance = actionsByInstance.get(instance);
             }
             byInstance.push(action);
-            actionsByInstance.set(this.instance, byInstance);
+            actionsByInstance.set(instance, byInstance);
           } else {
-            exists.props = this.props;
+            exists.props = actionProps;
           }
@@ -57,3 +45,7 @@ }
     }
+
+    render(instance: string, actions: any[], props: object) {
+      return nothing;
+    }
   };
 }

src/Detach.ts

@@ -1,2 +0,3 @@
-import { AttributePart, Directive } from 'lit-html-optimised';
+import { nothing } from 'lit-html';
+import { AttributePart, Directive } from 'lit-html/directive';
 
@@ -13,12 +14,15 @@ const detached: WeakMap<AttributePart, ElementData> = new WeakMap();
 export default class Detach extends Directive {
-  private ifFn: () => boolean;
+  private ifFn: () => boolean = () => false;
 
-  constructor(ifFn: () => boolean) {
-    super();
+  set(ifFn: () => boolean) {
     this.ifFn = ifFn;
   }
 
-  public body(part: AttributePart) {
+  render() {
+    return nothing;
+  }
+
+  update(part: AttributePart) {
     const detach = this.ifFn();
-    const element: Element = part.committer.element;
+    const element: Element = part.element;
     if (detach) {
@@ -47,3 +51,4 @@ if (!detached.has(part)) {
     }
+    return this.render();
   }
 }

src/GetElement.ts

@@ -1,10 +0,15 @@
-import { AttributePart } from 'lit-html-optimised';
-import { DirectiveFactory } from 'lit-html-optimised/lib/directive';
+import { AttributePart, Directive } from 'lit-html/directive';
 
-export default function prepareGetElement(directive: <F extends DirectiveFactory>(f: F) => F) {
-  return function getElement(callback: (element: Element) => void) {
-    return directive(() => (part: AttributePart) => {
-      callback(part.committer.element);
-    })();
-  };
+export default class GetElementDirective extends Directive {
+  update(part: AttributePart, props: unknown[]) {
+    const callback = props[0];
+    if (typeof callback !== 'function') {
+      throw new Error('[vido] Argument for getElement directive should be a function.');
+    }
+    callback(part.element);
+  }
+
+  render() {
+    return null;
+  }
 }

src/StyleMap.ts

@@ -1,8 +0,8 @@
-import { Directive, Part } from 'lit-html-optimised';
+import { Directive, Part, AttributePart } from 'lit-html/directive';
 import { PropertiesHyphenFallback as CSSProp } from 'csstype';
 
 export default class StyleMap extends Directive {
-  public style: CSSProp;
-  private previous: {};
-  private detach: boolean;
+  public style: CSSProp = {};
+  private previous = {};
+  private detach: boolean = false;
   private toRemove: string[] = [];
@@ -12,34 +12,15 @@ private toUpdate: string[] = [];
 
-  constructor(styleInfo: CSSProp, detach: boolean = false) {
-    super();
+  update(part: AttributePart, props: unknown[]) {
     this.previous = {};
-    this.style = styleInfo;
-    this.detach = detach;
-  }
-
-  public setStyle(styleInfo: CSSProp) {
-    this.style = styleInfo;
-  }
-
-  public setDebug(debug = true) {
-    this.debug = debug;
-  }
-
-  public setDetach(detach: boolean) {
-    this.detach = detach;
-  }
-
-  public body(part: Part) {
+    this.style = props[0] as CSSProp;
+    this.detach = (props[1] as boolean) ?? false;
     this.toRemove.length = 0;
     this.toUpdate.length = 0;
-    // @ts-ignore
-    const element = part.committer.element as HTMLElement;
+    const element = part.element;
     const elementStyle = element.style;
     let previous = this.previous;
-
-    if (element.attributes.getNamedItem('style')) {
-      // @ts-ignore
-      const currentElementStyles = element.attributes
-        .getNamedItem('style')
-        .value.split(';')
+    const namedItem = element.attributes.getNamedItem('style');
+    if (namedItem) {
+      const currentElementStyles = namedItem.value
+        .split(';')
         .map((item) => item.substr(0, item.indexOf(':')).trim())
@@ -109,3 +90,20 @@ .filter((item) => !!item);
     }
+    return this.render(this.style, this.detach);
   }
+
+  render(styleMap: CSSProp, detach: boolean = false) {}
+
+  public setStyle(styleInfo: CSSProp) {
+    this.style = styleInfo;
+  }
+
+  public setDebug(debug = true) {
+    this.debug = debug;
+  }
+
+  public setDetach(detach: boolean) {
+    this.detach = detach;
+  }
+
+  public body(part: Part) {}
 }

src/vido.ts

@@ -1,14 +0,15 @@
-import { render, html, directive, svg, Directive } from 'lit-html-optimised';
-import { asyncAppend } from 'lit-html-optimised/directives/async-append';
-import { asyncReplace } from 'lit-html-optimised/directives/async-replace';
-import { cache } from 'lit-html-optimised/directives/cache';
-import { classMap } from 'lit-html-optimised/directives/class-map';
-import { guard } from 'lit-html-optimised/directives/guard';
-import { ifDefined } from 'lit-html-optimised/directives/if-defined';
-import { repeat } from 'lit-html-optimised/directives/repeat';
-import { unsafeHTML } from 'lit-html-optimised/directives/unsafe-html';
-import { until } from 'lit-html-optimised/directives/until';
-import { live } from 'lit-html-optimised/directives/live';
+import { render, html, svg } from 'lit-html';
+import { directive, Directive } from 'lit-html/directive';
+import { asyncAppend } from 'lit-html/directives/async-append';
+import { asyncReplace } from 'lit-html/directives/async-replace';
+import { cache } from 'lit-html/directives/cache';
+import { guard } from 'lit-html/directives/guard';
+import { ifDefined } from 'lit-html/directives/if-defined';
+import { repeat } from 'lit-html/directives/repeat';
+import { unsafeHTML } from 'lit-html/directives/unsafe-html';
+import { until } from 'lit-html/directives/until';
+import { live } from 'lit-html/directives/live';
 import Detach from './Detach';
-import StyleMap from './StyleMap';
+import { styleMap } from 'lit-html/directives/style-map';
+import { classMap } from 'lit-html/directives/class-map';
 import PointerAction from './PointerAction';
@@ -21,21 +22,7 @@ import getPublicComponentMethods from './PublicComponentMethods';
 import { Slots } from './Slots';
-import prepareGetElement from './GetElement';
+import GetElementDirective from './GetElement';
 import helpers from './helpers';
 
-import * as lithtml from 'lit-html-optimised';
+import * as lithtml from 'lit-html';
 
-/* dev imports
-import { render, html, directive, svg, Part } from '../lit-html';
-import { asyncAppend } from '../lit-html/directives/async-append';
-import { asyncReplace } from '../lit-html/directives/async-replace';
-import { cache } from '../lit-html/directives/cache';
-import { classMap } from '../lit-html/directives/class-map';
-import { guard } from '../lit-html/directives/guard';
-import { ifDefined } from '../lit-html/directives/if-defined';
-import { repeat } from '../lit-html/directives/repeat';
-import { unsafeHTML } from '../lit-html/directives/unsafe-html';
-import { until } from '../lit-html/directives/until';
-import { Directive } from '../lit-html/lib/directive';
-*/
-
 export type htmlResult =
@@ -98,2 +85,3 @@ | lithtml.TemplateResult
   classMap: typeof classMap;
+  styleMap: typeof styleMap;
   guard: typeof guard;
@@ -106,3 +94,2 @@ live: typeof live;
   schedule: typeof schedule;
-  StyleMap: typeof StyleMap;
   Detach: typeof Detach;
@@ -137,4 +124,6 @@ PointerAction: typeof PointerAction;
     public create(actions: unknown[], props: object) {
-      const actionsInstance = new ActionsCollector(this.instance);
-      actionsInstance.set(actions, props);
+      const actionsInstanceDirective = directive(ActionsCollector);
+      const actionsInstance = () => {
+        return actionsInstanceDirective(this.instance, actions, props);
+      };
       return actionsInstance;
@@ -165,2 +154,3 @@ }
     classMap = classMap;
+    styleMap = styleMap;
     guard = guard;
@@ -173,5 +163,4 @@ live = live;
     schedule = schedule;
-    getElement = prepareGetElement(directive);
+    getElement = directive(GetElementDirective);
     actionsByInstance = (/* componentActions, props */) => {};
-    StyleMap = StyleMap;
     Detach = Detach;
@@ -430,3 +419,4 @@ PointerAction = PointerAction;
 Vido.prototype.Detach = Detach;
-Vido.prototype.StyleMap = StyleMap;
+Vido.prototype.styleMap = styleMap;
+Vido.prototype.classMap = classMap;
 Vido.prototype.PointerAction = PointerAction;
@@ -436,3 +426,2 @@ Vido.prototype.asyncAppend = asyncAppend;
 Vido.prototype.cache = cache;
-Vido.prototype.classMap = classMap;
 Vido.prototype.guard = guard;
@@ -452,3 +441,4 @@ Vido.prototype.live = live;
   Detach,
-  StyleMap,
+  styleMap,
+  classMap,
   PointerAction,
@@ -458,3 +448,2 @@ asyncAppend,
   cache,
-  classMap,
   guard,
@@ -461,0 +450,0 @@ ifDefined,

types/ActionsCollector.d.ts

@@ -1,12 +0,8 @@
-import { AttributePart } from 'lit-html-optimised';
+import { AttributePart } from 'lit-html/directive';
 export default function getActionsCollector(actionsByInstance: Map<string, any>): {
-    new (instance: string): {
-        instance: string;
-        actions: unknown[];
-        props: unknown;
-        set(actions: unknown[], props: object): any;
-        body(part: AttributePart): void;
-        isDirective: boolean;
-        isClass: boolean;
+    new (_partInfo: import("lit-html/directive").PartInfo): {
+        update(part: AttributePart, props: unknown[]): void;
+        render(instance: string, actions: any[], props: object): symbol;
+        readonly _$isConnected: boolean;
     };
 };

types/Detach.d.ts

@@ -1,2 +0,2 @@
-import { AttributePart, Directive } from 'lit-html-optimised';
+import { AttributePart, Directive } from 'lit-html/directive';
 export interface ElementData {
@@ -10,4 +10,5 @@ element: Element;
     private ifFn;
-    constructor(ifFn: () => boolean);
-    body(part: AttributePart): void;
+    set(ifFn: () => boolean): void;
+    render(): symbol;
+    update(part: AttributePart): symbol;
 }

types/GetElement.d.ts

@@ -1,3 +0,5 @@
-import { AttributePart } from 'lit-html-optimised';
-import { DirectiveFactory } from 'lit-html-optimised/lib/directive';
-export default function prepareGetElement(directive: <F extends DirectiveFactory>(f: F) => F): (callback: (element: Element) => void) => (part: AttributePart) => void;
+import { AttributePart, Directive } from 'lit-html/directive';
+export default class GetElementDirective extends Directive {
+    update(part: AttributePart, props: unknown[]): void;
+    render(): any;
+}

types/PublicComponentMethods.d.ts

@@ -16,3 +16,3 @@ import { AnyVido } from './vido';
          */
-        update(callback?: () => void): any;
+        update(callback?: (() => void) | undefined): any;
         /**
@@ -19,0 +19,0 @@ * Change component input properties

types/StyleMap.d.ts

@@ -1,2 +0,2 @@
-import { Directive, Part } from 'lit-html-optimised';
+import { Directive, Part, AttributePart } from 'lit-html/directive';
 import { PropertiesHyphenFallback as CSSProp } from 'csstype';
@@ -10,3 +10,4 @@ export default class StyleMap extends Directive {
     private debug;
-    constructor(styleInfo: CSSProp, detach?: boolean);
+    update(part: AttributePart, props: unknown[]): void;
+    render(styleMap: CSSProp, detach?: boolean): void;
     setStyle(styleInfo: CSSProp): void;
@@ -13,0 +14,0 @@ setDebug(debug?: boolean): void;

types/vido.d.ts

@@ -1,14 +0,14 @@
-import { directive, Directive } from 'lit-html-optimised';
-import { asyncAppend } from 'lit-html-optimised/directives/async-append';
-import { asyncReplace } from 'lit-html-optimised/directives/async-replace';
-import { cache } from 'lit-html-optimised/directives/cache';
-import { classMap } from 'lit-html-optimised/directives/class-map';
-import { guard } from 'lit-html-optimised/directives/guard';
-import { ifDefined } from 'lit-html-optimised/directives/if-defined';
-import { repeat } from 'lit-html-optimised/directives/repeat';
-import { unsafeHTML } from 'lit-html-optimised/directives/unsafe-html';
-import { until } from 'lit-html-optimised/directives/until';
-import { live } from 'lit-html-optimised/directives/live';
+import { directive, Directive } from 'lit-html/directive';
+import { asyncAppend } from 'lit-html/directives/async-append';
+import { asyncReplace } from 'lit-html/directives/async-replace';
+import { cache } from 'lit-html/directives/cache';
+import { guard } from 'lit-html/directives/guard';
+import { ifDefined } from 'lit-html/directives/if-defined';
+import { repeat } from 'lit-html/directives/repeat';
+import { unsafeHTML } from 'lit-html/directives/unsafe-html';
+import { until } from 'lit-html/directives/until';
+import { live } from 'lit-html/directives/live';
 import Detach from './Detach';
-import StyleMap from './StyleMap';
+import { styleMap } from 'lit-html/directives/style-map';
+import { classMap } from 'lit-html/directives/class-map';
 import PointerAction from './PointerAction';
@@ -19,3 +19,3 @@ import { schedule } from './helpers';
 import helpers from './helpers';
-import * as lithtml from 'lit-html-optimised';
+import * as lithtml from 'lit-html';
 export declare type htmlResult = lithtml.TemplateResult | lithtml.TemplateResult[] | lithtml.SVGTemplateResult | lithtml.SVGTemplateResult[] | undefined | null;
@@ -59,2 +59,3 @@ export declare type UpdateTemplate = (props: unknown) => htmlResult;
     classMap: typeof classMap;
+    styleMap: typeof styleMap;
     guard: typeof guard;
@@ -67,3 +68,2 @@ live: typeof live;
     schedule: typeof schedule;
-    StyleMap: typeof StyleMap;
     Detach: typeof Detach;
@@ -77,2 +77,2 @@ PointerAction: typeof PointerAction;
 export default function Vido<State, Api>(state: State, api: Api): vido<State, Api>;
-export { lithtml, Action, Directive, schedule, Detach, StyleMap, PointerAction, asyncAppend, asyncReplace, cache, classMap, guard, ifDefined, repeat, unsafeHTML, until, Slots, helpers, };
+export { lithtml, Action, Directive, schedule, Detach, styleMap, classMap, PointerAction, asyncAppend, asyncReplace, cache, guard, ifDefined, repeat, unsafeHTML, until, Slots, helpers, };

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

Mixed license

License

(Experimental) Package contains multiple licenses.

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

Worsened metrics

Total package byte prevSize

792175

decreased by-42.51%

Number of low license alerts

1

increased byInfinity%

Lines of code

5929

decreased by-45.27%

Dependency changes

• + Addedlit-html@^2.0.1

• + Added@types/trusted-types@2.0.7(transitive)

• + Addedlit-html@2.8.0(transitive)

• - Removedlit-html-optimised@^1.3.0

• - Removedlit-html-optimised@1.3.0(transitive)