@postnord/web-components/postnord-web-components/p-4fca160d.entry.js

PostNord Web Components

/*!
 * Built with Stencil
 * By PostNord.
 */
import{r as o,g as i,h as a,a as r}from"./p-c2c6299e.js";import{u as n}from"./p-c511b4fb.js";const d="pn-radio-button{position:relative;display:inline-block}pn-radio-button .pn-radio{position:relative;display:flex;gap:0.75em}pn-radio-button .pn-radio-label{color:#2d2013}pn-radio-button .pn-radio-helpertext{color:#5e554a}pn-radio-button .pn-radio-content{margin:0;flex:1 1 100%;display:flex;flex-direction:column;justify-content:center}pn-radio-button .pn-radio-container{display:flex;gap:0.75em;padding:0}pn-radio-button .pn-radio-outer{background-color:#ffffff;border:0.0625em solid #969087;border-radius:50%;height:1.5em;width:1.5em;display:flex;justify-content:center;align-items:center;outline:0.2rem solid transparent;outline-offset:0.2rem;transition-property:border-color, background-color, outline-color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}pn-radio-button .pn-radio-inner{transform:scale(0);height:0.75em;width:0.75em;background-color:#005d92;border-radius:50%;transform-origin:center center;transition-property:background-color, transform;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}pn-radio-button .pn-radio[data-tile]{padding:1em;border:0.0625em solid #969087;border-radius:0.5em;background-color:#ffffff;outline:0.2rem solid transparent;outline-offset:0.2rem;transition-property:border-color, background-color, outline-color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}pn-radio-button .pn-radio[data-tile] .pn-radio-outer{outline:none}pn-radio-button .pn-radio[data-invalid]{border-color:#a70707}pn-radio-button .pn-radio[data-invalid] .pn-radio-outer{border-color:#a70707}pn-radio-button .pn-radio[data-invalid] .pn-radio-inner{background-color:#a70707}pn-radio-button>input[type=radio]{cursor:pointer;opacity:0;position:absolute;margin:0;z-index:1;top:0;left:0;width:100%;height:100%;-webkit-tap-highlight-color:transparent}pn-radio-button>input[type=radio][aria-describedby]+.pn-radio[data-tile] .pn-radio-label{font-weight:500}pn-radio-button>input[type=radio]:hover+.pn-radio[data-tile]{border-color:#005d92;background-color:#e0f8ff}pn-radio-button>input[type=radio]:hover+.pn-radio[data-tile] .pn-radio-outer{background-color:#e0f8ff}pn-radio-button>input[type=radio]:hover+.pn-radio[data-tile][data-invalid]{border-color:#a70707;background-color:#fdefee}pn-radio-button>input[type=radio]:hover+.pn-radio[data-tile][data-invalid] .pn-radio-outer{background-color:#fdefee}pn-radio-button>input[type=radio]:hover+.pn-radio[data-invalid] .pn-radio-outer{border-color:#a70707;background-color:#fdefee}pn-radio-button>input[type=radio]:hover+.pn-radio .pn-radio-outer{border-color:#005d92;background-color:#e0f8ff}pn-radio-button>input[type=radio]:checked:hover+.pn-radio[data-tile][data-invalid]{border-color:#500715}pn-radio-button>input[type=radio]:checked:hover+.pn-radio[data-invalid]>.pn-radio-container>.pn-radio-outer{border-color:#500715}pn-radio-button>input[type=radio]:disabled:hover+.pn-radio[data-invalid]{border-color:#f3f2f2}pn-radio-button>input[type=radio]:disabled:hover+.pn-radio>.pn-radio-container>.pn-radio-outer{background-color:#f3f2f2}pn-radio-button>input[type=radio]:disabled:checked:hover+.pn-radio[data-invalid]{border-color:#f3f2f2}pn-radio-button>input[type=radio]:disabled:checked:hover+.pn-radio[data-invalid]>.pn-radio-container>.pn-radio-outer{background-color:#f3f2f2}pn-radio-button>input[type=radio]:disabled:checked:hover+.pn-radio[data-invalid]>.pn-radio-container>.pn-radio-outer>.pn-radio-inner{background-color:#969087}pn-radio-button>input[type=radio]:disabled:checked:hover+.pn-radio>.pn-radio-container>.pn-radio-outer{background-color:#f3f2f2}pn-radio-button>input[type=radio]:focus-visible+.pn-radio .pn-radio-outer{outline-color:#005d92}pn-radio-button>input[type=radio]:focus-visible+.pn-radio[data-invalid] .pn-radio-outer{outline-color:#a70707}pn-radio-button>input[type=radio]:focus-visible+.pn-radio[data-tile]{outline-color:#005d92;border-color:#005d92}pn-radio-button>input[type=radio]:focus-visible+.pn-radio[data-tile][data-invalid]{outline-color:#a70707;border-color:#a70707}pn-radio-button>input[type=radio]:focus-visible+.pn-radio[data-tile]>.pn-radio-container>.pn-radio-outer{outline:none}pn-radio-button>input[type=radio]:checked+.pn-radio[data-tile]{border-color:#005d92;background-color:#e0f8ff}pn-radio-button>input[type=radio]:checked+.pn-radio[data-tile][data-invalid]{border-color:#a70707;background-color:#fdefee}pn-radio-button>input[type=radio]:checked+.pn-radio>.pn-radio-container>.pn-radio-outer{border-color:#005d92}pn-radio-button>input[type=radio]:checked+.pn-radio>.pn-radio-container>.pn-radio-outer>.pn-radio-inner{transform:scale(1);background-color:#005d92}pn-radio-button>input[type=radio]:checked+.pn-radio[data-invalid]>.pn-radio-container>.pn-radio-outer{border-color:#a70707}pn-radio-button>input[type=radio]:checked+.pn-radio[data-invalid]>.pn-radio-container>.pn-radio-outer>.pn-radio-inner{background-color:#a70707}pn-radio-button>input[type=radio]:disabled{cursor:not-allowed}pn-radio-button>input[type=radio]:disabled:active+.pn-radio{outline:none}pn-radio-button>input[type=radio]:disabled+.pn-radio[data-tile],pn-radio-button>input[type=radio]:disabled+.pn-radio[data-tile][data-invalid]{background-color:#f3f2f2;border-color:#f3f2f2}pn-radio-button>input[type=radio]:disabled+.pn-radio[data-tile]>pn-icon>.pn-icon-svg path,pn-radio-button>input[type=radio]:disabled+.pn-radio[data-tile][data-invalid]>pn-icon>.pn-icon-svg path{fill:#5e554a}pn-radio-button>input[type=radio]:disabled+.pn-radio[data-tile]>.pn-radio-content>.pn-radio-label,pn-radio-button>input[type=radio]:disabled+.pn-radio[data-tile][data-invalid]>.pn-radio-content>.pn-radio-label{color:#5e554a}pn-radio-button>input[type=radio]:disabled+.pn-radio>.pn-radio-container>.pn-radio-outer{background-color:#f3f2f2;border-color:#969087;outline:none}pn-radio-button>input[type=radio]:disabled+.pn-radio>.pn-radio-container>.pn-radio-outer>.pn-radio-inner{background-color:#969087}pn-radio-button>input[type=radio]:disabled:checked+.pn-radio[data-invalid]>.pn-radio-container>.pn-radio-outer,pn-radio-button>input[type=radio]:disabled:checked+.pn-radio[data-tile]>.pn-radio-container>.pn-radio-outer,pn-radio-button>input[type=radio]:disabled:checked+.pn-radio[data-tile][data-invalid]>.pn-radio-container>.pn-radio-outer{background-color:#f3f2f2;border-color:#969087;outline:none}pn-radio-button>input[type=radio]:disabled:checked+.pn-radio[data-invalid]>.pn-radio-container>.pn-radio-outer>.pn-radio-inner,pn-radio-button>input[type=radio]:disabled:checked+.pn-radio[data-tile]>.pn-radio-container>.pn-radio-outer>.pn-radio-inner,pn-radio-button>input[type=radio]:disabled:checked+.pn-radio[data-tile][data-invalid]>.pn-radio-container>.pn-radio-outer>.pn-radio-inner{background-color:#969087}";const t=d;const e=class{constructor(i){o(this,i)}id=`pn-radio-button-${n()}`;idHelper=`${this.id}-helpertext`;get hostElement(){return i(this)}label="";value;name;checked=false;helpertext;radioid=this.id;disabled=false;required=false;invalid=false;tile=false;icon=null;handleId(){this.idHelper=`${this.radioid}-helpertext`}componentWillLoad(){this.handleId()}render(){return a(r,{key:"68e3b652705f9abb8f235a95d10744d3e89092e8"},a("input",{key:"6132e5bb106f5d1b17c96192a6d0f9e4d459118f",type:"radio",id:this.radioid,value:this.value,name:this.name,disabled:this.disabled,required:this.required,checked:this.checked,"aria-describedby":!!this.helpertext&&this.idHelper}),a("div",{key:"0050033b5f5d8a11a6dcb23ef1002deead7ef19f",class:"pn-radio","data-tile":this.tile,"data-invalid":this.invalid},a("div",{key:"217cd61094ba74d12b66b0f1ce4a62a738cd9ea1",class:"pn-radio-container"},a("div",{key:"a49818c6446d4a2de16c5cb7347810daa6cc762b",class:"pn-radio-outer"},a("div",{key:"0bc4d654b6b5b3b297cae0556c07fc325c344ab3",class:"pn-radio-inner"}))),(this.label||this.helpertext)&&a("p",{key:"9b2ae7ed9948e20e86a55ecf7ac054018c3b11ca",class:"pn-radio-content"},this.label&&a("label",{key:"152513820b14572e2a62129d21b7dd2096ea771d",htmlFor:this.radioid,class:"pn-radio-label"},this.label),this.helpertext&&a("span",{key:"e2b8df55b8f6fd4652d7e153a0442f2574791768",id:this.idHelper,class:"pn-radio-helpertext"},this.helpertext)),this.tile&&this.icon&&a("pn-icon",{key:"23937af22e63746d80008031aaa34cbb982ea357",color:"gray900",icon:this.icon})))}static get watchers(){return{radioid:["handleId"]}}};e.style=t;export{e as pn_radio_button};
//# sourceMappingURL=p-4fca160d.entry.js.map