@oiz/stzh-components 3.1.0 → 3.2.0-beta1

package/dist/cjs/stzh-pi-content-navigation.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-92254d32.js');
-const utils = require('./utils-d0fff87f.js');
+const utils = require('./utils-d091c010.js');
 require('./string-utils-5dd70320.js');
 
 const stzhPiContentNavigationCss = ".sc-stzh-pi-content-navigation-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-pi-content-navigation-h{display:none}.sc-stzh-pi-content-navigation-h::-moz-selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-pi-content-navigation-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-pi-content-navigation-h *.sc-stzh-pi-content-navigation,.sc-stzh-pi-content-navigation-h *.sc-stzh-pi-content-navigation::before,.sc-stzh-pi-content-navigation-h *.sc-stzh-pi-content-navigation::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-pi-content-navigation-h .has-focus.sc-stzh-pi-content-navigation{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-pi-content-navigation-h .stzh-fylingfocus-focused.sc-stzh-pi-content-navigation{outline-style:none !important}.sc-stzh-pi-content-navigation-h .stzh-fylingfocus-focused.sc-stzh-pi-content-navigation::-moz-focus-inner{border:0 !important}.sc-stzh-pi-content-navigation-h{--arrow-background-color:var(--stzh-pi-content-navigation-arrow-background-color, var(--stzh-color-secondary30));display:flex;flex-direction:column}.stzh-pi-content-navigation.sc-stzh-pi-content-navigation{position:relative;flex-grow:1;display:flex;flex-direction:column;gap:var(--stzh-space-small);background-color:var(--stzh-color-coolgrey20)}.stzh-pi-content-navigation__wrapper.sc-stzh-pi-content-navigation{padding-left:var(--stzh-space-medium);display:flex;align-items:center;flex-grow:1;padding-top:0.625rem;padding-bottom:0.625rem}@media screen and (min-width: 900px){.stzh-pi-content-navigation__wrapper.sc-stzh-pi-content-navigation{padding-left:var(--stzh-space-large)}}.stzh-pi-content-navigation__image.sc-stzh-pi-content-navigation{width:100%;display:none}.stzh-pi-content-navigation__title.sc-stzh-pi-content-navigation{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-hecto-font-size);line-height:var(--stzh-font-hecto-text-line-height);letter-spacing:var(--stzh-font-hecto-text-letter-spacing);overflow-wrap:break-word;word-wrap:break-word;word-break:break-word;-webkit-hyphens:auto;hyphens:auto;color:var(--stzh-color-black);margin:0}.stzh-pi-content-navigation__title-link.sc-stzh-pi-content-navigation{display:block;font-family:inherit;padding:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:none;color:var(--stzh-color-black);-webkit-text-decoration-line:none;text-decoration-line:none;transition:color var(--stzh-base-transition-animation-speed);border-radius:var(--stzh-button-border-radius);cursor:pointer}.stzh-pi-content-navigation__title-link.sc-stzh-pi-content-navigation::after{content:\"\";display:block;position:absolute;top:0;left:0;width:100%;height:100%}.stzh-pi-content-navigation__title-link.sc-stzh-pi-content-navigation::after{z-index:1}.stzh-pi-content-navigation__lead.sc-stzh-pi-content-navigation{font-size:var(--stzh-font-curve-p2-default-font-size, var(--stzh-font-micro-font-size));line-height:var(--stzh-font-curve-p2-default-text-line-height, var(--stzh-font-micro-text-line-height));margin-top:var(--stzh-space-small);margin-bottom:var(--stzh-space-small)}@media screen and (min-width: 900px){.stzh-pi-content-navigation__lead.sc-stzh-pi-content-navigation{font-size:var(--stzh-font-curve-p2-medium-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-p2-medium-text-line-height, var(--stzh-font-milli-text-line-height));letter-spacing:var(--stzh-font-curve-p2-medium-text-letter-spacing)}}@media screen and (min-width: 900px){.stzh-pi-content-navigation__lead.sc-stzh-pi-content-navigation{margin-top:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){.stzh-pi-content-navigation__lead.sc-stzh-pi-content-navigation{margin-top:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pi-content-navigation__lead.sc-stzh-pi-content-navigation{margin-bottom:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){.stzh-pi-content-navigation__lead.sc-stzh-pi-content-navigation{margin-bottom:var(--stzh-space-large)}}.stzh-pi-content-navigation__arrow.sc-stzh-pi-content-navigation{flex-shrink:0;display:flex;justify-content:center;align-items:center;width:4rem;height:4rem;color:var(--stzh-color-black);background-color:var(--arrow-background-color)}.stzh-pi-content-navigation__arrow-icon.sc-stzh-pi-content-navigation{--size:var(--stzh-icon-size-large)}.stzh-pi-content-navigation.sc-stzh-pi-content-navigation:not(.stzh-pi-content-navigation--is-navigation-level-1-or-2) .stzh-pi-content-navigation__wrapper.sc-stzh-pi-content-navigation{padding-right:var(--stzh-space-small);padding-left:var(--stzh-space-small)}@media screen and (min-width: 900px){.stzh-pi-content-navigation.sc-stzh-pi-content-navigation:not(.stzh-pi-content-navigation--is-navigation-level-1-or-2) .stzh-pi-content-navigation__wrapper.sc-stzh-pi-content-navigation{padding-right:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){.stzh-pi-content-navigation.sc-stzh-pi-content-navigation:not(.stzh-pi-content-navigation--is-navigation-level-1-or-2) .stzh-pi-content-navigation__wrapper.sc-stzh-pi-content-navigation{padding-right:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pi-content-navigation.sc-stzh-pi-content-navigation:not(.stzh-pi-content-navigation--is-navigation-level-1-or-2) .stzh-pi-content-navigation__wrapper.sc-stzh-pi-content-navigation{padding-left:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){.stzh-pi-content-navigation.sc-stzh-pi-content-navigation:not(.stzh-pi-content-navigation--is-navigation-level-1-or-2) .stzh-pi-content-navigation__wrapper.sc-stzh-pi-content-navigation{padding-left:var(--stzh-space-large)}}.stzh-pi-content-navigation.sc-stzh-pi-content-navigation:not(.stzh-pi-content-navigation--is-navigation-level-1-or-2) .stzh-pi-content-navigation__title-ratio.sc-stzh-pi-content-navigation .stzh-pi-content-navigation__title.sc-stzh-pi-content-navigation{padding-right:var(--stzh-space-small);padding-left:var(--stzh-space-small)}@media screen and (min-width: 900px){.stzh-pi-content-navigation.sc-stzh-pi-content-navigation:not(.stzh-pi-content-navigation--is-navigation-level-1-or-2) .stzh-pi-content-navigation__title-ratio.sc-stzh-pi-content-navigation .stzh-pi-content-navigation__title.sc-stzh-pi-content-navigation{padding-right:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){.stzh-pi-content-navigation.sc-stzh-pi-content-navigation:not(.stzh-pi-content-navigation--is-navigation-level-1-or-2) .stzh-pi-content-navigation__title-ratio.sc-stzh-pi-content-navigation .stzh-pi-content-navigation__title.sc-stzh-pi-content-navigation{padding-right:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pi-content-navigation.sc-stzh-pi-content-navigation:not(.stzh-pi-content-navigation--is-navigation-level-1-or-2) .stzh-pi-content-navigation__title-ratio.sc-stzh-pi-content-navigation .stzh-pi-content-navigation__title.sc-stzh-pi-content-navigation{padding-left:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){.stzh-pi-content-navigation.sc-stzh-pi-content-navigation:not(.stzh-pi-content-navigation--is-navigation-level-1-or-2) .stzh-pi-content-navigation__title-ratio.sc-stzh-pi-content-navigation .stzh-pi-content-navigation__title.sc-stzh-pi-content-navigation{padding-left:var(--stzh-space-large)}}.stzh-pi-content-navigation--has-lead.sc-stzh-pi-content-navigation .stzh-pi-content-navigation__wrapper.sc-stzh-pi-content-navigation{padding-right:var(--stzh-space-medium);padding-left:var(--stzh-space-medium);padding-top:var(--stzh-space-medium);padding-bottom:var(--stzh-space-xxlarge);flex-direction:column;align-items:flex-start}@media screen and (min-width: 900px){.stzh-pi-content-navigation--has-lead.sc-stzh-pi-content-navigation .stzh-pi-content-navigation__wrapper.sc-stzh-pi-content-navigation{padding-right:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pi-content-navigation--has-lead.sc-stzh-pi-content-navigation .stzh-pi-content-navigation__wrapper.sc-stzh-pi-content-navigation{padding-left:var(--stzh-space-large)}}@media screen and (min-width: 600px){.stzh-pi-content-navigation--has-lead.sc-stzh-pi-content-navigation .stzh-pi-content-navigation__wrapper.sc-stzh-pi-content-navigation{padding-top:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pi-content-navigation--has-lead.sc-stzh-pi-content-navigation .stzh-pi-content-navigation__wrapper.sc-stzh-pi-content-navigation{padding-top:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-pi-content-navigation--has-lead.sc-stzh-pi-content-navigation .stzh-pi-content-navigation__wrapper.sc-stzh-pi-content-navigation{padding-top:var(--stzh-space-xxlarge)}}@media screen and (min-width: 900px){.stzh-pi-content-navigation--has-lead.sc-stzh-pi-content-navigation .stzh-pi-content-navigation__wrapper.sc-stzh-pi-content-navigation{padding-bottom:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){.stzh-pi-content-navigation--has-lead.sc-stzh-pi-content-navigation .stzh-pi-content-navigation__wrapper.sc-stzh-pi-content-navigation{padding-bottom:var(--stzh-space-xxxxlarge)}}.stzh-pi-content-navigation--has-lead.sc-stzh-pi-content-navigation .stzh-pi-content-navigation__arrow.sc-stzh-pi-content-navigation{position:absolute;right:0;bottom:0;width:2.75rem;height:2.75rem}.stzh-pi-content-navigation--has-image.sc-stzh-pi-content-navigation .stzh-pi-content-navigation__image.sc-stzh-pi-content-navigation{display:block}.stzh-pi-content-navigation__title-ratio.sc-stzh-pi-content-navigation .stzh-ratio.sc-stzh-pi-content-navigation{background-color:var(--stzh-color-coolgrey30)}.stzh-pi-content-navigation__title-ratio.sc-stzh-pi-content-navigation .stzh-pi-content-navigation__title.sc-stzh-pi-content-navigation{display:flex;align-items:center;padding-top:var(--stzh-space-medium);padding-right:var(--stzh-space-medium);padding-bottom:var(--stzh-space-medium);padding-left:var(--stzh-space-medium)}@media screen and (min-width: 600px){.stzh-pi-content-navigation__title-ratio.sc-stzh-pi-content-navigation .stzh-pi-content-navigation__title.sc-stzh-pi-content-navigation{padding-top:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pi-content-navigation__title-ratio.sc-stzh-pi-content-navigation .stzh-pi-content-navigation__title.sc-stzh-pi-content-navigation{padding-top:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-pi-content-navigation__title-ratio.sc-stzh-pi-content-navigation .stzh-pi-content-navigation__title.sc-stzh-pi-content-navigation{padding-top:var(--stzh-space-xxlarge)}}@media screen and (min-width: 900px){.stzh-pi-content-navigation__title-ratio.sc-stzh-pi-content-navigation .stzh-pi-content-navigation__title.sc-stzh-pi-content-navigation{padding-right:var(--stzh-space-large)}}@media screen and (min-width: 600px){.stzh-pi-content-navigation__title-ratio.sc-stzh-pi-content-navigation .stzh-pi-content-navigation__title.sc-stzh-pi-content-navigation{padding-bottom:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pi-content-navigation__title-ratio.sc-stzh-pi-content-navigation .stzh-pi-content-navigation__title.sc-stzh-pi-content-navigation{padding-bottom:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-pi-content-navigation__title-ratio.sc-stzh-pi-content-navigation .stzh-pi-content-navigation__title.sc-stzh-pi-content-navigation{padding-bottom:var(--stzh-space-xxlarge)}}@media screen and (min-width: 900px){.stzh-pi-content-navigation__title-ratio.sc-stzh-pi-content-navigation .stzh-pi-content-navigation__title.sc-stzh-pi-content-navigation{padding-left:var(--stzh-space-large)}}";

package/dist/cjs/stzh-pi-pagetitle.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-92254d32.js');
-const utils = require('./utils-d0fff87f.js');
+const utils = require('./utils-d091c010.js');
 require('./string-utils-5dd70320.js');
 
 const stzhPiPagetitleCss = ".sc-stzh-pi-pagetitle-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-pi-pagetitle-h{display:none}.sc-stzh-pi-pagetitle-h::-moz-selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-pi-pagetitle-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-pi-pagetitle-h *.sc-stzh-pi-pagetitle,.sc-stzh-pi-pagetitle-h *.sc-stzh-pi-pagetitle::before,.sc-stzh-pi-pagetitle-h *.sc-stzh-pi-pagetitle::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-pi-pagetitle-h .has-focus.sc-stzh-pi-pagetitle{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-pi-pagetitle-h .stzh-fylingfocus-focused.sc-stzh-pi-pagetitle{outline-style:none !important}.sc-stzh-pi-pagetitle-h .stzh-fylingfocus-focused.sc-stzh-pi-pagetitle::-moz-focus-inner{border:0 !important}.sc-stzh-pi-pagetitle-h{--hero-background-color:var(--stzh-pi-pagetitle-hero-background-color, var(--stzh-color-primary10));--lead-background-color:var(--stzh-pi-pagetitle-lead-background-color, var(--stzh-color-primary40));--grid-template-areas:\"hero hero hero hero\" \"image-lead-menu image-lead-menu image-lead-menu image-lead-menu\"}@media screen and (min-width: 900px){.sc-stzh-pi-pagetitle-h{--grid-template-areas:\". . hero hero hero hero . .\" \"image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu\"}}@media screen and (min-width: 1260px){.sc-stzh-pi-pagetitle-h{--grid-template-areas:\". . . hero hero hero hero hero hero . . .\" \"image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu image-lead-menu\"}}.sc-stzh-pi-pagetitle-h .sc-stzh-pi-pagetitle-s>[slot=dateline]{font-size:var(--stzh-font-milli-font-size);line-height:var(--stzh-font-milli-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing);font-family:var(--stzh-font-family-heavy);font-weight:var(--stzh-font-weight-heavy);font-style:var(--stzh-font-style-heavy);--color:var(--stzh-color-black80op)}.sc-stzh-pi-pagetitle-h .sc-stzh-pi-pagetitle-s>[slot=heading],.sc-stzh-pi-pagetitle-h .sc-stzh-pi-pagetitle-s>[slot=lead] *,.sc-stzh-pi-pagetitle-h .sc-stzh-pi-pagetitle-s>[slot=breadcrumb]{--color:var(--stzh-color-black)}.sc-stzh-pi-pagetitle-h .sc-stzh-pi-pagetitle-s>[slot=readspeaker] *{--color:var(--stzh-color-coolgrey70);--hover-color:var(--stzh-color-coolgrey70)}.sc-stzh-pi-pagetitle-h .sc-stzh-pi-pagetitle-s>[slot=menu]{--stzh-pi-menu-padding-left:1.25rem}@media screen and (min-width: 600px){.sc-stzh-pi-pagetitle-h .sc-stzh-pi-pagetitle-s>[slot=menu]{--stzh-pi-menu-padding-left:2rem}}@media screen and (min-width: 1260px){.sc-stzh-pi-pagetitle-h .sc-stzh-pi-pagetitle-s>[slot=menu]{--stzh-pi-menu-padding-left:4rem}}@media screen and (min-width: 1600px){.sc-stzh-pi-pagetitle-h .sc-stzh-pi-pagetitle-s>[slot=menu]{--stzh-pi-menu-padding-left:calc((100vw - 84.25rem) / 2)}}.stzh-pi-pagetitle.sc-stzh-pi-pagetitle{margin-bottom:var(--stzh-space-xxlarge)}@media screen and (min-width: 900px){.stzh-pi-pagetitle.sc-stzh-pi-pagetitle{margin-bottom:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle.sc-stzh-pi-pagetitle{margin-bottom:var(--stzh-space-xxxxlarge)}}.stzh-pi-pagetitle__hero-container.sc-stzh-pi-pagetitle{-moz-column-gap:var(--stzh-grid-gutter);column-gap:var(--stzh-grid-gutter);display:grid;grid-template-columns:repeat(4, minmax(0, 1fr));grid-template-areas:var(--grid-template-areas);background-color:var(--hero-background-color);padding-top:var(--stzh-space-medium);padding-left:1.25rem;padding-right:1.25rem}@media screen and (min-width: 600px){.stzh-pi-pagetitle__hero-container.sc-stzh-pi-pagetitle{-moz-column-gap:var(--stzh-grid-gutter-small);column-gap:var(--stzh-grid-gutter-small)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__hero-container.sc-stzh-pi-pagetitle{-moz-column-gap:var(--stzh-grid-gutter-medium);column-gap:var(--stzh-grid-gutter-medium)}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__hero-container.sc-stzh-pi-pagetitle{-moz-column-gap:var(--stzh-grid-gutter-large);column-gap:var(--stzh-grid-gutter-large)}}@media screen and (min-width: 1600px){.stzh-pi-pagetitle__hero-container.sc-stzh-pi-pagetitle{-moz-column-gap:var(--stzh-grid-gutter-ultra);column-gap:var(--stzh-grid-gutter-ultra)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__hero-container.sc-stzh-pi-pagetitle{grid-template-columns:repeat(8, minmax(0, 1fr))}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__hero-container.sc-stzh-pi-pagetitle{grid-template-columns:repeat(12, minmax(0, 1fr))}}@media screen and (min-width: 600px){.stzh-pi-pagetitle__hero-container.sc-stzh-pi-pagetitle{padding-top:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__hero-container.sc-stzh-pi-pagetitle{padding-top:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__hero-container.sc-stzh-pi-pagetitle{padding-top:var(--stzh-space-xxlarge)}}@media screen and (min-width: 600px){.stzh-pi-pagetitle__hero-container.sc-stzh-pi-pagetitle{padding-left:2rem;padding-right:2rem}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__hero-container.sc-stzh-pi-pagetitle{padding-left:2.5rem;padding-right:2.5rem}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__hero-container.sc-stzh-pi-pagetitle{padding-left:4rem;padding-right:4rem}}@media screen and (min-width: 1600px){.stzh-pi-pagetitle__hero-container.sc-stzh-pi-pagetitle{padding-left:calc((100vw - 84.25rem) / 2);padding-right:calc((100vw - 84.25rem) / 2)}}.stzh-pi-pagetitle__image-lead-menu-container.sc-stzh-pi-pagetitle{-moz-column-gap:var(--stzh-grid-gutter);column-gap:var(--stzh-grid-gutter);display:grid;grid-template-columns:repeat(4, minmax(0, 1fr));grid-template-areas:var(--grid-template-areas);background-color:var(--hero-background-color)}@media screen and (min-width: 600px){.stzh-pi-pagetitle__image-lead-menu-container.sc-stzh-pi-pagetitle{-moz-column-gap:var(--stzh-grid-gutter-small);column-gap:var(--stzh-grid-gutter-small)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__image-lead-menu-container.sc-stzh-pi-pagetitle{-moz-column-gap:var(--stzh-grid-gutter-medium);column-gap:var(--stzh-grid-gutter-medium)}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__image-lead-menu-container.sc-stzh-pi-pagetitle{-moz-column-gap:var(--stzh-grid-gutter-large);column-gap:var(--stzh-grid-gutter-large)}}@media screen and (min-width: 1600px){.stzh-pi-pagetitle__image-lead-menu-container.sc-stzh-pi-pagetitle{-moz-column-gap:var(--stzh-grid-gutter-ultra);column-gap:var(--stzh-grid-gutter-ultra)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__image-lead-menu-container.sc-stzh-pi-pagetitle{grid-template-columns:repeat(8, minmax(0, 1fr))}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__image-lead-menu-container.sc-stzh-pi-pagetitle{grid-template-columns:repeat(12, minmax(0, 1fr))}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__image-lead-menu-container.sc-stzh-pi-pagetitle{padding-left:1.25rem;padding-right:1.25rem}}@media screen and (min-width: 900px) and (min-width: 600px){.stzh-pi-pagetitle__image-lead-menu-container.sc-stzh-pi-pagetitle{padding-left:2rem;padding-right:2rem}}@media screen and (min-width: 900px) and (min-width: 900px){.stzh-pi-pagetitle__image-lead-menu-container.sc-stzh-pi-pagetitle{padding-left:2.5rem;padding-right:2.5rem}}@media screen and (min-width: 900px) and (min-width: 1260px){.stzh-pi-pagetitle__image-lead-menu-container.sc-stzh-pi-pagetitle{padding-left:4rem;padding-right:4rem}}@media screen and (min-width: 900px) and (min-width: 1600px){.stzh-pi-pagetitle__image-lead-menu-container.sc-stzh-pi-pagetitle{padding-left:calc((100vw - 84.25rem) / 2);padding-right:calc((100vw - 84.25rem) / 2)}}.stzh-pi-pagetitle__lead-container.sc-stzh-pi-pagetitle{-moz-column-gap:var(--stzh-grid-gutter);column-gap:var(--stzh-grid-gutter);display:grid;grid-template-columns:repeat(4, minmax(0, 1fr));grid-template-areas:\"lead lead lead lead\";background-color:var(--lead-background-color);padding-left:1.25rem;padding-right:1.25rem}@media screen and (min-width: 600px){.stzh-pi-pagetitle__lead-container.sc-stzh-pi-pagetitle{-moz-column-gap:var(--stzh-grid-gutter-small);column-gap:var(--stzh-grid-gutter-small)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__lead-container.sc-stzh-pi-pagetitle{-moz-column-gap:var(--stzh-grid-gutter-medium);column-gap:var(--stzh-grid-gutter-medium)}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__lead-container.sc-stzh-pi-pagetitle{-moz-column-gap:var(--stzh-grid-gutter-large);column-gap:var(--stzh-grid-gutter-large)}}@media screen and (min-width: 1600px){.stzh-pi-pagetitle__lead-container.sc-stzh-pi-pagetitle{-moz-column-gap:var(--stzh-grid-gutter-ultra);column-gap:var(--stzh-grid-gutter-ultra)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__lead-container.sc-stzh-pi-pagetitle{grid-template-columns:repeat(8, minmax(0, 1fr))}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__lead-container.sc-stzh-pi-pagetitle{grid-template-columns:repeat(12, minmax(0, 1fr))}}@media screen and (min-width: 600px){.stzh-pi-pagetitle__lead-container.sc-stzh-pi-pagetitle{padding-left:2rem;padding-right:2rem}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__lead-container.sc-stzh-pi-pagetitle{padding-left:2.5rem;padding-right:2.5rem}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__lead-container.sc-stzh-pi-pagetitle{padding-left:4rem;padding-right:4rem}}@media screen and (min-width: 1600px){.stzh-pi-pagetitle__lead-container.sc-stzh-pi-pagetitle{padding-left:calc((100vw - 84.25rem) / 2);padding-right:calc((100vw - 84.25rem) / 2)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__lead-container.sc-stzh-pi-pagetitle{grid-template-areas:\". . lead lead lead lead lead lead\"}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__lead-container.sc-stzh-pi-pagetitle{grid-template-areas:\". . . lead lead lead lead lead lead . . .\"}}.stzh-pi-pagetitle__image-lead-menu.sc-stzh-pi-pagetitle{grid-area:image-lead-menu;-moz-column-gap:var(--stzh-grid-gutter);column-gap:var(--stzh-grid-gutter);display:grid;grid-template-columns:repeat(4, minmax(0, 1fr));grid-template-areas:\"image image image image\" \"lead lead lead lead\"}@media screen and (min-width: 600px){.stzh-pi-pagetitle__image-lead-menu.sc-stzh-pi-pagetitle{-moz-column-gap:var(--stzh-grid-gutter-small);column-gap:var(--stzh-grid-gutter-small)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__image-lead-menu.sc-stzh-pi-pagetitle{-moz-column-gap:var(--stzh-grid-gutter-medium);column-gap:var(--stzh-grid-gutter-medium)}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__image-lead-menu.sc-stzh-pi-pagetitle{-moz-column-gap:var(--stzh-grid-gutter-large);column-gap:var(--stzh-grid-gutter-large)}}@media screen and (min-width: 1600px){.stzh-pi-pagetitle__image-lead-menu.sc-stzh-pi-pagetitle{-moz-column-gap:var(--stzh-grid-gutter-ultra);column-gap:var(--stzh-grid-gutter-ultra)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__image-lead-menu.sc-stzh-pi-pagetitle{grid-template-columns:repeat(8, minmax(0, 1fr))}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__image-lead-menu.sc-stzh-pi-pagetitle{grid-template-columns:repeat(12, minmax(0, 1fr))}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__image-lead-menu.sc-stzh-pi-pagetitle{grid-template-areas:\". . image image image image image image\" \"lead lead lead lead lead lead lead lead\"}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__image-lead-menu.sc-stzh-pi-pagetitle{grid-template-areas:\". . . image image image image image image image image image\" \"lead lead lead lead lead lead lead lead lead lead lead lead\"}}.stzh-pi-pagetitle__hero.sc-stzh-pi-pagetitle{grid-area:hero}.stzh-pi-pagetitle__menu.sc-stzh-pi-pagetitle{display:none;grid-area:menu}.stzh-pi-pagetitle__image.sc-stzh-pi-pagetitle{grid-area:image}@media screen and (min-width: 900px){.stzh-pi-pagetitle__image.sc-stzh-pi-pagetitle{margin-right:-2.5rem}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__image.sc-stzh-pi-pagetitle{margin-right:-4rem}}@media screen and (min-width: 1600px){.stzh-pi-pagetitle__image.sc-stzh-pi-pagetitle{margin-right:calc((100vw - 84.25rem) / -2)}}.stzh-pi-pagetitle__lead.sc-stzh-pi-pagetitle{--stzh-base-lead-color:var(--stzh-heading-color);grid-area:lead;background-color:var(--lead-background-color);padding-top:var(--stzh-space-medium);padding-bottom:var(--stzh-space-medium)}@media screen and (min-width: 600px){.stzh-pi-pagetitle__lead.sc-stzh-pi-pagetitle{padding-top:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__lead.sc-stzh-pi-pagetitle{padding-top:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__lead.sc-stzh-pi-pagetitle{padding-top:var(--stzh-space-xxlarge)}}@media screen and (min-width: 600px){.stzh-pi-pagetitle__lead.sc-stzh-pi-pagetitle{padding-bottom:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__lead.sc-stzh-pi-pagetitle{padding-bottom:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__lead.sc-stzh-pi-pagetitle{padding-bottom:var(--stzh-space-xxlarge)}}.stzh-pi-pagetitle__text.sc-stzh-pi-pagetitle{padding-top:var(--stzh-space-xxlarge);padding-bottom:var(--stzh-space-xxlarge);display:flex;flex-direction:column;justify-content:center}@media screen and (min-width: 600px){.stzh-pi-pagetitle__text.sc-stzh-pi-pagetitle{padding-top:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__text.sc-stzh-pi-pagetitle{padding-top:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__text.sc-stzh-pi-pagetitle{padding-top:var(--stzh-space-xbig)}}@media screen and (min-width: 600px){.stzh-pi-pagetitle__text.sc-stzh-pi-pagetitle{padding-bottom:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__text.sc-stzh-pi-pagetitle{padding-bottom:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__text.sc-stzh-pi-pagetitle{padding-bottom:var(--stzh-space-xbig)}}.stzh-pi-pagetitle__meta.sc-stzh-pi-pagetitle{display:flex;flex-direction:column-reverse;row-gap:var(--stzh-space-xsmall)}@media screen and (min-width: 900px){.stzh-pi-pagetitle__meta.sc-stzh-pi-pagetitle{flex-direction:row}}.stzh-pi-pagetitle__readspeaker.sc-stzh-pi-pagetitle{margin-bottom:var(--stzh-space-medium)}@media screen and (min-width: 600px){.stzh-pi-pagetitle__readspeaker.sc-stzh-pi-pagetitle{margin-bottom:var(--stzh-space-large)}}@media screen and (min-width: 600px) and (max-width: 899px){.stzh-pi-pagetitle__readspeaker.sc-stzh-pi-pagetitle{--stzh-readspeaker-dropdown-position:relative;--stzh-readspeaker-dropdown-top:auto}}.stzh-pi-pagetitle__dateline.sc-stzh-pi-pagetitle{margin-bottom:var(--stzh-space-xxsmall)}@media screen and (min-width: 900px){.stzh-pi-pagetitle__dateline.sc-stzh-pi-pagetitle{margin-bottom:var(--stzh-space-small)}}@media screen and (min-width: 900px) and (min-width: 900px){.stzh-pi-pagetitle__dateline.sc-stzh-pi-pagetitle{margin-bottom:var(--stzh-space-medium)}}@media screen and (min-width: 900px) and (min-width: 1260px){.stzh-pi-pagetitle__dateline.sc-stzh-pi-pagetitle{margin-bottom:var(--stzh-space-large)}}.stzh-pi-pagetitle__breadcrumbs.sc-stzh-pi-pagetitle{margin-bottom:var(--stzh-space-medium)}@media screen and (min-width: 600px){.stzh-pi-pagetitle__breadcrumbs.sc-stzh-pi-pagetitle{margin-bottom:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__breadcrumbs.sc-stzh-pi-pagetitle{margin-bottom:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__breadcrumbs.sc-stzh-pi-pagetitle{margin-bottom:var(--stzh-space-xxlarge)}}.stzh-pi-pagetitle__heading.sc-stzh-pi-pagetitle{margin-bottom:var(--stzh-space-medium)}@media screen and (min-width: 600px){.stzh-pi-pagetitle__heading.sc-stzh-pi-pagetitle{margin-bottom:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__heading.sc-stzh-pi-pagetitle{margin-bottom:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__heading.sc-stzh-pi-pagetitle{margin-bottom:var(--stzh-space-xxlarge)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__menu-inner.sc-stzh-pi-pagetitle{position:absolute;top:0;right:0;bottom:0;left:0}}.stzh-pi-pagetitle__article-info-wrapper.sc-stzh-pi-pagetitle{margin-left:1.25rem;margin-right:1.25rem;padding-top:var(--stzh-space-xxlarge);-moz-column-gap:var(--stzh-grid-gutter);column-gap:var(--stzh-grid-gutter);display:grid;grid-template-columns:repeat(4, minmax(0, 1fr));grid-template-areas:\"article-info article-info article-info article-info\"}@media screen and (min-width: 600px){.stzh-pi-pagetitle__article-info-wrapper.sc-stzh-pi-pagetitle{margin-left:2rem;margin-right:2rem}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__article-info-wrapper.sc-stzh-pi-pagetitle{margin-left:2.5rem;margin-right:2.5rem}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__article-info-wrapper.sc-stzh-pi-pagetitle{margin-left:4rem;margin-right:4rem}}@media screen and (min-width: 1600px){.stzh-pi-pagetitle__article-info-wrapper.sc-stzh-pi-pagetitle{margin-left:auto;margin-right:auto;max-width:84.25rem}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__article-info-wrapper.sc-stzh-pi-pagetitle{padding-top:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__article-info-wrapper.sc-stzh-pi-pagetitle{padding-top:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 600px){.stzh-pi-pagetitle__article-info-wrapper.sc-stzh-pi-pagetitle{-moz-column-gap:var(--stzh-grid-gutter-small);column-gap:var(--stzh-grid-gutter-small)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__article-info-wrapper.sc-stzh-pi-pagetitle{-moz-column-gap:var(--stzh-grid-gutter-medium);column-gap:var(--stzh-grid-gutter-medium)}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__article-info-wrapper.sc-stzh-pi-pagetitle{-moz-column-gap:var(--stzh-grid-gutter-large);column-gap:var(--stzh-grid-gutter-large)}}@media screen and (min-width: 1600px){.stzh-pi-pagetitle__article-info-wrapper.sc-stzh-pi-pagetitle{-moz-column-gap:var(--stzh-grid-gutter-ultra);column-gap:var(--stzh-grid-gutter-ultra)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__article-info-wrapper.sc-stzh-pi-pagetitle{grid-template-columns:repeat(8, minmax(0, 1fr))}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__article-info-wrapper.sc-stzh-pi-pagetitle{grid-template-columns:repeat(12, minmax(0, 1fr))}}@media screen and (min-width: 900px){.stzh-pi-pagetitle__article-info-wrapper.sc-stzh-pi-pagetitle{grid-template-areas:\". . article-info article-info article-info article-info article-info article-info\"}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle__article-info-wrapper.sc-stzh-pi-pagetitle{grid-template-areas:\". . . article-info article-info article-info article-info article-info article-info article-info article-info article-info\"}}.stzh-pi-pagetitle__article-info.sc-stzh-pi-pagetitle{grid-area:article-info}.stzh-pi-pagetitle__author.sc-stzh-pi-pagetitle{margin-top:0;margin-bottom:var(--stzh-space-xxsmall);color:var(--stzh-color-coolgrey70);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-curve-p1-default-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-p1-default-text-line-height, var(--stzh-font-milli-text-line-height));letter-spacing:var(--stzh-font-curve-p1-default-text-letter-spacing)}@media screen and (min-width: 900px){.stzh-pi-pagetitle__author.sc-stzh-pi-pagetitle{font-size:var(--stzh-font-curve-p1-medium-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-p1-medium-text-line-height, var(--stzh-font-centi-text-line-height));letter-spacing:var(--stzh-font-curve-p1-medium-text-letter-spacing)}}.stzh-pi-pagetitle__date.sc-stzh-pi-pagetitle{margin:0;font-size:var(--stzh-font-curve-p1-default-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-p1-default-text-line-height, var(--stzh-font-milli-text-line-height));letter-spacing:var(--stzh-font-curve-p1-default-text-letter-spacing)}@media screen and (min-width: 900px){.stzh-pi-pagetitle__date.sc-stzh-pi-pagetitle{font-size:var(--stzh-font-curve-p1-medium-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-p1-medium-text-line-height, var(--stzh-font-centi-text-line-height));letter-spacing:var(--stzh-font-curve-p1-medium-text-letter-spacing)}}.stzh-pi-pagetitle--has-menu.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__image-lead-menu.sc-stzh-pi-pagetitle{grid-template-columns:auto repeat(3, minmax(0, 1fr));grid-template-areas:\"menu image image image\" \"menu lead lead lead\"}@media screen and (min-width: 900px){.stzh-pi-pagetitle--has-menu.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__image-lead-menu.sc-stzh-pi-pagetitle{grid-template-columns:repeat(8, minmax(0, 1fr));grid-template-areas:\"menu menu image image image image image image\" \"menu menu lead lead lead lead lead lead\"}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle--has-menu.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__image-lead-menu.sc-stzh-pi-pagetitle{grid-template-columns:repeat(12, minmax(0, 1fr));grid-template-areas:\"menu menu menu image image image image image image image image image\" \"menu menu menu lead lead lead lead lead lead lead lead lead\"}}.stzh-pi-pagetitle--has-menu.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__image-lead-menu-container.sc-stzh-pi-pagetitle{background-color:var(--stzh-color-coolgrey10)}.stzh-pi-pagetitle--has-menu.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__menu.sc-stzh-pi-pagetitle{position:relative;display:inherit;margin-right:calc(var(--stzh-grid-gutter) * -1)}@media screen and (min-width: 600px){.stzh-pi-pagetitle--has-menu.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__menu.sc-stzh-pi-pagetitle{margin-right:calc(var(--stzh-grid-gutter-small) * -1)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle--has-menu.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__menu.sc-stzh-pi-pagetitle{margin-right:calc(var(--stzh-grid-gutter-medium) * -1);margin-left:-2.5rem}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle--has-menu.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__menu.sc-stzh-pi-pagetitle{margin-right:calc(var(--stzh-grid-gutter-large) * -1);margin-left:-4rem}}@media screen and (min-width: 1600px){.stzh-pi-pagetitle--has-menu.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__menu.sc-stzh-pi-pagetitle{margin-right:calc(var(--stzh-grid-gutter-ultra) * -1);margin-left:calc((100vw - 84.25rem) / -2)}}.stzh-pi-pagetitle--has-menu.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__lead.sc-stzh-pi-pagetitle{padding-left:var(--stzh-space-medium)}@media screen and (min-width: 600px){.stzh-pi-pagetitle--has-menu.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__lead.sc-stzh-pi-pagetitle{padding-left:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle--has-menu.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__lead.sc-stzh-pi-pagetitle{padding-left:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle--has-menu.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__lead.sc-stzh-pi-pagetitle{padding-left:var(--stzh-space-xxlarge)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle--has-menu.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__lead.sc-stzh-pi-pagetitle{margin-right:-2.5rem;padding-right:2.5rem}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle--has-menu.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__lead.sc-stzh-pi-pagetitle{margin-right:-4rem;padding-right:4rem}}@media screen and (min-width: 1600px){.stzh-pi-pagetitle--has-menu.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__lead.sc-stzh-pi-pagetitle{margin-right:calc((100vw - 84.25rem) / -2);padding-right:calc((100vw - 84.25rem) / 2)}}.stzh-pi-pagetitle--has-meta.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__text.sc-stzh-pi-pagetitle{padding-top:var(--stzh-space-medium)}@media screen and (min-width: 600px){.stzh-pi-pagetitle--has-meta.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__text.sc-stzh-pi-pagetitle{padding-top:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pi-pagetitle--has-meta.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__text.sc-stzh-pi-pagetitle{padding-top:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-pi-pagetitle--has-meta.sc-stzh-pi-pagetitle .stzh-pi-pagetitle__text.sc-stzh-pi-pagetitle{padding-top:var(--stzh-space-xxlarge)}}.stzh-pi-pagetitle--level-3.sc-stzh-pi-pagetitle,.stzh-pi-pagetitle--level-4.sc-stzh-pi-pagetitle{--hero-background-color:var(--stzh-color-coolgrey20);--lead-background-color:var(--stzh-color-coolgrey30)}";

package/dist/cjs/stzh-pi-teaser.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-92254d32.js');
-const utils = require('./utils-d0fff87f.js');
+const utils = require('./utils-d091c010.js');
 require('./string-utils-5dd70320.js');
 
 const stzhPiTeaserCss = ".sc-stzh-pi-teaser-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-pi-teaser-h{display:none}.sc-stzh-pi-teaser-h::-moz-selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-pi-teaser-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-pi-teaser-h *.sc-stzh-pi-teaser,.sc-stzh-pi-teaser-h *.sc-stzh-pi-teaser::before,.sc-stzh-pi-teaser-h *.sc-stzh-pi-teaser::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-pi-teaser-h .has-focus.sc-stzh-pi-teaser{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-pi-teaser-h .stzh-fylingfocus-focused.sc-stzh-pi-teaser{outline-style:none !important}.sc-stzh-pi-teaser-h .stzh-fylingfocus-focused.sc-stzh-pi-teaser::-moz-focus-inner{border:0 !important}.sc-stzh-pi-teaser-h{--image-background-color:var(--stzh-pi-teaser-image-background-color, var(--stzh-color-primary30));display:flex;flex-direction:column}.stzh-pi-teaser.sc-stzh-pi-teaser{position:relative;flex-grow:1;display:flex;flex-direction:column;background-color:var(--stzh-color-white)}.stzh-pi-teaser__wrapper.sc-stzh-pi-teaser{display:flex;flex-grow:1;padding-right:var(--stzh-space-medium);padding-left:var(--stzh-space-medium);padding-top:var(--stzh-space-medium);padding-bottom:var(--stzh-space-xlarge);flex-direction:column;align-items:flex-start}@media screen and (min-width: 900px){.stzh-pi-teaser__wrapper.sc-stzh-pi-teaser{padding-right:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pi-teaser__wrapper.sc-stzh-pi-teaser{padding-left:var(--stzh-space-large)}}@media screen and (min-width: 600px){.stzh-pi-teaser__wrapper.sc-stzh-pi-teaser{padding-top:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pi-teaser__wrapper.sc-stzh-pi-teaser{padding-top:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-pi-teaser__wrapper.sc-stzh-pi-teaser{padding-top:var(--stzh-space-xxlarge)}}@media screen and (min-width: 900px){.stzh-pi-teaser__wrapper.sc-stzh-pi-teaser{padding-bottom:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){.stzh-pi-teaser__wrapper.sc-stzh-pi-teaser{padding-bottom:var(--stzh-space-xxxlarge)}}.stzh-pi-teaser__image.sc-stzh-pi-teaser{width:100%;display:none}.stzh-pi-teaser__dateline.sc-stzh-pi-teaser{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-curve-p1-default-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-p1-default-text-line-height, var(--stzh-font-milli-text-line-height));letter-spacing:var(--stzh-font-curve-p1-default-text-letter-spacing);color:var(--stzh-color-coolgrey70);margin:0 0 var(--stzh-space-small)}@media screen and (min-width: 900px){.stzh-pi-teaser__dateline.sc-stzh-pi-teaser{font-size:var(--stzh-font-curve-p1-medium-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-p1-medium-text-line-height, var(--stzh-font-centi-text-line-height));letter-spacing:var(--stzh-font-curve-p1-medium-text-letter-spacing)}}.stzh-pi-teaser__title.sc-stzh-pi-teaser{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-hecto-font-size);line-height:var(--stzh-font-hecto-text-line-height);letter-spacing:var(--stzh-font-hecto-text-letter-spacing);overflow-wrap:break-word;word-wrap:break-word;word-break:break-word;-webkit-hyphens:auto;hyphens:auto;color:var(--stzh-color-black);margin:0}.stzh-pi-teaser__title-link.sc-stzh-pi-teaser{display:block;font-family:inherit;padding:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:none;color:var(--stzh-color-black);-webkit-text-decoration-line:none;text-decoration-line:none;transition:color var(--stzh-base-transition-animation-speed);border-radius:var(--stzh-button-border-radius);cursor:pointer}.stzh-pi-teaser__title-link.sc-stzh-pi-teaser::after{content:\"\";display:block;position:absolute;top:0;left:0;width:100%;height:100%}.stzh-pi-teaser__title-link.sc-stzh-pi-teaser::after{z-index:1}.stzh-pi-teaser__lead.sc-stzh-pi-teaser{font-size:var(--stzh-font-milli-font-size);line-height:var(--stzh-font-milli-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing);margin-top:0;margin-bottom:var(--stzh-space-small)}@media screen and (min-width: 900px){.stzh-pi-teaser__lead.sc-stzh-pi-teaser{margin-bottom:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){.stzh-pi-teaser__lead.sc-stzh-pi-teaser{margin-bottom:var(--stzh-space-large)}}.stzh-pi-teaser__date.sc-stzh-pi-teaser{color:var(--stzh-color-coolgrey70);margin:0;text-align:right;width:100%}.stzh-pi-teaser--has-image.sc-stzh-pi-teaser .stzh-pi-teaser__image.sc-stzh-pi-teaser{display:block}.stzh-pi-teaser--has-image.sc-stzh-pi-teaser .stzh-pi-teaser__lead.sc-stzh-pi-teaser{margin-top:var(--stzh-space-small)}@media screen and (min-width: 900px){.stzh-pi-teaser--has-image.sc-stzh-pi-teaser .stzh-pi-teaser__lead.sc-stzh-pi-teaser{margin-top:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){.stzh-pi-teaser--has-image.sc-stzh-pi-teaser .stzh-pi-teaser__lead.sc-stzh-pi-teaser{margin-top:var(--stzh-space-large)}}.stzh-pi-teaser__title-ratio.sc-stzh-pi-teaser{--background-color:var(--image-background-color)}.stzh-pi-teaser__title-ratio.sc-stzh-pi-teaser .stzh-pi-teaser__title-wrapper.sc-stzh-pi-teaser{display:flex;flex-direction:column;padding-top:var(--stzh-space-medium);padding-right:var(--stzh-space-medium);padding-bottom:var(--stzh-space-medium);padding-left:var(--stzh-space-medium)}@media screen and (min-width: 900px){.stzh-pi-teaser__title-ratio.sc-stzh-pi-teaser .stzh-pi-teaser__title-wrapper.sc-stzh-pi-teaser{padding-top:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pi-teaser__title-ratio.sc-stzh-pi-teaser .stzh-pi-teaser__title-wrapper.sc-stzh-pi-teaser{padding-right:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pi-teaser__title-ratio.sc-stzh-pi-teaser .stzh-pi-teaser__title-wrapper.sc-stzh-pi-teaser{padding-bottom:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-pi-teaser__title-ratio.sc-stzh-pi-teaser .stzh-pi-teaser__title-wrapper.sc-stzh-pi-teaser{padding-left:var(--stzh-space-large)}}.stzh-pi-teaser__title-ratio.sc-stzh-pi-teaser .stzh-pi-teaser__dateline.sc-stzh-pi-teaser{margin-bottom:var(--stzh-space-xxsmall)}";

package/dist/cjs/stzh-popover_2.cjs.entry.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-92254d32.js');
 const arrow = require('./arrow-16638ece.js');
 const focusTrap_esm = require('./focus-trap.esm-46ebbbcb.js');
-const utils = require('./utils-d0fff87f.js');
+const utils = require('./utils-d091c010.js');
 const mediaUtils = require('./media-utils-fa9f86b8.js');
 const eventUtils = require('./event-utils-20e7b8b1.js');
 const animationUtils = require('./animation-utils-925ee0e0.js');
@@ -20,57 +20,45 @@ const ANIMATION_HIDE_DURATION_SMALL = 200;
 function animationContentWrapperShow() {
   const isSmall = mediaUtils.media("small").matches;
   return {
-    keyframes: [
-      { opacity: "0" },
-      { opacity: "1" }
-    ],
+    keyframes: [{ opacity: "0" }, { opacity: "1" }],
     options: {
       duration: isSmall ? ANIMATION_SHOW_DURATION_SMALL : ANIMATION_SHOW_DURATION,
-      easing: "linear"
-    }
+      easing: "linear",
+    },
   };
 }
 function animationContentWrapperHide() {
   const isSmall = mediaUtils.media("small").matches;
   return {
-    keyframes: [
-      { opacity: "1" },
-      { opacity: "0" }
-    ],
+    keyframes: [{ opacity: "1" }, { opacity: "0" }],
     options: {
       duration: isSmall ? ANIMATION_HIDE_DURATION_SMALL : ANIMATION_HIDE_DURATION,
-      easing: "linear"
-    }
+      easing: "linear",
+    },
   };
 }
 function animationDialogShow() {
   const isSmall = mediaUtils.media("small").matches;
   return {
-    keyframes: [
-      { transform: isSmall ? "translateY(-8px)" : "translateY(100%)" },
-      { transform: "translateY(0px)" }
-    ],
+    keyframes: [{ transform: isSmall ? "translateY(-8px)" : "translateY(100%)" }, { transform: "translateY(0px)" }],
     options: {
       duration: isSmall ? ANIMATION_SHOW_DURATION_SMALL : ANIMATION_SHOW_DURATION,
-      easing: "linear"
-    }
+      easing: "linear",
+    },
   };
 }
 function animationDialogHide() {
   const isSmall = mediaUtils.media("small").matches;
   return {
-    keyframes: [
-      { transform: "translateY(0px)" },
-      { transform: isSmall ? "translateY(-8px)" : "translateY(100%)" }
-    ],
+    keyframes: [{ transform: "translateY(0px)" }, { transform: isSmall ? "translateY(-8px)" : "translateY(100%)" }],
     options: {
       duration: isSmall ? ANIMATION_HIDE_DURATION_SMALL : ANIMATION_HIDE_DURATION,
-      easing: "linear"
-    }
+      easing: "linear",
+    },
   };
 }
 const keyCode = {
-  ESC: 27
+  ESC: 27,
 };
 const CLASS_BODY_OPEN = "stzh-popover-open";
 let popoverCounter = 0;
@@ -83,6 +71,14 @@ const StzhPopover = class {
     this.stzhClosed = index.createEvent(this, "stzhClosed", 7);
     this.initialTouchX = null;
     this.initialTouchY = null;
+    this.mediaChangeHandler = () => {
+      const isStzhHeaderStuck = document.documentElement.style.getPropertyValue("--stzh-header-is-stuck");
+      this.isHeaderStuckAndViewportMicro =
+        !mediaUtils.media("small").matches && isStzhHeaderStuck === "1" && this.hasStzhHeaderParent;
+      if (this.open && this.isBranchedOutToBody && !this.isHeaderStuckAndViewportMicro) {
+        this.branchInFromBody();
+      }
+    };
     this.handleKeydown = (event) => {
       if (event.keyCode === keyCode.ESC) {
         this.hide();
@@ -96,22 +92,22 @@ const StzhPopover = class {
         const middleware = [
           arrow.offset({
             mainAxis: this.distance,
-            crossAxis: this.skidding
+            crossAxis: this.skidding,
           }),
           arrow.flip({
-            padding: 5
+            padding: 5,
           }),
           arrow.shift({
-            padding: 5
-          })
+            padding: 5,
+          }),
         ];
         if (this.variant === "tooltip") {
           middleware.push(arrow.arrow({
             element: this.arrowElement,
-            padding: 5
+            padding: 5,
           }));
         }
-        const { x = 0, y = 0, strategy = "absolute", placement, middlewareData } = await arrow.computePosition(this.triggerFirstElement, this.dialogElement, {
+        const { x = 0, y = 0, strategy = "absolute", placement, middlewareData, } = await arrow.computePosition(this.triggerFirstElement, this.dialogElement, {
           strategy: this.strategy,
           placement: this.placement,
           middleware,
@@ -156,8 +152,7 @@ const StzhPopover = class {
       const distX = touch.pageX - this.initialTouchX; // get horizontal dist traveled
       const distY = touch.pageY - this.initialTouchY; // get vertical dist traveled
       const threshold = 70;
-      const isYSwipe = Math.abs(distY) >= threshold
-        && Math.abs(distX) <= threshold;
+      const isYSwipe = Math.abs(distY) >= threshold && Math.abs(distX) <= threshold;
       if (isYSwipe) {
         this.hide();
       }
@@ -168,8 +163,7 @@ const StzhPopover = class {
       var _a;
       let trigger = (_a = this.triggerElement) === null || _a === void 0 ? void 0 : _a.firstElementChild;
       if (!trigger) {
-        const defaultSlot = Array.from(this.element.children)
-          .find(child => !child.hasAttribute("slot"));
+        const defaultSlot = Array.from(this.element.children).find(child => !child.hasAttribute("slot"));
         trigger = defaultSlot;
       }
       if (trigger) {
@@ -188,12 +182,19 @@ const StzhPopover = class {
     this.strategy = "absolute";
     this.localization = undefined;
     this.computedPlacement = undefined;
+    this.isHeaderStuckAndViewportMicro = undefined;
+    this.isBranchedOutToBody = undefined;
+    this.hasStzhHeaderParent = undefined;
   }
   /** Show popover content */
   async show() {
     if (this.open) {
       return;
     }
+    this.mediaChangeHandler();
+    if (this.isHeaderStuckAndViewportMicro) {
+      this.branchOutToBody();
+    }
     this.toggledByMethod = true;
     this.open = true;
     return eventUtils.waitForEvent(this.element, "stzhOpened");
@@ -205,7 +206,12 @@ const StzhPopover = class {
     }
     this.toggledByMethod = true;
     this.open = false;
-    return eventUtils.waitForEvent(this.element, "stzhClosed");
+    await eventUtils.waitForEvent(this.element, "stzhClosed");
+    this.mediaChangeHandler();
+    if (this.isHeaderStuckAndViewportMicro) {
+      this.branchInFromBody();
+    }
+    return true;
   }
   /** Toggle popover content */
   async toggle() {
@@ -223,10 +229,8 @@ const StzhPopover = class {
     if (!this.open) {
       return;
     }
-    const isClickOutside = event.target !== this.dialogElement
-      && this.dialogElement.contains(event.target) === false;
-    const isClickTrigger = event.target === this.triggerElement
-      || this.triggerElement.contains(event.target);
+    const isClickOutside = event.target !== this.dialogElement && this.dialogElement.contains(event.target) === false;
+    const isClickTrigger = event.target === this.triggerElement || this.triggerElement.contains(event.target);
     if (isClickOutside && !isClickTrigger) {
       this.hide();
     }
@@ -246,7 +250,7 @@ const StzhPopover = class {
       await Promise.all([
         animationUtils.stopAnimations(this.contentWrapperElement),
         animationUtils.stopAnimations(this.contentElement),
-        animationUtils.stopAnimations(this.dialogElement)
+        animationUtils.stopAnimations(this.dialogElement),
       ]);
       // safari seems to need will-change,
       // otherwise it has problems animating the element with the drop shadow
@@ -254,11 +258,11 @@ const StzhPopover = class {
       this.contentWrapperElement.hidden = false;
       await Promise.all([
         animationUtils.animateTo(mediaUtils.media("small").matches ? this.dialogElement : this.contentWrapperElement, animationShow.keyframes, animationShow.options),
-        animationUtils.animateTo(mediaUtils.media("small").matches ? this.dialogElement : this.contentElement, animationShowDialog.keyframes, animationShowDialog.options)
+        animationUtils.animateTo(mediaUtils.media("small").matches ? this.dialogElement : this.contentElement, animationShowDialog.keyframes, animationShowDialog.options),
       ]);
       if (this.toggledByMethod) {
         this.stzhOpened.emit({
-          component: "stzh-popover"
+          component: "stzh-popover",
         });
       }
     }
@@ -273,7 +277,7 @@ const StzhPopover = class {
       await Promise.all([
         animationUtils.stopAnimations(this.contentWrapperElement),
         animationUtils.stopAnimations(this.contentElement),
-        animationUtils.stopAnimations(this.dialogElement)
+        animationUtils.stopAnimations(this.dialogElement),
       ]);
       await Promise.all([
         animationUtils.animateTo(mediaUtils.media("small").matches ? this.dialogElement : this.contentWrapperElement, animationHide.keyframes, animationHide.options),
@@ -283,7 +287,7 @@ const StzhPopover = class {
       this.dialogElement.style.willChange = "auto";
       if (this.toggledByMethod) {
         this.stzhClosed.emit({
-          component: "stzh-popover"
+          component: "stzh-popover",
         });
       }
     }
@@ -297,8 +301,30 @@ const StzhPopover = class {
       this.distance = this.variant === "tooltip" ? 12 : 8;
     }
   }
+  setStzhHeaderParent() {
+    let parent = this.element.parentElement;
+    while (parent) {
+      if (parent.tagName && parent.tagName.toLowerCase() === "stzh-header") {
+        return true;
+      }
+      parent = parent.parentElement;
+    }
+    return false;
+  }
+  branchOutToBody() {
+    document.body.append(this.element);
+    this.parentNode.appendChild(this.triggerElement);
+    this.isBranchedOutToBody = true;
+  }
+  branchInFromBody() {
+    this.parentNode.appendChild(this.element);
+    this.rootElement.prepend(this.triggerElement);
+    this.isBranchedOutToBody = false;
+  }
   async componentWillLoad() {
     this.id = `stzh-popover-${popoverCounter++}`;
+    this.parentNode = this.element.parentNode;
+    this.hasStzhHeaderParent = this.setStzhHeaderParent();
     this.distanceWatcher(this.distance);
     if (!this.localization) {
       this.localization = await window.stzhComponents.utils.fetchTranslations(this.element, "popover");
@@ -307,8 +333,7 @@ const StzhPopover = class {
   popoverShown() {
     document.body.classList.add(CLASS_BODY_OPEN);
     const isStzh = utils.isStzhElement(this.triggerFirstElement);
-    this.triggerFirstElement
-      .setAttribute(isStzh ? "a11y-expanded" : "aria-expanded", "true");
+    this.triggerFirstElement.setAttribute(isStzh ? "a11y-expanded" : "aria-expanded", "true");
     if (this.trap) {
       this.trap.activate();
     }
@@ -316,30 +341,27 @@ const StzhPopover = class {
   popoverHidden() {
     document.body.classList.remove(CLASS_BODY_OPEN);
     const isStzh = utils.isStzhElement(this.triggerFirstElement);
-    this.triggerFirstElement
-      .setAttribute(isStzh ? "a11y-expanded" : "aria-expanded", "false");
+    this.triggerFirstElement.setAttribute(isStzh ? "a11y-expanded" : "aria-expanded", "false");
     if (this.trap) {
       this.trap.deactivate();
     }
   }
   componentDidRender() {
     this.computePosition();
+    this.mediaChangeHandler();
     this.open ? this.popoverShown() : this.popoverHidden();
     const isStzh = utils.isStzhElement(this.triggerFirstElement);
-    if ((isStzh && !this.triggerFirstElement.getAttribute("a11y-describedby"))
-      || (!isStzh && !this.triggerFirstElement.getAttribute("aria-describedby"))) {
-      this.triggerFirstElement
-        .setAttribute(isStzh ? "a11y-describedby" : "aria-describedby", `${this.id}-trigger-description`);
+    if ((isStzh && !this.triggerFirstElement.getAttribute("a11y-describedby")) ||
+      (!isStzh && !this.triggerFirstElement.getAttribute("aria-describedby"))) {
+      this.triggerFirstElement.setAttribute(isStzh ? "a11y-describedby" : "aria-describedby", `${this.id}-trigger-description`);
     }
-    if ((isStzh && !this.triggerFirstElement.getAttribute("a11y-label"))
-      || (!isStzh && !this.triggerFirstElement.getAttribute("aria-label"))) {
-      this.triggerFirstElement
-        .setAttribute(isStzh ? "a11y-label" : "aria-label", this.label);
+    if ((isStzh && !this.triggerFirstElement.getAttribute("a11y-label")) ||
+      (!isStzh && !this.triggerFirstElement.getAttribute("aria-label"))) {
+      this.triggerFirstElement.setAttribute(isStzh ? "a11y-label" : "aria-label", this.label);
     }
-    if ((isStzh && !this.triggerFirstElement.getAttribute("analytics-id"))
-      || (!isStzh && !this.triggerFirstElement.getAttribute("s-object-id"))) {
-      this.triggerFirstElement
-        .setAttribute(isStzh ? "analytics-id" : "s-object-id", this.label);
+    if ((isStzh && !this.triggerFirstElement.getAttribute("analytics-id")) ||
+      (!isStzh && !this.triggerFirstElement.getAttribute("s-object-id"))) {
+      this.triggerFirstElement.setAttribute(isStzh ? "analytics-id" : "s-object-id", this.label);
     }
   }
   componentDidUpdate() {
@@ -351,21 +373,23 @@ const StzhPopover = class {
     this.trap = focusTrap_esm.createFocusTrap(this.dialogElement, {
       fallbackFocus: this.dialogElement,
       clickOutsideDeactivates: true,
-      returnFocusOnDeactivate: true
+      returnFocusOnDeactivate: true,
     });
     if (this.open) {
       this.popoverShown();
     }
   }
   connectedCallback() {
+    mediaUtils.addMediaChangeListener(this.mediaChangeHandler);
     this.init();
     this.observer = new MutationObserver(this.init);
     this.observer.observe(this.element, {
       childList: true,
-      subtree: true
+      subtree: true,
     });
   }
   disconnectedCallback() {
+    mediaUtils.removeMediaChangeListener(this.mediaChangeHandler);
     if (this.observer) {
       this.observer.disconnect();
     }
@@ -383,10 +407,9 @@ const StzhPopover = class {
       [`stzh-popover--placement-${this.computedPlacement}`]: !!this.computedPlacement,
       [`stzh-popover--fullwidth-${this.fullwidth}`]: !!this.fullwidth,
       [`stzh-popover--${this.size}`]: !!this.size,
-      [`stzh-popover--${this.variant}`]: !!this.variant
+      [`stzh-popover--${this.variant}`]: !!this.variant,
     };
-    return (index.h(index.Host, null, index.h("div", { class: classes, onTouchStart: this.handleTouchStart, onTouchEnd: this.handleTouchEnd }, index.h("div", { ref: (el) => (this.triggerElement = el), class: "stzh-popover__trigger" }, index.h("slot", null)), index.h("div", { class: "stzh-popover__vhidden", id: `${this.id}-trigger-description` }, this.localization.open), index.h("div", { ref: (el) => (this.contentWrapperElement = el), class: "stzh-popover__content-wrapper" }, index.h("div", { class: "stzh-popover__backdrop" }), index.h("div", { ref: (el) => (this.contentElement = el), class: "stzh-popover__content" }, index.h("div", { ref: (el) => (this.dialogElement = el), class: "stzh-popover__dialog", role: "dialog", tabindex: "-1", "aria-modal": "true", "aria-labelledby": this.label ? `${this.id}-label` : null, "aria-hidden": this.open ? "false" : "true", onKeyDown: this.handleKeydown }, this.variant === "tooltip" &&
-      index.h("div", { class: "stzh-popover__arrow", ref: (el) => (this.arrowElement = el), innerHTML: arrow.Arrow }), index.h("div", { class: "stzh-popover__content-inner" }, index.h("div", { class: "stzh-popover__label-wrapper" }, index.h("h2", { id: `${this.id}-label`, class: "stzh-popover__label" }, this.label ? this.label : index.h("slot", { name: "label" })), index.h("button", { class: "stzh-popover__close", onClick: () => this.hide(), type: "button" }, index.h("stzh-icon", { name: "close", class: "stzh-popover__icon" }), index.h("span", { class: "stzh-popover__vhidden" }, this.localization.close))), index.h("div", { class: "stzh-popover__content-slot-wrapper" }, index.h("div", { class: "stzh-popover__content-slot" }, index.h("slot", { name: "content" })), index.h("div", { class: "stzh-popover__action-slot" }, index.h("slot", { name: "action" }))))))))));
+    return (index.h(index.Host, null, index.h("div", { class: classes, onTouchStart: this.handleTouchStart, onTouchEnd: this.handleTouchEnd, ref: el => (this.rootElement = el) }, index.h("div", { ref: el => (this.triggerElement = el), class: "stzh-popover__trigger" }, index.h("slot", null)), index.h("div", { class: "stzh-popover__vhidden", id: `${this.id}-trigger-description` }, this.localization.open), index.h("div", { ref: el => (this.contentWrapperElement = el), class: "stzh-popover__content-wrapper" }, index.h("div", { class: "stzh-popover__backdrop" }), index.h("div", { ref: el => (this.contentElement = el), class: "stzh-popover__content" }, index.h("div", { ref: el => (this.dialogElement = el), class: "stzh-popover__dialog", role: "dialog", tabindex: "-1", "aria-modal": "true", "aria-labelledby": this.label ? `${this.id}-label` : null, "aria-hidden": this.open ? "false" : "true", onKeyDown: this.handleKeydown }, this.variant === "tooltip" && (index.h("div", { class: "stzh-popover__arrow", ref: el => (this.arrowElement = el), innerHTML: arrow.Arrow })), index.h("div", { class: "stzh-popover__content-inner" }, index.h("div", { class: "stzh-popover__label-wrapper" }, index.h("h2", { id: `${this.id}-label`, class: "stzh-popover__label" }, this.label ? this.label : index.h("slot", { name: "label" })), index.h("button", { class: "stzh-popover__close", onClick: () => this.hide(), type: "button" }, index.h("stzh-icon", { name: "close", class: "stzh-popover__icon" }), index.h("span", { class: "stzh-popover__vhidden" }, this.localization.close))), index.h("div", { class: "stzh-popover__content-slot-wrapper" }, index.h("div", { class: "stzh-popover__content-slot" }, index.h("slot", { name: "content" })), index.h("div", { class: "stzh-popover__action-slot" }, index.h("slot", { name: "action" }))))))))));
   }
   get element() { return index.getElement(this); }
   static get watchers() { return {