/*!
 * KoliBri - The accessible HTML-Standard
 */
import{h as s,r as t,c as e,H as o}from"./index-Brmny3Vg.js";import{_ as i}from"./tslib.es6-QNbPBOk5.js";import{B as n}from"./variant-quote-BMV8GZX8.js";import{b as a}from"./bem-registry-B9CzNnO1.js";import{C as r}from"./component-DohIJBPw.js";import{L as h}from"./common-DEEjER7G.js";import{s as c}from"./element-focus-BQXzaLL9.js";import{c as l,d}from"./element-interaction-C5-6aPzz.js";import{c as m,n as u}from"./normalizers-pgU77mXp.js";import{B as f}from"./base-controller-CXhqh4cR.js";import"./_Uint8Array-kJHDjtoP.js";import"./isArray-CcrBs4JM.js";const v=m("name","",u);const p=a.forBlock("kol-skeleton");const b=p("actions");const j=p("container");const k=p("counter");const w=p("name");const B=t=>{const{count:e,label:o,name:i,show:n,handleClick:a,refButton:h}=t;const c=!!(n&&(i===null||i===void 0?void 0:i.trim()));const l=p({"has-name":c,"is-hidden":!n});return s("div",{class:l},s("div",{class:j},c&&s("span",{class:w},i),s("div",{class:k},"Count: ",e)),s("div",{class:b},s(r,{label:o,handleClick:a,refButton:h})))};const y={required:[v]};class C extends f{constructor(s){super(s,y);this.buttonRef=l();this.onKeydown=s=>{if(s.key==="Escape"){console.log("Show should be toggled");void this.toggle()}};this.handleClick=()=>{var s,t;h.debug("Button clicked, count should be increased");this.setState("count",((t=(s=this.getState)===null||s===void 0?void 0:s.call(this,"count"))!==null&&t!==void 0?t:0)+1)};this.setButtonRef=s=>{this.buttonRef(s)};this.startLoadedEventInterval()}componentWillLoad(s){const{name:t}=s;this.watchName(t)}watchName(s){v.apply(s,(s=>{this.setRenderProp("name",s)}))}toggle(){var s,t;this.setState("show",!((t=(s=this.getState)===null||s===void 0?void 0:s.call(this,"show"))!==null&&t!==void 0?t:false))}focus(s){void c(this.buttonRef.el,s)}startLoadedEventInterval(){this.intervalId=setInterval((()=>{var s,t;this.emitLoaded((t=(s=this.getState)===null||s===void 0?void 0:s.call(this,"count"))!==null&&t!==void 0?t:0)}),2e3)}emitLoaded(s){if(this.onLoadedCallback){this.onLoadedCallback(s)}}setOnLoadedCallback(s){this.onLoadedCallback=s}destroy(){if(this.intervalId){clearInterval(this.intervalId);this.intervalId=undefined}}}const L=class extends n{constructor(s){super();t(this,s);this.loaded=e(this,"loaded");this.rendered=e(this,"rendered");this.ctrl=new C(this.stateAccess);this.buttonRef=l();this.count=0;this.label="Label";this.show=true}async focus(s){}async toggle(){return Promise.resolve(this.ctrl.toggle())}watchName(s){this.ctrl.watchName(s)}handleKeyDown(s){if(s.key==="Enter"||s.key===" "){h.debug("button pressed");this.ctrl.handleClick()}}onKeydown(s){this.ctrl.onKeydown(s)}componentWillLoad(){this.ctrl.componentWillLoad({name:this._name});this.ctrl.setOnLoadedCallback((s=>{this.loaded.emit(s)}))}componentDidLoad(){requestAnimationFrame((()=>{this.rendered.emit()}))}disconnectedCallback(){this.ctrl.destroy()}render(){return s(o,{key:"e7e29ff558a0f2d6eebba4d8b2247ee269836bb5"},s(B,{key:"949256a8455d79b2ea97182ecbf509fb0f3e59ee",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:s=>{this.buttonRef(s);this.ctrl.setButtonRef(s)}}))}static get watchers(){return{_name:["watchName"]}}};i([d("buttonRef")],L.prototype,"focus",null);export{L as kol_skeleton};
//# sourceMappingURL=kol-skeleton.entry.js.map