UNPKG

@postnord/web-components

Version:
5 lines 3.93 kB
/*! * Built with Stencil * By PostNord. */ import{t as e,r as i,g as s,f as t,h as d,a as n}from"./p-CAEP792y.js";import{uuidv4 as l}from"./index.esm.js";import{a as p}from"./p-B88w-Zxn.js";import{a}from"./p-BTqkgfeH.js";const f=class{constructor(e){i(this,e)}mo;id=`pn-fieldset-${l()}`;idHelpertext=`${this.id}-helpertext`;get hostElement(){return s(this)}legend;helpertext;fieldsetId=this.id;form;name;disabled=!1;invalid=!1;error;handleId(){this.idHelpertext=`${this.fieldsetId}-helpertext`}componentWillLoad(){this.handleId()}componentDidLoad(){this.mo&&this.mo.disconnect(),this.mo=new MutationObserver((()=>t(this.hostElement))),this.mo.observe(this.hostElement.querySelector(".pn-fieldset"),{childList:!0,subtree:!0})}componentDidRender(){this.form&&this.hostElement.querySelector("fieldset")?.setAttribute("form",this.form)}hasError(){return this.invalid||!!this.error}getSymbol(){return this.disabled?a:p}render(){return d(n,{key:"4eac26b9a4c9095888cbe548f30eddcbed3efcdf"},d("fieldset",{key:"341684c752c43382f37d0d95f9ea8c0d2d170ef1",id:this.fieldsetId,class:"pn-fieldset",disabled:this.disabled,"aria-describedby":this.helpertext&&this.idHelpertext,"aria-invalid":this.hasError().toString()},d("legend",{key:"3f98ab3a56288cebb07cce9c49b6e1bebd2096f2",class:"pn-fieldset-legend"},this.legend),this.helpertext&&d("p",{key:"979b9b47ae0baa2f84bf19de877149773bfd63b9",id:this.idHelpertext,class:"pn-fieldset-helpertext"},this.helpertext),d("div",{key:"a67905a01003d767e26061ff8fa3af86a0900c27",class:"pn-fieldset-items"},d("slot",{key:"a2a02e54157e39e43cf03839c8bb2a561533eb39"})),d("div",{key:"4c618709e6a3cbaa20761368acc70b6d2e964930",class:"pn-fieldset-message-wrapper",role:"alert",hidden:!this.error},d("pn-icon",{key:"db1b62bccada153943c62195242e66b62d9cc2c3",icon:this.getSymbol()}),d("p",{key:"9b94853b5064d9563e39c20491d7139eead83f56",class:"pn-fieldset-message"},this.error))))}static get watchers(){return{fieldsetId:[{handleId:0}]}}};f.style=`${e("pn-fieldset")}{display:inline-block}${e("pn-fieldset")} .pn-fieldset{border:0;padding:0;margin:0;color:#2d2013;display:flex;flex-direction:column;font-size:1em}${e("pn-fieldset")} .pn-fieldset-legend{float:left;font-weight:500;line-height:1.4;padding:0}${e("pn-fieldset")} .pn-fieldset-helpertext{color:#5e554a;margin:0}${e("pn-fieldset")} .pn-fieldset-items{padding:0.75em 0;display:flex;flex-direction:column;gap:0.75em}${e("pn-fieldset")} .pn-fieldset-message-wrapper{display:flex;gap:0.75em;color:#2d2013;line-height:1.4;font-weight:400}${e("pn-fieldset")} .pn-fieldset-message-wrapper[hidden]{display:none}${e("pn-fieldset")} .pn-fieldset-message{margin:0}${e("pn-fieldset")} .pn-fieldset[aria-invalid=true]>.pn-fieldset-legend,${e("pn-fieldset")} .pn-fieldset[aria-invalid=true]>.pn-fieldset-helpertext,${e("pn-fieldset")} .pn-fieldset[aria-invalid=true]>.pn-fieldset-message-wrapper{color:#a70707}${e("pn-fieldset")} .pn-fieldset[aria-invalid=true]>.pn-fieldset-legend>${e("pn-icon")} .pn-icon-svg>path,${e("pn-fieldset")} .pn-fieldset[aria-invalid=true]>.pn-fieldset-helpertext>${e("pn-icon")} .pn-icon-svg>path,${e("pn-fieldset")} .pn-fieldset[aria-invalid=true]>.pn-fieldset-message-wrapper>${e("pn-icon")} .pn-icon-svg>path{fill:#a70707}${e("pn-fieldset")} .pn-fieldset:disabled>.pn-fieldset-legend,${e("pn-fieldset")} .pn-fieldset:disabled>.pn-fieldset-helpertext,${e("pn-fieldset")} .pn-fieldset:disabled>.pn-fieldset-message,${e("pn-fieldset")} .pn-fieldset:disabled>.pn-fieldset-message-wrapper{color:#2d2013}${e("pn-fieldset")} .pn-fieldset:disabled>.pn-fieldset-legend>${e("pn-icon")} .pn-icon-svg>path,${e("pn-fieldset")} .pn-fieldset:disabled>.pn-fieldset-helpertext>${e("pn-icon")} .pn-icon-svg>path,${e("pn-fieldset")} .pn-fieldset:disabled>.pn-fieldset-message>${e("pn-icon")} .pn-icon-svg>path,${e("pn-fieldset")} .pn-fieldset:disabled>.pn-fieldset-message-wrapper>${e("pn-icon")} .pn-icon-svg>path{fill:#2d2013}`;export{f as pn_fieldset}