@oslokommune/punkt-elements/dist/radiobutton-B1Xg6XzP.cjs

Komponentbiblioteket til Punkt, et designsystem laget av Oslo Origo

const e=require(`./element-DjtxO-1r.cjs`),t=require(`./class-map-CJ-msbHs.cjs`),n=require(`./ref-BaJ0mBT_.cjs`),r=require(`./input-element-D0egtEnr.cjs`);var i=class extends r.t{constructor(...e){super(...e),this.inputRef=n.t(),this.value=``,this.checkHelptext=null,this.defaultChecked=!1,this.hasTile=!1,this.checked=null,this.type=`radio`,this.tagText=null,this.optionalTag=!1,this.optionalText=`Valgfritt`,this.requiredTag=!1,this.requiredText=`Må fylles ut`,this._checked=!1}connectedCallback(){super.connectedCallback()}attributeChangedCallback(e,t,n){e===`defaultChecked`&&(this._checked=this.defaultChecked),e===`checked`&&(this._checked=this.checked===``||this.checked===`true`||this.checked===!0),super.attributeChangedCallback(e,t,n)}render(){let r=t.t({"pkt-input-check__input":!0,"pkt-input-check__input--tile":this.hasTile,"pkt-input-check__input--tile-disabled":this.disabled&&this.hasTile}),i=t.t({"pkt-input-check__input-checkbox":!0,"pkt-input-check__input-checkbox--error":this.hasError}),a=t.t({"pkt-input-check__input-label":!0,"pkt-input-check__input-label--disabled":this.disabled,"pkt-sr-only":this.hideLabel}),o=`pkt-tag pkt-tag--small pkt-tag--thin-text`;return e.d`
      <div class="pkt-input-check">
        <div class=${r}>
          <input
            id=${this.id+`-internal`}
            class=${i}
            type="radio"
            role="radio"
            ?disabled=${this.disabled}
            form=""
            name=${this.name+`-internal`}
            ${n.n(this.inputRef)}
            @change=${this.toggleChecked}
            @input=${this.onInput}
            @blur=${this.onBlur}
            @focus=${this.onFocus}
            ?checked=${this.checked}
          />
          ${e.d`
        <label class=${a} for=${this.id+`-internal`}>
          ${this.label} ${e.d`
        ${this.tagText?e.d`<span class=${o+` pkt-tag--gray`}>${this.tagText}</span>`:e.l}
        ${this.optionalTag?e.d`<span class=${o+` pkt-tag--blue-light`}>${this.optionalText}</span>`:e.l}
        ${this.requiredTag?e.d`<span class=${o+` pkt-tag--beige`}>${this.requiredText}</span>`:e.l}
      `}
          ${this.checkHelptext?e.d`<div class="pkt-input-check__input-helptext">${this.checkHelptext}</div>`:e.l}
        </label>
      `}
        </div>
      </div>
    `}toggleChecked(e=null){e&&e.preventDefault(),e&&e.stopImmediatePropagation(),this.touched=!0,this.inputRef.value&&(this._checked=this.inputRef.value.matches(`:checked`),this.valueChecked(this._checked))}};e.r([e.s({type:String,reflect:!0})],i.prototype,`value`,void 0),e.r([e.s({type:String})],i.prototype,`checkHelptext`,void 0),e.r([e.s({type:Boolean})],i.prototype,`defaultChecked`,void 0),e.r([e.s({type:Boolean})],i.prototype,`hasTile`,void 0),e.r([e.s({type:Boolean,reflect:!0})],i.prototype,`checked`,void 0),e.r([e.s({type:String,reflect:!0})],i.prototype,`type`,void 0),e.r([e.s({type:String})],i.prototype,`tagText`,void 0),e.r([e.s({type:Boolean})],i.prototype,`optionalTag`,void 0),e.r([e.s({type:String})],i.prototype,`optionalText`,void 0),e.r([e.s({type:Boolean})],i.prototype,`requiredTag`,void 0),e.r([e.s({type:String})],i.prototype,`requiredText`,void 0),e.r([e.o()],i.prototype,`_checked`,void 0);try{e.c(`pkt-radiobutton`)(i)}catch{console.warn(`Forsøker å definere <pkt-radiobutton>, men den er allerede definert`)}var a=i;Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return i}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return a}});