compelem 0.2.2-beta → 0.2.3-beta

package/CompElem.d.ts

@@ -71,7 +71,7 @@ export declare class CompElem extends CompElem_base implements IComponent {
      * dom渲染完毕后调用，该回调内可以query注解初始化完成
      */
     mounted(): void;
-    slotchange(slot: HTMLSlotElement, name: string): void;
+    slotChange(slot: HTMLSlotElement, name: string): void;
     /**
      * 是否需要更新，可获取变更属性
      * 返回true时更新

package/IComponent.d.ts

@@ -20,7 +20,7 @@ export interface IComponent {
     mounted(): void;
     shouldUpdate(changed: Record<string, any>): boolean;
     updated(changed: Record<string, any>): void;
-    slotchange(slot: HTMLSlotElement, name: string): void;
+    slotChange(slot: HTMLSlotElement, name: string): void;
     /**
      * 抛出自定义事件
      * @param evName 事件名称

package/README.md

@@ -245,18 +245,19 @@ export class PageTest extends CompElem {
     <div ref="${divRef}"></div>`;
   ```
 - ### 内置属性及函数
-  - `readonly` parent 父组件引用，可能为空
-  - `readonly` el/els 根元素/根元素列表
-  - `readonly` slots 插槽元素
-  - `readonly` slotHooks 动态插槽钩子
+  - `readonly` parentComponent 父组件引用，可能为空
+  - `readonly` renderRoot/renderRoots 渲染根元素/渲染根元素列表
+  - `readonly` shadowRoot 阴影DOM
+  - `readonly` slots 插槽元素映射
+  - `readonly` slotHooks 动态插槽钩子映射
   - `readonly` styles 组件样式对象列表
   - `readonly` attrs 组件特性
   - `readonly` props 组件属性
   - slotComponent 所在插槽组件
-  - on()
-  - emit()
-  - nextTick()
-  - forceUpdate()
+  - on(evName: string, hook: (e: Event) => void) 在root元素上绑定事件
+  - emit(evName: string, arg: Record<string, any>, options?: {event?: Event;bubbles?: boolean;composed?: boolean;}) 抛出自定义事件
+  - nextTick(cbk: () => void) 下一帧执行函数
+  - forceUpdate() 强制更新一次视图
 
 ## 组件渲染流程
 
@@ -269,23 +270,23 @@ CompElem 组件既可以在 CompElem 环境内调用，也可以直接在原生
 | 1. 创建组件实例，完成类属性默认值设置（prop/state/...)       |     |             |
 | 2. 初始化类全局样式（仅一次）及 实例样式(产生 styles 数组)   |     |             |
 | 3. 创建 shadowRoot 并挂载组件样式                            |     | constructor |
-| 4. 绑定 parent                                               |     | connected   |
-| 5. 获取 this.attribute 及 parentProps 进行验证及初始化 props |     | propsReady  |
+| 4. 绑定 parentComponent                                               |     | connected   |
+| 5. 获取 attrs 及 parentProps 进行验证及初始化 props |     | propsReady  |
 | 6. 注入 link 外部样式表                                      |     |             |
 | 7. 渲染 render 及依赖绑定                                    |     | render      |
-| 8. 绑定 el 及 els                                            |     |             |
+| 8. 绑定 renderRoot 及 renderRoots                                            |     |             |
 | 9. 执行 ref                                                  |     |             |
 | 10. 执行 @query 注解                                         |     |             |
 | 11. 执行 @watch(immediate) 注解                              |     |             |
 | 12. 执行 @event 注解                                         |     | mounted     |
-| 13. 执行 slot filter / 动态 slot                             |     | slotchange  |
+| 13. 执行 slot filter / 动态 slot                             |     | slotChange  |
 
 > 更新流程【普通】
 
 | 功能                           | 生命周期     |
 | ------------------------------ | ------------ |
 | 1. 父组件 props 变更【或】     | propsReady   |
-| 1. 子组件 state 变更【或】     |              |
+| 1. 子组件 states 变更【或】     |              |
 | 2. 执行@watch 注解             |              |
 | 3. 合并变更内容并判断是否更新  | shouldUpdate |
 | 4. 更新依赖域指令（非 render） |              |
@@ -398,6 +399,7 @@ static get autoSlot() {
 - @tag 自定义组件的标签名
 - @event 定义全局事件
 - @watch 监控 state/prop 变更
+- @computed 计算属性，仅在响应变量变更时更新缓存值
 
 > 装饰器还可通过函数方式进行调用，如
 > ```ts

package/index.js

@@ -1,7 +1,7 @@
 /**
-   * compelem v0.2.2-beta.1731842602
+   * compelem v0.2.3-beta.1732103467
    * A modern, reactive, fast, lightweight and flexible lib for building web components
    * @holyhigh2
    * https://github.com/holyhigh2/compelem
    */
-  import{toPath as t,isFunction as e,isObject as s,isDefined as n,get as r,isUndefined as i,isEmpty as o,has as a,concat as l,set as c,defaults as d,merge as h,cloneDeep as p,each as u,kebabCase as f,last as m,isEqual as _,startsWith as g,includes as v,clone as E,isElement as C,isArray as b,initial as N,find as y,debounce as P,throttle as T,once as x,remove as S,map as M,size as A,isBlank as k,join as L,split as O,replace as w,compact as D,toArray as R,assign as $,first as j,isString as I,closest as H,bind as B,trim as U,omitBy as F,camelCase as V,isNil as z,some as W,isNull as K,fval as Q,test as G,omit as X,flatMap as q,groupBy as Y,reject as J,filter as Z,slice as tt,head as et,trimStart as st,trimEnd as nt,replaceAll as rt,snakeCase as it,toString as ot,findIndex as at,call as lt}from"myfx";function ct(t){console.error("[CompElem]",t)}function dt(t,e){console.error(`[CompElem <${t}>]`,e)}function ht(e){return t(e).join("-")}function pt(t){return Object.getPrototypeOf(t)}var ut;!function(t){t.CLASS="class",t.FIELD="field",t.METHOD="method"}(ut||(ut={}));class ft{static call(t,s,n,...r){if(gt.get(s)){s(...r)(t,n,e(n)?{configurable:!0}:null).create(t)}else s(t,n,...r)}}const mt="getKey",_t="__decorators",gt=new WeakMap;class vt{args;metadata;decoratorClass;instanceMap;key;constructor(t,e,s){this.args=t,this.metadata=e,this.decoratorClass=s,this.instanceMap=new WeakMap}create(t){let e,a=new this.decoratorClass(...this.args),l=a.targets,c=this.metadata[2];s(c)&&n(r(c,"configurable"))?e=ut.METHOD:i(this.metadata[2])&&(e=ut.FIELD),!o(l)&&e&&l.includes(e)?(a.created(t,...this.metadata),this.instanceMap.set(t,a)):ct(`Decorator '${this.decoratorClass.name}' is out of targets, expect '${l.join(",")}' bug got '${e}'`)}propsReady(t,e){this.instanceMap.get(t).propsReady(t,e,...this.metadata)}mounted(t,e){this.instanceMap.get(t).mounted(t,e,...this.metadata)}updated(t,e){this.instanceMap.get(t).updated(t,e)}}const Et=new WeakMap;function Ct(t){let e=(...e)=>(...s)=>{let n=s[0].constructor,i=r(n,_t);if(!a(n,_t)){let t=r(Object.getPrototypeOf(n),_t);i=t?l(t):[],c(n,_t,i)}let o,d={},h=r(t,mt);if(h){let s=Et.get(t);if(s||(s=new WeakMap,Et.set(t,s)),d=s.get(n),d||(d={},s.set(n,d)),o=h(...e),d[o])return d[o]}let p=new vt(e,s,t);return d[o]=p,i?.push(p),p};return gt.set(e,!0),e}const bt=new WeakMap;function Nt(t){if(1===arguments.length)return(e,s,n)=>{t.required=t.required||!1,t.attribute=!1!==t.attribute,yt(e,s,t,n)};let e=arguments[0],s=arguments[1],n=arguments[2];t={type:void 0,required:!1,attribute:!0},n&&"function"==typeof n.type&&(t=d(n,t),n=void 0),yt(e,s,t,n)}function yt(t,e,s,n){let r;if(/[a-z]/.test(e[0])||ct(`Prop '${e}' must be in CamelCase`),!a(t.constructor,"__deco_props")){const e={};let s=t.constructor;for(;(s=pt(s))!==zt;)h(e,s.__deco_props?p(s.__deco_props):{});t.constructor.__deco_props=e,r=new Set,u(e,((t,e)=>{if(t.attribute){let t=f(e);r?.add(t)}})),bt.set(t.constructor,r)}if(n&&(n.get&&(s.getter=n.get),n.set&&(s.setter=n.set)),s.attribute){r||(r=bt.get(t.constructor));let s=f(e);r?.add(s)}t.constructor.__deco_props[e]=s}const Pt=new Set;function Tt(t){return bt.get(t)??Pt}const xt={startCss(t){this.__cssCollecting=t},endCss(){this.__cssCollecting=null},setCssUpdater(t){this.__cssUpdater=t},startCompute(t){this.__computeCollecting=t},endCompute(){this.__computeCollecting=null},setComputedProp(t){this.__computeUpdater=t},__computeCollecting:null,__computeUpdater:null,__cssCollecting:null,__cssUpdater:null,__directiveQ:[],setDirectiveQ(t){let e=m(this.__directiveQ);e&&_(e,t)||(e&&e.length<t.length&&g(t.join(","),e.join(","))?this.__directiveQ[this.__directiveQ.length-1]=t:this.__directiveQ.push(t))},popDirectiveQ(){let t=l(this.__directiveQ);return this.__directiveQ=[],t},startRender(t){this.__renderCollecting=!0,this.__renderContext=t},endRender(t){this.__renderCollection.forEach((e=>{t._regDeps(e,this.__renderContext)})),this.__renderCollection.clear(),this.__renderCollecting=!1,this.__renderContext=null},collect(t){this.__renderCollection.add(t)},clear(){this.__directiveQ=[]},__renderCollection:new Set,__renderContext:null,__renderCollecting:!1,__skipCheck:!1},St=new WeakMap,Mt=new WeakMap,At=new WeakMap,kt=new WeakMap;function Lt(t,n){if(!s(t))return t;const i=t.__proxy?t:new Proxy(t,{get(t,e,s){const n=Object.keys(t),r=Reflect.get(t,e,s);if(!v(n,e))return r;if(t.hasOwnProperty(e)){let t=Mt.get(s)??[],n=l(t,[e]),r=n.join("-");if(xt.__renderCollecting)xt.collect(ht(n)),xt.setDirectiveQ(n);else if(xt.__computeCollecting){let t=At.get(xt.__computeCollecting);t||(t={},At.set(xt.__computeCollecting,t));let e=t[r];e||(e=t[r]=[]),e.push(xt.__computeUpdater)}else if(xt.__cssCollecting){let t=kt.get(xt.__cssCollecting);t||(t={},kt.set(xt.__cssCollecting,t)),t[r]=xt.__cssUpdater}}return r},set(t,n,i,o){let a=St.get(o).from,c=r(a.constructor,"__deco_props");c&&c[n]&&t.__isData&&c[n].sync&&a.emit("update:"+n,{value:i});let d=t[n],h=r(a.constructor,"__deco_states"),p=r(c,[n,"hasChanged"])||r(h,[n,"hasChanged"]);if(p){if(!p.call(a,i,d))return!1}else{if(t[n]===i)return!0;if(Number.isNaN(i)&&Number.isNaN(t[n]))return!1}s(d)&&(d=E(d));let u=St.get(o)?.contextSet,f=Mt.get(o)??[],m=l(f,[n]),_=i;!s(i)||e(i)||C(i)||u.forEach((t=>{let e=St.get(o)?.pathMap,s=e?.get(t);s&&(m=l(s,[n]),Mt.set(_,m),_=Lt(_,t),Mt.set(_,m))}));let g=Reflect.set(t,n,_),v=St.get(o).pathMap;return u.forEach((t=>{let e=v.get(t);if(!e)return;m=l(e,"length"==n&&b(o)?[]:[n]),t._notify(d,m);let s=m.join("-"),r=At.get(t);if(r){let e=r[s];e&&e.forEach((e=>{e.call(t)}));let n=m.length-1;for(;n;){let e=r[m.slice(0,n).join("-")];e&&e.forEach((e=>{e.call(t)})),n--}}let i=kt.get(t);if(i){let e=i[s];e&&e.call(t);let n=m.length-1;for(;n;){let e=i[m.slice(0,n).join("-")];e&&e.call(t),n--}}})),g}});t.__proxy||Object.defineProperty(t,"__proxy",{enumerable:!1,writable:!1,configurable:!1,value:!0});let o=Mt.get(t)??[];if(Object.isExtensible(t)&&!St.get(i)){let t=new Set;t.add(n);let e=new WeakMap;e.set(n,o),St.set(i,{from:n,contextSet:t,pathMap:e})}else{St.get(i).contextSet.add(n);let t=St.get(i).pathMap,e=t.get(n),s=l(o);if(e&&e.join("")!==s.join("")){let t=r(n,N(e));b(t)||function(...t){console.warn("[CompElem]",...t)}(`The object is referenced by more than one @state '${s.join(".")},${e.join(".")}'`),e=s}else t.set(n,s)}for(let r in t){const i=t[r];!s(i)||e(i)||C(i)||i instanceof Text||(Mt.set(i,l(o,[r])),t[r]=Lt(i,n),Mt.set(t[r],l(o,[r])))}return i}const Ot=["resize","outside"],wt=new WeakMap,Dt=[],Rt=new ResizeObserver((t=>{for(const e of t){const t=Array.isArray(e.contentBoxSize)?e.contentBoxSize[0]:e.contentBoxSize,s=Array.isArray(e.borderBoxSize)?e.borderBoxSize[0]:e.borderBoxSize;let n=wt.get(e.target);if(n){n(new CustomEvent("resize",{bubbles:!1,cancelable:!1,detail:{borderBox:{w:s.inlineSize,h:s.blockSize},contentBox:{w:t.inlineSize,h:t.blockSize}}}))}}}));function $t(t,e,s,n){if("resize"===t)!function(t,e){wt.set(t,e),Rt.observe(t)}(e,s);else if("outside"===t&&"mousedown"===n[0])!function(t,e){Dt.push([t,e])}(e,s)}document.addEventListener("mousedown",(t=>{let e=t.target;Dt.forEach((([s,n])=>{if(!s.contains(e)){n(new CustomEvent("outside",{bubbles:!1,cancelable:!1,detail:{currentTarget:s,event:t}}))}}))}),!1);const jt=/,|^(debounce:.+)|(debounce$)/,It=/,|^(throttle:.+)|(throttle$)/,Ht={esc:"escape"};function Bt(t,e,s,n){let r,i=t.split("."),o=i.shift(),a=i.includes("once"),l=e;if(r=y(i,(t=>jt.test(t)))){let t=r.split(":");l=P(l,parseInt(t[1])||100)}if(r=y(i,(t=>It.test(t)))){let t=r.split(":");l=T(l,parseInt(t[1])||100)}if(a&&(l=x(l)),function(t){return Ot.includes(t)}(o))return $t(o,s,l,i),l;let c=t=>{if(i.includes("prevent")&&t.preventDefault(),i.includes("stop")&&t.stopPropagation(),!i.includes("self")||t.target===t.currentTarget){if(t instanceof MouseEvent){if(i.includes("left")&&0!=t.button)return;if(i.includes("right")&&2!=t.button)return;if(i.includes("middle")&&1!=t.button)return}else if(t instanceof KeyboardEvent){if(S(i,(t=>"ctrl"==t))[0]&&!t.ctrlKey)return;if(S(i,(t=>"alt"==t))[0]&&!t.altKey)return;if(S(i,(t=>"shift"==t))[0]&&!t.shiftKey)return;if(S(i,(t=>"meta"==t))[0]&&!t.metaKey)return;if(!M(i,(t=>Ht[t]||t)).includes(t.key.toLowerCase()))return}l(t)}};s.addEventListener(o,c);let d=n.__events[o];return d||(d=n.__events[o]=[]),d.push([s,c]),c}function Ut(t){return class extends t{render(...t){}__expPos={};__expPosMap={};__directives={};slotComponent;renderComponent;renderContext(...t){return Ft.call(this,...t)}updateContext(...t){let e=1==A(t)&&(b(t[0])&&t[0][0]instanceof fe||t[0]instanceof fe)?t[0]:this.render(...t);e instanceof fe?this.__updateExpPos(e,this.__expPos):b(e)&&e[0]instanceof fe&&e.forEach(((t,e)=>{this.__updateExpPos(t,this.__expPosMap[t.key??t.getKey()])}))}__updateExpPos(t,e){if(k(L(t.strings)))return;let{vars:n}=t;e&&Object.values(e).forEach((t=>{let e=t.index,i=t.value,a=n,l=t.node,d=O(e,"-");if(d.forEach(((t,e)=>{a=r(a,t),a&&a.vars&&e<d.length-1&&(a=a.vars)})),!s(i)&&i===a)return;let h=l;if(t.isDirective){a.di=i.di,a.di.renderParams=a.varChain,a.di._renderArgs=a.args,a.point=i.point,a.varPath=i.varPath;let t=function(t,e){let s=t.nextSibling;if(!e)return[s];let n=[];for(;s&&s!==e;)n.push(s),s=s?.nextSibling;return n}(a.point.startNode,a.point.endNode);a.update(t,a.args,i.args)}else if(t.isToggleProp){if(!!a===i)return;h.toggleAttribute(t.attrName,!!a),c(h,t.attrName,!!a)}else if(t.isProp){if(!s(a)&&a===i)return;if(s(a)&&_(a,i))return;l instanceof zt?l._updateProps({[t.attrName]:a}):l instanceof HTMLSlotElement&&this.renderComponent._updateSlot(l.getAttribute("name")||"default",t.attrName,a)}else if(t.eventName)h.removeEventListener(t.eventName,i),a=a.bind(this.renderComponent),a=Bt(t.attrName,a,h,this.renderComponent);else if(t.attrName){if(!_(i,a))switch(t.attrName){case"value":if(l instanceof HTMLInputElement){l.value=a;break}default:l.setAttribute(t.attrName,w(t.attrTmpl,de,a+""))}}else if(t.isTmpl){if(!_(a,i)){let[e,s,n]=Ft.call(this,a);o(s)?(pe.remove(t.textNode,t.node),pe.insertBefore(t.node,e)):this.__updateExpPos(a,s)}}else if(t.isText){let e=t.textNode.nextSibling;e&&e===t.node.previousSibling?e.textContent=a:(pe.remove(t.textNode,t.node),pe.insertBefore(t.node,[a]))}t.value=a}))}}}function Ft(...t){let e,s,n,r=1===t.length&&t[0]instanceof fe?t[0]:this.render(...t),i=[];if(r instanceof fe){let t=ae(r);s={},e=he(s,i,t,r.vars,this.renderComponent)}if(b(r)&&r[0]instanceof fe){let t=[];n={},r.forEach((s=>{let r=ae(s),o={};e=he(o,i,r,s.vars,this.renderComponent),t.push(...e),n[s.key??s.getKey()]=o})),e=t}else r instanceof Function&&this.slotComponent._asyncDirectives.set(r,this);return i.length<1||i.forEach((t=>{let e=D(R(t.render(this.renderComponent)));if(!o(e)){let s=document.createDocumentFragment();s.append(...e),t.point.endNode.parentNode.insertBefore(s,t.point.endNode)}})),[e,s,n]}const Vt={boolean:Boolean,string:String,number:Number,object:Object,array:Array,function:Function,bigint:BigInt,symbol:Symbol,undefined:Object};class zt extends(Ut(HTMLElement)){static __l_globalRule=document.createElement("style");static{document.head.appendChild(zt.__l_globalRule)}#t={};#e={"#slots":{}};#s={};#n;#r={};#i;#o;#a={};__events={};get reactiveData(){return this.#s}get attrs(){return this.#l}get props(){return this.#c}get renderRoot(){return this.#d}get renderRoots(){return this.#h}get parentComponent(){return this.#p}get slotHooks(){return this.#u}get styles(){return r(this.constructor,"_component_style_attached",[])}get isMounted(){return this.#f}get slots(){return this.#e["#slots"]}#l;#c;#d;#h;#p;#m={};#u={};#_={};#f=!1;#g=new CSSStyleSheet;static get autoSlot(){return!0}static get styles(){return[]}static get globalStyles(){return[]}get css(){return""}#v=!1;constructor(...t){super(),1===A(t)&&(this.#c={},$(this.#c,j(t))),this.renderComponent=this;let e=this.render;this.render=()=>{let t;return xt.startRender(this),t=e.call(this),xt.endRender(this.renderComponent),t};let s=r(this.constructor,"globalStyles"),n=r(this.constructor,"_global_style_attached");if(!o(s)&&"1"!==n){let t="";u(s,(e=>{I(e)&&(t+=e+"\n")})),zt.__l_globalRule.textContent+=t,c(this.constructor,"_global_style_attached","1")}let i=r(this.constructor,"_component_style_attached"),a=i??[];i||(u(r(this.constructor,"styles"),(t=>{if(I(t)){let e=new CSSStyleSheet;e.replace(t),a.push(e)}else a.push(t)})),c(this.constructor,"_component_style_attached",a)),this.#i=this.attachShadow({mode:"open",slotAssignment:r(this.constructor,"autoSlot",!0)?"named":"manual"}),this.#i.adoptedStyleSheets=l(a,this.#g);let d=this.attributes.getNamedItem("css-link")?.value;if(d){const t=document.createElement("style");t.textContent=`@import "${d}"`,this.#i.appendChild(t)}let h=P(this.#E,20);this.#o=new MutationObserver((t=>{t.forEach((t=>{"childList"===t.type?h.call(this):"attributes"===t.type&&t.attributeName&&this.#C(t.attributeName,t.oldValue,this.getAttribute(t.attributeName))}))})),this._slotsPropMap={default:[]};let p=r(this.constructor,_t);u(p,(t=>{t.create(this)}))}connectedCallback(){let t=H(this.parentNode,(t=>t instanceof zt||t.host instanceof zt),"parentNode");this.#p=t?t instanceof zt?t:t.host:null,this.connected(),this.__init()}disconnectedCallback(){this.#o.disconnect()}__init(){if(this.#v)return;this.#b(),this.#N(),this.#y(),u(this.#e,((t,e)=>{let s=Reflect.getOwnPropertyDescriptor(this.#e,e);Object.defineProperty(this,e,{get(){let t=Reflect.get(this.#s,e);return s?.get?s?.get():t},set(t){s?.set?s?.set(t):Reflect.set(this.#s,e,t)}})})),Object.defineProperty(this.#e,"__isData",{enumerable:!1,value:!0}),this.#s=Lt(this.#e,this);const t=this;let s=r(this.constructor,_t);u(s,(e=>{e.propsReady(this,((e,s)=>(t.#s[e]=s,t.#s[e])))})),this.propsReady();let n=r(this.constructor,"__deco_computed");u(n,(({key:t,getter:e},s)=>{xt.startCompute(this),xt.setComputedProp((()=>{this.#s[s]=e.call(this)})),this.#e[s]=e.call(this),xt.endCompute()})),u(n,((t,e)=>{Object.defineProperty(this,e,{get(){return Reflect.get(this.#s,e)},set(t){dt(this.tagName,"Cannot set a computed property '"+e+"'")}})}));let[i,o,a]=this.renderContext();if(this.__expPos=o,i){let t=R(i);u(t,(t=>{this.#i.appendChild(t)})),this.#h=t,this.#d=t[0]}this.#E(),this.#o.observe(this,{childList:!0,attributes:!0});let l=r(this.constructor,"__deco_events");u(l,(t=>{let s=t.name,n=$({target:document,once:!1,passive:!1,capture:!1},t.options),r=B(t.fn,this),i=n.target;e(i)&&(i=i.call(this,this)),i.addEventListener(s,r,n)})),u(this.#u,((t,e)=>{this.#P(e)})),xt.startCss(this),xt.setCssUpdater((()=>{let t=this.css;this.#g.replace(t)}));let c=this.css;U(c)&&this.#g.replace(c),xt.endCss(),setTimeout((()=>{this.#f=!0,this.mounted(),u(s,(e=>{e.mounted(this,((e,s)=>(t.#s[e]=s,t.#s[e])))}))}),0),this.#v=!0}connected(){}propsReady(){}render(){throw Error(`[CompElem <${this.tagName}>] Missing render()`)}mounted(){}#T(t,e){this.#b();let s=r(this.#t[e],"props");s&&u(this.slots,((t,e)=>{t.filter((t=>t.nodeType===Node.ELEMENT_NODE)).forEach((t=>{t instanceof zt?t._updateProps(s):u(s,((e,s)=>{if(t instanceof HTMLSlotElement){let n=r(t,"__l_comp");if(n){let r=t.name||"default",i=n.#t[r];i||(i=n.#t[r]={props:{}}),i.props||(i.props={}),i.props[s]=e,n.#T(t,r)}}else t.setAttribute(s,e)}))}))})),this.slotchange(t,e)}slotchange(t,e){}shouldUpdate(t){return!0}updated(t){}emit(t,e={},s){s&&s.event&&(e.event=s.event),e.target=this,this.dispatchEvent(new CustomEvent(t,{bubbles:r(s,"bubbles",!1),composed:r(s,"composed",!1),cancelable:!0,detail:e}))}#x={};on(t,e){this.#x[t]||(this.#x[t]=[]);let s=e.bind(this);this.#x[t].push(s),this.addEventListener(t,s)}nextTick(t){requestAnimationFrame(t)}forceUpdate(){u(this.#s,((t,e)=>{this.#r[e]={value:void 0,chain:void 0}})),this.#S()}_notify(t,e){let s=[];u(e,(n=>{s.push(n);let i=r(this,s),o=ht(s);this.#r[o]={value:i,chain:"slots"===o?["slots"]:s,oldValue:t,end:s.length===e.length}})),this.#n&&clearTimeout(this.#n),this.#n=setTimeout(this.#S.bind(this),10)}#S(){const t=Object.seal(E(F(this.#r,((t,e)=>"#"===e[0]))));let e=r(this.constructor,_t);if(u(e,(e=>{e.updated(this,t)})),!this.shouldUpdate(t))return;let s=new Set;u(this.#r,(({value:t,chain:e,oldValue:n},r)=>{this.#a[r]&&this.#a[r].forEach((t=>{s.add(t)}))})),s.forEach((t=>{t.updateContext(...t._renderArgs?t._renderArgs:[])})),u(this.#M,(t=>{this.#P(t)})),this.updated(t),this.#r={}}#N(){let t=r(this.constructor,"__deco_props"),e=this.attributes,o=this.tagName,l=this.#c,c={};u(e,(({name:e,value:s})=>{if(e[0]===Jt||e[0]===Zt||e[0]===te||e===ne||"slot"===e)return;let n=V(e);t&&!t[n]&&(c[e]=s)})),this.#l=this.#l?$(this.#l,c):c,u(t,((c,d)=>{let h,p=t[d],u=a(l,d),m=r(this,d);if(!("_defaultValue"in p)&&(p._defaultValue=m,!p.type)){i(m)&&dt(o,"Prop '"+d+"' has neither propType nor defaultValue be used for type inference");let t=typeof m;b(m)&&(t="array");let e=Vt[t];p.type=e}if(u)h=z(l[d])?m:l[d];else{h=m;let t=e.getNamedItem(f(d))||e.getNamedItem(Zt+f(d));t&&(u=!0,h=t.value)}if(p.required&&!u)return dt(o,"Prop '"+d+"' is required"),!1;h=this.#A(t,d,h);let _=r(t,[d,"getter"]);_&&(_=B(_,this));let g=r(t,[d,"setter"]);g&&(g=B(g,this)),(_||g)&&Object.defineProperty(this.#e,d,{set:g||function(t){},get:_}),p.attribute&&n(h)&&!s(h)&&this.setAttribute(f(d),U(h)),this.#e[d]=h}))}#A(t,e,s){let r=t[e];if(!r)return s;let o=r.isValid,a=r.type,l=b(a)?a:[a],c=r.converter,d=s;if(!W(l,(t=>t===String))&&I(d)&&!K(d))try{d=c?c(d):Q(d,{html:me})}catch(t){dt(this.tagName,`Convert attribute '${e}' error with `+d)}l.forEach((t=>{"Boolean"===t.name&&(I(d)&&/(?:^true$)|(?:^false$)/.test(d)?d=Q(d):(i(d)||k(d))&&(d=!0))}));let h=typeof d,p=!n(d);return u(l,(t=>{if(G(h,t.name,"i")||d instanceof t)return p=!0,!1})),p||dt(this.tagName,`Invalid prop '${e}'. expected '${l.map((t=>t.name||t))}' but got '${h}'`),o&&(o.call(this,d,this.#e)||dt(this.tagName,`Invalid prop '${e}'. IsValid() check failed`)),d}#y(){let t=r(this.constructor,"__deco_states");u(t,((e,s)=>{let n=t[s],i=r(this,s);if(n){let t=n.prop;i=t?p(this.#e[t]):r(this,s)}this.#e[s]=i}))}#k=P(this.propsReady,100);_setParentProps(t,e){if(this.#v){let s=r(this.constructor,"__deco_props");u(t,((t,e)=>{let n=V(e),r=s[n];if(!r)return;let i=this.#e[n];t=this.#A(s,n,t),r.hasChanged&&!r.hasChanged.call(this,t,i)||(this.#e[n]=t,this._notify(i,[n]))})),$(this.#c,t),$(this.#l,e),this.#k()}}_updateProps(t){let e=r(this.constructor,"__deco_props");u(t,((t,s)=>{let n=V(s),r=e[n];if(!r)return;let i=this.#e[n];t=this.#A(e,n,t),r.hasChanged&&!r.hasChanged.call(this,t,i)||(xt.__skipCheck=!0,c(this,n,t),xt.__skipCheck=!1)})),$(this.#c,t),this.#k()}_initProps(t,e){this.#c=h(this.#c||{},t),this.#l=h({},e)}_bindSlot(t,e,s){if(this.#m[e]||(this.#m[e]=t,Object.defineProperty(t,"__l_comp",{value:this})),t.addEventListener("slotchange",(s=>{this.#v&&this.#T(t,"default"===e?"":e)})),!o(s)){let t=this.#t[e];t||(t=this.#t[e]={}),s.nodeFilter&&(t.filter=s.nodeFilter),t.props=X(s,"nodeFilter")}}_bindSlotHook(t,e){this.#u[t]=e}#M=new Set;_updateSlot(t,e,s){let n=this.#m[t],r=this.#u[t];if(!r&&!n)return;let i=this.#t[t];if(e&&(i.props||(i.props={}),i.props[e]=s),r)this.#M.add(t);else{let t=n.assignedElements({flatten:!0});u(t,(t=>{t.setAttribute(e,s+"")}))}}#b(){const t=q(this.childNodes,(t=>t.nodeType===Node.COMMENT_NODE?[]:t instanceof HTMLSlotElement?t.assignedNodes({flatten:!0}):t));let e=Y(t,(t=>t.nodeType===Node.TEXT_NODE?"default":t instanceof Element?t.getAttribute("slot")||"default":void 0));if(o(e))return void(o(this.#e["#slots"])||(this.#v?this.#s["#slots"]={}:this.#e["#slots"]={}));u(e,((t,e)=>{if(e){for(;t.length>0;){let e=t[0];if(!(e.nodeType===Node.TEXT_NODE&&k(e.textContent)||e instanceof HTMLSlotElement&&o(e.assignedNodes({flatten:!0}))))break;t.shift()}for(;t.length>0;){let e=m(t);if(!(e.nodeType===Node.TEXT_NODE&&k(e.textContent)||e instanceof HTMLSlotElement&&o(e.assignedNodes({flatten:!0}))))break;t.pop()}}}));let s={};u(e,((t,e)=>{o(t)||(s[e]=t)})),this.#v?this.#s["#slots"]=s:this.#e["#slots"]=s}#P(t){let e=this.#u[t];if(!e)return;let s=this.#t[t];if(!this.#e["#slots"][t])return;this.renderAsync(e,r(s,"props"));const n=this._asyncDirectives.get(e);let[i,a,l]=n?.renderContext(e(r(s,"props"))),c=J(R(i),(t=>t.nodeType===Node.COMMENT_NODE));if(c){let e=this.#_[t];o(e)||u(e,(t=>{t.parentNode?.removeChild(t)})),this.#_[t]=c,this.append(...c),this.#M.clear()}}_asyncDirectives=new WeakMap;renderAsync(t,...e){}#E(){o(this.#t)||u(this.slots,((t,n)=>{if(o(t))return;let r=this.#t[n],i=t;if(r){let n=r.filter;if(e(n))i=n(t);else if(s(n)){let e=n.type,s=n.maxCount;if(e){let s=b(e)?e:[e];i=Z(t,(t=>W(s,(e=>t instanceof e))))}s>0&&(i=tt(t,0,s))}}if("named"===this.#i.slotAssignment){let e=[];for(u(t,(t=>{i.includes(t)||e.push(t)}));e.length>0;){let t=e.pop();t.parentNode?.removeChild(t)}}else this.#m[n].assign(...i);this.#v&&this.#T(this.#m[n],"default"===n?"":n)}))}#C(t,e,s){if(!this.isMounted)return;if(Tt(this.constructor).has(t)){if(K(s)){s=r(this.constructor,"__deco_props")[t]._defaultValue}this._updateProps({[t]:s})}}_regDeps(t,e){let s=this.#a[t];s||(s=this.#a[t]=new Set),s.add(e);let n="",r=t.split("-");r.pop(),r.forEach((t=>{n=o(n)?t:n+"-"+t;let s=this.#a[n];s||(s=this.#a[n]=new Set),s.add(e)}))}}var Wt;!function(t){t.NONE="NONE",t.REMOVE="REMOVE",t.REPLACE="REPLACE",t.UPDATE="UPDATE",t.APPEND="APPEND"}(Wt||(Wt={}));class Kt{index;value;isText=!1;isTmpl=!1;isDirective=!1;node;textNode;isComponent=!1;attrName;attrTmpl;isProp=!1;isToggleProp=!1;eventName;constructor(t,e,s,n){this.index=t+"",this.node=e,s&&(this.attrName=s),n&&(this.attrTmpl=n)}}var Qt,Gt;!function(t){t.ATTR="attr",t.PROP="prop",t.TEXT="text",t.CLASS="class",t.STYLE="style",t.SLOT="slot",t.TAG="tag"}(Qt||(Qt={}));class Xt{startNode;endNode;type;attrName;varIndex;expressionChain;nodes;constructor(t,e,s,n){this.startNode=e,this.attrName=s,this.type=n}setVarIndex(t){this.varIndex=t}}!function(t){t.AFTER_BEGIN="afterbegin"}(Gt||(Gt={}));class qt extends Function{diClass;args;di;varPath;point;slotComponent;varChain;constructor(t,...e){super(),this.diClass=t,this.args=e,this.varChain=xt.popDirectiveQ()}checkScope(t){let e=r(this.diClass,"scopes");o(e)||G(e.join(","),t)||ct(`Directive '${this.diClass.name}' is out of scopes, expect '${e.join(",")}' bug got '${t}'`)}render(t){let e=r(t,"__directives"),s=this.di||e[this.varPath];s||(s=new this.diClass(this.point),s.renderComponent=t,s.slotComponent=this.slotComponent,s.renderParams=this.varChain),this.di=s,s._renderArgs=this.args;let[n,i,o]=s.renderContext(...this.args);return o?s.__expPosMap=o:i&&(s.__expPos=i),n}update(t,e,s){let n=this.di.update(t,e,s);if(n===Wt.REMOVE)t.forEach((t=>{t.parentNode?.removeChild(t)}));else if(n===Wt.REPLACE){let s=[];t.forEach((t=>{t.parentNode?.removeChild(t)}));let n=this.di.render(...e),[r,i,o]=this.di.renderContext(n);o?this.di.__expPosMap=o:i&&(this.di.__expPos=i),s=R(r);let a=document.createDocumentFragment();a.append(...s),this.point.endNode.parentNode.insertBefore(a,this.point.endNode)}else if(n===Wt.UPDATE){let s,n={},r={},i=[],a=[],l=this.di.render(...e);b(l)&&l[0]instanceof fe&&l.forEach((t=>{let e=t.key??t.getKey();n[e]="1",r[e]=t,a.push(e)})),t=Z(D(t),(t=>t.nodeType===Node.ELEMENT_NODE)),s=Z(D(R(s)),(t=>t.nodeType===Node.ELEMENT_NODE));let c={},d="",h={};M(t,(t=>{let e=t,s=e.getAttribute("key");if(s){if(c[s])return d=s,!1;c[s]=e,i.push(s),h[s]="1"}})),d&&ct(`${V(this.diClass.name)} - duplicate key '${d}'`);let p={},f=n;const _=this.point.startNode.parentNode;let g=[],v=[];if(u(h,((t,e)=>{f[e]||(v.push(e),delete h[e],S(i,e))})),!o(a)){let t="",e=-1,s=[],n={};a.forEach(((r,o)=>{let l=i.findIndex((t=>t===r));if(l>-1&&l!==o){if(e<0||e-l==1){let t=m(s);s.push({nodeId:r,targetId:0===o?Gt.AFTER_BEGIN:t?t.nodeId:a[o-1]})}else n[s.length]={group:s,targetId:""},s=[],s.push({nodeId:r,targetId:i[l]});e=l}else if(l<0){let e=t?c[t]||this.point.endNode:this.point.startNode;g.push({prevNode:e,newkey:r})}t=r})),o(n)&&s.length>0&&(n[s.length]={group:s,targetId:""});let r=Object.keys(n),l=r.map((t=>parseInt(t))).sort(((t,e)=>t-e));if(r.length<2&&r.length>0){let{group:t}=n[l[0]];N(t).forEach((({targetId:t,nodeId:e})=>{let s,n=c[e];t===Gt.AFTER_BEGIN?(s=this.point.startNode,s.after(n)):(s=c[t],s.after(n))}))}}g.forEach((t=>{let e=t.newkey,s=p[e]||this.#L(r[e],e),n=t.prevNode;n===this.point.endNode?n.before(s):(this.point.startNode,n.after(s))})),v.forEach((t=>{this.#O(t);let e=c[t];e&&_.removeChild(e)})),this.di.updateContext(l)}}getDirective(){return this.di}#L(t,e){let[s,n,r]=this.di.renderContext(t),i=et(s);return this.di.__expPosMap[e]=n,i}#O(t){this.di.__expPosMap[t]=null,delete this.di.__expPosMap[t]}}function Yt(t){return(...s)=>{let n=null;return s.forEach(((t,r)=>{if(e(t)){let e=t;s[r]=function(...t){let s=n.di;xt.startRender(s);let r=e(...t);return xt.endRender(s.renderComponent),r}}})),n=new qt(t,...s),n}}const Jt="@",Zt=".",te="?",ee="*",se=":",ne="ref",re=/[.?-a-z]+\s*=\s*(['"])\s*([^='"]*<\!--l_ui-pl_df-->){2,}.*?\1/ims,ie=/<\s*[a-z0-9-]+([^>]*<\!--l_ui-pl_df-->)*[^>]*?(?<!-)>/gims,oe="slot-props";function ae(t){let e="";(b(t)?t:[t]).forEach((({strings:t,vars:s})=>{let n=R(t);n[0]=st(n[0]),n[n.length-1]=nt(n[n.length-1]);let i=n.length-1;n.forEach(((t,n)=>{let o=r(s,n,"");o=i===n?"":le,e+=t+o}))}));let s=e.match(re);if(s){return ct(`Parse error: attribute value can be set only one interpolation —— \n ${rt(s[0],le,"${...}")}`),""}let n=0;return e=e.replace(ie,((t,e)=>rt(t,le,(()=>le.replace("--\x3e","")+n++)))),e}const le="\x3c!--l_ui-pl_df--\x3e",ce="\x3c!--l_ui-pl_df",de=/<!--l_ui-pl_df\d*(-->)?/;function he(t,s,n,r,o,l,c=0,d=""){const h=document.createElement("div");h.innerHTML=n;const p=document.createNodeIterator(h,NodeFilter.SHOW_ELEMENT|NodeFilter.SHOW_COMMENT);let m,_=0,v=null;for(;m=p.nextNode();)if(m instanceof HTMLElement||m instanceof SVGElement){m instanceof zt?v=m:v?.contains(m)||(v=null);let n={},i=R(m.attributes);u(i,(i=>{let{name:l,value:h}=i;if(l===oe){let t=m.name||"default";if(v){let e=v._slotsPropMap[t];e||(e=v._slotsPropMap[t]=[]),e.push(m)}}if(g(l,ce)){let e=r[_];if(e instanceof qt){e.checkScope(Qt.TAG);let n=new Xt(c,m,l.substring(1),Qt.TAG);e.point=n,e.varPath=d+_,e.slotComponent=v,s.push(e);let r=t[d+_]=new Kt(d+_,m);r.isDirective=!0,r.value=e,r.isComponent=!!v,_++}m.removeAttribute(l)}else{if(l[0]===Jt){let s=t=>{},n=null;if(de.test(h)){let i=r[_];if(!e(i))return void dt(m.tagName,`Event '${l}' must be a function`);s=i.bind(o),n=t[d+_]=new Kt(d+_,m,l.replace(/\.|\?|@/,""),h),n.isComponent=!!v,_++}let i=l.substring(1).split(".").shift();return s=Bt(l.substring(1),s,m,o),m.removeAttribute(l),void(n&&(n.eventName=i,n.value=s))}if(l!==ne)if(l[0]!==Zt||de.test(h)){if(de.test(h)){let e=r[_],o=t[d+_]=new Kt(d+_,m,l.replace(/\.|\?|@/,""),h);if(o.isComponent=!!v,l[0]===Zt||l[0]===te||l[0]===ee){if(e instanceof qt){e.checkScope(Qt.PROP),s.push(e);let t=new Xt(c,m,l.substring(1),Qt.PROP);e.varPath=d+_,e.point=t,e.slotComponent=v,o.value=e,o.isDirective=!0}else if(l[0]===te)o.isToggleProp=!0,o.value=!!e,o.value&&m.setAttribute(l.substring(1),"");else if(l[0]===ee){o.value=e;let t=l.substring(1);const[s,n]=t.split(se);let r=s;switch(n){case"camel":r=V(r);break;case"kebab":r=f(r);break;case"snake":r=it(r)}o.attrName=r,m.setAttribute(r,e)}else if(m instanceof zt||"SLOT"===m.tagName){let t=V(l.substring(1));t in m||"SLOT"===m.tagName||dt(m.tagName,`Prop '${l}' is not defined in ${m.tagName}`),o.value=e,o.isProp=!0,n[t]=e}else dt(m.tagName,`Prop '${l}' can only be set on a CompElem or a slot`),delete t[d+_];m.removeAttribute(l),e=""}else{if(o.value=e,e instanceof qt){let t=Qt.ATTR;"class"===l?t=Qt.CLASS:"style"===l&&(t=Qt.STYLE),e.checkScope(t),s.push(e),o.isDirective=!0;let n=new Xt(c,m,l,t);e.point=n,e.slotComponent=v,e.varPath=d+_,e=""}h=w(h,de,e),i.value=h}_++}}else dt(m.tagName,`Prop '${l}' must be an interpolation`);else{if(de.test(h)){let t=r[_];if(!a(t,"current"))return void dt(m.tagName,"Ref must be a RefObject");_++,t.current=m}m.removeAttribute(l)}}})),m instanceof zt?m._initProps(n):m instanceof HTMLSlotElement&&o._bindSlot(m,m.name||"default",n)}else{let e=m;if(`\x3c!--${e.nodeValue}--\x3e`!==le)continue;let n=t[d+_]=new Kt(d+_,m);n.isComponent=!!v,n.isText=!0;let a,h=r[_];if(a=document.createComment(`compelem-ui-${c}-${_}-child-start`),e.parentNode.insertBefore(a,e),e.nodeValue=`compelem-ui-${c}-${_}-child-end`,n.textNode=a,h instanceof qt){n.isDirective=!0,n.value=h;let t=v?Qt.SLOT:Qt.TEXT;s.push(h);let r=new Xt(c,a,"",t);r.endNode=e,h.point=r,h.slotComponent=v,h.varPath=d+_,h=""}else if(h instanceof fe){n.isTmpl=!0,n.value=h;let e=ae(h);h=he(t,s,e,h.vars,o,l,c,d+`${_}-`)}else n.value=h;if(_++,i(h))continue;if(h instanceof NodeList){let t=document.createDocumentFragment();t.append(...h),e.parentNode.insertBefore(t,e)}else if(h instanceof Element)e.parentNode.insertBefore(h,e);else if(U(h)){let t=document.createTextNode(h);e.parentNode.insertBefore(t,e)}}return h.childNodes}const pe={insertBefore:function(t,e){let s=document.createDocumentFragment();s.append(...e),t.parentNode.insertBefore(s,t)},remove:function(t,e){let s=t.nextSibling;for(;s!==e;)s?.parentNode?.removeChild(s),s=t.nextSibling}},ue=/\s+\.?key\s*=/;class fe{strings;vars;key;constructor(t,e){this.strings=l(t),this.vars=e}getKey(){let t=this.vars,e="";return u(this.strings,((s,n)=>{if(ue.test(s))return e=ot(t[n]),!1})),this.key=e,e}append(t){let e=m(this.strings);return t.strings.forEach(((t,s)=>{0!=s?this.strings.push(t):this.strings[this.strings.length-1]=e+t})),this.vars=l(this.vars,t.vars),this}getHTML(){let t="",e=R(this.strings);e[0]=st(e[0]),e[e.length-1]=nt(e[e.length-1]);let s=e.length-1;return e.forEach(((e,n)=>{let i=r(this.vars,n,"");i=i instanceof fe?i.getHTML():s===n?"":i,t+=e+i})),t}}function me(t,...e){return new fe(I(t)?[t]:t,e)}function _e(t){return{current:t}}function ge(t,e,s){s.get||ct(`Prop '${e}' must be a getter`),a(t.constructor,"__deco_computed")||(t.constructor.__deco_computed=o(t.constructor.__deco_computed)?{}:p(t.constructor.__deco_computed)),t.constructor.__deco_computed[e]={key:e,getter:s.get}}function ve(t,e){return(s,n,r)=>{a(s.constructor,"__deco_events")||(s.constructor.__deco_events=o(s.constructor.__deco_events)?[]:p(s.constructor.__deco_events)),s.constructor.__deco_events.push({name:t,options:e,fn:s[n]})}}var Ee;!function(t){t.ONCE="once",t.UPDATABLE="updatable"}(Ee||(Ee={}));class Ce extends ft{created(t,...e){}mounted(t,e,...s){}get targets(){return[ut.FIELD]}selector;cache;result;constructor(t,e){super(),this.selector=t,this.cache=e}static getKey(t){return t}getter(t){this.result=t.shadowRoot?.querySelector(this.selector)}propsReady(t,e,s,n,...r){const i=this;Object.defineProperty(t,n,{get:()=>(i.result&&i.cache||i.getter(t),i.result)})}updated(t,e){this.cache===Ee.UPDATABLE&&this.getter(t)}}const be=Ct(Ce),Ne=Ct(class extends Ce{getter(t){this.result=t.shadowRoot?.querySelectorAll(this.selector)}});function ye(t){if(1===arguments.length)return(e,s)=>{Pe(e,s,t)};Pe(arguments[0],arguments[1],{prop:""})}function Pe(t,e,s){if(!a(t.constructor,"__deco_states")){const e={};let s=t.constructor;for(;(s=pt(s))!==zt;)h(e,s.__deco_states?p(s.__deco_states):{});t.constructor.__deco_states=e}t.constructor.__deco_states[e]=s}function Te(t,e,s){Pe(t.prototype,e,s||{prop:""})}function xe(t){return e=>{e&&customElements.define(t,e)}}const Se=Ct(class extends ft{created(t,...e){}propsReady(t,e,...s){}get targets(){return[ut.METHOD]}sources;options;handler;constructor(t,e,s){super(),this.sources=b(t)?t:[t],this.options=e,this.handler=s}static getKey(t){return b(t)?t.sort().join(""):t}mounted(t,s,n,i,...o){this.handler||(this.handler=e(i)?i:t[i]);let a=this.handler,l=r(this.options,"immediate",!1);r(this.options,"once",!1)&&(a=x(a.bind(t)));let c=[];this.sources.forEach((e=>{let s=r(t,e.replaceAll("-","."));l&&c.push({handler:a,value:s,varPath:e})})),c.forEach((({handler:e,value:s,varPath:n})=>{e.call(t,r(t,n),s,n)}))}updated(t,e){this.sources.forEach((s=>{u(e,(({value:e,chain:n,oldValue:i,end:o},a)=>{let l=s.replaceAll(".","-");if(!g(a,l))return;a===l&&o&&this.handler&&this.handler.call(t,e,i,a);let c=n.length-1;for(;c;){let e=n.slice(0,c);if(o&&e.join("-")===l&&r(this.options,"deep")){let s=r(t,e);this.handler.call(t,s,s,e.join("-"))}c--}}))}))}});class Me extends(Ut(Object)){_renderArgs;static get scopes(){return[]}renderParams}const Ae=["key"];const ke=Yt(class extends Me{update(t,e,s){return Wt.NONE}static get scopes(){return[Qt.TAG]}constructor(t){super(),this.point=t}render(t){let e=this.point.startNode;if(e instanceof zt){let s={},n={};u(t,((t,r)=>{Ae.includes(r)||(r in e?s[r]=t:n[r]=t+"")})),e._initProps(s,n)}else u(t,((t,s)=>{e.setAttribute(s,t)}))}});const Le=Yt(class extends Me{update(t,e,s){return this.render(e[0]),Wt.NONE}static get scopes(){return[Qt.CLASS]}constructor(t){super(t),this.point=t}lastCls;render(t){let e=[];b(t)?e=D(t):s(t)?e=q(t,((t,e)=>t?e:[])):I(t)&&(e=t.split(" "));let n=this.point.startNode;u(this.lastCls,(t=>{n.classList.remove(t)})),u(e,(t=>{n.classList.add(t)})),this.lastCls=l(e)}}),Oe=/\s+\.?key\s*=/;const we=Yt(class extends Me{update(t,e,s){if(o(t)&&o(e[0]))return Wt.NONE;if(!o(this.renderParams)){let t=m(this.renderParams);b(t)||(t=[t]),this.renderParams=t}return Wt.UPDATE}constructor(t){super(),o(this.renderParams)||(this.renderParams=R(m(this.renderParams)))}static get scopes(){return[Qt.TEXT,Qt.SLOT]}render(t,e){let s=M(t,((t,s)=>e(t,s))),n=[],r=[];return s.forEach((t=>{let e=m(r),s=t.vars,i=!0;t.strings.forEach(((t,o)=>{if(Oe.test(t)){let t=s[o]+"";n.includes(t)&&ct(`forEach - duplicate key '${t}'`),n.push(t),i=!1}0==o&&e?r[r.length-1]=e+t:r.push(t)})),i&&ct("forEach - missing 'key' prop")})),s}});const De=Yt(class extends Me{ifNodes;elseNodes;static get scopes(){return[Qt.TEXT,Qt.SLOT]}update(t,e,s){return!!e[0]==!!s[0]?Wt.UPDATE:(e[0],Wt.REPLACE)}render(t,e,s){return t?e(t):s(t)}});const Re=Yt(class extends Me{static get scopes(){return[Qt.TEXT,Qt.SLOT]}update(t,e,s){return e[0]===s[0]?Wt.UPDATE:e[0]?Wt.REPLACE:(this.cacheNodes=t,Wt.REMOVE)}render(t,e){return t?e():me``}});var $e;!function(t){t.CHANGE="change",t.INPUT="input"}($e||($e={}));const je=Yt(class extends Me{update(t,e,s){if(this.modelPath||(this.modelPath=m(this.renderParams)),!_(e,s)){const t=this.point.startNode;if(t instanceof zt)t._updateProps({value:e[0]});else if(t instanceof HTMLTextAreaElement||t instanceof HTMLSelectElement)t.setAttribute("value",e[0]+"");else if(t instanceof HTMLInputElement)switch(t.type){case"checkbox":case"radio":e[0]?t.setAttribute("checked",""):t.removeAttribute("checked");break;default:t.setAttribute("value",e[0]+"")}}return Wt.NONE}static get scopes(){return[Qt.TAG]}modelPath;point;constructor(t){super(),this.point=t}render(e,n){this.modelPath||(this.modelPath=m(this.renderParams)),n&&(this.modelPath=t(n));const i=this.point.startNode;if("binded"!==r(i,"_model"))if(s(e)||U(e)||(e=""),i instanceof zt)i._initProps({value:e}),i.addEventListener("update:value",(t=>{c(this.renderComponent,this.modelPath,t.detail.value)})),c(i,"_model","binded");else if(i instanceof HTMLTextAreaElement)i.setAttribute("value",e+""),i.addEventListener("input",(t=>{let e=t.target;c(this.renderComponent,this.modelPath,e.value)})),c(i,"_model","binded");else if(i instanceof HTMLInputElement){let t="",s="";switch(i.type){case"checkbox":case"radio":t="checked",s="change";break;default:t="value",s="input"}i.setAttribute(t,e+""),i.addEventListener(s,(t=>{let e=t.target;c(this.renderComponent,this.modelPath,e.value)})),c(i,"_model","binded")}else i instanceof HTMLSelectElement&&(i.setAttribute("value",e+""),i.addEventListener("change",(t=>{let e=t.target;c(this.renderComponent,this.modelPath,e.value)})),c(i,"_model","binded"))}});const Ie=Yt(class extends Me{update(t,e,s){return this.render(e[0]),Wt.NONE}display=void 0;static get scopes(){return[Qt.TAG]}constructor(t){super(),this.point=t}render(t){let e=this.point.startNode;i(this.display)&&(this.display=e.style.display),this.renderComponent.nextTick((()=>{e.style.display=t?this.display:"none"}))}});const He=Yt(class extends Me{update(t,e,s){return Wt.NONE}static get scopes(){return[Qt.SLOT]}render(t,e){return t=t.bind(this.renderComponent),this.slotComponent._bindSlotHook(e||"default",t),t}});const Be=Yt(class extends Me{update(t,e,s){return this.render(e[0]),Wt.NONE}constructor(t){super(),this.point=t}static get scopes(){return[Qt.STYLE]}render(t){let e="";s(t)?e=L(M(t,((t,e)=>f(e)+":"+t)),";"):I(t)&&(e=t),u(e.split(";"),(t=>{let e=t.split(":");this.point.startNode.style.setProperty(U(e[0]),U(e[1]))}))}});const Ue=Yt(class extends Me{update(t,e,s){return _(e,s)||this.targetComponent._updateProps({[this.attrName]:e[0]}),Wt.NONE}static get scopes(){return[Qt.PROP]}modelPath;attrName;targetComponent;constructor(t){super(),this.targetComponent=t.startNode,this.attrName=t.attrName}render(t){this.modelPath||(this.modelPath=m(this.renderParams)),this.targetComponent._initProps({[this.attrName]:t}),this.targetComponent.addEventListener("update:"+this.attrName,(t=>{c(this.renderComponent,this.modelPath,t.detail.value)}))}});const Fe=Yt(class extends Me{static get scopes(){return[Qt.TEXT,Qt.SLOT]}update(t,e,s){return _(e,s)?Wt.NONE:Wt.REPLACE}render(t,s){let n=()=>me``,r=[],i=[];u(s,((t,s)=>{if(e(t))r.push(s),i.push(t);else{let e=t[0],s=t[1];r.push(e),i.push(s)}"default"===s&&(n=t)}));let o=at(r,(s=>e(s)?s(t):s==t));return lt(i[o]??n)}});export{zt as CompElem,ft as Decorator,ut as DecoratorType,vt as DecoratorWrapper,Me as Directive,Wt as DirectiveUpdateTag,qt as DirectiveWrapper,Xt as EnterPoint,Qt as EnterPointType,Kt as ExpPos,mt as GetKeyFnName,$e as ModelTriggerType,Ee as QueryCache,fe as Template,gt as _DecoratorMap,_t as _DecoratorsKey,Tt as _getObservedAttrs,ke as bind,ae as buildHTML,Le as classes,ge as computed,_e as createRef,Ct as decorator,Yt as directive,ve as event,we as forEach,me as html,De as ifElse,Re as ifTrue,Te as makeState,je as model,Nt as prop,be as query,Ne as queryAll,Ie as show,He as slot,ye as state,Be as styles,Ue as sync,xe as tag,Se as watch,Fe as when};
+  import{toPath as e,isFunction as t,isObject as s,isDefined as r,get as n,isUndefined as i,isEmpty as o,has as a,concat as l,defaults as c,merge as d,cloneDeep as h,each as u,kebabCase as p,last as f,isEqual as m,startsWith as _,includes as g,clone as v,isElement as E,isArray as C,initial as b,find as N,debounce as y,throttle as P,once as T,remove as x,map as S,size as M,isBlank as A,join as k,split as O,set as L,replace as w,compact as D,toArray as R,assign as j,first as $,isString as I,closest as H,bind as B,trim as U,omitBy as F,camelCase as V,isNil as z,some as W,isNull as K,fval as Q,test as G,omit as X,flatMap as q,groupBy as Y,reject as J,filter as Z,slice as ee,head as te,trimStart as se,trimEnd as re,replaceAll as ne,snakeCase as ie,toString as oe,findIndex as ae,call as le}from"myfx";function ce(e){console.error("[CompElem]",e)}function de(e,t){console.error(`[CompElem <${e}>]`,t)}function he(t){return e(t).join("-")}function ue(e){return Object.getPrototypeOf(e)}var pe;!function(e){e.CLASS="class",e.FIELD="field",e.METHOD="method"}(pe||(pe={}));class fe{static call(e,s,r,...n){if(ge.get(s)){s(...n)(e,r,t(r)?{configurable:!0}:null).create(e)}else s(e,r,...n)}}const me="getKey",_e="__decorators",ge=new WeakMap;class ve{args;metadata;decoratorClass;instanceMap;key;constructor(e,t,s){this.args=e,this.metadata=t,this.decoratorClass=s,this.instanceMap=new WeakMap}create(e){let t,a=new this.decoratorClass(...this.args),l=a.targets,c=this.metadata[2];s(c)&&r(n(c,"configurable"))?t=pe.METHOD:i(this.metadata[2])&&(t=pe.FIELD),!o(l)&&t&&l.includes(t)?(a.created(e,...this.metadata),this.instanceMap.set(e,a)):ce(`Decorator '${this.decoratorClass.name}' is out of targets, expect '${l.join(",")}' bug got '${t}'`)}propsReady(e,t){this.instanceMap.get(e).propsReady(e,t,...this.metadata)}mounted(e,t){this.instanceMap.get(e).mounted(e,t,...this.metadata)}updated(e,t){this.instanceMap.get(e).updated(e,t)}}const Ee=new WeakMap;function Ce(e){let t=(...t)=>(...s)=>{let r=s[0].constructor,i=n(r,_e);if(!a(r,_e)){let e=n(Object.getPrototypeOf(r),_e);i=e?l(e):[],Object.defineProperty(r,_e,{configurable:!1,enumerable:!1,value:i})}let o,c={},d=n(e,me);if(d){let s=Ee.get(e);if(s||(s=new WeakMap,Ee.set(e,s)),c=s.get(r),c||(c={},s.set(r,c)),o=d(...t),c[o])return c[o]}let h=new ve(t,s,e);return c[o]=h,i?.push(h),h};return ge.set(t,!0),t}const be=new WeakMap;function Ne(e){if(1===arguments.length)return(t,s,r)=>{e.required=e.required||!1,e.attribute=!1!==e.attribute,ye(t,s,e,r)};let t=arguments[0],s=arguments[1],r=arguments[2];e={type:void 0,required:!1,attribute:!0},r&&"function"==typeof r.type&&(e=c(r,e),r=void 0),ye(t,s,e,r)}function ye(e,t,s,r){let n;if(/[a-z]/.test(t[0])||ce(`Prop '${t}' must be in CamelCase`),!a(e.constructor,"__deco_props")){const t={};let s=e.constructor;for(;(s=ue(s))!==We;)d(t,s.__deco_props?h(s.__deco_props):{});Object.defineProperty(e.constructor,"__deco_props",{configurable:!1,enumerable:!1,value:t}),n=new Set,u(t,((e,t)=>{if(e.attribute){let e=p(t);n?.add(e)}})),be.set(e.constructor,n)}if(r&&(r.get&&(s.getter=r.get),r.set&&(s.setter=r.set)),s.attribute){n||(n=be.get(e.constructor));let s=p(t);n?.add(s)}e.constructor.__deco_props[t]=s}const Pe=new Set;function Te(e){return be.get(e)??Pe}const xe={startCss(e){this.__cssCollecting=e},endCss(){this.__cssCollecting=null},setCssUpdater(e){this.__cssUpdater=e},startCompute(e){this.__computeCollecting=e},endCompute(){this.__computeCollecting=null},setComputedProp(e){this.__computeUpdater=e},__computeCollecting:null,__computeUpdater:null,__cssCollecting:null,__cssUpdater:null,__directiveQ:[],setDirectiveQ(e){let t=f(this.__directiveQ);t&&m(t,e)||(t&&t.length<e.length&&_(e.join(","),t.join(","))?this.__directiveQ[this.__directiveQ.length-1]=e:this.__directiveQ.push(e))},popDirectiveQ(){let e=l(this.__directiveQ);return this.__directiveQ=[],e},startRender(e){this.__renderCollecting=!0,this.__renderContext=e},endRender(e){this.__renderCollection.forEach((t=>{e._regDeps(t,this.__renderContext)})),this.__renderCollection.clear(),this.__renderCollecting=!1,this.__renderContext=null},collect(e){this.__renderCollection.add(e)},clear(){this.__directiveQ=[]},__renderCollection:new Set,__renderContext:null,__renderCollecting:!1,__skipCheck:!1},Se=new WeakMap,Me=new WeakMap,Ae=new WeakMap,ke=new WeakMap;function Oe(e,r){if(!s(e))return e;const i=e.__proxy?e:new Proxy(e,{get(e,t,s){const r=Object.keys(e),n=Reflect.get(e,t,s);if(!g(r,t))return n;if(e.hasOwnProperty(t)){let e=Me.get(s)??[],r=l(e,[t]),n=r.join("-");if(xe.__renderCollecting)xe.collect(he(r)),xe.setDirectiveQ(r);else if(xe.__computeCollecting){let e=Ae.get(xe.__computeCollecting);e||(e={},Ae.set(xe.__computeCollecting,e));let t=e[n];t||(t=e[n]=[]),t.push(xe.__computeUpdater)}else if(xe.__cssCollecting){let e=ke.get(xe.__cssCollecting);e||(e={},ke.set(xe.__cssCollecting,e)),e[n]=xe.__cssUpdater}}return n},set(e,r,i,o){let a=Se.get(o).from,c=n(a.constructor,"__deco_props");c&&c[r]&&e.__isData&&c[r].sync&&a.emit("update:"+r,{value:i});let d=e[r],h=n(a.constructor,"__deco_states"),u=n(c,[r,"hasChanged"])||n(h,[r,"hasChanged"]);if(u){if(!u.call(a,i,d))return!1}else{if(e[r]===i)return!0;if(Number.isNaN(i)&&Number.isNaN(e[r]))return!1}s(d)&&(d=v(d));let p=Se.get(o)?.contextSet,f=Me.get(o)??[],m=l(f,[r]),_=i;!s(i)||t(i)||E(i)||p.forEach((e=>{let t=Se.get(o)?.pathMap,s=t?.get(e);s&&(m=l(s,[r]),Me.set(_,m),_=Oe(_,e),Me.set(_,m))}));let g=Reflect.set(e,r,_),b=Se.get(o).pathMap;return p.forEach((e=>{let t=b.get(e);if(!t)return;m=l(t,"length"==r&&C(o)?[]:[r]),e._notify(d,m);let s=m.join("-"),n=Ae.get(e);if(n){let t=n[s];t&&t.forEach((t=>{t.call(e)}));let r=m.length-1;for(;r;){let t=n[m.slice(0,r).join("-")];t&&t.forEach((t=>{t.call(e)})),r--}}let i=ke.get(e);if(i){let t=i[s];t&&t.call(e);let r=m.length-1;for(;r;){let t=i[m.slice(0,r).join("-")];t&&t.call(e),r--}}})),g}});e.__proxy||Object.defineProperty(e,"__proxy",{enumerable:!1,writable:!1,configurable:!1,value:!0});let o=Me.get(e)??[];if(Object.isExtensible(e)&&!Se.get(i)){let e=new Set;e.add(r);let t=new WeakMap;t.set(r,o),Se.set(i,{from:r,contextSet:e,pathMap:t})}else{Se.get(i).contextSet.add(r);let e=Se.get(i).pathMap,t=e.get(r),s=l(o);if(t&&t.join("")!==s.join("")){let e=n(r,b(t));C(e)||function(...e){console.warn("[CompElem]",...e)}(`The object is referenced by more than one @state '${s.join(".")},${t.join(".")}'`),t=s}else e.set(r,s)}for(let n in e){const i=e[n];!s(i)||t(i)||E(i)||i instanceof Text||(Me.set(i,l(o,[n])),e[n]=Oe(i,r),Me.set(e[n],l(o,[n])))}return i}const Le=["resize","outside"],we=new WeakMap,De=[],Re=new ResizeObserver((e=>{for(const t of e){const e=Array.isArray(t.contentBoxSize)?t.contentBoxSize[0]:t.contentBoxSize,s=Array.isArray(t.borderBoxSize)?t.borderBoxSize[0]:t.borderBoxSize;let r=we.get(t.target);if(r){r(new CustomEvent("resize",{bubbles:!1,cancelable:!1,detail:{borderBox:{w:s.inlineSize,h:s.blockSize},contentBox:{w:e.inlineSize,h:e.blockSize}}}))}}}));function je(e,t,s,r){if("resize"===e)!function(e,t){we.set(e,t),Re.observe(e)}(t,s);else if("outside"===e&&"mousedown"===r[0])!function(e,t){De.push([e,t])}(t,s)}document.addEventListener("mousedown",(e=>{let t=e.target;De.forEach((([s,r])=>{if(!s.contains(t)){r(new CustomEvent("outside",{bubbles:!1,cancelable:!1,detail:{currentTarget:s,event:e}}))}}))}),!1);const $e=/,|^(debounce:.+)|(debounce$)/,Ie=/,|^(throttle:.+)|(throttle$)/,He={esc:"escape"};function Be(e,t,s,r){let n,i=e.split("."),o=i.shift(),a=i.includes("once"),l=t;if(n=N(i,(e=>$e.test(e)))){let e=n.split(":");l=y(l,parseInt(e[1])||100)}if(n=N(i,(e=>Ie.test(e)))){let e=n.split(":");l=P(l,parseInt(e[1])||100)}if(a&&(l=T(l)),function(e){return Le.includes(e)}(o))return je(o,s,l,i),l;let c=e=>{if(i.includes("prevent")&&e.preventDefault(),i.includes("stop")&&e.stopPropagation(),!i.includes("self")||e.target===e.currentTarget){if(e instanceof MouseEvent){if(i.includes("left")&&0!=e.button)return;if(i.includes("right")&&2!=e.button)return;if(i.includes("middle")&&1!=e.button)return}else if(e instanceof KeyboardEvent){if(x(i,(e=>"ctrl"==e))[0]&&!e.ctrlKey)return;if(x(i,(e=>"alt"==e))[0]&&!e.altKey)return;if(x(i,(e=>"shift"==e))[0]&&!e.shiftKey)return;if(x(i,(e=>"meta"==e))[0]&&!e.metaKey)return;if(!S(i,(e=>He[e]||e)).includes(e.key.toLowerCase()))return}l(e)}};s.addEventListener(o,c);let d=r.__events[o];return d||(d=r.__events[o]=[]),d.push([s,c]),c}function Ue(e){return class extends e{render(...e){}__expPos={};__expPosMap={};__directives={};slotComponent;renderComponent;renderContext(...e){return Fe.call(this,...e)}updateContext(...e){let t=1==M(e)&&(C(e[0])&&e[0][0]instanceof mt||e[0]instanceof mt)?e[0]:this.render(...e);t instanceof mt?this.__updateExpPos(t,this.__expPos):C(t)&&t[0]instanceof mt&&t.forEach(((e,t)=>{this.__updateExpPos(e,this.__expPosMap[e.key??e.getKey()])}))}__updateExpPos(e,t){if(A(k(e.strings)))return;let{vars:r}=e;t&&Object.values(t).forEach((e=>{let t=e.index,i=e.value,a=r,l=e.node,c=O(t,"-");if(c.forEach(((e,t)=>{a=n(a,e),a&&a.vars&&t<c.length-1&&(a=a.vars)})),!s(i)&&i===a)return;let d=l;if(e.isDirective){a.di=i.di,a.di.renderParams=a.varChain,a.di._renderArgs=a.args,a.point=i.point,a.varPath=i.varPath;let e=function(e,t){let s=e.nextSibling;if(!t)return[s];let r=[];for(;s&&s!==t;)r.push(s),s=s?.nextSibling;return r}(a.point.startNode,a.point.endNode);a.update(e,a.args,i.args)}else if(e.isToggleProp){if(!!a===i)return;d.toggleAttribute(e.attrName,!!a),L(d,e.attrName,!!a)}else if(e.isProp){if(!s(a)&&a===i)return;if(s(a)&&m(a,i))return;l instanceof We?l._updateProps({[e.attrName]:a}):l instanceof HTMLSlotElement&&this.renderComponent._updateSlot(l.getAttribute("name")||"default",e.attrName,a)}else if(e.eventName)d.removeEventListener(e.eventName,i),a=a.bind(this.renderComponent),a=Be(e.attrName,a,d,this.renderComponent);else if(e.attrName){if(!m(i,a))switch(e.attrName){case"value":if(l instanceof HTMLInputElement){l.value=a;break}default:l.setAttribute(e.attrName,w(e.attrTmpl,ht,a+""))}}else if(e.isTmpl){if(!m(a,i)){let[t,s,r]=Fe.call(this,a);o(s)?(pt.remove(e.textNode,e.node),pt.insertBefore(e.node,t)):this.__updateExpPos(a,s)}}else if(e.isText){let t=e.textNode.nextSibling;t&&t===e.node.previousSibling?t.textContent=a:(pt.remove(e.textNode,e.node),pt.insertBefore(e.node,[a]))}e.value=a}))}}}function Fe(...e){let t,s,r,n=1===e.length&&e[0]instanceof mt?e[0]:this.render(...e),i=[];if(n instanceof mt){let e=lt(n);s={},t=ut(s,i,e,n.vars,this.renderComponent)}if(C(n)&&n[0]instanceof mt){let e=[];r={},n.forEach((s=>{let n=lt(s),o={};t=ut(o,i,n,s.vars,this.renderComponent),e.push(...t),r[s.key??s.getKey()]=o})),t=e}else n instanceof Function&&this.slotComponent._asyncDirectives.set(n,this);return i.length<1||i.forEach((e=>{let t=D(R(e.render(this.renderComponent)));if(!o(t)){let s=document.createDocumentFragment();s.append(...t),e.point.endNode.parentNode.insertBefore(s,e.point.endNode)}})),[t,s,r]}const Ve={boolean:Boolean,string:String,number:Number,object:Object,array:Array,function:Function,bigint:BigInt,symbol:Symbol,undefined:Object},ze=new WeakMap;class We extends(Ue(HTMLElement)){static __l_globalRule=document.createElement("style");static{document.head.appendChild(We.__l_globalRule)}#e={};#t={"#slots":{}};#s={};#r;#n={};#i;#o;#a={};__events={};get reactiveData(){return this.#s}get attrs(){return this.#l}get props(){return this.#c}get renderRoot(){return this.#d}get renderRoots(){return this.#h}get parentComponent(){return this.#u}get slotHooks(){return this.#p}get styles(){return ze.get(this.constructor)}get isMounted(){return this.#f}get slots(){return this.#t["#slots"]}#l;#c;#d;#h;#u;#m={};#p={};#_={};#f=!1;#g=new CSSStyleSheet;static get autoSlot(){return!0}static get styles(){return[]}static get globalStyles(){return[]}get css(){return""}#v=!1;constructor(...e){super(),1===M(e)&&(this.#c={},j(this.#c,$(e))),this.renderComponent=this;let t=this.render;this.render=()=>{let e;return xe.startRender(this),e=t.call(this),xe.endRender(this.renderComponent),e};let s=n(this.constructor,"globalStyles"),r=n(this.constructor,"_global_style_attached");if(!o(s)&&"1"!==r){let e="";u(s,(t=>{I(t)&&(e+=t+"\n")})),We.__l_globalRule.textContent+=e,L(this.constructor,"_global_style_attached","1")}let i=ze.get(this.constructor),a=i??[];i||(u(n(this.constructor,"styles"),(e=>{if(I(e)){let t=new CSSStyleSheet;t.replace(e),a.push(t)}else a.push(e)})),ze.set(this.constructor,a)),this.#i=this.attachShadow({mode:"open",slotAssignment:n(this.constructor,"autoSlot",!0)?"named":"manual"}),this.#i.adoptedStyleSheets=l(a,this.#g);let c=this.attributes.getNamedItem("css-link")?.value;if(c){const e=document.createElement("style");e.textContent=`@import "${c}"`,this.#i.appendChild(e)}let d=y(this.#E,20);this.#o=new MutationObserver((e=>{e.forEach((e=>{"childList"===e.type?d.call(this):"attributes"===e.type&&e.attributeName&&this.#C(e.attributeName,e.oldValue,this.getAttribute(e.attributeName))}))})),this._slotsPropMap={default:[]};let h=n(this.constructor,_e);u(h,(e=>{e.create(this)}))}connectedCallback(){let e=H(this.parentNode,(e=>e instanceof We||e.host instanceof We),"parentNode");this.#u=e?e instanceof We?e:e.host:null,this.connected(),this.__init()}disconnectedCallback(){this.#o.disconnect()}__init(){if(this.#v)return;this.#b(),this.#N(),this.#y(),u(this.#t,((e,t)=>{let s=Reflect.getOwnPropertyDescriptor(this.#t,t);Object.defineProperty(this,t,{get(){let e=Reflect.get(this.#s,t);return s?.get?s?.get():e},set(e){s?.set?s?.set(e):Reflect.set(this.#s,t,e)}})})),Object.defineProperty(this.#t,"__isData",{enumerable:!1,value:!0}),this.#s=Oe(this.#t,this);const e=this;let s=n(this.constructor,_e);u(s,(t=>{t.propsReady(this,((t,s)=>(e.#s[t]=s,e.#s[t])))})),this.propsReady();let r=n(this.constructor,"__deco_computed");u(r,(({key:e,getter:t},s)=>{xe.startCompute(this),xe.setComputedProp((()=>{this.#s[s]=t.call(this)})),this.#t[s]=t.call(this),xe.endCompute()})),u(r,((e,t)=>{Object.defineProperty(this,t,{get(){return Reflect.get(this.#s,t)},set(e){de(this.tagName,"Cannot set a computed property '"+t+"'")}})}));let[i,o,a]=this.renderContext();if(this.__expPos=o,i){let e=R(i);u(e,(e=>{this.#i.appendChild(e)})),this.#h=e,this.#d=e[0]}this.#E(),this.#o.observe(this,{childList:!0,attributes:!0});let l=n(this.constructor,"__deco_events");u(l,(e=>{let s=e.name,r=j({target:document,once:!1,passive:!1,capture:!1},e.options),n=B(e.fn,this),i=r.target;t(i)&&(i=i.call(this,this)),i.addEventListener(s,n,r)})),u(this.#p,((e,t)=>{this.#P(t)})),xe.startCss(this),xe.setCssUpdater((()=>{let e=this.css;this.#g.replace(e)}));let c=this.css;U(c)&&this.#g.replace(c),xe.endCss(),setTimeout((()=>{this.#f=!0,this.mounted(),u(s,(t=>{t.mounted(this,((t,s)=>(e.#s[t]=s,e.#s[t])))}))}),0),this.#v=!0}connected(){}propsReady(){}render(){throw Error(`[CompElem <${this.tagName}>] Missing render()`)}mounted(){}#T(e,t){this.#b();let s=n(this.#e[t],"props");s&&u(this.slots,((e,t)=>{e.filter((e=>e.nodeType===Node.ELEMENT_NODE)).forEach((e=>{e instanceof We?e._updateProps(s):u(s,((t,s)=>{if(e instanceof HTMLSlotElement){let r=n(e,"__l_comp");if(r){let n=e.name||"default",i=r.#e[n];i||(i=r.#e[n]={props:{}}),i.props||(i.props={}),i.props[s]=t,r.#T(e,n)}}else e.setAttribute(s,t)}))}))})),this.slotChange(e,t)}slotChange(e,t){}shouldUpdate(e){return!0}updated(e){}emit(e,t={},s){s&&s.event&&(t.event=s.event),t.target=this,this.dispatchEvent(new CustomEvent(e,{bubbles:n(s,"bubbles",!1),composed:n(s,"composed",!1),cancelable:!0,detail:t}))}#x={};on(e,t){this.#x[e]||(this.#x[e]=[]);let s=t.bind(this);this.#x[e].push(s),this.addEventListener(e,s)}nextTick(e){requestAnimationFrame(e)}forceUpdate(){u(this.#s,((e,t)=>{this.#n[t]={value:void 0,chain:void 0}})),this.#S()}_notify(e,t){let s=[];u(t,(r=>{s.push(r);let i=n(this,s),o=he(s);this.#n[o]={value:i,chain:"slots"===o?["slots"]:s,oldValue:e,end:s.length===t.length}})),this.#r&&clearTimeout(this.#r),this.#r=setTimeout(this.#S.bind(this),10)}#S(){const e=Object.seal(v(F(this.#n,((e,t)=>"#"===t[0]))));let t=n(this.constructor,_e);if(u(t,(t=>{t.updated(this,e)})),!this.shouldUpdate(e))return;let s=new Set;u(this.#n,(({value:e,chain:t,oldValue:r},n)=>{this.#a[n]&&this.#a[n].forEach((e=>{s.add(e)}))})),s.forEach((e=>{e.updateContext(...e._renderArgs?e._renderArgs:[])})),u(this.#M,(e=>{this.#P(e)})),this.updated(e),this.#n={}}#N(){let e=n(this.constructor,"__deco_props"),t=this.attributes,o=this.tagName,l=this.#c,c={};u(t,(({name:t,value:s})=>{if(t[0]===Ze||t[0]===et||t[0]===tt||t===nt||"slot"===t)return;let r=V(t);e&&!e[r]&&(c[t]=s)})),this.#l=this.#l?j(this.#l,c):c,u(e,((c,d)=>{let h,u=e[d],f=a(l,d),m=n(this,d);if(!("_defaultValue"in u)&&(u._defaultValue=m,!u.type)){i(m)&&de(o,"Prop '"+d+"' has neither propType nor defaultValue be used for type inference");let e=typeof m;C(m)&&(e="array");let t=Ve[e];u.type=t}if(f)h=z(l[d])?m:l[d];else{h=m;let e=t.getNamedItem(p(d))||t.getNamedItem(et+p(d));e&&(f=!0,h=e.value)}if(u.required&&!f)return de(o,"Prop '"+d+"' is required"),!1;h=this.#A(e,d,h);let _=n(e,[d,"getter"]);_&&(_=B(_,this));let g=n(e,[d,"setter"]);g&&(g=B(g,this)),(_||g)&&Object.defineProperty(this.#t,d,{set:g||function(e){},get:_}),u.attribute&&r(h)&&!s(h)&&this.setAttribute(p(d),U(h)),this.#t[d]=h}))}#A(e,t,s){let n=e[t];if(!n)return s;let o=n.isValid,a=n.type,l=C(a)?a:[a],c=n.converter,d=s;if(!W(l,(e=>e===String))&&I(d)&&!K(d))try{d=c?c(d):Q(d,{html:_t})}catch(e){de(this.tagName,`Convert attribute '${t}' error with `+d)}l.forEach((e=>{"Boolean"===e.name&&(I(d)&&/(?:^true$)|(?:^false$)/.test(d)?d=Q(d):(i(d)||A(d))&&(d=!0))}));let h=typeof d,p=!r(d);return u(l,(e=>{if(G(h,e.name,"i")||d instanceof e)return p=!0,!1})),p||de(this.tagName,`Invalid prop '${t}'. expected '${l.map((e=>e.name||e))}' but got '${h}'`),o&&(o.call(this,d,this.#t)||de(this.tagName,`Invalid prop '${t}'. IsValid() check failed`)),d}#y(){let e=n(this.constructor,"__deco_states");u(e,((t,s)=>{let r=e[s],i=n(this,s);if(r){let e=r.prop;i=e?h(this.#t[e]):n(this,s)}this.#t[s]=i}))}#k=y(this.propsReady,100);_setParentProps(e,t){if(this.#v){let s=n(this.constructor,"__deco_props");u(e,((e,t)=>{let r=V(t),n=s[r];if(!n)return;let i=this.#t[r];e=this.#A(s,r,e),n.hasChanged&&!n.hasChanged.call(this,e,i)||(this.#t[r]=e,this._notify(i,[r]))})),j(this.#c,e),j(this.#l,t),this.#k()}}_updateProps(e){let t=n(this.constructor,"__deco_props");u(e,((e,s)=>{let r=V(s),n=t[r];if(!n)return;let i=this.#t[r];e=this.#A(t,r,e),n.hasChanged&&!n.hasChanged.call(this,e,i)||(xe.__skipCheck=!0,L(this,r,e),xe.__skipCheck=!1)})),j(this.#c,e),this.#k()}_initProps(e,t){this.#c=d(this.#c||{},e),this.#l=d({},t)}_bindSlot(e,t,s){if(this.#m[t]||(this.#m[t]=e,Object.defineProperty(e,"__l_comp",{value:this})),e.addEventListener("slotchange",(s=>{this.#v&&this.#T(e,"default"===t?"":t)})),!o(s)){let e=this.#e[t];e||(e=this.#e[t]={}),s.nodeFilter&&(e.filter=s.nodeFilter),e.props=X(s,"nodeFilter")}}_bindSlotHook(e,t){this.#p[e]=t}#M=new Set;_updateSlot(e,t,s){let r=this.#m[e],n=this.#p[e];if(!n&&!r)return;let i=this.#e[e];if(t&&(i.props||(i.props={}),i.props[t]=s),n)this.#M.add(e);else{let e=r.assignedElements({flatten:!0});u(e,(e=>{e.setAttribute(t,s+"")}))}}#b(){const e=q(this.childNodes,(e=>e.nodeType===Node.COMMENT_NODE?[]:e instanceof HTMLSlotElement?e.assignedNodes({flatten:!0}):e));let t=Y(e,(e=>e.nodeType===Node.TEXT_NODE?"default":e instanceof Element?e.getAttribute("slot")||"default":void 0));if(o(t))return void(o(this.#t["#slots"])||(this.#v?this.#s["#slots"]={}:this.#t["#slots"]={}));u(t,((e,t)=>{if(t){for(;e.length>0;){let t=e[0];if(!(t.nodeType===Node.TEXT_NODE&&A(t.textContent)||t instanceof HTMLSlotElement&&o(t.assignedNodes({flatten:!0}))))break;e.shift()}for(;e.length>0;){let t=f(e);if(!(t.nodeType===Node.TEXT_NODE&&A(t.textContent)||t instanceof HTMLSlotElement&&o(t.assignedNodes({flatten:!0}))))break;e.pop()}}}));let s={};u(t,((e,t)=>{o(e)||(s[t]=e)})),this.#v?this.#s["#slots"]=s:this.#t["#slots"]=s}#P(e){let t=this.#p[e];if(!t)return;let s=this.#e[e];if(!this.#t["#slots"][e])return;this.renderAsync(t,n(s,"props"));const r=this._asyncDirectives.get(t);let[i,a,l]=r?.renderContext(t(n(s,"props"))),c=J(R(i),(e=>e.nodeType===Node.COMMENT_NODE));if(c){let t=this.#_[e];o(t)||u(t,(e=>{e.parentNode?.removeChild(e)})),this.#_[e]=c,this.append(...c),this.#M.clear()}}_asyncDirectives=new WeakMap;renderAsync(e,...t){}#E(){o(this.#e)||u(this.slots,((e,r)=>{if(o(e))return;let n=this.#e[r],i=e;if(n){let r=n.filter;if(t(r))i=r(e);else if(s(r)){let t=r.type,s=r.maxCount;if(t){let s=C(t)?t:[t];i=Z(e,(e=>W(s,(t=>e instanceof t))))}s>0&&(i=ee(e,0,s))}}if("named"===this.#i.slotAssignment){let t=[];for(u(e,(e=>{i.includes(e)||t.push(e)}));t.length>0;){let e=t.pop();e.parentNode?.removeChild(e)}}else this.#m[r].assign(...i);this.#v&&this.#T(this.#m[r],"default"===r?"":r)}))}#C(e,t,s){if(!this.isMounted)return;if(Te(this.constructor).has(e)){if(K(s)){s=n(this.constructor,"__deco_props")[e]._defaultValue}this._updateProps({[e]:s})}}_regDeps(e,t){let s=this.#a[e];s||(s=this.#a[e]=new Set),s.add(t);let r="",n=e.split("-");n.pop(),n.forEach((e=>{r=o(r)?e:r+"-"+e;let s=this.#a[r];s||(s=this.#a[r]=new Set),s.add(t)}))}}var Ke;!function(e){e.NONE="NONE",e.REMOVE="REMOVE",e.REPLACE="REPLACE",e.UPDATE="UPDATE",e.APPEND="APPEND"}(Ke||(Ke={}));class Qe{index;value;isText=!1;isTmpl=!1;isDirective=!1;node;textNode;isComponent=!1;attrName;attrTmpl;isProp=!1;isToggleProp=!1;eventName;constructor(e,t,s,r){this.index=e+"",this.node=t,s&&(this.attrName=s),r&&(this.attrTmpl=r)}}var Ge,Xe;!function(e){e.ATTR="attr",e.PROP="prop",e.TEXT="text",e.CLASS="class",e.STYLE="style",e.SLOT="slot",e.TAG="tag"}(Ge||(Ge={}));class qe{startNode;endNode;type;attrName;varIndex;expressionChain;nodes;constructor(e,t,s,r){this.startNode=t,this.attrName=s,this.type=r}setVarIndex(e){this.varIndex=e}}!function(e){e.AFTER_BEGIN="afterbegin"}(Xe||(Xe={}));class Ye extends Function{diClass;args;di;varPath;point;slotComponent;varChain;constructor(e,...t){super(),this.diClass=e,this.args=t,this.varChain=xe.popDirectiveQ()}checkScope(e){let t=n(this.diClass,"scopes");o(t)||G(t.join(","),e)||ce(`Directive '${this.diClass.name}' is out of scopes, expect '${t.join(",")}' bug got '${e}'`)}render(e){let t=n(e,"__directives"),s=this.di||t[this.varPath];s||(s=new this.diClass(this.point),s.renderComponent=e,s.slotComponent=this.slotComponent,s.renderParams=this.varChain),this.di=s,s._renderArgs=this.args;let[r,i,o]=s.renderContext(...this.args);return o?s.__expPosMap=o:i&&(s.__expPos=i),r}update(e,t,s){let r=this.di.update(e,t,s);if(r===Ke.REMOVE)e.forEach((e=>{e.parentNode?.removeChild(e)}));else if(r===Ke.REPLACE){let s=[];e.forEach((e=>{e.parentNode?.removeChild(e)}));let r=this.di.render(...t),[n,i,o]=this.di.renderContext(r);o?this.di.__expPosMap=o:i&&(this.di.__expPos=i),s=R(n);let a=document.createDocumentFragment();a.append(...s),this.point.endNode.parentNode.insertBefore(a,this.point.endNode)}else if(r===Ke.UPDATE){let s,r={},n={},i=[],a=[],l=this.di.render(...t);C(l)&&l[0]instanceof mt&&l.forEach((e=>{let t=e.key??e.getKey();r[t]="1",n[t]=e,a.push(t)})),e=Z(D(e),(e=>e.nodeType===Node.ELEMENT_NODE)),s=Z(D(R(s)),(e=>e.nodeType===Node.ELEMENT_NODE));let c={},d="",h={};S(e,(e=>{let t=e,s=t.getAttribute("key");if(s){if(c[s])return d=s,!1;c[s]=t,i.push(s),h[s]="1"}})),d&&ce(`${V(this.diClass.name)} - duplicate key '${d}'`);let p={},m=r;const _=this.point.startNode.parentNode;let g=[],v=[];if(u(h,((e,t)=>{m[t]||(v.push(t),delete h[t],x(i,t))})),!o(a)){let e="",t=-1,s=[],r={};a.forEach(((n,o)=>{let l=i.findIndex((e=>e===n));if(l>-1&&l!==o){if(t<0||t-l==1){let e=f(s);s.push({nodeId:n,targetId:0===o?Xe.AFTER_BEGIN:e?e.nodeId:a[o-1]})}else r[s.length]={group:s,targetId:""},s=[],s.push({nodeId:n,targetId:i[l]});t=l}else if(l<0){let t=e?c[e]||this.point.endNode:this.point.startNode;g.push({prevNode:t,newkey:n})}e=n})),o(r)&&s.length>0&&(r[s.length]={group:s,targetId:""});let n=Object.keys(r),l=n.map((e=>parseInt(e))).sort(((e,t)=>e-t));if(n.length<2&&n.length>0){let{group:e}=r[l[0]];b(e).forEach((({targetId:e,nodeId:t})=>{let s,r=c[t];e===Xe.AFTER_BEGIN?(s=this.point.startNode,s.after(r)):(s=c[e],s.after(r))}))}}g.forEach((e=>{let t=e.newkey,s=p[t]||this.#O(n[t],t),r=e.prevNode;r===this.point.endNode?r.before(s):(this.point.startNode,r.after(s))})),v.forEach((e=>{this.#L(e);let t=c[e];t&&_.removeChild(t)})),this.di.updateContext(l)}}getDirective(){return this.di}#O(e,t){let[s,r,n]=this.di.renderContext(e),i=te(s);return this.di.__expPosMap[t]=r,i}#L(e){this.di.__expPosMap[e]=null,delete this.di.__expPosMap[e]}}function Je(e){return(...s)=>{let r=null;return s.forEach(((e,n)=>{if(t(e)){let t=e;s[n]=function(...e){let s=r.di;xe.startRender(s);let n=t(...e);return xe.endRender(s.renderComponent),n}}})),r=new Ye(e,...s),r}}const Ze="@",et=".",tt="?",st="*",rt=":",nt="ref",it=/[.?-a-z]+\s*=\s*(['"])\s*([^='"]*<\!--l_ui-pl_df-->){2,}.*?\1/ims,ot=/<\s*[a-z0-9-]+([^>]*<\!--l_ui-pl_df-->)*[^>]*?(?<!-)>/gims,at="slot-props";function lt(e){let t="";(C(e)?e:[e]).forEach((({strings:e,vars:s})=>{let r=R(e);r[0]=se(r[0]),r[r.length-1]=re(r[r.length-1]);let i=r.length-1;r.forEach(((e,r)=>{let o=n(s,r,"");o=i===r?"":ct,t+=e+o}))}));let s=t.match(it);if(s){return ce(`Parse error: attribute value can be set only one interpolation —— \n ${ne(s[0],ct,"${...}")}`),""}let r=0;return t=t.replace(ot,((e,t)=>ne(e,ct,(()=>ct.replace("--\x3e","")+r++)))),t}const ct="\x3c!--l_ui-pl_df--\x3e",dt="\x3c!--l_ui-pl_df",ht=/<!--l_ui-pl_df\d*(-->)?/;function ut(e,s,r,n,o,l,c=0,d=""){const h=document.createElement("div");h.innerHTML=r;const f=document.createNodeIterator(h,NodeFilter.SHOW_ELEMENT|NodeFilter.SHOW_COMMENT);let m,g=0,v=null;for(;m=f.nextNode();)if(m instanceof HTMLElement||m instanceof SVGElement){m instanceof We?v=m:v?.contains(m)||(v=null);let r={},i=R(m.attributes);u(i,(i=>{let{name:l,value:h}=i;if(l===at){let e=m.name||"default";if(v){let t=v._slotsPropMap[e];t||(t=v._slotsPropMap[e]=[]),t.push(m)}}if(_(l,dt)){let t=n[g];if(t instanceof Ye){t.checkScope(Ge.TAG);let r=new qe(c,m,l.substring(1),Ge.TAG);t.point=r,t.varPath=d+g,t.slotComponent=v,s.push(t);let n=e[d+g]=new Qe(d+g,m);n.isDirective=!0,n.value=t,n.isComponent=!!v,g++}m.removeAttribute(l)}else{if(l[0]===Ze){let s=e=>{},r=null;if(ht.test(h)){let i=n[g];if(!t(i))return void de(m.tagName,`Event '${l}' must be a function`);s=i.bind(o),r=e[d+g]=new Qe(d+g,m,l.replace(/\.|\?|@/,""),h),r.isComponent=!!v,g++}let i=l.substring(1).split(".").shift();return s=Be(l.substring(1),s,m,o),m.removeAttribute(l),void(r&&(r.eventName=i,r.value=s))}if(l!==nt)if(l[0]!==et||ht.test(h)){if(ht.test(h)){let t=n[g],o=e[d+g]=new Qe(d+g,m,l.replace(/\.|\?|@/,""),h);if(o.isComponent=!!v,l[0]===et||l[0]===tt||l[0]===st){if(t instanceof Ye){t.checkScope(Ge.PROP),s.push(t);let e=new qe(c,m,l.substring(1),Ge.PROP);t.varPath=d+g,t.point=e,t.slotComponent=v,o.value=t,o.isDirective=!0}else if(l[0]===tt)o.isToggleProp=!0,o.value=!!t,o.value&&m.setAttribute(l.substring(1),"");else if(l[0]===st){o.value=t;let e=l.substring(1);const[s,r]=e.split(rt);let n=s;switch(r){case"camel":n=V(n);break;case"kebab":n=p(n);break;case"snake":n=ie(n)}o.attrName=n,m.setAttribute(n,t)}else if(m instanceof We||"SLOT"===m.tagName){let e=V(l.substring(1));e in m||"SLOT"===m.tagName||de(m.tagName,`Prop '${l}' is not defined in ${m.tagName}`),o.value=t,o.isProp=!0,r[e]=t}else de(m.tagName,`Prop '${l}' can only be set on a CompElem or a slot`),delete e[d+g];m.removeAttribute(l),t=""}else{if(o.value=t,t instanceof Ye){let e=Ge.ATTR;"class"===l?e=Ge.CLASS:"style"===l&&(e=Ge.STYLE),t.checkScope(e),s.push(t),o.isDirective=!0;let r=new qe(c,m,l,e);t.point=r,t.slotComponent=v,t.varPath=d+g,t=""}h=w(h,ht,t),i.value=h}g++}}else de(m.tagName,`Prop '${l}' must be an interpolation`);else{if(ht.test(h)){let e=n[g];if(!a(e,"current"))return void de(m.tagName,"Ref must be a RefObject");g++,e.current=m}m.removeAttribute(l)}}})),m instanceof We?m._initProps(r):m instanceof HTMLSlotElement&&o._bindSlot(m,m.name||"default",r)}else{let t=m;if(`\x3c!--${t.nodeValue}--\x3e`!==ct)continue;let r=e[d+g]=new Qe(d+g,m);r.isComponent=!!v,r.isText=!0;let a,h=n[g];if(a=document.createComment(`compelem-ui-${c}-${g}-child-start`),t.parentNode.insertBefore(a,t),t.nodeValue=`compelem-ui-${c}-${g}-child-end`,r.textNode=a,h instanceof Ye){r.isDirective=!0,r.value=h;let e=v?Ge.SLOT:Ge.TEXT;s.push(h);let n=new qe(c,a,"",e);n.endNode=t,h.point=n,h.slotComponent=v,h.varPath=d+g,h=""}else if(h instanceof mt){r.isTmpl=!0,r.value=h;let t=lt(h);h=ut(e,s,t,h.vars,o,l,c,d+`${g}-`)}else r.value=h;if(g++,i(h))continue;if(h instanceof NodeList){let e=document.createDocumentFragment();e.append(...h),t.parentNode.insertBefore(e,t)}else if(h instanceof Element)t.parentNode.insertBefore(h,t);else if(U(h)){let e=document.createTextNode(h);t.parentNode.insertBefore(e,t)}}return h.childNodes}const pt={insertBefore:function(e,t){let s=document.createDocumentFragment();s.append(...t),e.parentNode.insertBefore(s,e)},remove:function(e,t){let s=e.nextSibling;for(;s!==t;)s?.parentNode?.removeChild(s),s=e.nextSibling}},ft=/\s+\.?key\s*=/;class mt{strings;vars;key;constructor(e,t){this.strings=l(e),this.vars=t}getKey(){let e=this.vars,t="";return u(this.strings,((s,r)=>{if(ft.test(s))return t=oe(e[r]),!1})),this.key=t,t}append(e){let t=f(this.strings);return e.strings.forEach(((e,s)=>{0!=s?this.strings.push(e):this.strings[this.strings.length-1]=t+e})),this.vars=l(this.vars,e.vars),this}getHTML(){let e="",t=R(this.strings);t[0]=se(t[0]),t[t.length-1]=re(t[t.length-1]);let s=t.length-1;return t.forEach(((t,r)=>{let i=n(this.vars,r,"");i=i instanceof mt?i.getHTML():s===r?"":i,e+=t+i})),e}}function _t(e,...t){return new mt(I(e)?[e]:e,t)}function gt(e){return{current:e}}function vt(e,t,s){s.get||ce(`Prop '${t}' must be a getter`),a(e.constructor,"__deco_computed")||(e.constructor.__deco_computed=o(e.constructor.__deco_computed)?{}:h(e.constructor.__deco_computed)),e.constructor.__deco_computed[t]={key:t,getter:s.get}}function Et(e,t){return(s,r,n)=>{a(s.constructor,"__deco_events")||(s.constructor.__deco_events=o(s.constructor.__deco_events)?[]:h(s.constructor.__deco_events)),s.constructor.__deco_events.push({name:e,options:t,fn:s[r]})}}var Ct;!function(e){e.ONCE="once",e.UPDATABLE="updatable"}(Ct||(Ct={}));class bt extends fe{created(e,...t){}mounted(e,t,...s){}get targets(){return[pe.FIELD]}selector;cache;result;constructor(e,t){super(),this.selector=e,this.cache=t}static getKey(e){return e}getter(e){this.result=e.shadowRoot?.querySelector(this.selector)}propsReady(e,t,s,r,...n){const i=this;Object.defineProperty(e,r,{get:()=>(i.result&&i.cache||i.getter(e),i.result)})}updated(e,t){this.cache===Ct.UPDATABLE&&this.getter(e)}}const Nt=Ce(bt),yt=Ce(class extends bt{getter(e){this.result=e.shadowRoot?.querySelectorAll(this.selector)}});function Pt(e){if(1===arguments.length)return(t,s)=>{Tt(t,s,e)};Tt(arguments[0],arguments[1],{prop:""})}function Tt(e,t,s){if(!a(e.constructor,"__deco_states")){const t={};let s=e.constructor;for(;(s=ue(s))!==We;)d(t,s.__deco_states?h(s.__deco_states):{});Object.defineProperty(e.constructor,"__deco_states",{configurable:!1,enumerable:!1,value:t})}e.constructor.__deco_states[t]=s}function xt(e,t,s){Tt(e.prototype,t,s||{prop:""})}function St(e){return t=>{t&&customElements.define(e,t)}}const Mt=Ce(class extends fe{created(e,...t){}propsReady(e,t,...s){}get targets(){return[pe.METHOD]}sources;options;handler;constructor(e,t,s){super(),this.sources=C(e)?e:[e],this.options=t,this.handler=s}static getKey(e){return C(e)?e.sort().join(""):e}mounted(e,s,r,i,...o){this.handler||(this.handler=t(i)?i:e[i]);let a=this.handler,l=n(this.options,"immediate",!1);n(this.options,"once",!1)&&(a=T(a.bind(e)));let c=[];this.sources.forEach((t=>{let s=n(e,t.replaceAll("-","."));l&&c.push({handler:a,value:s,varPath:t})})),c.forEach((({handler:t,value:s,varPath:r})=>{t.call(e,n(e,r),s,r)}))}updated(e,t){this.sources.forEach((s=>{u(t,(({value:t,chain:r,oldValue:i,end:o},a)=>{let l=s.replaceAll(".","-");if(!_(a,l))return;a===l&&o&&this.handler&&this.handler.call(e,t,i,a);let c=r.length-1;for(;c;){let t=r.slice(0,c);if(o&&t.join("-")===l&&n(this.options,"deep")){let s=n(e,t);this.handler.call(e,s,s,t.join("-"))}c--}}))}))}});class At extends(Ue(Object)){_renderArgs;static get scopes(){return[]}renderParams}const kt=["key"];const Ot=Je(class extends At{update(e,t,s){return Ke.NONE}static get scopes(){return[Ge.TAG]}constructor(e){super(),this.point=e}render(e){let t=this.point.startNode;if(t instanceof We){let s={},r={};u(e,((e,n)=>{kt.includes(n)||(n in t?s[n]=e:r[n]=e+"")})),t._initProps(s,r)}else u(e,((e,s)=>{t.setAttribute(s,e)}))}});const Lt=Je(class extends At{update(e,t,s){return this.render(t[0]),Ke.NONE}static get scopes(){return[Ge.CLASS]}constructor(e){super(e),this.point=e}lastCls;render(e){let t=[];C(e)?t=D(e):s(e)?t=q(e,((e,t)=>e?t:[])):I(e)&&(t=e.split(" "));let r=this.point.startNode;u(this.lastCls,(e=>{r.classList.remove(e)})),u(t,(e=>{r.classList.add(e)})),this.lastCls=l(t)}}),wt=/\s+\.?key\s*=/;const Dt=Je(class extends At{update(e,t,s){if(o(e)&&o(t[0]))return Ke.NONE;if(!o(this.renderParams)){let e=f(this.renderParams);C(e)||(e=[e]),this.renderParams=e}return Ke.UPDATE}constructor(e){super(),o(this.renderParams)||(this.renderParams=R(f(this.renderParams)))}static get scopes(){return[Ge.TEXT,Ge.SLOT]}render(e,t){let s=S(e,((e,s)=>t(e,s))),r=[],n=[];return s.forEach((e=>{let t=f(n),s=e.vars,i=!0;e.strings.forEach(((e,o)=>{if(wt.test(e)){let e=s[o]+"";r.includes(e)&&ce(`forEach - duplicate key '${e}'`),r.push(e),i=!1}0==o&&t?n[n.length-1]=t+e:n.push(e)})),i&&ce("forEach - missing 'key' prop")})),s}});const Rt=Je(class extends At{ifNodes;elseNodes;static get scopes(){return[Ge.TEXT,Ge.SLOT]}update(e,t,s){return!!t[0]==!!s[0]?Ke.UPDATE:(t[0],Ke.REPLACE)}render(e,t,s){return e?t(e):s(e)}});const jt=Je(class extends At{static get scopes(){return[Ge.TEXT,Ge.SLOT]}update(e,t,s){return t[0]===s[0]?Ke.UPDATE:t[0]?Ke.REPLACE:(this.cacheNodes=e,Ke.REMOVE)}render(e,t){return e?t():_t``}});var $t;!function(e){e.CHANGE="change",e.INPUT="input"}($t||($t={}));const It=Je(class extends At{update(e,t,s){if(this.modelPath||(this.modelPath=f(this.renderParams)),!m(t,s)){const e=this.point.startNode;if(e instanceof We)e._updateProps({value:t[0]});else if(e instanceof HTMLTextAreaElement||e instanceof HTMLSelectElement)e.setAttribute("value",t[0]+"");else if(e instanceof HTMLInputElement)switch(e.type){case"checkbox":case"radio":t[0]?e.setAttribute("checked",""):e.removeAttribute("checked");break;default:e.setAttribute("value",t[0]+"")}}return Ke.NONE}static get scopes(){return[Ge.TAG]}modelPath;point;constructor(e){super(),this.point=e}render(t,r){this.modelPath||(this.modelPath=f(this.renderParams)),r&&(this.modelPath=e(r));const i=this.point.startNode;if("binded"!==n(i,"_model"))if(s(t)||U(t)||(t=""),i instanceof We)i._initProps({value:t}),i.addEventListener("update:value",(e=>{L(this.renderComponent,this.modelPath,e.detail.value)})),L(i,"_model","binded");else if(i instanceof HTMLTextAreaElement)i.setAttribute("value",t+""),i.addEventListener("input",(e=>{let t=e.target;L(this.renderComponent,this.modelPath,t.value)})),L(i,"_model","binded");else if(i instanceof HTMLInputElement){let e="",s="";switch(i.type){case"checkbox":case"radio":e="checked",s="change";break;default:e="value",s="input"}i.setAttribute(e,t+""),i.addEventListener(s,(e=>{let t=e.target;L(this.renderComponent,this.modelPath,t.value)})),L(i,"_model","binded")}else i instanceof HTMLSelectElement&&(i.setAttribute("value",t+""),i.addEventListener("change",(e=>{let t=e.target;L(this.renderComponent,this.modelPath,t.value)})),L(i,"_model","binded"))}});const Ht=Je(class extends At{update(e,t,s){return this.render(t[0]),Ke.NONE}display=void 0;static get scopes(){return[Ge.TAG]}constructor(e){super(),this.point=e}render(e){let t=this.point.startNode;i(this.display)&&(this.display=t.style.display),this.renderComponent.nextTick((()=>{t.style.display=e?this.display:"none"}))}});const Bt=Je(class extends At{update(e,t,s){return Ke.NONE}static get scopes(){return[Ge.SLOT]}render(e,t){return e=e.bind(this.renderComponent),this.slotComponent._bindSlotHook(t||"default",e),e}});const Ut=Je(class extends At{update(e,t,s){return this.render(t[0]),Ke.NONE}constructor(e){super(),this.point=e}static get scopes(){return[Ge.STYLE]}render(e){let t="";s(e)?t=k(S(e,((e,t)=>p(t)+":"+e)),";"):I(e)&&(t=e),u(t.split(";"),(e=>{let t=e.split(":");this.point.startNode.style.setProperty(U(t[0]),U(t[1]))}))}});const Ft=Je(class extends At{update(e,t,s){return m(t,s)||this.targetComponent._updateProps({[this.attrName]:t[0]}),Ke.NONE}static get scopes(){return[Ge.PROP]}modelPath;attrName;targetComponent;constructor(e){super(),this.targetComponent=e.startNode,this.attrName=e.attrName}render(e){this.modelPath||(this.modelPath=f(this.renderParams)),this.targetComponent._initProps({[this.attrName]:e}),this.targetComponent.addEventListener("update:"+this.attrName,(e=>{L(this.renderComponent,this.modelPath,e.detail.value)}))}});const Vt=Je(class extends At{static get scopes(){return[Ge.TEXT,Ge.SLOT]}update(e,t,s){return m(t,s)?Ke.NONE:Ke.REPLACE}render(e,s){let r=()=>_t``,n=[],i=[];u(s,((e,s)=>{if(t(e))n.push(s),i.push(e);else{let t=e[0],s=e[1];n.push(t),i.push(s)}"default"===s&&(r=e)}));let o=ae(n,(s=>t(s)?s(e):s==e));return le(i[o]??r)}});export{We as CompElem,fe as Decorator,pe as DecoratorType,ve as DecoratorWrapper,At as Directive,Ke as DirectiveUpdateTag,Ye as DirectiveWrapper,qe as EnterPoint,Ge as EnterPointType,Qe as ExpPos,me as GetKeyFnName,$t as ModelTriggerType,Ct as QueryCache,mt as Template,ge as _DecoratorMap,_e as _DecoratorsKey,Te as _getObservedAttrs,Ot as bind,lt as buildHTML,Lt as classes,vt as computed,gt as createRef,Ce as decorator,Je as directive,Et as event,Dt as forEach,_t as html,Rt as ifElse,jt as ifTrue,xt as makeState,It as model,Ne as prop,Nt as query,yt as queryAll,Ht as show,Bt as slot,Pt as state,Ut as styles,Ft as sync,St as tag,Mt as watch,Vt as when};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "compelem",
-  "version": "0.2.2-beta",
+  "version": "0.2.3-beta",
   "description": "A modern, reactive, fast, lightweight and flexible lib for building web components",
   "main": "index.js",
   "module": "index.js",