@oiz/stzh-components 4.12.1-beta1 → 4.12.1

package/dist/components/{p-RMVTGhIS.js → p-C7bl96a5.js}

@@ -1,9 +1,9 @@
-import { p as proxyCustomElement, H, d as createEvent, h, e as Host, t as transformTag } from './p-DajXzNIS.js';
-import { d as defineCustomElement$5 } from './p-BSx9yT8P.js';
-import { d as defineCustomElement$4 } from './p-C8p_ftK9.js';
-import { d as defineCustomElement$3 } from './p-C7Wum7Zf.js';
-import { d as defineCustomElement$2 } from './p-BA-k3iZ-.js';
-import { d as defineCustomElement$1 } from './p-B9l_iEm8.js';
+import { p as proxyCustomElement, H, d as createEvent, h, e as Host, t as transformTag } from './p-5QD-jnDI.js';
+import { d as defineCustomElement$5 } from './p-Yktwo3G-.js';
+import { d as defineCustomElement$4 } from './p-AGCnIH-Q.js';
+import { d as defineCustomElement$3 } from './p-DZ_hOgVb.js';
+import { d as defineCustomElement$2 } from './p-D1qHu5Qi.js';
+import { d as defineCustomElement$1 } from './p-Bh1lCPM9.js';
 
 const stzhCardlistCss = () => `.sc-stzh-cardlist-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-cardlist-h,[stzh-hidden].sc-stzh-cardlist-h{display:none}.sc-stzh-cardlist-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-cardlist-h *.sc-stzh-cardlist,.sc-stzh-cardlist-h *.sc-stzh-cardlist::before,.sc-stzh-cardlist-h *.sc-stzh-cardlist::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-cardlist-h .has-focus.sc-stzh-cardlist{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-cardlist-h .stzh-fylingfocus-focused.sc-stzh-cardlist{outline-style:none !important}.sc-stzh-cardlist-h .stzh-fylingfocus-focused.sc-stzh-cardlist::-moz-focus-inner{border:0 !important}.sc-stzh-cardlist-h{--description-color:var(--stzh-cardlist-description-color, inherit);--background-color:var(--stzh-cardlist-background-color, inherit)}.stzh-cardlist__cards.sc-stzh-cardlist{display:grid;gap:var(--stzh-grid-gutter)}@media screen and (min-width: 600px){.stzh-cardlist__cards.sc-stzh-cardlist{gap:var(--stzh-grid-gutter-small)}}@media screen and (min-width: 900px){.stzh-cardlist__cards.sc-stzh-cardlist{gap:var(--stzh-grid-gutter-medium)}}@media screen and (min-width: 1260px){.stzh-cardlist__cards.sc-stzh-cardlist{gap:var(--stzh-grid-gutter-large)}}@media screen and (min-width: 1600px){.stzh-cardlist__cards.sc-stzh-cardlist{gap:var(--stzh-grid-gutter-ultra)}}.stzh-cardlist__header.sc-stzh-cardlist{display:flex;justify-content:space-between;flex-direction:column;align-items:flex-start}@media screen and (min-width: 900px){.stzh-cardlist__header.sc-stzh-cardlist{flex-direction:row}}.stzh-cardlist__footer.sc-stzh-cardlist:not(:empty){margin-top:var(--stzh-space-medium)}@media screen and (min-width: 600px){.stzh-cardlist__footer.sc-stzh-cardlist:not(:empty){margin-top:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-cardlist__footer.sc-stzh-cardlist:not(:empty){margin-top:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-cardlist__footer.sc-stzh-cardlist:not(:empty){margin-top:var(--stzh-space-xxlarge)}}.stzh-cardlist__description.sc-stzh-cardlist{font-size:var(--stzh-font-curve-p1-default-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-p1-default-text-line-height, var(--stzh-font-milli-text-line-height));letter-spacing:var(--stzh-font-curve-p1-default-text-letter-spacing)}@media screen and (min-width: 900px){.stzh-cardlist__description.sc-stzh-cardlist{font-size:var(--stzh-font-curve-p1-medium-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-p1-medium-text-line-height, var(--stzh-font-centi-text-line-height));letter-spacing:var(--stzh-font-curve-p1-medium-text-letter-spacing)}}.stzh-cardlist__description.sc-stzh-cardlist{--stzh-icon-color:var(--stzh-color-primary70)}.stzh-cardlist__description.sc-stzh-cardlist:not(:empty){margin-bottom:var(--stzh-space-xsmall)}@media screen and (min-width: 900px){.stzh-cardlist__description.sc-stzh-cardlist:not(:empty){margin-bottom:0}}.stzh-cardlist__description.sc-stzh-cardlist-s>stzh-heading,.stzh-cardlist__description .sc-stzh-cardlist-s>stzh-heading{--color:var(--description-color)}.stzh-cardlist__switch.sc-stzh-cardlist{--color:inherit;align-self:end}.stzh-cardlist.sc-stzh-cardlist:has(.stzh-cardlist__description:not(:empty)) .stzh-cardlist__header.sc-stzh-cardlist,.stzh-cardlist--has-toggle-link.sc-stzh-cardlist .stzh-cardlist__header.sc-stzh-cardlist{margin-bottom:var(--stzh-space-medium)}@media screen and (min-width: 600px){.stzh-cardlist.sc-stzh-cardlist:has(.stzh-cardlist__description:not(:empty)) .stzh-cardlist__header.sc-stzh-cardlist,.stzh-cardlist--has-toggle-link.sc-stzh-cardlist .stzh-cardlist__header.sc-stzh-cardlist{margin-bottom:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-cardlist.sc-stzh-cardlist:has(.stzh-cardlist__description:not(:empty)) .stzh-cardlist__header.sc-stzh-cardlist,.stzh-cardlist--has-toggle-link.sc-stzh-cardlist .stzh-cardlist__header.sc-stzh-cardlist{margin-bottom:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-cardlist.sc-stzh-cardlist:has(.stzh-cardlist__description:not(:empty)) .stzh-cardlist__header.sc-stzh-cardlist,.stzh-cardlist--has-toggle-link.sc-stzh-cardlist .stzh-cardlist__header.sc-stzh-cardlist{margin-bottom:var(--stzh-space-xxlarge)}}.stzh-cardlist--layout-subpages .stzh-cardlist__cards.sc-stzh-cardlist:has(stzh-card-navigation:not([has-lead])),.stzh-cardlist--layout-subpages .stzh-cardlist__cards.sc-stzh-cardlist:has(stzh-pi-content-navigation:not([has-lead])){row-gap:var(--stzh-space-xxsmall)}@media screen and (min-width: 900px){.stzh-cardlist--layout-subpages .stzh-cardlist__cards.sc-stzh-cardlist:has(stzh-card-navigation:not([has-lead])),.stzh-cardlist--layout-subpages .stzh-cardlist__cards.sc-stzh-cardlist:has(stzh-pi-content-navigation:not([has-lead])){row-gap:var(--stzh-space-xsmall)}}@media screen and (min-width: 1260px){.stzh-cardlist--layout-subpages .stzh-cardlist__cards.sc-stzh-cardlist:has(stzh-card-navigation:not([has-lead])),.stzh-cardlist--layout-subpages .stzh-cardlist__cards.sc-stzh-cardlist:has(stzh-pi-content-navigation:not([has-lead])){row-gap:var(--stzh-space-small)}}@media screen and (min-width: 900px){.stzh-cardlist--layout-subpages .stzh-cardlist__cards.sc-stzh-cardlist:has(stzh-card-navigation:not([has-lead])),.stzh-cardlist--layout-subpages .stzh-cardlist__cards.sc-stzh-cardlist:has(stzh-pi-content-navigation:not([has-lead])){grid-template-columns:repeat(2, minmax(0, 1fr));padding-left:0}}@media screen and (min-width: 1260px){.stzh-cardlist--layout-subpages .stzh-cardlist__cards.sc-stzh-cardlist:has(stzh-pi-content-navigation:not([has-lead])){grid-template-columns:repeat(3, minmax(0, 1fr))}}.stzh-cardlist--layout-subpages.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist:has(stzh-card-navigation[has-lead]),.stzh-cardlist--layout-subpages.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist:has(stzh-pi-content-navigation[has-lead]){row-gap:var(--stzh-space-medium)}@media screen and (min-width: 600px){.stzh-cardlist--layout-subpages.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist:has(stzh-card-navigation[has-lead]),.stzh-cardlist--layout-subpages.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist:has(stzh-pi-content-navigation[has-lead]){row-gap:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-cardlist--layout-subpages.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist:has(stzh-card-navigation[has-lead]),.stzh-cardlist--layout-subpages.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist:has(stzh-pi-content-navigation[has-lead]){row-gap:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-cardlist--layout-subpages.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist:has(stzh-card-navigation[has-lead]),.stzh-cardlist--layout-subpages.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist:has(stzh-pi-content-navigation[has-lead]){row-gap:var(--stzh-space-xxlarge)}}@media screen and (min-width: 600px){.stzh-cardlist--layout-subpages.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist:has(stzh-card-navigation[has-lead]),.stzh-cardlist--layout-subpages.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist:has(stzh-pi-content-navigation[has-lead]){grid-template-columns:repeat(2, minmax(0, 1fr))}}@media screen and (min-width: 1260px){.stzh-cardlist--layout-subpages.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist:has(stzh-card-navigation[has-lead]),.stzh-cardlist--layout-subpages.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist:has(stzh-pi-content-navigation[has-lead]){grid-template-columns:repeat(3, minmax(0, 1fr))}}.stzh-cardlist--layout-pi-teasers.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist{row-gap:var(--stzh-space-large)}@media screen and (min-width: 600px){.stzh-cardlist--layout-pi-teasers.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist{row-gap:var(--stzh-space-xlarge)}}@media screen and (min-width: 900px){.stzh-cardlist--layout-pi-teasers.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist{row-gap:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){.stzh-cardlist--layout-pi-teasers.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist{row-gap:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 600px){.stzh-cardlist--layout-pi-teasers.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist{grid-template-columns:repeat(2, minmax(0, 1fr))}}@media screen and (min-width: 900px){.stzh-cardlist--layout-pi-teasers.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist{grid-template-columns:repeat(2, minmax(0, 1fr))}}@media screen and (min-width: 1260px){.stzh-cardlist--layout-pi-teasers.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist{grid-template-columns:repeat(3, minmax(0, 1fr))}}.stzh-cardlist--layout-teasers.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist{row-gap:var(--stzh-space-large)}@media screen and (min-width: 600px){.stzh-cardlist--layout-teasers.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist{row-gap:var(--stzh-space-xlarge)}}@media screen and (min-width: 900px){.stzh-cardlist--layout-teasers.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist{row-gap:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){.stzh-cardlist--layout-teasers.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist{row-gap:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 600px){.stzh-cardlist--layout-teasers.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist{grid-template-columns:repeat(2, minmax(0, 1fr))}}@media screen and (min-width: 900px){.stzh-cardlist--layout-teasers.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist{grid-template-columns:repeat(3, minmax(0, 1fr))}}@media screen and (min-width: 1260px){.stzh-cardlist--layout-teasers.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist{grid-template-columns:repeat(4, minmax(0, 1fr))}}@media screen and (min-width: 1260px){.stzh-cardlist--layout-teasers.stzh-cardlist--max-3-cols.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist,.stzh-cardlist--layout-pi-teasers.stzh-cardlist--max-3-cols.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist{grid-template-columns:repeat(3, minmax(0, 1fr))}}.stzh-cardlist--layout-searchresults.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist{gap:var(--stzh-space-xlarge)}.stzh-cardlist--layout-fullwidth.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist{gap:var(--stzh-space-medium)}@media screen and (min-width: 600px){.stzh-cardlist--layout-fullwidth.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist{gap:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-cardlist--layout-fullwidth.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist{gap:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-cardlist--layout-fullwidth.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist{gap:var(--stzh-space-xxlarge)}}.stzh-cardlist--layout-pi-teasers.sc-stzh-cardlist{background-color:var(--background-color);position:relative;left:50%;right:50%;margin-left:calc(-50vw + var(--stzh-scrollbar-width) / 2);margin-right:calc(-50vw + var(--stzh-scrollbar-width) / 2);width:calc(100vw - var(--stzh-scrollbar-width));max-width:calc(100vw - var(--stzh-scrollbar-width));--slotted:var(--stzh-cardlist-pi-content, 0);left:calc(50% * (1 - var(--slotted)));right:calc(50% * (1 - var(--slotted)));margin-left:calc((-50vw + var(--stzh-scrollbar-width) / 2) * (1 - var(--slotted)));margin-right:calc((-50vw + var(--stzh-scrollbar-width) / 2) * (1 - var(--slotted)));width:calc((100vw - var(--stzh-scrollbar-width)) * (1 - var(--slotted)) + 100% * var(--slotted));max-width:calc(100vw - var(--stzh-scrollbar-width) * (1 - var(--slotted)) + 100% * var(--slotted));padding-top:var(--stzh-space-xxlarge)}@media screen and (min-width: 600px){.stzh-cardlist--layout-pi-teasers.sc-stzh-cardlist{padding-top:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 900px){.stzh-cardlist--layout-pi-teasers.sc-stzh-cardlist{padding-top:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 1260px){.stzh-cardlist--layout-pi-teasers.sc-stzh-cardlist{padding-top:var(--stzh-space-xbig)}}.stzh-cardlist--layout-pi-teasers.sc-stzh-cardlist{padding-bottom:var(--stzh-space-xxlarge)}@media screen and (min-width: 600px){.stzh-cardlist--layout-pi-teasers.sc-stzh-cardlist{padding-bottom:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 900px){.stzh-cardlist--layout-pi-teasers.sc-stzh-cardlist{padding-bottom:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 1260px){.stzh-cardlist--layout-pi-teasers.sc-stzh-cardlist{padding-bottom:var(--stzh-space-xbig)}}.stzh-cardlist--layout-pi-teasers.sc-stzh-cardlist .stzh-cardlist__header.sc-stzh-cardlist,.stzh-cardlist--layout-pi-teasers.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist{margin-left:1.25rem;margin-right:1.25rem}@media screen and (min-width: 600px){.stzh-cardlist--layout-pi-teasers.sc-stzh-cardlist .stzh-cardlist__header.sc-stzh-cardlist,.stzh-cardlist--layout-pi-teasers.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist{margin-left:2rem;margin-right:2rem}}@media screen and (min-width: 900px){.stzh-cardlist--layout-pi-teasers.sc-stzh-cardlist .stzh-cardlist__header.sc-stzh-cardlist,.stzh-cardlist--layout-pi-teasers.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist{margin-left:2.5rem;margin-right:2.5rem}}@media screen and (min-width: 1260px){.stzh-cardlist--layout-pi-teasers.sc-stzh-cardlist .stzh-cardlist__header.sc-stzh-cardlist,.stzh-cardlist--layout-pi-teasers.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist{margin-left:4rem;margin-right:4rem}}@media screen and (min-width: 1600px){.stzh-cardlist--layout-pi-teasers.sc-stzh-cardlist .stzh-cardlist__header.sc-stzh-cardlist,.stzh-cardlist--layout-pi-teasers.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist{margin-left:auto;margin-right:auto;max-width:84.25rem}}@media screen and (min-width: 1600px){.stzh-cardlist--layout-pi-teasers.sc-stzh-cardlist .stzh-cardlist__header.sc-stzh-cardlist,.stzh-cardlist--layout-pi-teasers.sc-stzh-cardlist .stzh-cardlist__cards.sc-stzh-cardlist{--slotted:var(--stzh-cardlist-pi-content, 0);--center-margin:max(0px, calc((100% - 84.25rem) / 2));margin-left:calc((1 - var(--slotted)) * var(--center-margin) + var(--slotted) * 4rem);margin-right:calc((1 - var(--slotted)) * var(--center-margin) + var(--slotted) * 4rem)}}`;
 
@@ -150,6 +150,6 @@ function defineCustomElement() {
 }
 
 export { StzhCardlist as S, defineCustomElement as d };
-//# sourceMappingURL=p-RMVTGhIS.js.map
+//# sourceMappingURL=p-C7bl96a5.js.map
 
-//# sourceMappingURL=p-RMVTGhIS.js.map
+//# sourceMappingURL=p-C7bl96a5.js.map

package/dist/components/{p-RMVTGhIS.js.map → p-C7bl96a5.js.map}

@@ -1 +1 @@
-{"file":"p-RMVTGhIS.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/stzh-cardlist/stzh-cardlist.scss?tag=stzh-cardlist&encapsulation=scoped","src/components/stzh-cardlist/stzh-cardlist.tsx"],"sourcesContent":[":host {\n  --description-color: var(--stzh-cardlist-description-color, inherit);\n  --background-color: var(--stzh-cardlist-background-color, inherit);\n}\n\n.stzh-cardlist {\n  &__cards {\n    display: grid;\n    gap: $gridGutter;\n\n    @include mq($from: small) {\n      gap: $gridGutterSmall;\n    }\n\n    @include mq($from: medium) {\n      gap: $gridGutterMedium;\n    }\n\n    @include mq($from: large) {\n      gap: $gridGutterLarge;\n    }\n\n    @include mq($from: ultra) {\n      gap: $gridGutterUltra;\n    }\n  }\n\n  &__header {\n    display: flex;\n    justify-content: space-between;\n    flex-direction: column;\n    align-items: flex-start;\n\n    @include mq($from: medium) {\n      // was smallheader before\n      flex-direction: row;\n    }\n  }\n\n  &__footer:not(:empty) {\n    @include spaceCurve(\"margin-top\", \"regular\");\n  }\n\n  &__description {\n    @include fontCurve(\"p1\");\n    --stzh-icon-color: #{$colorPrimary70};\n\n    &:not(:empty) {\n      margin-bottom: space(\"xsmall\");\n\n      @include mq($from: medium) {\n        // was smallheader before\n        margin-bottom: 0;\n      }\n    }\n\n    ::slotted(stzh-heading) {\n      --color: var(--description-color);\n    }\n  }\n\n  &__switch {\n    --color: inherit;\n    align-self: end;\n  }\n\n  /* Has content inside header */\n\n  &:has(#{&}__description:not(:empty)) &__header,\n  &--has-toggle-link &__header {\n    @include spaceCurve(\"margin-bottom\", \"regular\");\n  }\n\n  /* Subpages layout variant */\n\n  &--layout-subpages &__cards:has(stzh-card-navigation:not([has-lead])),\n  &--layout-subpages &__cards:has(stzh-pi-content-navigation:not([has-lead])) {\n    @include spaceCurve(\"row-gap\", \"tiny\");\n\n    @include mq($from: medium) {\n      grid-template-columns: repeat(2, minmax(0, 1fr));\n      padding-left: 0;\n    }\n  }\n\n  &--layout-subpages &__cards:has(stzh-pi-content-navigation:not([has-lead])) {\n    @include mq($from: large) {\n      grid-template-columns: repeat(3, minmax(0, 1fr));\n    }\n  }\n\n  &--layout-subpages &__cards:has(stzh-card-navigation[has-lead]),\n  &--layout-subpages &__cards:has(stzh-pi-content-navigation[has-lead]) {\n    @include spaceCurve(\"row-gap\", \"regular\");\n\n    @include mq($from: small) {\n      grid-template-columns: repeat(2, minmax(0, 1fr));\n    }\n\n    @include mq($from: large) {\n      grid-template-columns: repeat(3, minmax(0, 1fr));\n    }\n  }\n\n  /* Teasers and Pi Teasers layout variant */\n  &--layout-pi-teasers &__cards {\n    @include spaceCurve(\"row-gap\", \"medium\");\n\n    @include mq($from: small) {\n      grid-template-columns: repeat(2, minmax(0, 1fr));\n    }\n\n    @include mq($from: medium) {\n      grid-template-columns: repeat(2, minmax(0, 1fr));\n    }\n\n    @include mq($from: large) {\n      grid-template-columns: repeat(3, minmax(0, 1fr));\n    }\n  }\n\n  &--layout-teasers &__cards {\n    @include spaceCurve(\"row-gap\", \"medium\");\n\n    @include mq($from: small) {\n      grid-template-columns: repeat(2, minmax(0, 1fr));\n    }\n\n    @include mq($from: medium) {\n      grid-template-columns: repeat(3, minmax(0, 1fr));\n    }\n\n    @include mq($from: large) {\n      grid-template-columns: repeat(4, minmax(0, 1fr));\n    }\n  }\n\n  &--layout-teasers#{&}--max-3-cols &__cards,\n  &--layout-pi-teasers#{&}--max-3-cols &__cards {\n    @include mq($from: large) {\n      grid-template-columns: repeat(3, minmax(0, 1fr));\n    }\n  }\n\n  /* Searchresults layout variant */\n\n  &--layout-searchresults &__cards {\n    gap: space(\"xlarge\");\n  }\n\n  /* Fullwidth layout variant (e.g. for MeinKonto dashboard) */\n\n  &--layout-fullwidth &__cards {\n    @include spaceCurve(\"gap\", \"regular\");\n  }\n\n  /* Pi Teasers variant */\n  &--layout-pi-teasers {\n    background-color: var(--background-color);\n    position: relative;\n    left: 50%;\n    right: 50%;\n    margin-left: calc(-50vw + var(--stzh-scrollbar-width) / 2);\n    margin-right: calc(-50vw + var(--stzh-scrollbar-width) / 2);\n    width: calc(100vw - var(--stzh-scrollbar-width));\n    max-width: calc(100vw - var(--stzh-scrollbar-width));\n\n    --slotted: var(--stzh-cardlist-pi-content, 0);\n    left: calc(50% * (1 - var(--slotted)));\n    right: calc(50% * (1 - var(--slotted)));\n\n    margin-left: calc(\n      (-50vw + var(--stzh-scrollbar-width) / 2) * (1 - var(--slotted))\n    );\n    margin-right: calc(\n      (-50vw + var(--stzh-scrollbar-width) / 2) * (1 - var(--slotted))\n    );\n\n    width: calc(\n      (100vw - var(--stzh-scrollbar-width)) * (1 - var(--slotted)) + 100% *\n        var(--slotted)\n    );\n    max-width: calc(\n      100vw - var(--stzh-scrollbar-width) * (1 - var(--slotted)) + 100% *\n        var(--slotted)\n    );\n\n    @include spaceCurve(\"padding-top\", \"big\");\n    @include spaceCurve(\"padding-bottom\", \"big\");\n  }\n\n  &--layout-pi-teasers &__header,\n  &--layout-pi-teasers &__cards {\n    @include container();\n    @include mq($from: ultra) {\n      --slotted: var(--stzh-cardlist-pi-content, 0);\n\n      --center-margin: max(0px, calc((100% - #{$containerMaxWidth}) / 2));\n\n      margin-left: calc(\n        (1 - var(--slotted)) * var(--center-margin) + var(--slotted) *\n          #{$containerMarginLarge}\n      );\n      margin-right: calc(\n        (1 - var(--slotted)) * var(--center-margin) + var(--slotted) *\n          #{$containerMarginLarge}\n      );\n    }\n  }\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Listen, Prop, State } from \"@stencil/core\";\n\nimport { StzhCardlistCollapseAllEvent } from \"../../index\";\nimport { StzhCardlistLocalizedText } from \"./stzh-cardlist.localization\";\n\n/**\n * @slot - Slot for `stzh-card` elements\n * @slot description - Slot for description\n * @slot footer - Slot for footer elements\n */\n@Component({\n  tag: \"stzh-cardlist\",\n  styleUrl: \"stzh-cardlist.scss\",\n  scoped: true,\n})\nexport class StzhCardlist {\n  /** Translation strings */\n  @Prop() localization: StzhCardlistLocalizedText;\n\n  @Prop({ reflect: true }) layout: \"fullwidth\" | \"searchresults\" | \"subpages\" | \"teasers\" | \"pi-teasers\" = \"fullwidth\";\n\n  /** Description message (use description slot as alternative) */\n  @Prop() description: string;\n\n  /** Whether collapse/expand toggle link */\n  @Prop({ reflect: true }) showToggleLink: boolean = false;\n\n  /** Whether sorting should be enabled */\n  @Prop() sortableEnabled: boolean = false;\n\n  /** HTML attribute that is used by the `toArray()` of sortable method */\n  @Prop() sortableDataIdAttribute: string = \"data-id\";\n\n  /** Force maximum 3 columns layout instead of 4 */\n  @Prop() max3Columns: boolean = false;\n\n  @Element() element: HTMLStzhCardlistElement;\n\n  /** Collapse all event */\n  @Event() stzhCollapseAll: EventEmitter<StzhCardlistCollapseAllEvent>;\n\n  @Listen(\"stzhCollapse\")\n  collapseListener() {\n    this.updateCollapsedState();\n  }\n\n  @State() allCollapsed: boolean = false;\n  @State() isStzhAnchornavVisible: boolean = false;\n\n  private collapseClick = () => {\n    const cards = Array.from(this.element.querySelectorAll(\"stzh-card\"));\n    cards.forEach(card => {\n      if (card.collapsible) {\n        card.collapsed = !this.allCollapsed;\n      }\n    });\n\n    this.allCollapsed = !this.allCollapsed;\n\n    this.stzhCollapseAll.emit({\n      component: \"stzh-cardlist\",\n      allCollapsed: this.allCollapsed,\n    });\n  };\n\n  private updateCollapsedState = () => {\n    const cards = Array.from(this.element.querySelectorAll(\"stzh-card\"));\n    this.allCollapsed = !cards.some(card => !card.collapsed);\n  };\n\n  private sortableGhostClone: Function = (dragElement: HTMLElement) => {\n    // const [clonedElement, clonedStzhElement, originalStzhElement] = cloneWrappedStzhElement(dragElement);\n\n    // if (\n    //   clonedStzhElement\n    //   && originalStzhElement\n    //   && clonedStzhElement.tagName.toLowerCase() === \"stzh-card\"\n    // ) {\n    //   const clonedStzhElementCard: HTMLStzhCardElement = clonedStzhElement as HTMLStzhCardElement;\n    //   const originalStzhElementCard: HTMLStzhCardElement = originalStzhElement as HTMLStzhCardElement;\n\n    //   // copy every property that is not reflected to its attribute\n    //   clonedStzhElementCard.heading = originalStzhElementCard.heading;\n    //   clonedStzhElementCard.subtitle = originalStzhElementCard.subtitle;\n    //   clonedStzhElementCard.headerActions = originalStzhElementCard.headerActions;\n    //   clonedStzhElementCard.footerActions = originalStzhElementCard.footerActions;\n    //   clonedStzhElementCard.hideMovementActions = originalStzhElementCard.hideMovementActions;\n    // }\n\n    // return clonedElement;\n\n    const card =\n      dragElement.tagName.toLowerCase() === \"stzh-card\" ? dragElement : dragElement.querySelector(\"stzh-card\");\n\n    if (card) {\n      const originalElement = dragElement as HTMLStzhCardElement;\n      const clonedElement = dragElement.cloneNode(true) as HTMLStzhCardElement;\n\n      // copy every property that is not reflected to its attribute\n      clonedElement.heading = originalElement.heading;\n      clonedElement.subtitle = originalElement.subtitle;\n      clonedElement.headerActions = originalElement.headerActions;\n      clonedElement.footerActions = originalElement.footerActions;\n      clonedElement.hideMovementActions = originalElement.hideMovementActions;\n\n      return clonedElement;\n    }\n  };\n\n  async componentWillLoad() {\n    this.isStzhAnchornavVisible =\n      document.documentElement.style.getPropertyValue(\"--stzh-anchornav-is-visible\") === \"1\";\n    if (!this.localization) {\n      this.localization = await window.stzhComponents.utils.fetchTranslations(this.element, \"cardlist\");\n    }\n  }\n\n  componentDidLoad() {\n    this.isStzhAnchornavVisible =\n      document.documentElement.style.getPropertyValue(\"--stzh-anchornav-is-visible\") === \"1\";\n    this.updateCollapsedState();\n  }\n\n  render() {\n    const classes = {\n      \"stzh-cardlist\": true,\n      \"stzh-cardlist--has-toggle-link\": this.showToggleLink,\n      \"stzh-cardlist--max-3-cols\": this.isStzhAnchornavVisible || this.max3Columns,\n      [`stzh-cardlist--layout-${this.layout}`]: !!this.layout,\n    };\n\n    return (\n      <Host>\n        <div class={classes}>\n          <div class=\"stzh-cardlist__header\">\n            <div class=\"stzh-cardlist__description\">\n              {this.description ? this.description : <slot name=\"description\"></slot>}\n            </div>\n            {this.showToggleLink && (\n              <stzh-link\n                class=\"stzh-cardlist__switch\"\n                icon={this.allCollapsed ? \"list-expanded\" : \"list-shrinked\"}\n                label={this.allCollapsed ? this.localization.expandAll : this.localization.collapseAll}\n                onClick={this.collapseClick}\n              ></stzh-link>\n            )}\n          </div>\n\n          <stzh-sortable\n            disabled={!this.sortableEnabled}\n            dataIdAttribute={this.sortableDataIdAttribute}\n            ghostClone={this.sortableGhostClone}\n          >\n            <div class=\"stzh-cardlist__cards\" role=\"list\">\n              <slot></slot>\n            </div>\n          </stzh-sortable>\n\n          <div class=\"stzh-cardlist__footer\">\n            <stzh-container>\n              <slot name=\"footer\"></slot>\n            </stzh-container>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-C7bl96a5.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/stzh-cardlist/stzh-cardlist.scss?tag=stzh-cardlist&encapsulation=scoped","src/components/stzh-cardlist/stzh-cardlist.tsx"],"sourcesContent":[":host {\n  --description-color: var(--stzh-cardlist-description-color, inherit);\n  --background-color: var(--stzh-cardlist-background-color, inherit);\n}\n\n.stzh-cardlist {\n  &__cards {\n    display: grid;\n    gap: $gridGutter;\n\n    @include mq($from: small) {\n      gap: $gridGutterSmall;\n    }\n\n    @include mq($from: medium) {\n      gap: $gridGutterMedium;\n    }\n\n    @include mq($from: large) {\n      gap: $gridGutterLarge;\n    }\n\n    @include mq($from: ultra) {\n      gap: $gridGutterUltra;\n    }\n  }\n\n  &__header {\n    display: flex;\n    justify-content: space-between;\n    flex-direction: column;\n    align-items: flex-start;\n\n    @include mq($from: medium) {\n      // was smallheader before\n      flex-direction: row;\n    }\n  }\n\n  &__footer:not(:empty) {\n    @include spaceCurve(\"margin-top\", \"regular\");\n  }\n\n  &__description {\n    @include fontCurve(\"p1\");\n    --stzh-icon-color: #{$colorPrimary70};\n\n    &:not(:empty) {\n      margin-bottom: space(\"xsmall\");\n\n      @include mq($from: medium) {\n        // was smallheader before\n        margin-bottom: 0;\n      }\n    }\n\n    ::slotted(stzh-heading) {\n      --color: var(--description-color);\n    }\n  }\n\n  &__switch {\n    --color: inherit;\n    align-self: end;\n  }\n\n  /* Has content inside header */\n\n  &:has(#{&}__description:not(:empty)) &__header,\n  &--has-toggle-link &__header {\n    @include spaceCurve(\"margin-bottom\", \"regular\");\n  }\n\n  /* Subpages layout variant */\n\n  &--layout-subpages &__cards:has(stzh-card-navigation:not([has-lead])),\n  &--layout-subpages &__cards:has(stzh-pi-content-navigation:not([has-lead])) {\n    @include spaceCurve(\"row-gap\", \"tiny\");\n\n    @include mq($from: medium) {\n      grid-template-columns: repeat(2, minmax(0, 1fr));\n      padding-left: 0;\n    }\n  }\n\n  &--layout-subpages &__cards:has(stzh-pi-content-navigation:not([has-lead])) {\n    @include mq($from: large) {\n      grid-template-columns: repeat(3, minmax(0, 1fr));\n    }\n  }\n\n  &--layout-subpages &__cards:has(stzh-card-navigation[has-lead]),\n  &--layout-subpages &__cards:has(stzh-pi-content-navigation[has-lead]) {\n    @include spaceCurve(\"row-gap\", \"regular\");\n\n    @include mq($from: small) {\n      grid-template-columns: repeat(2, minmax(0, 1fr));\n    }\n\n    @include mq($from: large) {\n      grid-template-columns: repeat(3, minmax(0, 1fr));\n    }\n  }\n\n  /* Teasers and Pi Teasers layout variant */\n  &--layout-pi-teasers &__cards {\n    @include spaceCurve(\"row-gap\", \"medium\");\n\n    @include mq($from: small) {\n      grid-template-columns: repeat(2, minmax(0, 1fr));\n    }\n\n    @include mq($from: medium) {\n      grid-template-columns: repeat(2, minmax(0, 1fr));\n    }\n\n    @include mq($from: large) {\n      grid-template-columns: repeat(3, minmax(0, 1fr));\n    }\n  }\n\n  &--layout-teasers &__cards {\n    @include spaceCurve(\"row-gap\", \"medium\");\n\n    @include mq($from: small) {\n      grid-template-columns: repeat(2, minmax(0, 1fr));\n    }\n\n    @include mq($from: medium) {\n      grid-template-columns: repeat(3, minmax(0, 1fr));\n    }\n\n    @include mq($from: large) {\n      grid-template-columns: repeat(4, minmax(0, 1fr));\n    }\n  }\n\n  &--layout-teasers#{&}--max-3-cols &__cards,\n  &--layout-pi-teasers#{&}--max-3-cols &__cards {\n    @include mq($from: large) {\n      grid-template-columns: repeat(3, minmax(0, 1fr));\n    }\n  }\n\n  /* Searchresults layout variant */\n\n  &--layout-searchresults &__cards {\n    gap: space(\"xlarge\");\n  }\n\n  /* Fullwidth layout variant (e.g. for MeinKonto dashboard) */\n\n  &--layout-fullwidth &__cards {\n    @include spaceCurve(\"gap\", \"regular\");\n  }\n\n  /* Pi Teasers variant */\n  &--layout-pi-teasers {\n    background-color: var(--background-color);\n    position: relative;\n    left: 50%;\n    right: 50%;\n    margin-left: calc(-50vw + var(--stzh-scrollbar-width) / 2);\n    margin-right: calc(-50vw + var(--stzh-scrollbar-width) / 2);\n    width: calc(100vw - var(--stzh-scrollbar-width));\n    max-width: calc(100vw - var(--stzh-scrollbar-width));\n\n    --slotted: var(--stzh-cardlist-pi-content, 0);\n    left: calc(50% * (1 - var(--slotted)));\n    right: calc(50% * (1 - var(--slotted)));\n\n    margin-left: calc(\n      (-50vw + var(--stzh-scrollbar-width) / 2) * (1 - var(--slotted))\n    );\n    margin-right: calc(\n      (-50vw + var(--stzh-scrollbar-width) / 2) * (1 - var(--slotted))\n    );\n\n    width: calc(\n      (100vw - var(--stzh-scrollbar-width)) * (1 - var(--slotted)) + 100% *\n        var(--slotted)\n    );\n    max-width: calc(\n      100vw - var(--stzh-scrollbar-width) * (1 - var(--slotted)) + 100% *\n        var(--slotted)\n    );\n\n    @include spaceCurve(\"padding-top\", \"big\");\n    @include spaceCurve(\"padding-bottom\", \"big\");\n  }\n\n  &--layout-pi-teasers &__header,\n  &--layout-pi-teasers &__cards {\n    @include container();\n    @include mq($from: ultra) {\n      --slotted: var(--stzh-cardlist-pi-content, 0);\n\n      --center-margin: max(0px, calc((100% - #{$containerMaxWidth}) / 2));\n\n      margin-left: calc(\n        (1 - var(--slotted)) * var(--center-margin) + var(--slotted) *\n          #{$containerMarginLarge}\n      );\n      margin-right: calc(\n        (1 - var(--slotted)) * var(--center-margin) + var(--slotted) *\n          #{$containerMarginLarge}\n      );\n    }\n  }\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Listen, Prop, State } from \"@stencil/core\";\n\nimport { StzhCardlistCollapseAllEvent } from \"../../index\";\nimport { StzhCardlistLocalizedText } from \"./stzh-cardlist.localization\";\n\n/**\n * @slot - Slot for `stzh-card` elements\n * @slot description - Slot for description\n * @slot footer - Slot for footer elements\n */\n@Component({\n  tag: \"stzh-cardlist\",\n  styleUrl: \"stzh-cardlist.scss\",\n  scoped: true,\n})\nexport class StzhCardlist {\n  /** Translation strings */\n  @Prop() localization: StzhCardlistLocalizedText;\n\n  @Prop({ reflect: true }) layout: \"fullwidth\" | \"searchresults\" | \"subpages\" | \"teasers\" | \"pi-teasers\" = \"fullwidth\";\n\n  /** Description message (use description slot as alternative) */\n  @Prop() description: string;\n\n  /** Whether collapse/expand toggle link */\n  @Prop({ reflect: true }) showToggleLink: boolean = false;\n\n  /** Whether sorting should be enabled */\n  @Prop() sortableEnabled: boolean = false;\n\n  /** HTML attribute that is used by the `toArray()` of sortable method */\n  @Prop() sortableDataIdAttribute: string = \"data-id\";\n\n  /** Force maximum 3 columns layout instead of 4 */\n  @Prop() max3Columns: boolean = false;\n\n  @Element() element: HTMLStzhCardlistElement;\n\n  /** Collapse all event */\n  @Event() stzhCollapseAll: EventEmitter<StzhCardlistCollapseAllEvent>;\n\n  @Listen(\"stzhCollapse\")\n  collapseListener() {\n    this.updateCollapsedState();\n  }\n\n  @State() allCollapsed: boolean = false;\n  @State() isStzhAnchornavVisible: boolean = false;\n\n  private collapseClick = () => {\n    const cards = Array.from(this.element.querySelectorAll(\"stzh-card\"));\n    cards.forEach(card => {\n      if (card.collapsible) {\n        card.collapsed = !this.allCollapsed;\n      }\n    });\n\n    this.allCollapsed = !this.allCollapsed;\n\n    this.stzhCollapseAll.emit({\n      component: \"stzh-cardlist\",\n      allCollapsed: this.allCollapsed,\n    });\n  };\n\n  private updateCollapsedState = () => {\n    const cards = Array.from(this.element.querySelectorAll(\"stzh-card\"));\n    this.allCollapsed = !cards.some(card => !card.collapsed);\n  };\n\n  private sortableGhostClone: Function = (dragElement: HTMLElement) => {\n    // const [clonedElement, clonedStzhElement, originalStzhElement] = cloneWrappedStzhElement(dragElement);\n\n    // if (\n    //   clonedStzhElement\n    //   && originalStzhElement\n    //   && clonedStzhElement.tagName.toLowerCase() === \"stzh-card\"\n    // ) {\n    //   const clonedStzhElementCard: HTMLStzhCardElement = clonedStzhElement as HTMLStzhCardElement;\n    //   const originalStzhElementCard: HTMLStzhCardElement = originalStzhElement as HTMLStzhCardElement;\n\n    //   // copy every property that is not reflected to its attribute\n    //   clonedStzhElementCard.heading = originalStzhElementCard.heading;\n    //   clonedStzhElementCard.subtitle = originalStzhElementCard.subtitle;\n    //   clonedStzhElementCard.headerActions = originalStzhElementCard.headerActions;\n    //   clonedStzhElementCard.footerActions = originalStzhElementCard.footerActions;\n    //   clonedStzhElementCard.hideMovementActions = originalStzhElementCard.hideMovementActions;\n    // }\n\n    // return clonedElement;\n\n    const card =\n      dragElement.tagName.toLowerCase() === \"stzh-card\" ? dragElement : dragElement.querySelector(\"stzh-card\");\n\n    if (card) {\n      const originalElement = dragElement as HTMLStzhCardElement;\n      const clonedElement = dragElement.cloneNode(true) as HTMLStzhCardElement;\n\n      // copy every property that is not reflected to its attribute\n      clonedElement.heading = originalElement.heading;\n      clonedElement.subtitle = originalElement.subtitle;\n      clonedElement.headerActions = originalElement.headerActions;\n      clonedElement.footerActions = originalElement.footerActions;\n      clonedElement.hideMovementActions = originalElement.hideMovementActions;\n\n      return clonedElement;\n    }\n  };\n\n  async componentWillLoad() {\n    this.isStzhAnchornavVisible =\n      document.documentElement.style.getPropertyValue(\"--stzh-anchornav-is-visible\") === \"1\";\n    if (!this.localization) {\n      this.localization = await window.stzhComponents.utils.fetchTranslations(this.element, \"cardlist\");\n    }\n  }\n\n  componentDidLoad() {\n    this.isStzhAnchornavVisible =\n      document.documentElement.style.getPropertyValue(\"--stzh-anchornav-is-visible\") === \"1\";\n    this.updateCollapsedState();\n  }\n\n  render() {\n    const classes = {\n      \"stzh-cardlist\": true,\n      \"stzh-cardlist--has-toggle-link\": this.showToggleLink,\n      \"stzh-cardlist--max-3-cols\": this.isStzhAnchornavVisible || this.max3Columns,\n      [`stzh-cardlist--layout-${this.layout}`]: !!this.layout,\n    };\n\n    return (\n      <Host>\n        <div class={classes}>\n          <div class=\"stzh-cardlist__header\">\n            <div class=\"stzh-cardlist__description\">\n              {this.description ? this.description : <slot name=\"description\"></slot>}\n            </div>\n            {this.showToggleLink && (\n              <stzh-link\n                class=\"stzh-cardlist__switch\"\n                icon={this.allCollapsed ? \"list-expanded\" : \"list-shrinked\"}\n                label={this.allCollapsed ? this.localization.expandAll : this.localization.collapseAll}\n                onClick={this.collapseClick}\n              ></stzh-link>\n            )}\n          </div>\n\n          <stzh-sortable\n            disabled={!this.sortableEnabled}\n            dataIdAttribute={this.sortableDataIdAttribute}\n            ghostClone={this.sortableGhostClone}\n          >\n            <div class=\"stzh-cardlist__cards\" role=\"list\">\n              <slot></slot>\n            </div>\n          </stzh-sortable>\n\n          <div class=\"stzh-cardlist__footer\">\n            <stzh-container>\n              <slot name=\"footer\"></slot>\n            </stzh-container>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-CdY_9ADR.js → p-C9VQ8n2k.js}

@@ -1,4 +1,4 @@
-import { p as proxyCustomElement, H, h, e as Host, t as transformTag } from './p-DajXzNIS.js';
+import { p as proxyCustomElement, H, h, e as Host, t as transformTag } from './p-5QD-jnDI.js';
 
 const stzhSpaceCss = () => `: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{--space:var(--stzh-space-default);--around:0;display:flex;color:inherit;font-weight:inherit;font-family:inherit;letter-spacing:inherit}:host ::slotted(*){max-width:100%;padding:calc(var(--space) / 2 * var(--around));margin:calc(var(--space) / 2 * (1 - var(--around)))}:host ::slotted(stzh-show){--show-display:block}:host ::slotted(stzh-vspace),:host ::slotted(stzh-hspace),:host ::slotted(stzh-row),:host ::slotted(stzh-container),:host ::slotted(stzh-section){align-self:stretch;flex-grow:1}:host(:empty){--around:1;width:var(--space);height:var(--space)}:host([around]:not([around=false])){--around:1}:host([border=top]),:host([border=top-bottom]){border-top:0.0625rem solid var(--stzh-base-border-color)}:host([border=bottom]),:host([border=top-bottom]){border-bottom:0.0625rem solid var(--stzh-base-border-color)}:host([border=left]),:host([border=left-right]){border-left:0.0625rem solid var(--stzh-base-border-color)}:host([border=right]),:host([border=left-right]){border-right:0.0625rem solid var(--stzh-base-border-color)}:host([curve=tiny]){--space:var(--stzh-space-xxsmall)}@media screen and (min-width: 900px){:host([curve=tiny]){--space:var(--stzh-space-xsmall)}}@media screen and (min-width: 1260px){:host([curve=tiny]){--space:var(--stzh-space-small)}}:host([curve=small]){--space:var(--stzh-space-xsmall)}@media screen and (min-width: 600px){:host([curve=small]){--space:var(--stzh-space-small)}}@media screen and (min-width: 900px){:host([curve=small]){--space:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){:host([curve=small]){--space:var(--stzh-space-xlarge)}}:host([curve=intermediary]){--space:var(--stzh-space-medium)}@media screen and (min-width: 900px){:host([curve=intermediary]){--space:var(--stzh-space-large)}}:host([curve=regular]){--space:var(--stzh-space-medium)}@media screen and (min-width: 600px){:host([curve=regular]){--space:var(--stzh-space-large)}}@media screen and (min-width: 900px){:host([curve=regular]){--space:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){:host([curve=regular]){--space:var(--stzh-space-xxlarge)}}:host([curve=medium]){--space:var(--stzh-space-large)}@media screen and (min-width: 600px){:host([curve=medium]){--space:var(--stzh-space-xlarge)}}@media screen and (min-width: 900px){:host([curve=medium]){--space:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){:host([curve=medium]){--space:var(--stzh-space-xxxlarge)}}:host([curve=large]){--space:var(--stzh-space-xxlarge)}@media screen and (min-width: 900px){:host([curve=large]){--space:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){:host([curve=large]){--space:var(--stzh-space-xxxxlarge)}}:host([curve=big]){--space:var(--stzh-space-xxlarge)}@media screen and (min-width: 600px){:host([curve=big]){--space:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 900px){:host([curve=big]){--space:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 1260px){:host([curve=big]){--space:var(--stzh-space-xbig)}}:host([curve=huge]){--space:var(--stzh-space-xxxxlarge)}@media screen and (min-width: 600px){:host([curve=huge]){--space:var(--stzh-space-big)}}@media screen and (min-width: 900px){:host([curve=huge]){--space:var(--stzh-space-big)}}@media screen and (min-width: 1260px){:host([curve=huge]){--space:var(--stzh-space-huge)}}:host([curve=section-inner]){--space:var(--stzh-space-large)}@media screen and (min-width: 600px){:host([curve=section-inner]){--space:var(--stzh-space-xlarge)}}@media screen and (min-width: 900px){:host([curve=section-inner]){--space:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){:host([curve=section-inner]){--space:var(--stzh-space-xxxlarge)}}:host([curve=background-section-inner]){--space:var(--stzh-space-xlarge)}@media screen and (min-width: 600px){:host([curve=background-section-inner]){--space:var(--stzh-space-xxlarge)}}@media screen and (min-width: 900px){:host([curve=background-section-inner]){--space:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){:host([curve=background-section-inner]){--space:var(--stzh-space-xxxxlarge)}}:host([curve=background-section-outer]){--space:var(--stzh-space-medium)}@media screen and (min-width: 600px){:host([curve=background-section-outer]){--space:var(--stzh-space-large)}}@media screen and (min-width: 900px){:host([curve=background-section-outer]){--space:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){:host([curve=background-section-outer]){--space:var(--stzh-space-xxlarge)}}:host([size=xxxsmall]){--space:var(--stzh-space-xxxsmall)}:host([size=xxsmall]){--space:var(--stzh-space-xxsmall)}:host([size=xsmall]){--space:var(--stzh-space-xsmall)}:host([size=small]){--space:var(--stzh-space-small)}:host([size=medium]){--space:var(--stzh-space-medium)}:host([size=large]){--space:var(--stzh-space-large)}:host([size=xlarge]){--space:var(--stzh-space-xlarge)}:host([size=xxlarge]){--space:var(--stzh-space-xxlarge)}:host([size=xxxlarge]){--space:var(--stzh-space-xxxlarge)}:host([size=xxxxlarge]){--space:var(--stzh-space-xxxxlarge)}:host([size=big]){--space:var(--stzh-space-big)}:host([size=xbig]){--space:var(--stzh-space-xbig)}:host([size=huge]){--space:var(--stzh-space-huge)}:host([size=xhuge]){--space:var(--stzh-space-xhuge)}:host([size=none]){--space:var(--stzh-space-none)}:host([size=default]){--space:var(--stzh-space-default)}@media screen and (min-width: 600px){:host([size-small=xxxsmall]){--space:var(--stzh-space-xxxsmall)}}@media screen and (min-width: 600px){:host([size-small=xxsmall]){--space:var(--stzh-space-xxsmall)}}@media screen and (min-width: 600px){:host([size-small=xsmall]){--space:var(--stzh-space-xsmall)}}@media screen and (min-width: 600px){:host([size-small=small]){--space:var(--stzh-space-small)}}@media screen and (min-width: 600px){:host([size-small=medium]){--space:var(--stzh-space-medium)}}@media screen and (min-width: 600px){:host([size-small=large]){--space:var(--stzh-space-large)}}@media screen and (min-width: 600px){:host([size-small=xlarge]){--space:var(--stzh-space-xlarge)}}@media screen and (min-width: 600px){:host([size-small=xxlarge]){--space:var(--stzh-space-xxlarge)}}@media screen and (min-width: 600px){:host([size-small=xxxlarge]){--space:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 600px){:host([size-small=xxxxlarge]){--space:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 600px){:host([size-small=big]){--space:var(--stzh-space-big)}}@media screen and (min-width: 600px){:host([size-small=xbig]){--space:var(--stzh-space-xbig)}}@media screen and (min-width: 600px){:host([size-small=huge]){--space:var(--stzh-space-huge)}}@media screen and (min-width: 600px){:host([size-small=xhuge]){--space:var(--stzh-space-xhuge)}}@media screen and (min-width: 600px){:host([size-small=none]){--space:var(--stzh-space-none)}}@media screen and (min-width: 600px){:host([size-small=default]){--space:var(--stzh-space-default)}}@media screen and (min-width: 900px){:host([size-medium=xxxsmall]){--space:var(--stzh-space-xxxsmall)}}@media screen and (min-width: 900px){:host([size-medium=xxsmall]){--space:var(--stzh-space-xxsmall)}}@media screen and (min-width: 900px){:host([size-medium=xsmall]){--space:var(--stzh-space-xsmall)}}@media screen and (min-width: 900px){:host([size-medium=small]){--space:var(--stzh-space-small)}}@media screen and (min-width: 900px){:host([size-medium=medium]){--space:var(--stzh-space-medium)}}@media screen and (min-width: 900px){:host([size-medium=large]){--space:var(--stzh-space-large)}}@media screen and (min-width: 900px){:host([size-medium=xlarge]){--space:var(--stzh-space-xlarge)}}@media screen and (min-width: 900px){:host([size-medium=xxlarge]){--space:var(--stzh-space-xxlarge)}}@media screen and (min-width: 900px){:host([size-medium=xxxlarge]){--space:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 900px){:host([size-medium=xxxxlarge]){--space:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 900px){:host([size-medium=big]){--space:var(--stzh-space-big)}}@media screen and (min-width: 900px){:host([size-medium=xbig]){--space:var(--stzh-space-xbig)}}@media screen and (min-width: 900px){:host([size-medium=huge]){--space:var(--stzh-space-huge)}}@media screen and (min-width: 900px){:host([size-medium=xhuge]){--space:var(--stzh-space-xhuge)}}@media screen and (min-width: 900px){:host([size-medium=none]){--space:var(--stzh-space-none)}}@media screen and (min-width: 900px){:host([size-medium=default]){--space:var(--stzh-space-default)}}@media screen and (min-width: 1260px){:host([size-large=xxxsmall]){--space:var(--stzh-space-xxxsmall)}}@media screen and (min-width: 1260px){:host([size-large=xxsmall]){--space:var(--stzh-space-xxsmall)}}@media screen and (min-width: 1260px){:host([size-large=xsmall]){--space:var(--stzh-space-xsmall)}}@media screen and (min-width: 1260px){:host([size-large=small]){--space:var(--stzh-space-small)}}@media screen and (min-width: 1260px){:host([size-large=medium]){--space:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){:host([size-large=large]){--space:var(--stzh-space-large)}}@media screen and (min-width: 1260px){:host([size-large=xlarge]){--space:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){:host([size-large=xxlarge]){--space:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){:host([size-large=xxxlarge]){--space:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){:host([size-large=xxxxlarge]){--space:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 1260px){:host([size-large=big]){--space:var(--stzh-space-big)}}@media screen and (min-width: 1260px){:host([size-large=xbig]){--space:var(--stzh-space-xbig)}}@media screen and (min-width: 1260px){:host([size-large=huge]){--space:var(--stzh-space-huge)}}@media screen and (min-width: 1260px){:host([size-large=xhuge]){--space:var(--stzh-space-xhuge)}}@media screen and (min-width: 1260px){:host([size-large=none]){--space:var(--stzh-space-none)}}@media screen and (min-width: 1260px){:host([size-large=default]){--space:var(--stzh-space-default)}}@media screen and (min-width: 1600px){:host([size-ultra=xxxsmall]){--space:var(--stzh-space-xxxsmall)}}@media screen and (min-width: 1600px){:host([size-ultra=xxsmall]){--space:var(--stzh-space-xxsmall)}}@media screen and (min-width: 1600px){:host([size-ultra=xsmall]){--space:var(--stzh-space-xsmall)}}@media screen and (min-width: 1600px){:host([size-ultra=small]){--space:var(--stzh-space-small)}}@media screen and (min-width: 1600px){:host([size-ultra=medium]){--space:var(--stzh-space-medium)}}@media screen and (min-width: 1600px){:host([size-ultra=large]){--space:var(--stzh-space-large)}}@media screen and (min-width: 1600px){:host([size-ultra=xlarge]){--space:var(--stzh-space-xlarge)}}@media screen and (min-width: 1600px){:host([size-ultra=xxlarge]){--space:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1600px){:host([size-ultra=xxxlarge]){--space:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1600px){:host([size-ultra=xxxxlarge]){--space:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 1600px){:host([size-ultra=big]){--space:var(--stzh-space-big)}}@media screen and (min-width: 1600px){:host([size-ultra=xbig]){--space:var(--stzh-space-xbig)}}@media screen and (min-width: 1600px){:host([size-ultra=huge]){--space:var(--stzh-space-huge)}}@media screen and (min-width: 1600px){:host([size-ultra=xhuge]){--space:var(--stzh-space-xhuge)}}@media screen and (min-width: 1600px){:host([size-ultra=none]){--space:var(--stzh-space-none)}}@media screen and (min-width: 1600px){:host([size-ultra=default]){--space:var(--stzh-space-default)}}.stzh-space{flex-grow:1;width:100%;height:100%;display:flex;justify-content:flex-start;align-items:flex-start;flex-wrap:wrap;padding:calc(var(--space) / -2 * var(--around));margin:calc(var(--space) / -2 * (1 - var(--around)))}.stzh-space--is-around{padding:calc(var(--space) / 2 * var(--around));margin:calc(var(--space) / 2 * (1 - var(--around)))}.stzh-space{}.stzh-space--justify-center{justify-content:center}.stzh-space--justify-end{justify-content:flex-end}.stzh-space--justify-between{justify-content:space-between}.stzh-space--justify-around{justify-content:space-around}.stzh-space--justify-evenly{justify-content:space-evenly}.stzh-space{}.stzh-space--items-end{align-items:flex-end}.stzh-space--items-center{align-items:center}.stzh-space--items-baseline{align-items:baseline}.stzh-space--items-stretch{align-items:stretch}`;
 
@@ -56,6 +56,6 @@ function defineCustomElement() {
 }
 
 export { StzhSpace as S, defineCustomElement as d };
-//# sourceMappingURL=p-CdY_9ADR.js.map
+//# sourceMappingURL=p-C9VQ8n2k.js.map
 
-//# sourceMappingURL=p-CdY_9ADR.js.map
+//# sourceMappingURL=p-C9VQ8n2k.js.map

package/dist/components/{p-CdY_9ADR.js.map → p-C9VQ8n2k.js.map}

@@ -1 +1 @@
-{"file":"p-CdY_9ADR.js","mappings":";;AAAA,MAAM,YAAY,GAAG,MAAM,CAAC,ynaAAyna,CAAC;;MCYzoa,SAAS,iBAAAA,kBAAA,CAAA,MAAA,SAAA,SAAAC,CAAA,CAAA;AALtB,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;;AAO2B,QAAA,IAAK,CAAA,KAAA,GAAiB,MAAM;;AAc5B,QAAA,IAAO,CAAA,OAAA,GAAmB,OAAO;;AAGjC,QAAA,IAAK,CAAA,KAAA,GAAiB,OAAO;;AAG7B,QAAA,IAAM,CAAA,MAAA,GAAY,KAAK;;AAGvB,QAAA,IAAM,CAAA,MAAA,GAA+E,MAAM;AAkBrH;IAhBC,MAAM,GAAA;QACJ,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAE;AACL,gBAAA,YAAY,EAAE,IAAI;gBAClB,uBAAuB,EAAE,IAAI,CAAC,MAAM;gBACpC,CAAC,CAAA,oBAAA,EAAuB,IAAI,CAAC,OAAO,CAAA,CAAE,GAAG,CAAC,CAAC,IAAI,CAAC,OAAO;gBACvD,CAAC,CAAA,kBAAA,EAAqB,IAAI,CAAC,KAAK,CAAA,CAAE,GAAG,CAAC,CAAC,IAAI,CAAC,KAAK;AAClD,aAAA,EAAA,EAED,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACT,CACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/stzh-space/stzh-space.scss?tag=stzh-space&encapsulation=shadow","src/components/stzh-space/stzh-space.tsx"],"sourcesContent":["@use \"sass:map\";\n\n:host {\n  --space: #{space()};\n  --around: 0;\n\n  display: flex;\n  color: inherit;\n  font-weight: inherit;\n  font-family: inherit;\n  letter-spacing: inherit;\n\n  ::slotted(*) {\n    // fix IE11 not wrapping text\n    max-width: 100%;\n    padding: calc((var(--space) / 2) * var(--around));\n    margin: calc((var(--space) / 2) * (1 - var(--around)));\n  }\n\n  ::slotted(stzh-show) {\n    --show-display: block;\n  }\n\n  ::slotted(stzh-vspace),\n  ::slotted(stzh-hspace),\n  ::slotted(stzh-row),\n  ::slotted(stzh-container),\n  ::slotted(stzh-section) {\n    align-self: stretch;\n    flex-grow: 1;\n  }\n}\n\n:host(:empty) {\n  --around: 1;\n\n  width: var(--space);\n  height: var(--space);\n}\n\n:host([around]:not([around=\"false\"])) {\n  --around: 1;\n}\n\n/* Border variants */\n\n:host([border=\"top\"]),\n:host([border=\"top-bottom\"]) {\n  border-top: 1px solid $baseBorderColor;\n}\n\n:host([border=\"bottom\"]),\n:host([border=\"top-bottom\"]) {\n  border-bottom: 1px solid $baseBorderColor;\n}\n\n:host([border=\"left\"]),\n:host([border=\"left-right\"]) {\n  border-left: 1px solid $baseBorderColor;\n}\n\n:host([border=\"right\"]),\n:host([border=\"left-right\"]) {\n  border-right: 1px solid $baseBorderColor;\n}\n\n/* Space curve variant */\n\n@each $spaceCurve, $value in $spaceCurves {\n  $defaultSize: map.get($value, \"size\");\n  $breakpointSizes: map.get($value, \"sizes\");\n\n  // :host([curve=\"#{$spaceCurve}\"]) > .stzh-vspace {\n  :host([curve=\"#{$spaceCurve}\"]) {\n    --space: #{space($defaultSize)};\n\n    @each $breakpoint, $size in $breakpointSizes {\n      @include mq($from: $breakpoint) {\n        --space: #{space($size)};\n      }\n    }\n  }\n}\n\n@mixin spaceProps($breakpoint: null) {\n  @each $space, $value in $spaceSizes {\n    @if $breakpoint {\n      // :host([size-#{$breakpoint}=\"#{$space}\"]) > .stzh-vspace {\n      :host([size-#{$breakpoint}=\"#{$space}\"]) {\n        @include mq($from: $breakpoint) {\n          --space: #{$value};\n        }\n      }\n    } @else {\n      // :host([size=\"#{$space}\"]) > .stzh-vspace {\n      :host([size=\"#{$space}\"]) {\n        --space: #{$value};\n      }\n    }\n  }\n}\n\n@include spaceProps();\n\n@each $breakpoint, $size in $breakpoints {\n  @include spaceProps($breakpoint);\n}\n\n.stzh-space {\n  flex-grow: 1;\n  width: 100%;\n  height: 100%;\n\n  display: flex;\n  justify-content: flex-start;\n  align-items: flex-start;\n  flex-wrap: wrap;\n  padding: calc((var(--space) / -2) * var(--around));\n  margin: calc((var(--space) / -2) * (1 - var(--around)));\n\n  &--is-around {\n    padding: calc((var(--space) / 2) * var(--around));\n    margin: calc((var(--space) / 2) * (1 - var(--around)));\n  }\n\n  /* Justify content variants */\n\n  &--justify-center {\n    justify-content: center;\n  }\n\n  &--justify-end {\n    justify-content: flex-end;\n  }\n\n  &--justify-between {\n    justify-content: space-between;\n  }\n\n  &--justify-around {\n    justify-content: space-around;\n  }\n\n  &--justify-evenly {\n    justify-content: space-evenly;\n  }\n\n  /* Align items variants */\n\n  &--items-end {\n    align-items: flex-end;\n  }\n\n  &--items-center {\n    align-items: center;\n  }\n\n  &--items-baseline {\n    align-items: baseline;\n  }\n\n  &--items-stretch {\n    align-items: stretch;\n  }\n}\n","import { Component, Host, h, Prop } from \"@stencil/core\";\n\nimport { Space, Layout } from \"../../index\";\n\n/**\n * @slot - Slot for any elements that should be vertically spaced\n */\n@Component({\n  tag: \"stzh-space\",\n  styleUrl: \"stzh-space.scss\",\n  shadow: true,\n})\nexport class StzhSpace {\n  /** Type of curve (see [Spacings docs page](/docs/tokens-spacings--docs#curves) for more info). */\n  @Prop({ reflect: true }) curve: Space.Curves = \"none\";\n\n  /** Type of size (see [Spacings docs page](/docs/tokens-spacings--docs#values) for more info). */\n  @Prop({ reflect: true }) size: Space.Sizes;\n  /** Type of size above small breakpoint (see [Spacings docs page](/docs/tokens-spacings--docs#values) for more info). */\n  @Prop({ reflect: true }) sizeSmall: Space.Sizes;\n  /** Type of size above medium breakpoint (see [Spacings docs page](/docs/tokens-spacings--docs#values) for more info). */\n  @Prop({ reflect: true }) sizeMedium: Space.Sizes;\n  /** Type of size above large breakpoint (see [Spacings docs page](/docs/tokens-spacings--docs#values) for more info). */\n  @Prop({ reflect: true }) sizeLarge: Space.Sizes;\n  /** Type of size above ultra breakpoint (see [Spacings docs page](/docs/tokens-spacings--docs#values) for more info). */\n  @Prop({ reflect: true }) sizeUltra: Space.Sizes;\n\n  /** Alignment */\n  @Prop({ reflect: true }) justify: Layout.Justify = \"start\";\n\n  /** Control how cells items are positioned along a container's cross axis */\n  @Prop({ reflect: true }) items: Layout.Items = \"start\";\n\n  /** Apply spacing to slotted elements */\n  @Prop({ reflect: true }) around: boolean = false;\n\n  /** Add border */\n  @Prop({ reflect: true }) border: \"none\" | \"top\" | \"bottom\" | \"left\" | \"right\" | \"left-right\" | \"top-bottom\" = \"none\";\n\n  render() {\n    return (\n      <Host>\n        <div\n          class={{\n            \"stzh-space\": true,\n            \"stzh-space--is-around\": this.around,\n            [`stzh-space--justify-${this.justify}`]: !!this.justify,\n            [`stzh-space--items-${this.items}`]: !!this.items,\n          }}\n        >\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-C9VQ8n2k.js","mappings":";;AAAA,MAAM,YAAY,GAAG,MAAM,CAAC,ynaAAyna,CAAC;;MCYzoa,SAAS,iBAAAA,kBAAA,CAAA,MAAA,SAAA,SAAAC,CAAA,CAAA;AALtB,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;;AAO2B,QAAA,IAAK,CAAA,KAAA,GAAiB,MAAM;;AAc5B,QAAA,IAAO,CAAA,OAAA,GAAmB,OAAO;;AAGjC,QAAA,IAAK,CAAA,KAAA,GAAiB,OAAO;;AAG7B,QAAA,IAAM,CAAA,MAAA,GAAY,KAAK;;AAGvB,QAAA,IAAM,CAAA,MAAA,GAA+E,MAAM;AAkBrH;IAhBC,MAAM,GAAA;QACJ,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAE;AACL,gBAAA,YAAY,EAAE,IAAI;gBAClB,uBAAuB,EAAE,IAAI,CAAC,MAAM;gBACpC,CAAC,CAAA,oBAAA,EAAuB,IAAI,CAAC,OAAO,CAAA,CAAE,GAAG,CAAC,CAAC,IAAI,CAAC,OAAO;gBACvD,CAAC,CAAA,kBAAA,EAAqB,IAAI,CAAC,KAAK,CAAA,CAAE,GAAG,CAAC,CAAC,IAAI,CAAC,KAAK;AAClD,aAAA,EAAA,EAED,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACT,CACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/stzh-space/stzh-space.scss?tag=stzh-space&encapsulation=shadow","src/components/stzh-space/stzh-space.tsx"],"sourcesContent":["@use \"sass:map\";\n\n:host {\n  --space: #{space()};\n  --around: 0;\n\n  display: flex;\n  color: inherit;\n  font-weight: inherit;\n  font-family: inherit;\n  letter-spacing: inherit;\n\n  ::slotted(*) {\n    // fix IE11 not wrapping text\n    max-width: 100%;\n    padding: calc((var(--space) / 2) * var(--around));\n    margin: calc((var(--space) / 2) * (1 - var(--around)));\n  }\n\n  ::slotted(stzh-show) {\n    --show-display: block;\n  }\n\n  ::slotted(stzh-vspace),\n  ::slotted(stzh-hspace),\n  ::slotted(stzh-row),\n  ::slotted(stzh-container),\n  ::slotted(stzh-section) {\n    align-self: stretch;\n    flex-grow: 1;\n  }\n}\n\n:host(:empty) {\n  --around: 1;\n\n  width: var(--space);\n  height: var(--space);\n}\n\n:host([around]:not([around=\"false\"])) {\n  --around: 1;\n}\n\n/* Border variants */\n\n:host([border=\"top\"]),\n:host([border=\"top-bottom\"]) {\n  border-top: 1px solid $baseBorderColor;\n}\n\n:host([border=\"bottom\"]),\n:host([border=\"top-bottom\"]) {\n  border-bottom: 1px solid $baseBorderColor;\n}\n\n:host([border=\"left\"]),\n:host([border=\"left-right\"]) {\n  border-left: 1px solid $baseBorderColor;\n}\n\n:host([border=\"right\"]),\n:host([border=\"left-right\"]) {\n  border-right: 1px solid $baseBorderColor;\n}\n\n/* Space curve variant */\n\n@each $spaceCurve, $value in $spaceCurves {\n  $defaultSize: map.get($value, \"size\");\n  $breakpointSizes: map.get($value, \"sizes\");\n\n  // :host([curve=\"#{$spaceCurve}\"]) > .stzh-vspace {\n  :host([curve=\"#{$spaceCurve}\"]) {\n    --space: #{space($defaultSize)};\n\n    @each $breakpoint, $size in $breakpointSizes {\n      @include mq($from: $breakpoint) {\n        --space: #{space($size)};\n      }\n    }\n  }\n}\n\n@mixin spaceProps($breakpoint: null) {\n  @each $space, $value in $spaceSizes {\n    @if $breakpoint {\n      // :host([size-#{$breakpoint}=\"#{$space}\"]) > .stzh-vspace {\n      :host([size-#{$breakpoint}=\"#{$space}\"]) {\n        @include mq($from: $breakpoint) {\n          --space: #{$value};\n        }\n      }\n    } @else {\n      // :host([size=\"#{$space}\"]) > .stzh-vspace {\n      :host([size=\"#{$space}\"]) {\n        --space: #{$value};\n      }\n    }\n  }\n}\n\n@include spaceProps();\n\n@each $breakpoint, $size in $breakpoints {\n  @include spaceProps($breakpoint);\n}\n\n.stzh-space {\n  flex-grow: 1;\n  width: 100%;\n  height: 100%;\n\n  display: flex;\n  justify-content: flex-start;\n  align-items: flex-start;\n  flex-wrap: wrap;\n  padding: calc((var(--space) / -2) * var(--around));\n  margin: calc((var(--space) / -2) * (1 - var(--around)));\n\n  &--is-around {\n    padding: calc((var(--space) / 2) * var(--around));\n    margin: calc((var(--space) / 2) * (1 - var(--around)));\n  }\n\n  /* Justify content variants */\n\n  &--justify-center {\n    justify-content: center;\n  }\n\n  &--justify-end {\n    justify-content: flex-end;\n  }\n\n  &--justify-between {\n    justify-content: space-between;\n  }\n\n  &--justify-around {\n    justify-content: space-around;\n  }\n\n  &--justify-evenly {\n    justify-content: space-evenly;\n  }\n\n  /* Align items variants */\n\n  &--items-end {\n    align-items: flex-end;\n  }\n\n  &--items-center {\n    align-items: center;\n  }\n\n  &--items-baseline {\n    align-items: baseline;\n  }\n\n  &--items-stretch {\n    align-items: stretch;\n  }\n}\n","import { Component, Host, h, Prop } from \"@stencil/core\";\n\nimport { Space, Layout } from \"../../index\";\n\n/**\n * @slot - Slot for any elements that should be vertically spaced\n */\n@Component({\n  tag: \"stzh-space\",\n  styleUrl: \"stzh-space.scss\",\n  shadow: true,\n})\nexport class StzhSpace {\n  /** Type of curve (see [Spacings docs page](/docs/tokens-spacings--docs#curves) for more info). */\n  @Prop({ reflect: true }) curve: Space.Curves = \"none\";\n\n  /** Type of size (see [Spacings docs page](/docs/tokens-spacings--docs#values) for more info). */\n  @Prop({ reflect: true }) size: Space.Sizes;\n  /** Type of size above small breakpoint (see [Spacings docs page](/docs/tokens-spacings--docs#values) for more info). */\n  @Prop({ reflect: true }) sizeSmall: Space.Sizes;\n  /** Type of size above medium breakpoint (see [Spacings docs page](/docs/tokens-spacings--docs#values) for more info). */\n  @Prop({ reflect: true }) sizeMedium: Space.Sizes;\n  /** Type of size above large breakpoint (see [Spacings docs page](/docs/tokens-spacings--docs#values) for more info). */\n  @Prop({ reflect: true }) sizeLarge: Space.Sizes;\n  /** Type of size above ultra breakpoint (see [Spacings docs page](/docs/tokens-spacings--docs#values) for more info). */\n  @Prop({ reflect: true }) sizeUltra: Space.Sizes;\n\n  /** Alignment */\n  @Prop({ reflect: true }) justify: Layout.Justify = \"start\";\n\n  /** Control how cells items are positioned along a container's cross axis */\n  @Prop({ reflect: true }) items: Layout.Items = \"start\";\n\n  /** Apply spacing to slotted elements */\n  @Prop({ reflect: true }) around: boolean = false;\n\n  /** Add border */\n  @Prop({ reflect: true }) border: \"none\" | \"top\" | \"bottom\" | \"left\" | \"right\" | \"left-right\" | \"top-bottom\" = \"none\";\n\n  render() {\n    return (\n      <Host>\n        <div\n          class={{\n            \"stzh-space\": true,\n            \"stzh-space--is-around\": this.around,\n            [`stzh-space--justify-${this.justify}`]: !!this.justify,\n            [`stzh-space--items-${this.items}`]: !!this.items,\n          }}\n        >\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-DbtxIjHJ.js → p-CB6SGGWh.js}

@@ -1,14 +1,14 @@
-import { p as proxyCustomElement, H, d as createEvent, h, F as Fragment, e as Host, t as transformTag } from './p-DajXzNIS.js';
-import { S as StzhInputDescription } from './p-nQojTf6Q.js';
+import { p as proxyCustomElement, H, d as createEvent, h, F as Fragment, e as Host, t as transformTag } from './p-5QD-jnDI.js';
+import { S as StzhInputDescription } from './p-x2lzAuxg.js';
 import { h as hasSlot } from './p-CN5apKPb.js';
-import { d as defineCustomElement$8 } from './p-BSx9yT8P.js';
-import { d as defineCustomElement$7 } from './p-C4ew4BWF.js';
-import { d as defineCustomElement$6 } from './p-UU-uJ6rm.js';
-import { d as defineCustomElement$5 } from './p-CLC2TbXk.js';
-import { d as defineCustomElement$4 } from './p-C7Wum7Zf.js';
-import { d as defineCustomElement$3 } from './p-BA-k3iZ-.js';
-import { d as defineCustomElement$2 } from './p-DvQXjdsB.js';
-import { d as defineCustomElement$1 } from './p-5iYOoBns.js';
+import { d as defineCustomElement$8 } from './p-Yktwo3G-.js';
+import { d as defineCustomElement$7 } from './p-C_jR89kU.js';
+import { d as defineCustomElement$6 } from './p-ts8WMMWF.js';
+import { d as defineCustomElement$5 } from './p-BVyHe4zB.js';
+import { d as defineCustomElement$4 } from './p-DZ_hOgVb.js';
+import { d as defineCustomElement$3 } from './p-D1qHu5Qi.js';
+import { d as defineCustomElement$2 } from './p-BNRtW-oE.js';
+import { d as defineCustomElement$1 } from './p-CqIeGIYq.js';
 
 const stzhChipselectCss = () => `.sc-stzh-chipselect-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-chipselect-h,[stzh-hidden].sc-stzh-chipselect-h{display:none}.sc-stzh-chipselect-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-chipselect-h *.sc-stzh-chipselect,.sc-stzh-chipselect-h *.sc-stzh-chipselect::before,.sc-stzh-chipselect-h *.sc-stzh-chipselect::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-chipselect-h .has-focus.sc-stzh-chipselect{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-chipselect-h .stzh-fylingfocus-focused.sc-stzh-chipselect{outline-style:none !important}.sc-stzh-chipselect-h .stzh-fylingfocus-focused.sc-stzh-chipselect::-moz-focus-inner{border:0 !important}.sc-stzh-chipselect-h{width:100%}[disabled].sc-stzh-chipselect-h:not([disabled=false]){--description-color:var(--stzh-color-grey70)}[active].sc-stzh-chipselect-h:not([active=false]){--background-color:var(
     --stzh-chip-active-background-color,
@@ -377,6 +377,6 @@ function defineCustomElement() {
 }
 
 export { StzhChipselect as S, defineCustomElement as d };
-//# sourceMappingURL=p-DbtxIjHJ.js.map
+//# sourceMappingURL=p-CB6SGGWh.js.map
 
-//# sourceMappingURL=p-DbtxIjHJ.js.map
+//# sourceMappingURL=p-CB6SGGWh.js.map

package/dist/components/{p-DbtxIjHJ.js.map → p-CB6SGGWh.js.map}

@@ -1 +1 @@
-{"file":"p-DbtxIjHJ.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/stzh-chipselect/stzh-chipselect.scss?tag=stzh-chipselect&encapsulation=scoped","src/components/stzh-chipselect/stzh-chipselect.tsx"],"sourcesContent":[":host {\n  width: 100%;\n\n  &[disabled]:not([disabled=\"false\"]) {\n    --description-color: #{$formDisabledColor};\n  }\n\n  &[active]:not([active=\"false\"]) {\n    --background-color: var(\n      --stzh-chip-active-background-color,\n      #{$colorPrimary70}\n    );\n  }\n\n  &[active].is-focused {\n    --background-color: var(\n      --stzh-chip-active-background-color,\n      #{$colorPrimary70}\n    );\n  }\n}\n\n:host([dropdown-on-mobile]) .stzh-chipselect__dropdown {\n  display: block;\n  width: 100%;\n}\n\n.stzh-chipselect {\n  @include input-description;\n  width: 100%;\n\n  &__label-wrapper {\n    display: flex;\n    align-items: center;\n    gap: space(\"xsmall\");\n    margin-bottom: space(\"xsmall\");\n    width: 100%;\n    min-width: 0;\n    min-height: 22px;\n  }\n\n  &__label {\n    @include font(\"heavy\");\n    @include fontSize(\"micro\");\n    @include truncate;\n    color: $headingColor;\n    display: block;\n    min-width: 0;\n    flex: 0 1 auto;\n    max-width: 100%;\n    margin-bottom: 0;\n\n    &:empty {\n      display: none;\n    }\n  }\n\n  &__label-wrapper > &__description-wrapper {\n    flex: 0 0 auto;\n    display: inline-flex;\n    align-items: center;\n    margin: 0;\n  }\n\n  &__label-wrapper &__error,\n  &__label-wrapper &__description-text {\n    display: none;\n  }\n\n  &__label-wrapper &__description,\n  &__label-wrapper &__description-long {\n    display: inline-flex;\n    align-items: center;\n    margin: 0;\n  }\n\n  &__label-wrapper &__description-long-button {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    padding: 0;\n    line-height: 1;\n  }\n\n  &__label-wrapper stzh-popover &__description-long-icon {\n    --size: var(--stzh-icon-size-small);\n    display: block;\n    line-height: 0;\n    color: $colorPrimary70;\n  }\n\n  &__marker {\n    @include fontSize(\"nano\");\n    margin-left: calc(-0.25em + #{space(\"xsmall\")});\n  }\n\n  &__chips {\n    display: flex;\n    align-items: center;\n    flex-wrap: wrap;\n    border-radius: $buttonBorderRadius;\n    gap: space(\"medium\");\n\n    &:focus-within {\n      .is-focused[active] {\n        --background-color: #{$colorPrimary90};\n\n        @media (forced-colors: active) {\n          --background-color: Canvas;\n        }\n      }\n    }\n  }\n\n  &__chip {\n    &.is-focused:not([active]) {\n      --background-color: #{$colorSecondary40};\n\n      @media (forced-colors: active) {\n        --background-color: Highlight;\n      }\n    }\n  }\n\n  &__dropdown {\n    display: block;\n    width: 100%;\n    --popover-width: max-content;\n    --popover-min-width: 100%;\n    --popover-max-width: calc(100vw - 2rem);\n  }\n\n  &__description-wrapper {\n    margin-top: space(\"xsmall\");\n  }\n\n  /* Hidden label */\n\n  &--has-label-hidden &__label {\n    @include visuallyhidden;\n  }\n\n  /* Disabled */\n\n  &--is-disabled &__chips,\n  &--is-disabled &__label {\n    cursor: not-allowed;\n  }\n}\n","import { Component, Host, h, Element, Prop, Watch, Event, EventEmitter, State, Fragment, Listen } from \"@stencil/core\";\n\nimport { StzhChipselectItem, StzhChipselectChangeEvent, StzhDropdownChangeEvent } from \"../../index\";\n\nimport { StzhInputDescription } from \"../stzh-input/stzh-input-description\";\nimport { StzhLocaleComponent } from \"../../index\";\nimport { hasSlot } from \"../../utils/utils\";\n\nlet chipselectCounter = 0;\n\n/**\n * @slot - Slot for `stzh-checkbox` elements\n * @slot description - Slot for description\n * @slot description-long - Slot for long description (in popover)\n * @slot description-long-title - Slot for long description title (in popover) / instead of descriptionLongTitle or description property\n * @slot error - Slot for error\n */\n@Component({\n  tag: \"stzh-chipselect\",\n  styleUrl: \"stzh-chipselect.scss\",\n  scoped: true,\n})\nexport class StzhChipselect {\n  /** Translation strings */\n  @Prop() localization: StzhLocaleComponent;\n\n  /** The list of chips */\n  @Prop() data: string | StzhChipselectItem[] = [];\n  private _data: StzhChipselectItem[] = [];\n  private _dataDropdown: any[] = [];\n\n  /** The name of the input element */\n  @Prop({ reflect: true }) name: string;\n\n  /** Label */\n  @Prop() label: string = \"\";\n\n  /** Whether label is hidden. */\n  @Prop() labelHidden: boolean = false;\n\n  /** Multiple */\n  @Prop({ mutable: true }) multiple: boolean = false;\n\n  /** Value */\n  @Prop({ mutable: true }) value: string | string[] = \"\";\n  private _value: string[] = [];\n\n  /** Default value (used by reset) */\n  @Prop({ mutable: true }) defaultValue: string | string[] = \"\";\n\n  /** Description message (use description slot as alternative) */\n  @Prop() description: string;\n\n  /** Long description message appearing in a popover (use description-long slot as alternative) */\n  @Prop() descriptionLong: string;\n\n  /**\n   * **Do not use this property. It will be deprecated with the next major release.**\n   * Long description title appearing in a popover (use description-long-title slot as or description property alternative)\n   */\n  @Prop() descriptionLongTitle: string;\n\n  /** One or multiple error message (use error slot as alternative) */\n  @Prop() error: string | string[];\n  private _error: string[];\n\n  /** Invalid status */\n  @Prop({ reflect: true }) invalid: boolean = false;\n\n  /** Required status */\n  @Prop({ reflect: true }) required: boolean = false;\n\n  /** Whether all chips are disabled or not */\n  @Prop({ reflect: true }) disabled: boolean = false;\n\n  /** Hide `(optional)` label (or use `required` inside form to hide it) */\n  @Prop({ reflect: true }) hideOptional: boolean = false;\n\n  /** Whether chips are shown as dropdown on mobile devices */\n  @Prop({ reflect: true }) dropdownOnMobile: boolean = false;\n\n  /** Id for element which describes the input (this will be overwritten if description prop or slot is used, used by stzh-radiogroup) */\n  @Prop({ attribute: \"a11y-describedby\" }) a11yDescribedby: string = \"\";\n\n  @State() activeFocusOptionIndex: number = -1;\n  @State() isMobile: boolean = false;\n\n  @Element() element: HTMLStzhChipselectElement;\n\n  /** Change event */\n  @Event() stzhChange: EventEmitter<StzhChipselectChangeEvent>;\n\n  private id: string;\n  private renderPromiseResolve: (value?: unknown) => void;\n  private mediaQuery?: MediaQueryList;\n\n  private skipNextValueRender = false;\n\n  @Listen(\"reset\", { target: \"document\" })\n  resetListener(event: Event) {\n    if ((event.target as HTMLElement).contains(this.element)) {\n      requestAnimationFrame(() => {\n        this.handleReset();\n      });\n    }\n  }\n\n  @Watch(\"value\")\n  valueWatcher(newValue: string[] | string) {\n    if (typeof newValue === \"string\") {\n      try {\n        const parsedValue = JSON.parse(newValue);\n\n        if (Array.isArray(parsedValue)) {\n          this._value = parsedValue;\n        } else {\n          this._value = [newValue];\n        }\n      } catch (ex) {\n        this._value = [newValue];\n      }\n    } else if (Array.isArray(newValue)) {\n      this._value = newValue;\n    } else {\n      this._value = [];\n    }\n  }\n\n  @Watch(\"data\")\n  dataWatcher(newValue: StzhChipselectItem[] | string) {\n    if (typeof newValue === \"string\") {\n      this._data = JSON.parse(newValue);\n    } else {\n      this._data = newValue;\n    }\n\n    this._data.map(dataEntry => {\n      if (typeof dataEntry.value !== \"string\") {\n        throw new TypeError(\n          `${dataEntry.value} is not a string. The data prop only accepts arrays (or stringified arrays), where the value property is a string. Consult the StzhChipselectItem type definition for more information.`,\n        );\n      }\n    });\n\n    this._dataDropdown = this._data.map(data => {\n      return {\n        text: data.counter ? `${data.label} (${data.counter})` : data.label,\n        value: data.value,\n      };\n    });\n  }\n\n  @Watch(\"error\")\n  errorWatcher(newValue: string | string[]) {\n    if (typeof newValue === \"string\") {\n      try {\n        this._error = JSON.parse(newValue);\n      } catch (e) {\n        if (newValue) {\n          this._error = [newValue];\n        } else {\n          this._error = [];\n        }\n      }\n    } else if (newValue) {\n      this._error = newValue;\n    } else {\n      this._error = [];\n    }\n  }\n\n  componentShouldUpdate(_newValue: any, _oldValue: any, propName: string) {\n    if (propName === \"value\" && this.useDropdownOnMobile && this.skipNextValueRender) {\n      this.skipNextValueRender = false;\n      return false;\n    }\n\n    return true;\n  }\n\n  private waitForNextRender() {\n    return new Promise(resolve => (this.renderPromiseResolve = resolve));\n  }\n\n  private handleReset = async () => {\n    this.value = this.defaultValue;\n  };\n\n  private handleMediaQueryChange = (event: MediaQueryListEvent) => {\n    this.isMobile = event.matches;\n  };\n\n  private get useDropdownOnMobile() {\n    return this.isMobile && this.dropdownOnMobile;\n  }\n\n  private handleChipClick = async (data: StzhChipselectItem, index: number) => {\n    if (this.multiple) {\n      if (data.value === \"\" && this._value.length > 0 && !(this._value.length === 1 && this._value[0] === \"\")) {\n        this.value = [];\n      } else if (data.value !== \"\") {\n        this.value = this._value.includes(data.value)\n          ? this._value.filter(value => value !== data.value)\n          : [...this._value, data.value];\n      }\n    } else {\n      this.value = data.value;\n    }\n\n    this.activeFocusOptionIndex = index;\n\n    await this.waitForNextRender();\n\n    this.stzhChange.emit({\n      component: \"stzh-chipselect\",\n      value: this.multiple ? this._value : this._value[0],\n    });\n  };\n\n  private handleDropdownChange = (event: CustomEvent<StzhDropdownChangeEvent>) => {\n    const newValue = event.detail.value;\n    const value = Array.isArray(newValue) ? String(newValue) : [String(newValue)];\n\n    this.skipNextValueRender = true;\n\n    this.value = this.multiple ? value : value.length > 0 ? value[0] : \"\";\n\n    this.stzhChange.emit({\n      component: \"stzh-chipselect\",\n      value: this.multiple ? value : value[0],\n    });\n  };\n\n  private handleKeydown = (event: KeyboardEvent) => {\n    let newActiveIndex: number = null;\n    const activeOptionIndex = this.activeFocusOptionIndex;\n\n    if (event.key === \"ArrowUp\" || event.key === \"ArrowLeft\") {\n      event.preventDefault();\n\n      if (activeOptionIndex > 0) {\n        newActiveIndex = activeOptionIndex - 1;\n      }\n    } else if (event.key === \"ArrowDown\" || event.key === \"ArrowRight\") {\n      event.preventDefault();\n\n      if (activeOptionIndex < this._data.length - 1) {\n        newActiveIndex = activeOptionIndex + 1;\n      }\n    } else if (event.key === \" \" || event.key === \"Enter\") {\n      event.preventDefault();\n\n      if (activeOptionIndex < 0) {\n        return;\n      }\n\n      if (this.multiple) {\n        if (\n          this._data[activeOptionIndex].value === \"\" &&\n          this._value.length > 0 &&\n          !(this._value.length === 1 && this._value[0] === \"\")\n        ) {\n          this.value = [];\n        } else if (this._data[activeOptionIndex].value !== \"\") {\n          this.value = this._value.includes(this._data[activeOptionIndex].value)\n            ? this._value.filter(value => value !== this._data[activeOptionIndex].value)\n            : [...this._value, this._data[activeOptionIndex].value];\n        }\n      } else {\n        this.value = this._data[activeOptionIndex].value;\n      }\n\n      this.stzhChange.emit({\n        component: \"stzh-chipselect\",\n        value: this.value,\n      });\n    }\n\n    if (newActiveIndex !== null) {\n      this.activeFocusOptionIndex = newActiveIndex;\n    }\n  };\n\n  componentDidRender() {\n    if (this.renderPromiseResolve) {\n      this.renderPromiseResolve();\n    }\n  }\n\n  async componentWillLoad() {\n    this.id = `stzh-chipselect-${chipselectCounter++}`;\n\n    this.dataWatcher(this.data);\n    this.errorWatcher(this.error);\n    this.valueWatcher(this.value);\n\n    if (this.defaultValue === undefined || this.defaultValue === null) {\n      this.defaultValue = this.value;\n    }\n\n    if (typeof window !== \"undefined\") {\n      this.mediaQuery = window.matchMedia(\"(max-width: 767px)\");\n      this.isMobile = this.mediaQuery.matches;\n    }\n\n    if (!this.localization) {\n      this.localization = await window.stzhComponents.utils.fetchTranslations(this.element, \"chipselect\");\n    }\n  }\n\n  componentDidLoad() {\n    if (this.mediaQuery) {\n      this.mediaQuery.addEventListener(\"change\", this.handleMediaQueryChange);\n    }\n  }\n\n  disconnectedCallback() {\n    if (this.mediaQuery) {\n      this.mediaQuery.removeEventListener(\"change\", this.handleMediaQueryChange);\n    }\n  }\n\n  render() {\n    const descriptionUsed = hasSlot(this.element, \"description\") || !!this.description;\n    const descriptionLongUsed = hasSlot(this.element, \"description-long\") || !!this.descriptionLong;\n    const errorUsed = hasSlot(this.element, \"error\") || this._error?.length > 0;\n\n    const labelWrapperUsed = !this.labelHidden && (!!this.label || hasSlot(this.element) || descriptionLongUsed);\n\n    const hasActive = this.activeFocusOptionIndex >= 0;\n    const activeId = hasActive ? `${this.id}-option-${this.activeFocusOptionIndex}` : undefined;\n\n    const classes = {\n      \"stzh-chipselect\": true,\n      \"stzh-chipselect--has-description\": descriptionUsed,\n      \"stzh-chipselect--has-description-long\": descriptionLongUsed,\n      \"stzh-chipselect--has-error\": errorUsed,\n      \"stzh-chipselect--is-invalid\": this.invalid || errorUsed,\n      \"stzh-chipselect--is-disabled\": this.disabled,\n      \"stzh-chipselect--is-required\": this.required,\n      \"stzh-chipselect--has-label-hidden\": this.labelHidden,\n    };\n\n    return (\n      <Host is-invalid={this.invalid || errorUsed}>\n        <div class={classes}>\n          {!this.useDropdownOnMobile &&\n            (this.multiple ? (\n              <Fragment>\n                {this._value.map(value => (\n                  <input type=\"hidden\" name={this.name} value={value} />\n                ))}\n              </Fragment>\n            ) : (\n              <input type=\"hidden\" name={this.name} value={this.value} />\n            ))}\n\n          {!this.useDropdownOnMobile && labelWrapperUsed && (\n            <div class=\"stzh-chipselect__label-wrapper\">\n              <label class=\"stzh-chipselect__label\" htmlFor={this.id}>\n                {this.label ? this.label : <slot></slot>}\n\n                {!this.hideOptional && (\n                  <span class=\"stzh-chipselect__marker\">\n                    <span class=\"stzh-chipselect__marker-symbol\" aria-hidden=\"true\">\n                      {this.required\n                        ? this.localization.$globals.requiredFieldMarker\n                        : this.localization.$globals.optionalFieldMarker}\n                    </span>\n                    <span class=\"stzh-chipselect__marker-text\">\n                      {this.required\n                        ? this.localization.$globals.requiredFieldText\n                        : this.localization.$globals.optionalFieldText}\n                    </span>\n                  </span>\n                )}\n              </label>\n\n              {descriptionLongUsed && (\n                <StzhInputDescription\n                  classPrefix=\"stzh-chipselect\"\n                  id={`${this.id}-description-long`}\n                  descriptionLong={this.descriptionLong}\n                  descriptionLongTitle={this.descriptionLongTitle}\n                  descriptionLongUsed={descriptionLongUsed}\n                  moreInfoButtonLabel={this.localization.$globals.moreInfoButtonLabel}\n                  showError={false}\n                  showDescriptionText={false}\n                />\n              )}\n            </div>\n          )}\n\n          {this._data.length > 0 && (\n            <Fragment>\n              {!this.useDropdownOnMobile ? (\n                <Fragment>\n                  <div\n                    id={this.id}\n                    class=\"stzh-chipselect__chips\"\n                    role=\"listbox\"\n                    tabindex=\"0\"\n                    aria-multiselectable={this.multiple ? \"true\" : \"false\"}\n                    aria-activedescendant={activeId}\n                    aria-describedby={`${this.id}-description ${this.a11yDescribedby}`}\n                    onKeyDown={this.handleKeydown}\n                  >\n                    {this._data.map((data, index) => (\n                      <stzh-chip\n                        role=\"option\"\n                        class={{\n                          \"stzh-chipselect__chip\": true,\n                          \"is-focused\": this.activeFocusOptionIndex === index,\n                        }}\n                        label={data.label}\n                        counter={data.counter}\n                        icon={data.icon}\n                        variant={data.variant || \"filter\"}\n                        inverted={data.inverted}\n                        size={data.size || \"small\"}\n                        disabled={this.disabled || data.disabled}\n                        active={\n                          this._value.includes(data.value) ||\n                          (!this.multiple && !data.value && (this._value.length === 0 || this._value[0] === \"\")) ||\n                          (!data.value &&\n                            this.multiple &&\n                            (this._value.length === 0 || (this._value.length === 1 && this._value[0] === \"\")))\n                        }\n                        aria-selected={\n                          this._value.includes(data.value) ||\n                          (!this.multiple && !data.value && (this._value.length === 0 || this._value[0] === \"\")) ||\n                          (!data.value &&\n                            this.multiple &&\n                            (this._value.length === 0 || (this._value.length === 1 && this._value[0] === \"\")))\n                            ? \"true\"\n                            : \"false\"\n                        }\n                        id={`${this.id}-option-${index}`}\n                        a11yTabindex=\"-1\"\n                        onClick={() => this.handleChipClick(data, index)}\n                      ></stzh-chip>\n                    ))}\n                  </div>\n                </Fragment>\n              ) : (\n                <stzh-dropdown\n                  class=\"stzh-chipselect__dropdown\"\n                  name={this.name}\n                  multiple={this.multiple}\n                  disabled={this.disabled}\n                  error={this._error}\n                  description={this.description}\n                  descriptionLong={this.descriptionLong}\n                  descriptionLongTitle={this.descriptionLongTitle}\n                  required={this.required}\n                  invalid={this.invalid}\n                  items={this.multiple ? this._value : this._value.length > 0 ? [this._value[0]] : []}\n                  label={this.label}\n                  labelHidden={this.labelHidden}\n                  options={this._dataDropdown}\n                  hideOptional={this.hideOptional}\n                  onStzhChange={this.handleDropdownChange}\n                ></stzh-dropdown>\n              )}\n            </Fragment>\n          )}\n          {!this.useDropdownOnMobile && (errorUsed || descriptionUsed) && (\n            <StzhInputDescription\n              classPrefix=\"stzh-chipselect\"\n              id={`${this.id}-description`}\n              error={this._error}\n              description={this.description}\n              descriptionLongUsed={false}\n            />\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-CB6SGGWh.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/stzh-chipselect/stzh-chipselect.scss?tag=stzh-chipselect&encapsulation=scoped","src/components/stzh-chipselect/stzh-chipselect.tsx"],"sourcesContent":[":host {\n  width: 100%;\n\n  &[disabled]:not([disabled=\"false\"]) {\n    --description-color: #{$formDisabledColor};\n  }\n\n  &[active]:not([active=\"false\"]) {\n    --background-color: var(\n      --stzh-chip-active-background-color,\n      #{$colorPrimary70}\n    );\n  }\n\n  &[active].is-focused {\n    --background-color: var(\n      --stzh-chip-active-background-color,\n      #{$colorPrimary70}\n    );\n  }\n}\n\n:host([dropdown-on-mobile]) .stzh-chipselect__dropdown {\n  display: block;\n  width: 100%;\n}\n\n.stzh-chipselect {\n  @include input-description;\n  width: 100%;\n\n  &__label-wrapper {\n    display: flex;\n    align-items: center;\n    gap: space(\"xsmall\");\n    margin-bottom: space(\"xsmall\");\n    width: 100%;\n    min-width: 0;\n    min-height: 22px;\n  }\n\n  &__label {\n    @include font(\"heavy\");\n    @include fontSize(\"micro\");\n    @include truncate;\n    color: $headingColor;\n    display: block;\n    min-width: 0;\n    flex: 0 1 auto;\n    max-width: 100%;\n    margin-bottom: 0;\n\n    &:empty {\n      display: none;\n    }\n  }\n\n  &__label-wrapper > &__description-wrapper {\n    flex: 0 0 auto;\n    display: inline-flex;\n    align-items: center;\n    margin: 0;\n  }\n\n  &__label-wrapper &__error,\n  &__label-wrapper &__description-text {\n    display: none;\n  }\n\n  &__label-wrapper &__description,\n  &__label-wrapper &__description-long {\n    display: inline-flex;\n    align-items: center;\n    margin: 0;\n  }\n\n  &__label-wrapper &__description-long-button {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    padding: 0;\n    line-height: 1;\n  }\n\n  &__label-wrapper stzh-popover &__description-long-icon {\n    --size: var(--stzh-icon-size-small);\n    display: block;\n    line-height: 0;\n    color: $colorPrimary70;\n  }\n\n  &__marker {\n    @include fontSize(\"nano\");\n    margin-left: calc(-0.25em + #{space(\"xsmall\")});\n  }\n\n  &__chips {\n    display: flex;\n    align-items: center;\n    flex-wrap: wrap;\n    border-radius: $buttonBorderRadius;\n    gap: space(\"medium\");\n\n    &:focus-within {\n      .is-focused[active] {\n        --background-color: #{$colorPrimary90};\n\n        @media (forced-colors: active) {\n          --background-color: Canvas;\n        }\n      }\n    }\n  }\n\n  &__chip {\n    &.is-focused:not([active]) {\n      --background-color: #{$colorSecondary40};\n\n      @media (forced-colors: active) {\n        --background-color: Highlight;\n      }\n    }\n  }\n\n  &__dropdown {\n    display: block;\n    width: 100%;\n    --popover-width: max-content;\n    --popover-min-width: 100%;\n    --popover-max-width: calc(100vw - 2rem);\n  }\n\n  &__description-wrapper {\n    margin-top: space(\"xsmall\");\n  }\n\n  /* Hidden label */\n\n  &--has-label-hidden &__label {\n    @include visuallyhidden;\n  }\n\n  /* Disabled */\n\n  &--is-disabled &__chips,\n  &--is-disabled &__label {\n    cursor: not-allowed;\n  }\n}\n","import { Component, Host, h, Element, Prop, Watch, Event, EventEmitter, State, Fragment, Listen } from \"@stencil/core\";\n\nimport { StzhChipselectItem, StzhChipselectChangeEvent, StzhDropdownChangeEvent } from \"../../index\";\n\nimport { StzhInputDescription } from \"../stzh-input/stzh-input-description\";\nimport { StzhLocaleComponent } from \"../../index\";\nimport { hasSlot } from \"../../utils/utils\";\n\nlet chipselectCounter = 0;\n\n/**\n * @slot - Slot for `stzh-checkbox` elements\n * @slot description - Slot for description\n * @slot description-long - Slot for long description (in popover)\n * @slot description-long-title - Slot for long description title (in popover) / instead of descriptionLongTitle or description property\n * @slot error - Slot for error\n */\n@Component({\n  tag: \"stzh-chipselect\",\n  styleUrl: \"stzh-chipselect.scss\",\n  scoped: true,\n})\nexport class StzhChipselect {\n  /** Translation strings */\n  @Prop() localization: StzhLocaleComponent;\n\n  /** The list of chips */\n  @Prop() data: string | StzhChipselectItem[] = [];\n  private _data: StzhChipselectItem[] = [];\n  private _dataDropdown: any[] = [];\n\n  /** The name of the input element */\n  @Prop({ reflect: true }) name: string;\n\n  /** Label */\n  @Prop() label: string = \"\";\n\n  /** Whether label is hidden. */\n  @Prop() labelHidden: boolean = false;\n\n  /** Multiple */\n  @Prop({ mutable: true }) multiple: boolean = false;\n\n  /** Value */\n  @Prop({ mutable: true }) value: string | string[] = \"\";\n  private _value: string[] = [];\n\n  /** Default value (used by reset) */\n  @Prop({ mutable: true }) defaultValue: string | string[] = \"\";\n\n  /** Description message (use description slot as alternative) */\n  @Prop() description: string;\n\n  /** Long description message appearing in a popover (use description-long slot as alternative) */\n  @Prop() descriptionLong: string;\n\n  /**\n   * **Do not use this property. It will be deprecated with the next major release.**\n   * Long description title appearing in a popover (use description-long-title slot as or description property alternative)\n   */\n  @Prop() descriptionLongTitle: string;\n\n  /** One or multiple error message (use error slot as alternative) */\n  @Prop() error: string | string[];\n  private _error: string[];\n\n  /** Invalid status */\n  @Prop({ reflect: true }) invalid: boolean = false;\n\n  /** Required status */\n  @Prop({ reflect: true }) required: boolean = false;\n\n  /** Whether all chips are disabled or not */\n  @Prop({ reflect: true }) disabled: boolean = false;\n\n  /** Hide `(optional)` label (or use `required` inside form to hide it) */\n  @Prop({ reflect: true }) hideOptional: boolean = false;\n\n  /** Whether chips are shown as dropdown on mobile devices */\n  @Prop({ reflect: true }) dropdownOnMobile: boolean = false;\n\n  /** Id for element which describes the input (this will be overwritten if description prop or slot is used, used by stzh-radiogroup) */\n  @Prop({ attribute: \"a11y-describedby\" }) a11yDescribedby: string = \"\";\n\n  @State() activeFocusOptionIndex: number = -1;\n  @State() isMobile: boolean = false;\n\n  @Element() element: HTMLStzhChipselectElement;\n\n  /** Change event */\n  @Event() stzhChange: EventEmitter<StzhChipselectChangeEvent>;\n\n  private id: string;\n  private renderPromiseResolve: (value?: unknown) => void;\n  private mediaQuery?: MediaQueryList;\n\n  private skipNextValueRender = false;\n\n  @Listen(\"reset\", { target: \"document\" })\n  resetListener(event: Event) {\n    if ((event.target as HTMLElement).contains(this.element)) {\n      requestAnimationFrame(() => {\n        this.handleReset();\n      });\n    }\n  }\n\n  @Watch(\"value\")\n  valueWatcher(newValue: string[] | string) {\n    if (typeof newValue === \"string\") {\n      try {\n        const parsedValue = JSON.parse(newValue);\n\n        if (Array.isArray(parsedValue)) {\n          this._value = parsedValue;\n        } else {\n          this._value = [newValue];\n        }\n      } catch (ex) {\n        this._value = [newValue];\n      }\n    } else if (Array.isArray(newValue)) {\n      this._value = newValue;\n    } else {\n      this._value = [];\n    }\n  }\n\n  @Watch(\"data\")\n  dataWatcher(newValue: StzhChipselectItem[] | string) {\n    if (typeof newValue === \"string\") {\n      this._data = JSON.parse(newValue);\n    } else {\n      this._data = newValue;\n    }\n\n    this._data.map(dataEntry => {\n      if (typeof dataEntry.value !== \"string\") {\n        throw new TypeError(\n          `${dataEntry.value} is not a string. The data prop only accepts arrays (or stringified arrays), where the value property is a string. Consult the StzhChipselectItem type definition for more information.`,\n        );\n      }\n    });\n\n    this._dataDropdown = this._data.map(data => {\n      return {\n        text: data.counter ? `${data.label} (${data.counter})` : data.label,\n        value: data.value,\n      };\n    });\n  }\n\n  @Watch(\"error\")\n  errorWatcher(newValue: string | string[]) {\n    if (typeof newValue === \"string\") {\n      try {\n        this._error = JSON.parse(newValue);\n      } catch (e) {\n        if (newValue) {\n          this._error = [newValue];\n        } else {\n          this._error = [];\n        }\n      }\n    } else if (newValue) {\n      this._error = newValue;\n    } else {\n      this._error = [];\n    }\n  }\n\n  componentShouldUpdate(_newValue: any, _oldValue: any, propName: string) {\n    if (propName === \"value\" && this.useDropdownOnMobile && this.skipNextValueRender) {\n      this.skipNextValueRender = false;\n      return false;\n    }\n\n    return true;\n  }\n\n  private waitForNextRender() {\n    return new Promise(resolve => (this.renderPromiseResolve = resolve));\n  }\n\n  private handleReset = async () => {\n    this.value = this.defaultValue;\n  };\n\n  private handleMediaQueryChange = (event: MediaQueryListEvent) => {\n    this.isMobile = event.matches;\n  };\n\n  private get useDropdownOnMobile() {\n    return this.isMobile && this.dropdownOnMobile;\n  }\n\n  private handleChipClick = async (data: StzhChipselectItem, index: number) => {\n    if (this.multiple) {\n      if (data.value === \"\" && this._value.length > 0 && !(this._value.length === 1 && this._value[0] === \"\")) {\n        this.value = [];\n      } else if (data.value !== \"\") {\n        this.value = this._value.includes(data.value)\n          ? this._value.filter(value => value !== data.value)\n          : [...this._value, data.value];\n      }\n    } else {\n      this.value = data.value;\n    }\n\n    this.activeFocusOptionIndex = index;\n\n    await this.waitForNextRender();\n\n    this.stzhChange.emit({\n      component: \"stzh-chipselect\",\n      value: this.multiple ? this._value : this._value[0],\n    });\n  };\n\n  private handleDropdownChange = (event: CustomEvent<StzhDropdownChangeEvent>) => {\n    const newValue = event.detail.value;\n    const value = Array.isArray(newValue) ? String(newValue) : [String(newValue)];\n\n    this.skipNextValueRender = true;\n\n    this.value = this.multiple ? value : value.length > 0 ? value[0] : \"\";\n\n    this.stzhChange.emit({\n      component: \"stzh-chipselect\",\n      value: this.multiple ? value : value[0],\n    });\n  };\n\n  private handleKeydown = (event: KeyboardEvent) => {\n    let newActiveIndex: number = null;\n    const activeOptionIndex = this.activeFocusOptionIndex;\n\n    if (event.key === \"ArrowUp\" || event.key === \"ArrowLeft\") {\n      event.preventDefault();\n\n      if (activeOptionIndex > 0) {\n        newActiveIndex = activeOptionIndex - 1;\n      }\n    } else if (event.key === \"ArrowDown\" || event.key === \"ArrowRight\") {\n      event.preventDefault();\n\n      if (activeOptionIndex < this._data.length - 1) {\n        newActiveIndex = activeOptionIndex + 1;\n      }\n    } else if (event.key === \" \" || event.key === \"Enter\") {\n      event.preventDefault();\n\n      if (activeOptionIndex < 0) {\n        return;\n      }\n\n      if (this.multiple) {\n        if (\n          this._data[activeOptionIndex].value === \"\" &&\n          this._value.length > 0 &&\n          !(this._value.length === 1 && this._value[0] === \"\")\n        ) {\n          this.value = [];\n        } else if (this._data[activeOptionIndex].value !== \"\") {\n          this.value = this._value.includes(this._data[activeOptionIndex].value)\n            ? this._value.filter(value => value !== this._data[activeOptionIndex].value)\n            : [...this._value, this._data[activeOptionIndex].value];\n        }\n      } else {\n        this.value = this._data[activeOptionIndex].value;\n      }\n\n      this.stzhChange.emit({\n        component: \"stzh-chipselect\",\n        value: this.value,\n      });\n    }\n\n    if (newActiveIndex !== null) {\n      this.activeFocusOptionIndex = newActiveIndex;\n    }\n  };\n\n  componentDidRender() {\n    if (this.renderPromiseResolve) {\n      this.renderPromiseResolve();\n    }\n  }\n\n  async componentWillLoad() {\n    this.id = `stzh-chipselect-${chipselectCounter++}`;\n\n    this.dataWatcher(this.data);\n    this.errorWatcher(this.error);\n    this.valueWatcher(this.value);\n\n    if (this.defaultValue === undefined || this.defaultValue === null) {\n      this.defaultValue = this.value;\n    }\n\n    if (typeof window !== \"undefined\") {\n      this.mediaQuery = window.matchMedia(\"(max-width: 767px)\");\n      this.isMobile = this.mediaQuery.matches;\n    }\n\n    if (!this.localization) {\n      this.localization = await window.stzhComponents.utils.fetchTranslations(this.element, \"chipselect\");\n    }\n  }\n\n  componentDidLoad() {\n    if (this.mediaQuery) {\n      this.mediaQuery.addEventListener(\"change\", this.handleMediaQueryChange);\n    }\n  }\n\n  disconnectedCallback() {\n    if (this.mediaQuery) {\n      this.mediaQuery.removeEventListener(\"change\", this.handleMediaQueryChange);\n    }\n  }\n\n  render() {\n    const descriptionUsed = hasSlot(this.element, \"description\") || !!this.description;\n    const descriptionLongUsed = hasSlot(this.element, \"description-long\") || !!this.descriptionLong;\n    const errorUsed = hasSlot(this.element, \"error\") || this._error?.length > 0;\n\n    const labelWrapperUsed = !this.labelHidden && (!!this.label || hasSlot(this.element) || descriptionLongUsed);\n\n    const hasActive = this.activeFocusOptionIndex >= 0;\n    const activeId = hasActive ? `${this.id}-option-${this.activeFocusOptionIndex}` : undefined;\n\n    const classes = {\n      \"stzh-chipselect\": true,\n      \"stzh-chipselect--has-description\": descriptionUsed,\n      \"stzh-chipselect--has-description-long\": descriptionLongUsed,\n      \"stzh-chipselect--has-error\": errorUsed,\n      \"stzh-chipselect--is-invalid\": this.invalid || errorUsed,\n      \"stzh-chipselect--is-disabled\": this.disabled,\n      \"stzh-chipselect--is-required\": this.required,\n      \"stzh-chipselect--has-label-hidden\": this.labelHidden,\n    };\n\n    return (\n      <Host is-invalid={this.invalid || errorUsed}>\n        <div class={classes}>\n          {!this.useDropdownOnMobile &&\n            (this.multiple ? (\n              <Fragment>\n                {this._value.map(value => (\n                  <input type=\"hidden\" name={this.name} value={value} />\n                ))}\n              </Fragment>\n            ) : (\n              <input type=\"hidden\" name={this.name} value={this.value} />\n            ))}\n\n          {!this.useDropdownOnMobile && labelWrapperUsed && (\n            <div class=\"stzh-chipselect__label-wrapper\">\n              <label class=\"stzh-chipselect__label\" htmlFor={this.id}>\n                {this.label ? this.label : <slot></slot>}\n\n                {!this.hideOptional && (\n                  <span class=\"stzh-chipselect__marker\">\n                    <span class=\"stzh-chipselect__marker-symbol\" aria-hidden=\"true\">\n                      {this.required\n                        ? this.localization.$globals.requiredFieldMarker\n                        : this.localization.$globals.optionalFieldMarker}\n                    </span>\n                    <span class=\"stzh-chipselect__marker-text\">\n                      {this.required\n                        ? this.localization.$globals.requiredFieldText\n                        : this.localization.$globals.optionalFieldText}\n                    </span>\n                  </span>\n                )}\n              </label>\n\n              {descriptionLongUsed && (\n                <StzhInputDescription\n                  classPrefix=\"stzh-chipselect\"\n                  id={`${this.id}-description-long`}\n                  descriptionLong={this.descriptionLong}\n                  descriptionLongTitle={this.descriptionLongTitle}\n                  descriptionLongUsed={descriptionLongUsed}\n                  moreInfoButtonLabel={this.localization.$globals.moreInfoButtonLabel}\n                  showError={false}\n                  showDescriptionText={false}\n                />\n              )}\n            </div>\n          )}\n\n          {this._data.length > 0 && (\n            <Fragment>\n              {!this.useDropdownOnMobile ? (\n                <Fragment>\n                  <div\n                    id={this.id}\n                    class=\"stzh-chipselect__chips\"\n                    role=\"listbox\"\n                    tabindex=\"0\"\n                    aria-multiselectable={this.multiple ? \"true\" : \"false\"}\n                    aria-activedescendant={activeId}\n                    aria-describedby={`${this.id}-description ${this.a11yDescribedby}`}\n                    onKeyDown={this.handleKeydown}\n                  >\n                    {this._data.map((data, index) => (\n                      <stzh-chip\n                        role=\"option\"\n                        class={{\n                          \"stzh-chipselect__chip\": true,\n                          \"is-focused\": this.activeFocusOptionIndex === index,\n                        }}\n                        label={data.label}\n                        counter={data.counter}\n                        icon={data.icon}\n                        variant={data.variant || \"filter\"}\n                        inverted={data.inverted}\n                        size={data.size || \"small\"}\n                        disabled={this.disabled || data.disabled}\n                        active={\n                          this._value.includes(data.value) ||\n                          (!this.multiple && !data.value && (this._value.length === 0 || this._value[0] === \"\")) ||\n                          (!data.value &&\n                            this.multiple &&\n                            (this._value.length === 0 || (this._value.length === 1 && this._value[0] === \"\")))\n                        }\n                        aria-selected={\n                          this._value.includes(data.value) ||\n                          (!this.multiple && !data.value && (this._value.length === 0 || this._value[0] === \"\")) ||\n                          (!data.value &&\n                            this.multiple &&\n                            (this._value.length === 0 || (this._value.length === 1 && this._value[0] === \"\")))\n                            ? \"true\"\n                            : \"false\"\n                        }\n                        id={`${this.id}-option-${index}`}\n                        a11yTabindex=\"-1\"\n                        onClick={() => this.handleChipClick(data, index)}\n                      ></stzh-chip>\n                    ))}\n                  </div>\n                </Fragment>\n              ) : (\n                <stzh-dropdown\n                  class=\"stzh-chipselect__dropdown\"\n                  name={this.name}\n                  multiple={this.multiple}\n                  disabled={this.disabled}\n                  error={this._error}\n                  description={this.description}\n                  descriptionLong={this.descriptionLong}\n                  descriptionLongTitle={this.descriptionLongTitle}\n                  required={this.required}\n                  invalid={this.invalid}\n                  items={this.multiple ? this._value : this._value.length > 0 ? [this._value[0]] : []}\n                  label={this.label}\n                  labelHidden={this.labelHidden}\n                  options={this._dataDropdown}\n                  hideOptional={this.hideOptional}\n                  onStzhChange={this.handleDropdownChange}\n                ></stzh-dropdown>\n              )}\n            </Fragment>\n          )}\n          {!this.useDropdownOnMobile && (errorUsed || descriptionUsed) && (\n            <StzhInputDescription\n              classPrefix=\"stzh-chipselect\"\n              id={`${this.id}-description`}\n              error={this._error}\n              description={this.description}\n              descriptionLongUsed={false}\n            />\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-zoQGoMI3.js → p-CC0Gv1-E.js}

@@ -1,4 +1,4 @@
-import { p as proxyCustomElement, H, h, e as Host, t as transformTag } from './p-DajXzNIS.js';
+import { p as proxyCustomElement, H, h, e as Host, t as transformTag } from './p-5QD-jnDI.js';
 
 const stzhButtongroupCss = () => `.sc-stzh-buttongroup-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-buttongroup-h,[stzh-hidden].sc-stzh-buttongroup-h{display:none}.sc-stzh-buttongroup-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-buttongroup-h *.sc-stzh-buttongroup,.sc-stzh-buttongroup-h *.sc-stzh-buttongroup::before,.sc-stzh-buttongroup-h *.sc-stzh-buttongroup::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-buttongroup-h .has-focus.sc-stzh-buttongroup{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-buttongroup-h .stzh-fylingfocus-focused.sc-stzh-buttongroup{outline-style:none !important}.sc-stzh-buttongroup-h .stzh-fylingfocus-focused.sc-stzh-buttongroup::-moz-focus-inner{border:0 !important}[fullwidth].sc-stzh-buttongroup-h .stzh-buttongroup.sc-stzh-buttongroup{width:100%;flex-wrap:wrap}.stzh-buttongroup.sc-stzh-buttongroup{position:relative;z-index:auto;display:flex;gap:var(--stzh-space-xsmall)}`;
 
@@ -144,6 +144,6 @@ function defineCustomElement() {
 }
 
 export { StzhButtongroup as S, defineCustomElement as d };
-//# sourceMappingURL=p-zoQGoMI3.js.map
+//# sourceMappingURL=p-CC0Gv1-E.js.map
 
-//# sourceMappingURL=p-zoQGoMI3.js.map
+//# sourceMappingURL=p-CC0Gv1-E.js.map

package/dist/components/{p-zoQGoMI3.js.map → p-CC0Gv1-E.js.map}

@@ -1 +1 @@
-{"file":"p-zoQGoMI3.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/stzh-buttongroup/stzh-buttongroup.scss?tag=stzh-buttongroup&encapsulation=scoped","src/components/stzh-buttongroup/stzh-buttongroup.tsx"],"sourcesContent":[":host {\n  // ::slotted(stzh-button) {\n  //   z-index: 1;\n  //   margin-right: -1px;\n\n  //   &[a11y-disabled]:not([a11y-disabled=\"false\"]) {\n  //     z-index: 0;\n  //   }\n\n  //   &:first-child {\n  //     --border-radius: #{$buttonBorderRadius 0px 0px $buttonBorderRadius};\n  //     // --border-width: 1px 0px 1px 1px;\n  //   }\n\n  //   &:last-child {\n  //     --border-radius: #{0px $buttonBorderRadius $buttonBorderRadius 0px};\n  //     // --border-width: 1px 1px 1px 0px;\n  //     margin-right: 0;\n  //   }\n\n  //   // only one button\n  //   &:first-child:last-child {\n  //     // --border-width: 1px;\n  //     --border-radius: #{$buttonBorderRadius};\n  //     margin: 0;\n  //   }\n\n  //   // when only two buttons\n  //   &:first-child + stzh-button:last-child {\n  //     // --border-width: 1px;\n  //   }\n\n  //   // buttons in the middle\n  //   &:not(:first-child):not(:last-child) {\n  //     --border-radius: 0px;\n  //   }\n  // }\n}\n\n:host([fullwidth]) .stzh-buttongroup {\n  width: 100%;\n  flex-wrap: wrap;\n}\n\n.stzh-buttongroup {\n  position: relative;\n  z-index: auto;\n  display: flex;\n  gap: space(\"xsmall\");\n}\n","import { Component, Host, h, Prop, Watch, Element } from \"@stencil/core\";\n\nimport { StzhButtonSize } from \"../../index\";\n\n/**\n * @slot - Slot for buttons\n */\n@Component({\n  tag: \"stzh-buttongroup\",\n  styleUrl: \"stzh-buttongroup.scss\",\n  scoped: true,\n})\nexport class StzhButtongroup {\n  @Element() element: HTMLStzhButtongroupElement;\n\n  /** Size variant (above all breakpoints) only valid for buttons without own size property */\n  @Prop({ reflect: true }) size: StzhButtonSize = \"default\";\n  @Prop({ reflect: true }) sizeSmall?: StzhButtonSize;\n  @Prop({ reflect: true }) sizeMedium?: StzhButtonSize;\n  @Prop({ reflect: true }) sizeLarge?: StzhButtonSize;\n  @Prop({ reflect: true }) sizeUltra?: StzhButtonSize;\n\n  /** Whether buttongroup is full width */\n  @Prop({ reflect: true }) fullwidth?: boolean;\n\n  /** Whether buttongroup is rounded */\n  @Prop({ reflect: true }) rounded?: boolean;\n\n  // \"size-small\" -> \"sizeSmall\"\n  private toPropName(attrName: string): string {\n    return attrName.replace(/-([a-z])/g, (_, c) => c.toUpperCase());\n  }\n\n  // If button has its own size property, do not override this property\n  private buttonHasOwnSize(btn: Element, attrName: string): boolean {\n    const attrVal = btn.getAttribute(attrName);\n    const propVal = (btn as any)[this.toPropName(attrName)] as StzhButtonSize | undefined;\n\n    const attrOwn = attrVal !== null && attrVal !== \"default\";\n    const propOwn = propVal !== undefined && propVal !== \"default\";\n    return attrOwn || propOwn;\n  }\n\n  private applyDefaultIfMissing(btn: Element, attrName: string, groupVal?: StzhButtonSize) {\n    if (groupVal === undefined) return;\n    // If button has own size property, do not override this property\n    if (this.buttonHasOwnSize(btn, attrName)) return;\n\n    // Otherwise set default size attribute (works directly, also before hydration)\n    if (btn.getAttribute(attrName) !== groupVal) {\n      btn.setAttribute(attrName, groupVal);\n    }\n  }\n\n  private applyFullwidthIfMissing(btn: Element, groupVal?: boolean) {\n    if (groupVal !== true) return;\n\n    const hasAttr = btn.hasAttribute(\"fullwidth\");\n    const propVal = (btn as any).fullwidth as boolean | undefined;\n\n    // Exists property fullwidth buttons overrides buttongroup property fullwidth\n    // Property fullwidth === true (button has fullwidth)\n    const attrOwn = hasAttr;\n    const propOwn = propVal === true;\n\n    // If button has own fullwidth property, do not override this property\n    if (attrOwn || propOwn) return;\n\n    // Otherwise set default fullwidth attribute\n    btn.setAttribute(\"fullwidth\", \"\");\n  }\n\n  private applyRoundedIfMissing(btn: Element, groupVal?: boolean) {\n    // Rounded only true if group has rounded property true\n    if (groupVal !== true) return;\n\n    const hasAttr = btn.hasAttribute(\"rounded\");\n    const propVal = (btn as any).rounded as boolean | undefined;\n\n    // Check if property rounded exists on button and if it is true or false\n    // If property is true button property rounded ovverided buttonsgroups property rounded\n    const attrOwn = hasAttr;\n    const propOwn = propVal === true;\n\n    // Button > Buttongroup\n    if (attrOwn || propOwn) return;\n\n    // Otherwise set default rounded attribute\n    btn.setAttribute(\"rounded\", \"\");\n  }\n\n  async componentDidLoad() {\n    // Propagate, if button is defined\n    await customElements.whenDefined(\"stzh-button\");\n    this.propagateSizes();\n    requestAnimationFrame(() => this.propagateSizes());\n  }\n\n  @Watch(\"size\")\n  @Watch(\"sizeSmall\")\n  @Watch(\"sizeMedium\")\n  @Watch(\"sizeLarge\")\n  @Watch(\"sizeUltra\")\n  onSizeChange() {\n    this.propagateSizes();\n  }\n\n  @Watch(\"fullwidth\")\n  onFullwidthChange() {\n    this.propagateSizes();\n  }\n\n  @Watch(\"rounded\")\n  onRoundedChange() {\n    this.propagateSizes();\n  }\n\n  private propagateSizes() {\n    const buttons = this.element.querySelectorAll(\"stzh-button\");\n    buttons.forEach(btn => {\n      this.applyDefaultIfMissing(btn, \"size\", this.size);\n      this.applyDefaultIfMissing(btn, \"size-small\", this.sizeSmall);\n      this.applyDefaultIfMissing(btn, \"size-medium\", this.sizeMedium);\n      this.applyDefaultIfMissing(btn, \"size-large\", this.sizeLarge);\n      this.applyDefaultIfMissing(btn, \"size-ultra\", this.sizeUltra);\n\n      this.applyRoundedIfMissing(btn, this.rounded);\n      this.applyFullwidthIfMissing(btn, this.fullwidth);\n    });\n  }\n\n  private onSlotChange = () => {\n    this.propagateSizes();\n  };\n\n  render() {\n    const classes = {\n      \"stzh-buttongroup\": true,\n    };\n\n    return (\n      <Host>\n        <div class={classes}>\n          <slot onSlotchange={this.onSlotChange}></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-CC0Gv1-E.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/stzh-buttongroup/stzh-buttongroup.scss?tag=stzh-buttongroup&encapsulation=scoped","src/components/stzh-buttongroup/stzh-buttongroup.tsx"],"sourcesContent":[":host {\n  // ::slotted(stzh-button) {\n  //   z-index: 1;\n  //   margin-right: -1px;\n\n  //   &[a11y-disabled]:not([a11y-disabled=\"false\"]) {\n  //     z-index: 0;\n  //   }\n\n  //   &:first-child {\n  //     --border-radius: #{$buttonBorderRadius 0px 0px $buttonBorderRadius};\n  //     // --border-width: 1px 0px 1px 1px;\n  //   }\n\n  //   &:last-child {\n  //     --border-radius: #{0px $buttonBorderRadius $buttonBorderRadius 0px};\n  //     // --border-width: 1px 1px 1px 0px;\n  //     margin-right: 0;\n  //   }\n\n  //   // only one button\n  //   &:first-child:last-child {\n  //     // --border-width: 1px;\n  //     --border-radius: #{$buttonBorderRadius};\n  //     margin: 0;\n  //   }\n\n  //   // when only two buttons\n  //   &:first-child + stzh-button:last-child {\n  //     // --border-width: 1px;\n  //   }\n\n  //   // buttons in the middle\n  //   &:not(:first-child):not(:last-child) {\n  //     --border-radius: 0px;\n  //   }\n  // }\n}\n\n:host([fullwidth]) .stzh-buttongroup {\n  width: 100%;\n  flex-wrap: wrap;\n}\n\n.stzh-buttongroup {\n  position: relative;\n  z-index: auto;\n  display: flex;\n  gap: space(\"xsmall\");\n}\n","import { Component, Host, h, Prop, Watch, Element } from \"@stencil/core\";\n\nimport { StzhButtonSize } from \"../../index\";\n\n/**\n * @slot - Slot for buttons\n */\n@Component({\n  tag: \"stzh-buttongroup\",\n  styleUrl: \"stzh-buttongroup.scss\",\n  scoped: true,\n})\nexport class StzhButtongroup {\n  @Element() element: HTMLStzhButtongroupElement;\n\n  /** Size variant (above all breakpoints) only valid for buttons without own size property */\n  @Prop({ reflect: true }) size: StzhButtonSize = \"default\";\n  @Prop({ reflect: true }) sizeSmall?: StzhButtonSize;\n  @Prop({ reflect: true }) sizeMedium?: StzhButtonSize;\n  @Prop({ reflect: true }) sizeLarge?: StzhButtonSize;\n  @Prop({ reflect: true }) sizeUltra?: StzhButtonSize;\n\n  /** Whether buttongroup is full width */\n  @Prop({ reflect: true }) fullwidth?: boolean;\n\n  /** Whether buttongroup is rounded */\n  @Prop({ reflect: true }) rounded?: boolean;\n\n  // \"size-small\" -> \"sizeSmall\"\n  private toPropName(attrName: string): string {\n    return attrName.replace(/-([a-z])/g, (_, c) => c.toUpperCase());\n  }\n\n  // If button has its own size property, do not override this property\n  private buttonHasOwnSize(btn: Element, attrName: string): boolean {\n    const attrVal = btn.getAttribute(attrName);\n    const propVal = (btn as any)[this.toPropName(attrName)] as StzhButtonSize | undefined;\n\n    const attrOwn = attrVal !== null && attrVal !== \"default\";\n    const propOwn = propVal !== undefined && propVal !== \"default\";\n    return attrOwn || propOwn;\n  }\n\n  private applyDefaultIfMissing(btn: Element, attrName: string, groupVal?: StzhButtonSize) {\n    if (groupVal === undefined) return;\n    // If button has own size property, do not override this property\n    if (this.buttonHasOwnSize(btn, attrName)) return;\n\n    // Otherwise set default size attribute (works directly, also before hydration)\n    if (btn.getAttribute(attrName) !== groupVal) {\n      btn.setAttribute(attrName, groupVal);\n    }\n  }\n\n  private applyFullwidthIfMissing(btn: Element, groupVal?: boolean) {\n    if (groupVal !== true) return;\n\n    const hasAttr = btn.hasAttribute(\"fullwidth\");\n    const propVal = (btn as any).fullwidth as boolean | undefined;\n\n    // Exists property fullwidth buttons overrides buttongroup property fullwidth\n    // Property fullwidth === true (button has fullwidth)\n    const attrOwn = hasAttr;\n    const propOwn = propVal === true;\n\n    // If button has own fullwidth property, do not override this property\n    if (attrOwn || propOwn) return;\n\n    // Otherwise set default fullwidth attribute\n    btn.setAttribute(\"fullwidth\", \"\");\n  }\n\n  private applyRoundedIfMissing(btn: Element, groupVal?: boolean) {\n    // Rounded only true if group has rounded property true\n    if (groupVal !== true) return;\n\n    const hasAttr = btn.hasAttribute(\"rounded\");\n    const propVal = (btn as any).rounded as boolean | undefined;\n\n    // Check if property rounded exists on button and if it is true or false\n    // If property is true button property rounded ovverided buttonsgroups property rounded\n    const attrOwn = hasAttr;\n    const propOwn = propVal === true;\n\n    // Button > Buttongroup\n    if (attrOwn || propOwn) return;\n\n    // Otherwise set default rounded attribute\n    btn.setAttribute(\"rounded\", \"\");\n  }\n\n  async componentDidLoad() {\n    // Propagate, if button is defined\n    await customElements.whenDefined(\"stzh-button\");\n    this.propagateSizes();\n    requestAnimationFrame(() => this.propagateSizes());\n  }\n\n  @Watch(\"size\")\n  @Watch(\"sizeSmall\")\n  @Watch(\"sizeMedium\")\n  @Watch(\"sizeLarge\")\n  @Watch(\"sizeUltra\")\n  onSizeChange() {\n    this.propagateSizes();\n  }\n\n  @Watch(\"fullwidth\")\n  onFullwidthChange() {\n    this.propagateSizes();\n  }\n\n  @Watch(\"rounded\")\n  onRoundedChange() {\n    this.propagateSizes();\n  }\n\n  private propagateSizes() {\n    const buttons = this.element.querySelectorAll(\"stzh-button\");\n    buttons.forEach(btn => {\n      this.applyDefaultIfMissing(btn, \"size\", this.size);\n      this.applyDefaultIfMissing(btn, \"size-small\", this.sizeSmall);\n      this.applyDefaultIfMissing(btn, \"size-medium\", this.sizeMedium);\n      this.applyDefaultIfMissing(btn, \"size-large\", this.sizeLarge);\n      this.applyDefaultIfMissing(btn, \"size-ultra\", this.sizeUltra);\n\n      this.applyRoundedIfMissing(btn, this.rounded);\n      this.applyFullwidthIfMissing(btn, this.fullwidth);\n    });\n  }\n\n  private onSlotChange = () => {\n    this.propagateSizes();\n  };\n\n  render() {\n    const classes = {\n      \"stzh-buttongroup\": true,\n    };\n\n    return (\n      <Host>\n        <div class={classes}>\n          <slot onSlotchange={this.onSlotChange}></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-BphPIp_9.js → p-CFzhqAe_.js}

@@ -1,7 +1,7 @@
-import { p as proxyCustomElement, H, d as createEvent, h, e as Host, t as transformTag } from './p-DajXzNIS.js';
-import { d as defineCustomElement$3 } from './p-BSx9yT8P.js';
-import { d as defineCustomElement$2 } from './p-C7Wum7Zf.js';
-import { d as defineCustomElement$1 } from './p-BA-k3iZ-.js';
+import { p as proxyCustomElement, H, d as createEvent, h, e as Host, t as transformTag } from './p-5QD-jnDI.js';
+import { d as defineCustomElement$3 } from './p-Yktwo3G-.js';
+import { d as defineCustomElement$2 } from './p-DZ_hOgVb.js';
+import { d as defineCustomElement$1 } from './p-D1qHu5Qi.js';
 
 const stzhAppNavCss = () => `: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}.stzh-app-nav{background-color:var(--stzh-color-coolgrey10)}@media screen and (max-width: 899px){.stzh-app-nav{height:var(--stzh-app-nav-height)}}.stzh-app-nav__links{display:flex;flex-direction:row;justify-content:space-between;padding:var(--stzh-space-medium) var(--stzh-space-large) var(--stzh-space-xlarge)}@media screen and (min-width: 900px){.stzh-app-nav__links{padding:0;align-items:center}}.stzh-app-nav__link,.stzh-app-nav .stzh-app-nav__link a{--text-decoration-line:none;--hover-text-decoration-line:none;color:var(--stzh-color-coolgrey90)}@media screen and (min-width: 900px){.stzh-app-nav__link,.stzh-app-nav .stzh-app-nav__link a{margin-right:var(--stzh-space-xlarge)}}.stzh-app-nav__link:last-child,.stzh-app-nav .stzh-app-nav__link a:last-child{margin-right:0}.stzh-app-nav__link:hover,.stzh-app-nav .stzh-app-nav__link a:hover{color:var(--stzh-color-primary60)}.stzh-app-nav .stzh-app-nav__link a.stzh-link--is-active,.stzh-app-nav .stzh-app-nav__link.stzh-link--is-active{text-decoration:none;color:var(--stzh-color-primary70)}@media screen and (min-width: 900px){.stzh-app-nav .stzh-app-nav__link a.stzh-link--is-active,.stzh-app-nav .stzh-app-nav__link.stzh-link--is-active{font-family:var(--stzh-font-family-heavy);font-weight:var(--stzh-font-weight-heavy);font-style:var(--stzh-font-style-heavy)}}.stzh-app-nav .stzh-link__inner{flex-direction:column}@media screen and (min-width: 900px){.stzh-app-nav .stzh-link__inner{flex-direction:row}}.stzh-app-nav .stzh-link__text{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);font-size:var(--stzh-font-pico-font-size);line-height:var(--stzh-font-pico-text-line-height)}@media screen and (min-width: 900px){.stzh-app-nav .stzh-link__text{font-size:var(--stzh-font-milli-font-size);line-height:var(--stzh-font-milli-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing);font-weight:var(--stzh-font-weight-medium)}}.stzh-app-nav .stzh-link__icon-wrapper.sc-stzh-link:not(:empty)+.stzh-link__text.sc-stzh-link:not(:empty),.stzh-app-nav .stzh-link__text.sc-stzh-link:not(:empty)+.stzh-link__icon-wrapper.sc-stzh-link:not(:empty){margin-top:var(--stzh-space-xxsmall);margin-left:0}@media screen and (min-width: 900px){.stzh-app-nav .stzh-link__icon-wrapper.sc-stzh-link:not(:empty)+.stzh-link__text.sc-stzh-link:not(:empty),.stzh-app-nav .stzh-link__text.sc-stzh-link:not(:empty)+.stzh-link__icon-wrapper.sc-stzh-link:not(:empty){margin-left:var(--stzh-space-xsmall);margin-top:0}}`;
 
@@ -72,6 +72,6 @@ function defineCustomElement() {
 }
 
 export { StzhAppNav as S, defineCustomElement as d };
-//# sourceMappingURL=p-BphPIp_9.js.map
+//# sourceMappingURL=p-CFzhqAe_.js.map
 
-//# sourceMappingURL=p-BphPIp_9.js.map
+//# sourceMappingURL=p-CFzhqAe_.js.map

package/dist/components/{p-BphPIp_9.js.map → p-CFzhqAe_.js.map}

@@ -1 +1 @@
-{"file":"p-BphPIp_9.js","mappings":";;;;;AAAA,MAAM,aAAa,GAAG,MAAM,CAAC,q4GAAq4G,CAAC;;MCUt5G,UAAU,iBAAAA,kBAAA,CAAA,MAAA,UAAA,SAAAC,CAAA,CAAA;AAJvB,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;;AASU,QAAA,IAAK,CAAA,KAAA,GAAqB,EAAE;QAgB5B,IAAA,CAAA,qBAAqB,GAAG,CAAC,KAAiB,EAAE,IAAoB,KAAI;AAC1E,YAAA,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC;AAC5B,gBAAA,SAAS,EAAE,cAAc;gBACzB,IAAI;AACJ,gBAAA,aAAa,EAAE,KAAK;AACrB,aAAA,CAAC;AACJ,SAAC;AAwCF;AApDC,IAAA,MAAM,iBAAiB,GAAA;AACrB,QAAA,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE;AACtB,YAAA,IAAI,CAAC,YAAY,GAAG,MAAM,MAAM,CAAC,cAAc,CAAC,KAAK,CAAC,iBAAiB,CAAC,IAAI,CAAC,OAAO,EAAE,QAAQ,CAAC;;;IAYnG,MAAM,GAAA;AACJ,QAAA,MAAM,OAAO,GAAG;AACd,YAAA,cAAc,EAAE,IAAI;SACrB;AAED,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CACE,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,YAAY,EACjB,KAAK,EAAE,OAAO,EAAA,YAAA,EACF,IAAI,CAAC,YAAY,CAAC,KAAK,EACnC,EAAE,EAAE,IAAI,CAAC,QAAQ,IAAI,IAAI,EACzB,QAAQ,EAAC,IAAI,EAAA,EAEb,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,qBAAqB,EAAC,IAAI,EAAC,MAAM,EACzC,EAAA,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,KAClB,CAAA,CAAA,WAAA,EAAA,EACE,KAAK,EAAC,oBAAoB,EAC1B,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,IAAI,EAAC,UAAU,EACD,cAAA,EAAA,IAAI,CAAC,WAAW,EAC9B,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,IAAI,EAAE,IAAI,CAAC,IAAI,EACN,SAAA,EAAA,IAAI,CAAC,EAAE,EAChB,OAAO,EAAE,CAAC,CAAa,KAAI;AACzB,gBAAA,IAAI,CAAC,qBAAqB,CAAC,CAAC,EAAE,IAAI,CAAC;AACrC,aAAC,EAAA,EAEA,IAAI,CAAC,IAAI,CACA,CACb,CAAC,CACE,CACF,CACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/stzh-app-nav/stzh-app-nav.scss?tag=stzh-app-nav","src/components/stzh-app-nav/stzh-app-nav.tsx"],"sourcesContent":[".stzh-app-nav {\n  background-color: var(--stzh-color-coolgrey10);\n\n  @include mq($to: medium) {\n    height: var(--stzh-app-nav-height);\n  }\n\n  &__links {\n    display: flex;\n    flex-direction: row;\n    justify-content: space-between;\n    padding: space(\"medium\") space(\"large\") space(\"xlarge\");\n\n    @include mq($from: medium) {\n      padding: 0;\n      align-items: center;\n    }\n  }\n\n  &__link,\n  .stzh-app-nav__link a {\n    --text-decoration-line: none;\n    --hover-text-decoration-line: none;\n    color: var(--stzh-color-coolgrey90);\n\n    @include mq($from: medium) {\n      margin-right: space(\"xlarge\");\n    }\n\n    &:last-child {\n      margin-right: 0;\n    }\n\n    &:hover {\n      color: var(--stzh-color-primary60);\n    }\n  }\n\n  .stzh-app-nav__link a.stzh-link--is-active,\n  .stzh-app-nav__link.stzh-link--is-active {\n    text-decoration: none;\n    color: var(--stzh-color-primary70);\n\n    @include mq($from: medium) {\n      @include font(\"heavy\");\n    }\n  }\n\n  .stzh-link__inner {\n    flex-direction: column;\n\n    @include mq($from: medium) {\n      flex-direction: row;\n    }\n  }\n\n  .stzh-link__text {\n    @include font(\"medium\");\n    @include fontSize(\"pico\");\n\n    @include mq($from: medium) {\n      @include fontSize(\"milli\");\n      font-weight: var(--stzh-font-weight-medium);\n    }\n  }\n\n  .stzh-link__icon-wrapper.sc-stzh-link:not(:empty)\n    + .stzh-link__text.sc-stzh-link:not(:empty),\n  .stzh-link__text.sc-stzh-link:not(:empty)\n    + .stzh-link__icon-wrapper.sc-stzh-link:not(:empty) {\n    margin-top: space(\"xxsmall\");\n    margin-left: 0;\n\n    @include mq($from: medium) {\n      margin-left: space(\"xsmall\");\n      margin-top: 0;\n    }\n  }\n}\n","import { Component, Prop, h, Host, Element, Event, EventEmitter } from \"@stencil/core\";\n\nimport { StzhAppNavLocalizedText } from \"./stzh-app-nav.localization\";\n\nimport { StzhAppNavItem, StzhAppNavItemClickEvent } from \"../../index\";\n\n@Component({\n  tag: \"stzh-app-nav\",\n  styleUrl: \"stzh-app-nav.scss\",\n})\nexport class StzhAppNav {\n  /** Translation strings */\n  @Prop() localization: StzhAppNavLocalizedText;\n\n  /** AppNav menu items */\n  @Prop() items: StzhAppNavItem[] = [];\n\n  /** AppNav element ID */\n  @Prop() appNavId: string;\n\n  @Element() element: HTMLStzhAppNavElement;\n\n  /** AppNav item click event */\n  @Event() stzhAppNavItemClick: EventEmitter<StzhAppNavItemClickEvent>;\n\n  async componentWillLoad() {\n    if (!this.localization) {\n      this.localization = await window.stzhComponents.utils.fetchTranslations(this.element, \"appnav\");\n    }\n  }\n\n  private handleAppNavItemClick = (event: MouseEvent, item: StzhAppNavItem) => {\n    this.stzhAppNavItemClick.emit({\n      component: \"stzh-app-nav\",\n      item,\n      originalEvent: event,\n    });\n  };\n\n  render() {\n    const classes = {\n      \"stzh-app-nav\": true,\n    };\n\n    return (\n      <Host>\n        <nav\n          role=\"navigation\"\n          class={classes}\n          aria-label={this.localization.title}\n          id={this.appNavId || null}\n          tabindex=\"-1\"\n        >\n          <div class=\"stzh-app-nav__links\" role=\"list\">\n            {this.items.map(item => (\n              <stzh-link\n                class=\"stzh-app-nav__link\"\n                active={item.active}\n                role=\"listitem\"\n                a11y-current={item.a11yCurrent}\n                href={item.href}\n                badge={item.badge}\n                badgeType={item.badgeType}\n                icon={item.icon}\n                link-id={item.id}\n                onClick={(e: MouseEvent) => {\n                  this.handleAppNavItemClick(e, item);\n                }}\n              >\n                {item.text}\n              </stzh-link>\n            ))}\n          </div>\n        </nav>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-CFzhqAe_.js","mappings":";;;;;AAAA,MAAM,aAAa,GAAG,MAAM,CAAC,q4GAAq4G,CAAC;;MCUt5G,UAAU,iBAAAA,kBAAA,CAAA,MAAA,UAAA,SAAAC,CAAA,CAAA;AAJvB,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;;AASU,QAAA,IAAK,CAAA,KAAA,GAAqB,EAAE;QAgB5B,IAAA,CAAA,qBAAqB,GAAG,CAAC,KAAiB,EAAE,IAAoB,KAAI;AAC1E,YAAA,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC;AAC5B,gBAAA,SAAS,EAAE,cAAc;gBACzB,IAAI;AACJ,gBAAA,aAAa,EAAE,KAAK;AACrB,aAAA,CAAC;AACJ,SAAC;AAwCF;AApDC,IAAA,MAAM,iBAAiB,GAAA;AACrB,QAAA,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE;AACtB,YAAA,IAAI,CAAC,YAAY,GAAG,MAAM,MAAM,CAAC,cAAc,CAAC,KAAK,CAAC,iBAAiB,CAAC,IAAI,CAAC,OAAO,EAAE,QAAQ,CAAC;;;IAYnG,MAAM,GAAA;AACJ,QAAA,MAAM,OAAO,GAAG;AACd,YAAA,cAAc,EAAE,IAAI;SACrB;AAED,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CACE,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,YAAY,EACjB,KAAK,EAAE,OAAO,EAAA,YAAA,EACF,IAAI,CAAC,YAAY,CAAC,KAAK,EACnC,EAAE,EAAE,IAAI,CAAC,QAAQ,IAAI,IAAI,EACzB,QAAQ,EAAC,IAAI,EAAA,EAEb,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,qBAAqB,EAAC,IAAI,EAAC,MAAM,EACzC,EAAA,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,KAClB,CAAA,CAAA,WAAA,EAAA,EACE,KAAK,EAAC,oBAAoB,EAC1B,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,IAAI,EAAC,UAAU,EACD,cAAA,EAAA,IAAI,CAAC,WAAW,EAC9B,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,IAAI,EAAE,IAAI,CAAC,IAAI,EACN,SAAA,EAAA,IAAI,CAAC,EAAE,EAChB,OAAO,EAAE,CAAC,CAAa,KAAI;AACzB,gBAAA,IAAI,CAAC,qBAAqB,CAAC,CAAC,EAAE,IAAI,CAAC;AACrC,aAAC,EAAA,EAEA,IAAI,CAAC,IAAI,CACA,CACb,CAAC,CACE,CACF,CACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/stzh-app-nav/stzh-app-nav.scss?tag=stzh-app-nav","src/components/stzh-app-nav/stzh-app-nav.tsx"],"sourcesContent":[".stzh-app-nav {\n  background-color: var(--stzh-color-coolgrey10);\n\n  @include mq($to: medium) {\n    height: var(--stzh-app-nav-height);\n  }\n\n  &__links {\n    display: flex;\n    flex-direction: row;\n    justify-content: space-between;\n    padding: space(\"medium\") space(\"large\") space(\"xlarge\");\n\n    @include mq($from: medium) {\n      padding: 0;\n      align-items: center;\n    }\n  }\n\n  &__link,\n  .stzh-app-nav__link a {\n    --text-decoration-line: none;\n    --hover-text-decoration-line: none;\n    color: var(--stzh-color-coolgrey90);\n\n    @include mq($from: medium) {\n      margin-right: space(\"xlarge\");\n    }\n\n    &:last-child {\n      margin-right: 0;\n    }\n\n    &:hover {\n      color: var(--stzh-color-primary60);\n    }\n  }\n\n  .stzh-app-nav__link a.stzh-link--is-active,\n  .stzh-app-nav__link.stzh-link--is-active {\n    text-decoration: none;\n    color: var(--stzh-color-primary70);\n\n    @include mq($from: medium) {\n      @include font(\"heavy\");\n    }\n  }\n\n  .stzh-link__inner {\n    flex-direction: column;\n\n    @include mq($from: medium) {\n      flex-direction: row;\n    }\n  }\n\n  .stzh-link__text {\n    @include font(\"medium\");\n    @include fontSize(\"pico\");\n\n    @include mq($from: medium) {\n      @include fontSize(\"milli\");\n      font-weight: var(--stzh-font-weight-medium);\n    }\n  }\n\n  .stzh-link__icon-wrapper.sc-stzh-link:not(:empty)\n    + .stzh-link__text.sc-stzh-link:not(:empty),\n  .stzh-link__text.sc-stzh-link:not(:empty)\n    + .stzh-link__icon-wrapper.sc-stzh-link:not(:empty) {\n    margin-top: space(\"xxsmall\");\n    margin-left: 0;\n\n    @include mq($from: medium) {\n      margin-left: space(\"xsmall\");\n      margin-top: 0;\n    }\n  }\n}\n","import { Component, Prop, h, Host, Element, Event, EventEmitter } from \"@stencil/core\";\n\nimport { StzhAppNavLocalizedText } from \"./stzh-app-nav.localization\";\n\nimport { StzhAppNavItem, StzhAppNavItemClickEvent } from \"../../index\";\n\n@Component({\n  tag: \"stzh-app-nav\",\n  styleUrl: \"stzh-app-nav.scss\",\n})\nexport class StzhAppNav {\n  /** Translation strings */\n  @Prop() localization: StzhAppNavLocalizedText;\n\n  /** AppNav menu items */\n  @Prop() items: StzhAppNavItem[] = [];\n\n  /** AppNav element ID */\n  @Prop() appNavId: string;\n\n  @Element() element: HTMLStzhAppNavElement;\n\n  /** AppNav item click event */\n  @Event() stzhAppNavItemClick: EventEmitter<StzhAppNavItemClickEvent>;\n\n  async componentWillLoad() {\n    if (!this.localization) {\n      this.localization = await window.stzhComponents.utils.fetchTranslations(this.element, \"appnav\");\n    }\n  }\n\n  private handleAppNavItemClick = (event: MouseEvent, item: StzhAppNavItem) => {\n    this.stzhAppNavItemClick.emit({\n      component: \"stzh-app-nav\",\n      item,\n      originalEvent: event,\n    });\n  };\n\n  render() {\n    const classes = {\n      \"stzh-app-nav\": true,\n    };\n\n    return (\n      <Host>\n        <nav\n          role=\"navigation\"\n          class={classes}\n          aria-label={this.localization.title}\n          id={this.appNavId || null}\n          tabindex=\"-1\"\n        >\n          <div class=\"stzh-app-nav__links\" role=\"list\">\n            {this.items.map(item => (\n              <stzh-link\n                class=\"stzh-app-nav__link\"\n                active={item.active}\n                role=\"listitem\"\n                a11y-current={item.a11yCurrent}\n                href={item.href}\n                badge={item.badge}\n                badgeType={item.badgeType}\n                icon={item.icon}\n                link-id={item.id}\n                onClick={(e: MouseEvent) => {\n                  this.handleAppNavItemClick(e, item);\n                }}\n              >\n                {item.text}\n              </stzh-link>\n            ))}\n          </div>\n        </nav>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-C9g8C0mi.js → p-CHL7PZWx.js}

@@ -1,5 +1,5 @@
-import { p as proxyCustomElement, H, d as createEvent, h, F as Fragment, e as Host, t as transformTag } from './p-DajXzNIS.js';
-import { d as defineCustomElement$1 } from './p-C7Wum7Zf.js';
+import { p as proxyCustomElement, H, d as createEvent, h, F as Fragment, e as Host, t as transformTag } from './p-5QD-jnDI.js';
+import { d as defineCustomElement$1 } from './p-DZ_hOgVb.js';
 
 const stzhBreadcrumbCss = () => `.sc-stzh-breadcrumb-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-breadcrumb-h,[stzh-hidden].sc-stzh-breadcrumb-h{display:none}.sc-stzh-breadcrumb-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-breadcrumb-h *.sc-stzh-breadcrumb,.sc-stzh-breadcrumb-h *.sc-stzh-breadcrumb::before,.sc-stzh-breadcrumb-h *.sc-stzh-breadcrumb::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-breadcrumb-h .has-focus.sc-stzh-breadcrumb{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-breadcrumb-h .stzh-fylingfocus-focused.sc-stzh-breadcrumb{outline-style:none !important}.sc-stzh-breadcrumb-h .stzh-fylingfocus-focused.sc-stzh-breadcrumb::-moz-focus-inner{border:0 !important}.sc-stzh-breadcrumb-h{overflow:hidden;--color:var(--stzh-breadcrumb-color, var(--stzh-color-primary70))}@media print{.sc-stzh-breadcrumb-h{display:none}}[variant=teaser].sc-stzh-breadcrumb-h{--color:var(--stzh-color-grey80)}.stzh-breadcrumb.sc-stzh-breadcrumb{font-size:var(--stzh-font-milli-font-size);line-height:var(--stzh-font-milli-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing);color:var(--color)}.stzh-breadcrumb__list.sc-stzh-breadcrumb,.stzh-breadcrumb__item.sc-stzh-breadcrumb,.stzh-breadcrumb__item-link.sc-stzh-breadcrumb{display:flex;align-items:center}.stzh-breadcrumb__list.sc-stzh-breadcrumb{list-style:none;margin:0;padding:0;white-space:nowrap}.stzh-breadcrumb__item.is-expand.sc-stzh-breadcrumb .stzh-breadcrumb__item-link.sc-stzh-breadcrumb{cursor:pointer}.stzh-breadcrumb__item.is-hidden.sc-stzh-breadcrumb{display:none}.stzh-breadcrumb__item.is-last.sc-stzh-breadcrumb .stzh-breadcrumb__item-link.sc-stzh-breadcrumb{font-family:var(--stzh-font-family-heavy);font-weight:var(--stzh-font-weight-heavy);font-style:var(--stzh-font-style-heavy)}.stzh-breadcrumb__item.is-first.sc-stzh-breadcrumb .stzh-breadcrumb__item-label.sc-stzh-breadcrumb{border:0;clip:rect(0 0 0 0);clip-path:inset(100%);width:0.0625rem;height:0.0625rem;overflow:hidden;padding:0;position:absolute}.stzh-breadcrumb__item-link.sc-stzh-breadcrumb{appearance:none;background-color:transparent;border:none;text-decoration:none;color:inherit}.stzh-breadcrumb__item-link.is-link.sc-stzh-breadcrumb{cursor:pointer;transition:color var(--stzh-base-transition-animation-speed)}.stzh-breadcrumb__item-link.is-link.sc-stzh-breadcrumb:hover{color:var(--stzh-color-primary90)}.stzh-breadcrumb__item-icon.sc-stzh-breadcrumb{margin-right:var(--stzh-space-xxsmall)}.stzh-breadcrumb__item-icon.is-separator.sc-stzh-breadcrumb{--size:var(--stzh-icon-size-small)}@media (forced-colors: active){.stzh-breadcrumb__item-icon.is-separator.sc-stzh-breadcrumb{color:CanvasText}}.stzh-breadcrumb__item-label-hidden.sc-stzh-breadcrumb{border:0;clip:rect(0 0 0 0);clip-path:inset(100%);width:0.0625rem;height:0.0625rem;overflow:hidden;padding:0;position:absolute}.stzh-breadcrumb--is-expanded.sc-stzh-breadcrumb .stzh-breadcrumb__list.sc-stzh-breadcrumb{flex-wrap:wrap;white-space:initial}.stzh-breadcrumb--is-expanded.sc-stzh-breadcrumb .is-expand.sc-stzh-breadcrumb{position:absolute}.stzh-breadcrumb--teaser.sc-stzh-breadcrumb{font-size:var(--stzh-font-micro-font-size);line-height:var(--stzh-font-micro-text-line-height)}`;
 
@@ -202,6 +202,6 @@ function defineCustomElement() {
 }
 
 export { StzhBreadcrumb as S, defineCustomElement as d };
-//# sourceMappingURL=p-C9g8C0mi.js.map
+//# sourceMappingURL=p-CHL7PZWx.js.map
 
-//# sourceMappingURL=p-C9g8C0mi.js.map
+//# sourceMappingURL=p-CHL7PZWx.js.map