@codecabana/web-components
Version:
Web components designed to infiltrate no-code platforms via script tags
2 lines (1 loc) • 19.1 kB
JavaScript
!function(t){"function"==typeof define&&define.amd?define(t):t()}((function(){"use strict";function t(t,e){let n=t.length;if(n!==e.length)return!1;for(let r=0;r<n;r++)if(t[r]!==e[r])return!1;return!0}const e=t=>"function"==typeof t,n=t=>"object"==typeof t,{isArray:r}=Array;class o{constructor(t,e,n){this.message=e,this.target=t,this.value=n}}const i=null,a={true:1,"":1,1:1};function s(t,r,a,s,d){let{type:h,reflect:f,event:m,value:g,attr:y=u(r)}=n(a)&&a!=i?a:{type:a},v=!(h==Function||h==i);Object.defineProperty(t,r,{configurable:!0,set(t){let n=this[r],{error:i,value:a}=p(h,v&&e(t)?t(n):t);if(i&&null!=a)throw new o(this,`The value defined for prop '${r}' must be of type '${h.name}'`,a);n!=a&&(this.update({[r]:a}),m&&l(this,m),this.updated.then((()=>{f&&(this._ignoreAttr=y,c(this,h,y,this[r]),this._ignoreAttr=null)})))},get(){return this._props[r]}}),null!=g&&(d[r]=g),s[y]={prop:r,type:h}}const l=(t,{type:e,base:n=CustomEvent,...r})=>t.dispatchEvent(new n(e,r)),u=t=>t.replace(/([A-Z])/g,"-$1").toLowerCase(),c=(t,e,r,o)=>null==o||e==Boolean&&!o?t.removeAttribute(r):t.setAttribute(r,n(o)?JSON.stringify(o):e==Boolean?"":o),p=(t,e)=>t==i?{value:e}:t!=String&&""===e?{value:null}:{}.toString.call(e)==`[object ${t.name}]`?{value:e,error:t==Number&&Number.isNaN(e)}:{value:e,error:!0};let d,h;function f(t,e,n){return d.use(t,e,n)}const m={id:1,className:1,checked:1,value:1,selected:1},g={list:1,type:1,size:1,form:1,width:1,height:1,src:1,href:1,slot:1},y={shadowDom:1,renderOnce:1,children:1,key:1},v={},b=[],w=document;class x extends Text{get nodeType(){return-1}}const S=Symbol(),k=Symbol(),N=Symbol();function E(t,e,...n){let r=e||v,{children:o}=r;o=null!=o?o:n.length?n:b;const i=!!t&&(t instanceof Node?1:t.prototype instanceof HTMLElement&&2);return{$$:S,type:t,props:r,children:o,key:r.key,shadow:r.shadowDom,once:r.renderOnce,raw:i,is:r.is}}function M(t,e,n=k,o,i){let a;if(e&&e[n]&&e[n].vnode==t||t.$$!=S)return e;if(t||!e){if(i=i||"svg"==t.type,a="host"!=t.type&&(e&&e[N]||(1==t.raw?e!=t.type:2==t.raw?!(e instanceof t.type):e?e.localName!=t.type:!e)),t.ref){t.ref[N]=!0;const e=t.ref.cloneNode(!0);return e[n]={vnode:t},e[N]=!0,e}a&&null!=t.type&&(t.ref=e=1==t.raw?t.type:2==t.raw?new t.type:i?w.createElementNS("http://www.w3.org/2000/svg",t.type):w.createElement(t.type,t.is?{is:t.is}:void 0))}let{vnode:s=v,cycle:l=0,fragment:u,handlers:c}=e[n]?e[n]:v,{children:p=b,props:d=v}=s;if(c=a?{}:c||{},t.once&&!a)return e;if(t.shadow&&!e.shadowRoot&&e.attachShadow({mode:"open"}),t.props!=d&&function(t,e,n,r,o){for(let i in e)i in n||C(t,i,e[i],null,o,r);for(let i in n)C(t,i,e[i],n[i],o,r)}(e,d,t.props,c,i),t.children!==p){let a=t.shadow?e.shadowRoot:e;u=function(t,e,n,o,i,a){t=null==t?null:r(t)?t:[t];let s,l=e||function(t,e){const n=new x(""),r=new x("");return t[e?"prepend":"append"](n),t.append(r),{markStart:n,markEnd:r}}(n,i),{markStart:u,markEnd:c,keyes:p}=l,d=p&&new Set,h=u;function f(t){let{length:e}=t;for(let l=0;l<e;l++){let e=t[l],u=typeof e;if(null==e||"boolean"==u||"function"==u)continue;if(r(e)){f(e);continue}if("object"==u&&e.$$!=S)continue;let m=e.$$&&e.key,g=p&&null!=m&&p.get(m);h!=c&&h===g?d.delete(h):h=h==c?c:h.nextSibling;let y=p?g:h,v=y;if(e.$$)v=M(e,y,o,i,a);else{let t=e+"";3!=v.nodeType?v=new Text(t):v.data!=t&&(v.data=t)}v!=h&&(p&&d.delete(v),!y||p?(n.insertBefore(v,h),p&&h!=c&&d.add(h)):y==c?n.insertBefore(v,c):(n.replaceChild(v,y),h=v)),null!=m&&(s=s||new Map,s.set(m,v))}}if(t&&f(t),h=h==c?c:h.nextSibling,e&&h!=c)for(;h!=c;){let t=h;h=h.nextSibling,t.remove()}return d&&d.forEach((t=>t.remove())),l.keyes=s,l}(t.children,u,a,n,!l&&o,(!i||"foreignObject"!=t.type)&&i)}return l++,e[n]={vnode:t,handlers:c,fragment:u,cycle:l},e}function C(t,r,o,i,a,s){if(o=null==o?null:o,i=null==i?null:i,(r="class"!=r||a?r:"className")in t&&m[r]&&(o=t[r]),i!==o&&!y[r]&&"_"!=r[0])if("o"==r[0]&&"n"==r[1]&&(e(i)||e(o)))!function(t,e,n,r){r.handleEvent||(r.handleEvent=e=>r[e.type].call(t,e));if(n){if(!r[e]){let o=n.capture||n.once||n.passive?Object.assign({},n):null;t.addEventListener(e,r,o)}r[e]=n}else r[e]&&(t.removeEventListener(e,r),delete r[e])}(t,r.slice(2),i,s);else if("ref"==r)i&&(i.current=t);else if("style"==r){let e=t.style;i=i||"";let r=n(o=o||""),a=n(i);if(r)for(let t in o){if(!a)break;t in i||A(e,t,null)}if(a)for(let t in i){let n=i[t];r&&o[t]===n||A(e,t,n)}else e.cssText=i}else{let s="$"==r[0]?r.slice(1):r;s===r&&(!a&&!g[r]&&r in t||e(i)||e(o))?t[r]=null==i?"":i:null==i?t.removeAttribute(s):t.setAttribute(s,n(i)?JSON.stringify(i):i)}}function A(t,e,n){let r="setProperty";null==n&&(r="removeProperty",n=null),~e.indexOf("-")?t[r](e,n):t[e]=n}const D=!!document.adoptedStyleSheets,$=null;let T=(j=2,(n,r)=>{let o=([t,r],o)=>{if(!o)return[t||n(r),r];e(t)&&t()};f((([n,o]=[])=>(!o&&o||(o&&t(o,r)?n=n||!0:(e(n)&&n(),n=null)),[n,r])),1==j&&o,2==j&&o)});var j;function O(t){let n=d.update;return f(((r=[])=>(r[1]||(r[0]=e(t)?t():t,r[1]=t=>{(t=e(t)?t(r[0]):t)!=r[0]&&(r[0]=t,n())}),r)))}function B(t){return f(((e={current:t})=>e))}function I(e,n){return function(e,n){let[r]=f((([r,o,i=0]=[])=>((!o||o&&!t(o,n))&&(r=e(n)),[r,n,i])));return r}((()=>e),n)}var P=function(t,e,n,r){var o;e[0]=0;for(var i=1;i<e.length;i++){var a=e[i++],s=e[i]?(e[0]|=a?1:2,n[e[i++]]):e[++i];3===a?r[0]=s:4===a?r[1]=Object.assign(r[1]||{},s):5===a?(r[1]=r[1]||{})[e[++i]]=s:6===a?r[1][e[++i]]+=s+"":a?(o=t.apply(s,P(t,s,n,["",null])),r.push(o),s[0]?e[0]|=2:(e[i-2]=0,e[i]=o)):r.push(s)}return r},_=new Map;(function(t){var e=_.get(this);return e||(e=new Map,_.set(this,e)),(e=P(this,e.get(t)||(e.set(t,e=function(t){for(var e,n,r=1,o="",i="",a=[0],s=function(t){1===r&&(t||(o=o.replace(/^\s*\n\s*|\s*\n\s*$/g,"")))?a.push(0,t,o):3===r&&(t||o)?(a.push(3,t,o),r=2):2===r&&"..."===o&&t?a.push(4,t,0):2===r&&o&&!t?a.push(5,0,!0,o):r>=5&&((o||!t&&5===r)&&(a.push(r,0,o,n),r=6),t&&(a.push(r,t,0,n),r=6)),o=""},l=0;l<t.length;l++){l&&(1===r&&s(),s(l));for(var u=0;u<t[l].length;u++)e=t[l][u],1===r?"<"===e?(s(),a=[a],r=3):o+=e:4===r?"--"===o&&">"===e?(r=1,o=""):o=e+o[0]:i?e===i?i="":o+=e:'"'===e||"'"===e?i=e:">"===e?(s(),r=1):r&&("="===e?(r=5,n=o,o=""):"/"===e&&(r<5||">"===t[l][u+1])?(s(),3===r&&(a=a[0]),r=a,(a=a[0]).push(2,0,r),r=0):" "===e||"\t"===e||"\n"===e||"\r"===e?(s(),r=2):o+=e),3===r&&"!--"===o&&(r=4,a=a[0])}return s(),a}(t)),e),arguments,[])).length>1?e:e[0]}).bind(E);const L="";function z(t){let e,n,r,o,i=this,a=0,s=[],l=0,u=[],c=0;s.root=!0;const p=(t,e=[],n)=>{let r=0;return(t=n||t!==L?t.replace(/\ue001/g,(t=>u[c++])):u[c++].slice(1,-1))?(t.replace(/\ue000/g,((n,o)=>(o&&e.push(t.slice(r,o)),r=o+1,e.push(arguments[++l])))),r<t.length&&e.push(t.slice(r)),e.length>1?e:e[0]):t},d=()=>{[s,o,...e]=s,s.push(i(o,...e))};return t.join("").replace(/<!--[^]*-->/g,"").replace(/<!\[CDATA\[[^]*\]\]>/g,"").replace(/('|")[^\1]*?\1/g,(t=>(u.push(t),L))).replace(/\s+/g," ").replace(/(?:^|>)([^<]*)(?:$|<)/g,((t,e,i,u)=>{let c,h;if(i&&u.slice(a,i).replace(/(\S)\/$/,"$1 /").split(" ").map(((t,e)=>{if("/"===t[0])c=h||t.slice(1)||1;else if(e){if(t){let e=s[2]||(s[2]={});"..."===t.slice(0,3)?Object.assign(e,arguments[++l]):([n,r]=t.split("="),e[p(n)]=!r||p(r))}}else{for(h=p(t);z.close[s[1]+h];)d();s=[s,h,null],z.empty[h]&&(c=h)}})),c)for(d();o!==c&&z.close[o];)d();a=i+t.length,e&&" "!==e&&p((o=0,e),s,!0)})),s.root||d(),s.length>1?s:s[0]}z.empty={},z.close={},"area base br col command embed hr img input keygen link meta param source track wbr ! !doctype ? ?xml".split(" ").map((t=>z.empty[t]=z.empty[t.toUpperCase()]=!0));let F={li:"",dt:"dd",dd:"dt",p:"address article aside blockquote details div dl fieldset figcaption figure footer form h1 h2 h3 h4 h5 h6 header hgroup hr main menu nav ol pre section table",rt:"rp",rp:"rt",optgroup:"",option:"optgroup",caption:"tbody thead tfoot tr colgroup",colgroup:"thead tbody tfoot tr caption",thead:"tbody tfoot caption",tbody:"tfoot caption",tfoot:"caption",tr:"tbody tfoot",td:"th tr",th:"td tr tbody"};for(let t in F)[...F[t].split(" "),t].map((e=>{z.close[t]=z.close[t.toUpperCase()]=z.close[t+e]=z.close[t.toUpperCase()+e]=z.close[t+e.toUpperCase()]=z.close[t.toUpperCase()+e.toUpperCase()]=!0}));const U=z.bind(E);function V(t,e,n=window){const r=B();T((()=>{r.current=e}),[e]),T((()=>{if(!(n&&n.addEventListener))return;const e=t=>r.current(t);return n.addEventListener(t,e),()=>{n.removeEventListener(t,e)}}),[t,n])}function R({maxTime:t=-1,corners:e=!1,onSwipeStart:n,onSwiping:r,onSwipeEnd:o}={}){const i=B(),[a,s]=O(!1),[l,u]=O(!1),[c,p]=O(),[d,h]=O(),[f,m]=O(),[g,y]=O();function v(t){if(!t)return{};return{x:t.pageX||t.touches[0]?.pageX||t.changedTouches[0]?.pageX,y:t.pageY||t.touches[0]?.pageY||t.changedTouches[0]?.pageY}}function b(t,n){const r=function(t,e){return{x:e.x-t.x,y:e.y-t.y}}(t,n),o=function(t,e){const n={left:t.x<=0?Math.abs(t.x):0,right:t.x>=0?Math.abs(t.x):0,up:t.y<=0?Math.abs(t.y):0,down:t.y>=0?Math.abs(t.y):0},r={leftup:Math.abs(n.left+n.up)/1.5,leftdown:Math.abs(n.left+n.down)/1.5,rightup:Math.abs(n.right+n.up)/1.5,rightdown:Math.abs(n.right+n.down)/1.5};return e?{...n,...r}:n}(r,e),i=function(t){return Object.keys(t).sort(((e,n)=>t[n]-t[e]))}(o)[0];return{direction:i,directions:o,distance:o[i]}}const w=I((t=>{t.preventDefault(),s(!0);const e=v(t),n=Date.now();m(e),p(e),h(n),y(n)}),[s,p,h]),x=I((t=>{if(t.preventDefault(),a&&"function"==typeof r){const e=v(t),{direction:o,directions:i,distance:a}=b(c,e),{direction:s,directions:m,distance:g}=b(f,e);l||("function"==typeof n&&n({swipeStartPos:c,swipeStartTime:d}),u(!0));r({direction:o,directions:i,distance:a,totalDirection:s,totalDirections:m,totalDirections:m,totalDistance:g})&&function(t){p(v(t)),h(Date.now())}(t)}}),[u,r]),S=I((e=>{if(e.preventDefault(),s(!1),!l)return;u(!1);const n=Date.now(),r=n-d,i=n-g;if(-1===t||i<=t){const t=v(e),{direction:n,directions:a,distance:s}=b(c,t),{direction:l,directions:u,distance:p}=b(f,t);"function"==typeof o&&o({direction:n,directions:a,distance:s,totalDirection:l,totalDirections:u,totalDistance:p,time:r,totalTime:i})}}),[s,u,o]);return V("touchmove",x,i.current),V("touchstart",w,i.current),V("touchend",S,i.current),V("mousemove",x,i.current),V("mousedown",w,i.current),V("mouseup",S,i.current),V("mouseleave",S,i.current),i}const X=t=>t.filter(Boolean).join(" ");function q(t,e,n){return Math.max(e,Math.min(t,n))}function H({icon:t,flipNav:e,enlargeNav:n,adjustActiveItem:r,atStart:o,atEnd:i}){return E("div",{className:"navigators",part:"navigators",children:[E("button",{tabindex:-1,onclick:()=>r(-1),className:X(["previous",e&&"flip",n&&"enlarge",o&&"disabled"]),part:"previous navigator",children:E("img",{alt:"previous",src:t})}),E("button",{tabindex:-1,onclick:()=>r(1),className:X(["next",!e&&"flip",n&&"enlarge",i&&"disabled"]),part:"next navigator",children:E("img",{alt:"next",src:t})})]})}function J(t={}){const{width:e,height:n,itemsPerViewport:r,startItem:o,loop:i,autoplay:a,autoplayInterval:s,autoplayDirection:l,autoplayPauseOnFocus:u,swipeable:c,useMomentum:p,momentumMultiplier:h,snap:m,reverse:g,dragThreshold:y,minSwipeDistance:v,icon:b,flipNav:w,enlargeNav:S,duration:k,easing:N,onChange:M}=t,C=Object.values(t),A=f(((t={current:d.host})=>t)),D=B(),$=function(t){const[e,n]=O([]);return T((()=>{const{current:e}=t;if(!e)return;const r=()=>n(e.assignedNodes().filter((t=>!(t instanceof x))));return r(),function(t,e,n,r){return t.addEventListener(e,n,r),()=>t.removeEventListener(e,n)}(e,"slotchange",r)}),[]),e}(D),j=B(),I=c?R({onSwipeStart:function(){I.current.style.transition="none"},onSwiping:function({directions:t}){const{left:e,right:n}=t,r=e-n,{atEdge:o,atEnd:a}=gt(),s=i&&o;s?(Q(a?P:ut-P),et(0)):et(r);return s},onSwipeEnd:function({totalDirection:t,directions:e,totalDirections:n,totalTime:r}){const{left:o,right:i}=e,{left:a,right:s}=n,l=o-i,u=a-s;I.current.style.transition="";const c=r<y&&Math.abs(u)>v,d=p&&c?q(u*h,"right"===t?-1*P:0,"right"===t?0:P):0,f=q(K+l+d,0,ut),g=Math.abs(Math.round(f/L));G(g),et(0),Q(m?mt(g):f)}}):B(),[P,_]=O(),[L,z]=O(),[F,J]=O([]),[W,Y]=O(r),[Z,G]=O(0),[K,Q]=function(t){const e=B(null),[n,r]=O(t);return T((()=>{e.current&&(e.current(n),e.current=null)}),[n]),[n,(t,n)=>(e.current=n,r(t))]}(0),[tt,et]=O(0),[nt,rt]=O(!1),[ot,it]=O(0),at=Math.max(1,W),st=at,lt=F.length*L,ut=lt-P,ct=q(K+tt,0,ut),pt=!i&&0===Z,dt=!i&&Z===F.length-at;function ht(t){const e=t.cloneNode(!0);return e.setAttribute("class","item"),e.setAttribute("part","item"),e.removeAttribute("slot"),n=e.outerHTML,U([n]);var n}function ft(){if(!j?.current)return;const t=j?.current?.clientWidth,e=t/at;_(t),z(e),Y(function(){if(!A?.current)return r;const t=getComputedStyle(A.current)?.getPropertyValue("--itemsPerViewport");if(!t)return r;const e=parseInt(t);return"number"==typeof e?e:r}())}function mt(t){return t*L}function gt(){const t=parseInt(ct)<=0,e=parseInt(ct)>=parseInt(ut);return{atEdge:t||e,atStart:t,atEnd:e}}function yt(t){const{atStart:e,atEnd:n}=gt(),r=-1===Math.sign(t),o=1===Math.sign(t);if(e&&r||n&&o)!function(){if(!i||!I.current)return;const{atEdge:t,atEnd:e}=gt();if(!t)return;const n=function(t){const e=t.includes("3d")?"3d":"2d";if(!t.match(/matrix.*\((.+)\)/))return null;const n=t.match(/matrix.*\((.+)\)/)[1].split(", ");return"2d"===e?{x:n[4],y:n[5],matrixType:e}:"3d"===e?{x:n[12],y:n[13],z:n[14],matrixType:e}:{}}(getComputedStyle(I?.current).getPropertyValue("transform"));if(!n)return;const{x:r}=n,o=e?lt-(Math.abs(r)+P):Math.abs(r),a=e?P:ut-P,s=e?at:F.length-2*at,l=e?a-o:a+o;I.current.style.transition="none",G(s),Q(l,(()=>{requestAnimationFrame((()=>{requestAnimationFrame((()=>{I.current.style.transition="";const t=e?s+1:s-1;Q(e?a+L:a-L),G(t)}))}))}))}();else{const e=q(Z+t,0,F.length-at),n=mt(e);G(e),Q(n)}}return T(ft,[...C,j,F]),T((function(){if(!$||$.length<=0)return;const t=$.filter((t=>t instanceof Element)).map(ht),e=g?[...t].reverse():t,n=i?[...e.slice(e.length-at),...e,...e.slice(0,at)]:e;J(n)}),[$,at]),T((function(){if(!L)return;const t=i?st+o:o,e=mt(t);Q(e),G(t)}),[F,L]),T(M,[Z]),T((function(){if(!a)return;const t=setInterval((()=>{it((t=>t+1))}),s);return()=>clearInterval(t)}),[a,F]),T((function(){if(!a)return;if(u&&nt)return;yt("left"===l?-1:1)}),[ot]),V("resize",(function(){ft()}),window),E("host",{shadowDom:!0,tabindex:0,onclick:function(){A?.current&&A.current.focus()},onkeydown:function(t){t.repeat&&i||("ArrowRight"===t.key?yt(1):"ArrowLeft"===t.key&&yt(-1))},onfocus:()=>rt(!0),onblur:()=>rt(!1),children:[E("div",{class:X(["viewport",c&&"swipeable"]),part:"viewport",ref:j,style:{"--width":e,"--height":n,"--position":`-${ct}px`,"--duration":k/1e3+"s","--easing":N,"--itemWidth":void 0!==L?`${L}px`:`${P}px`},children:[E("div",{class:"track",part:"track",ref:I,children:[E("slot",{ref:D,name:"item"}),F]}),H({adjustActiveItem:yt,icon:b,flipNav:w,enlargeNav:S,atStart:pt,atEnd:dt})]}),E("style",{children:".viewport {\n position: relative;\n width: var(--width, 100%);\n height: var(--height, 100%);\n overflow: hidden;\n}\n.viewport.swipeable {\n cursor: grab;\n}\n\n.track {\n display: inline-grid;\n grid-auto-flow: column;\n transform: translateX(var(--position, 0px));\n transition: transform var(--duration, 0.3s) var(--easing, ease-out);\n}\n\n.track *[slot=slide],\n::slotted(*),\n.item {\n position: relative;\n display: inline-block;\n box-sizing: border-box;\n width: var(--itemWidth);\n height: var(--height);\n object-fit: cover;\n border: 1px solid black;\n}\n\nslot {\n display: none;\n}\n\n.navigators {\n display: inline-grid;\n grid-auto-flow: column;\n justify-content: space-between;\n align-items: center;\n box-sizing: border-box;\n position: absolute;\n top: 0;\n bottom: 0;\n width: 100%;\n padding: 1%;\n pointer-events: none;\n z-index: 2;\n}\n.navigators button {\n cursor: pointer;\n pointer-events: all;\n background-color: transparent;\n border: none;\n width: 15vw;\n min-width: 64px;\n max-width: 96px;\n padding: 16px;\n transition: width 0.1s, max-width 0.1s;\n}\n.navigators button img {\n max-width: 100%;\n}\n.navigators button.disabled {\n width: calc(96px / 1.25);\n opacity: 0.5;\n cursor: auto;\n}\n.navigators button.enlarge:hover:not(.disabled) {\n width: calc(96px * 1.15);\n max-width: calc(96px * 1.15);\n}\n.navigators button.next {\n justify-self: end;\n}\n\n.flip {\n transform: rotate(180deg);\n}"})]})}J.props={width:{type:String,value:"100%"},height:{type:String,value:"600px"},itemsPerViewport:{type:Number,value:3},startItem:{type:Number,value:0},loop:{type:Boolean,value:!0},autoplay:{type:Boolean,value:!0},autoplayInterval:{type:Number,value:3e3},autoplayDirection:{type:String,value:"right"},autoplayPauseOnFocus:{type:Boolean,value:!0},swipeable:{type:Boolean,value:!0},useMomentum:{type:Boolean,value:!0},momentumMultiplier:{type:Number,value:1.5},snap:{type:Boolean,value:!0},reverse:{type:Boolean,value:!1},dragThreshold:{type:Number,value:200},minSwipeDistance:{type:Number,value:50},icon:{type:String,value:"https://unpkg.com/@codecabana/assets@latest/img/arrow.png"},flipNav:{type:Boolean,value:!1},enlargeNav:{type:Boolean,value:!0},duration:{type:Number,value:300},easing:{type:String,value:"ease-out"},onChange:{type:Function,value:()=>{}}},customElements.define("codecabana-carousel",function(t,e=HTMLElement){let n={},o={},{props:i,styles:l}=t;return class extends e{constructor(){super(),this._setup(),this._render=()=>t({...this._props});for(let t in o)this[t]=o[t]}static get styles(){return[super.styles,l]}async _setup(){if(this._props)return;this._props={},this.mounted=new Promise((t=>this.mount=t)),this.unmounted=new Promise((t=>this.unmount=t)),this.symbolId=this.symbolId||Symbol();let t,e=function(t,e){let n={},r={use:function(t,e,r){let o=h++;return n[o]=[t(n[o]?n[o][0]:void 0),e,r],n[o][0]},host:e,update:t};function o(t,e){for(let r in n){let o=n[r];o[t]&&(o[0]=o[t](o[0],e))}}return{load:function(t){let e;h=0,d=r;try{e=t()}finally{d=null}return e},cleanEffects:function(t){return o(1,t),()=>{o(2,t),t&&(n={})}}}}((()=>this.update()),this),n=!0,o="hydrate"in this.dataset;this.update=i=>{if(t||(t=!0,this.updated=(this.updated||this.mounted).then((()=>{try{return M(e.load(this._render),this,this.symbolId,n&&o),t=!1,n&&(n=!1,function(t){let{styles:e}=t.constructor,{shadowRoot:n}=t;n&&e.length&&(e=e.reduce((function t(e,n){return r(n)?n.reduce(t,e):n&&e.push(n),e}),[]),D?n.adoptedStyleSheets=[...e]:e.map((t=>n.appendChild(t.cloneNode(!0)))))}(this)),!$&&e.cleanEffects()}finally{t=!1}})).then((t=>{t&&t()}))),i)for(let t in i)this._props[t]=i[t];return this.updated},this.update(),await this.unmounted,e.cleanEffects(!0)()}connectedCallback(){this.mount(),super.connectedCallback&&super.connectedCallback()}async disconnectedCallback(){super.disconnectedCallback&&super.disconnectedCallback(),await this.mounted,!this.isConnected&&this.unmount()}attributeChangedCallback(t,e,r){if(n[t]){if(t===this._ignoreAttr||e===r)return;let{prop:o,type:i}=n[t];this[o]=((t,e)=>t==Boolean?!!a[e]:t==Number?Number(e):t==Array||t==Object?JSON.parse(e):e)(i,r)}else super.attributeChangedCallback(t,e,r)}static get observedAttributes(){let t=super.observedAttributes||[];for(let t in i)s(this.prototype,t,i[t],n,o);return Object.keys(n).concat(t)}}}(J))}));