@oiz/stzh-components 4.12.2 → 4.13.0-beta1

package/dist/components/stzh-card-navigation.js.map

@@ -1 +1 @@
-{"file":"stzh-card-navigation.js","mappings":"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","names":["StzhCardNavigation","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/stzh-card-navigation/stzh-card-navigation.scss?tag=stzh-card-navigation&encapsulation=scoped","src/components/stzh-card-navigation/stzh-card-navigation.tsx"],"sourcesContent":[":host {\n  display: flex;\n  flex-direction: column;\n}\n\n.stzh-card-navigation {\n  position: relative;\n  flex-grow: 1;\n  display: flex;\n  gap: space(\"small\");\n  background-color: $colorGrey10;\n\n  &:hover {\n    background-color: var(--stzh-color-secondary10);\n  }\n\n  &:hover &__arrow-icon {\n    transform: translateX(4px);\n  }\n\n  &__wrapper {\n    @include spaceCurve(\"padding-left\", \"regular\");\n    display: flex;\n    align-items: center;\n    flex-grow: 1;\n    // safe space padding top/bottom when it would go to three lines\n    padding-top: var(--stzh-space-xsmall);\n    padding-bottom: var(--stzh-space-xsmall);\n  }\n\n  &__title {\n    @include font(\"heavy\");\n    @include fontCurve(\"teaser\");\n    @include wordWrap;\n    color: $colorPrimary70;\n    margin: 0;\n  }\n\n  &__title-link {\n    display: block;\n    font-family: inherit;\n    font-size: inherit;\n    padding: 0;\n    appearance: none;\n    background-color: transparent;\n    border: none;\n    color: $colorPrimary;\n    text-decoration-line: none;\n    transition: color $baseTransitionAnimationSpeed;\n    border-radius: $buttonBorderRadius;\n    cursor: pointer;\n\n    &::after {\n      content: \"\";\n      display: block;\n      position: absolute;\n      top: 0;\n      left: 0;\n      width: 100%;\n      height: 100%;\n    }\n\n    &::after {\n      z-index: 1;\n    }\n  }\n\n  &__lead {\n    @include fontCurve(\"p2\");\n    @include spaceCurve(\"margin-top\", \"small\");\n    @include spaceCurve(\"margin-bottom\", \"small\");\n  }\n\n  &__arrow {\n    flex-shrink: 0;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    width: 64px;\n    height: 64px;\n    color: $colorPrimary70;\n    background-color: $colorSecondary30;\n  }\n\n  &__arrow-icon {\n    transition: transform 150ms ease;\n    --size: #{iconSize(\"large\")};\n  }\n\n  /* Has lead variant */\n\n  &--has-lead &__wrapper {\n    @include spaceCurve(\"padding-right\", \"regular\");\n    @include spaceCurve(\"padding-top\", \"regular\");\n    @include spaceCurve(\"padding-bottom\", \"large\");\n    flex-direction: column;\n    align-items: flex-start;\n  }\n\n  &--has-lead &__arrow {\n    position: absolute;\n    right: 0;\n    bottom: 0;\n    width: 44px;\n    height: 44px;\n  }\n\n  /* Hyphens */\n  &--hyphens &__title,\n  &--hyphens &__title-link {\n    hyphens: auto;\n  }\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Prop } from \"@stencil/core\";\n\nimport { StzhCardNavigationClickEvent } from \"../../index\";\nimport { formatHeadingForHyphenation, hasSlot } from \"../../utils/utils\";\n\n/**\n * @slot heading - Heading text (alternative for heading property)\n * @slot lead - Lead text (alternative for lead property)\n */\n@Component({\n  tag: \"stzh-card-navigation\",\n  styleUrl: \"stzh-card-navigation.scss\",\n  scoped: true,\n})\nexport class StzhCardNavigation {\n  /** Href of card */\n  @Prop({ reflect: true }) href: string;\n\n  /** target if the button is used as link (if href used)  */\n  @Prop() target: string;\n\n  /**\n   * For Adobe Analytics.\n   * Will be rendered as value of `s-object-id` attribute to the link elements.\n   * Default value will be taken from `heading` prop/slot.\n   */\n  @Prop() analyticsId: string;\n\n  /** Heading (alternative for heading slot) */\n  @Prop() heading: string = \"\";\n\n  /** Heading level */\n  @Prop() headingLevel: \"1\" | \"2\" | \"3\" | \"4\" = \"3\";\n\n  /** Lead text (alternative for lead slot) */\n  @Prop() lead: string = \"\";\n\n  /** Automatic Hyphens */\n  @Prop({ reflect: true }) hyphensEnabled: boolean = false;\n\n  @Element() element: HTMLStzhListElement;\n\n  /** Click event (if href is used) */\n  @Event() stzhClick: EventEmitter<StzhCardNavigationClickEvent>;\n\n  private titleLinkElement: HTMLAnchorElement | HTMLButtonElement;\n  private headingTextElement: HTMLDivElement;\n\n  private handleCardClick = (originalEvent: MouseEvent) => {\n    this.stzhClick.emit({\n      component: \"stzh-card-navigation\",\n      originalEvent,\n      href: this.href,\n    });\n  };\n\n  componentDidRender() {\n    requestAnimationFrame(() => {\n      const objectId = this.analyticsId || this.headingTextElement?.innerText;\n\n      if (objectId) {\n        this.titleLinkElement?.setAttribute(\"s-object-id\", objectId);\n      }\n    });\n  }\n\n  render() {\n    const hasLead = !!this.lead || hasSlot(this.element, \"lead\");\n\n    const classes = {\n      \"stzh-card-navigation\": true,\n      \"stzh-card-navigation--has-lead\": hasLead,\n      \"stzh-card-navigation--hyphens\": this.hyphensEnabled,\n    };\n\n    const Heading = `h${this.headingLevel}`;\n    const TitleLink = this.href ? \"a\" : \"button\";\n\n    return (\n      <Host has-lead={hasLead}>\n        <article class={classes} aria-label={this.heading} role=\"listitem\">\n          <div class=\"stzh-card-navigation__wrapper\">\n            <Heading class=\"stzh-card-navigation__title\">\n              <TitleLink\n                ref={el => (this.titleLinkElement = el as HTMLAnchorElement | HTMLButtonElement)}\n                class=\"stzh-card-navigation__title-link\"\n                href={this.href}\n                target={this.target}\n                onClick={this.handleCardClick}\n              >\n                {this.heading ? (\n                  <div\n                    ref={el => (this.headingTextElement = el as HTMLDivElement)}\n                    innerHTML={formatHeadingForHyphenation(this.heading)}\n                  ></div>\n                ) : (\n                  <div ref={el => (this.headingTextElement = el as HTMLDivElement)}>\n                    <slot name=\"heading\"></slot>\n                  </div>\n                )}\n              </TitleLink>\n            </Heading>\n\n            <div class=\"stzh-card-navigation__lead\">{this.lead ? this.lead : <slot name=\"lead\"></slot>}</div>\n          </div>\n\n          <div class=\"stzh-card-navigation__arrow\">\n            <stzh-icon class=\"stzh-card-navigation__arrow-icon\" name=\"arrow-right\"></stzh-icon>\n          </div>\n        </article>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"stzh-card-navigation.js","mappings":"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","names":["StzhCardNavigation","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/stzh-card-navigation/stzh-card-navigation.scss?tag=stzh-card-navigation&encapsulation=scoped","src/components/stzh-card-navigation/stzh-card-navigation.tsx"],"sourcesContent":[":host {\n  display: flex;\n  flex-direction: column;\n}\n\n.stzh-card-navigation {\n  position: relative;\n  flex-grow: 1;\n  display: flex;\n  gap: space(\"small\");\n  background-color: $colorGrey10;\n\n  &:hover {\n    background-color: var(--stzh-color-secondary10);\n  }\n\n  &:hover &__arrow-icon {\n    transform: translateX(4px);\n  }\n\n  &__wrapper {\n    @include spaceCurve(\"padding-left\", \"regular\");\n    display: flex;\n    align-items: center;\n    flex-grow: 1;\n    // safe space padding top/bottom when it would go to three lines\n    padding-top: var(--stzh-space-xsmall);\n    padding-bottom: var(--stzh-space-xsmall);\n  }\n\n  &__title {\n    @include font(\"heavy\");\n    @include fontCurve(\"teaser\");\n    @include wordWrap;\n    color: $colorPrimary70;\n    margin: 0;\n  }\n\n  &__title-link {\n    display: block;\n    font-family: inherit;\n    font-size: inherit;\n    padding: 0;\n    appearance: none;\n    background-color: transparent;\n    border: none;\n    color: $colorPrimary;\n    text-decoration-line: none;\n    transition: color $baseTransitionAnimationSpeed;\n    border-radius: $buttonBorderRadius;\n    cursor: pointer;\n\n    &::after {\n      content: \"\";\n      display: block;\n      position: absolute;\n      top: 0;\n      left: 0;\n      width: 100%;\n      height: 100%;\n    }\n\n    &::after {\n      z-index: 1;\n    }\n  }\n\n  &__lead {\n    @include fontCurve(\"p2\");\n    @include spaceCurve(\"margin-top\", \"small\");\n    @include spaceCurve(\"margin-bottom\", \"small\");\n  }\n\n  &__arrow {\n    flex-shrink: 0;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    width: 64px;\n    height: 64px;\n    color: $colorPrimary70;\n    background-color: $colorSecondary30;\n  }\n\n  &__arrow-icon {\n    transition: transform 150ms ease;\n    --size: #{iconSize(\"large\")};\n  }\n\n  /* Has lead variant */\n\n  &--has-lead &__wrapper {\n    @include spaceCurve(\"padding-right\", \"regular\");\n    @include spaceCurve(\"padding-top\", \"regular\");\n    @include spaceCurve(\"padding-bottom\", \"large\");\n    flex-direction: column;\n    align-items: flex-start;\n  }\n\n  &--has-lead &__arrow {\n    position: absolute;\n    right: 0;\n    bottom: 0;\n    width: 44px;\n    height: 44px;\n  }\n\n  /* Hyphens */\n  &--hyphens &__title,\n  &--hyphens &__title-link {\n    hyphens: auto;\n  }\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Prop } from \"@stencil/core\";\n\nimport { StzhCardNavigationClickEvent } from \"../../index\";\nimport { formatHeadingForHyphenation, hasSlot } from \"../../utils/utils\";\n\n/**\n * @slot heading - Heading text (alternative for heading property)\n * @slot lead - Lead text (alternative for lead property)\n */\n@Component({\n  tag: \"stzh-card-navigation\",\n  styleUrl: \"stzh-card-navigation.scss\",\n  scoped: true,\n})\nexport class StzhCardNavigation {\n  /** Href of card */\n  @Prop({ reflect: true }) href: string;\n\n  /** target if the button is used as link (if href used)  */\n  @Prop() target: string;\n\n  /**\n   * For Adobe Analytics.\n   * Will be rendered as value of `s-object-id` attribute to the link elements.\n   * Default value will be taken from `heading` prop/slot.\n   */\n  @Prop() analyticsId: string;\n\n  /** Heading (alternative for heading slot) */\n  @Prop() heading: string = \"\";\n\n  /** Heading level */\n  @Prop() headingLevel: \"1\" | \"2\" | \"3\" | \"4\" = \"3\";\n\n  /** Lead text (alternative for lead slot) */\n  @Prop() lead: string = \"\";\n\n  /** Automatic Hyphens */\n  @Prop({ reflect: true }) hyphensEnabled: boolean = false;\n\n  @Element() element: HTMLStzhListElement;\n\n  /** Click event (if href is used) */\n  @Event() stzhClick: EventEmitter<StzhCardNavigationClickEvent>;\n\n  private titleLinkElement: HTMLAnchorElement | HTMLButtonElement;\n  private headingTextElement: HTMLDivElement;\n\n  private handleCardClick = (originalEvent: MouseEvent) => {\n    this.stzhClick.emit({\n      component: \"stzh-card-navigation\",\n      originalEvent,\n      href: this.href,\n    });\n  };\n\n  componentDidRender() {\n    requestAnimationFrame(() => {\n      const objectId = this.analyticsId || this.headingTextElement?.innerText;\n\n      if (objectId) {\n        this.titleLinkElement?.setAttribute(\"s-object-id\", objectId);\n      }\n    });\n  }\n\n  render() {\n    const hasLead = !!this.lead || hasSlot(this.element, \"lead\");\n\n    const classes = {\n      \"stzh-card-navigation\": true,\n      \"stzh-card-navigation--has-lead\": hasLead,\n      \"stzh-card-navigation--hyphens\": this.hyphensEnabled,\n    };\n\n    const Heading = `h${this.headingLevel}`;\n    const TitleLink = this.href ? \"a\" : \"button\";\n\n    return (\n      <Host has-lead={hasLead}>\n        <article class={classes} aria-label={this.heading} role=\"listitem\">\n          <div class=\"stzh-card-navigation__wrapper\">\n            <Heading class=\"stzh-card-navigation__title\">\n              <TitleLink\n                ref={el => (this.titleLinkElement = el as HTMLAnchorElement | HTMLButtonElement)}\n                class=\"stzh-card-navigation__title-link\"\n                href={this.href}\n                target={this.target}\n                onClick={this.handleCardClick}\n              >\n                {this.heading ? (\n                  <div\n                    ref={el => (this.headingTextElement = el as HTMLDivElement)}\n                    innerHTML={formatHeadingForHyphenation(this.heading)}\n                  ></div>\n                ) : (\n                  <div ref={el => (this.headingTextElement = el as HTMLDivElement)}>\n                    <slot name=\"heading\"></slot>\n                  </div>\n                )}\n              </TitleLink>\n            </Heading>\n\n            <div class=\"stzh-card-navigation__lead\">{this.lead ? <p>{this.lead}</p> : <slot name=\"lead\"></slot>}</div>\n          </div>\n\n          <div class=\"stzh-card-navigation__arrow\">\n            <stzh-icon class=\"stzh-card-navigation__arrow-icon\" name=\"arrow-right\"></stzh-icon>\n          </div>\n        </article>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/stzh-card-searchresult.js

@@ -1,18 +1,18 @@
-import { p as proxyCustomElement, H, d as createEvent, h, F as Fragment, e as Host, t as transformTag } from './p-BBg6OWDc.js';
+import { p as proxyCustomElement, H, d as createEvent, h, F as Fragment, e as Host, t as transformTag } from './p-DqjRJcEM.js';
 import { h as hasSlot, f as formatHeadingForHyphenation } from './p-DBHUqFOB.js';
-import { d as defineCustomElement$e } from './p-DEfzwFSm.js';
-import { d as defineCustomElement$d } from './p-C3-tTDZG.js';
-import { d as defineCustomElement$c } from './p-BK6Q89R0.js';
-import { d as defineCustomElement$b } from './p-BiFb4c_S.js';
-import { d as defineCustomElement$a } from './p-CKLwcqdK.js';
-import { d as defineCustomElement$9 } from './p-BB0rFoJE.js';
-import { d as defineCustomElement$8 } from './p-CRo_30JG.js';
-import { d as defineCustomElement$7 } from './p-DrLVNdlm.js';
-import { d as defineCustomElement$6 } from './p-AIPoMvau.js';
-import { d as defineCustomElement$5 } from './p-dgzFBTky.js';
-import { d as defineCustomElement$4 } from './p-JcCSKOtR.js';
-import { d as defineCustomElement$3 } from './p-4Vt8Vqot.js';
-import { d as defineCustomElement$2 } from './p-DT8WI_DQ.js';
+import { d as defineCustomElement$e } from './p-Dn7rMHvA.js';
+import { d as defineCustomElement$d } from './p-4bFqfRjC.js';
+import { d as defineCustomElement$c } from './p-CrQrHbCR.js';
+import { d as defineCustomElement$b } from './p-DvCfh0K2.js';
+import { d as defineCustomElement$a } from './p-BHup0e1i.js';
+import { d as defineCustomElement$9 } from './p-Cg2CourL.js';
+import { d as defineCustomElement$8 } from './p-mPSUVIkD.js';
+import { d as defineCustomElement$7 } from './p-CxqE2nhG.js';
+import { d as defineCustomElement$6 } from './p-DK163sow.js';
+import { d as defineCustomElement$5 } from './p-BAcc6I3E.js';
+import { d as defineCustomElement$4 } from './p-CDOLFG2o.js';
+import { d as defineCustomElement$3 } from './p-CIG3atcV.js';
+import { d as defineCustomElement$2 } from './p-BNb1mC_F.js';
 
 var PlaceholderImage = `<svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg">
     <rect width="10000" height="10000" fill="currentColor" />
@@ -134,7 +134,7 @@ const StzhCardSearchresult$1 = /*@__PURE__*/ proxyCustomElement(class StzhCardSe
         };
         const Heading = `h${this.headingLevel}`;
         const HeadingLink = this.href ? "a" : "div";
-        return (h(Host, { key: '3ae82ba387b77362bc6ef91a154514aa26908bf7', "has-image": hasImage }, h("article", { key: 'fc296636b69cd80fbd3a391b823dfd4b71763c79', class: classes, "aria-label": this.heading, role: "listitem" }, this.tag && h("stzh-tag", { key: '9fa4d1043760865821b7525c4e9e429a21bab631', class: "stzh-card-searchresult__tag", label: this.tag, nonInteractive: true }), h("div", { key: 'dae6ad7510af19baf8fd4ad62d44d96ad47b7a05', class: "stzh-card-searchresult__heading-wrapper" }, this.breadcrumbItems && (h("stzh-breadcrumb", { key: 'e423a959f0191ad9c6dfafc8a97efd1bf8094db8', class: "stzh-card-searchresult__breadcrumb", items: this.breadcrumbItems, variant: "teaser" })), this.dateline && h("div", { key: 'ad41a404bae111d2409ba6fcba61d278349da2e0', class: "stzh-card-searchresult__dateline" }, this.dateline), h(Heading, { key: '9e26e549a796bd19cfbb9b3e75805ca4944437dc', class: "stzh-card-searchresult__heading" }, h(HeadingLink, { key: '06951dbcd6728657eecff68f89aac49230fe84de', ref: el => (this.headingLinkElement = el), class: "stzh-card-searchresult__heading-link", href: this.href, target: this.target, download: this.download, onClick: this.handleCardClick }, this.heading ? (h("div", { class: "stzh-card-searchresult__heading-link-text", ref: el => (this.headingTextElement = el), innerHTML: formatHeadingForHyphenation(this.heading) })) : (h("div", { class: "stzh-card-searchresult__heading-link-text", ref: el => (this.headingTextElement = el) }, h("slot", { name: "heading" })))))), h("div", { key: 'de3ec782d8bcd276dba15f646a4661534a774a93', class: "stzh-card-searchresult__description-wrapper" }, (eventDateStart || this.eventLocation) && (h("div", { key: '6e3af140e51bbfc01a8dae84ac08f0c85ca3393e', class: "stzh-card-searchresult__event-infos" }, eventDateStart && (h("div", { key: '99df4963a45c596348b3608a37f941df02d14fd8', class: "stzh-card-searchresult__event-date" }, h("span", { key: 'e0e2d8bb4c53853ca6dbb719637dc561b9b9994a' }, this.dateAdapter.format(eventDateStart, "dateLong")), this.hasProperStartAndOrEndDate(eventDateStart, eventDateEnd) && (h("span", { key: '725c2ea0ff663d7aab468971d402c135a7fb381c' }, ",\u00A0", this.dateAdapter.formatSpan(eventDateStart, eventDateEnd, "time"))))), this.eventLocation && h("div", { key: '3200b1bee5834b17014b4e18c66cfd277fa1e771', class: "stzh-card-searchresult__event-location" }, this.eventLocation))), h("div", { key: '53b5c48d344eae6966792e84317c77375114377c', class: "stzh-card-searchresult__description" }, this.description ? this.description : h("slot", { name: "description" }))), h("div", { key: '60ee4a822f5333c3351547704ebc0fdd0350dcd4', class: "stzh-card-searchresult__image" }, eventDateStart && (h("div", { key: '30c09d5974aa4f44394b72092a682ed2f80b3463', class: "stzh-card-searchresult__event-date-teaser" }, h("div", { key: '6d0a69eddbb37ed60c94135d121b60f55a524ede', class: "stzh-card-searchresult__event-date-teaser-day-name" }, this.localization.$globals.dayNamesShort[eventDateStart.getDay()]), h("div", { key: '5e814559752e8f757467fb51b7324204cfbc3369', class: "stzh-card-searchresult__event-date-teaser-day" }, eventDateStart.getDate() < 10 && "0", eventDateStart.getDate()), h("div", { key: 'c8fac0a6f46e10c00cf55995418abededdcd83d1', class: "stzh-card-searchresult__event-date-teaser-month" }, this.localization.$globals.monthNamesShort[eventDateStart.getMonth()]))), this.topic && h("div", { key: '05697f1b385d1a7bba25c4b5bcdcd962204e356d', class: "stzh-card-searchresult__topic" }, this.topic), this.service && h("div", { key: '6db8c6dcc6b629ede2d7c5edb0bdfbe2917d33f8', class: "stzh-card-searchresult__service" }, this.service), h("slot", { key: '72bd6c404f069238657a758b991e02a72abd9571', name: "image" }), this.placeholderImageEnabled && !hasImageSlot && (h("stzh-ratio", { key: '36949efc4df7ea6853216ec39225738ff0aaa0b4', ratio: "21:9", "ratio-small": "1:1" }, h("div", { key: 'ec427ef7256621a13c80de508ec2e9e58c375ae8', class: "stzh-card-searchresult__image-placeholder", innerHTML: PlaceholderImage })))), (this._meta.length > 0 || this.datalistItems || !!this.downloadHeading || this._downloadMeta.length > 0) && (h("div", { key: 'fdc42c153540f365776aa2f8bc46badfb5a03c7a', class: "stzh-card-searchresult__meta-wrapper" }, this.datalistItems && (h("stzh-datalist", { key: '426d78016eaa57fd9e1742c622ee62498cbff16a', class: "stzh-card-searchresult__datalist", items: this.datalistItems })), this._meta.length > 0 && (h("div", { key: '5e44f923c9ee05be175cdc860d0884e67e05d8dc', class: "stzh-card-searchresult__meta" }, h("div", { key: '2a26c265e982bee58c64855539a6ac4908ad596b', class: "stzh-card-searchresult__meta-list" }, this._meta.map(meta => (h(Fragment, null, h("div", { class: "stzh-card-searchresult__meta-list-item" }, meta))))))), (!!this.downloadHeading || this._downloadMeta.length > 0) && (h("div", { key: 'f5f014598298a54288c667aada4dbe7fe048a8cf', class: "stzh-card-searchresult__download" }, h("div", { key: '1f92634795e59fec02a6d45158b3f1d19f99048b', class: "stzh-card-searchresult__download-data" }, this.downloadHeading && (h("div", { key: 'f7718577a02ca5f581175cb8f188ecc42b84f576', class: "stzh-card-searchresult__download-heading" }, this.downloadHeading)), this._downloadMeta.length > 0 && (h("div", { key: '437fd0f56e131b8f1e01d3e241cdf56b19b31843', class: "stzh-card-searchresult__download-meta-list" }, this._downloadMeta.map(meta => (h(Fragment, null, h("div", { class: "stzh-card-searchresult__download-meta-list-item" }, meta))))))), h("div", { key: '469c351e22786e59d7b5799aac6adb99e702c8a4', class: "stzh-card-searchresult__download-button" }, h("stzh-icon", { key: '45385639e43a22f2b368a9fccc8b9b85df76bdbf', class: "stzh-card-searchresult__download-icon", name: "download" })))))))));
+        return (h(Host, { key: '74017f9a5c1a4104a3ccb6ee5d974cbeb3de9806', "has-image": hasImage }, h("article", { key: 'fdfb1e9a5885daa1b9616bc7053ee1a7e700c4ec', class: classes, "aria-label": this.heading, role: "listitem" }, this.tag && h("stzh-tag", { key: '6c5aa712510b854ac42f2247c3c58e717a91f211', class: "stzh-card-searchresult__tag", label: this.tag, nonInteractive: true }), h("div", { key: 'b750a2186579be8706828ab00424dd9824386b93', class: "stzh-card-searchresult__heading-wrapper" }, this.breadcrumbItems && (h("stzh-breadcrumb", { key: 'd4847693c87d59c9444301d139a9f19c56aca17a', class: "stzh-card-searchresult__breadcrumb", items: this.breadcrumbItems, variant: "teaser" })), this.dateline && h("div", { key: '8160403ba0ab20f1f69a4e339e51ecb14ed4a14b', class: "stzh-card-searchresult__dateline" }, this.dateline), h(Heading, { key: '5dfd9de959d21669d2d39861792c6b7877966438', class: "stzh-card-searchresult__heading" }, h(HeadingLink, { key: '16a7b014335694f979ce50b23ff83250792f9295', ref: el => (this.headingLinkElement = el), class: "stzh-card-searchresult__heading-link", href: this.href, target: this.target, download: this.download, onClick: this.handleCardClick }, this.heading ? (h("div", { class: "stzh-card-searchresult__heading-link-text", ref: el => (this.headingTextElement = el), innerHTML: formatHeadingForHyphenation(this.heading) })) : (h("div", { class: "stzh-card-searchresult__heading-link-text", ref: el => (this.headingTextElement = el) }, h("slot", { name: "heading" })))))), h("div", { key: 'a271d51f4c699ce77559bf9b786a5db4acc0d02d', class: "stzh-card-searchresult__description-wrapper" }, (eventDateStart || this.eventLocation) && (h("div", { key: '655a23e35ece2c49eaeb131bd027e6acd68c8c5c', class: "stzh-card-searchresult__event-infos" }, eventDateStart && (h("div", { key: '4dec6cf7b9cc9cc337d30149b9ab0ea6bf886960', class: "stzh-card-searchresult__event-date" }, h("span", { key: '2917247cc5ef64a14621eac98f834e9f6e249d2b' }, this.dateAdapter.format(eventDateStart, "dateLong")), this.hasProperStartAndOrEndDate(eventDateStart, eventDateEnd) && (h("span", { key: '1e472419aa9a1b4916698609f0a0ad2536e5239f' }, ",\u00A0", this.dateAdapter.formatSpan(eventDateStart, eventDateEnd, "time"))))), this.eventLocation && h("div", { key: '95ab56458a65bc29c08efda0e35390a709447ef0', class: "stzh-card-searchresult__event-location" }, this.eventLocation))), h("div", { key: '31b8a01402712564b765484058f4f40501da14a1', class: "stzh-card-searchresult__description" }, this.description ? this.description : h("slot", { name: "description" }))), h("div", { key: '0b45619d8e1d9f1db640376923c16544a56a768a', class: "stzh-card-searchresult__image" }, eventDateStart && (h("div", { key: 'ae8067786ba06e3db6e951f93d293640a9c0fb8d', class: "stzh-card-searchresult__event-date-teaser" }, h("div", { key: '505a37ac6a09a3f561aab2b19134df14c173f23b', class: "stzh-card-searchresult__event-date-teaser-day-name" }, this.localization.$globals.dayNamesShort[eventDateStart.getDay()]), h("div", { key: '03bfae37e12c43065b737049a754e5f5fddde6c6', class: "stzh-card-searchresult__event-date-teaser-day" }, eventDateStart.getDate() < 10 && "0", eventDateStart.getDate()), h("div", { key: '951106db1810a172a5bb2aac810afcb594606068', class: "stzh-card-searchresult__event-date-teaser-month" }, this.localization.$globals.monthNamesShort[eventDateStart.getMonth()]))), this.topic && h("div", { key: 'e51a37d550b33bf9a773ba672245156147473e12', class: "stzh-card-searchresult__topic" }, this.topic), this.service && h("div", { key: '2a9b48098e7b4fb87085dbd3cb735772d2fc1035', class: "stzh-card-searchresult__service" }, this.service), h("slot", { key: '92a15649442d11bde2b22860c1a6a15cd807e376', name: "image" }), this.placeholderImageEnabled && !hasImageSlot && (h("stzh-ratio", { key: 'c0bd101e65d723586cf9bddc9add7dccb8d1f9c4', ratio: "21:9", "ratio-small": "1:1" }, h("div", { key: '8987e3e565fdf6bda792e165f5998cb9f301b15c', class: "stzh-card-searchresult__image-placeholder", innerHTML: PlaceholderImage })))), (this._meta.length > 0 || this.datalistItems || !!this.downloadHeading || this._downloadMeta.length > 0) && (h("div", { key: '82d630c3af253ad322acfeacd409575c80e7e31c', class: "stzh-card-searchresult__meta-wrapper" }, this.datalistItems && (h("stzh-datalist", { key: '6199288e16758d369a3d25c6925d6fc1f2e85340', class: "stzh-card-searchresult__datalist", items: this.datalistItems })), this._meta.length > 0 && (h("div", { key: 'bcd9bf59df3eb5c0d6127dd06435501740f51cc4', class: "stzh-card-searchresult__meta" }, h("div", { key: '252a43648ca2bae88b7532ac824eedffde87b669', class: "stzh-card-searchresult__meta-list" }, this._meta.map(meta => (h(Fragment, null, h("div", { class: "stzh-card-searchresult__meta-list-item" }, meta))))))), (!!this.downloadHeading || this._downloadMeta.length > 0) && (h("div", { key: '67a7ec80ece51e1965c4bb6d87a66b2ceb83d755', class: "stzh-card-searchresult__download" }, h("div", { key: '617f523655894a0f28866606cb14aa0d89df052e', class: "stzh-card-searchresult__download-data" }, this.downloadHeading && (h("div", { key: 'aa7397f34569981d3cc2d3fbac430c0827ecbc03', class: "stzh-card-searchresult__download-heading" }, this.downloadHeading)), this._downloadMeta.length > 0 && (h("div", { key: 'd3555db9375efe2099767b1722b02eb3b13604a9', class: "stzh-card-searchresult__download-meta-list" }, this._downloadMeta.map(meta => (h(Fragment, null, h("div", { class: "stzh-card-searchresult__download-meta-list-item" }, meta))))))), h("div", { key: 'f0d68f7b6c06ce004339d2932565aa73a46a1e4d', class: "stzh-card-searchresult__download-button" }, h("stzh-icon", { key: 'db11ec5790a099b3ba51af7bb3d6ad75d4ffbfca', class: "stzh-card-searchresult__download-icon", name: "download" })))))))));
     }
     get element() { return this; }
     static get watchers() { return {

package/dist/components/stzh-card-superteaser.js

@@ -1,18 +1,18 @@
-import { p as proxyCustomElement, H, d as createEvent, h, F as Fragment, e as Host, t as transformTag } from './p-BBg6OWDc.js';
+import { p as proxyCustomElement, H, d as createEvent, h, F as Fragment, e as Host, t as transformTag } from './p-DqjRJcEM.js';
 import { h as hasSlot, f as formatHeadingForHyphenation } from './p-DBHUqFOB.js';
-import { d as defineCustomElement$e } from './p-DEfzwFSm.js';
-import { d as defineCustomElement$d } from './p-C3-tTDZG.js';
-import { d as defineCustomElement$c } from './p-BK6Q89R0.js';
-import { d as defineCustomElement$b } from './p-BiFb4c_S.js';
-import { d as defineCustomElement$a } from './p-CKLwcqdK.js';
-import { d as defineCustomElement$9 } from './p-BB0rFoJE.js';
-import { d as defineCustomElement$8 } from './p-CRo_30JG.js';
-import { d as defineCustomElement$7 } from './p-DrLVNdlm.js';
-import { d as defineCustomElement$6 } from './p-AIPoMvau.js';
-import { d as defineCustomElement$5 } from './p-dgzFBTky.js';
-import { d as defineCustomElement$4 } from './p-JcCSKOtR.js';
-import { d as defineCustomElement$3 } from './p-4Vt8Vqot.js';
-import { d as defineCustomElement$2 } from './p-DT8WI_DQ.js';
+import { d as defineCustomElement$e } from './p-Dn7rMHvA.js';
+import { d as defineCustomElement$d } from './p-4bFqfRjC.js';
+import { d as defineCustomElement$c } from './p-CrQrHbCR.js';
+import { d as defineCustomElement$b } from './p-DvCfh0K2.js';
+import { d as defineCustomElement$a } from './p-BHup0e1i.js';
+import { d as defineCustomElement$9 } from './p-Cg2CourL.js';
+import { d as defineCustomElement$8 } from './p-mPSUVIkD.js';
+import { d as defineCustomElement$7 } from './p-CxqE2nhG.js';
+import { d as defineCustomElement$6 } from './p-DK163sow.js';
+import { d as defineCustomElement$5 } from './p-BAcc6I3E.js';
+import { d as defineCustomElement$4 } from './p-CDOLFG2o.js';
+import { d as defineCustomElement$3 } from './p-CIG3atcV.js';
+import { d as defineCustomElement$2 } from './p-BNb1mC_F.js';
 
 var PlaceholderImage = `<svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg">
     <rect width="10000" height="10000" fill="currentColor" />

package/dist/components/stzh-card.js

@@ -1,4 +1,4 @@
-import { S as StzhCard$1, d as defineCustomElement$1 } from './p-Bc9gWpUe.js';
+import { S as StzhCard$1, d as defineCustomElement$1 } from './p-DgdayHzY.js';
 
 const StzhCard = StzhCard$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/stzh-cardlist.js

@@ -1,4 +1,4 @@
-import { S as StzhCardlist$1, d as defineCustomElement$1 } from './p-Deiikj-l.js';
+import { S as StzhCardlist$1, d as defineCustomElement$1 } from './p-BE4EipE7.js';
 
 const StzhCardlist = StzhCardlist$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/stzh-carousel.js

@@ -1,4 +1,4 @@
-import { S as StzhCarousel$1, d as defineCustomElement$1 } from './p-CVHui8fR.js';
+import { S as StzhCarousel$1, d as defineCustomElement$1 } from './p-D8P4IANZ.js';
 
 const StzhCarousel = StzhCarousel$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/stzh-cell.js

@@ -1,4 +1,4 @@
-import { S as StzhCell$1, d as defineCustomElement$1 } from './p-BiZ4OWbq.js';
+import { S as StzhCell$1, d as defineCustomElement$1 } from './p-pfvnaMy-.js';
 
 const StzhCell = StzhCell$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/stzh-chart.js

@@ -1,4 +1,4 @@
-import { p as proxyCustomElement, H, h, e as Host, t as transformTag } from './p-BBg6OWDc.js';
+import { p as proxyCustomElement, H, h, e as Host, t as transformTag } from './p-DqjRJcEM.js';
 
 function ascending$3(a, b) {
   return a == null || b == null ? NaN : a < b ? -1 : a > b ? 1 : a >= b ? 0 : NaN;
@@ -30258,7 +30258,7 @@ const StzhChart$1 = /*@__PURE__*/ proxyCustomElement(class StzhChart extends H {
         const classes = {
             "stzh-chart": true,
         };
-        return (h(Host, { key: '0b184f853a718b83768e563d01a41d91d0d4887f' }, h("div", { key: '09f952dfd2d028c513420fe0e010b79059f5d490', class: classes }, h("div", { key: '5b6598d54e9aa29b3c944c0e0c3f887da05718a8', id: this.chartId, ref: el => (this.chartElement = el), class: "stzh-chart__element" }), h("slot", { key: '651fdc4e70f80b2a7424816ddb9949c21a9ae788', name: "caption" }))));
+        return (h(Host, { key: '20ba86fe7721b0f21f48e4b5a28a5be56518927e' }, h("div", { key: '69f96a271c0db6c6feb01ddf253fd8b20c7a8cd1', class: classes }, h("div", { key: 'c5eb602d02a7ce5c79171df2e0d0eee3a5227cee', id: this.chartId, ref: el => (this.chartElement = el), class: "stzh-chart__element" }), h("slot", { key: '87028fb4ccb8260e0f247b389d97aa5817da90d7', name: "caption" }))));
     }
     get element() { return this; }
     static get watchers() { return {

package/dist/components/stzh-checkbox.js

@@ -1,4 +1,4 @@
-import { S as StzhCheckbox$1, d as defineCustomElement$1 } from './p-Dp2_qh2g.js';
+import { S as StzhCheckbox$1, d as defineCustomElement$1 } from './p-D8xZNR0-.js';
 
 const StzhCheckbox = StzhCheckbox$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/stzh-checkboxgroup.js

@@ -1,9 +1,9 @@
-import { p as proxyCustomElement, H, d as createEvent, h, e as Host, t as transformTag } from './p-BBg6OWDc.js';
+import { p as proxyCustomElement, H, d as createEvent, h, e as Host, t as transformTag } from './p-DqjRJcEM.js';
 import { h as hasSlot, c as camelCase } from './p-DBHUqFOB.js';
-import { S as StzhInputDescription } from './p-BmG3hFM8.js';
-import { d as defineCustomElement$4 } from './p-CRo_30JG.js';
-import { d as defineCustomElement$3 } from './p-DT0ux3Yn.js';
-import { d as defineCustomElement$2 } from './p-4Vt8Vqot.js';
+import { S as StzhInputDescription } from './p-CbIALTef.js';
+import { d as defineCustomElement$4 } from './p-mPSUVIkD.js';
+import { d as defineCustomElement$3 } from './p-Bi0j3C9E.js';
+import { d as defineCustomElement$2 } from './p-CIG3atcV.js';
 
 const stzhCheckboxgroupCss = () => `.sc-stzh-checkboxgroup-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-checkboxgroup-h,[stzh-hidden].sc-stzh-checkboxgroup-h{display:none}.sc-stzh-checkboxgroup-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-checkboxgroup-h *.sc-stzh-checkboxgroup,.sc-stzh-checkboxgroup-h *.sc-stzh-checkboxgroup::before,.sc-stzh-checkboxgroup-h *.sc-stzh-checkboxgroup::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-checkboxgroup-h .has-focus.sc-stzh-checkboxgroup{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-checkboxgroup-h .stzh-fylingfocus-focused.sc-stzh-checkboxgroup{outline-style:none !important}.sc-stzh-checkboxgroup-h .stzh-fylingfocus-focused.sc-stzh-checkboxgroup::-moz-focus-inner{border:0 !important}[disabled].sc-stzh-checkboxgroup-h:not([disabled=false]){--description-color:var(--stzh-color-grey70)}.stzh-checkboxgroup__marker-symbol.sc-stzh-checkboxgroup{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium)}.stzh-checkboxgroup__marker-text.sc-stzh-checkboxgroup{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-checkboxgroup__description-wrapper.sc-stzh-checkboxgroup{display:flex;flex-direction:column-reverse;min-height:var(--description-min-height, var(--stzh-description-min-height, none))}.stzh-checkboxgroup__error.sc-stzh-checkboxgroup,.stzh-checkboxgroup__description.sc-stzh-checkboxgroup{font-size:var(--stzh-font-nano-font-size);line-height:var(--stzh-font-nano-text-line-height)}.stzh-checkboxgroup__error.sc-stzh-checkboxgroup{color:var(--stzh-color-error60)}.stzh-checkboxgroup__error-list.sc-stzh-checkboxgroup{list-style:none;margin:0;padding:0}.stzh-checkboxgroup__description.sc-stzh-checkboxgroup{display:flex;align-items:flex-start;color:var(--stzh-input-description-color, var(--description-color, var(--stzh-color-coolgrey70)));transition:color var(--stzh-base-transition-animation-speed)}.stzh-checkboxgroup__description-long.sc-stzh-checkboxgroup{margin-right:var(--stzh-space-xxsmall);margin-top:0.125rem}@supports (font: -apple-system-body) and (-webkit-appearance: none){.stzh-checkboxgroup__description-long.sc-stzh-checkboxgroup{margin-top:0}}.stzh-checkboxgroup__description-long-popover.sc-stzh-checkboxgroup{--width:auto;--max-width:27.3125rem}.stzh-checkboxgroup__description-long-button.sc-stzh-checkboxgroup{display:flex;justify-content:center;align-items:center;appearance:none;font-family:inherit;padding:0;border:none;background-color:transparent;border-radius:0.5rem;cursor:pointer}.stzh-checkboxgroup.sc-stzh-checkboxgroup stzh-icon.stzh-checkboxgroup__description-long-icon.sc-stzh-checkboxgroup{--size:var(--stzh-icon-size-xsmall)}.stzh-checkboxgroup--has-error.sc-stzh-checkboxgroup .stzh-checkboxgroup__error.sc-stzh-checkboxgroup,.stzh-checkboxgroup--has-description.sc-stzh-checkboxgroup .stzh-checkboxgroup__description.sc-stzh-checkboxgroup{margin-top:var(--stzh-space-xxxsmall)}.stzh-checkboxgroup.sc-stzh-checkboxgroup{margin:0;padding:0;border:none}.stzh-checkboxgroup__fields.sc-stzh-checkboxgroup{display:flex;align-items:flex-start;flex-direction:column;gap:var(--stzh-space-medium)}.stzh-checkboxgroup__legend.sc-stzh-checkboxgroup{font-family:var(--stzh-font-family-heavy);font-weight:var(--stzh-font-weight-heavy);font-style:var(--stzh-font-style-heavy);font-size:var(--stzh-font-micro-font-size);line-height:var(--stzh-font-micro-text-line-height);color:var(--stzh-heading-color);padding:0;margin-bottom:var(--stzh-space-xsmall);display:flex;align-items:center;gap:var(--stzh-space-xsmall);min-width:0;max-width:100%}.stzh-checkboxgroup__legend-text.sc-stzh-checkboxgroup{min-width:0}.stzh-checkboxgroup__legend.sc-stzh-checkboxgroup>.stzh-checkboxgroup__description-wrapper.sc-stzh-checkboxgroup{flex:0 0 auto;display:inline-flex;align-items:flex-start;margin:0}.stzh-checkboxgroup__legend.sc-stzh-checkboxgroup .stzh-checkboxgroup__error.sc-stzh-checkboxgroup,.stzh-checkboxgroup__legend.sc-stzh-checkboxgroup .stzh-checkboxgroup__description-text.sc-stzh-checkboxgroup{display:none}.stzh-checkboxgroup__legend.sc-stzh-checkboxgroup .stzh-checkboxgroup__description.sc-stzh-checkboxgroup,.stzh-checkboxgroup__legend.sc-stzh-checkboxgroup .stzh-checkboxgroup__description-long.sc-stzh-checkboxgroup{display:inline-flex;align-items:flex-start;margin:0}.stzh-checkboxgroup__legend.sc-stzh-checkboxgroup .stzh-checkboxgroup__description-long-button.sc-stzh-checkboxgroup{display:inline-flex;align-items:center;justify-content:center;padding:0;line-height:1}.stzh-checkboxgroup__legend.sc-stzh-checkboxgroup stzh-popover.sc-stzh-checkboxgroup .stzh-checkboxgroup__description-long-icon.sc-stzh-checkboxgroup{--size:var(--stzh-icon-size-small);display:block;line-height:0;color:var(--stzh-color-primary70)}.stzh-checkboxgroup--hide-legend.sc-stzh-checkboxgroup .stzh-checkboxgroup__legend.sc-stzh-checkboxgroup{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-checkboxgroup--direction-horizontal.sc-stzh-checkboxgroup .stzh-checkboxgroup__fields.sc-stzh-checkboxgroup{flex-wrap:wrap;flex-direction:row;row-gap:var(--stzh-space-medium);column-gap:var(--stzh-space-xxlarge)}`;
 
@@ -192,11 +192,11 @@ const StzhCheckboxgroup$1 = /*@__PURE__*/ proxyCustomElement(class StzhCheckboxg
             "stzh-checkboxgroup--hide-legend": this.hideLegend,
             [`stzh-checkboxgroup--direction-${this.direction}`]: !!this.direction,
         };
-        return (h(Host, { key: '2ec75243e3789e09e8a8b49338ab6801a844fd96', "is-invalid": this.invalid || this.errorUsed }, h("fieldset", { key: '3149e4dff13d900c6d644173ea8b5d7f6274df1e', class: classes }, legendUsed && (h("legend", { key: 'a1831fd9f8a697c8f931d029a7787260d10247a8', class: "stzh-checkboxgroup__legend" }, this.legend && (h("span", { key: '89d96b7da45169e1b29a78074424dbe167e0ae35', class: "stzh-checkboxgroup__legend-text" }, this.legend, !this.hideOptional && (h("span", { key: '9dc77fdd2f69bbe67edfe9d2954e6fd4adecdcc3', class: "stzh-checkboxgroup__marker" }, h("span", { key: 'f9a8d707bc34bd1d121f6e0555b937369358f28d', class: "stzh-checkboxgroup__marker-symbol", "aria-hidden": "true" }, this.required
+        return (h(Host, { key: '720872ca7386fc428b0dc8882817030f3b6dd81d', "is-invalid": this.invalid || this.errorUsed }, h("fieldset", { key: 'fee8021a63f01abe04b22f9d773ed4adbe9754c6', class: classes }, legendUsed && (h("legend", { key: 'c794e19cc927c9114b4fea02ac8835ee2e5676d1', class: "stzh-checkboxgroup__legend" }, this.legend && (h("span", { key: '433880ceb11ca1d84a076fbbd3fe272e611fd039', class: "stzh-checkboxgroup__legend-text" }, this.legend, !this.hideOptional && (h("span", { key: '4d19a918e6ee2101c6215733143184330ad10ba3', class: "stzh-checkboxgroup__marker" }, h("span", { key: 'bdaf281618d6676b96ab78b345ff6bdd8291294c', class: "stzh-checkboxgroup__marker-symbol", "aria-hidden": "true" }, this.required
             ? this.localization.$globals.requiredFieldMarker
-            : this.localization.$globals.optionalFieldMarker), h("span", { key: '8a3aee7c90442126f3bb79575a656de88fb8b0ce', class: "stzh-checkboxgroup__marker-text" }, this.required
+            : this.localization.$globals.optionalFieldMarker), h("span", { key: '03a501a4db35dda2cfbb808c1ef6dda910be6021', class: "stzh-checkboxgroup__marker-text" }, this.required
             ? this.localization.$globals.requiredFieldText
-            : this.localization.$globals.optionalFieldText))))), descriptionLongUsed && (h(StzhInputDescription, { key: '8fcca62e9d2626369a83bc95c5c0ba435c1ea8fc', classPrefix: "stzh-checkboxgroup", id: `${this.checkboxgroupId}-description-long`, descriptionLong: this.descriptionLong, descriptionLongTitle: this.descriptionLongTitle, descriptionLongUsed: descriptionLongUsed, moreInfoButtonLabel: this.localization.$globals.moreInfoButtonLabel, showError: false, showDescriptionText: false })))), h("div", { key: '7a7862714d84d0e18d55b356516b1354a29c83ca', class: "stzh-checkboxgroup__fields" }, h("slot", { key: '0fb7bbd616158752878038d0d868a8f2321d5bbe' })), (this.errorUsed || descriptionUsed) && (h(StzhInputDescription, { key: 'fb81ec660f839d7d689228289a9643fd13607369', classPrefix: "stzh-checkboxgroup", id: `${this.checkboxgroupId}-description`, error: this._error, description: this.description, descriptionLongUsed: false })))));
+            : this.localization.$globals.optionalFieldText))))), descriptionLongUsed && (h(StzhInputDescription, { key: '4665d6b6604c61dfca4fb8fd8cd49b51cf652fa6', classPrefix: "stzh-checkboxgroup", id: `${this.checkboxgroupId}-description-long`, descriptionLong: this.descriptionLong, descriptionLongTitle: this.descriptionLongTitle, descriptionLongUsed: descriptionLongUsed, moreInfoButtonLabel: this.localization.$globals.moreInfoButtonLabel, showError: false, showDescriptionText: false })))), h("div", { key: '49027931041b7171435c8b0669180c7e943b3b14', class: "stzh-checkboxgroup__fields" }, h("slot", { key: 'bfbf3b35d0db6449788826d3ac63547dd4def04b' })), (this.errorUsed || descriptionUsed) && (h(StzhInputDescription, { key: '6e204732081c61ae65e8728dd3fa1d961f4e6dd6', classPrefix: "stzh-checkboxgroup", id: `${this.checkboxgroupId}-description`, error: this._error, description: this.description, descriptionLongUsed: false })))));
     }
     get element() { return this; }
     static get watchers() { return {

package/dist/components/stzh-chip.js

@@ -1,4 +1,4 @@
-import { S as StzhChip$1, d as defineCustomElement$1 } from './p-CPdCE2fo.js';
+import { S as StzhChip$1, d as defineCustomElement$1 } from './p-BAn4Ipj9.js';
 
 const StzhChip = StzhChip$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/stzh-chipgroup.js

@@ -1,4 +1,4 @@
-import { S as StzhChipgroup$1, d as defineCustomElement$1 } from './p-rjZPG2L3.js';
+import { S as StzhChipgroup$1, d as defineCustomElement$1 } from './p-B446UYGz.js';
 
 const StzhChipgroup = StzhChipgroup$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/stzh-chipselect.js

@@ -1,4 +1,4 @@
-import { S as StzhChipselect$1, d as defineCustomElement$1 } from './p-D4c33pwr.js';
+import { S as StzhChipselect$1, d as defineCustomElement$1 } from './p-DgLT1h5X.js';
 
 const StzhChipselect = StzhChipselect$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/stzh-clamp.js

@@ -1,4 +1,4 @@
-import { S as StzhClamp$1, d as defineCustomElement$1 } from './p-BiFb4c_S.js';
+import { S as StzhClamp$1, d as defineCustomElement$1 } from './p-DvCfh0K2.js';
 
 const StzhClamp = StzhClamp$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/stzh-company-logo.js

@@ -1,4 +1,4 @@
-import { p as proxyCustomElement, H, h, e as Host, t as transformTag } from './p-BBg6OWDc.js';
+import { p as proxyCustomElement, H, h, e as Host, t as transformTag } from './p-DqjRJcEM.js';
 
 const stzhCompanyLogoCss = () => `.sc-stzh-company-logo-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-company-logo-h,[stzh-hidden].sc-stzh-company-logo-h{display:none}.sc-stzh-company-logo-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-company-logo-h *.sc-stzh-company-logo,.sc-stzh-company-logo-h *.sc-stzh-company-logo::before,.sc-stzh-company-logo-h *.sc-stzh-company-logo::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-company-logo-h .has-focus.sc-stzh-company-logo{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-company-logo-h .stzh-fylingfocus-focused.sc-stzh-company-logo{outline-style:none !important}.sc-stzh-company-logo-h .stzh-fylingfocus-focused.sc-stzh-company-logo::-moz-focus-inner{border:0 !important}.sc-stzh-company-logo-h.sc-stzh-company-logo-s>*,.sc-stzh-company-logo-h .sc-stzh-company-logo-s>*{width:100%}.stzh-company-logo.sc-stzh-company-logo{padding-top:var(--stzh-space-xxxxlarge)}@media screen and (min-width: 600px){.stzh-company-logo.sc-stzh-company-logo{padding-top:var(--stzh-space-big)}}@media screen and (min-width: 900px){.stzh-company-logo.sc-stzh-company-logo{padding-top:var(--stzh-space-big)}}@media screen and (min-width: 1260px){.stzh-company-logo.sc-stzh-company-logo{padding-top:var(--stzh-space-huge)}}.stzh-company-logo.sc-stzh-company-logo{padding-bottom:var(--stzh-space-xxlarge)}@media screen and (min-width: 900px){.stzh-company-logo.sc-stzh-company-logo{padding-bottom:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){.stzh-company-logo.sc-stzh-company-logo{padding-bottom:var(--stzh-space-xxxxlarge)}}.stzh-company-logo.sc-stzh-company-logo{margin-left:1.25rem;margin-right:1.25rem}@media screen and (min-width: 600px){.stzh-company-logo.sc-stzh-company-logo{margin-left:2rem;margin-right:2rem}}@media screen and (min-width: 900px){.stzh-company-logo.sc-stzh-company-logo{margin-left:2.5rem;margin-right:2.5rem}}@media screen and (min-width: 1260px){.stzh-company-logo.sc-stzh-company-logo{margin-left:4rem;margin-right:4rem}}@media screen and (min-width: 1600px){.stzh-company-logo.sc-stzh-company-logo{margin-left:auto;margin-right:auto;max-width:84.25rem}}.stzh-company-logo.sc-stzh-company-logo{display:flex;justify-content:flex-end;width:inherit}.stzh-company-logo__image.sc-stzh-company-logo{width:9.375rem}@media (forced-colors: active){.stzh-company-logo__image.sc-stzh-company-logo{forced-color-adjust:none;background-color:white}}`;
 
@@ -13,7 +13,7 @@ const StzhCompanyLogo$1 = /*@__PURE__*/ proxyCustomElement(class StzhCompanyLogo
         const classes = {
             "stzh-company-logo": true,
         };
-        return (h(Host, { key: 'fa426ca20f1522ddd3466f7c78b20cb91115057f' }, h("div", { key: '3cd9e43b1e6becc48a9992e581fb2ebe6e818c4c', class: classes }, h("div", { key: '637765a75a4222c0892854292567771d6a1ade46', class: "stzh-company-logo__image" }, h("slot", { key: 'a95f57fda633d38df97d6dad11cecd84c37f02d7' })))));
+        return (h(Host, { key: 'd952812b3ee48f1aded0d22cda1931ae0a4432ec' }, h("div", { key: '5a19a6d3e96d18e616da4de2a08606fc0a7dce1d', class: classes }, h("div", { key: 'd42264cada9d7b30d0a523ac85be350e3246214f', class: "stzh-company-logo__image" }, h("slot", { key: '84f31c2dd1cb3cbc4a935a49d98ead81834ce9ae' })))));
     }
     static get style() { return stzhCompanyLogoCss(); }
 }, [262, "stzh-company-logo"]);

package/dist/components/stzh-contact-cv.js

@@ -1,8 +1,8 @@
-import { p as proxyCustomElement, H, h, e as Host, t as transformTag } from './p-BBg6OWDc.js';
+import { p as proxyCustomElement, H, h, e as Host, t as transformTag } from './p-DqjRJcEM.js';
 import { h as hasSlot } from './p-DBHUqFOB.js';
-import { d as defineCustomElement$4 } from './p-xKyBBmWw.js';
-import { d as defineCustomElement$3 } from './p-CUfKtr7R.js';
-import { d as defineCustomElement$2 } from './p-4Vt8Vqot.js';
+import { d as defineCustomElement$4 } from './p-C1Uf6vu2.js';
+import { d as defineCustomElement$3 } from './p-D_9Bm_mQ.js';
+import { d as defineCustomElement$2 } from './p-CIG3atcV.js';
 
 const stzhContactCvCss = () => `.sc-stzh-contact-cv-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-contact-cv-h,[stzh-hidden].sc-stzh-contact-cv-h{display:none}.sc-stzh-contact-cv-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-contact-cv-h *.sc-stzh-contact-cv,.sc-stzh-contact-cv-h *.sc-stzh-contact-cv::before,.sc-stzh-contact-cv-h *.sc-stzh-contact-cv::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-contact-cv-h .has-focus.sc-stzh-contact-cv{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-contact-cv-h .stzh-fylingfocus-focused.sc-stzh-contact-cv{outline-style:none !important}.sc-stzh-contact-cv-h .stzh-fylingfocus-focused.sc-stzh-contact-cv::-moz-focus-inner{border:0 !important}.stzh-contact-cv.sc-stzh-contact-cv{padding-top:var(--stzh-space-xsmall)}@media screen and (min-width: 600px){.stzh-contact-cv.sc-stzh-contact-cv{padding-top:var(--stzh-space-small)}}@media screen and (min-width: 900px){.stzh-contact-cv.sc-stzh-contact-cv{padding-top:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){.stzh-contact-cv.sc-stzh-contact-cv{padding-top:var(--stzh-space-xlarge)}}.stzh-contact-cv__content-block.sc-stzh-contact-cv{padding-bottom:var(--stzh-space-xsmall)}@media screen and (min-width: 600px){.stzh-contact-cv__content-block.sc-stzh-contact-cv{padding-bottom:var(--stzh-space-small)}}@media screen and (min-width: 900px){.stzh-contact-cv__content-block.sc-stzh-contact-cv{padding-bottom:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){.stzh-contact-cv__content-block.sc-stzh-contact-cv{padding-bottom:var(--stzh-space-xlarge)}}.stzh-contact-cv__content-title.sc-stzh-contact-cv{margin-bottom:0;font-family:var(--stzh-font-family-heavy);font-weight:var(--stzh-font-weight-heavy);font-style:var(--stzh-font-style-heavy)}`;
 

package/dist/components/stzh-contact.js

@@ -1,14 +1,14 @@
-import { p as proxyCustomElement, H, h, F as Fragment, e as Host, t as transformTag } from './p-BBg6OWDc.js';
+import { p as proxyCustomElement, H, h, F as Fragment, e as Host, t as transformTag } from './p-DqjRJcEM.js';
 import { h as hasSlot } from './p-DBHUqFOB.js';
-import { d as defineCustomElement$a } from './p-DEfzwFSm.js';
-import { d as defineCustomElement$9 } from './p-BK6Q89R0.js';
-import { d as defineCustomElement$8 } from './p-BB0rFoJE.js';
-import { d as defineCustomElement$7 } from './p-Bg2ganSs.js';
-import { d as defineCustomElement$6 } from './p-CRo_30JG.js';
-import { d as defineCustomElement$5 } from './p-DrLVNdlm.js';
-import { d as defineCustomElement$4 } from './p-dgzFBTky.js';
-import { d as defineCustomElement$3 } from './p-4Vt8Vqot.js';
-import { d as defineCustomElement$2 } from './p-DT8WI_DQ.js';
+import { d as defineCustomElement$a } from './p-Dn7rMHvA.js';
+import { d as defineCustomElement$9 } from './p-CrQrHbCR.js';
+import { d as defineCustomElement$8 } from './p-Cg2CourL.js';
+import { d as defineCustomElement$7 } from './p-DmbPNk49.js';
+import { d as defineCustomElement$6 } from './p-mPSUVIkD.js';
+import { d as defineCustomElement$5 } from './p-CxqE2nhG.js';
+import { d as defineCustomElement$4 } from './p-BAcc6I3E.js';
+import { d as defineCustomElement$3 } from './p-CIG3atcV.js';
+import { d as defineCustomElement$2 } from './p-BNb1mC_F.js';
 
 const stzhContactCss = () => `.sc-stzh-contact-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-contact-h,[stzh-hidden].sc-stzh-contact-h{display:none}.sc-stzh-contact-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-contact-h *.sc-stzh-contact,.sc-stzh-contact-h *.sc-stzh-contact::before,.sc-stzh-contact-h *.sc-stzh-contact::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-contact-h .has-focus.sc-stzh-contact{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-contact-h .stzh-fylingfocus-focused.sc-stzh-contact{outline-style:none !important}.sc-stzh-contact-h .stzh-fylingfocus-focused.sc-stzh-contact::-moz-focus-inner{border:0 !important}.sc-stzh-contact-h{--grid-template-areas:var(
     --stzh-contact-grid-template-areas,

package/dist/components/stzh-container.js

@@ -1,4 +1,4 @@
-import { S as StzhContainer$1, d as defineCustomElement$1 } from './p-CSqS_CuA.js';
+import { S as StzhContainer$1, d as defineCustomElement$1 } from './p-D653Lsik.js';
 
 const StzhContainer = StzhContainer$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/stzh-content.js

@@ -1,4 +1,4 @@
-import { p as proxyCustomElement, H, h, e as Host, t as transformTag } from './p-BBg6OWDc.js';
+import { p as proxyCustomElement, H, h, e as Host, t as transformTag } from './p-DqjRJcEM.js';
 
 const stzhContentCss = () => `.sc-stzh-content-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-content-h,[stzh-hidden].sc-stzh-content-h{display:none}.sc-stzh-content-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-content-h *.sc-stzh-content,.sc-stzh-content-h *.sc-stzh-content::before,.sc-stzh-content-h *.sc-stzh-content::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-content-h .has-focus.sc-stzh-content{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-content-h .stzh-fylingfocus-focused.sc-stzh-content{outline-style:none !important}.sc-stzh-content-h .stzh-fylingfocus-focused.sc-stzh-content::-moz-focus-inner{border:0 !important}.sc-stzh-content-h{--grid-template-areas:var(
     --stzh-content-grid-template-areas,
@@ -69,7 +69,7 @@ const StzhContent$1 = /*@__PURE__*/ proxyCustomElement(class StzhContent extends
             "stzh-content": true,
             [`stzh-content--${this.variant}`]: !!this.variant,
         };
-        return (h(Host, { key: 'ce7bde7475e7e40a759025463a80ef330d7f5ecc' }, h("div", { key: 'f0d1730ae920a9c69e191d869ffe05535771ae60', class: classes }, h("slot", { key: '9851b4991a04cb2c37d594ffe6b53ff328f3f14b' }))));
+        return (h(Host, { key: '1b2a55927dbb84de40d71bc5274d32de00dbdbdc' }, h("div", { key: '016cc0d01f10af6b83356b596af32418d8e5f28d', class: classes }, h("slot", { key: 'e694990bc015e62fa242fa77fda15907a32cb73a' }))));
     }
     get element() { return this; }
     static get style() { return stzhContentCss(); }

package/dist/components/stzh-cspace.js

@@ -1,4 +1,4 @@
-import { S as StzhCspace$1, d as defineCustomElement$1 } from './p-DPyihiYB.js';
+import { S as StzhCspace$1, d as defineCustomElement$1 } from './p-T-BXBdfL.js';
 
 const StzhCspace = StzhCspace$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/stzh-cta.js

@@ -1,7 +1,7 @@
-import { p as proxyCustomElement, H, d as createEvent, h, e as Host, t as transformTag } from './p-BBg6OWDc.js';
+import { p as proxyCustomElement, H, d as createEvent, h, e as Host, t as transformTag } from './p-DqjRJcEM.js';
 import { h as hasSlot } from './p-DBHUqFOB.js';
-import { d as defineCustomElement$3 } from './p-CRo_30JG.js';
-import { d as defineCustomElement$2 } from './p-DmRzqkUn.js';
+import { d as defineCustomElement$3 } from './p-mPSUVIkD.js';
+import { d as defineCustomElement$2 } from './p-B3JgyjD6.js';
 
 const stzhCtaCss = () => `.sc-stzh-cta-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-cta-h,[stzh-hidden].sc-stzh-cta-h{display:none}.sc-stzh-cta-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-cta-h *.sc-stzh-cta,.sc-stzh-cta-h *.sc-stzh-cta::before,.sc-stzh-cta-h *.sc-stzh-cta::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-cta-h .has-focus.sc-stzh-cta{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-cta-h .stzh-fylingfocus-focused.sc-stzh-cta{outline-style:none !important}.sc-stzh-cta-h .stzh-fylingfocus-focused.sc-stzh-cta::-moz-focus-inner{border:0 !important}.sc-stzh-cta-h{--stzh-flyingfocus-color:var(--stzh-color-white);--background-color:var(--stzh-cta-background-color, var(--stzh-cta-background-color));--heading-color:var(--stzh-color-white);--lead-color:var(--stzh-color-white);--sticky-background-color:var(--background-color);--button-color:var(--stzh-cta-button-color, var(--stzh-color-white));--button-background-color:var(
     --stzh-cta-button-background-color,
@@ -158,7 +158,7 @@ const StzhCta$1 = /*@__PURE__*/ proxyCustomElement(class StzhCta extends H {
             "stzh-cta--has-lead": hasLead,
             [`stzh-cta--size-${size}`]: !!size,
         };
-        return (h(Host, { key: 'e82e065c3e09e032142658590f9005a5c3ac6958', size: size, tabindex: "-1", onFocus: this.onRootFocus }, h("article", { key: 'a60a8650ab35883e42430aae3fb7225601742b8e', class: classes, "data-stzh-sticky-width-container": true }, h("div", { key: '4f5df15b4f4039518216afe7f9a69789f2ef04fb', class: "stzh-cta__wrapper" }, h("div", { key: 'c2f3b930c51ed9b99d3fd1a51bd1de93282be4fe', class: "stzh-cta__heading" }, this.heading ? this.heading : h("slot", { name: "heading" })), h("div", { key: '256397c7b59d522b20f6c0236713389888eadc57', class: "stzh-cta__lead" }, this.lead ? this.lead : h("slot", { name: "lead" })), h("stzh-sticky", { key: '652ef4390bb6c6e7c27e9a5580a7e99ad2fcac9f', name: "cta", class: "stzh-cta__sticky", position: "fixed", bleeding: true, disableStickyBottom: this.stickyDisabled, disableStickyTop: true }, this.renderButtons(size))))));
+        return (h(Host, { key: '6a6d647e702e66838653e567daff93d372468440', size: size, tabindex: "-1", onFocus: this.onRootFocus }, h("article", { key: '6e99f973174184f0ed9224546a48e71780883e2e', class: classes, "data-stzh-sticky-width-container": true }, h("div", { key: '94d7cbbe7999d1f4cef679d4d90b3b967a6102bc', class: "stzh-cta__wrapper" }, h("div", { key: 'db631408f00e5eb08062c838bb0a3ae63f23f8ca', class: "stzh-cta__heading" }, this.heading ? this.heading : h("slot", { name: "heading" })), h("div", { key: '1375925b0f120655b8e10c49016440b16602b374', class: "stzh-cta__lead" }, this.lead ? h("p", null, this.lead) : h("slot", { name: "lead" })), h("stzh-sticky", { key: '99c7dfedb03845d8b340b0c48b31deabb480906d', name: "cta", class: "stzh-cta__sticky", position: "fixed", bleeding: true, disableStickyBottom: this.stickyDisabled, disableStickyTop: true }, this.renderButtons(size))))));
     }
     get element() { return this; }
     static get style() { return stzhCtaCss(); }

package/dist/components/stzh-cta.js.map

@@ -1 +1 @@
-{"file":"stzh-cta.js","mappings":"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","names":["StzhCta","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/stzh-cta/stzh-cta.scss?tag=stzh-cta&encapsulation=scoped","src/components/stzh-cta/stzh-cta.tsx"],"sourcesContent":[":host {\n  --stzh-flyingfocus-color: #{$colorWhite};\n\n  --background-color: var(--stzh-cta-background-color, #{$ctaBackgroundColor});\n  --heading-color: #{$colorWhite};\n  --lead-color: #{$colorWhite};\n  --sticky-background-color: var(--background-color);\n  --button-color: var(--stzh-cta-button-color, #{$colorWhite});\n  --button-background-color: var(\n    --stzh-cta-button-background-color,\n    #{$colorPrimary70}\n  );\n  --button-border-radius: #{$buttonBorderRadius};\n\n  --hover-button-color: var(--stzh-cta-hover-button-color, #{$colorWhite});\n  --hover-button-background-color: var(\n    --stzh-cta-hover-button-background-color,\n    #{$colorSecondary60}\n  );\n\n  --stuck-background-color: #{$colorGrey10};\n  --stuck-heading-color: #{$colorPrimary70};\n  --stuck-lead-color: #{$baseColor};\n  --stuck-sticky-background-color: var(--background-color);\n\n  --grid-template-areas: var(--stzh-cta-grid-template-areas, \"cta cta cta cta\");\n\n  --grid-template-columns: var(\n    --stzh-cta-grid-template-columns,\n    #{$gridColumns}\n  );\n\n  @media print {\n    display: none;\n  }\n\n  @include mq($from: medium) {\n    --grid-template-areas: var(\n      --stzh-cta-grid-template-areas,\n      \"cta cta cta cta cta cta cta cta\"\n    );\n\n    --grid-template-columns: var(\n      --stzh-cta-grid-template-columns,\n      #{$gridColumnsMedium}\n    );\n  }\n\n  @include mq($from: large) {\n    --grid-template-areas: var(\n      --stzh-cta-grid-template-areas,\n      \"cta cta cta cta cta cta cta cta\"\n    );\n\n    --grid-template-columns: var(\n      --stzh-cta-grid-template-columns,\n      repeat(8, minmax(0, 1fr))\n    );\n  }\n\n  &[size=\"small\"] {\n    --button-background-color: transparent;\n    --button-color: var(--stzh-color-white);\n    --hover-button-color: var(--button-color);\n    --hover-button-background-color: var(--button-background-color);\n\n    --stuck-background-color: var(--background-color);\n\n    @include mq($from: small) {\n      --grid-template-areas: var(\n        --stzh-cta-small-grid-template-areas,\n        \"cta cta cta cta\"\n      );\n    }\n\n    @include mq($from: medium) {\n      --grid-template-areas: var(\n        --stzh-cta-small-grid-template-areas,\n        \"cta cta cta cta cta cta cta cta\"\n      );\n    }\n  }\n}\n\n@keyframes stzh-cta-effect {\n  0%,\n  20%,\n  50%,\n  80%,\n  100% {\n    transform: translateX(0);\n  }\n\n  40% {\n    transform: translateX(-8px);\n  }\n\n  60% {\n    transform: translateX(-4px);\n  }\n}\n\n.stzh-cta {\n  @include font(\"heavy\");\n  @include gridGutter;\n  display: grid;\n  grid-template-areas: var(--grid-template-areas);\n  grid-template-columns: var(--grid-template-columns);\n\n  &__wrapper {\n    grid-area: cta;\n    background-color: var(--background-color);\n    transition-property: background-color;\n    transition-duration: $baseTransitionAnimationSpeed;\n\n    @media (forced-colors: active) {\n      outline: 2px solid CanvasText;\n      outline-offset: -2px;\n    }\n  }\n\n  &__wrapper:has(#{&}__sticky[is-stuck]:not([is-stuck=\"false\"])) {\n    background-color: var(--stuck-background-color);\n  }\n\n  &__heading,\n  &__lead {\n    transition-property: color;\n    transition-duration: $baseTransitionAnimationSpeed;\n\n    &:not(:empty) {\n      @include spaceCurve(\"margin-left\", \"medium\");\n      @include spaceCurve(\"margin-right\", \"medium\");\n      @include spaceCurve(\"margin-bottom\", \"medium\");\n\n      @include mq($from: small) {\n        margin-bottom: space(\"xxlarge\");\n      }\n\n      @include mq($from: medium) {\n        margin-bottom: space(\"xxxlarge\");\n      }\n\n      @include mq($from: large) {\n        margin-bottom: space(\"xxxxlarge\");\n      }\n    }\n  }\n\n  &__heading {\n    @include fontCurve(\"h2\", \"heading\");\n    color: var(--heading-color);\n  }\n\n  &__wrapper:has(#{&}__sticky[is-stuck]:not([is-stuck=\"false\"])) &__heading {\n    color: var(--stuck-heading-color);\n  }\n\n  &__lead {\n    @include fontCurve(\"p1\");\n    color: var(--lead-color);\n\n    &:not(:empty) {\n      @include spaceCurve(\"padding-top\", \"small\");\n    }\n  }\n\n  &__wrapper:has(#{&}__sticky[is-stuck]:not([is-stuck=\"false\"])) &__lead {\n    color: var(--stuck-lead-color);\n  }\n\n  &__button {\n    @include font(\"heavy\");\n    @include fontSize(\"centi\");\n    width: 100%;\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    appearance: none;\n    border: none;\n    text-decoration: none;\n    border-radius: var(--button-border-radius);\n    color: var(--button-color);\n    background-color: var(--button-background-color);\n    gap: space(\"xsmall\");\n    transition-property:\n      width, height, min-height, color, background-color, font-size, padding;\n    transition-duration: $baseTransitionAnimationSpeed;\n\n    @include mq($from: small) {\n      width: auto;\n    }\n\n    &:hover {\n      color: var(--hover-button-color);\n      background-color: var(--hover-button-background-color);\n    }\n  }\n\n  &__sticky[is-stuck]:not([is-stuck=\"false\"]) &__button {\n    @include fontSize(\"milli\");\n\n    @include mq($from: medium) {\n      @include fontSize(\"centi\");\n    }\n  }\n\n  &__button-text {\n    display: block;\n  }\n\n  &__button-icon {\n    --size: #{iconSize(\"medium\")};\n  }\n\n  &__button:hover &__button-icon {\n    animation: stzh-cta-effect 1s;\n  }\n\n  &__sticky {\n    @include spaceCurve(\"--padding-left\", \"medium\");\n    @include spaceCurve(\"--padding-right\", \"medium\");\n    --padding-top: #{space(\"large\")};\n    --padding-bottom: #{space(\"large\")};\n    --background-color: var(--sticky-background-color);\n    --stuck-background-color: var(--stuck-sticky-background-color);\n    --stuck-padding-left: 0px;\n    --stuck-padding-right: 0px;\n\n    display: block;\n  }\n\n  &__buttons {\n    display: flex;\n    gap: space(\"medium\");\n  }\n\n  /* Has lead variant */\n\n  &--has-lead &__heading {\n    margin-bottom: 0;\n  }\n\n  /* Default variant; has heading, lead or multiple buttons */\n\n  &--size-default &__wrapper {\n    padding-top: space(\"large\");\n    padding-bottom: space(\"large\");\n\n    @include mq($from: small) {\n      @include spaceCurve(\"padding-top\", \"large\");\n      @include spaceCurve(\"padding-bottom\", \"large\");\n    }\n  }\n\n  &--size-default &__button {\n    padding: space(\"xsmall\") space(\"xlarge\");\n    min-height: $formInputHeight;\n  }\n\n  &--size-default &__button-icon {\n    @include mq($to: small) {\n      display: none;\n    }\n  }\n\n  &--size-default &__sticky[is-stuck]:not([is-stuck=\"false\"]) &__button {\n    min-height: $formInputHeightSmall;\n\n    @include mq($from: medium) {\n      min-height: $formInputHeight;\n    }\n  }\n\n  &--size-default &__sticky {\n    margin-top: calc(var(--padding-top) / -1);\n    margin-bottom: calc(var(--padding-bottom) / -1);\n  }\n\n  /* Small variant; has no heading, lead or multiple buttons */\n\n  &--size-small &__button {\n    width: 100%;\n    max-width: 100%;\n    gap: space(\"medium\");\n\n    &.is-placeholder {\n      width: auto;\n      max-width: none;\n      visibility: hidden;\n      position: absolute;\n      pointer-events: none;\n    }\n  }\n\n  &--size-small\n    &__sticky[is-stuck]:not([is-stuck=\"false\"])\n    &__button:not(.is-placeholder) {\n    width: var(--button-width, auto);\n  }\n\n  &--size-small &__button-icon {\n    --size: #{iconSize(\"large\")};\n  }\n\n  &--size-small &__sticky {\n    @include spaceCurve(\"--padding-top\", \"large\");\n    @include spaceCurve(\"--padding-bottom\", \"large\");\n\n    &[is-stuck]:not([is-stuck=\"false\"]) {\n      @include spaceCurve(\"--padding-top\", \"medium\");\n      @include spaceCurve(\"--padding-bottom\", \"medium\");\n    }\n  }\n\n  /* Not loaded */\n\n  &--is-not-loaded {\n    visibility: hidden;\n  }\n\n  &--is-not-loaded &__wrapper,\n  &--is-not-loaded &__heading,\n  &--is-not-loaded &__lead,\n  &--is-not-loaded &__button {\n    transition-duration: 0ms;\n  }\n}\n","import { Component, Host, h, Element, Prop, State, Event, EventEmitter } from \"@stencil/core\";\n\nimport { StzhCtaFocusEvent, StzhCtaBlurEvent, StzhCtaClickEvent } from \"../../index\";\n\nimport { hasSlot } from \"../../utils/utils\";\n\nvar counter = 0;\n\n/**\n * @slot heading - Slot for heading as alternative for attribute\n * @slot lead - Slot for lead as alternative for attribute\n * @slot label - Slot for button label as alternative for attribute\n */\n@Component({\n  tag: \"stzh-cta\",\n  styleUrl: \"stzh-cta.scss\",\n  scoped: true,\n})\nexport class StzhCta {\n  /** Heading */\n  @Prop() heading: string = \"\";\n\n  /** Lead */\n  @Prop() lead: string = \"\";\n\n  /** Button Label */\n  @Prop() label: string = \"\";\n\n  /** Button link */\n  @Prop() href: string = \"\";\n\n  /**\n   *  Whether sticky button is disabled.\n   *  Will be set to true automatically on,\n   *  when more than one cta is on the page.\n   */\n  @Prop() stickyDisabled: boolean = true;\n\n  @State() loaded: boolean = false;\n\n  @Element() element: HTMLStzhCtaElement;\n\n  /** Focus event */\n  @Event() stzhFocus: EventEmitter<StzhCtaFocusEvent>;\n\n  /** Blur event */\n  @Event() stzhBlur: EventEmitter<StzhCtaBlurEvent>;\n\n  /** Click event */\n  @Event() stzhClick: EventEmitter<StzhCtaClickEvent>;\n\n  private button: HTMLButtonElement | HTMLAnchorElement;\n  private placeholderButton: HTMLElement;\n  private debounceResize: number;\n  private focusedByInput: boolean = false;\n  private placeholderButtonResizeObserver: ResizeObserver;\n\n  private onRootFocus = () => {\n    if (!this.focusedByInput) {\n      this.button.focus();\n    }\n\n    this.focusedByInput = false;\n  };\n\n  private onFocus = (event: FocusEvent) => {\n    this.focusedByInput = true;\n\n    const focusEvent = new FocusEvent(\"focus\", {\n      view: window,\n      bubbles: false,\n      cancelable: false,\n    });\n\n    this.element.dispatchEvent(focusEvent);\n    this.stzhFocus.emit({\n      component: \"stzh-cta\",\n      originalEvent: event,\n    });\n  };\n\n  private onBlur = (event: FocusEvent) => {\n    const blurEvent = new FocusEvent(\"blur\", {\n      view: window,\n      bubbles: false,\n      cancelable: false,\n    });\n\n    this.element.dispatchEvent(blurEvent);\n    this.stzhBlur.emit({\n      component: \"stzh-cta\",\n      originalEvent: event,\n    });\n  };\n\n  private onClick = (event: MouseEvent) => {\n    this.stzhClick.emit({\n      component: \"stzh-cta\",\n      originalEvent: event,\n      href: this.href,\n    });\n  };\n\n  private handlePlaceholderButtonResize = () => {\n    if (this.debounceResize) {\n      window.cancelAnimationFrame(this.debounceResize);\n    }\n\n    this.debounceResize = requestAnimationFrame(this.updateButtonWidthByResize);\n  };\n\n  private updateButtonWidthByResize = () => {\n    if (!this.placeholderButton) {\n      return;\n    }\n\n    const { width } = this.placeholderButton.getBoundingClientRect();\n    this.element.style.setProperty(\"--button-width\", `${width}px`);\n  };\n\n  componentDidLoad() {\n    this.stickyDisabled = counter > 1;\n\n    this.placeholderButtonResizeObserver = new ResizeObserver(this.handlePlaceholderButtonResize);\n    if (this.placeholderButton) {\n      this.placeholderButtonResizeObserver.observe(this.placeholderButton);\n    }\n\n    requestAnimationFrame(() => {\n      requestAnimationFrame(() => {\n        this.updateButtonWidthByResize();\n\n        window.setTimeout(() => {\n          this.loaded = true;\n        }, 250);\n      });\n    });\n  }\n\n  componentDidRender() {\n    if (this.placeholderButton && this.placeholderButtonResizeObserver) {\n      this.placeholderButtonResizeObserver.observe(this.placeholderButton);\n    }\n  }\n\n  connectedCallback() {\n    counter = counter + 1;\n  }\n\n  disconnectedCallback() {\n    // current no way of sending events in disconnected callback, so we just decrease the counter now,\n    // but the user has to set stickyDisabled=false by himself\n    counter = counter - 1;\n\n    this.placeholderButtonResizeObserver?.disconnect();\n  }\n\n  private renderButtons(size: \"default\" | \"small\") {\n    return (\n      <div class=\"stzh-cta__buttons\">\n        {size === \"small\" && (\n          <div class=\"stzh-cta__button is-placeholder\" ref={el => (this.placeholderButton = el as HTMLElement)}>\n            <span class=\"stzh-cta__button-text\">{this.label}</span>\n            <stzh-icon class=\"stzh-cta__button-icon\" name=\"arrow-right\"></stzh-icon>\n          </div>\n        )}\n\n        {this.href ? (\n          <a\n            class=\"stzh-cta__button\"\n            href={this.href}\n            ref={el => (this.button = el as HTMLAnchorElement)}\n            onFocus={this.onFocus}\n            onBlur={this.onBlur}\n            onClick={this.onClick}\n          >\n            <span class=\"stzh-cta__button-text\">{this.label}</span>\n            <stzh-icon class=\"stzh-cta__button-icon\" name=\"arrow-right\"></stzh-icon>\n          </a>\n        ) : (\n          <button\n            class=\"stzh-cta__button\"\n            ref={el => (this.button = el as HTMLButtonElement)}\n            onFocus={this.onFocus}\n            onBlur={this.onBlur}\n          >\n            <span class=\"stzh-cta__button-text\">{this.label}</span>\n            <stzh-icon class=\"stzh-cta__button-icon\" name=\"arrow-right\"></stzh-icon>\n          </button>\n        )}\n      </div>\n    );\n  }\n\n  render() {\n    const headingSlotUsed = hasSlot(this.element, \"heading\");\n    const leadSlotUsed = hasSlot(this.element, \"lead\");\n\n    const hasHeading = !!this.heading || headingSlotUsed;\n    const hasLead = !!this.lead || leadSlotUsed;\n    const hasHeadingOrLead = hasHeading || hasLead;\n\n    const size = !hasHeadingOrLead ? \"small\" : \"default\";\n\n    const classes = {\n      \"stzh-cta\": true,\n      \"stzh-cta--is-sticky-disabled\": this.stickyDisabled,\n      \"stzh-cta--is-not-loaded\": !this.loaded,\n      \"stzh-cta--has-heading\": hasHeading,\n      \"stzh-cta--has-lead\": hasLead,\n      [`stzh-cta--size-${size}`]: !!size,\n    };\n\n    return (\n      <Host size={size} tabindex=\"-1\" onFocus={this.onRootFocus}>\n        <article class={classes} data-stzh-sticky-width-container>\n          <div class=\"stzh-cta__wrapper\">\n            <div class=\"stzh-cta__heading\">{this.heading ? this.heading : <slot name=\"heading\"></slot>}</div>\n            <div class=\"stzh-cta__lead\">{this.lead ? this.lead : <slot name=\"lead\"></slot>}</div>\n            <stzh-sticky\n              name=\"cta\"\n              class=\"stzh-cta__sticky\"\n              position=\"fixed\"\n              bleeding\n              disableStickyBottom={this.stickyDisabled}\n              disableStickyTop={true}\n            >\n              {this.renderButtons(size)}\n            </stzh-sticky>\n          </div>\n        </article>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"stzh-cta.js","mappings":";;;;;AAAA,MAAM,UAAU,GAAG,MAAM,CAAC;AAC1B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,gjcAAgjc,CAAC;;ACrBjjc,IAAI,OAAO,GAAG,CAAC;MAYFA,SAAO,iBAAAC,kBAAA,CAAA,MAAA,OAAA,SAAAC,CAAA,CAAA;AALpB,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;;;;AAOU,QAAA,IAAO,CAAA,OAAA,GAAW,EAAE;;AAGpB,QAAA,IAAI,CAAA,IAAA,GAAW,EAAE;;AAGjB,QAAA,IAAK,CAAA,KAAA,GAAW,EAAE;;AAGlB,QAAA,IAAI,CAAA,IAAA,GAAW,EAAE;AAEzB;;;;AAIG;AACK,QAAA,IAAc,CAAA,cAAA,GAAY,IAAI;AAE7B,QAAA,IAAM,CAAA,MAAA,GAAY,KAAK;AAgBxB,QAAA,IAAc,CAAA,cAAA,GAAY,KAAK;AAG/B,QAAA,IAAW,CAAA,WAAA,GAAG,MAAK;AACzB,YAAA,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE;AACxB,gBAAA,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE;;AAGrB,YAAA,IAAI,CAAC,cAAc,GAAG,KAAK;AAC7B,SAAC;AAEO,QAAA,IAAA,CAAA,OAAO,GAAG,CAAC,KAAiB,KAAI;AACtC,YAAA,IAAI,CAAC,cAAc,GAAG,IAAI;AAE1B,YAAA,MAAM,UAAU,GAAG,IAAI,UAAU,CAAC,OAAO,EAAE;AACzC,gBAAA,IAAI,EAAE,MAAM;AACZ,gBAAA,OAAO,EAAE,KAAK;AACd,gBAAA,UAAU,EAAE,KAAK;AAClB,aAAA,CAAC;AAEF,YAAA,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,UAAU,CAAC;AACtC,YAAA,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC;AAClB,gBAAA,SAAS,EAAE,UAAU;AACrB,gBAAA,aAAa,EAAE,KAAK;AACrB,aAAA,CAAC;AACJ,SAAC;AAEO,QAAA,IAAA,CAAA,MAAM,GAAG,CAAC,KAAiB,KAAI;AACrC,YAAA,MAAM,SAAS,GAAG,IAAI,UAAU,CAAC,MAAM,EAAE;AACvC,gBAAA,IAAI,EAAE,MAAM;AACZ,gBAAA,OAAO,EAAE,KAAK;AACd,gBAAA,UAAU,EAAE,KAAK;AAClB,aAAA,CAAC;AAEF,YAAA,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,SAAS,CAAC;AACrC,YAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC;AACjB,gBAAA,SAAS,EAAE,UAAU;AACrB,gBAAA,aAAa,EAAE,KAAK;AACrB,aAAA,CAAC;AACJ,SAAC;AAEO,QAAA,IAAA,CAAA,OAAO,GAAG,CAAC,KAAiB,KAAI;AACtC,YAAA,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC;AAClB,gBAAA,SAAS,EAAE,UAAU;AACrB,gBAAA,aAAa,EAAE,KAAK;gBACpB,IAAI,EAAE,IAAI,CAAC,IAAI;AAChB,aAAA,CAAC;AACJ,SAAC;AAEO,QAAA,IAA6B,CAAA,6BAAA,GAAG,MAAK;AAC3C,YAAA,IAAI,IAAI,CAAC,cAAc,EAAE;AACvB,gBAAA,MAAM,CAAC,oBAAoB,CAAC,IAAI,CAAC,cAAc,CAAC;;YAGlD,IAAI,CAAC,cAAc,GAAG,qBAAqB,CAAC,IAAI,CAAC,yBAAyB,CAAC;AAC7E,SAAC;AAEO,QAAA,IAAyB,CAAA,yBAAA,GAAG,MAAK;AACvC,YAAA,IAAI,CAAC,IAAI,CAAC,iBAAiB,EAAE;gBAC3B;;YAGF,MAAM,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC,iBAAiB,CAAC,qBAAqB,EAAE;AAChE,YAAA,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,WAAW,CAAC,gBAAgB,EAAE,CAAA,EAAG,KAAK,CAAA,EAAA,CAAI,CAAC;AAChE,SAAC;AAoHF;IAlHC,gBAAgB,GAAA;AACd,QAAA,IAAI,CAAC,cAAc,GAAG,OAAO,GAAG,CAAC;QAEjC,IAAI,CAAC,+BAA+B,GAAG,IAAI,cAAc,CAAC,IAAI,CAAC,6BAA6B,CAAC;AAC7F,QAAA,IAAI,IAAI,CAAC,iBAAiB,EAAE;YAC1B,IAAI,CAAC,+BAA+B,CAAC,OAAO,CAAC,IAAI,CAAC,iBAAiB,CAAC;;QAGtE,qBAAqB,CAAC,MAAK;YACzB,qBAAqB,CAAC,MAAK;gBACzB,IAAI,CAAC,yBAAyB,EAAE;AAEhC,gBAAA,MAAM,CAAC,UAAU,CAAC,MAAK;AACrB,oBAAA,IAAI,CAAC,MAAM,GAAG,IAAI;iBACnB,EAAE,GAAG,CAAC;AACT,aAAC,CAAC;AACJ,SAAC,CAAC;;IAGJ,kBAAkB,GAAA;QAChB,IAAI,IAAI,CAAC,iBAAiB,IAAI,IAAI,CAAC,+BAA+B,EAAE;YAClE,IAAI,CAAC,+BAA+B,CAAC,OAAO,CAAC,IAAI,CAAC,iBAAiB,CAAC;;;IAIxE,iBAAiB,GAAA;AACf,QAAA,OAAO,GAAG,OAAO,GAAG,CAAC;;IAGvB,oBAAoB,GAAA;;;;AAGlB,QAAA,OAAO,GAAG,OAAO,GAAG,CAAC;QAErB,CAAA,EAAA,GAAA,IAAI,CAAC,+BAA+B,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,UAAU,EAAE;;AAG5C,IAAA,aAAa,CAAC,IAAyB,EAAA;QAC7C,QACE,CAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,mBAAmB,EAAA,EAC3B,IAAI,KAAK,OAAO,KACf,WAAK,KAAK,EAAC,iCAAiC,EAAC,GAAG,EAAE,EAAE,KAAK,IAAI,CAAC,iBAAiB,GAAG,EAAiB,CAAC,EAAA,EAClG,CAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAC,uBAAuB,IAAE,IAAI,CAAC,KAAK,CAAQ,EACvD,CAAW,CAAA,WAAA,EAAA,EAAA,KAAK,EAAC,uBAAuB,EAAC,IAAI,EAAC,aAAa,EAAa,CAAA,CACpE,CACP,EAEA,IAAI,CAAC,IAAI,IACR,CAAA,CAAA,GAAA,EAAA,EACE,KAAK,EAAC,kBAAkB,EACxB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,GAAG,EAAE,EAAE,KAAK,IAAI,CAAC,MAAM,GAAG,EAAuB,CAAC,EAClD,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,OAAO,EAAE,IAAI,CAAC,OAAO,EAAA,EAErB,CAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAC,uBAAuB,IAAE,IAAI,CAAC,KAAK,CAAQ,EACvD,CAAA,CAAA,WAAA,EAAA,EAAW,KAAK,EAAC,uBAAuB,EAAC,IAAI,EAAC,aAAa,EAAa,CAAA,CACtE,KAEJ,CAAA,CAAA,QAAA,EAAA,EACE,KAAK,EAAC,kBAAkB,EACxB,GAAG,EAAE,EAAE,KAAK,IAAI,CAAC,MAAM,GAAG,EAAuB,CAAC,EAClD,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,MAAM,EAAE,IAAI,CAAC,MAAM,EAAA,EAEnB,CAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAC,uBAAuB,IAAE,IAAI,CAAC,KAAK,CAAQ,EACvD,CAAA,CAAA,WAAA,EAAA,EAAW,KAAK,EAAC,uBAAuB,EAAC,IAAI,EAAC,aAAa,EAAA,CAAa,CACjE,CACV,CACG;;IAIV,MAAM,GAAA;QACJ,MAAM,eAAe,GAAG,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE,SAAS,CAAC;QACxD,MAAM,YAAY,GAAG,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE,MAAM,CAAC;QAElD,MAAM,UAAU,GAAG,CAAC,CAAC,IAAI,CAAC,OAAO,IAAI,eAAe;QACpD,MAAM,OAAO,GAAG,CAAC,CAAC,IAAI,CAAC,IAAI,IAAI,YAAY;AAC3C,QAAA,MAAM,gBAAgB,GAAG,UAAU,IAAI,OAAO;AAE9C,QAAA,MAAM,IAAI,GAAG,CAAC,gBAAgB,GAAG,OAAO,GAAG,SAAS;AAEpD,QAAA,MAAM,OAAO,GAAG;AACd,YAAA,UAAU,EAAE,IAAI;YAChB,8BAA8B,EAAE,IAAI,CAAC,cAAc;AACnD,YAAA,yBAAyB,EAAE,CAAC,IAAI,CAAC,MAAM;AACvC,YAAA,uBAAuB,EAAE,UAAU;AACnC,YAAA,oBAAoB,EAAE,OAAO;AAC7B,YAAA,CAAC,kBAAkB,IAAI,CAAA,CAAE,GAAG,CAAC,CAAC,IAAI;SACnC;AAED,QAAA,QACE,CAAC,CAAA,IAAI,EAAC,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAE,IAAI,EAAE,QAAQ,EAAC,IAAI,EAAC,OAAO,EAAE,IAAI,CAAC,WAAW,EAAA,EACvD,CAAS,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,OAAO,EAAA,kCAAA,EAAA,IAAA,EAAA,EACrB,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,mBAAmB,EAAA,EAC5B,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,mBAAmB,EAAA,EAAE,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,OAAO,GAAG,YAAM,IAAI,EAAC,SAAS,EAAA,CAAQ,CAAO,EACjG,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,gBAAgB,EAAA,EAAE,IAAI,CAAC,IAAI,GAAG,CAAA,CAAA,GAAA,EAAA,IAAA,EAAI,IAAI,CAAC,IAAI,CAAK,GAAG,YAAM,IAAI,EAAC,MAAM,EAAA,CAAQ,CAAO,EAC9F,CAAA,CAAA,aAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,IAAI,EAAC,KAAK,EACV,KAAK,EAAC,kBAAkB,EACxB,QAAQ,EAAC,OAAO,EAChB,QAAQ,EAAA,IAAA,EACR,mBAAmB,EAAE,IAAI,CAAC,cAAc,EACxC,gBAAgB,EAAE,IAAI,EAAA,EAErB,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,CACb,CACV,CACE,CACL;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["StzhCta","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/stzh-cta/stzh-cta.scss?tag=stzh-cta&encapsulation=scoped","src/components/stzh-cta/stzh-cta.tsx"],"sourcesContent":[":host {\n  --stzh-flyingfocus-color: #{$colorWhite};\n\n  --background-color: var(--stzh-cta-background-color, #{$ctaBackgroundColor});\n  --heading-color: #{$colorWhite};\n  --lead-color: #{$colorWhite};\n  --sticky-background-color: var(--background-color);\n  --button-color: var(--stzh-cta-button-color, #{$colorWhite});\n  --button-background-color: var(\n    --stzh-cta-button-background-color,\n    #{$colorPrimary70}\n  );\n  --button-border-radius: #{$buttonBorderRadius};\n\n  --hover-button-color: var(--stzh-cta-hover-button-color, #{$colorWhite});\n  --hover-button-background-color: var(\n    --stzh-cta-hover-button-background-color,\n    #{$colorSecondary60}\n  );\n\n  --stuck-background-color: #{$colorGrey10};\n  --stuck-heading-color: #{$colorPrimary70};\n  --stuck-lead-color: #{$baseColor};\n  --stuck-sticky-background-color: var(--background-color);\n\n  --grid-template-areas: var(--stzh-cta-grid-template-areas, \"cta cta cta cta\");\n\n  --grid-template-columns: var(\n    --stzh-cta-grid-template-columns,\n    #{$gridColumns}\n  );\n\n  @media print {\n    display: none;\n  }\n\n  @include mq($from: medium) {\n    --grid-template-areas: var(\n      --stzh-cta-grid-template-areas,\n      \"cta cta cta cta cta cta cta cta\"\n    );\n\n    --grid-template-columns: var(\n      --stzh-cta-grid-template-columns,\n      #{$gridColumnsMedium}\n    );\n  }\n\n  @include mq($from: large) {\n    --grid-template-areas: var(\n      --stzh-cta-grid-template-areas,\n      \"cta cta cta cta cta cta cta cta\"\n    );\n\n    --grid-template-columns: var(\n      --stzh-cta-grid-template-columns,\n      repeat(8, minmax(0, 1fr))\n    );\n  }\n\n  &[size=\"small\"] {\n    --button-background-color: transparent;\n    --button-color: var(--stzh-color-white);\n    --hover-button-color: var(--button-color);\n    --hover-button-background-color: var(--button-background-color);\n\n    --stuck-background-color: var(--background-color);\n\n    @include mq($from: small) {\n      --grid-template-areas: var(\n        --stzh-cta-small-grid-template-areas,\n        \"cta cta cta cta\"\n      );\n    }\n\n    @include mq($from: medium) {\n      --grid-template-areas: var(\n        --stzh-cta-small-grid-template-areas,\n        \"cta cta cta cta cta cta cta cta\"\n      );\n    }\n  }\n}\n\n@keyframes stzh-cta-effect {\n  0%,\n  20%,\n  50%,\n  80%,\n  100% {\n    transform: translateX(0);\n  }\n\n  40% {\n    transform: translateX(-8px);\n  }\n\n  60% {\n    transform: translateX(-4px);\n  }\n}\n\n.stzh-cta {\n  @include font(\"heavy\");\n  @include gridGutter;\n  display: grid;\n  grid-template-areas: var(--grid-template-areas);\n  grid-template-columns: var(--grid-template-columns);\n\n  &__wrapper {\n    grid-area: cta;\n    background-color: var(--background-color);\n    transition-property: background-color;\n    transition-duration: $baseTransitionAnimationSpeed;\n\n    @media (forced-colors: active) {\n      outline: 2px solid CanvasText;\n      outline-offset: -2px;\n    }\n  }\n\n  &__wrapper:has(#{&}__sticky[is-stuck]:not([is-stuck=\"false\"])) {\n    background-color: var(--stuck-background-color);\n  }\n\n  &__heading,\n  &__lead {\n    transition-property: color;\n    transition-duration: $baseTransitionAnimationSpeed;\n\n    &:not(:empty) {\n      @include spaceCurve(\"margin-left\", \"medium\");\n      @include spaceCurve(\"margin-right\", \"medium\");\n      @include spaceCurve(\"margin-bottom\", \"medium\");\n\n      @include mq($from: small) {\n        margin-bottom: space(\"xxlarge\");\n      }\n\n      @include mq($from: medium) {\n        margin-bottom: space(\"xxxlarge\");\n      }\n\n      @include mq($from: large) {\n        margin-bottom: space(\"xxxxlarge\");\n      }\n    }\n  }\n\n  &__heading {\n    @include fontCurve(\"h2\", \"heading\");\n    color: var(--heading-color);\n  }\n\n  &__wrapper:has(#{&}__sticky[is-stuck]:not([is-stuck=\"false\"])) &__heading {\n    color: var(--stuck-heading-color);\n  }\n\n  &__lead {\n    @include fontCurve(\"p1\");\n    color: var(--lead-color);\n\n    &:not(:empty) {\n      @include spaceCurve(\"padding-top\", \"small\");\n    }\n  }\n\n  &__wrapper:has(#{&}__sticky[is-stuck]:not([is-stuck=\"false\"])) &__lead {\n    color: var(--stuck-lead-color);\n  }\n\n  &__button {\n    @include font(\"heavy\");\n    @include fontSize(\"centi\");\n    width: 100%;\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    appearance: none;\n    border: none;\n    text-decoration: none;\n    border-radius: var(--button-border-radius);\n    color: var(--button-color);\n    background-color: var(--button-background-color);\n    gap: space(\"xsmall\");\n    transition-property:\n      width, height, min-height, color, background-color, font-size, padding;\n    transition-duration: $baseTransitionAnimationSpeed;\n\n    @include mq($from: small) {\n      width: auto;\n    }\n\n    &:hover {\n      color: var(--hover-button-color);\n      background-color: var(--hover-button-background-color);\n    }\n  }\n\n  &__sticky[is-stuck]:not([is-stuck=\"false\"]) &__button {\n    @include fontSize(\"milli\");\n\n    @include mq($from: medium) {\n      @include fontSize(\"centi\");\n    }\n  }\n\n  &__button-text {\n    display: block;\n  }\n\n  &__button-icon {\n    --size: #{iconSize(\"medium\")};\n  }\n\n  &__button:hover &__button-icon {\n    animation: stzh-cta-effect 1s;\n  }\n\n  &__sticky {\n    @include spaceCurve(\"--padding-left\", \"medium\");\n    @include spaceCurve(\"--padding-right\", \"medium\");\n    --padding-top: #{space(\"large\")};\n    --padding-bottom: #{space(\"large\")};\n    --background-color: var(--sticky-background-color);\n    --stuck-background-color: var(--stuck-sticky-background-color);\n    --stuck-padding-left: 0px;\n    --stuck-padding-right: 0px;\n\n    display: block;\n  }\n\n  &__buttons {\n    display: flex;\n    gap: space(\"medium\");\n  }\n\n  /* Has lead variant */\n\n  &--has-lead &__heading {\n    margin-bottom: 0;\n  }\n\n  /* Default variant; has heading, lead or multiple buttons */\n\n  &--size-default &__wrapper {\n    padding-top: space(\"large\");\n    padding-bottom: space(\"large\");\n\n    @include mq($from: small) {\n      @include spaceCurve(\"padding-top\", \"large\");\n      @include spaceCurve(\"padding-bottom\", \"large\");\n    }\n  }\n\n  &--size-default &__button {\n    padding: space(\"xsmall\") space(\"xlarge\");\n    min-height: $formInputHeight;\n  }\n\n  &--size-default &__button-icon {\n    @include mq($to: small) {\n      display: none;\n    }\n  }\n\n  &--size-default &__sticky[is-stuck]:not([is-stuck=\"false\"]) &__button {\n    min-height: $formInputHeightSmall;\n\n    @include mq($from: medium) {\n      min-height: $formInputHeight;\n    }\n  }\n\n  &--size-default &__sticky {\n    margin-top: calc(var(--padding-top) / -1);\n    margin-bottom: calc(var(--padding-bottom) / -1);\n  }\n\n  /* Small variant; has no heading, lead or multiple buttons */\n\n  &--size-small &__button {\n    width: 100%;\n    max-width: 100%;\n    gap: space(\"medium\");\n\n    &.is-placeholder {\n      width: auto;\n      max-width: none;\n      visibility: hidden;\n      position: absolute;\n      pointer-events: none;\n    }\n  }\n\n  &--size-small\n    &__sticky[is-stuck]:not([is-stuck=\"false\"])\n    &__button:not(.is-placeholder) {\n    width: var(--button-width, auto);\n  }\n\n  &--size-small &__button-icon {\n    --size: #{iconSize(\"large\")};\n  }\n\n  &--size-small &__sticky {\n    @include spaceCurve(\"--padding-top\", \"large\");\n    @include spaceCurve(\"--padding-bottom\", \"large\");\n\n    &[is-stuck]:not([is-stuck=\"false\"]) {\n      @include spaceCurve(\"--padding-top\", \"medium\");\n      @include spaceCurve(\"--padding-bottom\", \"medium\");\n    }\n  }\n\n  /* Not loaded */\n\n  &--is-not-loaded {\n    visibility: hidden;\n  }\n\n  &--is-not-loaded &__wrapper,\n  &--is-not-loaded &__heading,\n  &--is-not-loaded &__lead,\n  &--is-not-loaded &__button {\n    transition-duration: 0ms;\n  }\n}\n","import { Component, Host, h, Element, Prop, State, Event, EventEmitter } from \"@stencil/core\";\n\nimport { StzhCtaFocusEvent, StzhCtaBlurEvent, StzhCtaClickEvent } from \"../../index\";\n\nimport { hasSlot } from \"../../utils/utils\";\n\nvar counter = 0;\n\n/**\n * @slot heading - Slot for heading as alternative for attribute\n * @slot lead - Slot for lead as alternative for attribute\n * @slot label - Slot for button label as alternative for attribute\n */\n@Component({\n  tag: \"stzh-cta\",\n  styleUrl: \"stzh-cta.scss\",\n  scoped: true,\n})\nexport class StzhCta {\n  /** Heading */\n  @Prop() heading: string = \"\";\n\n  /** Lead */\n  @Prop() lead: string = \"\";\n\n  /** Button Label */\n  @Prop() label: string = \"\";\n\n  /** Button link */\n  @Prop() href: string = \"\";\n\n  /**\n   *  Whether sticky button is disabled.\n   *  Will be set to true automatically on,\n   *  when more than one cta is on the page.\n   */\n  @Prop() stickyDisabled: boolean = true;\n\n  @State() loaded: boolean = false;\n\n  @Element() element: HTMLStzhCtaElement;\n\n  /** Focus event */\n  @Event() stzhFocus: EventEmitter<StzhCtaFocusEvent>;\n\n  /** Blur event */\n  @Event() stzhBlur: EventEmitter<StzhCtaBlurEvent>;\n\n  /** Click event */\n  @Event() stzhClick: EventEmitter<StzhCtaClickEvent>;\n\n  private button: HTMLButtonElement | HTMLAnchorElement;\n  private placeholderButton: HTMLElement;\n  private debounceResize: number;\n  private focusedByInput: boolean = false;\n  private placeholderButtonResizeObserver: ResizeObserver;\n\n  private onRootFocus = () => {\n    if (!this.focusedByInput) {\n      this.button.focus();\n    }\n\n    this.focusedByInput = false;\n  };\n\n  private onFocus = (event: FocusEvent) => {\n    this.focusedByInput = true;\n\n    const focusEvent = new FocusEvent(\"focus\", {\n      view: window,\n      bubbles: false,\n      cancelable: false,\n    });\n\n    this.element.dispatchEvent(focusEvent);\n    this.stzhFocus.emit({\n      component: \"stzh-cta\",\n      originalEvent: event,\n    });\n  };\n\n  private onBlur = (event: FocusEvent) => {\n    const blurEvent = new FocusEvent(\"blur\", {\n      view: window,\n      bubbles: false,\n      cancelable: false,\n    });\n\n    this.element.dispatchEvent(blurEvent);\n    this.stzhBlur.emit({\n      component: \"stzh-cta\",\n      originalEvent: event,\n    });\n  };\n\n  private onClick = (event: MouseEvent) => {\n    this.stzhClick.emit({\n      component: \"stzh-cta\",\n      originalEvent: event,\n      href: this.href,\n    });\n  };\n\n  private handlePlaceholderButtonResize = () => {\n    if (this.debounceResize) {\n      window.cancelAnimationFrame(this.debounceResize);\n    }\n\n    this.debounceResize = requestAnimationFrame(this.updateButtonWidthByResize);\n  };\n\n  private updateButtonWidthByResize = () => {\n    if (!this.placeholderButton) {\n      return;\n    }\n\n    const { width } = this.placeholderButton.getBoundingClientRect();\n    this.element.style.setProperty(\"--button-width\", `${width}px`);\n  };\n\n  componentDidLoad() {\n    this.stickyDisabled = counter > 1;\n\n    this.placeholderButtonResizeObserver = new ResizeObserver(this.handlePlaceholderButtonResize);\n    if (this.placeholderButton) {\n      this.placeholderButtonResizeObserver.observe(this.placeholderButton);\n    }\n\n    requestAnimationFrame(() => {\n      requestAnimationFrame(() => {\n        this.updateButtonWidthByResize();\n\n        window.setTimeout(() => {\n          this.loaded = true;\n        }, 250);\n      });\n    });\n  }\n\n  componentDidRender() {\n    if (this.placeholderButton && this.placeholderButtonResizeObserver) {\n      this.placeholderButtonResizeObserver.observe(this.placeholderButton);\n    }\n  }\n\n  connectedCallback() {\n    counter = counter + 1;\n  }\n\n  disconnectedCallback() {\n    // current no way of sending events in disconnected callback, so we just decrease the counter now,\n    // but the user has to set stickyDisabled=false by himself\n    counter = counter - 1;\n\n    this.placeholderButtonResizeObserver?.disconnect();\n  }\n\n  private renderButtons(size: \"default\" | \"small\") {\n    return (\n      <div class=\"stzh-cta__buttons\">\n        {size === \"small\" && (\n          <div class=\"stzh-cta__button is-placeholder\" ref={el => (this.placeholderButton = el as HTMLElement)}>\n            <span class=\"stzh-cta__button-text\">{this.label}</span>\n            <stzh-icon class=\"stzh-cta__button-icon\" name=\"arrow-right\"></stzh-icon>\n          </div>\n        )}\n\n        {this.href ? (\n          <a\n            class=\"stzh-cta__button\"\n            href={this.href}\n            ref={el => (this.button = el as HTMLAnchorElement)}\n            onFocus={this.onFocus}\n            onBlur={this.onBlur}\n            onClick={this.onClick}\n          >\n            <span class=\"stzh-cta__button-text\">{this.label}</span>\n            <stzh-icon class=\"stzh-cta__button-icon\" name=\"arrow-right\"></stzh-icon>\n          </a>\n        ) : (\n          <button\n            class=\"stzh-cta__button\"\n            ref={el => (this.button = el as HTMLButtonElement)}\n            onFocus={this.onFocus}\n            onBlur={this.onBlur}\n          >\n            <span class=\"stzh-cta__button-text\">{this.label}</span>\n            <stzh-icon class=\"stzh-cta__button-icon\" name=\"arrow-right\"></stzh-icon>\n          </button>\n        )}\n      </div>\n    );\n  }\n\n  render() {\n    const headingSlotUsed = hasSlot(this.element, \"heading\");\n    const leadSlotUsed = hasSlot(this.element, \"lead\");\n\n    const hasHeading = !!this.heading || headingSlotUsed;\n    const hasLead = !!this.lead || leadSlotUsed;\n    const hasHeadingOrLead = hasHeading || hasLead;\n\n    const size = !hasHeadingOrLead ? \"small\" : \"default\";\n\n    const classes = {\n      \"stzh-cta\": true,\n      \"stzh-cta--is-sticky-disabled\": this.stickyDisabled,\n      \"stzh-cta--is-not-loaded\": !this.loaded,\n      \"stzh-cta--has-heading\": hasHeading,\n      \"stzh-cta--has-lead\": hasLead,\n      [`stzh-cta--size-${size}`]: !!size,\n    };\n\n    return (\n      <Host size={size} tabindex=\"-1\" onFocus={this.onRootFocus}>\n        <article class={classes} data-stzh-sticky-width-container>\n          <div class=\"stzh-cta__wrapper\">\n            <div class=\"stzh-cta__heading\">{this.heading ? this.heading : <slot name=\"heading\"></slot>}</div>\n            <div class=\"stzh-cta__lead\">{this.lead ? <p>{this.lead}</p> : <slot name=\"lead\"></slot>}</div>\n            <stzh-sticky\n              name=\"cta\"\n              class=\"stzh-cta__sticky\"\n              position=\"fixed\"\n              bleeding\n              disableStickyBottom={this.stickyDisabled}\n              disableStickyTop={true}\n            >\n              {this.renderButtons(size)}\n            </stzh-sticky>\n          </div>\n        </article>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/stzh-datalist-item.js

@@ -1,4 +1,4 @@
-import { S as StzhDatalistItem$1, d as defineCustomElement$1 } from './p-BB0rFoJE.js';
+import { S as StzhDatalistItem$1, d as defineCustomElement$1 } from './p-Cg2CourL.js';
 
 const StzhDatalistItem = StzhDatalistItem$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/stzh-datalist.js

@@ -1,4 +1,4 @@
-import { S as StzhDatalist$1, d as defineCustomElement$1 } from './p-CKLwcqdK.js';
+import { S as StzhDatalist$1, d as defineCustomElement$1 } from './p-BHup0e1i.js';
 
 const StzhDatalist = StzhDatalist$1;
 const defineCustomElement = defineCustomElement$1;