npm - @oiz/stzh-components - Versions diffs - 4.9.0-beta3 → 4.9.0-beta4 - Mend

@oiz/stzh-components 4.9.0-beta3 → 4.9.0-beta4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1425) hide show

package/dist/components/p-DsRthiVA.js DELETED Viewed

@@ -1,65 +0,0 @@
-import { p as proxyCustomElement, H, h, e as Host, t as transformTag } from './p-ptAFQZzh.js';
-import { s as setPropsIfNull } from './p-CN5apKPb.js';
-const stzhPrintCss = () => `:host{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);color:var(--stzh-base-color);box-sizing:border-box;display:block}:host[hidden],:host[stzh-hidden]{display:none}:host::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}:host *,:host *::before,:host *::after{box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness);-webkit-text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink);text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink)}:host{}:host .has-focus{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}:host .stzh-fylingfocus-focused{outline-style:none !important}:host .stzh-fylingfocus-focused::-moz-focus-inner{border:0 !important}:host{display:contents}@media print{:host{display:none}}.stzh-print{display:contents}`;
-const StzhPrint = /*@__PURE__*/ proxyCustomElement(class StzhPrint extends H {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-        this.__attachShadow();
-        this.handleLinkClick = () => {
-            window.print();
-        };
-        this.init = () => {
-            const links = this.element.querySelectorAll("stzh-link, stzh-button");
-            links.forEach(link => {
-                link.addEventListener("click", this.handleLinkClick);
-                setPropsIfNull(link, {
-                    icon: "print",
-                });
-            });
-        };
-    }
-    connectedCallback() {
-        this.init();
-        this.observer = new MutationObserver(this.init);
-        this.observer.observe(this.element, {
-            childList: true,
-            subtree: true,
-        });
-    }
-    disconnectedCallback() {
-        if (this.observer) {
-            this.observer.disconnect();
-        }
-    }
-    render() {
-        const classes = {
-            "stzh-print": true,
-        };
-        return (h(Host, { key: 'd24ae42557e47fe95e2c534cb4859e5134578009' }, h("div", { key: '0782d1abea06a050f47871f48627a9e8bac31a6a', class: classes }, h("slot", { key: '30d625c1171cdd2225f1bbda3e6a4b69b8879203' }))));
-    }
-    get element() { return this; }
-    static get style() { return stzhPrintCss(); }
-}, [257, "stzh-print"]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["stzh-print"];
-    components.forEach(tagName => { switch (tagName) {
-        case "stzh-print":
-            if (!customElements.get(transformTag(tagName))) {
-                customElements.define(transformTag(tagName), StzhPrint);
-            }
-            break;
-    } });
-}
-export { StzhPrint as S, defineCustomElement as d };
-//# sourceMappingURL=p-DsRthiVA.js.map
-//# sourceMappingURL=p-DsRthiVA.js.map

package/dist/components/p-DsRthiVA.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"file":"p-DsRthiVA.js","mappings":";;;AAAA,MAAM,YAAY,GAAG,MAAM,CAAC,0+BAA0+B,CAAC;;MCY1/B,SAAS,iBAAAA,kBAAA,CAAA,MAAA,SAAA,SAAAC,CAAA,CAAA;AALtB,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;AAUU,QAAA,IAAe,CAAA,eAAA,GAAG,MAAK;YAC7B,MAAM,CAAC,KAAK,EAAE;AAChB,SAAC;AAEO,QAAA,IAAI,CAAA,IAAA,GAAG,MAAK;YAClB,MAAM,KAAK,GAAG,IAAI,CAAC,OAAO,CAAC,gBAAgB,CAAC,wBAAwB,CAAC;AAErE,YAAA,KAAK,CAAC,OAAO,CAAC,IAAI,IAAG;gBACnB,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,eAAe,CAAC;gBAEpD,cAAc,CAAC,IAAI,EAAE;AACnB,oBAAA,IAAI,EAAE,OAAO;AACiC,iBAAA,CAAC;AACnD,aAAC,CAAC;AACJ,SAAC;AA+BF;IA7BC,iBAAiB,GAAA;QACf,IAAI,CAAC,IAAI,EAAE;QAEX,IAAI,CAAC,QAAQ,GAAG,IAAI,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC;QAC/C,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE;AAClC,YAAA,SAAS,EAAE,IAAI;AACf,YAAA,OAAO,EAAE,IAAI;AACd,SAAA,CAAC;;IAGJ,oBAAoB,GAAA;AAClB,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;AACjB,YAAA,IAAI,CAAC,QAAQ,CAAC,UAAU,EAAE;;;IAI9B,MAAM,GAAA;AACJ,QAAA,MAAM,OAAO,GAAG;AACd,YAAA,YAAY,EAAE,IAAI;SACnB;AAED,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,OAAO,EAAA,EACjB,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACT,CACD;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/CMS/stzh-print/stzh-print.scss?tag=stzh-print&encapsulation=shadow","src/components/CMS/stzh-print/stzh-print.tsx"],"sourcesContent":[":host {\n display: contents;\n\n @media print {\n display: none;\n }\n}\n\n.stzh-print {\n display: contents;\n}\n","import { Component, Host, h, Element } from \"@stencil/core\";\n\nimport { setPropsIfNull } from \"../../../utils/utils\";\n\n/**\n * @slot - Slot for label\n */\n@Component({\n tag: \"stzh-print\",\n styleUrl: \"stzh-print.scss\",\n shadow: true,\n})\nexport class StzhPrint {\n @Element() element: HTMLStzhPrintElement;\n\n private observer: MutationObserver;\n\n private handleLinkClick = () => {\n window.print();\n };\n\n private init = () => {\n const links = this.element.querySelectorAll(\"stzh-link, stzh-button\");\n\n links.forEach(link => {\n link.addEventListener(\"click\", this.handleLinkClick);\n\n setPropsIfNull(link, {\n icon: \"print\",\n } as HTMLStzhLinkElement | HTMLStzhButtonElement);\n });\n };\n\n connectedCallback() {\n this.init();\n\n this.observer = new MutationObserver(this.init);\n this.observer.observe(this.element, {\n childList: true,\n subtree: true,\n });\n }\n\n disconnectedCallback() {\n if (this.observer) {\n this.observer.disconnect();\n }\n }\n\n render() {\n const classes = {\n \"stzh-print\": true,\n };\n\n return (\n <Host>\n <div class={classes}>\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/p-DuR7XqVN.js DELETED Viewed

@@ -1,60 +0,0 @@
-import { p as proxyCustomElement, H, h, e as Host, t as transformTag } from './p-ptAFQZzh.js';
-const stzhHeadingCss = () => `.sc-stzh-heading-h{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);color:var(--stzh-base-color);box-sizing:border-box;display:block}[hidden].sc-stzh-heading-h,[stzh-hidden].sc-stzh-heading-h{display:none}.sc-stzh-heading-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-heading-h *.sc-stzh-heading,.sc-stzh-heading-h *.sc-stzh-heading::before,.sc-stzh-heading-h *.sc-stzh-heading::after{box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness);-webkit-text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink);text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink)}.sc-stzh-heading-h .has-focus.sc-stzh-heading{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-heading-h .stzh-fylingfocus-focused.sc-stzh-heading{outline-style:none !important}.sc-stzh-heading-h .stzh-fylingfocus-focused.sc-stzh-heading::-moz-focus-inner{border:0 !important}.sc-stzh-heading-h{width:100%;--color:var(--stzh-heading-color);color:var(--color)}.sc-stzh-heading-h.sc-stzh-heading-s>a,.sc-stzh-heading-h .sc-stzh-heading-s>a,.sc-stzh-heading-h .sc-stzh-heading-s a{color:var(--stzh-link-color);transition:color var(--stzh-base-transition-animation-speed);border-radius:var(--stzh-button-border-radius);text-underline-offset:var(--stzh-link-text-underline-offset);-webkit-text-decoration-line:var(--stzh-link-text-decoration-line);text-decoration-line:var(--stzh-link-text-decoration-line);text-decoration-thickness:var(--stzh-link-text-decoration-thickness);-webkit-text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink);text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink)}.sc-stzh-heading-h.sc-stzh-heading-s>a,.sc-stzh-heading-h.sc-stzh-heading-s>a:hover,.sc-stzh-heading-h .sc-stzh-heading-s>a:hover,.sc-stzh-heading-h .sc-stzh-heading-s a:hover{color:var(--stzh-link-hover-color);-webkit-text-decoration-line:var(--stzh-link-hover-text-decoration-line);text-decoration-line:var(--stzh-link-hover-text-decoration-line)}.sc-stzh-heading-h.sc-stzh-heading-s>a,.sc-stzh-heading-h.sc-stzh-heading-s>a:hover,.sc-stzh-heading-h .sc-stzh-heading-s>a:hover,.sc-stzh-heading-h .sc-stzh-heading-s a:hover{color:var(--stzh-link-hover-color)}.stzh-heading.sc-stzh-heading{font-family:var(--stzh-font-family-title);font-weight:var(--stzh-font-weight-title);font-style:var(--stzh-font-style-title);font-size:var(--stzh-font-curve-h2-default-font-size, var(--stzh-font-deci-font-size));line-height:var(--stzh-font-curve-h2-default-heading-line-height, var(--stzh-font-deci-heading-line-height));letter-spacing:var(--stzh-font-curve-h2-default-heading-letter-spacing)}@media screen and (min-width: 600px){.stzh-heading.sc-stzh-heading{font-size:var(--stzh-font-curve-h2-small-font-size, var(--stzh-font-deca-font-size));line-height:var(--stzh-font-curve-h2-small-heading-line-height, var(--stzh-font-deca-text-line-height));letter-spacing:var(--stzh-font-curve-h2-small-heading-letter-spacing, var(--stzh-font-deca-text-letter-spacing))}}@media screen and (min-width: 900px){.stzh-heading.sc-stzh-heading{font-size:var(--stzh-font-curve-h2-medium-font-size, var(--stzh-font-hecto-font-size));line-height:var(--stzh-font-curve-h2-medium-heading-line-height, var(--stzh-font-hecto-text-line-height));letter-spacing:var(--stzh-font-curve-h2-medium-heading-letter-spacing, var(--stzh-font-hecto-text-letter-spacing))}}@media screen and (min-width: 1600px){.stzh-heading.sc-stzh-heading{font-size:var(--stzh-font-curve-h2-ultra-font-size, var(--stzh-font-kilo-font-size));line-height:var(--stzh-font-curve-h2-ultra-heading-line-height, var(--stzh-font-kilo-text-line-height));letter-spacing:var(--stzh-font-curve-h2-ultra-heading-letter-spacing, var(--stzh-font-kilo-text-letter-spacing))}}.stzh-heading.sc-stzh-heading{color:var(--color);margin:0}.stzh-heading--level-1.sc-stzh-heading{font-size:var(--stzh-font-curve-h1-default-font-size, var(--stzh-font-deca-font-size));line-height:var(--stzh-font-curve-h1-default-heading-line-height, var(--stzh-font-deca-text-line-height));letter-spacing:var(--stzh-font-curve-h1-default-heading-letter-spacing, var(--stzh-font-deca-text-letter-spacing))}@media screen and (min-width: 600px){.stzh-heading--level-1.sc-stzh-heading{font-size:var(--stzh-font-curve-h1-small-font-size, var(--stzh-font-hecto-font-size));line-height:var(--stzh-font-curve-h1-small-heading-line-height, var(--stzh-font-hecto-text-line-height));letter-spacing:var(--stzh-font-curve-h1-small-heading-letter-spacing, var(--stzh-font-hecto-text-letter-spacing))}}@media screen and (min-width: 900px){.stzh-heading--level-1.sc-stzh-heading{font-size:var(--stzh-font-curve-h1-medium-font-size, var(--stzh-font-kilo-font-size));line-height:var(--stzh-font-curve-h1-medium-heading-line-height, var(--stzh-font-kilo-text-line-height));letter-spacing:var(--stzh-font-curve-h1-medium-heading-letter-spacing, var(--stzh-font-kilo-text-letter-spacing))}}@media screen and (min-width: 1260px){.stzh-heading--level-1.sc-stzh-heading{font-size:var(--stzh-font-curve-h1-large-font-size, var(--stzh-font-mega-font-size));line-height:var(--stzh-font-curve-h1-large-heading-line-height, var(--stzh-font-mega-text-line-height));letter-spacing:var(--stzh-font-curve-h1-large-heading-letter-spacing, var(--stzh-font-mega-text-letter-spacing))}}@media screen and (min-width: 1600px){.stzh-heading--level-1.sc-stzh-heading{font-size:var(--stzh-font-curve-h1-ultra-font-size, var(--stzh-font-giga-font-size));line-height:var(--stzh-font-curve-h1-ultra-heading-line-height, var(--stzh-font-giga-text-line-height));letter-spacing:var(--stzh-font-curve-h1-ultra-heading-letter-spacing, var(--stzh-font-giga-text-letter-spacing))}}.stzh-heading--level-2.sc-stzh-heading{font-size:var(--stzh-font-curve-h2-default-font-size, var(--stzh-font-deci-font-size));line-height:var(--stzh-font-curve-h2-default-heading-line-height, var(--stzh-font-deci-heading-line-height));letter-spacing:var(--stzh-font-curve-h2-default-heading-letter-spacing)}@media screen and (min-width: 600px){.stzh-heading--level-2.sc-stzh-heading{font-size:var(--stzh-font-curve-h2-small-font-size, var(--stzh-font-deca-font-size));line-height:var(--stzh-font-curve-h2-small-heading-line-height, var(--stzh-font-deca-text-line-height));letter-spacing:var(--stzh-font-curve-h2-small-heading-letter-spacing, var(--stzh-font-deca-text-letter-spacing))}}@media screen and (min-width: 900px){.stzh-heading--level-2.sc-stzh-heading{font-size:var(--stzh-font-curve-h2-medium-font-size, var(--stzh-font-hecto-font-size));line-height:var(--stzh-font-curve-h2-medium-heading-line-height, var(--stzh-font-hecto-text-line-height));letter-spacing:var(--stzh-font-curve-h2-medium-heading-letter-spacing, var(--stzh-font-hecto-text-letter-spacing))}}@media screen and (min-width: 1600px){.stzh-heading--level-2.sc-stzh-heading{font-size:var(--stzh-font-curve-h2-ultra-font-size, var(--stzh-font-kilo-font-size));line-height:var(--stzh-font-curve-h2-ultra-heading-line-height, var(--stzh-font-kilo-text-line-height));letter-spacing:var(--stzh-font-curve-h2-ultra-heading-letter-spacing, var(--stzh-font-kilo-text-letter-spacing))}}.stzh-heading--level-3.sc-stzh-heading{font-size:var(--stzh-font-curve-h3-default-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-h3-default-heading-line-height, var(--stzh-font-centi-heading-line-height));letter-spacing:var(--stzh-font-curve-h3-default-heading-letter-spacing)}@media screen and (min-width: 600px){.stzh-heading--level-3.sc-stzh-heading{font-size:var(--stzh-font-curve-h3-small-font-size, var(--stzh-font-deci-font-size));line-height:var(--stzh-font-curve-h3-small-heading-line-height, var(--stzh-font-deci-heading-line-height));letter-spacing:var(--stzh-font-curve-h3-small-heading-letter-spacing)}}@media screen and (min-width: 900px){.stzh-heading--level-3.sc-stzh-heading{font-size:var(--stzh-font-curve-h3-medium-font-size, var(--stzh-font-deca-font-size));line-height:var(--stzh-font-curve-h3-medium-heading-line-height, var(--stzh-font-deca-text-line-height));letter-spacing:var(--stzh-font-curve-h3-medium-heading-letter-spacing, var(--stzh-font-deca-text-letter-spacing))}}@media screen and (min-width: 1600px){.stzh-heading--level-3.sc-stzh-heading{font-size:var(--stzh-font-curve-h3-ultra-font-size, var(--stzh-font-hecto-font-size));line-height:var(--stzh-font-curve-h3-ultra-heading-line-height, var(--stzh-font-hecto-text-line-height));letter-spacing:var(--stzh-font-curve-h3-ultra-heading-letter-spacing, var(--stzh-font-hecto-text-letter-spacing))}}.stzh-heading--level-4.sc-stzh-heading{font-size:var(--stzh-font-curve-h4-default-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-h4-default-heading-line-height, var(--stzh-font-milli-heading-line-height));letter-spacing:var(--stzh-font-curve-h4-default-heading-letter-spacing)}@media screen and (min-width: 600px){.stzh-heading--level-4.sc-stzh-heading{font-size:var(--stzh-font-curve-h4-small-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-h4-small-heading-line-height, var(--stzh-font-centi-heading-line-height));letter-spacing:var(--stzh-font-curve-h4-small-heading-letter-spacing)}}@media screen and (min-width: 1260px){.stzh-heading--level-4.sc-stzh-heading{font-size:var(--stzh-font-curve-h4-large-font-size, var(--stzh-font-deci-font-size));line-height:var(--stzh-font-curve-h4-large-heading-line-height, var(--stzh-font-deci-heading-line-height));letter-spacing:var(--stzh-font-curve-h4-large-heading-letter-spacing)}}@media screen and (min-width: 1600px){.stzh-heading--level-4.sc-stzh-heading{font-size:var(--stzh-font-curve-h4-ultra-font-size, var(--stzh-font-deca-font-size));line-height:var(--stzh-font-curve-h4-ultra-heading-line-height, var(--stzh-font-deca-text-line-height));letter-spacing:var(--stzh-font-curve-h4-ultra-heading-letter-spacing, var(--stzh-font-deca-text-letter-spacing))}}.stzh-heading--curve-caption.sc-stzh-heading{font-size:var(--stzh-font-curve-caption-default-font-size, var(--stzh-font-nano-font-size));line-height:var(--stzh-font-curve-caption-default-heading-line-height, var(--stzh-font-nano-heading-line-height));letter-spacing:var(--stzh-font-curve-caption-default-heading-letter-spacing, var(--stzh-font-nano-heading-letter-spacing))}@media screen and (min-width: 900px){.stzh-heading--curve-caption.sc-stzh-heading{font-size:var(--stzh-font-curve-caption-medium-font-size, var(--stzh-font-micro-font-size));line-height:var(--stzh-font-curve-caption-medium-heading-line-height, var(--stzh-font-micro-heading-line-height));letter-spacing:var(--stzh-font-curve-caption-medium-heading-letter-spacing, var(--stzh-font-micro-heading-letter-spacing))}}.stzh-heading--curve-lead.sc-stzh-heading{font-size:var(--stzh-font-curve-lead-default-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-lead-default-heading-line-height, var(--stzh-font-milli-heading-line-height));letter-spacing:var(--stzh-font-curve-lead-default-heading-letter-spacing)}@media screen and (min-width: 1260px){.stzh-heading--curve-lead.sc-stzh-heading{font-size:var(--stzh-font-curve-lead-large-font-size, var(--stzh-font-deci-font-size));line-height:var(--stzh-font-curve-lead-large-heading-line-height, var(--stzh-font-deci-heading-line-height));letter-spacing:var(--stzh-font-curve-lead-large-heading-letter-spacing)}}.stzh-heading--curve-teaser.sc-stzh-heading{font-size:var(--stzh-font-curve-teaser-default-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-teaser-default-heading-line-height, var(--stzh-font-centi-heading-line-height));letter-spacing:var(--stzh-font-curve-teaser-default-heading-letter-spacing)}@media screen and (min-width: 1260px){.stzh-heading--curve-teaser.sc-stzh-heading{font-size:var(--stzh-font-curve-teaser-large-font-size, var(--stzh-font-deci-font-size));line-height:var(--stzh-font-curve-teaser-large-heading-line-height, var(--stzh-font-deci-heading-line-height));letter-spacing:var(--stzh-font-curve-teaser-large-heading-letter-spacing)}}.stzh-heading--curve-p2.sc-stzh-heading{font-size:var(--stzh-font-curve-p2-default-font-size, var(--stzh-font-micro-font-size));line-height:var(--stzh-font-curve-p2-default-heading-line-height, var(--stzh-font-micro-heading-line-height));letter-spacing:var(--stzh-font-curve-p2-default-heading-letter-spacing, var(--stzh-font-micro-heading-letter-spacing))}@media screen and (min-width: 900px){.stzh-heading--curve-p2.sc-stzh-heading{font-size:var(--stzh-font-curve-p2-medium-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-p2-medium-heading-line-height, var(--stzh-font-milli-heading-line-height));letter-spacing:var(--stzh-font-curve-p2-medium-heading-letter-spacing)}}.stzh-heading--curve-p1.sc-stzh-heading{font-size:var(--stzh-font-curve-p1-default-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-p1-default-heading-line-height, var(--stzh-font-milli-heading-line-height));letter-spacing:var(--stzh-font-curve-p1-default-heading-letter-spacing)}@media screen and (min-width: 900px){.stzh-heading--curve-p1.sc-stzh-heading{font-size:var(--stzh-font-curve-p1-medium-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-p1-medium-heading-line-height, var(--stzh-font-centi-heading-line-height));letter-spacing:var(--stzh-font-curve-p1-medium-heading-letter-spacing)}}.stzh-heading--curve-h4.sc-stzh-heading{font-size:var(--stzh-font-curve-h4-default-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-h4-default-heading-line-height, var(--stzh-font-milli-heading-line-height));letter-spacing:var(--stzh-font-curve-h4-default-heading-letter-spacing)}@media screen and (min-width: 600px){.stzh-heading--curve-h4.sc-stzh-heading{font-size:var(--stzh-font-curve-h4-small-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-h4-small-heading-line-height, var(--stzh-font-centi-heading-line-height));letter-spacing:var(--stzh-font-curve-h4-small-heading-letter-spacing)}}@media screen and (min-width: 1260px){.stzh-heading--curve-h4.sc-stzh-heading{font-size:var(--stzh-font-curve-h4-large-font-size, var(--stzh-font-deci-font-size));line-height:var(--stzh-font-curve-h4-large-heading-line-height, var(--stzh-font-deci-heading-line-height));letter-spacing:var(--stzh-font-curve-h4-large-heading-letter-spacing)}}@media screen and (min-width: 1600px){.stzh-heading--curve-h4.sc-stzh-heading{font-size:var(--stzh-font-curve-h4-ultra-font-size, var(--stzh-font-deca-font-size));line-height:var(--stzh-font-curve-h4-ultra-heading-line-height, var(--stzh-font-deca-text-line-height));letter-spacing:var(--stzh-font-curve-h4-ultra-heading-letter-spacing, var(--stzh-font-deca-text-letter-spacing))}}.stzh-heading--curve-h3.sc-stzh-heading{font-size:var(--stzh-font-curve-h3-default-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-h3-default-heading-line-height, var(--stzh-font-centi-heading-line-height));letter-spacing:var(--stzh-font-curve-h3-default-heading-letter-spacing)}@media screen and (min-width: 600px){.stzh-heading--curve-h3.sc-stzh-heading{font-size:var(--stzh-font-curve-h3-small-font-size, var(--stzh-font-deci-font-size));line-height:var(--stzh-font-curve-h3-small-heading-line-height, var(--stzh-font-deci-heading-line-height));letter-spacing:var(--stzh-font-curve-h3-small-heading-letter-spacing)}}@media screen and (min-width: 900px){.stzh-heading--curve-h3.sc-stzh-heading{font-size:var(--stzh-font-curve-h3-medium-font-size, var(--stzh-font-deca-font-size));line-height:var(--stzh-font-curve-h3-medium-heading-line-height, var(--stzh-font-deca-text-line-height));letter-spacing:var(--stzh-font-curve-h3-medium-heading-letter-spacing, var(--stzh-font-deca-text-letter-spacing))}}@media screen and (min-width: 1600px){.stzh-heading--curve-h3.sc-stzh-heading{font-size:var(--stzh-font-curve-h3-ultra-font-size, var(--stzh-font-hecto-font-size));line-height:var(--stzh-font-curve-h3-ultra-heading-line-height, var(--stzh-font-hecto-text-line-height));letter-spacing:var(--stzh-font-curve-h3-ultra-heading-letter-spacing, var(--stzh-font-hecto-text-letter-spacing))}}.stzh-heading--curve-h2.sc-stzh-heading{font-size:var(--stzh-font-curve-h2-default-font-size, var(--stzh-font-deci-font-size));line-height:var(--stzh-font-curve-h2-default-heading-line-height, var(--stzh-font-deci-heading-line-height));letter-spacing:var(--stzh-font-curve-h2-default-heading-letter-spacing)}@media screen and (min-width: 600px){.stzh-heading--curve-h2.sc-stzh-heading{font-size:var(--stzh-font-curve-h2-small-font-size, var(--stzh-font-deca-font-size));line-height:var(--stzh-font-curve-h2-small-heading-line-height, var(--stzh-font-deca-text-line-height));letter-spacing:var(--stzh-font-curve-h2-small-heading-letter-spacing, var(--stzh-font-deca-text-letter-spacing))}}@media screen and (min-width: 900px){.stzh-heading--curve-h2.sc-stzh-heading{font-size:var(--stzh-font-curve-h2-medium-font-size, var(--stzh-font-hecto-font-size));line-height:var(--stzh-font-curve-h2-medium-heading-line-height, var(--stzh-font-hecto-text-line-height));letter-spacing:var(--stzh-font-curve-h2-medium-heading-letter-spacing, var(--stzh-font-hecto-text-letter-spacing))}}@media screen and (min-width: 1600px){.stzh-heading--curve-h2.sc-stzh-heading{font-size:var(--stzh-font-curve-h2-ultra-font-size, var(--stzh-font-kilo-font-size));line-height:var(--stzh-font-curve-h2-ultra-heading-line-height, var(--stzh-font-kilo-text-line-height));letter-spacing:var(--stzh-font-curve-h2-ultra-heading-letter-spacing, var(--stzh-font-kilo-text-letter-spacing))}}.stzh-heading--curve-h1.sc-stzh-heading{font-size:var(--stzh-font-curve-h1-default-font-size, var(--stzh-font-deca-font-size));line-height:var(--stzh-font-curve-h1-default-heading-line-height, var(--stzh-font-deca-text-line-height));letter-spacing:var(--stzh-font-curve-h1-default-heading-letter-spacing, var(--stzh-font-deca-text-letter-spacing))}@media screen and (min-width: 600px){.stzh-heading--curve-h1.sc-stzh-heading{font-size:var(--stzh-font-curve-h1-small-font-size, var(--stzh-font-hecto-font-size));line-height:var(--stzh-font-curve-h1-small-heading-line-height, var(--stzh-font-hecto-text-line-height));letter-spacing:var(--stzh-font-curve-h1-small-heading-letter-spacing, var(--stzh-font-hecto-text-letter-spacing))}}@media screen and (min-width: 900px){.stzh-heading--curve-h1.sc-stzh-heading{font-size:var(--stzh-font-curve-h1-medium-font-size, var(--stzh-font-kilo-font-size));line-height:var(--stzh-font-curve-h1-medium-heading-line-height, var(--stzh-font-kilo-text-line-height));letter-spacing:var(--stzh-font-curve-h1-medium-heading-letter-spacing, var(--stzh-font-kilo-text-letter-spacing))}}@media screen and (min-width: 1260px){.stzh-heading--curve-h1.sc-stzh-heading{font-size:var(--stzh-font-curve-h1-large-font-size, var(--stzh-font-mega-font-size));line-height:var(--stzh-font-curve-h1-large-heading-line-height, var(--stzh-font-mega-text-line-height));letter-spacing:var(--stzh-font-curve-h1-large-heading-letter-spacing, var(--stzh-font-mega-text-letter-spacing))}}@media screen and (min-width: 1600px){.stzh-heading--curve-h1.sc-stzh-heading{font-size:var(--stzh-font-curve-h1-ultra-font-size, var(--stzh-font-giga-font-size));line-height:var(--stzh-font-curve-h1-ultra-heading-line-height, var(--stzh-font-giga-text-line-height));letter-spacing:var(--stzh-font-curve-h1-ultra-heading-letter-spacing, var(--stzh-font-giga-text-letter-spacing))}}.stzh-heading--curve-hero.sc-stzh-heading{font-size:var(--stzh-font-curve-hero-default-font-size, var(--stzh-font-kilo-font-size));line-height:var(--stzh-font-curve-hero-default-heading-line-height, var(--stzh-font-kilo-text-line-height));letter-spacing:var(--stzh-font-curve-hero-default-heading-letter-spacing, var(--stzh-font-kilo-text-letter-spacing))}@media screen and (min-width: 600px){.stzh-heading--curve-hero.sc-stzh-heading{font-size:var(--stzh-font-curve-hero-small-font-size, var(--stzh-font-mega-font-size));line-height:var(--stzh-font-curve-hero-small-heading-line-height, var(--stzh-font-mega-text-line-height));letter-spacing:var(--stzh-font-curve-hero-small-heading-letter-spacing, var(--stzh-font-mega-text-letter-spacing))}}@media screen and (min-width: 1260px){.stzh-heading--curve-hero.sc-stzh-heading{font-size:var(--stzh-font-curve-hero-large-font-size, var(--stzh-font-giga-font-size));line-height:var(--stzh-font-curve-hero-large-heading-line-height, var(--stzh-font-giga-text-line-height));letter-spacing:var(--stzh-font-curve-hero-large-heading-letter-spacing, var(--stzh-font-giga-text-letter-spacing))}}@media screen and (min-width: 1600px){.stzh-heading--curve-hero.sc-stzh-heading{font-size:var(--stzh-font-curve-hero-ultra-font-size, var(--stzh-font-hero-font-size));line-height:var(--stzh-font-curve-hero-ultra-heading-line-height, var(--stzh-font-hero-text-line-height));letter-spacing:var(--stzh-font-curve-hero-ultra-heading-letter-spacing, var(--stzh-font-hero-text-letter-spacing))}}.stzh-heading--curve-h1home.sc-stzh-heading{font-size:var(--stzh-font-curve-h1home-default-font-size, var(--stzh-font-mega-font-size));line-height:var(--stzh-font-curve-h1home-default-heading-line-height, var(--stzh-font-mega-text-line-height));letter-spacing:var(--stzh-font-curve-h1home-default-heading-letter-spacing, var(--stzh-font-mega-text-letter-spacing))}@media screen and (min-width: 600px){.stzh-heading--curve-h1home.sc-stzh-heading{font-size:var(--stzh-font-curve-h1home-small-font-size, var(--stzh-font-giga-font-size));line-height:var(--stzh-font-curve-h1home-small-heading-line-height, var(--stzh-font-giga-text-line-height));letter-spacing:var(--stzh-font-curve-h1home-small-heading-letter-spacing, var(--stzh-font-giga-text-letter-spacing))}}@media screen and (min-width: 900px){.stzh-heading--curve-h1home.sc-stzh-heading{font-size:var(--stzh-font-curve-h1home-medium-font-size, var(--stzh-font-peta-font-size));line-height:var(--stzh-font-curve-h1home-medium-heading-line-height, var(--stzh-font-peta-text-line-height));letter-spacing:var(--stzh-font-curve-h1home-medium-heading-letter-spacing, var(--stzh-font-peta-text-letter-spacing))}}@media screen and (min-width: 1260px){.stzh-heading--curve-h1home.sc-stzh-heading{font-size:var(--stzh-font-curve-h1home-large-font-size, var(--stzh-font-exa-font-size));line-height:var(--stzh-font-curve-h1home-large-heading-line-height, var(--stzh-font-exa-text-line-height));letter-spacing:var(--stzh-font-curve-h1home-large-heading-letter-spacing, var(--stzh-font-exa-text-letter-spacing))}}@media screen and (min-width: 1600px){.stzh-heading--curve-h1home.sc-stzh-heading{font-size:var(--stzh-font-curve-h1home-ultra-font-size, var(--stzh-font-zetta-font-size));line-height:var(--stzh-font-curve-h1home-ultra-heading-line-height, var(--stzh-font-zetta-text-line-height));letter-spacing:var(--stzh-font-curve-h1home-ultra-heading-letter-spacing, var(--stzh-font-zetta-text-letter-spacing))}}.stzh-heading--curve-h1homesmall.sc-stzh-heading{font-size:var(--stzh-font-curve-h1homesmall-default-font-size, var(--stzh-font-mega-font-size));line-height:var(--stzh-font-curve-h1homesmall-default-heading-line-height, var(--stzh-font-mega-text-line-height));letter-spacing:var(--stzh-font-curve-h1homesmall-default-heading-letter-spacing, var(--stzh-font-mega-text-letter-spacing))}@media screen and (min-width: 600px){.stzh-heading--curve-h1homesmall.sc-stzh-heading{font-size:var(--stzh-font-curve-h1homesmall-small-font-size, var(--stzh-font-mega-font-size));line-height:var(--stzh-font-curve-h1homesmall-small-heading-line-height, var(--stzh-font-mega-text-line-height));letter-spacing:var(--stzh-font-curve-h1homesmall-small-heading-letter-spacing, var(--stzh-font-mega-text-letter-spacing))}}@media screen and (min-width: 900px){.stzh-heading--curve-h1homesmall.sc-stzh-heading{font-size:var(--stzh-font-curve-h1homesmall-medium-font-size, var(--stzh-font-giga-font-size));line-height:var(--stzh-font-curve-h1homesmall-medium-heading-line-height, var(--stzh-font-giga-text-line-height));letter-spacing:var(--stzh-font-curve-h1homesmall-medium-heading-letter-spacing, var(--stzh-font-giga-text-letter-spacing))}}@media screen and (min-width: 1260px){.stzh-heading--curve-h1homesmall.sc-stzh-heading{font-size:var(--stzh-font-curve-h1homesmall-large-font-size, var(--stzh-font-peta-font-size));line-height:var(--stzh-font-curve-h1homesmall-large-heading-line-height, var(--stzh-font-peta-text-line-height));letter-spacing:var(--stzh-font-curve-h1homesmall-large-heading-letter-spacing, var(--stzh-font-peta-text-letter-spacing))}}@media screen and (min-width: 1600px){.stzh-heading--curve-h1homesmall.sc-stzh-heading{font-size:var(--stzh-font-curve-h1homesmall-ultra-font-size, var(--stzh-font-peta-font-size));line-height:var(--stzh-font-curve-h1homesmall-ultra-heading-line-height, var(--stzh-font-peta-text-line-height));letter-spacing:var(--stzh-font-curve-h1homesmall-ultra-heading-letter-spacing, var(--stzh-font-peta-text-letter-spacing))}}`;
-const StzhHeading = /*@__PURE__*/ proxyCustomElement(class StzhHeading extends H {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-        /** Heading level */
-        this.level = "2";
-        /** Type of curve to overwrite the curve inherited from `level` attribute (see [Spacings docs page](/docs/tokens-typography--docs#curves) for more info). */
-        this.curve = "auto";
-        this._htmlContent = "";
-    }
-    htmlContentWatcher(newValue) {
-        this._htmlContent = newValue;
-    }
-    componentWillLoad() {
-        this.htmlContentWatcher(this.htmlContent);
-    }
-    render() {
-        const Heading = `h${this.level}`;
-        const classes = {
-            "stzh-heading": true,
-            [`stzh-heading--level-${this.level}`]: !!this.level,
-            [`stzh-heading--curve-${this.curve}`]: !!this.curve,
-        };
-        return (h(Host, { key: 'eaf8a708466e40c3c95dc59ca9ea92444ed8d2f5' }, h(Heading, { key: 'a0ceeda6256786c22fc028b2cf5efac7779e84ee', class: classes }, h("slot", { key: 'ecc6f4c3272769cd7ec2d16f227c22ccea7d5de1' }), this._htmlContent && h("div", { key: '80c9327fd208c991facc1d5129d4ba8e58a7638e', innerHTML: this._htmlContent }))));
-    }
-    static get watchers() { return {
-        "htmlContent": ["htmlContentWatcher"]
-    }; }
-    static get style() { return stzhHeadingCss(); }
-}, [262, "stzh-heading", {
-        "level": [513],
-        "curve": [513],
-        "htmlContent": [1, "html-content"]
-    }, undefined, {
-        "htmlContent": ["htmlContentWatcher"]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["stzh-heading"];
-    components.forEach(tagName => { switch (tagName) {
-        case "stzh-heading":
-            if (!customElements.get(transformTag(tagName))) {
-                customElements.define(transformTag(tagName), StzhHeading);
-            }
-            break;
-    } });
-}
-export { StzhHeading as S, defineCustomElement as d };
-//# sourceMappingURL=p-DuR7XqVN.js.map
-//# sourceMappingURL=p-DuR7XqVN.js.map

package/dist/components/p-DuR7XqVN.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"file":"p-DuR7XqVN.js","mappings":";;AAAA,MAAM,cAAc,GAAG,MAAM,CAAC,8rxBAA8rxB,CAAC;;MCYhtxB,WAAW,iBAAAA,kBAAA,CAAA,MAAA,WAAA,SAAAC,CAAA,CAAA;AALxB,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;AAO2B,QAAA,IAAK,CAAA,KAAA,GAA0B,GAAG;;AAGlC,QAAA,IAAK,CAAA,KAAA,GAAyB,MAAM;AAIrD,QAAA,IAAY,CAAA,YAAA,GAAW,EAAE;AA4BlC;AAzBC,IAAA,kBAAkB,CAAC,QAAgB,EAAA;AACjC,QAAA,IAAI,CAAC,YAAY,GAAG,QAAQ;;IAG9B,iBAAiB,GAAA;AACf,QAAA,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,WAAW,CAAC;;IAG3C,MAAM,GAAA;AACJ,QAAA,MAAM,OAAO,GAAG,CAAA,CAAA,EAAI,IAAI,CAAC,KAAK,EAAE;AAChC,QAAA,MAAM,OAAO,GAAG;AACd,YAAA,cAAc,EAAE,IAAI;YACpB,CAAC,CAAA,oBAAA,EAAuB,IAAI,CAAC,KAAK,CAAA,CAAE,GAAG,CAAC,CAAC,IAAI,CAAC,KAAK;YACnD,CAAC,CAAA,oBAAA,EAAuB,IAAI,CAAC,KAAK,CAAA,CAAE,GAAG,CAAC,CAAC,IAAI,CAAC,KAAK;SACpD;QAED,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAC,OAAO,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAC,KAAK,EAAE,OAAO,EAAA,EACrB,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,EACZ,IAAI,CAAC,YAAY,IAAI,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,SAAS,EAAE,IAAI,CAAC,YAAY,EAAA,CAAQ,CACvD,CACL;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/stzh-heading/stzh-heading.scss?tag=stzh-heading&encapsulation=scoped","src/components/stzh-heading/stzh-heading.tsx"],"sourcesContent":["/**\n * @prop --color: Color of heading\n *\n * @prop --stzh-heading-color: **Global**: Color of heading\n */\n\n:host {\n width: 100%;\n\n --color: #{$headingColor};\n color: var(--color);\n\n ::slotted(a),\n ::slotted(* a) {\n color: $linkColor;\n transition: color $baseTransitionAnimationSpeed;\n border-radius: $buttonBorderRadius;\n text-underline-offset: $linkTextUnderlineOffset;\n text-decoration-line: $linkTextDecorationLine;\n text-decoration-thickness: $linkTextDecorationThickness;\n text-decoration-skip-ink: $linkTextDecorationSkipInk;\n\n &:hover {\n color: $linkHoverColor;\n text-decoration-line: $linkHoverTextDecorationLine;\n }\n\n &:hover {\n color: $linkHoverColor;\n }\n }\n}\n\n.stzh-heading {\n @include font(\"title\");\n @include fontCurve(\"h2\", \"heading\"); // default\n color: var(--color);\n margin: 0;\n\n @for $i from 1 through 4 {\n &--level-#{$i} {\n @include fontCurve(\"h\" + $i, \"heading\");\n }\n }\n\n @each $fontCurveName, $config in $fontCurves {\n &--curve-#{$fontCurveName} {\n @include fontCurve($fontCurveName, \"heading\");\n }\n }\n}\n","import { Component, h, Host, Prop, Watch } from \"@stencil/core\";\n\nimport { Font } from \"../../index\";\n\n/**\n * @slot - Text content\n */\n@Component({\n tag: \"stzh-heading\",\n styleUrl: \"stzh-heading.scss\",\n scoped: true,\n})\nexport class StzhHeading {\n /** Heading level */\n @Prop({ reflect: true }) level: \"1\" | \"2\" | \"3\" | \"4\" = \"2\";\n\n /** Type of curve to overwrite the curve inherited from `level` attribute (see [Spacings docs page](/docs/tokens-typography--docs#curves) for more info). */\n @Prop({ reflect: true }) curve: Font.Curves | \"auto\" = \"auto\";\n\n /* HTML content (since innerHTML won't work when it's being changed after initial render) */\n @Prop() htmlContent: string;\n private _htmlContent: string = \"\";\n\n @Watch(\"htmlContent\")\n htmlContentWatcher(newValue: string) {\n this._htmlContent = newValue;\n }\n\n componentWillLoad() {\n this.htmlContentWatcher(this.htmlContent);\n }\n\n render() {\n const Heading = `h${this.level}`;\n const classes = {\n \"stzh-heading\": true,\n [`stzh-heading--level-${this.level}`]: !!this.level,\n [`stzh-heading--curve-${this.curve}`]: !!this.curve,\n };\n\n return (\n <Host>\n <Heading class={classes}>\n <slot></slot>\n {this._htmlContent && <div innerHTML={this._htmlContent}></div>}\n </Heading>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/p-DxS-Wcb5.js DELETED Viewed

@@ -1,50 +0,0 @@
-import { p as proxyCustomElement, H, h, e as Host, t as transformTag } from './p-ptAFQZzh.js';
-const stzhLoaderCss = () => `.sc-stzh-loader-h{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);color:var(--stzh-base-color);box-sizing:border-box;display:block}[hidden].sc-stzh-loader-h,[stzh-hidden].sc-stzh-loader-h{display:none}.sc-stzh-loader-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-loader-h *.sc-stzh-loader,.sc-stzh-loader-h *.sc-stzh-loader::before,.sc-stzh-loader-h *.sc-stzh-loader::after{box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness);-webkit-text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink);text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink)}.sc-stzh-loader-h .has-focus.sc-stzh-loader{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-loader-h .stzh-fylingfocus-focused.sc-stzh-loader{outline-style:none !important}.sc-stzh-loader-h .stzh-fylingfocus-focused.sc-stzh-loader::-moz-focus-inner{border:0 !important}@keyframes stzh-loader{0%{transform:scale(0);left:0px;opacity:1}12.5%{transform:scale(1)}25%{left:0px}37.5%{left:4.375rem}50%{left:4.375rem}62.5%{left:8.75rem}75%{left:8.75rem;transform:scale(1)}87.5%{left:8.75rem;transform:scale(0);opacity:1}100%{left:8.75rem;opacity:0}}.stzh-loader.sc-stzh-loader{display:flex;flex-direction:column;align-items:center}.stzh-loader__label.sc-stzh-loader{font-size:var(--stzh-font-micro-font-size);line-height:var(--stzh-font-micro-text-line-height);text-align:center}.stzh-loader__label.sc-stzh-loader:not(:empty){margin-top:var(--stzh-space-medium)}.stzh-loader__wrapper.sc-stzh-loader{width:2.5rem;height:0.5rem}.stzh-loader__uil.sc-stzh-loader{background:none;position:relative;width:12.5rem;height:2.5rem;transform:scale(0.2);transform-origin:top left}.stzh-loader__ib.sc-stzh-loader{width:100%;height:100%;transform:rotate(0deg)}.stzh-loader__circle.sc-stzh-loader{width:3.75rem;height:2.5rem;position:absolute;opacity:0;text-align:center;animation:stzh-loader 3s linear infinite}.stzh-loader__circle.sc-stzh-loader>div.sc-stzh-loader{width:2.5rem;height:2.5rem;border-radius:1.25rem;margin:0 0.625rem}.stzh-loader__circle.sc-stzh-loader:nth-of-type(2n+1)>div.sc-stzh-loader{background:#0f05a0}.stzh-loader__circle.sc-stzh-loader:nth-of-type(2n)>div.sc-stzh-loader{background:#0f05a0}.stzh-loader__circle.sc-stzh-loader:nth-of-type(1){animation-delay:0s}.stzh-loader__circle.sc-stzh-loader:nth-of-type(2){animation-delay:0.75s}.stzh-loader__circle.sc-stzh-loader:nth-of-type(3){animation-delay:1.5s}.stzh-loader__circle.sc-stzh-loader:nth-of-type(4){animation-delay:2.25s}.stzh-loader--size-small.sc-stzh-loader .stzh-loader__label.sc-stzh-loader{font-size:var(--stzh-font-pico-font-size);line-height:var(--stzh-font-pico-text-line-height)}.stzh-loader--size-small.sc-stzh-loader .stzh-loader__label.sc-stzh-loader:not(:empty){margin-top:var(--stzh-space-xsmall)}.stzh-loader--size-small.sc-stzh-loader .stzh-loader__wrapper.sc-stzh-loader{width:1.25rem;height:0.25rem}.stzh-loader--size-small.sc-stzh-loader .stzh-loader__uil.sc-stzh-loader{transform:scale(0.1)}.stzh-loader--hide-label.sc-stzh-loader .stzh-loader__label.sc-stzh-loader{border:0;clip:rect(0 0 0 0);clip-path:inset(100%);width:0.0625rem;height:0.0625rem;overflow:hidden;padding:0;position:absolute}`;
-const StzhLoader = /*@__PURE__*/ proxyCustomElement(class StzhLoader extends H {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-        /** Size */
-        this.size = "default";
-        /** Label */
-        this.label = "";
-        /** Hide label text visually (still anounced for screenreaders) */
-        this.hideLabel = false;
-    }
-    render() {
-        const classes = {
-            "stzh-loader": true,
-            "stzh-loader--hide-label": this.hideLabel,
-            [`stzh-loader--size-${this.size}`]: !!this.size,
-        };
-        return (h(Host, { key: '9b3bc4487f99d3e9e76b9926ade01d96c51633a3' }, h("div", { key: '860579da74054b6acae1a4095d4c2c765775acfa', class: classes }, h("div", { key: 'fb5ca7397c7bf70d0a84c873785d75f569f6b3cc', class: "stzh-loader__wrapper" }, h("div", { key: '82b5ccbfee81c8c8deb1e015c84fa3cc0575e739', class: "stzh-loader__uil" }, h("div", { key: 'f4ee05bc9e3db559db009a35480c66aa63017d53', class: "stzh-loader__ib" }, h("div", { key: '69146b46a04527060e23aeef47c8827d176fb915', class: "stzh-loader__circle" }, h("div", { key: '4c8b6252e7be7be0dbe5602a1a32b38d18fa94fe' })), h("div", { key: 'b273303c3dc3c3b6c0593015a7733e6ffd8a56ab', class: "stzh-loader__circle" }, h("div", { key: '6e824097ecdfeb1ca1bba480a20d8d4150913017' })), h("div", { key: '165192e228e6e4a4b0ac8bb12bdf0bd9f96e4c6b', class: "stzh-loader__circle" }, h("div", { key: 'eb2b4579bba2b9de2edae6d9068a7d788cea4535' })), h("div", { key: '9731531cf07e01c155ff57b910e29d57eb131632', class: "stzh-loader__circle" }, h("div", { key: '8a610fee5583454768eae5a41d107537c6ce103e' }))))), h("div", { key: '40c4f9109039d42bfac5d188711a319eda81f3e1', class: "stzh-loader__label", "aria-live": "polite" }, this.label ? this.label : h("slot", null)))));
-    }
-    get element() { return this; }
-    static get style() { return stzhLoaderCss(); }
-}, [262, "stzh-loader", {
-        "size": [1],
-        "label": [1],
-        "hideLabel": [4, "hide-label"]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["stzh-loader"];
-    components.forEach(tagName => { switch (tagName) {
-        case "stzh-loader":
-            if (!customElements.get(transformTag(tagName))) {
-                customElements.define(transformTag(tagName), StzhLoader);
-            }
-            break;
-    } });
-}
-export { StzhLoader as S, defineCustomElement as d };
-//# sourceMappingURL=p-DxS-Wcb5.js.map
-//# sourceMappingURL=p-DxS-Wcb5.js.map

package/dist/components/p-DxS-Wcb5.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"file":"p-DxS-Wcb5.js","mappings":";;AAAA,MAAM,aAAa,GAAG,MAAM,CAAC,i2GAAi2G,CAAC;;MCUl3G,UAAU,iBAAAA,kBAAA,CAAA,MAAA,UAAA,SAAAC,CAAA,CAAA;AALvB,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;AAOU,QAAA,IAAI,CAAA,IAAA,GAAwB,SAAS;;AAGrC,QAAA,IAAK,CAAA,KAAA,GAAW,EAAE;;AAGlB,QAAA,IAAS,CAAA,SAAA,GAAY,KAAK;AAwCnC;IApCC,MAAM,GAAA;AACJ,QAAA,MAAM,OAAO,GAAG;AACd,YAAA,aAAa,EAAE,IAAI;YACnB,yBAAyB,EAAE,IAAI,CAAC,SAAS;YACzC,CAAC,CAAA,kBAAA,EAAqB,IAAI,CAAC,IAAI,CAAA,CAAE,GAAG,CAAC,CAAC,IAAI,CAAC,IAAI;SAChD;QAED,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,OAAO,EAAA,EACjB,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,sBAAsB,EAAA,EAC/B,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,kBAAkB,EAAA,EAC3B,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,iBAAiB,EAAA,EAC1B,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,qBAAqB,EAAA,EAC9B,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAW,CACP,EACN,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,qBAAqB,EAAA,EAC9B,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAW,CACP,EACN,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,qBAAqB,EAAA,EAC9B,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAW,CACP,EACN,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,qBAAqB,EAAA,EAC9B,CAAW,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACP,CACF,CACF,CACF,EAEN,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,oBAAoB,EAAA,WAAA,EAAW,QAAQ,EAC/C,EAAA,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,GAAG,eAAa,CACpC,CACF,CACD;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/stzh-loader/stzh-loader.scss?tag=stzh-loader&encapsulation=scoped","src/components/stzh-loader/stzh-loader.tsx"],"sourcesContent":[":host {\n}\n\n@keyframes stzh-loader {\n 0% {\n transform: scale(0);\n left: 0px;\n opacity: 1;\n }\n 12.5% {\n transform: scale(1);\n }\n 25% {\n left: 0px;\n }\n 37.5% {\n left: 70px;\n }\n 50% {\n left: 70px;\n }\n 62.5% {\n left: 140px;\n }\n 75% {\n left: 140px;\n transform: scale(1);\n }\n 87.5% {\n left: 140px;\n transform: scale(0);\n opacity: 1;\n }\n 100% {\n left: 140px;\n opacity: 0;\n }\n}\n\n.stzh-loader {\n display: flex;\n flex-direction: column;\n align-items: center;\n\n &__label {\n @include fontSize(\"micro\");\n text-align: center;\n\n &:not(:empty) {\n margin-top: space(\"medium\");\n }\n }\n\n &__wrapper {\n width: calc(200px / $loaderFactor);\n height: calc(40px / $loaderFactor);\n }\n\n &__uil {\n background: none;\n position: relative;\n width: 200px;\n height: 40px;\n transform: scale($loaderScale);\n transform-origin: top left;\n }\n\n &__ib {\n width: 100%;\n height: 100%;\n transform: rotate(0deg);\n }\n\n &__circle {\n width: 60px;\n height: 40px;\n position: absolute;\n opacity: 0;\n text-align: center;\n animation: stzh-loader 3s linear infinite;\n\n & > div {\n width: 40px;\n height: 40px;\n border-radius: 20px;\n margin: 0 10px;\n }\n\n &:nth-of-type(2n + 1) > div {\n background: #0f05a0;\n }\n\n &:nth-of-type(2n) > div {\n background: #0f05a0;\n }\n\n &:nth-of-type(1) {\n animation-delay: 0s;\n }\n\n &:nth-of-type(2) {\n animation-delay: 0.75s;\n }\n\n &:nth-of-type(3) {\n animation-delay: 1.5s;\n }\n\n &:nth-of-type(4) {\n animation-delay: 2.25s;\n }\n }\n\n /* Small variant */\n\n &--size-small &__label {\n @include fontSize(\"pico\");\n\n &:not(:empty) {\n margin-top: space(\"xsmall\");\n }\n }\n\n &--size-small &__wrapper {\n width: calc(200px / $loaderFactor * $loaderSmallFactor);\n height: calc(40px / $loaderFactor * $loaderSmallFactor);\n }\n\n &--size-small &__uil {\n transform: scale($loaderScale * $loaderSmallFactor);\n }\n\n /* Hide label */\n\n &--hide-label &__label {\n @include visuallyhidden;\n }\n}\n","import { Component, Host, h, Prop, Element } from \"@stencil/core\";\n\n/**\n * @slot - Slot for label/text content\n */\n@Component({\n tag: \"stzh-loader\",\n styleUrl: \"stzh-loader.scss\",\n scoped: true,\n})\nexport class StzhLoader {\n /** Size */\n @Prop() size: \"default\" | \"small\" = \"default\";\n\n /** Label */\n @Prop() label: string = \"\";\n\n /** Hide label text visually (still anounced for screenreaders) */\n @Prop() hideLabel: boolean = false;\n\n @Element() element: HTMLStzhInputElement;\n\n render() {\n const classes = {\n \"stzh-loader\": true,\n \"stzh-loader--hide-label\": this.hideLabel,\n [`stzh-loader--size-${this.size}`]: !!this.size,\n };\n\n return (\n <Host>\n <div class={classes}>\n <div class=\"stzh-loader__wrapper\">\n <div class=\"stzh-loader__uil\">\n <div class=\"stzh-loader__ib\">\n <div class=\"stzh-loader__circle\">\n <div></div>\n </div>\n <div class=\"stzh-loader__circle\">\n <div></div>\n </div>\n <div class=\"stzh-loader__circle\">\n <div></div>\n </div>\n <div class=\"stzh-loader__circle\">\n <div></div>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"stzh-loader__label\" aria-live=\"polite\">\n {this.label ? this.label : <slot></slot>}\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/p-KK5mdmv5.js DELETED Viewed

@@ -1,288 +0,0 @@
-import { p as proxyCustomElement, H, d as createEvent, h, e as Host, t as transformTag } from './p-ptAFQZzh.js';
-import { m as media, a as addMediaChangeListener, r as removeMediaChangeListener } from './p-CUGRmgip.js';
-import { d as defineCustomElement$7 } from './p-BaC_gScF.js';
-import { d as defineCustomElement$6 } from './p-ka1rmhv9.js';
-import { d as defineCustomElement$5 } from './p-02MiVwEL.js';
-import { d as defineCustomElement$4 } from './p-B8VeEjIy.js';
-import { d as defineCustomElement$3 } from './p-BCH90Ynw.js';
-import { d as defineCustomElement$2 } from './p-BxhXhWgp.js';
-import { d as defineCustomElement$1 } from './p-BVrrMSYA.js';
-const stzhDatalistCss = () => `.sc-stzh-datalist-h{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);color:var(--stzh-base-color);box-sizing:border-box;display:block}[hidden].sc-stzh-datalist-h,[stzh-hidden].sc-stzh-datalist-h{display:none}.sc-stzh-datalist-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-datalist-h *.sc-stzh-datalist,.sc-stzh-datalist-h *.sc-stzh-datalist::before,.sc-stzh-datalist-h *.sc-stzh-datalist::after{box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness);-webkit-text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink);text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink)}.sc-stzh-datalist-h .has-focus.sc-stzh-datalist{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-datalist-h .stzh-fylingfocus-focused.sc-stzh-datalist{outline-style:none !important}.sc-stzh-datalist-h .stzh-fylingfocus-focused.sc-stzh-datalist::-moz-focus-inner{border:0 !important}.sc-stzh-datalist-h{--columns:1;--columns-gap:var(--stzh-grid-gutter);--list-display:grid;--list-margin-right:calc(var(--columns-gap) / -1);--list-grid-template-columns:repeat(
-    var(--columns),
-    auto minmax(auto, 1fr) auto var(--columns-gap)
-  );--full-grid-column:1 / 5;--nested-margin-left:var(--stzh-datalist-nested-margin-left, 0px);--details-content-width:var(--stzh-datalist-details-content-width, 100%);--grid-template-areas:var(
-    --stzh-datalist-grid-template-areas,
-    "list list list list"
-  );--grid-template-columns:var(
-    --stzh-datalist-grid-template-columns,
-    repeat(4, minmax(0, 1fr))
-  );margin-left:var(--nested-margin-left)}@media screen and (min-width: 600px){.sc-stzh-datalist-h{--columns-gap:var(--stzh-grid-gutter-small);--grid-template-areas:var(
-      --stzh-datalist-grid-template-areas,
-      "list list list list"
-    )}}@media screen and (min-width: 900px){.sc-stzh-datalist-h{--columns-gap:var(--stzh-grid-gutter-medium);--grid-template-areas:var(
-      --stzh-datalist-grid-template-areas,
-      "list list list list list list list list"
-    );--grid-template-columns:var(
-      --stzh-datalist-grid-template-columns,
-      repeat(8, minmax(0, 1fr))
-    )}}@media screen and (min-width: 1260px){.sc-stzh-datalist-h{--columns-gap:var(--stzh-grid-gutter-large)}}@media screen and (min-width: 1600px){.sc-stzh-datalist-h{--columns-gap:var(--stzh-grid-gutter-ultra)}}.sc-stzh-datalist-h.sc-stzh-datalist-s>.layout_column>*:not([class*=cq-]),.sc-stzh-datalist-h .sc-stzh-datalist-s>.layout_column>*:not([class*=cq-]),.sc-stzh-datalist-h.sc-stzh-datalist-s>*:not([class*=cq-]),.sc-stzh-datalist-h .sc-stzh-datalist-s>*:not([class*=cq-]){display:contents}[is-direction=horizontal].sc-stzh-datalist-h{--list-grid-template-columns:repeat(
-    var(--columns),
-    auto minmax(auto, 1fr) auto auto var(--columns-gap)
-  );--full-grid-column:1 / 6}[is-direction=horizontal].sc-stzh-datalist-h:where(:has(stzh-datalist-item:not([meta=""]))),[is-direction=horizontal].sc-stzh-datalist-h:where(:has(stzh-datalist-item:not([status-label=""]))){--list-grid-template-columns:repeat(
-    var(--columns),
-    auto minmax(auto, 1fr) minmax(auto, 1fr) auto var(--columns-gap)
-  )}[variant=table].sc-stzh-datalist-h{--list-grid-template-columns:repeat(
-    var(--columns),
-    auto auto minmax(auto, 1fr) auto auto var(--columns-gap)
-  );--full-grid-column:1 / 7}[variant=table].sc-stzh-datalist-h:where(:has(stzh-datalist-item:not([meta=""]))),[variant=table].sc-stzh-datalist-h:where(:has(stzh-datalist-item:not([status-label=""]))){--list-grid-template-columns:repeat(
-    var(--columns),
-    auto auto minmax(auto, 1fr) minmax(auto, 1fr) auto var(--columns-gap)
-  )}[vertical-gap=small].sc-stzh-datalist-h .stzh-datalist__list.sc-stzh-datalist{grid-template-rows:auto}@media screen and (max-width: 899px){[vertical-gap=small].sc-stzh-datalist-h .stzh-datalist__list.sc-stzh-datalist{row-gap:var(--stzh-space-xsmall)}}@media screen and (min-width: 900px){[vertical-gap=small].sc-stzh-datalist-h .stzh-datalist__list.sc-stzh-datalist{row-gap:var(--stzh-space-xxsmall)}}.sc-stzh-datalist-h:has([class*=cq-]){--stzh-datalist-item-wrapper-display:flex;--list-display:block;--list-margin-right:0}.stzh-datalist.sc-stzh-datalist{--stzh-datalist-nested-margin-left:var(--stzh-space-large);--stzh-details-content-grid-column:var(--full-grid-column);--stzh-details-content-padding-right:var(--columns-gap);--stzh-details-content-width:var(--details-content-width);column-gap:var(--stzh-grid-gutter)}@media screen and (min-width: 600px){.stzh-datalist.sc-stzh-datalist{column-gap:var(--stzh-grid-gutter-small)}}@media screen and (min-width: 900px){.stzh-datalist.sc-stzh-datalist{column-gap:var(--stzh-grid-gutter-medium)}}@media screen and (min-width: 1260px){.stzh-datalist.sc-stzh-datalist{column-gap:var(--stzh-grid-gutter-large)}}@media screen and (min-width: 1600px){.stzh-datalist.sc-stzh-datalist{column-gap:var(--stzh-grid-gutter-ultra)}}.stzh-datalist.sc-stzh-datalist{display:grid;grid-template-areas:var(--grid-template-areas);grid-template-columns:var(--grid-template-columns)}.stzh-datalist__wrapper.sc-stzh-datalist{grid-area:list;overflow:visible}.stzh-datalist__list.sc-stzh-datalist{display:var(--list-display);border-collapse:collapse;grid-template-columns:var(--list-grid-template-columns);align-items:stretch;margin-right:var(--list-margin-right)}.stzh-datalist--has-multiple-columns.sc-stzh-datalist{--stzh-datalist-item-nested-display:none}@media screen and (max-width: 599px){.stzh-datalist--table.stzh-datalist--big-label.sc-stzh-datalist .stzh-datalist__list.sc-stzh-datalist{--list-display:flex;flex-direction:column;gap:var(--stzh-space-xxxsmall)}}`;
-const StzhDatalist = /*@__PURE__*/ proxyCustomElement(class StzhDatalist extends H {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-        this.stzhVariantChange = createEvent(this, "stzhVariantChange");
-        this.stzhBigLabelChange = createEvent(this, "stzhBigLabelChange");
-        this.stzhDirectionChange = createEvent(this, "stzhDirectionChange");
-        /** Variant */
-        this.variant = "default";
-        /** With big label */
-        this.bigLabel = false;
-        /** Columns */
-        this.columns = 1;
-        /** Direction */
-        this.direction = "vertical";
-        /**Vertical Gap between items */
-        this.verticalGap = "default";
-        /**
-         * Whether to disable min-width of datalist item label for the `horizontal` variant.
-         *
-         * If `false`, the default `min-width` is `144px` (for >= 800px) and `120px` (for < 800px).
-         * If `true`, the `min-width` is `none`, so the label column, will have the width of cell with the widest content.
-         *
-         * You can also overwrite the label min-width via CSS with the custom property `--item-label-min-width`.
-         */
-        // @Prop({ reflect: true }) disableLabelMinWidth: boolean = false;
-        /**
-         * Items in datalist
-         * Array of objects that must at least include `value` attribute.
-         * Can optionally contain `leadingIcon`, `label`, `meta`, `icon`, `iconLabel`, `iconTooltip`, `href`, `statusLabel`, `statusType` attribute and be nested to display deeper levels:
-         * `[{"value":"Value 1", "label": "Label 1"}, {"value":"Value 2", "label": "Label 2", "items": [...]}]`
-         */
-        this.items = [];
-        this._items = [];
-        this.currentColumns = 1;
-        this.setCurrentDirection = () => {
-            if (media("ultra").matches && this.directionUltra) {
-                this.currentDirection = this.directionUltra;
-            }
-            else if (media("large").matches && this.directionLarge) {
-                this.currentDirection = this.directionLarge;
-            }
-            else if (media("medium").matches && this.directionMedium) {
-                this.currentDirection = this.directionMedium;
-            }
-            else if (media("small").matches && this.directionSmall) {
-                this.currentDirection = this.directionSmall;
-            }
-            else {
-                this.currentDirection = this.direction;
-            }
-        };
-        this.setCurrentColumns = () => {
-            if (media("ultra").matches && this.columnsUltra) {
-                this.currentColumns = this.columnsUltra;
-            }
-            else if (media("large").matches && this.columnsLarge) {
-                this.currentColumns = this.columnsLarge;
-            }
-            else if (media("medium").matches && this.columnsMedium) {
-                this.currentColumns = this.columnsMedium;
-            }
-            else if (media("small").matches && this.columnsSmall) {
-                this.currentColumns = this.columnsSmall;
-            }
-            else {
-                this.currentColumns = this.columns;
-            }
-        };
-        this.resizeHandler = () => {
-            this.setCurrentDirection();
-            this.setCurrentColumns();
-        };
-    }
-    directionWatcher() {
-        this.setCurrentDirection();
-    }
-    columnsWatcher() {
-        this.setCurrentColumns();
-    }
-    currentDirectionWatcher(newValue) {
-        this.stzhDirectionChange.emit({
-            component: "stzh-datalist",
-            value: newValue,
-        });
-    }
-    variantWatcher(newValue) {
-        this.stzhVariantChange.emit({
-            component: "stzh-datalist",
-            value: newValue,
-        });
-    }
-    bigLabelWatcher(newValue) {
-        this.stzhBigLabelChange.emit({
-            component: "stzh-datalist",
-            value: newValue,
-        });
-    }
-    itemsWatcher(newValue) {
-        if (typeof newValue === "string") {
-            this._items = JSON.parse(newValue);
-        }
-        else {
-            this._items = newValue;
-        }
-    }
-    /** Get current direction */
-    async getCurrentDirection() {
-        return this.currentDirection;
-    }
-    async componentWillLoad() {
-        this.itemsWatcher(this.items);
-        this.bigLabelWatcher(this.bigLabel);
-        this.resizeHandler();
-    }
-    connectedCallback() {
-        addMediaChangeListener(this.resizeHandler);
-    }
-    disconnectedCallback() {
-        removeMediaChangeListener(this.resizeHandler);
-    }
-    render() {
-        const classes = {
-            "stzh-datalist": true,
-            "stzh-datalist--has-multiple-columns": this.currentColumns > 1,
-            "stzh-datalist--big-label": this.bigLabel,
-            [`stzh-datalist--direction-${this.currentDirection}`]: !!this.currentDirection,
-            [`stzh-datalist--${this.variant}`]: !!this.variant,
-            [`stzh-datalist--vertical-gap-${this.verticalGap}`]: !!this.verticalGap,
-        };
-        return (h(Host, { key: 'f55bf6edb128f70d0472e60d678d2d1bf6886063', "is-direction": this.currentDirection, "vertical-gap": this.verticalGap, style: {
-                "--columns": this.currentColumns ? this.currentColumns.toString() : null,
-            } }, h("div", { key: '15956b8fc489b222fd25bacaa54a27a0e55c556c', class: classes }, h("div", { key: 'd79210ec8fb288e7c91b68777ad58a0dfbb7f3c3', class: "stzh-datalist__wrapper" }, h("div", { key: '3f29eb25cd39c0981f2f665595615ebc689ec638', class: "stzh-datalist__list", role: "list" }, this._items.map(item => (h("stzh-datalist-item", Object.assign({}, item, { hasNested: !!item.items }), item.items && item.items.length > 0 && h("stzh-datalist", { items: item.items })))), h("slot", { key: 'e92b5ca486764202c52ea32f7aec53e456e0c606' }))))));
-    }
-    get element() { return this; }
-    static get watchers() { return {
-        "direction": ["directionWatcher"],
-        "directionSmall": ["directionWatcher"],
-        "directionMedium": ["directionWatcher"],
-        "directionLarge": ["directionWatcher"],
-        "directionUltra": ["directionWatcher"],
-        "columns": ["columnsWatcher"],
-        "columnsSmall": ["columnsWatcher"],
-        "columnsMedium": ["columnsWatcher"],
-        "columnsLarge": ["columnsWatcher"],
-        "columnsUltra": ["columnsWatcher"],
-        "currentDirection": ["currentDirectionWatcher"],
-        "variant": ["variantWatcher"],
-        "bigLabel": ["bigLabelWatcher"],
-        "items": ["itemsWatcher"]
-    }; }
-    static get style() { return stzhDatalistCss(); }
-}, [262, "stzh-datalist", {
-        "variant": [513],
-        "bigLabel": [516, "big-label"],
-        "columns": [514],
-        "columnsSmall": [514, "columns-small"],
-        "columnsMedium": [514, "columns-medium"],
-        "columnsLarge": [514, "columns-large"],
-        "columnsUltra": [514, "columns-ultra"],
-        "direction": [513],
-        "directionSmall": [513, "direction-small"],
-        "directionMedium": [513, "direction-medium"],
-        "directionLarge": [513, "direction-large"],
-        "directionUltra": [513, "direction-ultra"],
-        "verticalGap": [513, "vertical-gap"],
-        "items": [1],
-        "currentColumns": [32],
-        "currentDirection": [32],
-        "getCurrentDirection": [64]
-    }, undefined, {
-        "direction": ["directionWatcher"],
-        "directionSmall": ["directionWatcher"],
-        "directionMedium": ["directionWatcher"],
-        "directionLarge": ["directionWatcher"],
-        "directionUltra": ["directionWatcher"],
-        "columns": ["columnsWatcher"],
-        "columnsSmall": ["columnsWatcher"],
-        "columnsMedium": ["columnsWatcher"],
-        "columnsLarge": ["columnsWatcher"],
-        "columnsUltra": ["columnsWatcher"],
-        "currentDirection": ["currentDirectionWatcher"],
-        "variant": ["variantWatcher"],
-        "bigLabel": ["bigLabelWatcher"],
-        "items": ["itemsWatcher"]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["stzh-datalist", "stzh-badge", "stzh-button", "stzh-datalist", "stzh-datalist-item", "stzh-icon", "stzh-status", "stzh-text", "stzh-tooltip"];
-    components.forEach(tagName => { switch (tagName) {
-        case "stzh-datalist":
-            if (!customElements.get(transformTag(tagName))) {
-                customElements.define(transformTag(tagName), StzhDatalist);
-            }
-            break;
-        case "stzh-badge":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$7();
-            }
-            break;
-        case "stzh-button":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$6();
-            }
-            break;
-        case "stzh-datalist":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement();
-            }
-            break;
-        case "stzh-datalist-item":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$5();
-            }
-            break;
-        case "stzh-icon":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$4();
-            }
-            break;
-        case "stzh-status":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$3();
-            }
-            break;
-        case "stzh-text":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$2();
-            }
-            break;
-        case "stzh-tooltip":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$1();
-            }
-            break;
-    } });
-}
-export { StzhDatalist as S, defineCustomElement as d };
-//# sourceMappingURL=p-KK5mdmv5.js.map
-//# sourceMappingURL=p-KK5mdmv5.js.map

package/dist/components/p-KK5mdmv5.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"file":"p-KK5mdmv5.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/stzh-datalist/stzh-datalist.scss?tag=stzh-datalist&encapsulation=scoped","src/components/stzh-datalist/stzh-datalist.tsx"],"sourcesContent":[":host {\n --columns: 1;\n --columns-gap: #{$gridGutter};\n --list-display: grid;\n --list-margin-right: calc(var(--columns-gap) / -1);\n --list-grid-template-columns: repeat(\n var(--columns),\n auto minmax(auto, 1fr) auto var(--columns-gap)\n );\n --full-grid-column: 1 / 5;\n --nested-margin-left: var(--stzh-datalist-nested-margin-left, 0px);\n --details-content-width: var(--stzh-datalist-details-content-width, 100%);\n\n --grid-template-areas: var(\n --stzh-datalist-grid-template-areas,\n \"list list list list\"\n );\n\n --grid-template-columns: var(\n --stzh-datalist-grid-template-columns,\n #{$gridColumns}\n );\n\n margin-left: var(--nested-margin-left);\n\n @include mq($from: small) {\n --columns-gap: #{$gridGutterSmall};\n\n --grid-template-areas: var(\n --stzh-datalist-grid-template-areas,\n \"list list list list\"\n );\n }\n\n @include mq($from: medium) {\n --columns-gap: #{$gridGutterMedium};\n\n --grid-template-areas: var(\n --stzh-datalist-grid-template-areas,\n \"list list list list list list list list\"\n );\n\n --grid-template-columns: var(\n --stzh-datalist-grid-template-columns,\n #{$gridColumnsMedium}\n );\n }\n\n @include mq($from: large) {\n --columns-gap: #{$gridGutterLarge};\n }\n\n @include mq($from: ultra) {\n --columns-gap: #{$gridGutterUltra};\n }\n // datalist-item or wrapper elements should be set to display: contents to make grid layout work.\n // in AEM edit mode: we prevent setting it, so the links can still be edited.\n\n ::slotted(.layout_column) > *:not([class*=\"cq-\"]),\n ::slotted(*:not([class*=\"cq-\"])) {\n display: contents;\n }\n\n &[is-direction=\"horizontal\"] {\n --list-grid-template-columns: repeat(\n var(--columns),\n auto minmax(auto, 1fr) auto auto var(--columns-gap)\n );\n --full-grid-column: 1 / 6;\n\n &:where(:has(stzh-datalist-item:not([meta=\"\"]))),\n &:where(:has(stzh-datalist-item:not([status-label=\"\"]))) {\n --list-grid-template-columns: repeat(\n var(--columns),\n auto minmax(auto, 1fr) minmax(auto, 1fr) auto var(--columns-gap)\n );\n }\n }\n\n &[variant=\"table\"] {\n --list-grid-template-columns: repeat(\n var(--columns),\n auto auto minmax(auto, 1fr) auto auto var(--columns-gap)\n );\n --full-grid-column: 1 / 7;\n\n &:where(:has(stzh-datalist-item:not([meta=\"\"]))),\n &:where(:has(stzh-datalist-item:not([status-label=\"\"]))) {\n --list-grid-template-columns: repeat(\n var(--columns),\n auto auto minmax(auto, 1fr) minmax(auto, 1fr) auto var(--columns-gap)\n );\n }\n }\n\n &[vertical-gap=\"small\"] {\n .stzh-datalist__list {\n grid-template-rows: auto;\n @include mq($to: medium) {\n row-gap: space(\"xsmall\");\n }\n @include mq($from: medium) {\n row-gap: space(\"xxsmall\");\n }\n }\n }\n}\n\n/* AEM edit mode: we set list as block element (always as one column), to prevent layout breaks */\n\n:host(:has([class*=\"cq-\"])) {\n --stzh-datalist-item-wrapper-display: flex;\n\n --list-display: block;\n --list-margin-right: 0;\n}\n\n.stzh-datalist {\n // offset margin of nested datalist\n --stzh-datalist-nested-margin-left: #{space(\"large\")};\n // details grid columns\n --stzh-details-content-grid-column: var(--full-grid-column);\n --stzh-details-content-padding-right: var(--columns-gap);\n --stzh-details-content-width: var(--details-content-width);\n\n @include gridGutter;\n display: grid;\n grid-template-areas: var(--grid-template-areas);\n grid-template-columns: var(--grid-template-columns);\n\n &__wrapper {\n grid-area: list;\n overflow: visible;\n }\n\n &__list {\n display: var(--list-display);\n border-collapse: collapse;\n grid-template-columns: var(--list-grid-template-columns);\n align-items: stretch;\n margin-right: var(--list-margin-right);\n }\n\n /* Multiple Columns */\n\n &--has-multiple-columns {\n // display of nested datalist\n --stzh-datalist-item-nested-display: none;\n }\n\n /* Table variant with big label */\n\n &--table#{&}--big-label &__list {\n @include mq($to: small) {\n --list-display: flex;\n flex-direction: column;\n gap: space(\"xxxsmall\");\n }\n }\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Method, Prop, State, Watch } from \"@stencil/core\";\n\nimport {\n StzhDatalistBigLabelChangeEvent,\n StzhDatalistDirection,\n StzhDatalistDirectionChangeEvent,\n StzhDatalistItemEntry,\n StzhDatalistVariant,\n StzhDatalistVariantChangeEvent,\n} from \"../../index\";\n\nimport { addMediaChangeListener, media, removeMediaChangeListener } from \"../../utils/media-utils\";\n\n/**\n * @slot - Slot for any content\n */\n@Component({\n tag: \"stzh-datalist\",\n styleUrl: \"stzh-datalist.scss\",\n scoped: true,\n})\nexport class StzhDatalist {\n /** Variant */\n @Prop({ reflect: true }) variant: StzhDatalistVariant = \"default\";\n\n /** With big label */\n @Prop({ reflect: true }) bigLabel: boolean = false;\n\n /** Columns */\n @Prop({ reflect: true }) columns: number = 1;\n\n /** Columns above small breakpoint */\n @Prop({ reflect: true }) columnsSmall: number;\n\n /** Columns above medium breakpoint */\n @Prop({ reflect: true }) columnsMedium: number;\n\n /** Columns above large breakpoint */\n @Prop({ reflect: true }) columnsLarge: number;\n\n /** Columns above ultra breakpoint */\n @Prop({ reflect: true }) columnsUltra: number;\n\n /** Direction */\n @Prop({ reflect: true }) direction: StzhDatalistDirection = \"vertical\";\n\n /** Direction above small breakpoint */\n @Prop({ reflect: true }) directionSmall: StzhDatalistDirection;\n\n /** Direction above medium breakpoint */\n @Prop({ reflect: true }) directionMedium: StzhDatalistDirection;\n\n /** Direction above large breakpoint */\n @Prop({ reflect: true }) directionLarge: StzhDatalistDirection;\n\n /** Direction above ultra breakpoint */\n @Prop({ reflect: true }) directionUltra: StzhDatalistDirection;\n /**Vertical Gap between items */\n @Prop({ reflect: true }) verticalGap: \"default\" | \"small\" = \"default\";\n\n /**\n * Whether to disable min-width of datalist item label for the `horizontal` variant.\n *\n * If `false`, the default `min-width` is `144px` (for >= 800px) and `120px` (for < 800px).\n * If `true`, the `min-width` is `none`, so the label column, will have the width of cell with the widest content.\n *\n * You can also overwrite the label min-width via CSS with the custom property `--item-label-min-width`.\n */\n // @Prop({ reflect: true }) disableLabelMinWidth: boolean = false;\n\n /**\n * Items in datalist\n * Array of objects that must at least include `value` attribute.\n * Can optionally contain `leadingIcon`, `label`, `meta`, `icon`, `iconLabel`, `iconTooltip`, `href`, `statusLabel`, `statusType` attribute and be nested to display deeper levels:\n * `[{\"value\":\"Value 1\", \"label\": \"Label 1\"}, {\"value\":\"Value 2\", \"label\": \"Label 2\", \"items\": [...]}]`\n */\n @Prop() items: StzhDatalistItemEntry[] | string = [];\n private _items: StzhDatalistItemEntry[] = [];\n\n /** Variant attribute change event */\n @Event() stzhVariantChange: EventEmitter<StzhDatalistVariantChangeEvent>;\n\n /** Big label attribute change event */\n @Event() stzhBigLabelChange: EventEmitter<StzhDatalistBigLabelChangeEvent>;\n\n /** Direction attribute change event */\n @Event() stzhDirectionChange: EventEmitter<StzhDatalistDirectionChangeEvent>;\n\n @Element() element: HTMLStzhDatalistElement;\n\n @Watch(\"direction\")\n @Watch(\"directionSmall\")\n @Watch(\"directionMedium\")\n @Watch(\"directionLarge\")\n @Watch(\"directionUltra\")\n directionWatcher() {\n this.setCurrentDirection();\n }\n\n @Watch(\"columns\")\n @Watch(\"columnsSmall\")\n @Watch(\"columnsMedium\")\n @Watch(\"columnsLarge\")\n @Watch(\"columnsUltra\")\n columnsWatcher() {\n this.setCurrentColumns();\n }\n\n @Watch(\"currentDirection\")\n currentDirectionWatcher(newValue: StzhDatalistDirection) {\n this.stzhDirectionChange.emit({\n component: \"stzh-datalist\",\n value: newValue,\n });\n }\n\n @Watch(\"variant\")\n variantWatcher(newValue: StzhDatalistVariant) {\n this.stzhVariantChange.emit({\n component: \"stzh-datalist\",\n value: newValue,\n });\n }\n\n @Watch(\"bigLabel\")\n bigLabelWatcher(newValue: boolean) {\n this.stzhBigLabelChange.emit({\n component: \"stzh-datalist\",\n value: newValue,\n });\n }\n\n @Watch(\"items\")\n itemsWatcher(newValue: any[] | string) {\n if (typeof newValue === \"string\") {\n this._items = JSON.parse(newValue);\n } else {\n this._items = newValue;\n }\n }\n\n /** Get current direction */\n @Method()\n async getCurrentDirection() {\n return this.currentDirection;\n }\n\n @State() currentColumns: number = 1;\n @State() currentDirection: StzhDatalistDirection;\n\n private setCurrentDirection = () => {\n if (media(\"ultra\").matches && this.directionUltra) {\n this.currentDirection = this.directionUltra;\n } else if (media(\"large\").matches && this.directionLarge) {\n this.currentDirection = this.directionLarge;\n } else if (media(\"medium\").matches && this.directionMedium) {\n this.currentDirection = this.directionMedium;\n } else if (media(\"small\").matches && this.directionSmall) {\n this.currentDirection = this.directionSmall;\n } else {\n this.currentDirection = this.direction;\n }\n };\n\n private setCurrentColumns = () => {\n if (media(\"ultra\").matches && this.columnsUltra) {\n this.currentColumns = this.columnsUltra;\n } else if (media(\"large\").matches && this.columnsLarge) {\n this.currentColumns = this.columnsLarge;\n } else if (media(\"medium\").matches && this.columnsMedium) {\n this.currentColumns = this.columnsMedium;\n } else if (media(\"small\").matches && this.columnsSmall) {\n this.currentColumns = this.columnsSmall;\n } else {\n this.currentColumns = this.columns;\n }\n };\n\n resizeHandler = () => {\n this.setCurrentDirection();\n this.setCurrentColumns();\n };\n\n async componentWillLoad() {\n this.itemsWatcher(this.items);\n this.bigLabelWatcher(this.bigLabel);\n this.resizeHandler();\n }\n\n connectedCallback() {\n addMediaChangeListener(this.resizeHandler);\n }\n\n disconnectedCallback() {\n removeMediaChangeListener(this.resizeHandler);\n }\n\n render() {\n const classes = {\n \"stzh-datalist\": true,\n \"stzh-datalist--has-multiple-columns\": this.currentColumns > 1,\n \"stzh-datalist--big-label\": this.bigLabel,\n [`stzh-datalist--direction-${this.currentDirection}`]: !!this.currentDirection,\n [`stzh-datalist--${this.variant}`]: !!this.variant,\n [`stzh-datalist--vertical-gap-${this.verticalGap}`]: !!this.verticalGap,\n };\n\n return (\n <Host\n is-direction={this.currentDirection}\n vertical-gap={this.verticalGap}\n style={{\n \"--columns\": this.currentColumns ? this.currentColumns.toString() : null,\n }}\n >\n <div class={classes}>\n <div class=\"stzh-datalist__wrapper\">\n <div class=\"stzh-datalist__list\" role=\"list\">\n {this._items.map(item => (\n <stzh-datalist-item {...item} hasNested={!!item.items}>\n {item.items && item.items.length > 0 && <stzh-datalist items={item.items}></stzh-datalist>}\n </stzh-datalist-item>\n ))}\n <slot></slot>\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}