@postnord/pn-marketweb-components 4.1.0 → 4.1.2

package/umd/modules/@postnord/web-components/components/pn-select2.js

@@ -2,109 +2,4 @@
  * Built with Stencil
  * By PostNord.
  */
-import { proxyCustomElement, HTMLElement, forceUpdate, h, Host } from '@stencil/core/internal/client';
-import { a as alert_exclamation_circle } from './alert_exclamation_circle.js';
-import { c as chevron_down } from './chevron_down.js';
-import { u as uuidv4 } from './helpers.js';
-import { d as defineCustomElement$1 } from './pn-icon2.js';
-
-const pnSelectCss = "pn-select{display:inline-block}pn-select .pn-select-label{cursor:pointer;display:flex;justify-content:space-between;align-items:flex-end;font-weight:400;color:#2d2013;margin:0 0 0.25em 0;gap:0.5em;-webkit-tap-highlight-color:transparent;transition-property:color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){pn-select .pn-select-label{transition-duration:0s;transition-delay:0s}}pn-select .pn-select-label>span{font-size:0.875em}pn-select .pn-select-input{position:relative}pn-select .pn-select-icon{pointer-events:none;position:absolute;top:50%;transform:translateY(-50%);width:1.5em;height:1.5em;border-radius:50%;background-color:transparent}pn-select .pn-select-icon[data-default]{right:0.75em}pn-select .pn-select-icon[data-custom]{left:0.75em}pn-select .pn-select-icon[data-custom]~.pn-select-element{padding-left:3em}pn-select .pn-select-icon[data-error]{right:3em}pn-select .pn-select-icon[data-error]~.pn-select-element{padding-right:5em}pn-select .pn-select-icon>.pn-icon-svg{transition-property:transform;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){pn-select .pn-select-icon>.pn-icon-svg{transition-duration:0s;transition-delay:0s}}pn-select .pn-select-element{cursor:pointer;color:#2d2013;background-color:#ffffff;border:0.0625em solid #969087;border-radius:0.5em;padding:0.75em;font-family:inherit;font-size:1em;font-weight:500;line-height:1.5em;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}pn-select .pn-select-element:-webkit-autofill,pn-select .pn-select-element:-webkit-autofill:hover,pn-select .pn-select-element:-webkit-autofill:focus,pn-select .pn-select-element:-webkit-autofill:active{-webkit-box-shadow:0 0 0 10em #e0f8ff inset;-webkit-text-fill-color:#2d2013}pn-select .pn-select-element{outline:0.2rem solid transparent;outline-offset:0.2rem}pn-select .pn-select-element:focus-visible{outline-color:#005d92;background-color:#ffffff;border-color:#005d92}pn-select .pn-select-element{transition-property:outline-color, background-color, border-color, color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){pn-select .pn-select-element{transition-duration:0s;transition-delay:0s}}pn-select .pn-select-element::placeholder{color:#5e554a;font-weight:normal}pn-select .pn-select-element:hover{border-color:#005d92}pn-select .pn-select-element:disabled{color:#5e554a;background-color:#f3f2f2;border-color:#f3f2f2}pn-select .pn-select-element{width:100%;padding-right:3em;-webkit-appearance:none;-moz-appearance:none;appearance:none}pn-select .pn-select-element:open+pn-icon .pn-icon-svg{transform:rotate(180deg)}pn-select .pn-select-element:disabled{color:#5e554a;background-color:#f3f2f2;border-color:#f3f2f2}pn-select .pn-select-element[data-placeholder]{color:#5e554a;font-weight:normal}pn-select .pn-select-element:hover{color:#2d2013;background-color:#effbff}pn-select .pn-select-no-results{margin:0;padding:0.75em}pn-select .pn-select-helper{color:#5e554a;font-size:0.875em;font-weight:400;margin:0.25em 0 0 0;display:flex;flex-direction:column;gap:0.25em}pn-select .pn-select-helper[role=alert]{color:#a70707}pn-select .pn-select[data-error]>.pn-select-label{color:#a70707}pn-select .pn-select[data-error]>.pn-select-input>.pn-select-element{border-color:#a70707}pn-select .pn-select[data-error]>.pn-select-input>.pn-select-element:hover{border-color:#500715}pn-select .pn-select[data-error]>.pn-select-input>.pn-select-element:focus-visible{background-color:#ffffff;border-color:#a70707;outline-color:#a70707}pn-select .pn-select[data-error]>.pn-select-input>.pn-select-element:hover{background-color:#fdefee}";
-
-const PnSelect = /*@__PURE__*/ proxyCustomElement(class PnSelect extends HTMLElement {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-    }
-    id = `pn-select-${uuidv4()}`;
-    idHelpertext = `${this.id}-text`;
-    select;
-    mo;
-    get hostElement() { return this; }
-    /** Label placed above the select. */
-    label;
-    /** Display a helper text underneath the select. */
-    helpertext;
-    /** Select HTML id */
-    selectId = this.id;
-    /** Display an icon to the left of the select input. */
-    icon;
-    /** HTML select name. @category HTML */
-    name;
-    /** HTML form name. @category HTML */
-    form;
-    /** HTML autocomplete. @category HTML */
-    autocomplete;
-    /**
-     * Set the select as required.
-     * @category Validation
-     */
-    required = false;
-    /**
-     * Disable the select.
-     * @category Validation
-     */
-    disabled = false;
-    /**
-     * Trigger the invalid state.
-     * @category Validation
-     */
-    invalid = false;
-    /**
-     * Display an error message and trigger the invalid state.
-     * @category Validation
-     */
-    error;
-    componentDidLoad() {
-        if (this.mo)
-            this.mo.disconnect();
-        this.mo = new MutationObserver(() => forceUpdate(this.hostElement));
-        this.mo.observe(this.hostElement, { childList: true, subtree: true });
-    }
-    hasError() {
-        return this.invalid || !!this.error;
-    }
-    hasMessage() {
-        return !!this.helpertext || !!this.error;
-    }
-    render() {
-        return (h(Host, { key: 'cc46eb6dc84af1a7361eb2463c0f8d563de06f8b' }, h("div", { key: 'a9b47a287a04a3a21eab78559818816256f91954', class: "pn-select", "data-error": this.hasError() }, this.label && (h("label", { key: '55584541034164f768da54dc7c633202dd0c238b', htmlFor: this.selectId, class: "pn-select-label" }, h("span", { key: '9a459ff694994d43426ecbc911f762d839152934' }, this.label))), h("div", { key: '3326540dbc18b5dd12033aa988b67c5104df5141', class: "pn-select-input" }, this.icon && h("pn-icon", { key: '3e25d5a9f5b0dc2713ded1c71ae2608075a57e6d', class: "pn-select-icon", icon: this.icon, "data-custom": true, "aria-hidden": "true" }), this.hasError() && (h("pn-icon", { key: '8faf236ff6ca25b6423b213a409ee6cdacae6083', class: "pn-select-icon", icon: alert_exclamation_circle, color: "warning", "data-error": true, "aria-hidden": "true" })), h("select", { key: '4f4f1ae8b084c5f264c43243f181bbf4986191ec', id: this.selectId, class: "pn-select-element", name: this.name, form: this.form, autocomplete: this.autocomplete, "aria-describedby": this.hasMessage() && this.idHelpertext, "aria-invalid": this.hasError().toString(), disabled: this.disabled, "data-placeholder": this.select?.value === '', ref: el => (this.select = el) }, h("slot", { key: '2c78bb1de994082d336fe115a87ed50a1f3c9c12' })), h("pn-icon", { key: 'fe6b3bd85c20f3c55634c4b5c67cf45022fea677', class: "pn-select-icon", icon: chevron_down, color: "blue700", "data-default": true, "aria-hidden": "true" })), this.hasMessage() && (h("p", { key: '4c4c1b78ec41e11e71c794b22e1b53ea28b1a407', id: this.idHelpertext, class: "pn-select-helper", role: !!this.error ? 'alert' : null }, h("span", { key: '8d6c3bbef9787dece5b4d21ba412ee17c0a3afdf' }, this.error || this.helpertext))))));
-    }
-    static get style() { return pnSelectCss; }
-}, [772, "pn-select", {
-        "label": [1],
-        "helpertext": [1],
-        "selectId": [1, "select-id"],
-        "icon": [1],
-        "name": [1],
-        "form": [1],
-        "autocomplete": [1],
-        "required": [4],
-        "disabled": [4],
-        "invalid": [4],
-        "error": [1]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["pn-select", "pn-icon"];
-    components.forEach(tagName => { switch (tagName) {
-        case "pn-select":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, PnSelect);
-            }
-            break;
-        case "pn-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$1();
-            }
-            break;
-    } });
-}
-
-export { PnSelect as P, defineCustomElement as d };
-//# sourceMappingURL=pn-select2.js.map
-
-//# sourceMappingURL=pn-select2.js.map
+import{transformTag as e,proxyCustomElement as t,HTMLElement as n,forceUpdate as l,h as s,Host as c}from"@stencil/core/internal/client";import{a as o}from"./alert_exclamation_circle.js";import{c as a}from"./chevron_down.js";import{u as i}from"./helpers.js";import{d as r}from"./pn-icon2.js";const p=t(class extends n{constructor(e){super(),!1!==e&&this.__registerHost()}id=`pn-select-${i()}`;idHelpertext=`${this.id}-text`;select;mo;get hostElement(){return this}label;helpertext;selectId=this.id;icon;compact=!1;name;form;autocomplete;required=!1;disabled=!1;invalid=!1;error;componentDidLoad(){this.mo&&this.mo.disconnect(),this.mo=new MutationObserver((()=>l(this.hostElement))),this.mo.observe(this.hostElement,{childList:!0,subtree:!0})}hasError(){return this.invalid||!!this.error}hasMessage(){return!!this.helpertext||!!this.error}renderLabel(){return this.label?s("label",{htmlFor:this.selectId,class:"pn-select-label","data-compact":this.compact,"data-icon":!!this.icon},s("span",null,this.label)):null}render(){return s(c,{key:"59c8dba79bf97e55cdf0bb63242bab619729e182"},s("div",{key:"08ee599ef117480e98506e6594bb798931dade58",class:"pn-select","data-error":this.hasError()},!this.compact&&this.renderLabel(),s("div",{key:"4416853996ab6849ef128f3abd7d53861e3d6bbe",class:"pn-select-input"},this.icon&&s("pn-icon",{key:"8af79d8f23f6e7b9853130ca77d2ac00f264afe7",class:"pn-select-icon",icon:this.icon,"data-custom":!0,"aria-hidden":"true"}),this.hasError()&&s("pn-icon",{key:"ad674903cc8cefb0864b425a4f6bd6540b5164f3",class:"pn-select-icon",icon:o,color:"warning","data-error":!0,"aria-hidden":"true"}),s("select",{key:"fc84d7571dc544030770dd8ea88c87e3a1d58bc5",id:this.selectId,class:"pn-select-element",name:this.name,form:this.form,autocomplete:this.autocomplete,"aria-describedby":this.hasMessage()&&this.idHelpertext,"aria-invalid":this.hasError().toString(),disabled:this.disabled,"data-placeholder":""===this.select?.value,"data-compact":this.compact,ref:e=>this.select=e},s("slot",{key:"1cca39bd8954649b1a558876d31509c3be0f4763"})),this.compact&&this.renderLabel(),s("pn-icon",{key:"a5efd954143ce705d806a1a7a1b37b09714d1657",class:"pn-select-icon",icon:a,color:"blue700","data-default":!0,"aria-hidden":"true"})),this.hasMessage()&&s("p",{key:"54e7855163fc3c91cb2bdac99aaa7ed9bfd14fc9",id:this.idHelpertext,class:"pn-select-helper",role:this.error?"alert":null},s("span",{key:"21397e124292c51dfe3113b526626059dc9b513d"},this.error||this.helpertext))))}static get style(){return`${e("pn-select")}{display:inline-block}${e("pn-select")} .pn-select-label{cursor:pointer;display:flex;justify-content:space-between;align-items:flex-end;font-weight:400;color:#2d2013;margin:0 0 0.25em 0;gap:0.5em;-webkit-tap-highlight-color:transparent;transition-property:color, transform;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-select")} .pn-select-label{transition-duration:0s;transition-delay:0s}}${e("pn-select")} .pn-select-label[data-compact]{position:absolute;top:1.5625em;left:calc(var(--pn-input-offset-left, 0px) + 0.75em + 0.0625em);margin:0;pointer-events:none;align-items:center;height:1.5em;max-width:calc(100% - (var(--pn-input-offset-left, 0px) + 0.75em) - (var(--pn-input-offset-right, 0px) + 0.75em));transform:translateY(-50%) scale(1) translateZ(0);transform-origin:0 0;transition-delay:0.2s}${e("pn-select")} .pn-select-label[data-compact]>span{font-size:1em;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;line-height:1.5em}${e("pn-select")} .pn-select-label>span{font-size:0.875em}${e("pn-select")} .pn-select-label[data-compact][data-icon]{--pn-input-offset-left:calc(2em)}${e("pn-select")} .pn-select-input{position:relative}${e("pn-select")} .pn-select-icon{pointer-events:none;position:absolute;top:50%;transform:translateY(-50%);width:1.5em;height:1.5em;border-radius:50%;background-color:transparent}${e("pn-select")} .pn-select-icon[data-default]{right:1em}${e("pn-select")} .pn-select-icon[data-custom]{left:0.75em}${e("pn-select")} .pn-select-icon[data-custom]~.pn-select-element{padding-left:2.75em}${e("pn-select")} .pn-select-icon[data-error]{right:3.5em}${e("pn-select")} .pn-select-icon[data-error]~.pn-select-element{padding-right:5.5em}${e("pn-select")} .pn-select-icon>.pn-icon-svg{transition-property:transform;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-select")} .pn-select-icon>.pn-icon-svg{transition-duration:0s;transition-delay:0s}}${e("pn-select")} .pn-select-element{cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;text-overflow:ellipsis;white-space:nowrap;color:#2d2013;background-color:#ffffff;border:0.0625em solid #969087;border-radius:0.5em;padding:0.75em 3em 0.75em 0.75em;font-family:inherit;font-size:1em;font-weight:500;line-height:1.5em;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}${e("pn-select")} .pn-select-element:-webkit-autofill,${e("pn-select")} .pn-select-element:-webkit-autofill:hover,${e("pn-select")} .pn-select-element:-webkit-autofill:focus,${e("pn-select")} .pn-select-element:-webkit-autofill:active{-webkit-box-shadow:0 0 0 10em #e0f8ff inset;-webkit-text-fill-color:#2d2013}${e("pn-select")} .pn-select-element{outline:0.2rem solid transparent;outline-offset:0.2rem}${e("pn-select")} .pn-select-element:focus-visible{outline-color:#005d92;background-color:#ffffff;border-color:#005d92}${e("pn-select")} .pn-select-element{transition-property:outline-color, background-color, border-color, color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${e("pn-select")} .pn-select-element{transition-duration:0s;transition-delay:0s}}${e("pn-select")} .pn-select-element[data-compact]{text-align:left;padding-top:1.125em;padding-bottom:0.375em;max-width:unset}${e("pn-select")} .pn-select-element[data-compact]::placeholder{color:transparent}${e("pn-select")} .pn-select-element[data-compact]:focus+.pn-select-label,${e("pn-select")} .pn-select-element[data-compact]:not(:placeholder-shown)+.pn-select-label{transform:translateY(-85%) scale(0.75);transition-delay:0s}${e("pn-select")} .pn-select-element::placeholder{color:#5e554a;font-weight:normal}${e("pn-select")} .pn-select-element:hover{border-color:#005d92}${e("pn-select")} .pn-select-element:disabled{color:#5e554a;background-color:#f3f2f2;border-color:#f3f2f2}${e("pn-select")} .pn-select-element:open~.pn-select-icon .pn-icon-svg{transform:rotate(180deg)}${e("pn-select")} .pn-select-element:disabled{color:#5e554a;background-color:#f3f2f2;border-color:#f3f2f2}${e("pn-select")} .pn-select-element[data-placeholder]{color:#5e554a;font-weight:normal}${e("pn-select")} .pn-select-element:hover{color:#2d2013;background-color:#effbff}${e("pn-select")} .pn-select-no-results{margin:0;padding:0.75em}${e("pn-select")} .pn-select-helper{color:#5e554a;font-size:0.875em;font-weight:400;margin:0.25em 0 0 0;display:flex;flex-direction:column;gap:0.25em}${e("pn-select")} .pn-select-helper[role=alert]{color:#a70707}${e("pn-select")} .pn-select[data-error]>.pn-select-label{color:#a70707}${e("pn-select")} .pn-select[data-error]>.pn-select-input>.pn-select-element{border-color:#a70707}${e("pn-select")} .pn-select[data-error]>.pn-select-input>.pn-select-element:hover{border-color:#500715}${e("pn-select")} .pn-select[data-error]>.pn-select-input>.pn-select-element:focus-visible{background-color:#ffffff;border-color:#a70707;outline-color:#a70707}${e("pn-select")} .pn-select[data-error]>.pn-select-input>.pn-select-element:-webkit-autofill,${e("pn-select")} .pn-select[data-error]>.pn-select-input>.pn-select-element:-webkit-autofill:hover,${e("pn-select")} .pn-select[data-error]>.pn-select-input>.pn-select-element:-webkit-autofill:focus,${e("pn-select")} .pn-select[data-error]>.pn-select-input>.pn-select-element:-webkit-autofill:active{-webkit-box-shadow:0 0 0 10em #fef7f6 inset;-webkit-text-fill-color:#2d2013}${e("pn-select")} .pn-select[data-error]>.pn-select-input>.pn-select-element:hover{background-color:#fdefee}`}},[772,"pn-select",{label:[1],helpertext:[1],selectId:[1,"select-id"],icon:[1],compact:[4],name:[1],form:[1],autocomplete:[1],required:[4],disabled:[4],invalid:[4],error:[1]}]);function d(){"undefined"!=typeof customElements&&["pn-select","pn-icon"].forEach((t=>{switch(t){case"pn-select":customElements.get(e(e(t)))||customElements.define(e(e(t)),p);break;case"pn-icon":customElements.get(e(e(t)))||r()}}))}export{p as P,d}

package/umd/modules/@postnord/web-components/components/pn-spinner.js

@@ -2,12 +2,4 @@
  * Built with Stencil
  * By PostNord.
  */
-import { P as PnSpinner$1, d as defineCustomElement$1 } from './pn-spinner2.js';
-
-const PnSpinner = PnSpinner$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { PnSpinner, defineCustomElement };
-//# sourceMappingURL=pn-spinner.js.map
-
-//# sourceMappingURL=pn-spinner.js.map
+import{P as s,d as n}from"./pn-spinner2.js";const o=s,p=n;export{o as PnSpinner,p as defineCustomElement}

package/umd/modules/@postnord/web-components/components/pn-spinner2.js

@@ -2,53 +2,4 @@
  * Built with Stencil
  * By PostNord.
  */
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-
-const pnSpinnerCss = "pn-spinner{display:inline-block}pn-spinner .pn-spinner{--pn-spinner-size:1.5em;--pn-spinner-color:main.$blue700;height:var(--pn-spinner-size);width:var(--pn-spinner-size);display:block;animation:rotate 1s infinite;animation-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){pn-spinner .pn-spinner{animation-duration:2s}}pn-spinner .pn-spinner-circle{stroke:var(--pn-spinner-color);transform-origin:center center;transform:rotate(-310deg);stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:64;animation:loading 2s infinite;animation-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){pn-spinner .pn-spinner-circle{animation-duration:4s}}pn-spinner .pn-spinner-dot{fill:var(--pn-spinner-color)}@keyframes loading{0%{stroke-dashoffset:55}50%{stroke-dashoffset:12}100%{stroke-dashoffset:55}}@keyframes rotate{from{transform:rotate(-180deg) scaleX(-1)}to{transform:rotate(180deg) scaleX(-1)}}";
-
-const PnSpinner = /*@__PURE__*/ proxyCustomElement(class PnSpinner extends HTMLElement {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-    }
-    get hostElement() { return this; }
-    /** Light version of the spinner. */
-    light = false;
-    /** Size in em. */
-    size = 1.5;
-    getColor() {
-        if (this.light)
-            return '#fff';
-        return '#005d92';
-    }
-    getSize() {
-        return `${this.size}em`;
-    }
-    render() {
-        return (h(Host, { key: 'a9ecba01b5b30a660a44439c714b7ad57cf02a88' }, h("svg", { key: '03fbe990bf1ae0402fcb27707e0c1712d8a84492', class: "pn-spinner", style: { '--pn-spinner-size': this.getSize(), '--pn-spinner-color': this.getColor() }, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none" }, h("circle", { key: 'c48784865cd9c8c3d55cd9b1bd3e0dff7a4ebe35', class: "pn-spinner-circle", cx: "12", cy: "12", r: "10", "stroke-width": "3" }), h("circle", { key: '5f69d1bbbf864842f9ae54dc9a29b61603a83bff', class: "pn-spinner-dot", cx: "21.3", cy: "16", r: "1.48" }))));
-    }
-    static get style() { return pnSpinnerCss; }
-}, [768, "pn-spinner", {
-        "light": [4],
-        "size": [2]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["pn-spinner"];
-    components.forEach(tagName => { switch (tagName) {
-        case "pn-spinner":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, PnSpinner);
-            }
-            break;
-    } });
-}
-
-export { PnSpinner as P, defineCustomElement as d };
-//# sourceMappingURL=pn-spinner2.js.map
-
-//# sourceMappingURL=pn-spinner2.js.map
+import{transformTag as n,proxyCustomElement as e,HTMLElement as r,h as i,Host as s}from"@stencil/core/internal/client";const t=e(class extends r{constructor(n){super(),!1!==n&&this.__registerHost()}get hostElement(){return this}light=!1;size=1.5;getColor(){return this.light?"#fff":"#005d92"}getSize(){return`${this.size}em`}render(){return i(s,{key:"a9ecba01b5b30a660a44439c714b7ad57cf02a88"},i("svg",{key:"03fbe990bf1ae0402fcb27707e0c1712d8a84492",class:"pn-spinner",style:{"--pn-spinner-size":this.getSize(),"--pn-spinner-color":this.getColor()},xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"none"},i("circle",{key:"c48784865cd9c8c3d55cd9b1bd3e0dff7a4ebe35",class:"pn-spinner-circle",cx:"12",cy:"12",r:"10","stroke-width":"3"}),i("circle",{key:"5f69d1bbbf864842f9ae54dc9a29b61603a83bff",class:"pn-spinner-dot",cx:"21.3",cy:"16",r:"1.48"})))}static get style(){return`${n("pn-spinner")}{display:inline-block}${n("pn-spinner")} .pn-spinner{--pn-spinner-size:1.5em;--pn-spinner-color:main.$blue700;height:var(--pn-spinner-size);width:var(--pn-spinner-size);display:block;animation:rotate 1s infinite;animation-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${n("pn-spinner")} .pn-spinner{animation-duration:2s}}${n("pn-spinner")} .pn-spinner-circle{stroke:var(--pn-spinner-color);transform-origin:center center;transform:rotate(-310deg);stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:64;animation:loading 2s infinite;animation-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${n("pn-spinner")} .pn-spinner-circle{animation-duration:4s}}${n("pn-spinner")} .pn-spinner-dot{fill:var(--pn-spinner-color)}@keyframes loading{0%{stroke-dashoffset:55}50%{stroke-dashoffset:12}100%{stroke-dashoffset:55}}@keyframes rotate{from{transform:rotate(-180deg) scaleX(-1)}to{transform:rotate(180deg) scaleX(-1)}}`}},[512,"pn-spinner",{light:[4],size:[2]}]);function o(){"undefined"!=typeof customElements&&["pn-spinner"].forEach((e=>{"pn-spinner"===e&&(customElements.get(n(n(e)))||customElements.define(n(n(e)),t))}))}export{t as P,o as d}

package/umd/modules/@postnord/web-components/components/pn-tab.js

@@ -2,166 +2,4 @@
  * Built with Stencil
  * By PostNord.
  */
-import { proxyCustomElement, HTMLElement, createEvent, forceUpdate, h, Host } from '@stencil/core/internal/client';
-import { o as ripple } from './helpers.js';
-import { d as defineCustomElement$2 } from './pn-icon2.js';
-
-const pnTabCss = "pn-tab{position:relative;overflow:hidden;flex-shrink:0;scroll-snap-align:center;display:inline-block;border-radius:0.5em}pn-tab .pn-tab{position:relative;cursor:pointer;margin:1em 0.25em;padding:0 0.25em;border:none;border-radius:0.5em;color:#2d2013;background-color:transparent;font-family:inherit;font-size:1em;font-weight:500;text-decoration:none;display:flex;gap:0.5em;align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent}pn-tab .pn-tab .pn-ripple{animation:ripple 0.4s cubic-bezier(0.7, 0, 0.3, 1);position:absolute;border-radius:50%;background-color:#005d92;transform:translate(-50%, -50%) scale(0);opacity:0.1;pointer-events:none;z-index:3}@keyframes ripple{to{transform:translate(-50%, -50%) scale(1);opacity:0}}pn-tab .pn-tab{transition-property:color, outline-color, background-color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){pn-tab .pn-tab{transition-duration:0s;transition-delay:0s}}pn-tab .pn-tab{outline:0.2rem solid transparent;outline-offset:0.2rem}pn-tab .pn-tab-label{line-height:1.5em}pn-tab .pn-tab:focus-visible{overflow:hidden;outline-color:#005d92;background-color:#ffffff}pn-tab .pn-tab[aria-selected=true],pn-tab .pn-tab[aria-current=page]{color:#005d92}pn-tab .pn-tab[aria-selected=true]:focus,pn-tab .pn-tab[aria-current=page]:focus{color:#0d234b}pn-tab .pn-tab[aria-selected=true]:focus pn-icon>.pn-icon-svg path,pn-tab .pn-tab[aria-selected=true]:focus pn-icon>.pn-icon-svg polygon,pn-tab .pn-tab[aria-current=page]:focus pn-icon>.pn-icon-svg path,pn-tab .pn-tab[aria-current=page]:focus pn-icon>.pn-icon-svg polygon{fill:#0d234b}";
-
-const PnTab$1 = /*@__PURE__*/ proxyCustomElement(class PnTab extends HTMLElement {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-        this.setActiveTab = createEvent(this, "setActiveTab", 7);
-        this.tabEnter = createEvent(this, "tabEnter", 7);
-        this.tabLeave = createEvent(this, "tabLeave", 7);
-    }
-    mo;
-    tag = 'button';
-    get hostElement() { return this; }
-    /** Set a label for the tab. */
-    label;
-    /** This is the value that will be matched with `pn-tablist` value. (required) */
-    value;
-    /** Turns the tab from a `button` to an `a` element, but only if the `pn-tablist` is inside a `pn-header`. */
-    href;
-    /** The SVG content of the icon you want to display */
-    icon;
-    /** Use the ID of the container that this tab controls.  */
-    ariacontrols;
-    /** Tab ID, use if you want to have the tab container be `aria-labelledby` by this tab. */
-    tabid;
-    /** Is set by `pn-tablist`, don't use this prop. @hide true */
-    activeTab;
-    /** Used by `pn-tab` to communicate with `pn-tablist`. Emits the selected tab value and element. */
-    setActiveTab;
-    setActiveTabHandler({ click = false, element } = {}) {
-        if (click || this.isActive()) {
-            const val = element?.value || this.value;
-            const el = ((element?.value && element) || this.hostElement);
-            this.setActiveTab.emit({
-                val,
-                el,
-            });
-        }
-    }
-    /** Used by `pn-tab` to communicate with `pn-tablist`. Emits when the tab gets focus. */
-    tabEnter;
-    triggerEnter(event) {
-        this.tabEnter.emit(event);
-    }
-    /** Used by `pn-tab` to communicate with `pn-tablist`. Emits when the tab is blured.  */
-    tabLeave;
-    triggerLeave(event) {
-        this.tabLeave.emit(event);
-    }
-    connectedCallback() {
-        this.mo = new MutationObserver(() => forceUpdate(this.hostElement));
-        this.mo.observe(this.hostElement, { subtree: true, childList: true });
-    }
-    disconnectedCallback() {
-        this.mo?.disconnect();
-    }
-    componentWillLoad() {
-        this.tabTag();
-    }
-    componentDidUpdate() {
-        this.setActiveTabHandler();
-    }
-    componentDidLoad() {
-        this.setActiveTabHandler();
-    }
-    arrowKeyNav(event) {
-        if (!/^(ArrowRight|ArrowLeft|Home|End)$/.test(event.key))
-            return;
-        event.preventDefault();
-        // Get tablist parent
-        const parent = event.target.closest('pn-tablist');
-        const list = Array.from(parent.querySelectorAll('pn-tab'));
-        const first = list[0];
-        const last = list[list.length - 1];
-        const nextElement = this.hostElement.nextElementSibling;
-        const previousElement = this.hostElement.previousElementSibling;
-        if (event.key === 'Home')
-            this.setActiveTabHandler({ element: first });
-        if (event.key === 'End')
-            this.setActiveTabHandler({ element: last });
-        if (event.key === 'ArrowRight') {
-            // Check the next element value. We do this because the last element i a DIV element. If no value, go to the first element.
-            this.setActiveTabHandler({ element: nextElement?.value ? nextElement : first });
-        }
-        if (event.key === 'ArrowLeft') {
-            // Go to the last element if there is no element to your left.
-            this.setActiveTabHandler({ element: previousElement?.value ? previousElement : last });
-        }
-    }
-    isActive() {
-        return this.activeTab === this.value;
-    }
-    tabTag() {
-        const isMenu = this.hostElement.closest('pn-tablist');
-        this.tag = isMenu.slot === 'menu' ? 'a' : 'button';
-    }
-    renderProperties() {
-        return this.tag === 'a'
-            ? {
-                'href': this.href,
-                'aria-current': this.isActive() ? 'page' : 'false',
-            }
-            : {
-                'tabindex': this.isActive() ? 0 : -1,
-                'type': 'button',
-                'role': 'tab',
-                'aria-selected': this.isActive().toString(),
-                'aria-controls': this.ariacontrols,
-            };
-    }
-    iconColor() {
-        return this.isActive() ? 'blue700' : 'gray900';
-    }
-    handleClick(e) {
-        this.setActiveTabHandler({ click: true });
-        ripple(e, this.hostElement, '.pn-tab');
-    }
-    render() {
-        const Tag = this.tag;
-        return (h(Host, { key: 'd20d66e16c474b40d8eb9172c519a2f0d6e15ae9' }, h(Tag, { key: '850e4b61a7a6f9302dbc087053b2586378c1ea91', id: this.tabid, class: "pn-tab", ...this.renderProperties(), onClick: (e) => this.handleClick(e), onMouseEnter: (e) => this.triggerEnter(e), onFocus: (e) => this.triggerEnter(e), onMouseLeave: (e) => this.triggerLeave(e), onBlur: (e) => this.triggerLeave(e), onKeyDown: (e) => this.arrowKeyNav(e) }, !!this.icon && h("pn-icon", { key: '4c33037d5ced41e88abdad4487cf9e16de07d288', icon: this.icon, color: this.iconColor() }), h("slot", { key: 'c8661b07781d8d82098bb2774761b612a2ff509d' }), h("span", { key: '39358d2c7be0ff2f3c8bc506fd52450027b7d842', class: "pn-tab-label" }, this.label))));
-    }
-    static get style() { return pnTabCss; }
-}, [772, "pn-tab", {
-        "label": [1],
-        "value": [1],
-        "href": [1],
-        "icon": [1],
-        "ariacontrols": [1],
-        "tabid": [1],
-        "activeTab": [1, "active-tab"]
-    }]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["pn-tab", "pn-icon"];
-    components.forEach(tagName => { switch (tagName) {
-        case "pn-tab":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, PnTab$1);
-            }
-            break;
-        case "pn-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-    } });
-}
-
-const PnTab = PnTab$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { PnTab, defineCustomElement };
-//# sourceMappingURL=pn-tab.js.map
-
-//# sourceMappingURL=pn-tab.js.map
+import{transformTag as t,proxyCustomElement as e,HTMLElement as n,createEvent as i,forceUpdate as a,h as o,Host as r}from"@stencil/core/internal/client";import{o as s}from"./helpers.js";import{d as c}from"./pn-icon2.js";const l=e(class extends n{constructor(t){super(),!1!==t&&this.__registerHost(),this.setActiveTab=i(this,"setActiveTab",7),this.tabEnter=i(this,"tabEnter",7),this.tabLeave=i(this,"tabLeave",7)}mo;tag="button";get hostElement(){return this}label;value;href;icon;ariacontrols;tabid;activeTab;setActiveTab;setActiveTabHandler({click:t=!1,element:e}={}){(t||this.isActive())&&this.setActiveTab.emit({val:e?.value||this.value,el:e?.value&&e||this.hostElement})}tabEnter;triggerEnter(t){this.tabEnter.emit(t)}tabLeave;triggerLeave(t){this.tabLeave.emit(t)}connectedCallback(){this.mo=new MutationObserver((()=>a(this.hostElement))),this.mo.observe(this.hostElement,{subtree:!0,childList:!0})}disconnectedCallback(){this.mo?.disconnect()}componentWillLoad(){this.tabTag()}componentDidUpdate(){this.setActiveTabHandler()}componentDidLoad(){this.setActiveTabHandler()}arrowKeyNav(e){if(!/^(ArrowRight|ArrowLeft|Home|End)$/.test(e.key))return;e.preventDefault();const n=e.target.closest(""+t("pn-tablist")),i=Array.from(n.querySelectorAll(""+t("pn-tab"))),a=i[0],o=i[i.length-1],r=this.hostElement.nextElementSibling,s=this.hostElement.previousElementSibling;"Home"===e.key&&this.setActiveTabHandler({element:a}),"End"===e.key&&this.setActiveTabHandler({element:o}),"ArrowRight"===e.key&&this.setActiveTabHandler({element:r?.value?r:a}),"ArrowLeft"===e.key&&this.setActiveTabHandler({element:s?.value?s:o})}isActive(){return this.activeTab===this.value}tabTag(){const e=this.hostElement.closest(""+t("pn-tablist"));this.tag="menu"===e.slot?"a":"button"}renderProperties(){return"a"===this.tag?{href:this.href,"aria-current":this.isActive()?"page":"false"}:{tabindex:this.isActive()?0:-1,type:"button",role:"tab","aria-selected":""+this.isActive(),"aria-controls":this.ariacontrols}}iconColor(){return this.isActive()?"blue700":"gray900"}handleClick(t){this.setActiveTabHandler({click:!0}),s(t,this.hostElement,".pn-tab")}render(){return o(r,{key:"a3d1810848574a33819d13fa281d85eb08f1ce80"},o(this.tag,{key:"08548598375643778185f9ea3900b6b16e079c23",id:this.tabid,class:"pn-tab",...this.renderProperties(),onClick:t=>this.handleClick(t),onMouseEnter:t=>this.triggerEnter(t),onFocus:t=>this.triggerEnter(t),onMouseLeave:t=>this.triggerLeave(t),onBlur:t=>this.triggerLeave(t),onKeyDown:t=>this.arrowKeyNav(t)},!!this.icon&&o("pn-icon",{key:"ed1076eaf2ea4fc6f56ae86e2947b656808d1c02",icon:this.icon,color:this.iconColor()}),o("slot",{key:"48a7a902e8e2712b0595ac88f3b906149703f92c"}),o("span",{key:"cde1646f13a5fe4f553dcfa919268f62286d3f5c",class:"pn-tab-label"},this.label)))}static get style(){return`${t("pn-tab")}{position:relative;overflow:hidden;flex-shrink:0;scroll-snap-align:center;display:inline-block;border-radius:0.5em}${t("pn-tab")} .pn-tab{position:relative;cursor:pointer;margin:1em 0.25em;padding:0 0.25em;border:none;border-radius:0.5em;color:#2d2013;background-color:transparent;font-family:inherit;font-size:1em;font-weight:500;text-decoration:none;display:flex;gap:0.5em;align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent}${t("pn-tab")} .pn-tab .pn-ripple{animation:ripple 0.4s cubic-bezier(0.7, 0, 0.3, 1);position:absolute;border-radius:50%;background-color:#005d92;transform:translate(-50%, -50%) scale(0);opacity:0.1;pointer-events:none;z-index:3}@keyframes ripple{to{transform:translate(-50%, -50%) scale(1);opacity:0}}${t("pn-tab")} .pn-tab{transition-property:color, outline-color, background-color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){${t("pn-tab")} .pn-tab{transition-duration:0s;transition-delay:0s}}${t("pn-tab")} .pn-tab{outline:0.2rem solid transparent;outline-offset:0.2rem}${t("pn-tab")} .pn-tab-label{line-height:1.5em}${t("pn-tab")} .pn-tab:focus-visible{overflow:hidden;outline-color:#005d92;background-color:#ffffff}${t("pn-tab")} .pn-tab[aria-selected=true],${t("pn-tab")} .pn-tab[aria-current=page]{color:#005d92}${t("pn-tab")} .pn-tab[aria-selected=true]:focus,${t("pn-tab")} .pn-tab[aria-current=page]:focus{color:#0d234b}${t("pn-tab")} .pn-tab[aria-selected=true]:focus ${t("pn-icon")}>.pn-icon-svg path,${t("pn-tab")} .pn-tab[aria-selected=true]:focus ${t("pn-icon")}>.pn-icon-svg polygon,${t("pn-tab")} .pn-tab[aria-current=page]:focus ${t("pn-icon")}>.pn-icon-svg path,${t("pn-tab")} .pn-tab[aria-current=page]:focus ${t("pn-icon")}>.pn-icon-svg polygon{fill:#0d234b}`}},[772,"pn-tab",{label:[1],value:[1],href:[1],icon:[1],ariacontrols:[1],tabid:[1],activeTab:[1,"active-tab"]}]),p=l,b=function(){"undefined"!=typeof customElements&&["pn-tab","pn-icon"].forEach((e=>{switch(e){case"pn-tab":customElements.get(t(t(e)))||customElements.define(t(t(e)),l);break;case"pn-icon":customElements.get(t(t(e)))||c()}}))};export{p as PnTab,b as defineCustomElement}

package/umd/modules/@postnord/web-components/components/pn-table.js

@@ -2,55 +2,4 @@
  * Built with Stencil
  * By PostNord.
  */
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-
-const pnTableCss = "pn-table{display:block;margin-bottom:1em}pn-table .pn-table-container table{width:100%}pn-table .pn-table-container table .column-wrapper{display:flex;gap:0.5em;width:100%;align-items:center}pn-table .pn-table-container table,pn-table .pn-table-container table th,pn-table .pn-table-container table td{padding:0;margin:0;border:0;outline:0;border-collapse:collapse;max-width:100%}pn-table .pn-table-container table th,pn-table .pn-table-container table td{text-align:left;line-height:2;vertical-align:middle;padding:1em 1.15em}pn-table .pn-table-container table th:first-child,pn-table .pn-table-container table td:first-child{border-radius:0.5em 0 0 0.5em}pn-table .pn-table-container table th:last-child,pn-table .pn-table-container table td:last-child{border-radius:0 0.5em 0.5em 0}pn-table .pn-table-container table th pn-icon,pn-table .pn-table-container table td pn-icon{vertical-align:middle}pn-table .pn-table-container table thead tr th,pn-table .pn-table-container table thead tr td{color:#005d92;font-weight:500}pn-table .pn-table-container table tbody tr th,pn-table .pn-table-container table tbody tr td{color:#2d2013;font-weight:400}pn-table.bordered .pn-table-container table{border-collapse:separate;border-spacing:0}pn-table.bordered .pn-table-container table thead tr:last-child th,pn-table.bordered .pn-table-container table thead tr:last-child td{border-bottom-width:0.0625em}pn-table.bordered .pn-table-container table thead tr:first-child th,pn-table.bordered .pn-table-container table thead tr:first-child td{border-top:0.0625em solid #005d92}pn-table.bordered .pn-table-container table thead tr th,pn-table.bordered .pn-table-container table thead tr td{border-bottom:0.0625em solid #005d92}pn-table.bordered .pn-table-container table thead tr th:first-child,pn-table.bordered .pn-table-container table thead tr td:first-child{border-left:0.0625em solid #005d92;border-radius:0.5em 0 0}pn-table.bordered .pn-table-container table thead tr th:last-child,pn-table.bordered .pn-table-container table thead tr td:last-child{border-radius:0 0.5em 0 0;border-right:0.0625em solid #005d92}pn-table.bordered .pn-table-container table tbody tr th,pn-table.bordered .pn-table-container table tbody tr td{border-bottom:0.0625em solid #d3cecb}pn-table.bordered .pn-table-container table tbody tr th:first-child,pn-table.bordered .pn-table-container table tbody tr td:first-child{border-left:0.0625em solid #005d92;border-radius:0}pn-table.bordered .pn-table-container table tbody tr th:last-child,pn-table.bordered .pn-table-container table tbody tr td:last-child{border-right:0.0625em solid #005d92;border-radius:0}pn-table.bordered .pn-table-container table tbody tr:last-of-type th,pn-table.bordered .pn-table-container table tbody tr:last-of-type td{border-bottom:0.0625em solid #005d92}pn-table.bordered .pn-table-container table tbody tr:last-of-type th:last-child,pn-table.bordered .pn-table-container table tbody tr:last-of-type td:last-child{border-radius:0 0 0.5em 0}pn-table.bordered .pn-table-container table tbody tr:last-of-type th:first-child,pn-table.bordered .pn-table-container table tbody tr:last-of-type td:first-child{border-radius:0 0 0 0.5em}pn-table.bordered.striped .pn-table-container table tbody tr th,pn-table.bordered.striped .pn-table-container table tbody tr td{border-bottom-width:0}pn-table.bordered.striped .pn-table-container table tbody tr:last-child th,pn-table.bordered.striped .pn-table-container table tbody tr:last-child td{border-bottom-width:0.0625em}pn-table.striped .pn-table-container table tbody tr:nth-child(odd) th,pn-table.striped .pn-table-container table tbody tr:nth-child(odd) td{background-color:#effbff}pn-table.color-gray .pn-table-container table tbody tr:nth-child(odd) th,pn-table.color-gray .pn-table-container table tbody tr:nth-child(odd) td{background-color:#f9f8f8}";
-
-const PnTable$1 = /*@__PURE__*/ proxyCustomElement(class PnTable extends HTMLElement {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-    }
-    get hostElement() { return this; }
-    /** Use the gray variant instead of blue. */
-    gray = false;
-    /** Add border to table. */
-    bordered = false;
-    /** Make the table striped. */
-    striped = false;
-    getClassNames() {
-        const classes = [this.striped && 'striped', this.bordered && 'bordered', this.gray ? 'color-gray' : 'color-blue'];
-        return classes.filter(Boolean).join(' ');
-    }
-    render() {
-        return (h(Host, { key: 'c46bc77bf7e40631d6229457a7d764cf356f1b3d', class: this.getClassNames() }, h("div", { key: 'e547b118837d48715f62cad80d0bfd31f10954d6', class: "pn-table-container" }, h("slot", { key: '6c750540cac0e6fbdb9b9857f7eb309c27566d53' }))));
-    }
-    static get style() { return pnTableCss; }
-}, [772, "pn-table", {
-        "gray": [4],
-        "bordered": [4],
-        "striped": [4]
-    }]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["pn-table"];
-    components.forEach(tagName => { switch (tagName) {
-        case "pn-table":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, PnTable$1);
-            }
-            break;
-    } });
-}
-
-const PnTable = PnTable$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { PnTable, defineCustomElement };
-//# sourceMappingURL=pn-table.js.map
-
-//# sourceMappingURL=pn-table.js.map
+import{transformTag as t,proxyCustomElement as e,HTMLElement as a,h as r,Host as l}from"@stencil/core/internal/client";const b=e(class extends a{constructor(t){super(),!1!==t&&this.__registerHost()}get hostElement(){return this}gray=!1;bordered=!1;striped=!1;getClassNames(){return[this.striped&&"striped",this.bordered&&"bordered",this.gray?"color-gray":"color-blue"].filter(Boolean).join(" ")}render(){return r(l,{key:"c46bc77bf7e40631d6229457a7d764cf356f1b3d",class:this.getClassNames()},r("div",{key:"e547b118837d48715f62cad80d0bfd31f10954d6",class:"pn-table-container"},r("slot",{key:"6c750540cac0e6fbdb9b9857f7eb309c27566d53"})))}static get style(){return`${t("pn-table")}{display:block;margin-bottom:1em}${t("pn-table")} .pn-table-container table{width:100%}${t("pn-table")} .pn-table-container table .column-wrapper{display:flex;gap:0.5em;width:100%;align-items:center}${t("pn-table")} .pn-table-container table,${t("pn-table")} .pn-table-container table th,${t("pn-table")} .pn-table-container table td{padding:0;margin:0;border:0;outline:0;border-collapse:collapse;max-width:100%}${t("pn-table")} .pn-table-container table th,${t("pn-table")} .pn-table-container table td{text-align:left;line-height:2;vertical-align:middle;padding:1em 1.15em}${t("pn-table")} .pn-table-container table th:first-child,${t("pn-table")} .pn-table-container table td:first-child{border-radius:0.5em 0 0 0.5em}${t("pn-table")} .pn-table-container table th:last-child,${t("pn-table")} .pn-table-container table td:last-child{border-radius:0 0.5em 0.5em 0}${t("pn-table")} .pn-table-container table th ${t("pn-icon")},${t("pn-table")} .pn-table-container table td ${t("pn-icon")}{vertical-align:middle}${t("pn-table")} .pn-table-container table thead tr th,${t("pn-table")} .pn-table-container table thead tr td{color:#005d92;font-weight:500}${t("pn-table")} .pn-table-container table tbody tr th,${t("pn-table")} .pn-table-container table tbody tr td{color:#2d2013;font-weight:400}${t("pn-table")}.bordered .pn-table-container table{border-collapse:separate;border-spacing:0}${t("pn-table")}.bordered .pn-table-container table thead tr:last-child th,${t("pn-table")}.bordered .pn-table-container table thead tr:last-child td{border-bottom-width:0.0625em}${t("pn-table")}.bordered .pn-table-container table thead tr:first-child th,${t("pn-table")}.bordered .pn-table-container table thead tr:first-child td{border-top:0.0625em solid #005d92}${t("pn-table")}.bordered .pn-table-container table thead tr th,${t("pn-table")}.bordered .pn-table-container table thead tr td{border-bottom:0.0625em solid #005d92}${t("pn-table")}.bordered .pn-table-container table thead tr th:first-child,${t("pn-table")}.bordered .pn-table-container table thead tr td:first-child{border-left:0.0625em solid #005d92;border-radius:0.5em 0 0}${t("pn-table")}.bordered .pn-table-container table thead tr th:last-child,${t("pn-table")}.bordered .pn-table-container table thead tr td:last-child{border-radius:0 0.5em 0 0;border-right:0.0625em solid #005d92}${t("pn-table")}.bordered .pn-table-container table tbody tr th,${t("pn-table")}.bordered .pn-table-container table tbody tr td{border-bottom:0.0625em solid #d3cecb}${t("pn-table")}.bordered .pn-table-container table tbody tr th:first-child,${t("pn-table")}.bordered .pn-table-container table tbody tr td:first-child{border-left:0.0625em solid #005d92;border-radius:0}${t("pn-table")}.bordered .pn-table-container table tbody tr th:last-child,${t("pn-table")}.bordered .pn-table-container table tbody tr td:last-child{border-right:0.0625em solid #005d92;border-radius:0}${t("pn-table")}.bordered .pn-table-container table tbody tr:last-of-type th,${t("pn-table")}.bordered .pn-table-container table tbody tr:last-of-type td{border-bottom:0.0625em solid #005d92}${t("pn-table")}.bordered .pn-table-container table tbody tr:last-of-type th:last-child,${t("pn-table")}.bordered .pn-table-container table tbody tr:last-of-type td:last-child{border-radius:0 0 0.5em 0}${t("pn-table")}.bordered .pn-table-container table tbody tr:last-of-type th:first-child,${t("pn-table")}.bordered .pn-table-container table tbody tr:last-of-type td:first-child{border-radius:0 0 0 0.5em}${t("pn-table")}.bordered.striped .pn-table-container table tbody tr th,${t("pn-table")}.bordered.striped .pn-table-container table tbody tr td{border-bottom-width:0}${t("pn-table")}.bordered.striped .pn-table-container table tbody tr:last-child th,${t("pn-table")}.bordered.striped .pn-table-container table tbody tr:last-child td{border-bottom-width:0.0625em}${t("pn-table")}.striped .pn-table-container table tbody tr:nth-child(odd) th,${t("pn-table")}.striped .pn-table-container table tbody tr:nth-child(odd) td{background-color:#effbff}${t("pn-table")}.color-gray .pn-table-container table tbody tr:nth-child(odd) th,${t("pn-table")}.color-gray .pn-table-container table tbody tr:nth-child(odd) td{background-color:#f9f8f8}`}},[772,"pn-table",{gray:[4],bordered:[4],striped:[4]}]),n=b,d=function(){"undefined"!=typeof customElements&&["pn-table"].forEach((e=>{"pn-table"===e&&(customElements.get(t(t(e)))||customElements.define(t(t(e)),b))}))};export{n as PnTable,d as defineCustomElement}