UNPKG

@oslokommune/punkt-elements

Version:

Komponentbiblioteket til Punkt, et designsystem laget av Oslo Origo

16 lines 2.38 kB
const e=require(`./element-DjtxO-1r.cjs`),t=require(`./class-map-CJ-msbHs.cjs`),n=require(`./element-with-slot-CWoTGA1B.cjs`);require(`./icon-Dr8sfT2X.cjs`),window.pktAnimationPath=window.pktAnimationPath||`https://punkt-cdn.oslo.kommune.no/latest/animations/`;var r=class extends n.t{constructor(...e){super(...e),this.delay=0,this.inline=!1,this.isLoading=!0,this.message=null,this.size=`medium`,this.variant=`shapes`,this.loadingAnimationPath=window.pktAnimationPath,this._shouldDisplayLoader=!1}connectedCallback(){super.connectedCallback(),this._shouldDisplayLoader=this.delay===0,this.delay>0&&this.setupLoader()}updated(e){e.has(`delay`)&&this.setupLoader()}render(){let r=t.t({"pkt-loader":!0,[`pkt-loader--${this.inline?`inline`:`box`}`]:!0,[`pkt-loader--${this.size}`]:!0}),i=t.t({"pkt-contents":!0,"pkt-hide":this.isLoading});return e.d`<div role="status" aria-live="polite" aria-busy=${this.isLoading?`true`:`false`} class=${r} > ${this.isLoading&&this._shouldDisplayLoader?e.d`<div class="pkt-loader__spinner"> <pkt-icon name=${this.getVariant(this.variant)} path=${this.loadingAnimationPath} class="pkt-loader__svg pkt-loader__${this.variant}" ></pkt-icon> ${this.message&&e.d`<p>${this.message}</p>`} </div>`:e.l} <div class=${i}>${n.n(this)}</div> </div>`}getVariant(e){switch(e){case`blue`:return`spinner-blue`;case`rainbow`:return`spinner`;default:return`loader`}}setupLoader(){this.delay>0&&(this._shouldDisplayLoader=!1,setTimeout(()=>{this._shouldDisplayLoader=!0,this.requestUpdate()},this.delay))}};e.r([e.s({type:Number})],r.prototype,`delay`,void 0),e.r([e.s({type:Boolean})],r.prototype,`inline`,void 0),e.r([e.s({type:Boolean})],r.prototype,`isLoading`,void 0),e.r([e.s({type:String})],r.prototype,`message`,void 0),e.r([e.s({type:String})],r.prototype,`size`,void 0),e.r([e.s({type:String})],r.prototype,`variant`,void 0),e.r([e.s({type:String})],r.prototype,`loadingAnimationPath`,void 0),e.r([e.o()],r.prototype,`_shouldDisplayLoader`,void 0);try{e.c(`pkt-loader`)(r)}catch{console.warn(`Forsøker å definere <pkt-loader>, men den er allerede definert`)}var i=r;Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return r}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return i}});