import{r as C,a4 as r,L as c,h as n,H as k,c as f}from"./index-B6uGkrgD.js";import{B as v,a as b}from"./base-web-component-CjUKwppg-CfrsJmb_.js";import{C as p,a as L}from"./controller-DCU1hWxp-Coh_pYzg.js";import{c as _,n as S}from"./normalizers-MuBx2xIG-CzHg60vA.js";import"./_Uint8Array-UP73qmmG-BbaGLgZa.js";import"./isArray-CcrBs4JM-CqO_RI43.js";import"./label-BGZcz8ue-BM0c_how.js";import"./isObject-BJgq02Md-C3e4t58V.js";const d=_("name","",S),l=f.forBlock("kol-skeleton"),B=l("actions"),g=l("container"),E=l("counter"),w=l("name"),N=o=>{const{count:t,label:e,name:s,show:a,handleClick:h,refButton:u}=o,i=!!(a&&s?.trim()),m=l({"has-name":i,"is-hidden":!a});return n("div",{class:m},n("div",{class:g},i&&n("span",{class:w},s),n("div",{class:E},"Count: ",t)),n("div",{class:B},n(L,{label:e,handleClick:h,refButton:u})))},y={required:[d]};class I extends b{constructor(t,e){super(y,t,e),this.onKeydown=s=>{s.key==="Escape"&&(console.log("Show should be toggled"),this.toggle())},this.handleClick=()=>{var s,a;c.debug("Button clicked, count should be increased"),this.setState("count",((a=(s=this.getState)===null||s===void 0?void 0:s.call(this,"count"))!==null&&a!==void 0?a:0)+1)},this.setButtonRef=s=>{this.clickButtonCtrl.setButtonRef(s)},this.clickButtonCtrl=new p(t,e),this.startLoadedEventInterval()}componentWillLoad(t){const{name:e}=t;this.watchName(e),this.clickButtonCtrl.componentWillLoad({label:"Click me"})}watchName(t){d.apply(t,e=>{this.setRenderProp("name",e)})}toggle(){var t,e;this.setState("show",!((e=(t=this.getState)===null||t===void 0?void 0:t.call(this,"show"))!==null&&e!==void 0&&e))}focus(){return this.clickButtonCtrl.focus()}startLoadedEventInterval(){this.intervalId=setInterval(()=>{var t,e;this.emitLoaded((e=(t=this.getState)===null||t===void 0?void 0:t.call(this,"count"))!==null&&e!==void 0?e:0)},2e3)}emitLoaded(t){this.onLoadedCallback&&this.onLoadedCallback(t)}setOnLoadedCallback(t){this.onLoadedCallback=t}destroy(){this.intervalId&&(clearInterval(this.intervalId),this.intervalId=void 0)}}const x=class extends v{constructor(o){super(),C(this,o),this.loaded=r(this,"loaded"),this.rendered=r(this,"rendered"),this.ctrl=new I(this.setState,this.getState),this.count=0,this.label="Label",this.show=!0}async focus(){return Promise.resolve(this.ctrl.focus())}async toggle(){return Promise.resolve(this.ctrl.toggle())}watchName(o){this.ctrl.watchName(o)}handleKeyDown(o){(o.key==="Enter"||o.key===" ")&&(c.debug("button pressed"),this.ctrl.handleClick())}onKeydown(o){this.ctrl.onKeydown(o)}componentWillLoad(){this.ctrl.componentWillLoad({name:this._name}),this.ctrl.setOnLoadedCallback(o=>{this.loaded.emit(o)})}componentDidLoad(){requestAnimationFrame(()=>{this.rendered.emit()})}disconnectedCallback(){this.ctrl.destroy()}render(){return n(k,{key:"8b04c40db5658a744af6aaff13262f5d1e08af3e"},n(N,{key:"a7ba98cc2620d5aa4d6fb28fc02df5b18a0aa273",count:this.count,label:this.label,name:this.ctrl.getRenderProp("name"),handleClick:()=>this.ctrl.handleClick(),onLoaded:this.loaded,onRendered:this.rendered,show:this.show,refButton:o=>this.ctrl.setButtonRef(o)}))}static get watchers(){return{_name:["watchName"]}}};export{x as kol_skeleton};
//# sourceMappingURL=kol-skeleton.entry-DmMfEGSG.js.map
