import{r as k,a6 as r,L as h,h as n,H as L,c as w}from"./index-DpEJCboz.js";import{C as b,a as p}from"./controller-De_Qbk_S-DUTQe95w.js";import{B as f,w as l,c as d,l as S,n as B,a as _}from"./base-controller-BGteZxSE-D44Ic5i1.js";const g=d(_,t=>t>=0),E=d(B,()=>!0),a=w.forBlock("kol-skeleton"),v=a("actions"),N=a("container"),y=a("counter"),P=a("name"),I=t=>{const{count:e,label:o,name:s,show:c,handleClick:u,refButton:m}=t,i=!!(c&&s?.trim()),C=a({"has-name":i,"is-hidden":!c});return n("div",{class:C},n("div",{class:N},i&&n("span",{class:P},s),n("div",{class:y},"Count: ",e)),n("div",{class:v},n(p,{label:o,handleClick:u,refButton:m})))};class O extends f{constructor(e){super(e,{count:0,name:""}),this.onKeydown=o=>{o.key==="Escape"&&(console.log("Show should be toggled"),this.toggle())},this.handleClick=()=>{h.debug("Button clicked, count should be increased");const{count:o}=this.getProps(),s=o+1;this.setProp("count",s),this.setState("count",s)},this.setButtonRef=o=>{this.clickButtonCtrl.setButtonRef(o)},this.clickButtonCtrl=new b({}),this.startLoadedEventInterval()}componentWillLoad(e){const{count:o,name:s}=e;this.watchCount(o),this.watchName(s),this.watchLabel(this.component.label),this.clickButtonCtrl.componentWillLoad({label:this.component.label})}watchCount(e){l(g,e,o=>{this.setProp("count",o),this.setState("count",o)})}watchName(e){l(E,e,o=>{this.setProp("name",o)})}watchLabel(e){l(S,e,o=>{this.setState("label",o),this.clickButtonCtrl.watchLabel(o)})}toggle(){this.setState("show",!this.component.show)}focus(){return this.clickButtonCtrl.focus()}startLoadedEventInterval(){this.intervalId=setInterval(()=>{const{count:e}=this.getProps();this.emitLoaded(e)},2e3)}emitLoaded(e){this.onLoadedCallback&&this.onLoadedCallback(e)}setOnLoadedCallback(e){this.onLoadedCallback=e}destroy(){this.intervalId&&(clearInterval(this.intervalId),this.intervalId=void 0)}}const R=class{constructor(t){k(this,t),this.loaded=r(this,"loaded"),this.rendered=r(this,"rendered"),this.ctrl=new O(this),this.label="Label",this.show=!0,this.count=0}async focus(){return Promise.resolve(this.ctrl.focus())}async toggle(){return Promise.resolve(this.ctrl.toggle())}watchCount(t){this.ctrl.watchCount(t)}watchName(t){this.ctrl.watchName(t)}handleKeyDown(t){(t.key==="Enter"||t.key===" ")&&(h.debug("button pressed"),this.ctrl.handleClick())}onKeydown(t){this.ctrl.onKeydown(t)}componentWillLoad(){this.ctrl.componentWillLoad({count:this._count,name:this._name}),this.ctrl.setOnLoadedCallback(t=>{this.loaded.emit(t)})}componentDidLoad(){requestAnimationFrame(()=>{this.rendered.emit()})}disconnectedCallback(){this.ctrl.destroy()}render(){const{count:t,name:e}=this.ctrl.getProps(),{label:o,show:s}=this;return n(L,{key:"225420664e7c4af6153162c67244b7602a9a2f02"},n(I,{key:"35c0ce0446877a7e58da64c1c6c2a5fff960c4db",count:t,label:o,name:e,handleClick:()=>this.ctrl.handleClick(),onLoaded:this.loaded,onRendered:this.rendered,show:s,refButton:c=>this.ctrl.setButtonRef(c)}))}static get watchers(){return{_count:["watchCount"],_name:["watchName"]}}};export{R as kol_skeleton};
//# sourceMappingURL=kol-skeleton.entry-BZLlKZ9l.js.map
