/*!
 * Built with Stencil
 * By PostNord.
 */
'use strict';

var index = require('./index-CfUQZtlH.js');
var index$1 = require('./index.cjs.js');
var check = require('./check-CQU2BD5S.js');

const pnChoiceChipCss = () => `${index.transformTag("pn-choice-chip")}{display:inline-block}${index.transformTag("pn-choice-chip")} .pn-choice-chip{position:relative;font-size:1em;font-weight:500;text-align:center}${index.transformTag("pn-choice-chip")} .pn-choice-chip-container{cursor:pointer;position:relative;display:flex;align-items:center;gap:0;padding:0.5em 1em;border:0.0625em solid #969087;border-radius:0.5em;background-color:#ffffff;transition-property:border-color, outline-color, background-color, padding, gap;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${index.transformTag("pn-choice-chip")} .pn-choice-chip-container{transition-duration:0s;transition-delay:0s}}${index.transformTag("pn-choice-chip")} .pn-choice-chip-container{outline:0.2rem solid transparent;outline-offset:0.2rem}${index.transformTag("pn-choice-chip")} .pn-choice-chip-container[data-icon]{gap:0.25em;padding-left:0.75em}${index.transformTag("pn-choice-chip")} .pn-choice-chip-container[data-icon][data-small]{padding-left:0.5em}${index.transformTag("pn-choice-chip")} .pn-choice-chip-container[data-icon][data-large]{padding-left:1em}${index.transformTag("pn-choice-chip")} .pn-choice-chip-container[data-icon]>.pn-choice-chip-icon{width:1.5em}${index.transformTag("pn-choice-chip")} .pn-choice-chip-container[data-small]{padding:0.25em 0.75em}${index.transformTag("pn-choice-chip")} .pn-choice-chip-container[data-small] .pn-choice-chip-label{line-height:1.25em}${index.transformTag("pn-choice-chip")} .pn-choice-chip-container[data-small] .pn-choice-chip-label>span{font-size:0.875em}${index.transformTag("pn-choice-chip")} .pn-choice-chip-container[data-large]{padding:0.625em 1.25em}${index.transformTag("pn-choice-chip")} .pn-choice-chip-icon{position:relative;width:0;height:1.5em;transition-property:width;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${index.transformTag("pn-choice-chip")} .pn-choice-chip-icon{transition-duration:0s;transition-delay:0s}}${index.transformTag("pn-choice-chip")} .pn-choice-chip-icon ${index.transformTag("pn-icon")}{opacity:0;transform:scale(0);position:absolute;top:0;left:0;transition-property:transform, opacity;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${index.transformTag("pn-choice-chip")} .pn-choice-chip-icon ${index.transformTag("pn-icon")}{transition-duration:0s;transition-delay:0s}}${index.transformTag("pn-choice-chip")} .pn-choice-chip-icon ${index.transformTag("pn-icon")}.pn-choice-chip-icon-user{opacity:1;transform:scale(1)}${index.transformTag("pn-choice-chip")} .pn-choice-chip-label{color:#005d92;line-height:1.5em;transition-property:color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${index.transformTag("pn-choice-chip")} .pn-choice-chip-label{transition-duration:0s;transition-delay:0s}}${index.transformTag("pn-choice-chip")} .pn-choice-chip-label{cursor:pointer;display:flex;align-items:center;flex-grow:1;height:100%}${index.transformTag("pn-choice-chip")} .pn-choice-chip>input{position:absolute;z-index:1;opacity:0;top:0;left:0;width:100%;height:100%;margin:0;cursor:pointer}${index.transformTag("pn-choice-chip")} .pn-choice-chip>input:not(:checked)~.pn-choice-chip-container>.pn-choice-chip-icon>.pn-choice-chip-icon-user{transform:scale(1);opacity:1}${index.transformTag("pn-choice-chip")} .pn-choice-chip>input:hover~.pn-choice-chip-container{background-color:#effbff;border-color:#005d92}${index.transformTag("pn-choice-chip")} .pn-choice-chip>input:hover~.pn-choice-chip-container .pn-choice-chip-icon-user .pn-icon-svg path,${index.transformTag("pn-choice-chip")} .pn-choice-chip>input:hover~.pn-choice-chip-container .pn-choice-chip-icon-check .pn-icon-svg path{fill:#005d92}${index.transformTag("pn-choice-chip")} .pn-choice-chip>input:hover~.pn-choice-chip-container .pn-choice-chip-label{color:#005d92}${index.transformTag("pn-choice-chip")} .pn-choice-chip>input:checked~.pn-choice-chip-container{gap:0.25em;background-color:#e0f8ff;border-color:#005d92}${index.transformTag("pn-choice-chip")} .pn-choice-chip>input:checked~.pn-choice-chip-container>.pn-choice-chip-icon{width:1.5em;stroke-dashoffset:23}${index.transformTag("pn-choice-chip")} .pn-choice-chip>input:checked~.pn-choice-chip-container>.pn-choice-chip-icon>.pn-choice-chip-icon-check{transform:scale(1);opacity:1}${index.transformTag("pn-choice-chip")} .pn-choice-chip>input:checked~.pn-choice-chip-container>.pn-choice-chip-icon>.pn-choice-chip-icon-user{transform:scale(0);opacity:0}${index.transformTag("pn-choice-chip")} .pn-choice-chip>input:checked~.pn-choice-chip-container>.pn-choice-chip-label{color:#0d234b}${index.transformTag("pn-choice-chip")} .pn-choice-chip>input:checked:hover~.pn-choice-chip-container{background-color:#effbff;border-color:#0d234b}${index.transformTag("pn-choice-chip")} .pn-choice-chip>input:checked:hover~.pn-choice-chip-container>.pn-choice-chip-icon>.pn-choice-chip-icon-check path{fill:#0d234b}${index.transformTag("pn-choice-chip")} .pn-choice-chip>input:checked:hover~.pn-choice-chip-container>.pn-choice-chip-label{color:#0d234b}${index.transformTag("pn-choice-chip")} .pn-choice-chip>input:focus-visible~.pn-choice-chip-container{outline-color:#005d92;border-color:#005d92}${index.transformTag("pn-choice-chip")} .pn-choice-chip>input:disabled{cursor:not-allowed}${index.transformTag("pn-choice-chip")} .pn-choice-chip>input:disabled:active~.pn-choice-chip-container{outline:none}${index.transformTag("pn-choice-chip")} .pn-choice-chip>input:disabled~.pn-choice-chip-container{background-color:#f3f2f2;border-color:#f3f2f2;cursor:not-allowed}${index.transformTag("pn-choice-chip")} .pn-choice-chip>input:disabled~.pn-choice-chip-container .pn-choice-chip-label{color:#5e554a;cursor:not-allowed}${index.transformTag("pn-choice-chip")} .pn-choice-chip>input:disabled~.pn-choice-chip-container ${index.transformTag("pn-icon")} .pn-icon-svg path{fill:#5e554a}`;

const PnChoiceChip = class {
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
    }
    get hostElement() { return index.getElement(this); }
    moving = false;
    /** The choice chip label */
    label;
    /** This will be emitted on change and input */
    value;
    /** The name of the checkbox group */
    name;
    /** Precheck the choice chip */
    checked = false;
    /** Make the choice chip a radio */
    radio = false;
    /** A unique HTML id */
    choiceid = `pn-choice-chip-${index$1.uuidv4()}`;
    /** Include an icon */
    icon;
    /** Set the choice chip as required. @category State */
    required = false;
    /** Disable the choice chip. @category State */
    disabled = false;
    /** Set the size to small. @category Size */
    small = false;
    /** Set the size to large. @category Size */
    large = false;
    render() {
        return (index.h(index.Host, { key: '8d5686163aba07794c4700e91a9d378200aa2bf9' }, index.h("div", { key: '233605ae9b531853d9f941f99cc0cf6fcce21bba', class: "pn-choice-chip" }, index.h("input", { key: 'aacdd59b76f20029234722e49ab5b2aa27198206', type: this.radio ? 'radio' : 'checkbox', id: this.choiceid, value: this.value, name: this.name, checked: this.checked, required: this.required, disabled: this.disabled }), index.h("div", { key: '69a287ffabea602b28360dc5a15d979dcb3d6526', class: "pn-choice-chip-container", "data-icon": !!this.icon, "data-small": this.small, "data-large": this.large }, index.h("div", { key: 'c2d89b6817b623264e903aed26947d8a422a1ee2', class: "pn-choice-chip-icon" }, index.h("pn-icon", { key: 'd405b85cec9b30f85a5949862dec48cdacc618de', color: "blue700", class: "pn-choice-chip-icon-check", icon: check.check }), !!this.icon && index.h("pn-icon", { key: '4a23075f0cfb6c6f3e7fbf49c5de06137c1bc961', color: "blue700", class: "pn-choice-chip-icon-user", icon: this.icon })), index.h("label", { key: 'af080ab55ce96b7d0bc3e0c168130bd772302d52', class: "pn-choice-chip-label", htmlFor: this.choiceid }, index.h("span", { key: '2ed2b62f84c1e2c85ace67151bd1997bcc762027' }, this.label), index.h("slot", { key: '3512fdee318749598e66d096ec56a66e3daa564a' }))))));
    }
};
PnChoiceChip.style = pnChoiceChipCss();

exports.pn_choice_chip = PnChoiceChip;
