@walletconnect/modal
Version:
#### 🔎 [Examples](https://github.com/WalletConnect/web3modal-examples)
929 lines (878 loc) • 258 kB
JavaScript
import { T as ThemeCtrl, M as ModalCtrl, R as RouterCtrl, a as ToastCtrl, E as EventsCtrl, C as CoreUtil, b as ExplorerCtrl, O as OptionsCtrl, c as ConfigCtrl } from './bundle-6897c25a.js';
/**
* @license
* Copyright 2019 Google LLC
* SPDX-License-Identifier: BSD-3-Clause
*/
const t$3=window,e$5=t$3.ShadowRoot&&(void 0===t$3.ShadyCSS||t$3.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,s$3=Symbol(),n$5=new WeakMap;let o$4 = class o{constructor(t,e,n){if(this._$cssResult$=!0,n!==s$3)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t,this.t=e;}get styleSheet(){let t=this.o;const s=this.t;if(e$5&&void 0===t){const e=void 0!==s&&1===s.length;e&&(t=n$5.get(s)),void 0===t&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),e&&n$5.set(s,t));}return t}toString(){return this.cssText}};const r$2=t=>new o$4("string"==typeof t?t:t+"",void 0,s$3),i$3=(t,...e)=>{const n=1===t.length?t[0]:e.reduce(((e,s,n)=>e+(t=>{if(!0===t._$cssResult$)return t.cssText;if("number"==typeof t)return t;throw Error("Value passed to 'css' function must be a 'css' function result: "+t+". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.")})(s)+t[n+1]),t[0]);return new o$4(n,t,s$3)},S$1=(s,n)=>{e$5?s.adoptedStyleSheets=n.map((t=>t instanceof CSSStyleSheet?t:t.styleSheet)):n.forEach((e=>{const n=document.createElement("style"),o=t$3.litNonce;void 0!==o&&n.setAttribute("nonce",o),n.textContent=e.cssText,s.appendChild(n);}));},c$1=e$5?t=>t:t=>t instanceof CSSStyleSheet?(t=>{let e="";for(const s of t.cssRules)e+=s.cssText;return r$2(e)})(t):t;
/**
* @license
* Copyright 2017 Google LLC
* SPDX-License-Identifier: BSD-3-Clause
*/var s$2;const e$4=window,r$1=e$4.trustedTypes,h$1=r$1?r$1.emptyScript:"",o$3=e$4.reactiveElementPolyfillSupport,n$4={toAttribute(t,i){switch(i){case Boolean:t=t?h$1:null;break;case Object:case Array:t=null==t?t:JSON.stringify(t);}return t},fromAttribute(t,i){let s=t;switch(i){case Boolean:s=null!==t;break;case Number:s=null===t?null:Number(t);break;case Object:case Array:try{s=JSON.parse(t);}catch(t){s=null;}}return s}},a$1=(t,i)=>i!==t&&(i==i||t==t),l$3={attribute:!0,type:String,converter:n$4,reflect:!1,hasChanged:a$1},d$1="finalized";let u$1 = class u extends HTMLElement{constructor(){super(),this._$Ei=new Map,this.isUpdatePending=!1,this.hasUpdated=!1,this._$El=null,this._$Eu();}static addInitializer(t){var i;this.finalize(),(null!==(i=this.h)&&void 0!==i?i:this.h=[]).push(t);}static get observedAttributes(){this.finalize();const t=[];return this.elementProperties.forEach(((i,s)=>{const e=this._$Ep(s,i);void 0!==e&&(this._$Ev.set(e,s),t.push(e));})),t}static createProperty(t,i=l$3){if(i.state&&(i.attribute=!1),this.finalize(),this.elementProperties.set(t,i),!i.noAccessor&&!this.prototype.hasOwnProperty(t)){const s="symbol"==typeof t?Symbol():"__"+t,e=this.getPropertyDescriptor(t,s,i);void 0!==e&&Object.defineProperty(this.prototype,t,e);}}static getPropertyDescriptor(t,i,s){return {get(){return this[i]},set(e){const r=this[t];this[i]=e,this.requestUpdate(t,r,s);},configurable:!0,enumerable:!0}}static getPropertyOptions(t){return this.elementProperties.get(t)||l$3}static finalize(){if(this.hasOwnProperty(d$1))return !1;this[d$1]=!0;const t=Object.getPrototypeOf(this);if(t.finalize(),void 0!==t.h&&(this.h=[...t.h]),this.elementProperties=new Map(t.elementProperties),this._$Ev=new Map,this.hasOwnProperty("properties")){const t=this.properties,i=[...Object.getOwnPropertyNames(t),...Object.getOwnPropertySymbols(t)];for(const s of i)this.createProperty(s,t[s]);}return this.elementStyles=this.finalizeStyles(this.styles),!0}static finalizeStyles(i){const s=[];if(Array.isArray(i)){const e=new Set(i.flat(1/0).reverse());for(const i of e)s.unshift(c$1(i));}else void 0!==i&&s.push(c$1(i));return s}static _$Ep(t,i){const s=i.attribute;return !1===s?void 0:"string"==typeof s?s:"string"==typeof t?t.toLowerCase():void 0}_$Eu(){var t;this._$E_=new Promise((t=>this.enableUpdating=t)),this._$AL=new Map,this._$Eg(),this.requestUpdate(),null===(t=this.constructor.h)||void 0===t||t.forEach((t=>t(this)));}addController(t){var i,s;(null!==(i=this._$ES)&&void 0!==i?i:this._$ES=[]).push(t),void 0!==this.renderRoot&&this.isConnected&&(null===(s=t.hostConnected)||void 0===s||s.call(t));}removeController(t){var i;null===(i=this._$ES)||void 0===i||i.splice(this._$ES.indexOf(t)>>>0,1);}_$Eg(){this.constructor.elementProperties.forEach(((t,i)=>{this.hasOwnProperty(i)&&(this._$Ei.set(i,this[i]),delete this[i]);}));}createRenderRoot(){var t;const s=null!==(t=this.shadowRoot)&&void 0!==t?t:this.attachShadow(this.constructor.shadowRootOptions);return S$1(s,this.constructor.elementStyles),s}connectedCallback(){var t;void 0===this.renderRoot&&(this.renderRoot=this.createRenderRoot()),this.enableUpdating(!0),null===(t=this._$ES)||void 0===t||t.forEach((t=>{var i;return null===(i=t.hostConnected)||void 0===i?void 0:i.call(t)}));}enableUpdating(t){}disconnectedCallback(){var t;null===(t=this._$ES)||void 0===t||t.forEach((t=>{var i;return null===(i=t.hostDisconnected)||void 0===i?void 0:i.call(t)}));}attributeChangedCallback(t,i,s){this._$AK(t,s);}_$EO(t,i,s=l$3){var e;const r=this.constructor._$Ep(t,s);if(void 0!==r&&!0===s.reflect){const h=(void 0!==(null===(e=s.converter)||void 0===e?void 0:e.toAttribute)?s.converter:n$4).toAttribute(i,s.type);this._$El=t,null==h?this.removeAttribute(r):this.setAttribute(r,h),this._$El=null;}}_$AK(t,i){var s;const e=this.constructor,r=e._$Ev.get(t);if(void 0!==r&&this._$El!==r){const t=e.getPropertyOptions(r),h="function"==typeof t.converter?{fromAttribute:t.converter}:void 0!==(null===(s=t.converter)||void 0===s?void 0:s.fromAttribute)?t.converter:n$4;this._$El=r,this[r]=h.fromAttribute(i,t.type),this._$El=null;}}requestUpdate(t,i,s){let e=!0;void 0!==t&&(((s=s||this.constructor.getPropertyOptions(t)).hasChanged||a$1)(this[t],i)?(this._$AL.has(t)||this._$AL.set(t,i),!0===s.reflect&&this._$El!==t&&(void 0===this._$EC&&(this._$EC=new Map),this._$EC.set(t,s))):e=!1),!this.isUpdatePending&&e&&(this._$E_=this._$Ej());}async _$Ej(){this.isUpdatePending=!0;try{await this._$E_;}catch(t){Promise.reject(t);}const t=this.scheduleUpdate();return null!=t&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){var t;if(!this.isUpdatePending)return;this.hasUpdated,this._$Ei&&(this._$Ei.forEach(((t,i)=>this[i]=t)),this._$Ei=void 0);let i=!1;const s=this._$AL;try{i=this.shouldUpdate(s),i?(this.willUpdate(s),null===(t=this._$ES)||void 0===t||t.forEach((t=>{var i;return null===(i=t.hostUpdate)||void 0===i?void 0:i.call(t)})),this.update(s)):this._$Ek();}catch(t){throw i=!1,this._$Ek(),t}i&&this._$AE(s);}willUpdate(t){}_$AE(t){var i;null===(i=this._$ES)||void 0===i||i.forEach((t=>{var i;return null===(i=t.hostUpdated)||void 0===i?void 0:i.call(t)})),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(t)),this.updated(t);}_$Ek(){this._$AL=new Map,this.isUpdatePending=!1;}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$E_}shouldUpdate(t){return !0}update(t){void 0!==this._$EC&&(this._$EC.forEach(((t,i)=>this._$EO(i,this[i],t))),this._$EC=void 0),this._$Ek();}updated(t){}firstUpdated(t){}};u$1[d$1]=!0,u$1.elementProperties=new Map,u$1.elementStyles=[],u$1.shadowRootOptions={mode:"open"},null==o$3||o$3({ReactiveElement:u$1}),(null!==(s$2=e$4.reactiveElementVersions)&&void 0!==s$2?s$2:e$4.reactiveElementVersions=[]).push("1.6.3");
/**
* @license
* Copyright 2017 Google LLC
* SPDX-License-Identifier: BSD-3-Clause
*/
var t$2;const i$2=window,s$1=i$2.trustedTypes,e$3=s$1?s$1.createPolicy("lit-html",{createHTML:t=>t}):void 0,o$2="$lit$",n$3=`lit$${(Math.random()+"").slice(9)}$`,l$2="?"+n$3,h=`<${l$2}>`,r=document,u=()=>r.createComment(""),d=t=>null===t||"object"!=typeof t&&"function"!=typeof t,c=Array.isArray,v=t=>c(t)||"function"==typeof(null==t?void 0:t[Symbol.iterator]),a="[ \t\n\f\r]",f=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,_=/-->/g,m=/>/g,p=RegExp(`>|${a}(?:([^\\s"'>=/]+)(${a}*=${a}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`,"g"),g=/'/g,$=/"/g,y=/^(?:script|style|textarea|title)$/i,w=t=>(i,...s)=>({_$litType$:t,strings:i,values:s}),x=w(1),b=w(2),T=Symbol.for("lit-noChange"),A=Symbol.for("lit-nothing"),E=new WeakMap,C=r.createTreeWalker(r,129,null,!1);function P(t,i){if(!Array.isArray(t)||!t.hasOwnProperty("raw"))throw Error("invalid template strings array");return void 0!==e$3?e$3.createHTML(i):i}const V=(t,i)=>{const s=t.length-1,e=[];let l,r=2===i?"<svg>":"",u=f;for(let i=0;i<s;i++){const s=t[i];let d,c,v=-1,a=0;for(;a<s.length&&(u.lastIndex=a,c=u.exec(s),null!==c);)a=u.lastIndex,u===f?"!--"===c[1]?u=_:void 0!==c[1]?u=m:void 0!==c[2]?(y.test(c[2])&&(l=RegExp("</"+c[2],"g")),u=p):void 0!==c[3]&&(u=p):u===p?">"===c[0]?(u=null!=l?l:f,v=-1):void 0===c[1]?v=-2:(v=u.lastIndex-c[2].length,d=c[1],u=void 0===c[3]?p:'"'===c[3]?$:g):u===$||u===g?u=p:u===_||u===m?u=f:(u=p,l=void 0);const w=u===p&&t[i+1].startsWith("/>")?" ":"";r+=u===f?s+h:v>=0?(e.push(d),s.slice(0,v)+o$2+s.slice(v)+n$3+w):s+n$3+(-2===v?(e.push(void 0),i):w);}return [P(t,r+(t[s]||"<?>")+(2===i?"</svg>":"")),e]};class N{constructor({strings:t,_$litType$:i},e){let h;this.parts=[];let r=0,d=0;const c=t.length-1,v=this.parts,[a,f]=V(t,i);if(this.el=N.createElement(a,e),C.currentNode=this.el.content,2===i){const t=this.el.content,i=t.firstChild;i.remove(),t.append(...i.childNodes);}for(;null!==(h=C.nextNode())&&v.length<c;){if(1===h.nodeType){if(h.hasAttributes()){const t=[];for(const i of h.getAttributeNames())if(i.endsWith(o$2)||i.startsWith(n$3)){const s=f[d++];if(t.push(i),void 0!==s){const t=h.getAttribute(s.toLowerCase()+o$2).split(n$3),i=/([.?@])?(.*)/.exec(s);v.push({type:1,index:r,name:i[2],strings:t,ctor:"."===i[1]?H:"?"===i[1]?L:"@"===i[1]?z:k});}else v.push({type:6,index:r});}for(const i of t)h.removeAttribute(i);}if(y.test(h.tagName)){const t=h.textContent.split(n$3),i=t.length-1;if(i>0){h.textContent=s$1?s$1.emptyScript:"";for(let s=0;s<i;s++)h.append(t[s],u()),C.nextNode(),v.push({type:2,index:++r});h.append(t[i],u());}}}else if(8===h.nodeType)if(h.data===l$2)v.push({type:2,index:r});else {let t=-1;for(;-1!==(t=h.data.indexOf(n$3,t+1));)v.push({type:7,index:r}),t+=n$3.length-1;}r++;}}static createElement(t,i){const s=r.createElement("template");return s.innerHTML=t,s}}function S(t,i,s=t,e){var o,n,l,h;if(i===T)return i;let r=void 0!==e?null===(o=s._$Co)||void 0===o?void 0:o[e]:s._$Cl;const u=d(i)?void 0:i._$litDirective$;return (null==r?void 0:r.constructor)!==u&&(null===(n=null==r?void 0:r._$AO)||void 0===n||n.call(r,!1),void 0===u?r=void 0:(r=new u(t),r._$AT(t,s,e)),void 0!==e?(null!==(l=(h=s)._$Co)&&void 0!==l?l:h._$Co=[])[e]=r:s._$Cl=r),void 0!==r&&(i=S(t,r._$AS(t,i.values),r,e)),i}class M{constructor(t,i){this._$AV=[],this._$AN=void 0,this._$AD=t,this._$AM=i;}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(t){var i;const{el:{content:s},parts:e}=this._$AD,o=(null!==(i=null==t?void 0:t.creationScope)&&void 0!==i?i:r).importNode(s,!0);C.currentNode=o;let n=C.nextNode(),l=0,h=0,u=e[0];for(;void 0!==u;){if(l===u.index){let i;2===u.type?i=new R(n,n.nextSibling,this,t):1===u.type?i=new u.ctor(n,u.name,u.strings,this,t):6===u.type&&(i=new Z(n,this,t)),this._$AV.push(i),u=e[++h];}l!==(null==u?void 0:u.index)&&(n=C.nextNode(),l++);}return C.currentNode=r,o}v(t){let i=0;for(const s of this._$AV)void 0!==s&&(void 0!==s.strings?(s._$AI(t,s,i),i+=s.strings.length-2):s._$AI(t[i])),i++;}}class R{constructor(t,i,s,e){var o;this.type=2,this._$AH=A,this._$AN=void 0,this._$AA=t,this._$AB=i,this._$AM=s,this.options=e,this._$Cp=null===(o=null==e?void 0:e.isConnected)||void 0===o||o;}get _$AU(){var t,i;return null!==(i=null===(t=this._$AM)||void 0===t?void 0:t._$AU)&&void 0!==i?i:this._$Cp}get parentNode(){let t=this._$AA.parentNode;const i=this._$AM;return void 0!==i&&11===(null==t?void 0:t.nodeType)&&(t=i.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,i=this){t=S(this,t,i),d(t)?t===A||null==t||""===t?(this._$AH!==A&&this._$AR(),this._$AH=A):t!==this._$AH&&t!==T&&this._(t):void 0!==t._$litType$?this.g(t):void 0!==t.nodeType?this.$(t):v(t)?this.T(t):this._(t);}k(t){return this._$AA.parentNode.insertBefore(t,this._$AB)}$(t){this._$AH!==t&&(this._$AR(),this._$AH=this.k(t));}_(t){this._$AH!==A&&d(this._$AH)?this._$AA.nextSibling.data=t:this.$(r.createTextNode(t)),this._$AH=t;}g(t){var i;const{values:s,_$litType$:e}=t,o="number"==typeof e?this._$AC(t):(void 0===e.el&&(e.el=N.createElement(P(e.h,e.h[0]),this.options)),e);if((null===(i=this._$AH)||void 0===i?void 0:i._$AD)===o)this._$AH.v(s);else {const t=new M(o,this),i=t.u(this.options);t.v(s),this.$(i),this._$AH=t;}}_$AC(t){let i=E.get(t.strings);return void 0===i&&E.set(t.strings,i=new N(t)),i}T(t){c(this._$AH)||(this._$AH=[],this._$AR());const i=this._$AH;let s,e=0;for(const o of t)e===i.length?i.push(s=new R(this.k(u()),this.k(u()),this,this.options)):s=i[e],s._$AI(o),e++;e<i.length&&(this._$AR(s&&s._$AB.nextSibling,e),i.length=e);}_$AR(t=this._$AA.nextSibling,i){var s;for(null===(s=this._$AP)||void 0===s||s.call(this,!1,!0,i);t&&t!==this._$AB;){const i=t.nextSibling;t.remove(),t=i;}}setConnected(t){var i;void 0===this._$AM&&(this._$Cp=t,null===(i=this._$AP)||void 0===i||i.call(this,t));}}class k{constructor(t,i,s,e,o){this.type=1,this._$AH=A,this._$AN=void 0,this.element=t,this.name=i,this._$AM=e,this.options=o,s.length>2||""!==s[0]||""!==s[1]?(this._$AH=Array(s.length-1).fill(new String),this.strings=s):this._$AH=A;}get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}_$AI(t,i=this,s,e){const o=this.strings;let n=!1;if(void 0===o)t=S(this,t,i,0),n=!d(t)||t!==this._$AH&&t!==T,n&&(this._$AH=t);else {const e=t;let l,h;for(t=o[0],l=0;l<o.length-1;l++)h=S(this,e[s+l],i,l),h===T&&(h=this._$AH[l]),n||(n=!d(h)||h!==this._$AH[l]),h===A?t=A:t!==A&&(t+=(null!=h?h:"")+o[l+1]),this._$AH[l]=h;}n&&!e&&this.j(t);}j(t){t===A?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,null!=t?t:"");}}class H extends k{constructor(){super(...arguments),this.type=3;}j(t){this.element[this.name]=t===A?void 0:t;}}const I=s$1?s$1.emptyScript:"";class L extends k{constructor(){super(...arguments),this.type=4;}j(t){t&&t!==A?this.element.setAttribute(this.name,I):this.element.removeAttribute(this.name);}}class z extends k{constructor(t,i,s,e,o){super(t,i,s,e,o),this.type=5;}_$AI(t,i=this){var s;if((t=null!==(s=S(this,t,i,0))&&void 0!==s?s:A)===T)return;const e=this._$AH,o=t===A&&e!==A||t.capture!==e.capture||t.once!==e.once||t.passive!==e.passive,n=t!==A&&(e===A||o);o&&this.element.removeEventListener(this.name,this,e),n&&this.element.addEventListener(this.name,this,t),this._$AH=t;}handleEvent(t){var i,s;"function"==typeof this._$AH?this._$AH.call(null!==(s=null===(i=this.options)||void 0===i?void 0:i.host)&&void 0!==s?s:this.element,t):this._$AH.handleEvent(t);}}class Z{constructor(t,i,s){this.element=t,this.type=6,this._$AN=void 0,this._$AM=i,this.options=s;}get _$AU(){return this._$AM._$AU}_$AI(t){S(this,t);}}const B=i$2.litHtmlPolyfillSupport;null==B||B(N,R),(null!==(t$2=i$2.litHtmlVersions)&&void 0!==t$2?t$2:i$2.litHtmlVersions=[]).push("2.8.0");const D=(t,i,s)=>{var e,o;const n=null!==(e=null==s?void 0:s.renderBefore)&&void 0!==e?e:i;let l=n._$litPart$;if(void 0===l){const t=null!==(o=null==s?void 0:s.renderBefore)&&void 0!==o?o:null;n._$litPart$=l=new R(i.insertBefore(u(),t),t,void 0,null!=s?s:{});}return l._$AI(t),l};
/**
* @license
* Copyright 2017 Google LLC
* SPDX-License-Identifier: BSD-3-Clause
*/var l$1,o$1;class s extends u$1{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0;}createRenderRoot(){var t,e;const i=super.createRenderRoot();return null!==(t=(e=this.renderOptions).renderBefore)&&void 0!==t||(e.renderBefore=i.firstChild),i}update(t){const i=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this._$Do=D(i,this.renderRoot,this.renderOptions);}connectedCallback(){var t;super.connectedCallback(),null===(t=this._$Do)||void 0===t||t.setConnected(!0);}disconnectedCallback(){var t;super.disconnectedCallback(),null===(t=this._$Do)||void 0===t||t.setConnected(!1);}render(){return T}}s.finalized=!0,s._$litElement$=!0,null===(l$1=globalThis.litElementHydrateSupport)||void 0===l$1||l$1.call(globalThis,{LitElement:s});const n$2=globalThis.litElementPolyfillSupport;null==n$2||n$2({LitElement:s});(null!==(o$1=globalThis.litElementVersions)&&void 0!==o$1?o$1:globalThis.litElementVersions=[]).push("3.3.3");
/**
* @license
* Copyright 2017 Google LLC
* SPDX-License-Identifier: BSD-3-Clause
*/
const e$2=e=>n=>"function"==typeof n?((e,n)=>(customElements.define(e,n),n))(e,n):((e,n)=>{const{kind:t,elements:s}=n;return {kind:t,elements:s,finisher(n){customElements.define(e,n);}}})(e,n);
/**
* @license
* Copyright 2017 Google LLC
* SPDX-License-Identifier: BSD-3-Clause
*/
const i$1=(i,e)=>"method"===e.kind&&e.descriptor&&!("value"in e.descriptor)?{...e,finisher(n){n.createProperty(e.key,i);}}:{kind:"field",key:Symbol(),placement:"own",descriptor:{},originalKey:e.key,initializer(){"function"==typeof e.initializer&&(this[e.key]=e.initializer.call(this));},finisher(n){n.createProperty(e.key,i);}},e$1=(i,e,n)=>{e.constructor.createProperty(n,i);};function n$1(n){return (t,o)=>void 0!==o?e$1(n,t,o):i$1(n,t)}
/**
* @license
* Copyright 2017 Google LLC
* SPDX-License-Identifier: BSD-3-Clause
*/function t$1(t){return n$1({...t,state:!0})}
/**
* @license
* Copyright 2021 Google LLC
* SPDX-License-Identifier: BSD-3-Clause
*/var n;null!=(null===(n=window.HTMLSlotElement)||void 0===n?void 0:n.prototype.assignedElements)?(o,n)=>o.assignedElements(n):(o,n)=>o.assignedNodes(n).filter((o=>o.nodeType===Node.ELEMENT_NODE));
/**
* @license
* Copyright 2017 Google LLC
* SPDX-License-Identifier: BSD-3-Clause
*/
const t={ATTRIBUTE:1,CHILD:2,PROPERTY:3,BOOLEAN_ATTRIBUTE:4,EVENT:5,ELEMENT:6},e=t=>(...e)=>({_$litDirective$:t,values:e});class i{constructor(t){}get _$AU(){return this._$AM._$AU}_$AT(t,e,i){this._$Ct=t,this._$AM=e,this._$Ci=i;}_$AS(t,e){return this.update(t,e)}update(t,e){return this.render(...e)}}
/**
* @license
* Copyright 2018 Google LLC
* SPDX-License-Identifier: BSD-3-Clause
*/const o=e(class extends i{constructor(t$1){var i;if(super(t$1),t$1.type!==t.ATTRIBUTE||"class"!==t$1.name||(null===(i=t$1.strings)||void 0===i?void 0:i.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((i=>t[i])).join(" ")+" "}update(i,[s]){var r,o;if(void 0===this.it){this.it=new Set,void 0!==i.strings&&(this.nt=new Set(i.strings.join(" ").split(/\s/).filter((t=>""!==t))));for(const t in s)s[t]&&!(null===(r=this.nt)||void 0===r?void 0:r.has(t))&&this.it.add(t);return this.render(s)}const e=i.element.classList;this.it.forEach((t=>{t in s||(e.remove(t),this.it.delete(t));}));for(const t in s){const i=!!s[t];i===this.it.has(t)||(null===(o=this.nt)||void 0===o?void 0:o.has(t))||(i?(e.add(t),this.it.add(t)):(e.remove(t),this.it.delete(t)));}return T}});
function addUniqueItem(array, item) {
array.indexOf(item) === -1 && array.push(item);
}
const clamp = (min, max, v) => Math.min(Math.max(v, min), max);
const defaults = {
duration: 0.3,
delay: 0,
endDelay: 0,
repeat: 0,
easing: "ease",
};
const isNumber = (value) => typeof value === "number";
const isEasingList = (easing) => Array.isArray(easing) && !isNumber(easing[0]);
const wrap = (min, max, v) => {
const rangeSize = max - min;
return ((((v - min) % rangeSize) + rangeSize) % rangeSize) + min;
};
function getEasingForSegment(easing, i) {
return isEasingList(easing)
? easing[wrap(0, easing.length, i)]
: easing;
}
const mix = (min, max, progress) => -progress * min + progress * max + min;
const noop = () => { };
const noopReturn = (v) => v;
const progress = (min, max, value) => max - min === 0 ? 1 : (value - min) / (max - min);
function fillOffset(offset, remaining) {
const min = offset[offset.length - 1];
for (let i = 1; i <= remaining; i++) {
const offsetProgress = progress(0, remaining, i);
offset.push(mix(min, 1, offsetProgress));
}
}
function defaultOffset(length) {
const offset = [0];
fillOffset(offset, length - 1);
return offset;
}
function interpolate(output, input = defaultOffset(output.length), easing = noopReturn) {
const length = output.length;
/**
* If the input length is lower than the output we
* fill the input to match. This currently assumes the input
* is an animation progress value so is a good candidate for
* moving outside the function.
*/
const remainder = length - input.length;
remainder > 0 && fillOffset(input, remainder);
return (t) => {
let i = 0;
for (; i < length - 2; i++) {
if (t < input[i + 1])
break;
}
let progressInRange = clamp(0, 1, progress(input[i], input[i + 1], t));
const segmentEasing = getEasingForSegment(easing, i);
progressInRange = segmentEasing(progressInRange);
return mix(output[i], output[i + 1], progressInRange);
};
}
const isCubicBezier = (easing) => Array.isArray(easing) && isNumber(easing[0]);
const isEasingGenerator = (easing) => typeof easing === "object" &&
Boolean(easing.createAnimation);
const isFunction = (value) => typeof value === "function";
const isString = (value) => typeof value === "string";
const time = {
ms: (seconds) => seconds * 1000,
s: (milliseconds) => milliseconds / 1000,
};
/*
Bezier function generator
This has been modified from Gaëtan Renaudeau's BezierEasing
https://github.com/gre/bezier-easing/blob/master/src/index.js
https://github.com/gre/bezier-easing/blob/master/LICENSE
I've removed the newtonRaphsonIterate algo because in benchmarking it
wasn't noticiably faster than binarySubdivision, indeed removing it
usually improved times, depending on the curve.
I also removed the lookup table, as for the added bundle size and loop we're
only cutting ~4 or so subdivision iterations. I bumped the max iterations up
to 12 to compensate and this still tended to be faster for no perceivable
loss in accuracy.
Usage
const easeOut = cubicBezier(.17,.67,.83,.67);
const x = easeOut(0.5); // returns 0.627...
*/
// Returns x(t) given t, x1, and x2, or y(t) given t, y1, and y2.
const calcBezier = (t, a1, a2) => (((1.0 - 3.0 * a2 + 3.0 * a1) * t + (3.0 * a2 - 6.0 * a1)) * t + 3.0 * a1) * t;
const subdivisionPrecision = 0.0000001;
const subdivisionMaxIterations = 12;
function binarySubdivide(x, lowerBound, upperBound, mX1, mX2) {
let currentX;
let currentT;
let i = 0;
do {
currentT = lowerBound + (upperBound - lowerBound) / 2.0;
currentX = calcBezier(currentT, mX1, mX2) - x;
if (currentX > 0.0) {
upperBound = currentT;
}
else {
lowerBound = currentT;
}
} while (Math.abs(currentX) > subdivisionPrecision &&
++i < subdivisionMaxIterations);
return currentT;
}
function cubicBezier(mX1, mY1, mX2, mY2) {
// If this is a linear gradient, return linear easing
if (mX1 === mY1 && mX2 === mY2)
return noopReturn;
const getTForX = (aX) => binarySubdivide(aX, 0, 1, mX1, mX2);
// If animation is at start/end, return t without easing
return (t) => t === 0 || t === 1 ? t : calcBezier(getTForX(t), mY1, mY2);
}
const steps = (steps, direction = "end") => (progress) => {
progress =
direction === "end"
? Math.min(progress, 0.999)
: Math.max(progress, 0.001);
const expanded = progress * steps;
const rounded = direction === "end" ? Math.floor(expanded) : Math.ceil(expanded);
return clamp(0, 1, rounded / steps);
};
const namedEasings = {
ease: cubicBezier(0.25, 0.1, 0.25, 1.0),
"ease-in": cubicBezier(0.42, 0.0, 1.0, 1.0),
"ease-in-out": cubicBezier(0.42, 0.0, 0.58, 1.0),
"ease-out": cubicBezier(0.0, 0.0, 0.58, 1.0),
};
const functionArgsRegex = /\((.*?)\)/;
function getEasingFunction(definition) {
// If already an easing function, return
if (isFunction(definition))
return definition;
// If an easing curve definition, return bezier function
if (isCubicBezier(definition))
return cubicBezier(...definition);
// If we have a predefined easing function, return
if (namedEasings[definition])
return namedEasings[definition];
// If this is a steps function, attempt to create easing curve
if (definition.startsWith("steps")) {
const args = functionArgsRegex.exec(definition);
if (args) {
const argsArray = args[1].split(",");
return steps(parseFloat(argsArray[0]), argsArray[1].trim());
}
}
return noopReturn;
}
class Animation {
constructor(output, keyframes = [0, 1], { easing, duration: initialDuration = defaults.duration, delay = defaults.delay, endDelay = defaults.endDelay, repeat = defaults.repeat, offset, direction = "normal", } = {}) {
this.startTime = null;
this.rate = 1;
this.t = 0;
this.cancelTimestamp = null;
this.easing = noopReturn;
this.duration = 0;
this.totalDuration = 0;
this.repeat = 0;
this.playState = "idle";
this.finished = new Promise((resolve, reject) => {
this.resolve = resolve;
this.reject = reject;
});
easing = easing || defaults.easing;
if (isEasingGenerator(easing)) {
const custom = easing.createAnimation(keyframes);
easing = custom.easing;
keyframes = custom.keyframes || keyframes;
initialDuration = custom.duration || initialDuration;
}
this.repeat = repeat;
this.easing = isEasingList(easing) ? noopReturn : getEasingFunction(easing);
this.updateDuration(initialDuration);
const interpolate$1 = interpolate(keyframes, offset, isEasingList(easing) ? easing.map(getEasingFunction) : noopReturn);
this.tick = (timestamp) => {
var _a;
// TODO: Temporary fix for OptionsResolver typing
delay = delay;
let t = 0;
if (this.pauseTime !== undefined) {
t = this.pauseTime;
}
else {
t = (timestamp - this.startTime) * this.rate;
}
this.t = t;
// Convert to seconds
t /= 1000;
// Rebase on delay
t = Math.max(t - delay, 0);
/**
* If this animation has finished, set the current time
* to the total duration.
*/
if (this.playState === "finished" && this.pauseTime === undefined) {
t = this.totalDuration;
}
/**
* Get the current progress (0-1) of the animation. If t is >
* than duration we'll get values like 2.5 (midway through the
* third iteration)
*/
const progress = t / this.duration;
// TODO progress += iterationStart
/**
* Get the current iteration (0 indexed). For instance the floor of
* 2.5 is 2.
*/
let currentIteration = Math.floor(progress);
/**
* Get the current progress of the iteration by taking the remainder
* so 2.5 is 0.5 through iteration 2
*/
let iterationProgress = progress % 1.0;
if (!iterationProgress && progress >= 1) {
iterationProgress = 1;
}
/**
* If iteration progress is 1 we count that as the end
* of the previous iteration.
*/
iterationProgress === 1 && currentIteration--;
/**
* Reverse progress if we're not running in "normal" direction
*/
const iterationIsOdd = currentIteration % 2;
if (direction === "reverse" ||
(direction === "alternate" && iterationIsOdd) ||
(direction === "alternate-reverse" && !iterationIsOdd)) {
iterationProgress = 1 - iterationProgress;
}
const p = t >= this.totalDuration ? 1 : Math.min(iterationProgress, 1);
const latest = interpolate$1(this.easing(p));
output(latest);
const isAnimationFinished = this.pauseTime === undefined &&
(this.playState === "finished" || t >= this.totalDuration + endDelay);
if (isAnimationFinished) {
this.playState = "finished";
(_a = this.resolve) === null || _a === void 0 ? void 0 : _a.call(this, latest);
}
else if (this.playState !== "idle") {
this.frameRequestId = requestAnimationFrame(this.tick);
}
};
this.play();
}
play() {
const now = performance.now();
this.playState = "running";
if (this.pauseTime !== undefined) {
this.startTime = now - this.pauseTime;
}
else if (!this.startTime) {
this.startTime = now;
}
this.cancelTimestamp = this.startTime;
this.pauseTime = undefined;
this.frameRequestId = requestAnimationFrame(this.tick);
}
pause() {
this.playState = "paused";
this.pauseTime = this.t;
}
finish() {
this.playState = "finished";
this.tick(0);
}
stop() {
var _a;
this.playState = "idle";
if (this.frameRequestId !== undefined) {
cancelAnimationFrame(this.frameRequestId);
}
(_a = this.reject) === null || _a === void 0 ? void 0 : _a.call(this, false);
}
cancel() {
this.stop();
this.tick(this.cancelTimestamp);
}
reverse() {
this.rate *= -1;
}
commitStyles() { }
updateDuration(duration) {
this.duration = duration;
this.totalDuration = duration * (this.repeat + 1);
}
get currentTime() {
return this.t;
}
set currentTime(t) {
if (this.pauseTime !== undefined || this.rate === 0) {
this.pauseTime = t;
}
else {
this.startTime = performance.now() - t / this.rate;
}
}
get playbackRate() {
return this.rate;
}
set playbackRate(rate) {
this.rate = rate;
}
}
var invariant = function () { };
if (process.env.NODE_ENV !== 'production') {
invariant = function (check, message) {
if (!check) {
throw new Error(message);
}
};
}
/**
* The MotionValue tracks the state of a single animatable
* value. Currently, updatedAt and current are unused. The
* long term idea is to use this to minimise the number
* of DOM reads, and to abstract the DOM interactions here.
*/
class MotionValue {
setAnimation(animation) {
this.animation = animation;
animation === null || animation === void 0 ? void 0 : animation.finished.then(() => this.clearAnimation()).catch(() => { });
}
clearAnimation() {
this.animation = this.generator = undefined;
}
}
const data = new WeakMap();
function getAnimationData(element) {
if (!data.has(element)) {
data.set(element, {
transforms: [],
values: new Map(),
});
}
return data.get(element);
}
function getMotionValue(motionValues, name) {
if (!motionValues.has(name)) {
motionValues.set(name, new MotionValue());
}
return motionValues.get(name);
}
/**
* A list of all transformable axes. We'll use this list to generated a version
* of each axes for each transform.
*/
const axes = ["", "X", "Y", "Z"];
/**
* An ordered array of each transformable value. By default, transform values
* will be sorted to this order.
*/
const order = ["translate", "scale", "rotate", "skew"];
const transformAlias = {
x: "translateX",
y: "translateY",
z: "translateZ",
};
const rotation = {
syntax: "<angle>",
initialValue: "0deg",
toDefaultUnit: (v) => v + "deg",
};
const baseTransformProperties = {
translate: {
syntax: "<length-percentage>",
initialValue: "0px",
toDefaultUnit: (v) => v + "px",
},
rotate: rotation,
scale: {
syntax: "<number>",
initialValue: 1,
toDefaultUnit: noopReturn,
},
skew: rotation,
};
const transformDefinitions = new Map();
const asTransformCssVar = (name) => `--motion-${name}`;
/**
* Generate a list of every possible transform key
*/
const transforms = ["x", "y", "z"];
order.forEach((name) => {
axes.forEach((axis) => {
transforms.push(name + axis);
transformDefinitions.set(asTransformCssVar(name + axis), baseTransformProperties[name]);
});
});
/**
* A function to use with Array.sort to sort transform keys by their default order.
*/
const compareTransformOrder = (a, b) => transforms.indexOf(a) - transforms.indexOf(b);
/**
* Provide a quick way to check if a string is the name of a transform
*/
const transformLookup = new Set(transforms);
const isTransform = (name) => transformLookup.has(name);
const addTransformToElement = (element, name) => {
// Map x to translateX etc
if (transformAlias[name])
name = transformAlias[name];
const { transforms } = getAnimationData(element);
addUniqueItem(transforms, name);
/**
* TODO: An optimisation here could be to cache the transform in element data
* and only update if this has changed.
*/
element.style.transform = buildTransformTemplate(transforms);
};
const buildTransformTemplate = (transforms) => transforms
.sort(compareTransformOrder)
.reduce(transformListToString, "")
.trim();
const transformListToString = (template, name) => `${template} ${name}(var(${asTransformCssVar(name)}))`;
const isCssVar = (name) => name.startsWith("--");
const registeredProperties = new Set();
function registerCssVariable(name) {
if (registeredProperties.has(name))
return;
registeredProperties.add(name);
try {
const { syntax, initialValue } = transformDefinitions.has(name)
? transformDefinitions.get(name)
: {};
CSS.registerProperty({
name,
inherits: false,
syntax,
initialValue,
});
}
catch (e) { }
}
const testAnimation = (keyframes, options) => document.createElement("div").animate(keyframes, options);
const featureTests = {
cssRegisterProperty: () => typeof CSS !== "undefined" &&
Object.hasOwnProperty.call(CSS, "registerProperty"),
waapi: () => Object.hasOwnProperty.call(Element.prototype, "animate"),
partialKeyframes: () => {
try {
testAnimation({ opacity: [1] });
}
catch (e) {
return false;
}
return true;
},
finished: () => Boolean(testAnimation({ opacity: [0, 1] }, { duration: 0.001 }).finished),
linearEasing: () => {
try {
testAnimation({ opacity: 0 }, { easing: "linear(0, 1)" });
}
catch (e) {
return false;
}
return true;
},
};
const results = {};
const supports = {};
for (const key in featureTests) {
supports[key] = () => {
if (results[key] === undefined)
results[key] = featureTests[key]();
return results[key];
};
}
// Create a linear easing point for every x second
const resolution = 0.015;
const generateLinearEasingPoints = (easing, duration) => {
let points = "";
const numPoints = Math.round(duration / resolution);
for (let i = 0; i < numPoints; i++) {
points += easing(progress(0, numPoints - 1, i)) + ", ";
}
return points.substring(0, points.length - 2);
};
const convertEasing = (easing, duration) => {
if (isFunction(easing)) {
return supports.linearEasing()
? `linear(${generateLinearEasingPoints(easing, duration)})`
: defaults.easing;
}
else {
return isCubicBezier(easing) ? cubicBezierAsString(easing) : easing;
}
};
const cubicBezierAsString = ([a, b, c, d]) => `cubic-bezier(${a}, ${b}, ${c}, ${d})`;
function hydrateKeyframes(keyframes, readInitialValue) {
for (let i = 0; i < keyframes.length; i++) {
if (keyframes[i] === null) {
keyframes[i] = i ? keyframes[i - 1] : readInitialValue();
}
}
return keyframes;
}
const keyframesList = (keyframes) => Array.isArray(keyframes) ? keyframes : [keyframes];
function getStyleName(key) {
if (transformAlias[key])
key = transformAlias[key];
return isTransform(key) ? asTransformCssVar(key) : key;
}
const style = {
get: (element, name) => {
name = getStyleName(name);
let value = isCssVar(name)
? element.style.getPropertyValue(name)
: getComputedStyle(element)[name];
if (!value && value !== 0) {
const definition = transformDefinitions.get(name);
if (definition)
value = definition.initialValue;
}
return value;
},
set: (element, name, value) => {
name = getStyleName(name);
if (isCssVar(name)) {
element.style.setProperty(name, value);
}
else {
element.style[name] = value;
}
},
};
function stopAnimation(animation, needsCommit = true) {
if (!animation || animation.playState === "finished")
return;
// Suppress error thrown by WAAPI
try {
if (animation.stop) {
animation.stop();
}
else {
needsCommit && animation.commitStyles();
animation.cancel();
}
}
catch (e) { }
}
function getUnitConverter(keyframes, definition) {
var _a;
let toUnit = (definition === null || definition === void 0 ? void 0 : definition.toDefaultUnit) || noopReturn;
const finalKeyframe = keyframes[keyframes.length - 1];
if (isString(finalKeyframe)) {
const unit = ((_a = finalKeyframe.match(/(-?[\d.]+)([a-z%]*)/)) === null || _a === void 0 ? void 0 : _a[2]) || "";
if (unit)
toUnit = (value) => value + unit;
}
return toUnit;
}
function getDevToolsRecord() {
return window.__MOTION_DEV_TOOLS_RECORD;
}
function animateStyle(element, key, keyframesDefinition, options = {}, AnimationPolyfill) {
const record = getDevToolsRecord();
const isRecording = options.record !== false && record;
let animation;
let { duration = defaults.duration, delay = defaults.delay, endDelay = defaults.endDelay, repeat = defaults.repeat, easing = defaults.easing, persist = false, direction, offset, allowWebkitAcceleration = false, } = options;
const data = getAnimationData(element);
const valueIsTransform = isTransform(key);
let canAnimateNatively = supports.waapi();
/**
* If this is an individual transform, we need to map its
* key to a CSS variable and update the element's transform style
*/
valueIsTransform && addTransformToElement(element, key);
const name = getStyleName(key);
const motionValue = getMotionValue(data.values, name);
/**
* Get definition of value, this will be used to convert numerical
* keyframes into the default value type.
*/
const definition = transformDefinitions.get(name);
/**
* Stop the current animation, if any. Because this will trigger
* commitStyles (DOM writes) and we might later trigger DOM reads,
* this is fired now and we return a factory function to create
* the actual animation that can get called in batch,
*/
stopAnimation(motionValue.animation, !(isEasingGenerator(easing) && motionValue.generator) &&
options.record !== false);
/**
* Batchable factory function containing all DOM reads.
*/
return () => {
const readInitialValue = () => { var _a, _b; return (_b = (_a = style.get(element, name)) !== null && _a !== void 0 ? _a : definition === null || definition === void 0 ? void 0 : definition.initialValue) !== null && _b !== void 0 ? _b : 0; };
/**
* Replace null values with the previous keyframe value, or read
* it from the DOM if it's the first keyframe.
*/
let keyframes = hydrateKeyframes(keyframesList(keyframesDefinition), readInitialValue);
/**
* Detect unit type of keyframes.
*/
const toUnit = getUnitConverter(keyframes, definition);
if (isEasingGenerator(easing)) {
const custom = easing.createAnimation(keyframes, key !== "opacity", readInitialValue, name, motionValue);
easing = custom.easing;
keyframes = custom.keyframes || keyframes;
duration = custom.duration || duration;
}
/**
* If this is a CSS variable we need to register it with the browser
* before it can be animated natively. We also set it with setProperty
* rather than directly onto the element.style object.
*/
if (isCssVar(name)) {
if (supports.cssRegisterProperty()) {
registerCssVariable(name);
}
else {
canAnimateNatively = false;
}
}
/**
* If we've been passed a custom easing function, and this browser
* does **not** support linear() easing, and the value is a transform
* (and thus a pure number) we can still support the custom easing
* by falling back to the animation polyfill.
*/
if (valueIsTransform &&
!supports.linearEasing() &&
(isFunction(easing) || (isEasingList(easing) && easing.some(isFunction)))) {
canAnimateNatively = false;
}
/**
* If we can animate this value with WAAPI, do so.
*/
if (canAnimateNatively) {
/**
* Convert numbers to default value types. Currently this only supports
* transforms but it could also support other value types.
*/
if (definition) {
keyframes = keyframes.map((value) => isNumber(value) ? definition.toDefaultUnit(value) : value);
}
/**
* If this browser doesn't support partial/implicit keyframes we need to
* explicitly provide one.
*/
if (keyframes.length === 1 &&
(!supports.partialKeyframes() || isRecording)) {
keyframes.unshift(readInitialValue());
}
const animationOptions = {
delay: time.ms(delay),
duration: time.ms(duration),
endDelay: time.ms(endDelay),
easing: !isEasingList(easing)
? convertEasing(easing, duration)
: undefined,
direction,
iterations: repeat + 1,
fill: "both",
};
animation = element.animate({
[name]: keyframes,
offset,
easing: isEasingList(easing)
? easing.map((thisEasing) => convertEasing(thisEasing, duration))
: undefined,
}, animationOptions);
/**
* Polyfill finished Promise in browsers that don't support it
*/
if (!animation.finished) {
animation.finished = new Promise((resolve, reject) => {
animation.onfinish = resolve;
animation.oncancel = reject;
});
}
const target = keyframes[keyframes.length - 1];
animation.finished
.then(() => {
if (persist)
return;
// Apply styles to target
style.set(element, name, target);
// Ensure fill modes don't persist
animation.cancel();
})
.catch(noop);
/**
* This forces Webkit to run animations on the main thread by exploiting
* this condition:
* https://trac.webkit.org/browser/webkit/trunk/Source/WebCore/platform/graphics/ca/GraphicsLayerCA.cpp?rev=281238#L1099
*
* This fixes Webkit's timing bugs, like accelerated animations falling
* out of sync with main thread animations and massive delays in starting
* accelerated animations in WKWebView.
*/
if (!allowWebkitAcceleration)
animation.playbackRate = 1.000001;
/**
* If we can't animate the value natively then we can fallback to the numbers-only
* polyfill for transforms.
*/
}
else if (AnimationPolyfill && valueIsTransform) {
/**
* If any keyframe is a string (because we measured it from the DOM), we need to convert
* it into a number before passing to the Animation polyfill.
*/
keyframes = keyframes.map((value) => typeof value === "string" ? parseFloat(value) : value);
/**
* If we only have a single keyframe, we need to create an initial keyframe by reading
* the current value from the DOM.
*/
if (keyframes.length === 1) {
keyframes.unshift(parseFloat(readInitialValue()));
}
animation = new AnimationPolyfill((latest) => {
style.set(element, name, toUnit ? toUnit(latest) : latest);
}, keyframes, Object.assign(Object.assign({}, options), { duration,
easing }));
}
else {
const target = keyframes[keyframes.length - 1];
style.set(element, name, definition && isNumber(target)
? definition.toDefaultUnit(target)
: target);
}
if (isRecording) {
record(element, key, keyframes, {
duration,
delay: delay,
easing,
repeat,
offset,
}, "motion-one");
}
motionValue.setAnimation(animation);
return animation;
};
}
const getOptions = (options, key) =>
/**
* TODO: Make test for this
* Always return a new object otherwise delay is overwritten by results of stagger
* and this results in no stagger
*/
options[key] ? Object.assign(Object.assign({}, options), options[key]) : Object.assign({}, options);
function resolveElements(elements, selectorCache) {
var _a;
if (typeof elements === "string") {
if (selectorCache) {
(_a = selectorCache[elements]) !== null && _a !== void 0 ? _a : (selectorCache[elements] = document.querySelectorAll(elements));
elements = selectorCache[elements];
}
else {
elements = document.querySelectorAll(elements);
}
}
else if (elements instanceof Element) {
elements = [elements];
}
/**
* Return an empty array
*/
return Array.from(elements || []);
}
const createAnimation = (factory) => factory();
const withControls = (animationFactory, options, duration = defaults.duration) => {
return new Proxy({
animations: animationFactory.map(createAnimation).filter(Boolean),
duration,
options,
}, controls);
};
/**
* TODO:
* Currently this returns the first animation, ideally it would return
* the first active animation.
*/
const getActiveAnimation = (state) => state.animations[0];
const controls = {
get: (target, key) => {
const activeAnimation = getActiveAnimation(target);
switch (key) {
case "duration":
return target.duration;
case "currentTime":
return time.s((activeAnimation === null || activeAnimation === void 0 ? void 0 : activeAnimation[key]) || 0);
case "playbackRate":
case "playState":
return activeAnimation === null || activeAnimation === void 0 ? void 0 : activeAnimation[key];
case "finished":
if (!target.finished) {
target.finished = Promise.all(target.animations.map(selectFinished)).catch(noop);
}
return target.finished;
case "stop":
return () => {
target.animations.forEach((animation) => stopAnimation(animation));
};
case "forEachNative":
/**
* This is for internal use only, fire a callback for each
* underlying animation.
*/
return (callback) => {
target.animations.forEach((animation) => callback(animation, target));
};
default:
return typeof (activeAnimation === null || activeAnimation === void 0 ? void 0 : activeAnimation[key]) === "undefined"
? undefined
: () => target.animations.forEach((animation) => animation[key]());
}
},
set: (target, key, value) => {
switch (key) {
case "currentTime":
value = time.ms(value);
case "currentTime":
case "playbackRate":
for (let i = 0; i < target.animations.length; i++) {
t