apprun 3.35.0 → 3.36.0

package/dist/apprun-play-html.esm.js

@@ -1,34 +1,34 @@
-class t{constructor(){this._events={}}on(t,i,s={}){this._events[t]=this._events[t]||[],this._events[t].push({fn:i,options:s})}off(t,i){const s=this._events[t]||[];this._events[t]=s.filter((t=>t.fn!==i))}find(t){return this._events[t]}run(t,...i){const s=this.getSubscribers(t,this._events);return console.assert(s&&s.length>0,"No subscriber for event: "+t),s.forEach((s=>{const{fn:e,options:n}=s;return n.delay?this.delay(t,e,i,n):Object.keys(n).length>0?e.apply(this,[...i,n]):e.apply(this,i),!s.options.once})),s.length}once(t,i,s={}){this.on(t,i,Object.assign(Object.assign({},s),{once:!0}))}delay(t,i,s,e){e._t&&clearTimeout(e._t),e._t=setTimeout((()=>{clearTimeout(e._t),Object.keys(e).length>0?i.apply(this,[...s,e]):i.apply(this,s)}),e.delay)}runAsync(t,...i){const s=this.getSubscribers(t,this._events);console.assert(s&&s.length>0,"No subscriber for event: "+t);const e=s.map((t=>{const{fn:s,options:e}=t;return Object.keys(e).length>0?s.apply(this,[...i,e]):s.apply(this,i)}));return Promise.all(e)}query(t,...i){return this.runAsync(t,...i)}getSubscribers(t,i){const s=i[t]||[];return i[t]=s.filter((t=>!t.options.once)),Object.keys(i).filter((i=>i.endsWith("*")&&t.startsWith(i.replace("*","")))).sort(((t,i)=>i.length-t.length)).forEach((e=>s.push(...i[e].map((i=>Object.assign(Object.assign({},i),{options:Object.assign(Object.assign({},i.options),{event:t})})))))),s}}let i;const s="undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:{};s.app&&s._AppRunVersions?i=s.app:(i=new t,s.app=i,s._AppRunVersions="AppRun-3.3.11");var e=i;const n=(t,i)=>(i?t.state[i]:t.state)||"",o=(t,i,s)=>{if(i){const e=t.state||{};e[i]=s,t.setState(e)}else t.setState(s)},r=(t,i)=>{if(Array.isArray(t))return t.map((t=>r(t,i)));{let{type:s,tag:h,props:c,children:l}=t;return h=h||s,l=l||(null==c?void 0:c.children),c&&Object.keys(c).forEach((t=>{t.startsWith("$")&&(((t,i,s,r)=>{if(t.startsWith("$on")){const s=i[t];if(t=t.substring(1),"boolean"==typeof s)i[t]=i=>r.run?r.run(t,i):e.run(t,i);else if("string"==typeof s)i[t]=t=>r.run?r.run(s,t):e.run(s,t);else if("function"==typeof s)i[t]=t=>r.setState(s(r.state,t));else if(Array.isArray(s)){const[n,...o]=s;"string"==typeof n?i[t]=t=>r.run?r.run(n,...o,t):e.run(n,...o,t):"function"==typeof n&&(i[t]=t=>r.setState(n(r.state,...o,t)))}}else if("$bind"===t){const e=i.type||"text",h="string"==typeof i[t]?i[t]:i.name;if("input"===s)switch(e){case"checkbox":i.checked=n(r,h),i.onclick=t=>o(r,h||t.target.name,t.target.checked);break;case"radio":i.checked=n(r,h)===i.value,i.onclick=t=>o(r,h||t.target.name,t.target.value);break;case"number":case"range":i.value=n(r,h),i.oninput=t=>o(r,h||t.target.name,Number(t.target.value));break;default:i.value=n(r,h),i.oninput=t=>o(r,h||t.target.name,t.target.value)}else"select"===s?(i.value=n(r,h),i.onchange=t=>{t.target.multiple||o(r,h||t.target.name,t.target.value)}):"option"===s?(i.selected=n(r,h),i.onclick=t=>o(r,h||t.target.name,t.target.selected)):"textarea"===s&&(i.innerHTML=n(r,h),i.oninput=t=>o(r,h||t.target.name,t.target.value))}else e.run("$",{key:t,tag:s,props:i,component:r})})(t,c,h,i),delete c[t])})),l&&r(l,i),t}};function h(t,...i){return l(i)}const c="_props";function l(t){const i=[],s=t=>{null!=t&&""!==t&&!1!==t&&i.push("function"==typeof t||"object"==typeof t?t:`${t}`)};return t&&t.forEach((t=>{Array.isArray(t)?t.forEach((t=>s(t))):s(t)})),i}function a(t,i,...s){const e=l(s);if("string"==typeof t)return{tag:t,props:i,children:e};if(Array.isArray(t))return t;if(void 0===t&&s)return e;if(Object.getPrototypeOf(t).i)return{tag:t,props:i,children:e};if("function"==typeof t)return t(i,e);throw new Error(`Unknown tag in vdom ${t}`)}const u=new WeakMap,d=(t,i,s={})=>{if(null==i||!1===i)return;!function(t,i,s={}){if(null==i||!1===i)return;if(i=g(i,s),!t)return;const e="SVG"===t.nodeName;Array.isArray(i)?f(t,i,e):f(t,[i],e)}("string"==typeof t&&t?document.getElementById(t)||document.querySelector(t):t,i=r(i,s),s)};function p(t,i,s){3!==i._op&&(s=s||"svg"===i.tag,!function(t,i){const s=t.nodeName,e=`${i.tag||""}`;return s.toUpperCase()===e.toUpperCase()}(t,i)?t.parentNode.replaceChild(b(i,s),t):(!(2&i._op)&&f(t,i.children,s),!(1&i._op)&&m(t,i.props,s)))}function f(t,i,s){var e,n;const o=(null===(e=t.childNodes)||void 0===e?void 0:e.length)||0,r=(null==i?void 0:i.length)||0,h=Math.min(o,r);for(let e=0;e<h;e++){const n=i[e];if(3===n._op)continue;const o=t.childNodes[e];if("string"==typeof n)o.textContent!==n&&(3===o.nodeType?o.nodeValue=n:t.replaceChild(v(n),o));else if(n instanceof HTMLElement||n instanceof SVGElement)t.insertBefore(n,o);else{const i=n.props&&n.props.key;if(i)if(o.key===i)p(t.childNodes[e],n,s);else{const r=u[i];if(r){const i=r.nextSibling;t.insertBefore(r,o),i?t.insertBefore(o,i):t.appendChild(o),p(t.childNodes[e],n,s)}else t.replaceChild(b(n,s),o)}else p(t.childNodes[e],n,s)}}let c=(null===(n=t.childNodes)||void 0===n?void 0:n.length)||0;for(;c>h;)t.removeChild(t.lastChild),c--;if(r>h){const e=document.createDocumentFragment();for(let t=h;t<i.length;t++)e.appendChild(b(i[t],s));t.appendChild(e)}}const y=t=>{const i=document.createElement("section");return i.insertAdjacentHTML("afterbegin",t),Array.from(i.children)};function v(t){if(0===(null==t?void 0:t.indexOf("_html:"))){const i=document.createElement("div");return i.insertAdjacentHTML("afterbegin",t.substring(6)),i}return document.createTextNode(null!=t?t:"")}function b(t,i){if(t instanceof HTMLElement||t instanceof SVGElement)return t;if("string"==typeof t)return v(t);if(!t.tag||"function"==typeof t.tag)return v(JSON.stringify(t));const s=(i=i||"svg"===t.tag)?document.createElementNS("http://www.w3.org/2000/svg",t.tag):document.createElement(t.tag);return m(s,t.props,i),t.children&&t.children.forEach((t=>s.appendChild(b(t,i)))),s}function m(t,i,s){const e=t[c]||{};i=function(t,i){i.class=i.class||i.className,delete i.className;const s={};return t&&Object.keys(t).forEach((t=>s[t]=null)),Object.keys(i).forEach((t=>s[t]=i[t])),s}(e,i||{}),t[c]=i;for(const e in i){const n=i[e];if(e.startsWith("data-")){const i=e.substring(5).replace(/-(\w)/g,(t=>t[1].toUpperCase()));t.dataset[i]!==n&&(n||""===n?t.dataset[i]=n:delete t.dataset[i])}else if("style"===e)if(t.style.cssText&&(t.style.cssText=""),"string"==typeof n)t.style.cssText=n;else for(const i in n)t.style[i]!==n[i]&&(t.style[i]=n[i]);else if(e.startsWith("xlink")){const i=e.replace("xlink","").toLowerCase();null==n||!1===n?t.removeAttributeNS("http://www.w3.org/1999/xlink",i):t.setAttributeNS("http://www.w3.org/1999/xlink",i,n)}else e.startsWith("on")?n&&"function"!=typeof n?"string"==typeof n&&(n?t.setAttribute(e,n):t.removeAttribute(e)):t[e]=n:/^id$|^class$|^list$|^readonly$|^contenteditable$|^role|-|^for$/g.test(e)||s?t.getAttribute(e)!==n&&(n?t.setAttribute(e,n):t.removeAttribute(e)):t[e]!==n&&(t[e]=n);"key"===e&&n&&(u[n]=t)}i&&"function"==typeof i.ref&&window.requestAnimationFrame((()=>i.ref(t)))}function g(t,i,s=0){var e;if("string"==typeof t)return t;if(Array.isArray(t))return t.map((t=>g(t,i,s++)));let n=t;if(t&&"function"==typeof t.tag&&Object.getPrototypeOf(t.tag).i&&(n=function(t,i,s){const{tag:e,props:n,children:o}=t;let r=`_${s}`,h=n&&n.id;h?r=h:h=`_${s}${Date.now()}`;let c="section";n&&n.as&&(c=n.as,delete n.as),i.v||(i.v={});let l=i.v[r];if(l&&l instanceof e&&l.element)l.renderState(l.state);else{const t=document.createElement(c);l=i.v[r]=new e(Object.assign(Object.assign({},n),{children:o})).mount(t,{render:!0})}if(l.mounted){const t=l.mounted(n,o,l.state);void 0!==t&&l.setState(t)}return m(l.element,n,!1),l.element}(t,i,s)),n&&Array.isArray(n.children)){const t=null===(e=n.props)||void 0===e?void 0:e._component;if(t){let i=0;n.children=n.children.map((s=>g(s,t,i++)))}else n.children=n.children.map((t=>g(t,i,s++)))}return n}const w=(t,i={})=>class extends HTMLElement{constructor(){super()}get component(){return this._component}get state(){return this._component.state}static get observedAttributes(){return(i.observedAttributes||[]).map((t=>t.toLowerCase()))}connectedCallback(){if(this.isConnected&&!this._component){const s=i||{};this._shadowRoot=s.shadow?this.attachShadow({mode:"open"}):this;const e=s.observedAttributes||[],n=e.reduce(((t,i)=>{const s=i.toLowerCase();return s!==i&&(t[s]=i),t}),{});this._attrMap=t=>n[t]||t;const o={};Array.from(this.attributes).forEach((t=>o[this._attrMap(t.name)]=t.value)),e.forEach((t=>{void 0!==this[t]&&(o[t]=this[t]),Object.defineProperty(this,t,{get:()=>o[t],set(i){this.attributeChangedCallback(t,o[t],i)},configurable:!0,enumerable:!0})})),requestAnimationFrame((()=>{const i=this.children?Array.from(this.children):[];if(this._component=new t(Object.assign(Object.assign({},o),{children:i})).mount(this._shadowRoot,s),this._component._props=o,this._component.dispatchEvent=this.dispatchEvent.bind(this),this._component.mounted){const t=this._component.mounted(o,i,this._component.state);void 0!==t&&(this._component.state=t)}this.on=this._component.on.bind(this._component),this.run=this._component.run.bind(this._component),!1!==s.render&&this._component.run(".")}))}}disconnectedCallback(){var t,i,s,e;null===(i=null===(t=this._component)||void 0===t?void 0:t.unload)||void 0===i||i.call(t),null===(e=null===(s=this._component)||void 0===s?void 0:s.unmount)||void 0===e||e.call(s),this._component=null}attributeChangedCallback(t,s,e){if(this._component){const n=this._attrMap(t);this._component._props[n]=e,this._component.run("attributeChanged",n,s,e),e!==s&&!1!==i.render&&window.requestAnimationFrame((()=>{this._component.run(".")}))}}};var $=(t,i,s)=>{"undefined"!=typeof customElements&&customElements.define(t,w(i,s))};const S={meta:new WeakMap,defineMetadata(t,i,s){this.meta.has(s)||this.meta.set(s,{}),this.meta.get(s)[t]=i},getMetadataKeys(t){return t=Object.getPrototypeOf(t),this.meta.get(t)?Object.keys(this.meta.get(t)):[]},getMetadata(t,i){return i=Object.getPrototypeOf(i),this.meta.get(i)?this.meta.get(i)[t]:null}};const A=new Map;e.find("get-components")||e.on("get-components",(t=>t.components=A));const j=t=>t;class x{renderState(t,i=null){if(!this.view)return;let s=i||this.view(t);if(e.debug&&e.run("debug",{component:this,_:s?".":"-",state:t,vdom:s,el:this.element}),"object"!=typeof document)return;const n="string"==typeof this.element&&this.element?document.getElementById(this.element)||document.querySelector(this.element):this.element;if(!n)return;const o="_c";this.unload?n._component===this&&n.getAttribute(o)===this.tracking_id||(this.tracking_id=(new Date).valueOf().toString(),n.setAttribute(o,this.tracking_id),"undefined"!=typeof MutationObserver&&(this.observer||(this.observer=new MutationObserver((t=>{t[0].oldValue!==this.tracking_id&&document.body.contains(n)||(this.unload(this.state),this.observer.disconnect(),this.observer=null)}))),this.observer.observe(document.body,{childList:!0,subtree:!0,attributes:!0,attributeOldValue:!0,attributeFilter:[o]}))):n.removeAttribute&&n.removeAttribute(o),n._component=this,!i&&s&&(s=r(s,this),this.options.transition&&document&&document.startViewTransition?document.startViewTransition((()=>e.render(n,s,this))):e.render(n,s,this)),this.rendered&&this.rendered(this.state)}setState(t,i={render:!0,history:!1}){const s=async t=>{try{for(;;){const{value:s,done:e}=await t.next();if(e)break;this.setState(s,i)}}catch(t){console.error("Error in async iterator:",t)}},e=t;if(null==e?void 0:e[Symbol.asyncIterator])this.setState(s(e[Symbol.asyncIterator]()),i);else if((null==e?void 0:e[Symbol.iterator])&&"function"==typeof e.next)for(const t of e)this.setState(t,i);else if(t&&t instanceof Promise)Promise.resolve(t).then((s=>{this.setState(s,i),this._state=t}));else{if(this._state=t,null==t)return;this.state=t,!1!==i.render&&(i.transition&&document&&document.startViewTransition?document.startViewTransition((()=>this.renderState(t))):this.renderState(t)),!1!==i.history&&this.enable_history&&(this._history=[...this._history,t],this._history_idx=this._history.length-1),"function"==typeof i.callback&&i.callback(this.state)}}constructor(i,s,e,n){this.state=i,this.view=s,this.update=e,this.options=n,this._app=new t,this._actions=[],this._global_events=[],this._history=[],this._history_idx=-1,this._history_prev=()=>{this._history_idx--,this._history_idx>=0?this.setState(this._history[this._history_idx],{render:!0,history:!1}):this._history_idx=0},this._history_next=()=>{this._history_idx++,this._history_idx<this._history.length?this.setState(this._history[this._history_idx],{render:!0,history:!1}):this._history_idx=this._history.length-1},this.start=(t=null,i)=>{if(this.mount(t,Object.assign({render:!0},i)),this.mounted&&"function"==typeof this.mounted){const t=this.mounted({},[],this.state);void 0!==t&&this.setState(t)}return this}}mount(t=null,i){var s,n;return console.assert(!this.element,"Component already mounted."),this.options=i=Object.assign(Object.assign({},this.options),i),this.element=t,this.global_event=i.global_event,this.enable_history=!!i.history,this.enable_history&&(this.on(i.history.prev||"history-prev",this._history_prev),this.on(i.history.next||"history-next",this._history_next)),i.route&&(this.update=this.update||{},this.update[i.route]||(this.update[i.route]=j)),this.add_actions(),this.state=null!==(n=null!==(s=this.state)&&void 0!==s?s:this.model)&&void 0!==n?n:{},"function"==typeof this.state&&(this.state=this.state()),this.setState(this.state,{render:!!i.render,history:!0}),e.debug&&(A.get(t)?A.get(t).push(this):A.set(t,[this])),this}is_global_event(t){return t&&(this.global_event||this._global_events.indexOf(t)>=0||t.startsWith("#")||t.startsWith("/")||t.startsWith("@"))}add_action(t,i,s={}){i&&"function"==typeof i&&(s.global&&this._global_events.push(t),this.on(t,((...n)=>{e.debug&&e.run("debug",{component:this,_:">",event:t,p:n,current_state:this.state,options:s});const o=i(this.state,...n);e.debug&&e.run("debug",{component:this,_:"<",event:t,p:n,newState:o,state:this.state,options:s}),this.setState(o,s)}),s))}add_actions(){const t=this.update||{};S.getMetadataKeys(this).forEach((i=>{if(i.startsWith("apprun-update:")){const s=S.getMetadata(i,this);t[s.name]=[this[s.key].bind(this),s.options]}}));const i={};Array.isArray(t)?t.forEach((t=>{const[s,e,n]=t;s.toString().split(",").forEach((t=>i[t.trim()]=[e,n]))})):Object.keys(t).forEach((s=>{const e=t[s];("function"==typeof e||Array.isArray(e))&&s.split(",").forEach((t=>i[t.trim()]=e))})),i["."]||(i["."]=j),Object.keys(i).forEach((t=>{const s=i[t];"function"==typeof s?this.add_action(t,s):Array.isArray(s)&&this.add_action(t,s[0],s[1])}))}run(t,...i){if(this.state instanceof Promise)return Promise.resolve(this.state).then((s=>{this.state=s,this.run(t,...i)}));{const s=t.toString();return this.is_global_event(s)?e.run(s,...i):this._app.run(s,...i)}}on(t,i,s){const n=t.toString();return this._actions.push({name:n,fn:i}),this.is_global_event(n)?e.on(n,i,s):this._app.on(n,i,s)}runAsync(t,...i){const s=t.toString();return this.is_global_event(s)?e.runAsync(s,...i):this._app.runAsync(s,...i)}query(t,...i){return this.runAsync(t,...i)}unmount(){var t;null===(t=this.observer)||void 0===t||t.disconnect(),this._actions.forEach((t=>{const{name:i,fn:s}=t;this.is_global_event(i)?e.off(i,s):this._app.off(i,s)}))}}x.i=!0;const O="//",_="///",k=t=>{if(e.lastUrl!==t)if(e.lastUrl=t,t||(t="#"),t.startsWith("#")){const[i,...s]=t.split("/");e.run(i,...s)||e.run(_,i,...s),e.run(O,i,...s)}else if(t.startsWith("/")){const[i,s,...n]=t.split("/");e.run("/"+s,...n)||e.run(_,"/"+s,...n),e.run(O,"/"+s,...n)}else e.run(t)||e.run(_,t),e.run(O,t)};if(!e.start){e.version="3.35.0",e.h=e.createElement=a,e.render=d,e.Fragment=h,e.webComponent=$,e.safeHTML=y,e.start=(t,i,s,e,n)=>{const o=Object.assign({render:!0,global_event:!0},n),r=new x(i,s,e);return n&&n.rendered&&(r.rendered=n.rendered),n&&n.mounted&&(r.mounted=n.mounted),r.start(t,o),r};const t=t=>{};e.on("debug",(i=>t)),e.on(O,t),e.on(_,t),e.route=k,e.on("route",(t=>e.route&&e.route(t))),"object"==typeof document&&document.addEventListener("DOMContentLoaded",(()=>{const t=document.body.hasAttribute("apprun-no-init")||e["no-init-route"]||!1,i=e.find("#")||e.find("#/")||!1;window.addEventListener("hashchange",(()=>k(location.hash))),window.addEventListener("popstate",(()=>k(location.pathname))),i?t&&k(location.hash):(t&&k(location.pathname),document.body.addEventListener("click",(t=>{const i=t.target,s="A"===i.tagName?i:i.closest("a");s&&s.origin===location.origin&&(t.preventDefault(),history.pushState(null,"",s.pathname),k(s.pathname))})))})),"object"==typeof window&&(window.Component=x,window._React=window.React,window.React=e,window.on=function(t,i={}){return function(s,e){const n=t?t.toString():e;S.defineMetadata(`apprun-update:${n}`,{name:n,key:e,options:i},s)}},window.customElement=function(t,i){return function(s){return $(t,s,i),s}},window.safeHTML=y),e.use_render=(t,i=0)=>{e.render=0===i?(i,s)=>t(s,i):(i,s)=>t(i,s)},e.use_react=(t,i)=>{e.h=e.createElement=t.createElement,e.Fragment=t.Fragment,e.render=(t,s)=>i.render(s,t),t.version&&t.version.startsWith("18")&&(e.render=(t,s)=>{t&&s&&(t._root||(t._root=i.createRoot(t)),t._root.render(s))})}}
+const t="3.36.0",e=`AppRun-${t}`;class i{constructor(){this._events={}}on(t,e,i={}){this._events[t]=this._events[t]||[],this._events[t].push({fn:e,options:i})}off(t,e){const i=this._events[t]||[];this._events[t]=i.filter((t=>t.fn!==e))}find(t){return this._events[t]}run(t,...e){const i=this.getSubscribers(t,this._events);return console.assert(i&&i.length>0,"No subscriber for event: "+t),i.forEach((i=>{const{fn:n,options:s}=i;if(!n||"function"!=typeof n)return console.error(`AppRun event handler for '${t}' is not a function:`,n),!1;if(s.delay)this.delay(t,n,e,s);else try{Object.keys(s).length>0?n.apply(this,[...e,s]):n.apply(this,e)}catch(e){console.error(`Error in event handler for '${t}':`,e)}return!i.options.once})),i.length}once(t,e,i={}){this.on(t,e,Object.assign(Object.assign({},i),{once:!0}))}delay(t,e,i,n){n._t&&clearTimeout(n._t),n._t=setTimeout((()=>{clearTimeout(n._t);try{Object.keys(n).length>0?e.apply(this,[...i,n]):e.apply(this,i)}catch(e){console.error(`Error in delayed event handler for '${t}':`,e)}}),n.delay)}runAsync(t,...e){const i=this.getSubscribers(t,this._events);console.assert(i&&i.length>0,"No subscriber for event: "+t);const n=i.map((i=>{const{fn:n,options:s}=i;if(!n||"function"!=typeof n)return console.error(`AppRun async event handler for '${t}' is not a function:`,n),Promise.resolve(null);try{return Object.keys(s).length>0?n.apply(this,[...e,s]):n.apply(this,e)}catch(e){return console.error(`Error in async event handler for '${t}':`,e),Promise.reject(e)}}));return Promise.all(n)}query(t,...e){return this.runAsync(t,...e)}getSubscribers(t,e){const i=e[t]||[];return e[t]=i.filter((t=>!t.options.once)),Object.keys(e).filter((e=>e.endsWith("*")&&t.startsWith(e.replace("*","")))).sort(((t,e)=>e.length-t.length)).forEach((n=>i.push(...e[n].map((e=>Object.assign(Object.assign({},e),{options:Object.assign(Object.assign({},e.options),{event:t})})))))),i}}const n=e;let s;const o="undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:{};o.app&&o._AppRunVersions?s=o.app:(s=new i,o.app=s,o._AppRunVersions=n);var r=s;function c(t){return(null==t?void 0:t.target)instanceof HTMLElement?t.target:null}const h=(t,e)=>(e?t.state[e]:t.state)||"",l=(t,e,i)=>{if(e){const n=t.state||{};n[e]=i,t.setState(n)}else t.setState(i)},a=(t,e)=>{if(Array.isArray(t))return t.map((t=>a(t,e)));{let{type:i,tag:n,props:s,children:o}=t;return n=n||i,o=o||(null==s?void 0:s.children),s&&Object.keys(s).forEach((t=>{t.startsWith("$")&&(((t,e,i,n)=>{if(t.startsWith("$on")){const i=e[t];if(t=t.substring(1),"boolean"==typeof i)e[t]=e=>n.run?n.run(t,e):r.run(t,e);else if("string"==typeof i)e[t]=t=>n.run?n.run(i,t):r.run(i,t);else if("function"==typeof i)e[t]=t=>n.setState(i(n.state,t));else if(Array.isArray(i)){const[s,...o]=i;"string"==typeof s?e[t]=t=>n.run?n.run(s,...o,t):r.run(s,...o,t):"function"==typeof s&&(e[t]=t=>n.setState(s(n.state,...o,t)))}}else if("$bind"===t){const s=e.type||"text",o="string"==typeof e[t]?e[t]:e.name;if("input"===i)switch(s){case"checkbox":e.checked=h(n,o),e.onclick=t=>{const e=c(t);e&&l(n,o||e.name,e.checked)};break;case"radio":e.checked=h(n,o)===e.value,e.onclick=t=>{const e=c(t);e&&l(n,o||e.name,e.value)};break;case"number":case"range":e.value=h(n,o),e.oninput=t=>{const e=c(t);e&&l(n,o||e.name,Number(e.value))};break;default:e.value=h(n,o),e.oninput=t=>{const e=c(t);e&&l(n,o||e.name,e.value)}}else"select"===i?(e.value=h(n,o),e.onchange=t=>{const e=c(t);e&&!e.multiple&&l(n,o||e.name,e.value)}):"option"===i?(e.selected=h(n,o),e.onclick=t=>{const e=c(t);e&&l(n,o||e.name,e.selected)}):"textarea"===i&&(e.innerHTML=h(n,o),e.oninput=t=>{const e=c(t);e&&l(n,o||e.name,e.value)})}else r.run("$",{key:t,tag:i,props:e,component:n})})(t,s,n,e),delete s[t])})),o&&a(o,e),t}};function u(t,...e){return p(e)}const d="_props";function p(t){const e=[],i=t=>{null!=t&&""!==t&&!1!==t&&e.push("function"==typeof t||"object"==typeof t?t:`${t}`)};return t&&t.forEach((t=>{Array.isArray(t)?t.forEach((t=>i(t))):i(t)})),e}function f(t,e,...i){const n=p(i);if("string"==typeof t)return{tag:t,props:e,children:n};if(Array.isArray(t))return t;if(void 0===t&&i)return n;if(Object.getPrototypeOf(t).i)return{tag:t,props:e,children:n};if("function"==typeof t)return t(e,n);throw new Error(`Unknown tag in vdom ${t}`)}const y=(t,e,i={})=>{if(null==e||!1===e)return;!function(t,e,i={}){if(null==e||!1===e)return;if(e=j(e,i),!t)return;const n="SVG"===t.nodeName;Array.isArray(e)?m(t,e,n):m(t,[e],n)}("string"==typeof t&&t?document.getElementById(t)||document.querySelector(t):t,e=a(e,i),i)};function v(t,e,i){i=i||"svg"===e.tag,function(t,e){const i=t.nodeName,n=`${e.tag||""}`;return i.toUpperCase()===n.toUpperCase()}(t,e)?(m(t,e.children,i),$(t,e.props,i)):t.parentNode.replaceChild(w(e,i),t)}function m(t,e,i){var n;const s=(null===(n=t.childNodes)||void 0===n?void 0:n.length)||0,o=(null==e?void 0:e.length)||0;if(null==e?void 0:e.some((t=>t&&"object"==typeof t&&t.props&&void 0!==t.props.key))){const n=new Map;for(let e=0;e<s;e++){const i=t.childNodes[e];i&&i.key&&n.set(i.key,i)}const r=document.createDocumentFragment();for(let t=0;t<o;t++){const s=e[t];if(null==s)continue;const o=s.props&&s.props.key;if(o&&n.has(o)){const t=n.get(o);v(t,s,i),r.appendChild(t),n.delete(o)}else r.appendChild(w(s,i))}for(;t.firstChild;)t.removeChild(t.firstChild);return void t.appendChild(r)}const r=Math.min(s,o);for(let n=0;n<r;n++){const s=e[n];if(null==s)continue;const o=t.childNodes[n];o&&("string"==typeof s?3===o.nodeType?o.nodeValue!==s&&(o.nodeValue=s):t.replaceChild(g(s),o):s instanceof HTMLElement||s instanceof SVGElement?t.replaceChild(s,o):s&&"object"==typeof s&&v(t.childNodes[n],s,i))}for(;t.childNodes.length>r;)t.removeChild(t.lastChild);if(o>r){const n=document.createDocumentFragment();for(let t=r;t<e.length;t++){const s=e[t];null!=s&&n.appendChild(w(s,i))}t.appendChild(n)}}const b=t=>{const e=document.createElement("section");return e.insertAdjacentHTML("afterbegin",t),Array.from(e.children)};function g(t){if(0===(null==t?void 0:t.indexOf("_html:"))){const e=document.createElement("div");return e.insertAdjacentHTML("afterbegin",t.substring(6)),e}return document.createTextNode(null!=t?t:"")}function w(t,e){if(t instanceof HTMLElement||t instanceof SVGElement)return t;if("string"==typeof t)return g(t);if(!t||"object"!=typeof t||!t.tag||"function"==typeof t.tag)return g("object"==typeof t?JSON.stringify(t):String(null!=t?t:""));const i=(e=e||"svg"===t.tag)?document.createElementNS("http://www.w3.org/2000/svg",t.tag):document.createElement(t.tag);return $(i,t.props,e),t.children&&t.children.forEach((t=>i.appendChild(w(t,e)))),i}function $(t,e,i){const n=t[d]||{};e=function(t,e){e.class=e.class||e.className,delete e.className;const i={};return t&&Object.keys(t).forEach((t=>i[t]=null)),Object.keys(e).forEach((t=>i[t]=e[t])),i}(n,e||{}),t[d]=e;for(const n in e){const s=e[n];if(n.startsWith("data-")){const e=n.substring(5).replace(/-(\w)/g,(t=>t[1].toUpperCase()));t.dataset[e]!==s&&(s||""===s?t.dataset[e]=s:delete t.dataset[e])}else if("style"===n)if(t.style.cssText&&(t.style.cssText=""),"string"==typeof s)t.style.cssText=s;else for(const e in s)t.style[e]!==s[e]&&(t.style[e]=s[e]);else if(n.startsWith("xlink")){const e=n.replace("xlink","").toLowerCase();null==s||!1===s?t.removeAttributeNS("http://www.w3.org/1999/xlink",e):t.setAttributeNS("http://www.w3.org/1999/xlink",e,s)}else n.startsWith("on")?s&&"function"!=typeof s?"string"==typeof s&&(s?t.setAttribute(n,s):t.removeAttribute(n)):t[n]=s:/^id$|^class$|^list$|^readonly$|^contenteditable$|^role|-|^for$/g.test(n)||i?t.getAttribute(n)!==s&&(s?t.setAttribute(n,s):t.removeAttribute(n)):t[n]!==s&&(t[n]=s);"key"===n&&void 0!==s&&(t.key=s)}e&&"function"==typeof e.ref&&window.requestAnimationFrame((()=>e.ref(t)))}function j(t,e,i=0){var n;if("string"==typeof t)return t;if(Array.isArray(t))return t.map((t=>j(t,e,i++)));let s=t;if(t&&"function"==typeof t.tag&&Object.getPrototypeOf(t.tag).i&&(s=function(t,e,i){const{tag:n,props:s,children:o}=t;let r=`_${i}`,c=s&&s.id;c?r=c:c=`_${i}${Date.now()}`;let h="section";s&&s.as&&(h=s.as,delete s.as),e.v||(e.v={});let l=e.v[r];if(l&&l instanceof n&&l.element)l.renderState(l.state);else{const t=document.createElement(h);l=e.v[r]=new n(Object.assign(Object.assign({},s),{children:o})).mount(t,{render:!0})}if(l.mounted){const t=l.mounted(s,o,l.state);void 0!==t&&l.setState(t)}return $(l.element,s,!1),l.element}(t,e,i)),s&&Array.isArray(s.children)){const t=null===(n=s.props)||void 0===n?void 0:n._component;if(t){let e=0;s.children=s.children.map((i=>j(i,t,e++)))}else s.children=s.children.map((t=>j(t,e,i++)))}return s}const A=(t,e={})=>class extends HTMLElement{constructor(){super()}get component(){return this._component}get state(){return this._component.state}static get observedAttributes(){return(e.observedAttributes||[]).map((t=>t.toLowerCase()))}connectedCallback(){if(this.isConnected&&!this._component){const i=e||{};this._shadowRoot=i.shadow?this.attachShadow({mode:"open"}):this;const n=i.observedAttributes||[],s=n.reduce(((t,e)=>{const i=e.toLowerCase();return i!==e&&(t[i]=e),t}),{});this._attrMap=t=>s[t]||t;const o={};Array.from(this.attributes).forEach((t=>o[this._attrMap(t.name)]=t.value)),n.forEach((t=>{void 0!==this[t]&&(o[t]=this[t]),Object.defineProperty(this,t,{get:()=>o[t],set(e){this.attributeChangedCallback(t,o[t],e)},configurable:!0,enumerable:!0})})),requestAnimationFrame((()=>{const e=this.children?Array.from(this.children):[];if(this._component=new t(Object.assign(Object.assign({},o),{children:e})).mount(this._shadowRoot,i),this._component._props=o,this._component.dispatchEvent=this.dispatchEvent.bind(this),this._component.mounted){const t=this._component.mounted(o,e,this._component.state);void 0!==t&&(this._component.state=t)}this.on=this._component.on.bind(this._component),this.run=this._component.run.bind(this._component),!1!==i.render&&this._component.run(".")}))}}disconnectedCallback(){var t,e,i,n;null===(e=null===(t=this._component)||void 0===t?void 0:t.unload)||void 0===e||e.call(t),null===(n=null===(i=this._component)||void 0===i?void 0:i.unmount)||void 0===n||n.call(i),this._component=null}attributeChangedCallback(t,i,n){if(this._component){const s=this._attrMap(t);this._component._props[s]=n,this._component.run("attributeChanged",s,i,n),n!==i&&!1!==e.render&&window.requestAnimationFrame((()=>{this._component.run(".")}))}}};var S=(t,e,i)=>{"undefined"!=typeof customElements&&customElements.define(t,A(e,i))};const O={meta:new WeakMap,defineMetadata(t,e,i){this.meta.has(i)||this.meta.set(i,{}),this.meta.get(i)[t]=e},getMetadataKeys(t){return t=Object.getPrototypeOf(t),this.meta.get(t)?Object.keys(this.meta.get(t)):[]},getMetadata(t,e){return e=Object.getPrototypeOf(e),this.meta.get(e)?this.meta.get(e)[t]:null}};const _=new Map;r.find("get-components")||r.on("get-components",(t=>t.components=_));const x=t=>t;class E{renderState(t,e=null){if(!this.view)return;let i=e||this.view(t);if(r.debug&&r.run("debug",{component:this,_:i?".":"-",state:t,vdom:i,el:this.element}),"object"!=typeof document)return;const n="string"==typeof this.element&&this.element?function(t){try{return document.getElementById(t)}catch(e){return console.warn(`Error getting element by id: ${t}`,e),null}}(this.element)||function(t,e=document){try{return e.querySelector(t)}catch(e){return console.warn(`Invalid selector: ${t}`,e),null}}(this.element):this.element;if(!n)return void console.warn(`Component element not found: ${this.element}`);const s="_c";this.unload?n._component===this&&n.getAttribute(s)===this.tracking_id||(this.tracking_id=(new Date).valueOf().toString(),n.setAttribute(s,this.tracking_id),"undefined"!=typeof MutationObserver&&(this.observer||(this.observer=new MutationObserver((t=>{t[0].oldValue!==this.tracking_id&&document.body.contains(n)||(this.unload(this.state),this.observer.disconnect(),this.observer=null)}))),this.observer.observe(document.body,{childList:!0,subtree:!0,attributes:!0,attributeOldValue:!0,attributeFilter:[s]}))):n.removeAttribute&&n.removeAttribute(s),n._component=this,!e&&i&&(i=a(i,this),this.options.transition&&document&&document.startViewTransition?document.startViewTransition((()=>r.render(n,i,this))):r.render(n,i,this)),this.rendered&&this.rendered(this.state)}setState(t,e={render:!0,history:!1}){const i=async t=>{try{for(;;){const{value:i,done:n}=await t.next();if(n)break;this.setState(i,e)}}catch(t){console.error("Error in async iterator:",t)}},n=t;if(null==n?void 0:n[Symbol.asyncIterator])this.setState(i(n[Symbol.asyncIterator]()),e);else if((null==n?void 0:n[Symbol.iterator])&&"function"==typeof n.next)for(const t of n)this.setState(t,e);else if(t&&t instanceof Promise)Promise.resolve(t).then((i=>{this.setState(i,e),this._state=t}));else{if(this._state=t,null==t)return;this.state=t,!1!==e.render&&(e.transition&&document&&document.startViewTransition?document.startViewTransition((()=>this.renderState(t))):this.renderState(t)),!1!==e.history&&this.enable_history&&(this._history=[...this._history,t],this._history_idx=this._history.length-1),"function"==typeof e.callback&&e.callback(this.state)}}constructor(t,e,n,s){this.state=t,this.view=e,this.update=n,this.options=s,this._app=new i,this._actions=[],this._global_events=[],this._history=[],this._history_idx=-1,this._history_prev=()=>{this._history_idx--,this._history_idx>=0?this.setState(this._history[this._history_idx],{render:!0,history:!1}):this._history_idx=0},this._history_next=()=>{this._history_idx++,this._history_idx<this._history.length?this.setState(this._history[this._history_idx],{render:!0,history:!1}):this._history_idx=this._history.length-1},this.start=(t=null,e)=>{if(this.mount(t,Object.assign({render:!0},e)),this.mounted&&"function"==typeof this.mounted){const t=this.mounted({},[],this.state);void 0!==t&&this.setState(t)}return this}}mount(t=null,e){var i,n;return console.assert(!this.element,"Component already mounted."),this.options=e=Object.assign(Object.assign({},this.options),e),this.element=t,this.global_event=e.global_event,this.enable_history=!!e.history,this.enable_history&&(this.on(e.history.prev||"history-prev",this._history_prev),this.on(e.history.next||"history-next",this._history_next)),e.route&&(this.update=this.update||{},this.update[e.route]||(this.update[e.route]=x)),this.add_actions(),this.state=null!==(n=null!==(i=this.state)&&void 0!==i?i:this.model)&&void 0!==n?n:{},"function"==typeof this.state&&(this.state=this.state()),this.setState(this.state,{render:!!e.render,history:!0}),r.debug&&(_.get(t)?_.get(t).push(this):_.set(t,[this])),this}is_global_event(t){return t&&(this.global_event||this._global_events.indexOf(t)>=0||t.startsWith("#")||t.startsWith("/")||t.startsWith("@"))}add_action(t,e,i={}){e&&"function"==typeof e?(i.global&&this._global_events.push(t),this.on(t,((...n)=>{r.debug&&r.run("debug",{component:this,_:">",event:t,p:n,current_state:this.state,options:i});try{const s=e(this.state,...n);r.debug&&r.run("debug",{component:this,_:"<",event:t,p:n,newState:s,state:this.state,options:i}),this.setState(s,i)}catch(e){console.error(`Error in component action '${t}':`,e),r.debug&&r.run("debug",{component:this,_:"!",event:t,p:n,error:e,state:this.state,options:i})}}),i)):console.warn(`Component action for '${t}' is not a valid function:`,e)}add_actions(){const t=this.update||{};O.getMetadataKeys(this).forEach((e=>{if(e.startsWith("apprun-update:")){const i=O.getMetadata(e,this);t[i.name]=[this[i.key].bind(this),i.options]}}));const e={};Array.isArray(t)?t.forEach((t=>{const[i,n,s]=t;i.toString().split(",").forEach((t=>e[t.trim()]=[n,s]))})):Object.keys(t).forEach((i=>{const n=t[i];("function"==typeof n||Array.isArray(n))&&i.split(",").forEach((t=>e[t.trim()]=n))})),e["."]||(e["."]=x),Object.keys(e).forEach((t=>{const i=e[t];"function"==typeof i?this.add_action(t,i):Array.isArray(i)&&this.add_action(t,i[0],i[1])}))}run(t,...e){if(this.state instanceof Promise)return Promise.resolve(this.state).then((i=>{this.state=i,this.run(t,...e)}));{const i=t.toString();return this.is_global_event(i)?r.run(i,...e):this._app.run(i,...e)}}on(t,e,i){const n=t.toString();return this._actions.push({name:n,fn:e}),this.is_global_event(n)?r.on(n,e,i):this._app.on(n,e,i)}runAsync(t,...e){const i=t.toString();return this.is_global_event(i)?r.runAsync(i,...e):this._app.runAsync(i,...e)}query(t,...e){return this.runAsync(t,...e)}unmount(){var t;null===(t=this.observer)||void 0===t||t.disconnect(),this._actions.forEach((t=>{const{name:e,fn:i}=t;this.is_global_event(e)?r.off(e,i):this._app.off(e,i)}))}}E.i=!0;const k="//",C="///",M=t=>{if(r.lastUrl!==t)if(r.lastUrl=t,t||(t="#"),t.startsWith("#")){const[e,...i]=t.split("/");r.run(e,...i)||r.run(C,e,...i),r.run(k,e,...i)}else if(t.startsWith("/")){const[e,i,...n]=t.split("/");r.run("/"+i,...n)||r.run(C,"/"+i,...n),r.run(k,"/"+i,...n)}else r.run(t)||r.run(C,t),r.run(k,t)};if(!r.start){r.version=t,r.h=r.createElement=f,r.render=y,r.Fragment=u,r.webComponent=S,r.safeHTML=b,r.start=(t,e,i,n,s)=>{const o=Object.assign({render:!0,global_event:!0},s),r=new E(e,i,n);return s&&s.rendered&&(r.rendered=s.rendered),s&&s.mounted&&(r.mounted=s.mounted),r.start(t,o),r},r.once=r.once||((t,e,i={})=>{r.on(t,e,Object.assign(Object.assign({},i),{once:!0}))}),r.query=r.query||r.runAsync;const e=t=>{};if(r.on("debug",(t=>e)),r.on(k,e),r.on(C,e),r.route=M,r.on("route",(t=>r.route&&r.route(t))),"object"==typeof document&&document.addEventListener("DOMContentLoaded",(()=>{const t=document.body.hasAttribute("apprun-no-init")||r["no-init-route"]||!1,e=r.find("#")||r.find("#/")||!1;window.addEventListener("hashchange",(()=>M(location.hash))),window.addEventListener("popstate",(()=>M(location.pathname))),e?!t&&M(location.hash):(!t&&M(location.pathname),document.body.addEventListener("click",(t=>{const e=t.target;if(!e)return;const i="A"===e.tagName?e:e.closest("a");i&&i.origin===location.origin&&i.pathname&&(t.preventDefault(),history.pushState(null,"",i.pathname),M(i.pathname))})))})),"object"==typeof window){const t=window;t.Component=E,t._React=t.React,t.React=r,t.on=function(t,e={}){return function(i,n){const s=t?t.toString():n;O.defineMetadata(`apprun-update:${s}`,{name:s,key:n,options:e},i)}},t.customElement=function(t,e){return function(i){return S(t,i,e),i}},t.safeHTML=b}r.use_render=(t,e=0)=>{r.render=0===e?(e,i)=>t(i,e):(e,i)=>t(e,i)},r.use_react=(t,e)=>{if(t&&e)if("function"==typeof t.createElement)if(t.Fragment)if(r.h=r.createElement=t.createElement,r.Fragment=t.Fragment,t.version&&t.version.startsWith("18")){if(!e.createRoot||"function"!=typeof e.createRoot)return void console.error("AppRun use_react: ReactDOM.createRoot not found in React 18+");r.render=(t,i)=>{t&&void 0!==i&&(t._root||(t._root=e.createRoot(t)),t._root.render(i))}}else{if(!e.render||"function"!=typeof e.render)return void console.error("AppRun use_react: ReactDOM.render not found in legacy React");r.render=(t,i)=>e.render(i,t)}else console.error("AppRun use_react: Invalid React object - Fragment not found");else console.error("AppRun use_react: Invalid React object - createElement method not found");else console.error("AppRun use_react: React and ReactDOM parameters are required")}}
 /**
  * @license
  * Copyright 2019 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
- */const C=globalThis,E=C.ShadowRoot&&(void 0===C.ShadyCSS||C.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,M=Symbol(),P=new WeakMap;let T=class{constructor(t,i,s){if(this._$cssResult$=!0,s!==M)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t,this.t=i}get styleSheet(){let t=this.o;const i=this.t;if(E&&void 0===t){const s=void 0!==i&&1===i.length;s&&(t=P.get(i)),void 0===t&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),s&&P.set(i,t))}return t}toString(){return this.cssText}};const U=E?t=>t:t=>t instanceof CSSStyleSheet?(t=>{let i="";for(const s of t.cssRules)i+=s.cssText;return(t=>new T("string"==typeof t?t:t+"",void 0,M))(i)})(t):t
+ */const P=globalThis,R=P.ShadowRoot&&(void 0===P.ShadyCSS||P.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,T=Symbol(),U=new WeakMap;let N=class{constructor(t,e,i){if(this._$cssResult$=!0,i!==T)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t,this.t=e}get styleSheet(){let t=this.o;const e=this.t;if(R&&void 0===t){const i=void 0!==e&&1===e.length;i&&(t=U.get(e)),void 0===t&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),i&&U.set(e,t))}return t}toString(){return this.cssText}};const D=R?t=>t:t=>t instanceof CSSStyleSheet?(t=>{let e="";for(const i of t.cssRules)e+=i.cssText;return(t=>new N("string"==typeof t?t:t+"",void 0,T))(e)})(t):t
 /**
  * @license
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
- */,{is:N,defineProperty:R,getOwnPropertyDescriptor:z,getOwnPropertyNames:D,getOwnPropertySymbols:L,getPrototypeOf:B}=Object,H=globalThis,q=H.trustedTypes,I=q?q.emptyScript:"",W=H.reactiveElementPolyfillSupport,F=(t,i)=>t,V={toAttribute(t,i){switch(i){case Boolean:t=t?I: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}},G=(t,i)=>!N(t,i),J={attribute:!0,type:String,converter:V,reflect:!1,useDefault:!1,hasChanged:G};Symbol.metadata??=Symbol("metadata"),H.litPropertyMetadata??=new WeakMap;let K=class extends HTMLElement{static addInitializer(t){this._$Ei(),(this.l??=[]).push(t)}static get observedAttributes(){return this.finalize(),this._$Eh&&[...this._$Eh.keys()]}static createProperty(t,i=J){if(i.state&&(i.attribute=!1),this._$Ei(),this.prototype.hasOwnProperty(t)&&((i=Object.create(i)).wrapped=!0),this.elementProperties.set(t,i),!i.noAccessor){const s=Symbol(),e=this.getPropertyDescriptor(t,s,i);void 0!==e&&R(this.prototype,t,e)}}static getPropertyDescriptor(t,i,s){const{get:e,set:n}=z(this.prototype,t)??{get(){return this[i]},set(t){this[i]=t}};return{get:e,set(i){const o=e?.call(this);n?.call(this,i),this.requestUpdate(t,o,s)},configurable:!0,enumerable:!0}}static getPropertyOptions(t){return this.elementProperties.get(t)??J}static _$Ei(){if(this.hasOwnProperty(F("elementProperties")))return;const t=B(this);t.finalize(),void 0!==t.l&&(this.l=[...t.l]),this.elementProperties=new Map(t.elementProperties)}static finalize(){if(this.hasOwnProperty(F("finalized")))return;if(this.finalized=!0,this._$Ei(),this.hasOwnProperty(F("properties"))){const t=this.properties,i=[...D(t),...L(t)];for(const s of i)this.createProperty(s,t[s])}const t=this[Symbol.metadata];if(null!==t){const i=litPropertyMetadata.get(t);if(void 0!==i)for(const[t,s]of i)this.elementProperties.set(t,s)}this._$Eh=new Map;for(const[t,i]of this.elementProperties){const s=this._$Eu(t,i);void 0!==s&&this._$Eh.set(s,t)}this.elementStyles=this.finalizeStyles(this.styles)}static finalizeStyles(t){const i=[];if(Array.isArray(t)){const s=new Set(t.flat(1/0).reverse());for(const t of s)i.unshift(U(t))}else void 0!==t&&i.push(U(t));return i}static _$Eu(t,i){const s=i.attribute;return!1===s?void 0:"string"==typeof s?s:"string"==typeof t?t.toLowerCase():void 0}constructor(){super(),this._$Ep=void 0,this.isUpdatePending=!1,this.hasUpdated=!1,this._$Em=null,this._$Ev()}_$Ev(){this._$ES=new Promise((t=>this.enableUpdating=t)),this._$AL=new Map,this._$E_(),this.requestUpdate(),this.constructor.l?.forEach((t=>t(this)))}addController(t){(this._$EO??=new Set).add(t),void 0!==this.renderRoot&&this.isConnected&&t.hostConnected?.()}removeController(t){this._$EO?.delete(t)}_$E_(){const t=new Map,i=this.constructor.elementProperties;for(const s of i.keys())this.hasOwnProperty(s)&&(t.set(s,this[s]),delete this[s]);t.size>0&&(this._$Ep=t)}createRenderRoot(){const t=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return((t,i)=>{if(E)t.adoptedStyleSheets=i.map((t=>t instanceof CSSStyleSheet?t:t.styleSheet));else for(const s of i){const i=document.createElement("style"),e=C.litNonce;void 0!==e&&i.setAttribute("nonce",e),i.textContent=s.cssText,t.appendChild(i)}})(t,this.constructor.elementStyles),t}connectedCallback(){this.renderRoot??=this.createRenderRoot(),this.enableUpdating(!0),this._$EO?.forEach((t=>t.hostConnected?.()))}enableUpdating(t){}disconnectedCallback(){this._$EO?.forEach((t=>t.hostDisconnected?.()))}attributeChangedCallback(t,i,s){this._$AK(t,s)}_$ET(t,i){const s=this.constructor.elementProperties.get(t),e=this.constructor._$Eu(t,s);if(void 0!==e&&!0===s.reflect){const n=(void 0!==s.converter?.toAttribute?s.converter:V).toAttribute(i,s.type);this._$Em=t,null==n?this.removeAttribute(e):this.setAttribute(e,n),this._$Em=null}}_$AK(t,i){const s=this.constructor,e=s._$Eh.get(t);if(void 0!==e&&this._$Em!==e){const t=s.getPropertyOptions(e),n="function"==typeof t.converter?{fromAttribute:t.converter}:void 0!==t.converter?.fromAttribute?t.converter:V;this._$Em=e,this[e]=n.fromAttribute(i,t.type)??this._$Ej?.get(e)??null,this._$Em=null}}requestUpdate(t,i,s){if(void 0!==t){const e=this.constructor,n=this[t];if(s??=e.getPropertyOptions(t),!((s.hasChanged??G)(n,i)||s.useDefault&&s.reflect&&n===this._$Ej?.get(t)&&!this.hasAttribute(e._$Eu(t,s))))return;this.C(t,i,s)}!1===this.isUpdatePending&&(this._$ES=this._$EP())}C(t,i,{useDefault:s,reflect:e,wrapped:n},o){s&&!(this._$Ej??=new Map).has(t)&&(this._$Ej.set(t,o??i??this[t]),!0!==n||void 0!==o)||(this._$AL.has(t)||(this.hasUpdated||s||(i=void 0),this._$AL.set(t,i)),!0===e&&this._$Em!==t&&(this._$Eq??=new Set).add(t))}async _$EP(){this.isUpdatePending=!0;try{await this._$ES}catch(t){Promise.reject(t)}const t=this.scheduleUpdate();return null!=t&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??=this.createRenderRoot(),this._$Ep){for(const[t,i]of this._$Ep)this[t]=i;this._$Ep=void 0}const t=this.constructor.elementProperties;if(t.size>0)for(const[i,s]of t){const{wrapped:t}=s,e=this[i];!0!==t||this._$AL.has(i)||void 0===e||this.C(i,void 0,s,e)}}let t=!1;const i=this._$AL;try{t=this.shouldUpdate(i),t?(this.willUpdate(i),this._$EO?.forEach((t=>t.hostUpdate?.())),this.update(i)):this._$EM()}catch(i){throw t=!1,this._$EM(),i}t&&this._$AE(i)}willUpdate(t){}_$AE(t){this._$EO?.forEach((t=>t.hostUpdated?.())),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(t)),this.updated(t)}_$EM(){this._$AL=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$ES}shouldUpdate(t){return!0}update(t){this._$Eq&&=this._$Eq.forEach((t=>this._$ET(t,this[t]))),this._$EM()}updated(t){}firstUpdated(t){}};K.elementStyles=[],K.shadowRootOptions={mode:"open"},K[F("elementProperties")]=new Map,K[F("finalized")]=new Map,W?.({ReactiveElement:K}),(H.reactiveElementVersions??=[]).push("2.1.0");
+ */,{is:z,defineProperty:L,getOwnPropertyDescriptor:B,getOwnPropertyNames:H,getOwnPropertySymbols:I,getPrototypeOf:q}=Object,F=globalThis,V=F.trustedTypes,W=V?V.emptyScript:"",G=F.reactiveElementPolyfillSupport,J=(t,e)=>t,K={toAttribute(t,e){switch(e){case Boolean:t=t?W:null;break;case Object:case Array:t=null==t?t:JSON.stringify(t)}return t},fromAttribute(t,e){let i=t;switch(e){case Boolean:i=null!==t;break;case Number:i=null===t?null:Number(t);break;case Object:case Array:try{i=JSON.parse(t)}catch(t){i=null}}return i}},X=(t,e)=>!z(t,e),Z={attribute:!0,type:String,converter:K,reflect:!1,useDefault:!1,hasChanged:X};Symbol.metadata??=Symbol("metadata"),F.litPropertyMetadata??=new WeakMap;let Y=class extends HTMLElement{static addInitializer(t){this._$Ei(),(this.l??=[]).push(t)}static get observedAttributes(){return this.finalize(),this._$Eh&&[...this._$Eh.keys()]}static createProperty(t,e=Z){if(e.state&&(e.attribute=!1),this._$Ei(),this.prototype.hasOwnProperty(t)&&((e=Object.create(e)).wrapped=!0),this.elementProperties.set(t,e),!e.noAccessor){const i=Symbol(),n=this.getPropertyDescriptor(t,i,e);void 0!==n&&L(this.prototype,t,n)}}static getPropertyDescriptor(t,e,i){const{get:n,set:s}=B(this.prototype,t)??{get(){return this[e]},set(t){this[e]=t}};return{get:n,set(e){const o=n?.call(this);s?.call(this,e),this.requestUpdate(t,o,i)},configurable:!0,enumerable:!0}}static getPropertyOptions(t){return this.elementProperties.get(t)??Z}static _$Ei(){if(this.hasOwnProperty(J("elementProperties")))return;const t=q(this);t.finalize(),void 0!==t.l&&(this.l=[...t.l]),this.elementProperties=new Map(t.elementProperties)}static finalize(){if(this.hasOwnProperty(J("finalized")))return;if(this.finalized=!0,this._$Ei(),this.hasOwnProperty(J("properties"))){const t=this.properties,e=[...H(t),...I(t)];for(const i of e)this.createProperty(i,t[i])}const t=this[Symbol.metadata];if(null!==t){const e=litPropertyMetadata.get(t);if(void 0!==e)for(const[t,i]of e)this.elementProperties.set(t,i)}this._$Eh=new Map;for(const[t,e]of this.elementProperties){const i=this._$Eu(t,e);void 0!==i&&this._$Eh.set(i,t)}this.elementStyles=this.finalizeStyles(this.styles)}static finalizeStyles(t){const e=[];if(Array.isArray(t)){const i=new Set(t.flat(1/0).reverse());for(const t of i)e.unshift(D(t))}else void 0!==t&&e.push(D(t));return e}static _$Eu(t,e){const i=e.attribute;return!1===i?void 0:"string"==typeof i?i:"string"==typeof t?t.toLowerCase():void 0}constructor(){super(),this._$Ep=void 0,this.isUpdatePending=!1,this.hasUpdated=!1,this._$Em=null,this._$Ev()}_$Ev(){this._$ES=new Promise((t=>this.enableUpdating=t)),this._$AL=new Map,this._$E_(),this.requestUpdate(),this.constructor.l?.forEach((t=>t(this)))}addController(t){(this._$EO??=new Set).add(t),void 0!==this.renderRoot&&this.isConnected&&t.hostConnected?.()}removeController(t){this._$EO?.delete(t)}_$E_(){const t=new Map,e=this.constructor.elementProperties;for(const i of e.keys())this.hasOwnProperty(i)&&(t.set(i,this[i]),delete this[i]);t.size>0&&(this._$Ep=t)}createRenderRoot(){const t=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return((t,e)=>{if(R)t.adoptedStyleSheets=e.map((t=>t instanceof CSSStyleSheet?t:t.styleSheet));else for(const i of e){const e=document.createElement("style"),n=P.litNonce;void 0!==n&&e.setAttribute("nonce",n),e.textContent=i.cssText,t.appendChild(e)}})(t,this.constructor.elementStyles),t}connectedCallback(){this.renderRoot??=this.createRenderRoot(),this.enableUpdating(!0),this._$EO?.forEach((t=>t.hostConnected?.()))}enableUpdating(t){}disconnectedCallback(){this._$EO?.forEach((t=>t.hostDisconnected?.()))}attributeChangedCallback(t,e,i){this._$AK(t,i)}_$ET(t,e){const i=this.constructor.elementProperties.get(t),n=this.constructor._$Eu(t,i);if(void 0!==n&&!0===i.reflect){const s=(void 0!==i.converter?.toAttribute?i.converter:K).toAttribute(e,i.type);this._$Em=t,null==s?this.removeAttribute(n):this.setAttribute(n,s),this._$Em=null}}_$AK(t,e){const i=this.constructor,n=i._$Eh.get(t);if(void 0!==n&&this._$Em!==n){const t=i.getPropertyOptions(n),s="function"==typeof t.converter?{fromAttribute:t.converter}:void 0!==t.converter?.fromAttribute?t.converter:K;this._$Em=n,this[n]=s.fromAttribute(e,t.type)??this._$Ej?.get(n)??null,this._$Em=null}}requestUpdate(t,e,i){if(void 0!==t){const n=this.constructor,s=this[t];if(i??=n.getPropertyOptions(t),!((i.hasChanged??X)(s,e)||i.useDefault&&i.reflect&&s===this._$Ej?.get(t)&&!this.hasAttribute(n._$Eu(t,i))))return;this.C(t,e,i)}!1===this.isUpdatePending&&(this._$ES=this._$EP())}C(t,e,{useDefault:i,reflect:n,wrapped:s},o){i&&!(this._$Ej??=new Map).has(t)&&(this._$Ej.set(t,o??e??this[t]),!0!==s||void 0!==o)||(this._$AL.has(t)||(this.hasUpdated||i||(e=void 0),this._$AL.set(t,e)),!0===n&&this._$Em!==t&&(this._$Eq??=new Set).add(t))}async _$EP(){this.isUpdatePending=!0;try{await this._$ES}catch(t){Promise.reject(t)}const t=this.scheduleUpdate();return null!=t&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??=this.createRenderRoot(),this._$Ep){for(const[t,e]of this._$Ep)this[t]=e;this._$Ep=void 0}const t=this.constructor.elementProperties;if(t.size>0)for(const[e,i]of t){const{wrapped:t}=i,n=this[e];!0!==t||this._$AL.has(e)||void 0===n||this.C(e,void 0,i,n)}}let t=!1;const e=this._$AL;try{t=this.shouldUpdate(e),t?(this.willUpdate(e),this._$EO?.forEach((t=>t.hostUpdate?.())),this.update(e)):this._$EM()}catch(e){throw t=!1,this._$EM(),e}t&&this._$AE(e)}willUpdate(t){}_$AE(t){this._$EO?.forEach((t=>t.hostUpdated?.())),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(t)),this.updated(t)}_$EM(){this._$AL=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$ES}shouldUpdate(t){return!0}update(t){this._$Eq&&=this._$Eq.forEach((t=>this._$ET(t,this[t]))),this._$EM()}updated(t){}firstUpdated(t){}};Y.elementStyles=[],Y.shadowRootOptions={mode:"open"},Y[J("elementProperties")]=new Map,Y[J("finalized")]=new Map,G?.({ReactiveElement:Y}),(F.reactiveElementVersions??=[]).push("2.1.0");
 /**
  * @license
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const X=globalThis,Z=X.trustedTypes,Y=Z?Z.createPolicy("lit-html",{createHTML:t=>t}):void 0,Q="$lit$",tt=`lit$${Math.random().toFixed(9).slice(2)}$`,it="?"+tt,st=`<${it}>`,et=document,nt=()=>et.createComment(""),ot=t=>null===t||"object"!=typeof t&&"function"!=typeof t,rt=Array.isArray,ht="[ \t\n\f\r]",ct=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,lt=/-->/g,at=/>/g,ut=RegExp(`>|${ht}(?:([^\\s"'>=/]+)(${ht}*=${ht}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`,"g"),dt=/'/g,pt=/"/g,ft=/^(?:script|style|textarea|title)$/i,yt=t=>(i,...s)=>({_$litType$:t,strings:i,values:s}),vt=yt(1),bt=yt(2),mt=Symbol.for("lit-noChange"),gt=Symbol.for("lit-nothing"),wt=new WeakMap,$t=et.createTreeWalker(et,129);function St(t,i){if(!rt(t)||!t.hasOwnProperty("raw"))throw Error("invalid template strings array");return void 0!==Y?Y.createHTML(i):i}const At=(t,i)=>{const s=t.length-1,e=[];let n,o=2===i?"<svg>":3===i?"<math>":"",r=ct;for(let i=0;i<s;i++){const s=t[i];let h,c,l=-1,a=0;for(;a<s.length&&(r.lastIndex=a,c=r.exec(s),null!==c);)a=r.lastIndex,r===ct?"!--"===c[1]?r=lt:void 0!==c[1]?r=at:void 0!==c[2]?(ft.test(c[2])&&(n=RegExp("</"+c[2],"g")),r=ut):void 0!==c[3]&&(r=ut):r===ut?">"===c[0]?(r=n??ct,l=-1):void 0===c[1]?l=-2:(l=r.lastIndex-c[2].length,h=c[1],r=void 0===c[3]?ut:'"'===c[3]?pt:dt):r===pt||r===dt?r=ut:r===lt||r===at?r=ct:(r=ut,n=void 0);const u=r===ut&&t[i+1].startsWith("/>")?" ":"";o+=r===ct?s+st:l>=0?(e.push(h),s.slice(0,l)+Q+s.slice(l)+tt+u):s+tt+(-2===l?i:u)}return[St(t,o+(t[s]||"<?>")+(2===i?"</svg>":3===i?"</math>":"")),e]};class jt{constructor({strings:t,_$litType$:i},s){let e;this.parts=[];let n=0,o=0;const r=t.length-1,h=this.parts,[c,l]=At(t,i);if(this.el=jt.createElement(c,s),$t.currentNode=this.el.content,2===i||3===i){const t=this.el.content.firstChild;t.replaceWith(...t.childNodes)}for(;null!==(e=$t.nextNode())&&h.length<r;){if(1===e.nodeType){if(e.hasAttributes())for(const t of e.getAttributeNames())if(t.endsWith(Q)){const i=l[o++],s=e.getAttribute(t).split(tt),r=/([.?@])?(.*)/.exec(i);h.push({type:1,index:n,name:r[2],strings:s,ctor:"."===r[1]?Ct:"?"===r[1]?Et:"@"===r[1]?Mt:kt}),e.removeAttribute(t)}else t.startsWith(tt)&&(h.push({type:6,index:n}),e.removeAttribute(t));if(ft.test(e.tagName)){const t=e.textContent.split(tt),i=t.length-1;if(i>0){e.textContent=Z?Z.emptyScript:"";for(let s=0;s<i;s++)e.append(t[s],nt()),$t.nextNode(),h.push({type:2,index:++n});e.append(t[i],nt())}}}else if(8===e.nodeType)if(e.data===it)h.push({type:2,index:n});else{let t=-1;for(;-1!==(t=e.data.indexOf(tt,t+1));)h.push({type:7,index:n}),t+=tt.length-1}n++}}static createElement(t,i){const s=et.createElement("template");return s.innerHTML=t,s}}function xt(t,i,s=t,e){if(i===mt)return i;let n=void 0!==e?s._$Co?.[e]:s._$Cl;const o=ot(i)?void 0:i._$litDirective$;return n?.constructor!==o&&(n?._$AO?.(!1),void 0===o?n=void 0:(n=new o(t),n._$AT(t,s,e)),void 0!==e?(s._$Co??=[])[e]=n:s._$Cl=n),void 0!==n&&(i=xt(t,n._$AS(t,i.values),n,e)),i}class Ot{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){const{el:{content:i},parts:s}=this._$AD,e=(t?.creationScope??et).importNode(i,!0);$t.currentNode=e;let n=$t.nextNode(),o=0,r=0,h=s[0];for(;void 0!==h;){if(o===h.index){let i;2===h.type?i=new _t(n,n.nextSibling,this,t):1===h.type?i=new h.ctor(n,h.name,h.strings,this,t):6===h.type&&(i=new Pt(n,this,t)),this._$AV.push(i),h=s[++r]}o!==h?.index&&(n=$t.nextNode(),o++)}return $t.currentNode=et,e}p(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 _t{get _$AU(){return this._$AM?._$AU??this._$Cv}constructor(t,i,s,e){this.type=2,this._$AH=gt,this._$AN=void 0,this._$AA=t,this._$AB=i,this._$AM=s,this.options=e,this._$Cv=e?.isConnected??!0}get parentNode(){let t=this._$AA.parentNode;const i=this._$AM;return void 0!==i&&11===t?.nodeType&&(t=i.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,i=this){t=xt(this,t,i),ot(t)?t===gt||null==t||""===t?(this._$AH!==gt&&this._$AR(),this._$AH=gt):t!==this._$AH&&t!==mt&&this._(t):void 0!==t._$litType$?this.$(t):void 0!==t.nodeType?this.T(t):(t=>rt(t)||"function"==typeof t?.[Symbol.iterator])(t)?this.k(t):this._(t)}O(t){return this._$AA.parentNode.insertBefore(t,this._$AB)}T(t){this._$AH!==t&&(this._$AR(),this._$AH=this.O(t))}_(t){this._$AH!==gt&&ot(this._$AH)?this._$AA.nextSibling.data=t:this.T(et.createTextNode(t)),this._$AH=t}$(t){const{values:i,_$litType$:s}=t,e="number"==typeof s?this._$AC(t):(void 0===s.el&&(s.el=jt.createElement(St(s.h,s.h[0]),this.options)),s);if(this._$AH?._$AD===e)this._$AH.p(i);else{const t=new Ot(e,this),s=t.u(this.options);t.p(i),this.T(s),this._$AH=t}}_$AC(t){let i=wt.get(t.strings);return void 0===i&&wt.set(t.strings,i=new jt(t)),i}k(t){rt(this._$AH)||(this._$AH=[],this._$AR());const i=this._$AH;let s,e=0;for(const n of t)e===i.length?i.push(s=new _t(this.O(nt()),this.O(nt()),this,this.options)):s=i[e],s._$AI(n),e++;e<i.length&&(this._$AR(s&&s._$AB.nextSibling,e),i.length=e)}_$AR(t=this._$AA.nextSibling,i){for(this._$AP?.(!1,!0,i);t&&t!==this._$AB;){const i=t.nextSibling;t.remove(),t=i}}setConnected(t){void 0===this._$AM&&(this._$Cv=t,this._$AP?.(t))}}class kt{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(t,i,s,e,n){this.type=1,this._$AH=gt,this._$AN=void 0,this.element=t,this.name=i,this._$AM=e,this.options=n,s.length>2||""!==s[0]||""!==s[1]?(this._$AH=Array(s.length-1).fill(new String),this.strings=s):this._$AH=gt}_$AI(t,i=this,s,e){const n=this.strings;let o=!1;if(void 0===n)t=xt(this,t,i,0),o=!ot(t)||t!==this._$AH&&t!==mt,o&&(this._$AH=t);else{const e=t;let r,h;for(t=n[0],r=0;r<n.length-1;r++)h=xt(this,e[s+r],i,r),h===mt&&(h=this._$AH[r]),o||=!ot(h)||h!==this._$AH[r],h===gt?t=gt:t!==gt&&(t+=(h??"")+n[r+1]),this._$AH[r]=h}o&&!e&&this.j(t)}j(t){t===gt?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,t??"")}}class Ct extends kt{constructor(){super(...arguments),this.type=3}j(t){this.element[this.name]=t===gt?void 0:t}}class Et extends kt{constructor(){super(...arguments),this.type=4}j(t){this.element.toggleAttribute(this.name,!!t&&t!==gt)}}class Mt extends kt{constructor(t,i,s,e,n){super(t,i,s,e,n),this.type=5}_$AI(t,i=this){if((t=xt(this,t,i,0)??gt)===mt)return;const s=this._$AH,e=t===gt&&s!==gt||t.capture!==s.capture||t.once!==s.once||t.passive!==s.passive,n=t!==gt&&(s===gt||e);e&&this.element.removeEventListener(this.name,this,s),n&&this.element.addEventListener(this.name,this,t),this._$AH=t}handleEvent(t){"function"==typeof this._$AH?this._$AH.call(this.options?.host??this.element,t):this._$AH.handleEvent(t)}}class Pt{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){xt(this,t)}}const Tt=X.litHtmlPolyfillSupport;Tt?.(jt,_t),(X.litHtmlVersions??=[]).push("3.3.0");const Ut=(t,i,s)=>{const e=s?.renderBefore??i;let n=e._$litPart$;if(void 0===n){const t=s?.renderBefore??null;e._$litPart$=n=new _t(i.insertBefore(nt(),t),t,void 0,s??{})}return n._$AI(t),n
+const Q=globalThis,tt=Q.trustedTypes,et=tt?tt.createPolicy("lit-html",{createHTML:t=>t}):void 0,it="$lit$",nt=`lit$${Math.random().toFixed(9).slice(2)}$`,st="?"+nt,ot=`<${st}>`,rt=document,ct=()=>rt.createComment(""),ht=t=>null===t||"object"!=typeof t&&"function"!=typeof t,lt=Array.isArray,at="[ \t\n\f\r]",ut=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,dt=/-->/g,pt=/>/g,ft=RegExp(`>|${at}(?:([^\\s"'>=/]+)(${at}*=${at}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`,"g"),yt=/'/g,vt=/"/g,mt=/^(?:script|style|textarea|title)$/i,bt=t=>(e,...i)=>({_$litType$:t,strings:e,values:i}),gt=bt(1),wt=bt(2),$t=Symbol.for("lit-noChange"),jt=Symbol.for("lit-nothing"),At=new WeakMap,St=rt.createTreeWalker(rt,129);function Ot(t,e){if(!lt(t)||!t.hasOwnProperty("raw"))throw Error("invalid template strings array");return void 0!==et?et.createHTML(e):e}const _t=(t,e)=>{const i=t.length-1,n=[];let s,o=2===e?"<svg>":3===e?"<math>":"",r=ut;for(let e=0;e<i;e++){const i=t[e];let c,h,l=-1,a=0;for(;a<i.length&&(r.lastIndex=a,h=r.exec(i),null!==h);)a=r.lastIndex,r===ut?"!--"===h[1]?r=dt:void 0!==h[1]?r=pt:void 0!==h[2]?(mt.test(h[2])&&(s=RegExp("</"+h[2],"g")),r=ft):void 0!==h[3]&&(r=ft):r===ft?">"===h[0]?(r=s??ut,l=-1):void 0===h[1]?l=-2:(l=r.lastIndex-h[2].length,c=h[1],r=void 0===h[3]?ft:'"'===h[3]?vt:yt):r===vt||r===yt?r=ft:r===dt||r===pt?r=ut:(r=ft,s=void 0);const u=r===ft&&t[e+1].startsWith("/>")?" ":"";o+=r===ut?i+ot:l>=0?(n.push(c),i.slice(0,l)+it+i.slice(l)+nt+u):i+nt+(-2===l?e:u)}return[Ot(t,o+(t[i]||"<?>")+(2===e?"</svg>":3===e?"</math>":"")),n]};class xt{constructor({strings:t,_$litType$:e},i){let n;this.parts=[];let s=0,o=0;const r=t.length-1,c=this.parts,[h,l]=_t(t,e);if(this.el=xt.createElement(h,i),St.currentNode=this.el.content,2===e||3===e){const t=this.el.content.firstChild;t.replaceWith(...t.childNodes)}for(;null!==(n=St.nextNode())&&c.length<r;){if(1===n.nodeType){if(n.hasAttributes())for(const t of n.getAttributeNames())if(t.endsWith(it)){const e=l[o++],i=n.getAttribute(t).split(nt),r=/([.?@])?(.*)/.exec(e);c.push({type:1,index:s,name:r[2],strings:i,ctor:"."===r[1]?Pt:"?"===r[1]?Rt:"@"===r[1]?Tt:Mt}),n.removeAttribute(t)}else t.startsWith(nt)&&(c.push({type:6,index:s}),n.removeAttribute(t));if(mt.test(n.tagName)){const t=n.textContent.split(nt),e=t.length-1;if(e>0){n.textContent=tt?tt.emptyScript:"";for(let i=0;i<e;i++)n.append(t[i],ct()),St.nextNode(),c.push({type:2,index:++s});n.append(t[e],ct())}}}else if(8===n.nodeType)if(n.data===st)c.push({type:2,index:s});else{let t=-1;for(;-1!==(t=n.data.indexOf(nt,t+1));)c.push({type:7,index:s}),t+=nt.length-1}s++}}static createElement(t,e){const i=rt.createElement("template");return i.innerHTML=t,i}}function Et(t,e,i=t,n){if(e===$t)return e;let s=void 0!==n?i._$Co?.[n]:i._$Cl;const o=ht(e)?void 0:e._$litDirective$;return s?.constructor!==o&&(s?._$AO?.(!1),void 0===o?s=void 0:(s=new o(t),s._$AT(t,i,n)),void 0!==n?(i._$Co??=[])[n]=s:i._$Cl=s),void 0!==s&&(e=Et(t,s._$AS(t,e.values),s,n)),e}class kt{constructor(t,e){this._$AV=[],this._$AN=void 0,this._$AD=t,this._$AM=e}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(t){const{el:{content:e},parts:i}=this._$AD,n=(t?.creationScope??rt).importNode(e,!0);St.currentNode=n;let s=St.nextNode(),o=0,r=0,c=i[0];for(;void 0!==c;){if(o===c.index){let e;2===c.type?e=new Ct(s,s.nextSibling,this,t):1===c.type?e=new c.ctor(s,c.name,c.strings,this,t):6===c.type&&(e=new Ut(s,this,t)),this._$AV.push(e),c=i[++r]}o!==c?.index&&(s=St.nextNode(),o++)}return St.currentNode=rt,n}p(t){let e=0;for(const i of this._$AV)void 0!==i&&(void 0!==i.strings?(i._$AI(t,i,e),e+=i.strings.length-2):i._$AI(t[e])),e++}}class Ct{get _$AU(){return this._$AM?._$AU??this._$Cv}constructor(t,e,i,n){this.type=2,this._$AH=jt,this._$AN=void 0,this._$AA=t,this._$AB=e,this._$AM=i,this.options=n,this._$Cv=n?.isConnected??!0}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=Et(this,t,e),ht(t)?t===jt||null==t||""===t?(this._$AH!==jt&&this._$AR(),this._$AH=jt):t!==this._$AH&&t!==$t&&this._(t):void 0!==t._$litType$?this.$(t):void 0!==t.nodeType?this.T(t):(t=>lt(t)||"function"==typeof t?.[Symbol.iterator])(t)?this.k(t):this._(t)}O(t){return this._$AA.parentNode.insertBefore(t,this._$AB)}T(t){this._$AH!==t&&(this._$AR(),this._$AH=this.O(t))}_(t){this._$AH!==jt&&ht(this._$AH)?this._$AA.nextSibling.data=t:this.T(rt.createTextNode(t)),this._$AH=t}$(t){const{values:e,_$litType$:i}=t,n="number"==typeof i?this._$AC(t):(void 0===i.el&&(i.el=xt.createElement(Ot(i.h,i.h[0]),this.options)),i);if(this._$AH?._$AD===n)this._$AH.p(e);else{const t=new kt(n,this),i=t.u(this.options);t.p(e),this.T(i),this._$AH=t}}_$AC(t){let e=At.get(t.strings);return void 0===e&&At.set(t.strings,e=new xt(t)),e}k(t){lt(this._$AH)||(this._$AH=[],this._$AR());const e=this._$AH;let i,n=0;for(const s of t)n===e.length?e.push(i=new Ct(this.O(ct()),this.O(ct()),this,this.options)):i=e[n],i._$AI(s),n++;n<e.length&&(this._$AR(i&&i._$AB.nextSibling,n),e.length=n)}_$AR(t=this._$AA.nextSibling,e){for(this._$AP?.(!1,!0,e);t&&t!==this._$AB;){const e=t.nextSibling;t.remove(),t=e}}setConnected(t){void 0===this._$AM&&(this._$Cv=t,this._$AP?.(t))}}class Mt{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(t,e,i,n,s){this.type=1,this._$AH=jt,this._$AN=void 0,this.element=t,this.name=e,this._$AM=n,this.options=s,i.length>2||""!==i[0]||""!==i[1]?(this._$AH=Array(i.length-1).fill(new String),this.strings=i):this._$AH=jt}_$AI(t,e=this,i,n){const s=this.strings;let o=!1;if(void 0===s)t=Et(this,t,e,0),o=!ht(t)||t!==this._$AH&&t!==$t,o&&(this._$AH=t);else{const n=t;let r,c;for(t=s[0],r=0;r<s.length-1;r++)c=Et(this,n[i+r],e,r),c===$t&&(c=this._$AH[r]),o||=!ht(c)||c!==this._$AH[r],c===jt?t=jt:t!==jt&&(t+=(c??"")+s[r+1]),this._$AH[r]=c}o&&!n&&this.j(t)}j(t){t===jt?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,t??"")}}class Pt extends Mt{constructor(){super(...arguments),this.type=3}j(t){this.element[this.name]=t===jt?void 0:t}}class Rt extends Mt{constructor(){super(...arguments),this.type=4}j(t){this.element.toggleAttribute(this.name,!!t&&t!==jt)}}class Tt extends Mt{constructor(t,e,i,n,s){super(t,e,i,n,s),this.type=5}_$AI(t,e=this){if((t=Et(this,t,e,0)??jt)===$t)return;const i=this._$AH,n=t===jt&&i!==jt||t.capture!==i.capture||t.once!==i.once||t.passive!==i.passive,s=t!==jt&&(i===jt||n);n&&this.element.removeEventListener(this.name,this,i),s&&this.element.addEventListener(this.name,this,t),this._$AH=t}handleEvent(t){"function"==typeof this._$AH?this._$AH.call(this.options?.host??this.element,t):this._$AH.handleEvent(t)}}class Ut{constructor(t,e,i){this.element=t,this.type=6,this._$AN=void 0,this._$AM=e,this.options=i}get _$AU(){return this._$AM._$AU}_$AI(t){Et(this,t)}}const Nt=Q.litHtmlPolyfillSupport;Nt?.(xt,Ct),(Q.litHtmlVersions??=[]).push("3.3.0");const Dt=(t,e,i)=>{const n=i?.renderBefore??e;let s=n._$litPart$;if(void 0===s){const t=i?.renderBefore??null;n._$litPart$=s=new Ct(e.insertBefore(ct(),t),t,void 0,i??{})}return s._$AI(t),s
 /**
  * @license
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
- */},Nt=globalThis;let Rt=class extends K{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0}createRenderRoot(){const t=super.createRenderRoot();return this.renderOptions.renderBefore??=t.firstChild,t}update(t){const i=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this._$Do=Ut(i,this.renderRoot,this.renderOptions)}connectedCallback(){super.connectedCallback(),this._$Do?.setConnected(!0)}disconnectedCallback(){super.disconnectedCallback(),this._$Do?.setConnected(!1)}render(){return mt}};Rt._$litElement$=!0,Rt.finalized=!0,Nt.litElementHydrateSupport?.({LitElement:Rt});const zt=Nt.litElementPolyfillSupport;zt?.({LitElement:Rt}),(Nt.litElementVersions??=[]).push("4.2.0");
+ */},zt=globalThis;let Lt=class extends Y{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0}createRenderRoot(){const t=super.createRenderRoot();return this.renderOptions.renderBefore??=t.firstChild,t}update(t){const e=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this._$Do=Dt(e,this.renderRoot,this.renderOptions)}connectedCallback(){super.connectedCallback(),this._$Do?.setConnected(!0)}disconnectedCallback(){super.disconnectedCallback(),this._$Do?.setConnected(!1)}render(){return $t}};Lt._$litElement$=!0,Lt.finalized=!0,zt.litElementHydrateSupport?.({LitElement:Lt});const Bt=zt.litElementPolyfillSupport;Bt?.({LitElement:Lt}),(zt.litElementVersions??=[]).push("4.2.0");
 /**
  * @license
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const Dt=2,Lt=5,Bt=t=>(...i)=>({_$litDirective$:t,values:i});class Ht{constructor(t){}get _$AU(){return this._$AM._$AU}_$AT(t,i,s){this._$Ct=t,this._$AM=i,this._$Ci=s}_$AS(t,i){return this.update(t,i)}update(t,i){return this.render(...i)}}
+const Ht=2,It=5,qt=t=>(...e)=>({_$litDirective$:t,values:e});class Ft{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 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
- */class qt extends Ht{constructor(t){if(super(t),this.it=gt,t.type!==Dt)throw Error(this.constructor.directiveName+"() can only be used in child bindings")}render(t){if(t===gt||null==t)return this._t=void 0,this.it=t;if(t===mt)return t;if("string"!=typeof t)throw Error(this.constructor.directiveName+"() called with a non-string value");if(t===this.it)return this._t;this.it=t;const i=[t];return i.raw=i,this._t={_$litType$:this.constructor.resultType,strings:i,values:[]}}}qt.directiveName="unsafeHTML",qt.resultType=1;const It=Bt(qt);const Wt=Bt(class extends Ht{constructor(t){if(super(t),t.type!==Lt)throw new Error("run() can only be used in event handlers")}update(t,i){const s=t.element,n=t.name,[o,...r]=i,h=()=>{let t=s,i=t._component;for(;!i&&t;)t=t.parentElement,i=t&&t._component;return console.assert(!!i,"Component not found."),i};return"string"==typeof o?s[`on${n}`]=t=>{const i=h();i?i.run(o,...r,t):e.run(o,...r,t)}:"function"==typeof o&&(s[`on${n}`]=t=>h().setState(o(h().state,...r,t))),this.render()}render(){return mt}});e.createElement=a,e.render=function(t,i,s){i&&("string"==typeof i?(t._$litPart$||t.replaceChildren(),Ut(vt`${It(i)}`,t)):i._$litType$?(t._$litPart$||t.replaceChildren(),Ut(i,t)):(d(t,i,s),t._$litPart$=void 0))},e.Fragment=h,"object"==typeof window&&(window.React=window._React||e,window.html=vt,window.svg=bt,window.run=Wt);const Ft=(t,i,s,e)=>{if(!i||!s)return;const n=t=>{var s,e;const n=i.cloneNode();null===(s=i.parentNode)||void 0===s||s.replaceChild(n,i);const o=null===(e=(i=n).contentWindow)||void 0===e?void 0:e.document;o&&(o.open(),t.indexOf("<html")>=0?o.write(t):o.write((t=>`<!DOCTYPE html>\n<html lang="en">\n<head>\n  <meta charset="UTF-8">\n  <meta name="viewport" content="width=device-width, initial-scale=1.0">\n  <meta http-equiv="X-UA-Compatible" content="ie=edge">\n  <script src="https://cdnjs.cloudflare.com/ajax/libs/custom-elements/1.1.2/custom-elements.min.js"><\/script>\n  <title>AppRun Playground</title>\n  <style>\n    body {\n      font-family: "Benton Sans", "Helvetica Neue", helvetica, arial, sans-serif;\n      margin: 2em;\n    }\n  </style>\n  <script src="https://unpkg.com/@babel/standalone/babel.min.js"><\/script>\n  <script src="https://unpkg.com/apprun/dist/apprun-html.js"><\/script>\n</head>\n<body>\n<script>\n  Babel.registerPlugin("d", [Babel.availablePlugins["proposal-decorators"], {legacy: true}]);\n  Babel.registerPlugin("c", [Babel.availablePlugins["proposal-class-properties"], {loose: true}]);\n  Babel.registerPlugin("b", [Babel.availablePlugins["proposal-private-methods"], {loose: true}]);\n<\/script>\n<script type="text/babel" data-plugins="d, c, b">\n  ${t}\n<\/script>\n</body>\n</html>`)(t)),o.close())};n(s),!e&&t&&"TEXTAREA"===t.nodeName&&("undefined"==typeof CodeMirror?t.onkeyup=()=>n(t.value):t.editor||(t.editor=CodeMirror.fromTextArea(t,{lineNumbers:!0,mode:"jsx"}),t.editor.on("change",(t=>n(t.getValue())))))};e.webComponent("apprun-play",class extends x{constructor(){super(...arguments),this.view=t=>{const i=t["code-element"],s=this.element;let e,n;return e=i?document.querySelector(i):s.previousElementSibling||s.parentElement.previousElementSibling,n=(null==e?void 0:e.innerText)||(null==e?void 0:e.value)||t.code,this.state.code_area=e,this.state.code=n,n?`<div class="toolbox">\n        ${!t.hide_button&&'<a class="button" onclick="app.run("@show-popup")" >Try the Code</a>'}\n      </div>`:"<div>AppRun Play cannot find code to run, please set code-element selector.</div>"},this.rendered=({style:t,hide_src:i,code_area:s,code:e})=>{if(!e)return;if(!document.getElementById("play-popup")){document.body.insertAdjacentHTML("beforeend",'<div id="play-popup" class="overlay">\n<style id="apprun-play-style">\n.apprun-play .col {\n  height: 100%;\n  flex: 1;\n}\n.apprun-preview {\n  width: 100%\n}\n.apprun-play .editor, .apprun-play .preview {\n  display: inline-block;\n  width: calc(100% - 20px);\n  height: calc(100% - 10px);\n}\n\na.button {\n  font-size: .8em;\n  padding: 10px;\n  cursor: pointer;\n  color: var(--md-primary-bg-color);\n  background: var(--md-primary-fg-color)\n}\na.button:hover {\n  color: var(--md-primary-fg-color);\n  background: var(--md-primary-bg-color)\n}\n\n.overlay {\n  position: fixed;\n  top: 0;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  background: rgba(0, 0, 0, 0.7);\n  visibility: hidden;\n  opacity: 0;\n  z-index: 999;\n}\n.overlay.show {\n  visibility: visible;\n  opacity: 1;\n}\n\n.popup {\n  margin: 80px auto;\n  padding: 20px;\n  background: #fff;\n  border-radius: 3px;\n  position: relative;\n  width: 90%;\n  height: calc(100% - 150px);\n}\n\n.popup .close {\n  position: absolute;\n  top: 10px;\n  right: 20px;\n  font-size: 20px;\n  font-weight: bold;\n  text-decoration: none;\n  color: #333;\n}\n.popup .close:hover {\n  color: #06D85F;\n}\n.popup .content {\n  height: 100%;\n  overflow: hidden;\n  display: flex;\n}\n\n.cm-s-default {\n  height: 100%;\n  font-size: small;\n  line-height: 1.5em;\n  z-index: 0;\n}\n</style>\n\n\t<div class="popup apprun-play">\n\t\t<a class="close" href="javascript:app.run(\'@close-popup\')">&times;</a>\n\t\t<div class="content">\n\t\t\t<div class="col">\n        <textarea class="editor"></textarea>\n      </div>\n      <div class="col">\n      <iframe class="preview"/>\n      </div>\n    </div>\n\t</div>\n</div>');const t=document.querySelector(".apprun-play .editor"),i=document.querySelector(".apprun-play .preview");t.value=e,Ft(t,i,e,!1)}const n=document.createElement("iframe");n.classList.add("apprun-preview"),n.style.cssText=t,this.element.before(n),i&&(s.style.display="none"),Ft(s,n,e,i)},this.update={"@show-popup":({code:t})=>{var i;null===(i=document.querySelector(".apprun-play .editor").editor)||void 0===i||i.setValue(t),document.getElementById("play-popup").classList.add("show")},"@close-popup":()=>{document.getElementById("play-popup").classList.remove("show")}}}});
+ */class Vt extends Ft{constructor(t){if(super(t),this.it=jt,t.type!==Ht)throw Error(this.constructor.directiveName+"() can only be used in child bindings")}render(t){if(t===jt||null==t)return this._t=void 0,this.it=t;if(t===$t)return t;if("string"!=typeof t)throw Error(this.constructor.directiveName+"() called with a non-string value");if(t===this.it)return this._t;this.it=t;const e=[t];return e.raw=e,this._t={_$litType$:this.constructor.resultType,strings:e,values:[]}}}Vt.directiveName="unsafeHTML",Vt.resultType=1;const Wt=qt(Vt);const Gt=qt(class extends Ft{constructor(t){if(super(t),t.type!==It)throw new Error("run() can only be used in event handlers")}update(t,e){const i=t.element,n=t.name,[s,...o]=e,c=()=>{let t=i,e=t._component;for(;!e&&t;)t=t.parentElement,e=t&&t._component;return console.assert(!!e,"Component not found."),e};return"string"==typeof s?i[`on${n}`]=t=>{const e=c();e?e.run(s,...o,t):r.run(s,...o,t)}:"function"==typeof s&&(i[`on${n}`]=t=>c().setState(s(c().state,...o,t))),this.render()}render(){return $t}});if(r.createElement=f,r.render=function(t,e,i){e&&("string"==typeof e?(t._$litPart$||t.replaceChildren(),Dt(gt`${Wt(e)}`,t)):e._$litType$?(t._$litPart$||t.replaceChildren(),Dt(e,t)):(y(t,e,i),t._$litPart$=void 0))},r.Fragment=u,"object"==typeof window){const t=window;Jt=t,Kt={React:t._React||r,html:gt,svg:wt,run:Gt},"object"==typeof Jt&&null!==Jt&&Object.keys(Kt).forEach((t=>{Jt[t]=Kt[t]}))}var Jt,Kt;const Xt=(t,e,i,n)=>{if(!e||!i)return;const s=t=>{var i,n;const s=e.cloneNode();null===(i=e.parentNode)||void 0===i||i.replaceChild(s,e);const o=null===(n=(e=s).contentWindow)||void 0===n?void 0:n.document;o&&(o.open(),t.indexOf("<html")>=0?o.write(t):o.write((t=>`<!DOCTYPE html>\n<html lang="en">\n<head>\n  <meta charset="UTF-8">\n  <meta name="viewport" content="width=device-width, initial-scale=1.0">\n  <meta http-equiv="X-UA-Compatible" content="ie=edge">\n  <script src="https://cdnjs.cloudflare.com/ajax/libs/custom-elements/1.1.2/custom-elements.min.js"><\/script>\n  <title>AppRun Playground</title>\n  <style>\n    body {\n      font-family: "Benton Sans", "Helvetica Neue", helvetica, arial, sans-serif;\n      margin: 2em;\n    }\n  </style>\n  <script src="https://unpkg.com/@babel/standalone/babel.min.js"><\/script>\n  <script src="https://unpkg.com/apprun/dist/apprun-html.js"><\/script>\n</head>\n<body>\n<script>\n  Babel.registerPlugin("d", [Babel.availablePlugins["proposal-decorators"], {legacy: true}]);\n  Babel.registerPlugin("c", [Babel.availablePlugins["proposal-class-properties"], {loose: true}]);\n  Babel.registerPlugin("b", [Babel.availablePlugins["proposal-private-methods"], {loose: true}]);\n<\/script>\n<script type="text/babel" data-plugins="d, c, b">\n  ${t}\n<\/script>\n</body>\n</html>`)(t)),o.close())};s(i),!n&&t&&"TEXTAREA"===t.nodeName&&("undefined"==typeof CodeMirror?t.onkeyup=()=>s(t.value):t.editor||(t.editor=CodeMirror.fromTextArea(t,{lineNumbers:!0,mode:"jsx"}),t.editor.on("change",(t=>s(t.getValue())))))};r.webComponent("apprun-play",class extends E{constructor(){super(...arguments),this.view=t=>{const e=t["code-element"],i=this.element;let n,s;return n=e?document.querySelector(e):i.previousElementSibling||i.parentElement.previousElementSibling,s=(null==n?void 0:n.innerText)||(null==n?void 0:n.value)||t.code,this.state.code_area=n,this.state.code=s,s?`<div class="toolbox">\n        ${!t.hide_button&&'<a class="button" onclick="app.run("@show-popup")" >Try the Code</a>'}\n      </div>`:"<div>AppRun Play cannot find code to run, please set code-element selector.</div>"},this.rendered=({style:t,hide_src:e,code_area:i,code:n})=>{if(!n)return;if(!document.getElementById("play-popup")){document.body.insertAdjacentHTML("beforeend",'<div id="play-popup" class="overlay">\n<style id="apprun-play-style">\n.apprun-play .col {\n  height: 100%;\n  flex: 1;\n}\n.apprun-preview {\n  width: 100%\n}\n.apprun-play .editor, .apprun-play .preview {\n  display: inline-block;\n  width: calc(100% - 20px);\n  height: calc(100% - 10px);\n}\n\na.button {\n  font-size: .8em;\n  padding: 10px;\n  cursor: pointer;\n  color: var(--md-primary-bg-color);\n  background: var(--md-primary-fg-color)\n}\na.button:hover {\n  color: var(--md-primary-fg-color);\n  background: var(--md-primary-bg-color)\n}\n\n.overlay {\n  position: fixed;\n  top: 0;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  background: rgba(0, 0, 0, 0.7);\n  visibility: hidden;\n  opacity: 0;\n  z-index: 999;\n}\n.overlay.show {\n  visibility: visible;\n  opacity: 1;\n}\n\n.popup {\n  margin: 80px auto;\n  padding: 20px;\n  background: #fff;\n  border-radius: 3px;\n  position: relative;\n  width: 90%;\n  height: calc(100% - 150px);\n}\n\n.popup .close {\n  position: absolute;\n  top: 10px;\n  right: 20px;\n  font-size: 20px;\n  font-weight: bold;\n  text-decoration: none;\n  color: #333;\n}\n.popup .close:hover {\n  color: #06D85F;\n}\n.popup .content {\n  height: 100%;\n  overflow: hidden;\n  display: flex;\n}\n\n.cm-s-default {\n  height: 100%;\n  font-size: small;\n  line-height: 1.5em;\n  z-index: 0;\n}\n</style>\n\n\t<div class="popup apprun-play">\n\t\t<a class="close" href="javascript:app.run(\'@close-popup\')">&times;</a>\n\t\t<div class="content">\n\t\t\t<div class="col">\n        <textarea class="editor"></textarea>\n      </div>\n      <div class="col">\n      <iframe class="preview"/>\n      </div>\n    </div>\n\t</div>\n</div>');const t=document.querySelector(".apprun-play .editor"),e=document.querySelector(".apprun-play .preview");t.value=n,Xt(t,e,n,!1)}const s=document.createElement("iframe");s.classList.add("apprun-preview"),s.style.cssText=t,this.element.before(s),e&&(i.style.display="none"),Xt(i,s,n,e)},this.update={"@show-popup":({code:t})=>{var e;null===(e=document.querySelector(".apprun-play .editor").editor)||void 0===e||e.setValue(t),document.getElementById("play-popup").classList.add("show")},"@close-popup":()=>{document.getElementById("play-popup").classList.remove("show")}}}});
 //# sourceMappingURL=apprun-play-html.esm.js.map