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

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

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

Files changed (258) hide show

package/dist/stzh-components/p-4cff0c86.entry.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"names":["stzhHeaderCss","CLASS_BODY_OPEN","StzhHeader","this","lastOpener","flyoutOpenedByMetanavItem","handleMenuListFocusout","event","isNextFocusOutOfMenuList","currentTarget","contains","relatedTarget","isMedium","closeMenuItem","handleBurgerClick","async","closeMetanavItem","flyoutOpen","element","querySelector","window","setTimeout","focus","updatePosition","handleBackdropClick","handleMetanavItemClick","item","stzhMetanavItemClick","emit","component","originalEvent","handleSearchInput","searchValue","searchInput","value","stzhSearchChange","handleSearchChange","stzhSearchChanged","handleLanguageClick","dropdownOption","languagePreventUrlchange","preventDefault","languageActive","stzhLanguageChange","handleFlyoutResize","resizeMenunavElement","handleResize","sticky","debounceResize","cancelAnimationFrame","requestAnimationFrame","readTask","media","matches","mainHeight","_a","mainElement","offsetHeight","metabarHeight","_b","metabarElement","logobarHeight","_c","logobarElement","headerTop","offsetTop","headerHeight","writeTask","document","documentElement","style","setProperty","scrollListener","handleKeydown","key","flyoutOpenWatcher","open","currentOpenMenuItem","currentOpenMetanavItem","currentOpenLanguage","body","classList","remove","enableSiblings","trap","deactivate","add","disableSiblings","activate","fixedWatcher","paddingTop","fixed","waitForNextRender","fixedTransition","stickyWatcher","stickyActive","scrollingUp","belowStayStickyPoint","belowStartStickyPoint","currentScrollY","scrollY","lastScrollY","headerOverlap","hideLogo","searchValueWatcher","newValue","searchFilled","menuItemsWatcher","_menuItems","JSON","parse","map","menuItem","index","Object","assign","id","metanavItemsWatcher","_metanavItems","metanavItem","languagesWatcher","_languages","getSiblings","parentElement","Array","from","children","filter","child","forEach","sibling","setAttribute","removeAttribute","Promise","resolve","renderPromiseResolve","openSubmenuElement","menunavElement","height","getBoundingClientRect","openMenuItem","scrollTop","firstButtonOrLink","tabbable","focusOpener","openMetanavItem","openMetanavSubmenuElement","openLanguage","closeLanguage","componentWillLoad","menuItems","metanavItems","languages","localization","stzhComponents","utils","fetchTranslations","componentDidRender","flyoutElement","flyoutResizeObserver","observe","componentDidLoad","createFocusTrap","createBaseFocusTrapOptions","initialFocus","ResizeObserver","connectedCallback","resizeObserver","disconnectedCallback","disconnect","render","metanavBeforeUsed","hasSlot","metanavAfterUsed","classes","stay","stayAndShowInMobileMenu","length","languageStay","searchAction","activeLanguage","getLocale","activeLanguageOption","find","renderMetanavItemButton","additionalClasses","additionalAttributes","Element","items","itemButton","href","h","target","class","important","labelHidden","labelShort","label","icon","iconOpen","name","badge","badgeEmpty","type","badgeType","Host","ref","el","logoAnalyticsId","menuId","onClick","menuLabel","action","role","searchId","searchFieldName","onChange","onInput","searchLabel","metanavId","Fragment","e","placement","distance","variant","size","slot","childItem","importantSubmenu","counter","languageId","languageLabel","text","language","active","navigationLabel","onFocusout","menuBackLabel","_d","_e","iconOnly","closeMetanavMenuLabel","replace","_f","dialogLanguageTitle"],"sources":["src/components/stzh-header/stzh-header.scss?tag=stzh-header&encapsulation=scoped","src/components/stzh-header/stzh-header.tsx"],"sourcesContent":["/**\n * @prop --logo-width: Width of logo\n * @prop --logo-height: Height of logo\n * @prop --logobar-background-color: Background color of logobar\n * @prop --stzh-header-logobar-background-color: **Global**: Background color of logobar\n *\n * @prop --stzh-header-height: **Global**: Height of header (readonly variable on `<html>`)\n * @prop --stzh-header-main-height: **Global**: Height of main header part (readonly variable on `<html>`)\n * @prop --stzh-header-metabar-height: **Global**: Height of metabar header (readonly variable on `<html>`)\n * @prop --stzh-header-logobar-height: **Global**: Height of logobar header (readonly variable on `<html>`)\n * @prop --stzh-header-is-stuck: **Global**: Whether head is currently sticky (readonly variable on `<html>`)\n * @prop --stzh-header-is-not-stuck: **Global**: Whether head is currently not sticky (readonly variable on `<html>`)\n */\n\n:host {\n --logo-width: auto;\n --logo-height: 100%;\n --logobar-background-color: #{$headerLogobarBackgroundColor};\n\n @media print {\n display: none;\n }\n\n &[logo-type=\"vbz\"],\n &[logo-type=\"aoz\"],\n &[logo-type=\"pkzh\"],\n &[logo-type=\"uvz\"] {\n --logo-height: 31px;\n\n @include mq($from: medium) {\n --logo-height: 35px;\n }\n\n @include mq($from: ultra) {\n --logo-height: 53px;\n }\n }\n\n ::slotted([slot=\"logo\"]) {\n width: var(--logo-width);\n height: var(--logo-height);\n }\n}\n\n.stzh-header {\n @include fontSize('milli');\n color: $colorGrey90;\n\n &__inner,\n &__main {\n max-width: calc(100vw - var(--stzh-scrollbar-width));\n // transition-property: box-shadow;\n // transition-duration: $baseTransitionAnimationSpeed;\n }\n\n &__inner {\n @include mq($from: small) {\n position: relative;\n z-index: $zIndexHeader;\n }\n }\n\n &__vhidden {\n @include visuallyhidden;\n }\n\n &__main {\n display: flex;\n flex-direction: column;\n background-color: $colorWhite;\n\n\t\t@include mq($to: small) {\n position: relative;\n z-index: $zIndexHeader;\n }\n }\n\n &__metabar {\n background-color: $colorCoolgrey10;\n }\n\n &__metabar-inner {\n @include container;\n display: flex;\n align-items: center;\n height: $headerMetabarHeight;\n\n\t\t// @include mq($to: medium) {\n // // overwrite container margin for regular\n // // to be able to use fullwidth of metabar\n // margin: 0 auto;\n // }\n\n\t\t@include mq($from: medium) {\n height: $headerMetabarHeightMediumUp;\n }\n }\n\n &__burger,\n &__search,\n &__metanav-item {\n color: $colorGrey90;\n transition: color $baseTransitionAnimationSpeed;\n cursor: pointer;\n\n &:hover {\n color: $colorBlack;\n }\n }\n\n &__burger {\n @include font('heavy');\n @include fontSize('milli');\n display: flex;\n align-items: center;\n appearance: none;\n background-color: transparent;\n border: none;\n padding: 0;\n margin-right: space('medium');\n gap: space('medium');\n color: $colorPrimary70;\n\n @include mq($from: small) {\n margin-right: space('xxlarge');\n }\n\n @include mq($from: medium) {\n margin-right: space('xxxxlarge');\n }\n }\n\n &__burger-icon {\n &.is-open {\n display: none;\n }\n }\n\n &__burger.is-open &__burger-icon.is-open {\n display: inline-flex;\n }\n\n &__burger.is-open &__burger-icon.is-close {\n display: none;\n }\n\n &__metabar-search {\n overflow: hidden; // prevents input from going out in smaller viewports\n margin-right: space('medium');\n transition-property: width;\n transition-duration: $baseTransitionAnimationSpeed;\n width: 40px;\n max-width: 345px;\n\n &:focus-within {\n width: 100%;\n }\n\n @include mq($from: small) {\n width: 96px;\n margin-right: space('xxlarge');\n }\n\n @include mq($from: medium) {\n // flex-shrink: 0; // prevent shrinking when metanav is in way\n width: 160px;\n margin-left: 0;\n margin-right: space('xxxxlarge');\n }\n }\n\n &__search {\n position: relative;\n display: block;\n width: 100%;\n }\n\n &__search-input {\n // width: 96px;\n width: 100%;\n max-width: 100%;\n background-color: transparent;\n color: transparent;\n font-family: inherit;\n font-size: inherit;\n border: none;\n padding: space('xsmall');\n padding-left: 0;\n padding-right: 0;\n height: $formInputHeightSmall;\n transition-property: padding-left, padding-right, background-color, color;\n transition-duration: $baseTransitionAnimationSpeed;\n\n @include mq($from: small) {\n color: $colorSecondary60;\n padding-left: calc(#{iconSize()} + #{space('medium')});\n }\n\n &:focus {\n // width: 345px;\n color: $colorSecondary60;\n background-color: $colorWhite;\n padding-left: calc(#{space('medium')} + #{iconSize()} + #{space('medium')});\n padding-right: space('xlarge');\n }\n\n // prevent ugly autofill background color in chrome\n &:-webkit-autofill {\n background-clip: text;\n }\n\n // hide search clear icon on chrome\n &[type=\"search\"]::-webkit-search-decoration,\n &[type=\"search\"]::-webkit-search-cancel-button,\n &[type=\"search\"]::-webkit-search-results-button,\n &[type=\"search\"]::-webkit-search-results-decoration {\n -webkit-appearance: none;\n }\n }\n\n &__search-input:focus ~ &__search-icon,\n &__search-input:focus ~ &__search-text {\n transform: translate(space('medium'), -50%);\n }\n\n &__search-input:focus ~ &__search-text {\n color: $colorGrey70;\n }\n\n &__search-text,\n &__search-icon {\n position: absolute;\n top: 50%;\n transform: translate(0, -50%);\n transition: transform $baseTransitionAnimationSpeed;\n }\n\n &__search-icon {\n left: 0px;\n\n @include mq($to: small) {\n transform: translate((40px - 24px) / 2, -50%);\n }\n }\n\n &__search-text {\n pointer-events: none;\n left: calc(#{iconSize()} + #{space('medium')});\n\n @include mq($to: small) {\n @include visuallyhidden;\n }\n }\n\n &__metabar-nav {\n display: flex;\n align-items: center;\n margin-left: auto;\n gap: space('medium');\n\n @include mq($from: small) {\n gap: space('xlarge');\n }\n\n @include mq($from: medium) {\n gap: space('xxlarge');\n }\n }\n\n &__metanav-popover {\n --width: auto;\n --min-width: 254px;\n\n &.is-langnav {\n --min-width: 140px;\n }\n }\n\n &__metanav-item {\n display: none;\n gap: space('small');\n align-items: center;\n justify-content: center;\n appearance: none;\n background-color: transparent;\n padding: 0;\n border: none;\n text-decoration: none;\n font-size: 100%;\n font-family: inherit;\n white-space: nowrap;\n min-width: 40px;\n\n @include mq($from: medium) {\n display: flex;\n }\n\n &[aria-expanded=\"true\"] {\n color: $colorPrimary70;\n }\n\n &.is-heavy {\n @include font('heavy');\n }\n\n &.is-stay {\n display: flex;\n }\n\n &.is-popover-mobile {\n @include mq($from: medium) {\n display: none;\n }\n }\n\n &.is-popover-desktop {\n display: none;\n\n @include mq($from: medium) {\n display: flex;\n }\n }\n }\n\n &__metanav-menu-item {\n &.is-heavy {\n @include font('heavy');\n }\n }\n\n &__metanav-item-text {\n text-overflow: ellipsis;\n white-space: nowrap;\n overflow: hidden;\n\n &.is-vhidden {\n @include visuallyhidden;\n }\n\n &.has-no-short-label {\n @include mq($to: small) {\n @include visuallyhidden;\n }\n }\n }\n\n &__metanav-item-text-label-long {\n @include mq($to: small) {\n @include visuallyhidden;\n }\n }\n\n &__metanav-item-text-label-short {\n @include mq($from: small) {\n display: none;\n }\n }\n\n &__metanav-icon-wrapper {\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n\n &__metanav-icon-badge {\n position: absolute;\n top: -4px;\n right: -4px;\n }\n\n &__metanav-icon {\n &.is-open {\n display: none;\n }\n }\n\n &__metanav-item[aria-expanded=\"true\"] &__metanav-icon.is-open {\n display: inline-flex;\n }\n\n &__metanav-item[aria-expanded=\"true\"] &__metanav-icon.is-close {\n display: none;\n }\n\n // &__metabar-login {\n // display: flex;\n // flex-basis: 50%;\n\n // &:not(:empty) {\n // \t\t@include mq($from: medium) {\n // flex-basis: auto;\n // margin-left: space('small');\n // }\n // }\n // }\n\n // &__metabar-langnav {\n // &:not(:empty) {\n // @include mq($from: medium) {\n // margin-left: space('medium');\n // }\n // }\n // }\n\n &__logobar {\n display: flex;\n\n @include mq($from: ultra) {\n margin-left: auto;\n margin-right: auto;\n width: $containerMaxWidth;\n }\n }\n\n &__logobar-logo {\n box-sizing: content-box;\n display: flex;\n overflow: hidden;\n flex-shrink: 0;\n }\n\n &__logobar-decoration {\n background-color: var(--logobar-background-color);\n flex-grow: 1;\n\n\t\t@include mq($from: ultra) {\n width: calc((100% - 553px) + ((100vw - #{$containerMaxWidth} - var(--stzh-scrollbar-width, 0px)) / 2));\n margin-right: calc((100vw - #{$containerMaxWidth} - var(--stzh-scrollbar-width, 0px)) / -2);\n\t\t}\n }\n\n &__logo-link {\n @include spaceCurve('padding-left', 'regular');\n @include spaceCurve('padding-right', 'regular');\n padding-top: 14px;\n padding-bottom: 11px;\n padding-left: $containerMargin;\n display: inline-flex;\n width: 288px;\n\t\theight: 66px;\n transition: opacity $baseTransitionAnimationSpeed;\n\n\t\t@include mq($from: small) {\n width: 300px;\n\t\t\tpadding-left: $containerMarginSmall;\n\t\t}\n\n\t\t@include mq($from: medium) {\n width: 399px;\n\t\t\theight: 88px;\n padding-top: 18px;\n padding-bottom: 18px;\n\t\t\tpadding-left: $containerMarginMedium;\n\t\t}\n\n\t\t@include mq($from: large) {\n width: 617px;\n\t\t\theight: 135px;\n padding-top: 28px;\n padding-bottom: 24px;\n\t\t\tpadding-left: $containerMarginLarge;\n }\n\n\t\t@include mq($from: ultra) {\n width: 553px;\n padding-left: 0;\n }\n }\n\n &__flyout {\n @include fontSize('milli');\n z-index: calc(#{$zIndexHeader} - 1);\n position: fixed;\n visibility: hidden;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n width: 100dvw;\n height: 100dvh;\n overflow: auto;\n transition: visibility $baseTransitionAnimationSpeed;\n\n @media (min-height: 580px) {\n overflow: hidden;\n }\n\n @include mq($from: medium) {\n overflow: hidden;\n }\n }\n\n &__flyout-backdrop {\n position: absolute;\n width: 100%;\n height: 100%;\n background-color: $colorBlack40op;\n opacity: 0;\n transition: opacity $baseTransitionAnimationSpeed;\n }\n\n &__menu {\n position: absolute;\n width: 100%;\n height: auto;\n background-color: $colorSecondary30;\n display: grid;\n grid-template-rows: auto auto;\n transition-property: opacity, transform;\n transition-duration: $baseTransitionAnimationSpeed;\n transform: translateX(-100%);\n opacity: 0;\n\n @media (min-height: 580px) {\n height: 100%;\n grid-template-rows: minmax(0, 1fr) auto;\n }\n\n @include mq($from: medium) {\n height: 100%;\n grid-template-rows: minmax(0, 1fr) auto;\n }\n\n @include mq($from: medium) {\n width: 335px;\n }\n\n @include mq($from: large) {\n width: 374px;\n }\n\n @include mq($from: large) {\n width: 439px;\n }\n\n @include mq($from: ultra) {\n width: calc((439px - #{$containerMarginLarge}) + ((100vw - #{$containerMaxWidth} - var(--stzh-scrollbar-width, 0px)) / 2))\n }\n }\n\n &__menu-nav {\n position: relative;\n overflow-x: hidden;\n overflow-y: hidden;\n\n @media (min-height: 580px) {\n overflow-y: auto;\n }\n\n @include mq($from: medium) {\n overflow-y: auto;\n position: static;\n }\n }\n\n &__menu-metanav {\n @include spaceCurve('padding-top', 'tiny');\n @include spaceCurve('padding-bottom', 'medium');\n background-color: $colorSecondary20;\n\n @include mq($from: medium) {\n display: none;\n }\n }\n\n &__menu-metanav-nav {\n max-width: 375px;\n }\n\n &__menu-list,\n &__menu-metanav-list {\n display: block;\n list-style: none;\n padding: 0;\n margin: 0;\n }\n\n &__menu-list,\n &__menu-metanav-list.is-level-2 {\n padding-top: calc(var(--stzh-header-main-height) + #{space('xxxlarge')});\n padding-bottom: space('xxxlarge');\n\n @include mq($from: medium) {\n padding-top: calc(var(--stzh-header-main-height) + #{space('huge')});\n }\n }\n\n &__menu-list.is-level-2,\n &__menu-metanav-list.is-level-2 {\n overflow: auto;\n background-color: $colorSecondary20;\n visibility: hidden;\n opacity: 0;\n transform: translateX(100%);\n position: absolute;\n z-index: 200;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n transition-property: opacity, visibility, transform;\n transition-duration: $baseTransitionAnimationSpeed;\n\n @include mq($from: medium) {\n z-index: initial;\n width: 315px;\n transform: none;\n left: 100%;\n // transition-property: opacity, visibility, transform;\n transition-property: opacity, visibility;\n }\n\n @include mq($from: large) {\n width: 334px;\n }\n\n @include mq($from: ultra) {\n width: 345px;\n }\n }\n\n &__menu-list.is-level-2 {\n height: max-content;\n\n @media (min-height: 580px) {\n height: 100%;\n }\n\n @include mq($from: medium) {\n height: 100%;\n }\n }\n\n &__menu-metanav-list.is-level-2 {\n background-color: $colorSecondary30;\n transform: none;\n transition-property: opacity, visibility;\n }\n\n // we add closing transition delay only to menu-list if hovering/focusing of another is currently active\n // to prevent showing background (flickering) when transitioning from one menu-list to another (on the same level)\n &__menu-list:where(:has(> #{&}__menu-list-item:hover > #{&}__menu-list) > #{&}__menu-list-item > #{&}__menu-list),\n &__menu-list:where(:has(> #{&}__menu-list-item.is-open > #{&}__menu-list) > #{&}__menu-list-item > #{&}__menu-list) {\n @include mq($from: medium) {\n transition-delay: $baseTransitionAnimationSpeed;\n }\n }\n\n &__menu-list-item:hover > &__menu-list,\n &__menu-list-item.is-open > &__menu-list {\n @include mq($from: medium) {\n z-index: 200;\n transition-delay: 0ms;\n visibility: visible;\n opacity: 1;\n // transform: translateX(0);\n }\n }\n\n &__menu-list-item:hover > &__menu-item,\n &__menu-list-item.is-open > &__menu-item {\n @include mq($from: medium) {\n background-color: $colorSecondary40;\n }\n\n &.is-level-2 {\n @include mq($from: medium) {\n background-color: $colorSecondary10;\n }\n }\n }\n\n &__menu-nav:has(#{&}__menu-list-item.is-open), // hide menu when any menu-list has been opened\n &__menu:has(#{&}__menu-metanav-list-item.is-open) &__menu-nav, // hide menu when menu metanav menu-list has been opened\n &__menu-list:has(#{&}__menu-list-item.is-open), // hide parent menu-list when sub menu-list has been opened\n &__menu-metanav-list:has(#{&}__menu-metanav-list-item.is-open) { // hide parent metanav menu-list when sub menu-list has been opened\n @include mq($to: medium) {\n transition-property: visibility;\n transition-duration: 0ms;\n transition-delay: $baseTransitionAnimationSpeed;\n visibility: hidden;\n // background-color: red;\n }\n }\n\n // force showing menu-list that is currently open\n &__menu-list-item.is-open > :where(#{&}__menu-list),\n &__menu-metanav-list-item.is-open > :where(#{&}__menu-metanav-list) {\n @include mq($to: medium) {\n transform: translateX(0);\n opacity: 1;\n visibility: visible;\n // background-color: green;\n }\n }\n\n &__menu-list-item,\n &__menu-metanav-list-item {\n display: grid;\n }\n\n &__menu-list-item {\n &.is-backlink {\n display: block;\n }\n }\n\n &__menu-item,\n &__menu-metanav-item {\n @include font;\n @include fontSize('milli');\n display: flex;\n align-items: center;\n appearance: none;\n border: none;\n text-decoration: none;\n background-color: transparent;\n color: $colorPrimary70;\n padding-left: space('xxxlarge');\n transition-property: color, background-color;\n transition-duration: $baseTransitionAnimationSpeed;\n }\n\n &__menu-item,\n &__menu-metanav-item {\n @include font('heavy');\n gap: space('xsmall');\n padding-top: space('small');\n padding-bottom: space('small');\n padding-right: space('large');\n }\n\n &__menu-item,\n &__menu-metanav-item {\n cursor: pointer;\n }\n\n &__menu-item,\n &__menu-metanav-item.is-title {\n @include fontSize('deci');\n min-height: 56px;\n\n @include mq($from: medium) {\n padding-left: $containerMarginMedium;\n }\n\n @include mq($from: large) {\n padding-left: $containerMarginLarge;\n }\n }\n\n &__menu-item {\n &.is-level-1 {\n @include mq($from: ultra) {\n // padding-left: 126px;\n // margin-left: calc(((100vw - #{$containerMaxWidth} - var(--stzh-scrollbar-width, 0px)) / 2) - #{$containerMarginLarge});\n padding-left: calc(((100vw - #{$containerMaxWidth} - var(--stzh-scrollbar-width, 0px)) / 2));\n }\n }\n\n &.has-items {\n @include mq($from: medium) {\n cursor: default;\n }\n }\n\n &.is-level-2 {\n @include fontSize('milli');\n min-height: 48px;\n\n @include mq($from: medium) {\n padding-left: space('xlarge');\n }\n\n @include mq($from: ultra) {\n padding-left: space('xxlarge');\n }\n }\n\n &.is-level-2.is-backlink {\n @include font;\n @include fontSize('micro');\n @include spaceCurve('margin-bottom', 'regular');\n @include spaceCurve('padding-top', 'regular');\n @include spaceCurve('padding-bottom', 'small');\n min-height: none;\n padding-left: $containerMargin;\n padding-right: $containerMargin;\n gap: space('xxsmall');\n\n\t\t @include mq($from: small) {\n padding-left: $containerMarginSmall;\n padding-right: $containerMarginSmall;\n }\n\n @include mq($from: medium) {\n display: none;\n }\n }\n\n &.is-level-2.is-main {\n @include fontSize('centi');\n margin-bottom: space('xlarge');\n }\n }\n\n &__menu-metanav-item {\n &.is-level-1 {\n min-height: 44px;\n padding-top: space('xsmall');\n padding-bottom: space('xsmall');\n }\n\n &.is-level-2 {\n min-height: 56px;\n gap: space('medium');\n padding-right: space('xxlarge');\n }\n\n &.is-title {\n @include font('heavy');\n justify-content: space-between;\n padding-top: 0;\n padding-bottom: 0;\n padding-right: space('medium');\n margin-bottom: space('xlarge');\n cursor: default;\n }\n\n &.is-language {\n @include font;\n justify-content: space-between;\n }\n\n &.is-action {\n display: grid;\n padding-right: space('xxxlarge');\n margin-top: space('xlarge');\n }\n\n &.is-hidden {\n display: none;\n }\n }\n\n &__menu-metanav-item.is-level-1 &__menu-metanav-item-icon {\n --size: #{iconSize('small')};\n }\n\n &__menu-metanav-item-text {\n display: flex;\n gap: space('xsmall');\n\n &.is-vhidden {\n @include visuallyhidden;\n }\n }\n\n &__menu-metanav-item-counter {\n @include font;\n }\n\n /* Search is filled */\n\n &--is-search-filled &__search-text {\n @include visuallyhidden;\n }\n\n /* Hide logo */\n\n &--hide-logo &__logo-link {\n opacity: 0;\n }\n\n /* Has empty metabar */\n\n // &--has-empty-metabar-mobile &__metabar {\n // @include mq($to: medium) {\n // display: none;\n // }\n // }\n\n /* Has empty metabar */\n\n // &--has-empty-metabar &__metabar {\n // display: none;\n // }\n\n /* Metabar Stay */\n\n // &--has-metabar-stay &__metabar-nav {\n // @include mq($to: medium) {\n // display: inline-flex;\n // }\n // }\n\n // &--has-metabar-stay &__metabar {\n // @include mq($to: medium) {\n // display: block;\n // }\n // }\n\n // &--has-metabar-stay &__metabar-inner {\n // @include mq($to: medium) {\n // @include container;\n // }\n // }\n\n // &--has-metabar-stay &__burger {\n // @include mq($to: medium) {\n // margin-right: initial;\n // }\n // }\n\n /* Fixed variant (as soon as header is passed) */\n\n &--is-fixed &__inner {\n @include mq($from: small) {\n transform: translateY(-100%);\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n margin-top: calc(var(--stzh-header-logobar-height) / -1);\n }\n }\n\n &--is-fixed &__main {\n\t\t@include mq($to: small) {\n transform: translateY(-100%);\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n margin-top: calc(var(--stzh-header-logobar-height) / -1);\n }\n }\n\n &--is-fixed-transition &__inner {\n @include mq($from: small) {\n // transition-property: box-shadow, transform;\n transition-property: transform;\n transition-duration: $baseTransitionAnimationSpeed;\n }\n }\n\n &--is-fixed-transition &__main {\n\t\t@include mq($to: small) {\n // transition-property: box-shadow, transform;\n transition-property: transform;\n transition-duration: $baseTransitionAnimationSpeed;\n }\n }\n\n /* Sticky variant */\n\n &--is-sticky &__logobar {\n transition-property: opacity, visibility;\n transition-duration: $baseTransitionAnimationSpeed;\n }\n\n &--is-sticky &__inner,\n &--is-sticky &__main {\n // transition-property: box-shadow, transform, margin-top;\n transition-property: transform, margin-top;\n transition-duration: $baseTransitionAnimationSpeed;\n }\n\n &--is-sticky &__inner {\n\t\t@include mq($from: small) {\n transform: translateY(0);\n // box-shadow: $boxShadowHeader;\n }\n }\n\n &--is-sticky &__main {\n\t\t@include mq($to: small) {\n transform: translateY(0);\n // box-shadow: $boxShadowHeader;\n }\n\n\t\t// @include mq($from: small) {\n // box-shadow: none;\n // }\n }\n\n &--is-sticky:where(#{&}--has-empty-metabar-mobile) &__inner {\n\t\t@include mq($from: small, $to: medium) {\n margin-top: calc((var(--stzh-header-logobar-height) + var(--stzh-header-metabar-height)) / -1);\n }\n }\n\n &--is-sticky:where(#{&}--has-empty-metabar-mobile) &__main {\n\t\t@include mq($to: small) {\n margin-top: calc((var(--stzh-header-logobar-height) + var(--stzh-header-metabar-height)) / -1);\n }\n }\n\n // &--is-sticky:where(#{&}--has-empty-metabar-mobile) &__inner {\n\t// \t@include mq($from: small, $to: medium) {\n // box-shadow: none;\n // }\n // }\n\n // &--is-sticky:where(#{&}--has-empty-metabar-mobile) &__main {\n\t// \t@include mq($to: small) {\n // box-shadow: none;\n // }\n // }\n\n &--is-sticky:where(#{&}--has-empty-metabar-mobile) &__metabar {\n @include mq($to: medium) {\n visibility: hidden;\n }\n }\n\n\n\n &--is-sticky:where(#{&}--has-empty-metabar) &__inner {\n\t\t@include mq($from: small) {\n margin-top: calc((var(--stzh-header-logobar-height) + var(--stzh-header-metabar-height)) / -1);\n }\n }\n\n &--is-sticky:where(#{&}--has-empty-metabar) &__main {\n\t\t@include mq($to: small) {\n margin-top: calc((var(--stzh-header-logobar-height) + var(--stzh-header-metabar-height)) / -1);\n }\n }\n\n // &--is-sticky:where(#{&}--has-empty-metabar) &__inner {\n\t// \t@include mq($from: small) {\n // box-shadow: none;\n // }\n // }\n\n // &--is-sticky:where(#{&}--has-empty-metabar) &__main {\n\t// \t@include mq($to: small) {\n // box-shadow: none;\n // }\n // }\n\n &--is-sticky:where(#{&}--has-empty-metabar) &__metabar {\n visibility: hidden;\n }\n\n &--is-sticky &__logobar {\n visibility: hidden;\n opacity: 0;\n }\n\n // &--is-sticky:where(#{&}--has-metabar-stay) &__metabar {\n // visibility: visible;\n // }\n\n // &--is-sticky:where(#{&}--has-metabar-stay) &__main {\n\t// \t@include mq($to: small) {\n // // box-shadow: $boxShadowHeader;\n // margin-top: calc((var(--stzh-header-logobar-height)) / -1);\n // }\n // }\n\n // &--is-sticky:where(#{&}--has-metabar-stay) &__inner {\n\t// \t@include mq($from: small) {\n // // box-shadow: $boxShadowHeader;\n // margin-top: calc((var(--stzh-header-logobar-height)) / -1);\n // }\n // }\n\n /* Sticky disabled */\n\n // &--is-sticky-disabled &__main {\n // @include mq($from: medium) {\n // padding-top: $headerMetabarHeightMediumUp;\n // }\n // }\n\n /* Flyout open */\n\n &--is-flyout-open &__flyout {\n visibility: visible;\n }\n\n &--is-flyout-open &__flyout-backdrop {\n opacity: 1;\n }\n\n &--is-flyout-open &__flyout-scrollbar {\n display: none;\n z-index: 999;\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n width: var(--stzh-scrollbar-width);\n background-color: $colorGrey10;\n border-left: calc(0.5px * var(--stzh-scrollbar-active)) solid $colorGrey30;\n\n @media (min-height: 580px) {\n display: block;\n }\n\n @include mq($from: medium) {\n display: block;\n }\n }\n\n &--is-flyout-open &__menu {\n opacity: 1;\n transform: translateX(0);\n }\n\n &--is-flyout-open &__inner {\n // position: static;\n\n\t\t@include mq($from: small) {\n z-index: $zIndexHeader;\n transform: translateY(0);\n position: fixed;\n top: 0;\n left: 0;\n right: var(--stzh-scrollbar-width);\n margin-top: 0;\n // box-shadow: none;\n }\n }\n\n &--is-flyout-open &__main {\n // z-index: $zIndexHeader;\n // position: fixed;\n // top: 0;\n // left: 0;\n // right: 0;\n\n\t\t@include mq($to: small) {\n z-index: $zIndexHeader;\n transform: translateY(0);\n position: fixed;\n top: 0;\n left: 0;\n right: var(--stzh-scrollbar-width);\n margin-top: 0;\n // box-shadow: none;\n }\n }\n\n &--is-flyout-open &__logobar {\n opacity: 1;\n }\n\n &--is-flyout-open &__logobar,\n &--is-flyout-open &__metabar {\n visibility: visible;\n }\n\n &--is-flyout-open &__logo-link {\n opacity: 1;\n transition: none;\n }\n}\n","import {\n Component,\n Element,\n Listen,\n Host,\n State,\n h,\n writeTask,\n readTask,\n Method,\n Prop,\n Event,\n EventEmitter,\n Watch,\n Fragment,\n} from \"@stencil/core\";\n\nimport { hasSlot } from \"../../utils/utils\";\nimport { media } from \"../../utils/media-utils\";\nimport {\n StzhDropdownOption,\n StzhHeaderMetanavItemClickEvent,\n StzhHeaderLanguageChangeEvent,\n StzhHeaderSearchChangeEvent,\n StzhHeaderSearchChangedEvent,\n StzhHeaderMenuItem,\n StzhHeaderMetanavItem,\n} from \"../../index\";\n\nimport { tabbable } from 'tabbable';\nimport { createBaseFocusTrapOptions } from \"../../utils/overlay-utils\";\nimport { createFocusTrap, FocusTrap } from 'focus-trap';\n\nimport { StzhHeaderLocalizedText } from './stzh-header.localization';\n\nconst CLASS_BODY_OPEN = \"stzh-header-open\";\n\n// for flyout a11y see also: https://www.w3.org/WAI/tutorials/menus/flyout/\n\n/**\n * @slot logo - Slot for brand logo\n * @slot metanav-before - Slot for custom elements before other metanav elements\n * @slot metanav-after - Slot for custom elements after other metanav elements\n */\n@Component({\n tag: \"stzh-header\",\n styleUrl: \"stzh-header.scss\",\n scoped: true\n})\nexport class StzhHeader {\n /** Translation strings */\n @Prop() localization: StzhHeaderLocalizedText;\n\n /** Portal link (for logo) */\n @Prop() href: string = \"https://www.stadt-zuerich.ch\";\n\n /** Menu element ID */\n @Prop() menuId: string = \"anchorNavMain\";\n\n /** Search element ID */\n @Prop() searchId: string = \"anchorSearch\";\n\n /** Metanav element ID */\n @Prop() metanavId: string = \"anchorNavMeta\";\n\n /** Language element ID */\n @Prop() languageId: string = \"anchorNavLang\";\n\n /**\n * Type of logo (used for setting the correct height).\n * Will enlarge the logo to 100% by default (default logos are using whitespace).\n */\n @Prop({ reflect: true }) logoType: \"default\" | \"vbz\" | \"aoz\" | \"pkzh\" | \"uvz\" = \"default\";\n\n /** Menu navigation items */\n @Prop() menuItems: StzhHeaderMenuItem[] | string = [];\n private _menuItems: StzhHeaderMenuItem[];\n\n /** Overwrite menu back label */\n @Prop() menuBackLabel: string;\n\n /** Meta navigation items */\n @Prop() metanavItems: StzhHeaderMetanavItem[] | string = [];\n private _metanavItems: StzhHeaderMetanavItem[];\n\n /** Current language page path */\n @Prop({ mutable: true }) languageActive: string;\n\n /** Available language (paths) in language switch */\n @Prop() languages: StzhDropdownOption[] | string = [];\n private _languages: StzhDropdownOption[];\n\n /** Prevent url change when language has changed (will only fire `stzhLanguageChange`) */\n @Prop() languagePreventUrlchange: boolean = false;\n\n /** Whether language switch should stay on mobile */\n @Prop() languageStay: boolean = false;\n\n /** Search form action (if given, searchfield will be shown) */\n @Prop() searchAction: string;\n\n /** Search field name */\n @Prop() searchFieldName: string = \"q\";\n\n /** Search input value */\n @Prop() searchValue: string = \"\";\n\n /** Sticky behaviour */\n @Prop() sticky: \"default\" | \"disabled\" = \"default\";\n\n /**\n * For Adobe Analytics.\n * Will be rendered as value of `s-object-id` attribute to the logo link element.\n * Default value is \"Header Logo\".\n */\n @Prop() logoAnalyticsId: string;\n\n @State() hideLogo: boolean = false;\n @State() paddingTop: number;\n @State() stickyActive: boolean = false;\n @State() flyoutOpen: boolean = false;\n @State() searchFilled: boolean;\n\n @State() fixed: boolean = false;\n @State() fixedTransition: boolean = false;\n\n @State() currentOpenMenuItem: StzhHeaderMenuItem = null;\n @State() currentOpenMetanavItem: StzhHeaderMetanavItem = null;\n @State() currentOpenLanguage: boolean = false;\n private openSubmenuElement: HTMLElement;\n\n @Element() element: HTMLStzhHeaderElement;\n\n @Listen(\"keydown\", { target: \"document\" })\n handleKeydown(event: KeyboardEvent) {\n if (event.key === \"Escape\") {\n this.flyoutOpen = false;\n }\n }\n\n @Watch(\"flyoutOpen\")\n async flyoutOpenWatcher(open: boolean) {\n if (!open) {\n // reset current open menu when flyout was closed\n this.currentOpenMenuItem = null;\n this.currentOpenMetanavItem = null;\n this.currentOpenLanguage = null;\n // reset further flags\n this.flyoutOpenedByMetanavItem = false;\n\n document.body.classList.remove(CLASS_BODY_OPEN);\n this.enableSiblings();\n\n if (this.trap) {\n this.trap.deactivate();\n }\n } else {\n document.body.classList.add(CLASS_BODY_OPEN);\n this.disableSiblings();\n\n if (this.trap) {\n this.trap.activate();\n }\n }\n }\n\n @Watch(\"fixed\")\n @Watch(\"flyoutOpen\")\n async fixedWatcher() {\n this.paddingTop = this.fixed || this.flyoutOpen ? this.headerHeight : 0;\n // we don't want to run transitions on applying fixed class (out transition),\n // so we set them in the next render\n await this.waitForNextRender();\n this.fixedTransition = this.fixed || this.flyoutOpen;\n }\n\n @Watch(\"sticky\")\n stickyWatcher() {\n this.updatePosition();\n }\n\n /** Update position / sticky state of header */\n @Method()\n async updatePosition() {\n if (this.flyoutOpen) {\n return;\n }\n\n if (this.sticky === \"disabled\") {\n document.documentElement.style.setProperty('--stzh-header-is-stuck', '0');\n document.documentElement.style.setProperty('--stzh-header-is-not-stuck', '1');\n this.stickyActive = false;\n return;\n }\n\n if (this.scrollingUp && this.belowStayStickyPoint) {\n if (!this.stickyActive && this.belowStartStickyPoint) {\n this.stickyActive = true;\n document.documentElement.style.setProperty('--stzh-header-is-stuck', '1');\n document.documentElement.style.setProperty('--stzh-header-is-not-stuck', '0');\n }\n } else {\n if (this.stickyActive && this.belowStayStickyPoint) {\n document.documentElement.style.setProperty('--stzh-header-is-stuck', '0');\n document.documentElement.style.setProperty('--stzh-header-is-not-stuck', '1');\n this.stickyActive = false;\n } else {\n document.documentElement.style.setProperty('--stzh-header-is-stuck', '0');\n document.documentElement.style.setProperty('--stzh-header-is-not-stuck', '1');\n this.stickyActive = false;\n }\n }\n }\n\n @Listen(\"scroll\", { target: \"window\" })\n scrollListener() {\n if (this.sticky === \"disabled\") {\n return;\n }\n\n readTask(() => {\n this.currentScrollY = window.scrollY;\n this.scrollingUp = this.lastScrollY && this.lastScrollY > this.currentScrollY;\n this.lastScrollY = this.currentScrollY;\n\n this.belowStayStickyPoint = this.currentScrollY > this.logobarHeight;\n this.belowStartStickyPoint = this.currentScrollY > this.headerHeight;\n\n this.fixed = this.belowStartStickyPoint || (this.scrollingUp && this.belowStayStickyPoint && this.stickyActive);\n\n this.headerOverlap = (this.headerTop - this.currentScrollY) / -1;\n this.hideLogo = this.isMedium && this.headerOverlap > 1;\n });\n\n writeTask(() => {\n this.updatePosition();\n });\n }\n\n /** Metanav item click event */\n @Event() stzhMetanavItemClick: EventEmitter<StzhHeaderMetanavItemClickEvent>;\n\n /** Language change event */\n @Event() stzhLanguageChange: EventEmitter<StzhHeaderLanguageChangeEvent>;\n\n /** Search input change event */\n @Event() stzhSearchChange: EventEmitter<StzhHeaderSearchChangeEvent>;\n\n /** Search input changed event */\n @Event() stzhSearchChanged: EventEmitter<StzhHeaderSearchChangedEvent>;\n\n @Watch(\"searchValue\")\n searchValueWatcher(newValue: string) {\n this.searchFilled = newValue !== \"\";\n }\n\n @Watch(\"menuItems\")\n menuItemsWatcher(newValue: StzhHeaderMenuItem[] | string) {\n if (typeof newValue === \"string\") {\n this._menuItems = JSON.parse(newValue);\n } else {\n this._menuItems = newValue;\n }\n\n this._menuItems = this._menuItems.map((menuItem, index) => ({\n id: `submenu-${index}`,\n ...menuItem\n }))\n }\n\n @Watch(\"metanavItems\")\n metanavItemsWatcher(newValue: StzhHeaderMetanavItem[] | string) {\n if (typeof newValue === \"string\") {\n this._metanavItems = JSON.parse(newValue);\n } else {\n this._metanavItems = newValue;\n }\n\n this._metanavItems = this._metanavItems.map((metanavItem, index) => ({\n id: `metanav-submenu-${index}`,\n ...metanavItem\n }))\n }\n\n @Watch(\"languages\")\n languagesWatcher(newValue: StzhDropdownOption[] | string) {\n if (typeof newValue === \"string\") {\n this._languages = JSON.parse(newValue);\n } else {\n this._languages = newValue;\n }\n }\n\n private renderPromiseResolve: (value?: unknown) => void;\n\n private currentScrollY: number;\n private lastScrollY: number;\n private headerOverlap: number;\n private scrollingUp: boolean;\n private belowStayStickyPoint: boolean;\n private belowStartStickyPoint: boolean;\n\n private headerTop: number;\n private headerHeight: number;\n // private innerHeight: number;\n private mainHeight: number;\n private metabarHeight: number;\n private logobarHeight: number;\n\n private isMedium: boolean;\n\n private debounceResize: number;\n private resizeObserver: ResizeObserver;\n private flyoutResizeObserver: ResizeObserver;\n\n // private innerElement: HTMLDivElement;\n private mainElement: HTMLDivElement;\n private logobarElement: HTMLDivElement;\n private metabarElement: HTMLDivElement;\n private menunavElement: HTMLElement;\n private flyoutElement: HTMLElement;\n\n private searchInput: HTMLInputElement;\n\n private lastOpener: HTMLButtonElement | null = null;\n private flyoutOpenedByMetanavItem: boolean = null;\n\n private trap: FocusTrap;\n private parentElement: HTMLElement;\n\n private getSiblings() {\n if (!this.parentElement) {\n return [];\n }\n\n return Array.from(this.parentElement.children).filter(\n (child) => child !== this.element\n );\n }\n\n private disableSiblings() {\n this.getSiblings().forEach((sibling) => {\n sibling.setAttribute(\"aria-hidden\", \"true\");\n });\n }\n\n private enableSiblings() {\n this.getSiblings().forEach((sibling) => {\n sibling.removeAttribute(\"aria-hidden\");\n });\n }\n\n private waitForNextRender() {\n return new Promise(resolve => this.renderPromiseResolve = resolve);\n }\n\n private resizeMenunavElement() {\n // reset height when metanav is sticky, or on medium or no submenu element is open\n if (media(\"headerMetanavSticky\").matches || media(\"medium\").matches || !this.openSubmenuElement) {\n Object.assign(this.menunavElement.style, {\n height: null\n });\n } else {\n const { height } = this.openSubmenuElement.getBoundingClientRect();\n Object.assign(this.menunavElement.style, {\n height: `${height}px`\n });\n }\n }\n\n private async openMenuItem(event: MouseEvent, menuItem: StzhHeaderMenuItem) {\n this.flyoutOpen = true;\n\n this.lastOpener = event.currentTarget as HTMLButtonElement;\n this.openSubmenuElement = this.element.querySelector(`#${menuItem.id}`) as HTMLElement;\n this.currentOpenMenuItem = menuItem;\n await this.waitForNextRender();\n\n requestAnimationFrame(() => {\n this.menunavElement.scrollTop = 0;\n\n const firstButtonOrLink = this.openSubmenuElement\n && tabbable(this.openSubmenuElement)[0];\n firstButtonOrLink?.focus()\n\n this.resizeMenunavElement();\n });\n }\n\n private async closeMenuItem(focusOpener: boolean = true) {\n this.openSubmenuElement = null;\n this.currentOpenMenuItem = null;\n await this.waitForNextRender();\n\n if (focusOpener) {\n requestAnimationFrame(() => {\n this.lastOpener.focus();\n this.lastOpener = null;\n\n this.resizeMenunavElement();\n });\n }\n }\n\n private async openMetanavItem(event: MouseEvent, metanavItem: StzhHeaderMetanavItem) {\n if (!this.flyoutOpen) {\n this.flyoutOpenedByMetanavItem = true;\n this.flyoutOpen = true;\n }\n\n this.lastOpener = event.currentTarget as HTMLButtonElement;\n this.currentOpenMetanavItem = metanavItem;\n await this.waitForNextRender();\n\n requestAnimationFrame(() => {\n const openMetanavSubmenuElement = this.element.querySelector(`#${metanavItem.id}`);\n const firstButtonOrLink = openMetanavSubmenuElement\n && tabbable(openMetanavSubmenuElement)[0];\n firstButtonOrLink?.focus()\n });\n }\n\n private async closeMetanavItem() {\n this.currentOpenMetanavItem = null;\n\n if (this.flyoutOpenedByMetanavItem) {\n this.flyoutOpen = false;\n }\n\n await this.waitForNextRender();\n\n requestAnimationFrame(() => {\n this.lastOpener.focus();\n this.lastOpener = null;\n });\n }\n\n private async openLanguage(event: MouseEvent) {\n if (!this.flyoutOpen) {\n this.flyoutOpenedByMetanavItem = true;\n this.flyoutOpen = true;\n }\n\n this.lastOpener = event.currentTarget as HTMLButtonElement;\n this.currentOpenLanguage = true;\n await this.waitForNextRender();\n\n requestAnimationFrame(() => {\n const openMetanavSubmenuElement = this.element.querySelector(\"#submenu-languages\");\n const firstButtonOrLink = openMetanavSubmenuElement\n && tabbable(openMetanavSubmenuElement)[0];\n firstButtonOrLink?.focus()\n });\n }\n\n private async closeLanguage() {\n this.currentOpenLanguage = false;\n\n if (this.flyoutOpenedByMetanavItem) {\n this.flyoutOpen = false;\n }\n\n await this.waitForNextRender();\n\n requestAnimationFrame(() => {\n this.lastOpener.focus();\n this.lastOpener = null;\n });\n }\n\n private handleMenuListFocusout = (event: FocusEvent) => {\n const isNextFocusOutOfMenuList = !(event.currentTarget as HTMLElement)\n .contains(event.relatedTarget as HTMLElement);\n\n if (this.isMedium && isNextFocusOutOfMenuList) {\n this.closeMenuItem(false);\n }\n }\n\n private handleBurgerClick = async () => {\n if (this.flyoutOpenedByMetanavItem) {\n this.flyoutOpenedByMetanavItem = false;\n this.closeMetanavItem();\n } else {\n this.flyoutOpen = !this.flyoutOpen;\n }\n\n // focus first menu item\n const element = this.element.querySelector('.stzh-header__menu-item') as HTMLElement;\n\n if (element) {\n window.setTimeout(() => {\n element.focus();\n }, 100);\n }\n\n // await this.waitForNextRender();\n this.updatePosition();\n }\n\n private handleBackdropClick = async () => {\n this.flyoutOpen = false;\n // await this.waitForNextRender();\n this.updatePosition();\n }\n\n private handleMetanavItemClick = (event: MouseEvent, item: StzhHeaderMetanavItem) => {\n this.stzhMetanavItemClick.emit({\n component: \"stzh-header\",\n item,\n originalEvent: event,\n })\n }\n\n private handleSearchInput = (event: InputEvent) => {\n this.searchValue = this.searchInput.value;\n\n this.stzhSearchChange.emit({\n component: \"stzh-header\",\n originalEvent: event,\n value: this.searchValue\n });\n }\n\n private handleSearchChange = (event: InputEvent) => {\n this.searchValue = this.searchInput.value;\n\n this.stzhSearchChanged.emit({\n component: \"stzh-header\",\n originalEvent: event,\n value: this.searchValue\n });\n }\n\n private handleLanguageClick = (event: MouseEvent, dropdownOption: StzhDropdownOption) => {\n if (this.languagePreventUrlchange) {\n event.preventDefault();\n }\n\n this.languageActive = dropdownOption.value;\n\n this.stzhLanguageChange.emit({\n component: \"stzh-header\",\n value: this.languageActive\n });\n }\n\n private handleFlyoutResize = () => {\n this.resizeMenunavElement();\n }\n\n private handleResize = () => {\n if (this.sticky === \"disabled\") {\n return;\n }\n\n if (this.debounceResize) {\n window.cancelAnimationFrame(this.debounceResize);\n }\n\n this.debounceResize = requestAnimationFrame(() => {\n readTask(() => {\n this.isMedium = media(\"medium\").matches;\n\n this.mainHeight = this.mainElement?.offsetHeight || 0;\n this.metabarHeight = this.metabarElement?.offsetHeight || 0;\n this.logobarHeight = this.logobarElement?.offsetHeight || 0;\n\n this.headerTop = this.element.offsetTop;\n this.headerHeight = this.metabarHeight + this.logobarHeight;\n\n // this.headerHeight = this.element.offsetHeight;\n // console.log(this.headerHeight);\n // console.log(this.metabarHeight + this.logobarHeight);\n // console.log(this.metabarHeight, this.logobarHeight);\n });\n\n writeTask(() => {\n document.documentElement.style.setProperty('--stzh-header-height', `${this.headerHeight}px`);\n document.documentElement.style.setProperty('--stzh-header-main-height', `${this.mainHeight}px`);\n document.documentElement.style.setProperty('--stzh-header-metabar-height', `${this.metabarHeight}px`);\n document.documentElement.style.setProperty('--stzh-header-logobar-height', `${this.logobarHeight}px`);\n });\n\n this.scrollListener();\n });\n }\n\n async componentWillLoad() {\n this.menuItemsWatcher(this.menuItems);\n this.metanavItemsWatcher(this.metanavItems);\n this.languagesWatcher(this.languages);\n this.searchValueWatcher(this.searchValue);\n\n if (!this.localization) {\n this.localization = await window.stzhComponents.utils.fetchTranslations(this.element, \"header\");\n }\n }\n\n componentDidRender() {\n if (this.renderPromiseResolve) {\n this.renderPromiseResolve();\n }\n\n if (this.flyoutElement && this.flyoutResizeObserver) {\n this.flyoutResizeObserver.observe(this.flyoutElement);\n }\n }\n\n componentDidLoad() {\n this.trap = createFocusTrap(this.element, {\n ...createBaseFocusTrapOptions(),\n initialFocus: false\n });\n\n this.flyoutResizeObserver = new ResizeObserver(this.handleFlyoutResize);\n if (this.flyoutElement) {\n this.flyoutResizeObserver.observe(this.flyoutElement);\n }\n }\n\n connectedCallback() {\n this.parentElement = this.element.parentElement;\n\n this.resizeObserver = new ResizeObserver(this.handleResize);\n this.resizeObserver.observe(this.element);\n }\n\n disconnectedCallback() {\n this.flyoutOpenWatcher(false);\n this.resizeObserver?.disconnect();\n this.flyoutResizeObserver?.disconnect();\n }\n\n render() {\n const metanavBeforeUsed: boolean = hasSlot(this.element, \"metanav-before\");\n const metanavAfterUsed: boolean = hasSlot(this.element, \"metanav-after\");\n\n const classes = {\n \"stzh-header\": true,\n \"stzh-header--is-flyout-open\": this.flyoutOpen,\n \"stzh-header--is-sticky-disabled\": this.sticky === \"disabled\",\n \"stzh-header--is-search-filled\": this.searchFilled,\n \"stzh-header--is-fixed\": this.fixed,\n \"stzh-header--is-fixed-transition\": this.fixedTransition,\n \"stzh-header--is-sticky\": this.stickyActive,\n \"stzh-header--hide-logo\": this.hideLogo,\n \"stzh-header--has-empty-metabar-mobile\": !metanavBeforeUsed && !metanavAfterUsed\n && this._metanavItems.filter(item => item.stay || item.stayAndShowInMobileMenu).length === 0\n && this._menuItems.length === 0\n && (this._languages.length === 0\n || (this._languages.length > 0 && !this.languageStay))\n && !this.searchAction,\n \"stzh-header--has-empty-metabar\": !metanavBeforeUsed && !metanavAfterUsed\n && this._metanavItems.length === 0\n && this._menuItems.length === 0\n && this._languages.length === 0\n && !this.searchAction\n };\n\n const activeLanguage = this.languageActive || window.stzhComponents.utils.getLocale(this.element);\n const activeLanguageOption = this._languages\n ?.find(({ value }) => value === activeLanguage) || this._languages?.[0] || null;\n\n const renderMetanavItemButton = (item: StzhHeaderMetanavItem, additionalClasses?: { [className: string]: boolean }, additionalAttributes?: any) => {\n const Element = item.items?.length > 0 || item.itemButton || !item.href ? \"button\" : \"a\";\n\n return (\n <Element\n {...additionalAttributes}\n href={Element === \"a\" && item.href}\n target={Element === \"a\" && item.target}\n class={{\n \"stzh-header__metanav-item\": true,\n \"is-heavy\": item.important,\n \"is-stay\": item.stay || item.stayAndShowInMobileMenu,\n ...(additionalClasses || {})\n }}\n >\n <span\n class={{\n \"stzh-header__metanav-item-text\": true,\n \"is-vhidden\": item.labelHidden,\n \"has-no-short-label\": !item.labelShort,\n }}\n >\n <span class=\"stzh-header__metanav-item-text-label-long\">{item.label}</span>\n <span class=\"stzh-header__metanav-item-text-label-short\" aria-hidden=\"true\">{item.labelShort}</span>\n </span>\n {item.icon &&\n <span class=\"stzh-header__metanav-icon-wrapper\">\n {item.icon && <stzh-icon class={`stzh-header__metanav-icon ${item.iconOpen ? 'is-close' : ''}`} name={item.icon}></stzh-icon>}\n {item.iconOpen && <stzh-icon class=\"stzh-header__metanav-icon is-open\" name={item.iconOpen}></stzh-icon>}\n {(item.badge || item.badgeEmpty) &&\n <stzh-badge class=\"stzh-header__metanav-icon-badge\" label={item.badge} type={typeof item.badgeType === \"undefined\" ? \"error\" : item.badgeType}></stzh-badge>\n }\n </span>\n }\n </Element>\n );\n }\n\n return (\n <Host>\n <header class={classes}>\n <div class=\"stzh-header__header\" style={{paddingTop: `${this.paddingTop}px`}}>\n <div\n class=\"stzh-header__inner\"\n // ref={(el) => (this.innerElement = el as HTMLDivElement)}\n >\n <div\n class=\"stzh-header__main\"\n ref={(el) => (this.mainElement = el as HTMLDivElement)}\n >\n <div\n class=\"stzh-header__logobar\"\n ref={(el) => (this.logobarElement = el as HTMLDivElement)}\n >\n <div class=\"stzh-header__logobar-logo\">\n <a href={this.href} class=\"stzh-header__logo-link\" s-object-id={this.logoAnalyticsId || \"Header Logo\"}>\n <slot name=\"logo\"></slot>\n </a>\n </div>\n <div class=\"stzh-header__logobar-decoration\"></div>\n </div>\n\n <div\n class=\"stzh-header__metabar\"\n ref={(el) => (this.metabarElement = el as HTMLDivElement)}\n >\n <div class=\"stzh-header__metabar-inner\">\n {this._menuItems.length > 0 &&\n <button\n id={this.menuId}\n class={`stzh-header__burger ${this.flyoutOpen && !this.flyoutOpenedByMetanavItem && \"is-open\"}`}\n onClick={this.handleBurgerClick}\n >\n <stzh-icon\n class=\"stzh-header__burger-icon is-close\"\n name=\"menu\"\n ></stzh-icon>\n <stzh-icon\n class=\"stzh-header__burger-icon is-open\"\n name=\"close\"\n ></stzh-icon>\n <div class=\"stzh-header__burger-text\">\n {this.localization.menuLabel}\n </div>\n </button>\n }\n {this.searchAction &&\n <form\n class=\"stzh-header__metabar-search\"\n action={this.searchAction}\n role=\"search\"\n >\n <label class=\"stzh-header__search\">\n <input\n id={this.searchId}\n ref={(el) => (this.searchInput = el as HTMLInputElement)}\n class=\"stzh-header__search-input\"\n type=\"search\"\n name={this.searchFieldName}\n onChange={this.handleSearchChange}\n onInput={this.handleSearchInput}\n ></input>\n <stzh-icon class=\"stzh-header__search-icon\" name=\"search\"></stzh-icon>\n <div class=\"stzh-header__search-text\">{this.localization.searchLabel}</div>\n </label>\n </form>\n }\n <div class=\"stzh-header__metabar-nav\" id={this.metanavId}>\n <slot name=\"metanav-before\"></slot>\n\n {this._metanavItems.map((item) =>\n (item.items?.length > 0 || item.itemButton)\n ?\n <Fragment>\n {renderMetanavItemButton(item, {\n \"is-popover-mobile\": true\n }, {\n 'aria-expanded': item === this.currentOpenMetanavItem ? \"true\" : \"false\",\n 'aria-controls': item.id,\n onClick: (e: MouseEvent) => {\n if (item === this.currentOpenMetanavItem) {\n this.closeMetanavItem();\n } else {\n this.openMetanavItem(e, item)\n }\n\n this.handleMetanavItemClick(e, item);\n }\n })}\n <stzh-popover\n class={{\n \"stzh-header__metanav-popover\": true,\n }}\n placement=\"bottom-end\"\n distance={20}\n variant={item.variant}\n size={typeof item.size === \"undefined\" ? \"large\" : item.size}\n >\n {renderMetanavItemButton(item, {\n \"is-popover-desktop\": true\n }, {\n onClick: (e: MouseEvent) => {\n this.handleMetanavItemClick(e, item);\n }\n })}\n <div slot=\"content\">\n {item.items?.length > 0 &&\n <stzh-menu>\n {item.items.map((childItem) =>\n <stzh-menu-item\n class={{\n \"stzh-header__metanav-menu-item\": true,\n \"is-heavy\": typeof item.importantSubmenu === \"undefined\" || item.importantSubmenu,\n }}\n size={typeof item.size === \"undefined\" ? \"large\" : item.size}\n variant={item.variant}\n href={childItem.href}\n target={childItem.target}\n icon={childItem.icon}\n counter={childItem.counter}\n badge={childItem.badge}\n badgeType={childItem.badgeType}\n >\n {childItem.label}\n </stzh-menu-item>\n )}\n </stzh-menu>\n }\n </div>\n {item.itemButton &&\n <stzh-button\n slot=\"action\"\n size={item.itemButton.size}\n href={item.itemButton.href}\n target={item.itemButton.target}\n >\n {item.itemButton.label}\n </stzh-button>\n }\n </stzh-popover>\n </Fragment>\n :\n renderMetanavItemButton(item, {}, {\n onClick: (e: MouseEvent) => {\n this.handleMetanavItemClick(e, item);\n }\n })\n )}\n\n {this._languages?.length > 0 &&\n <Fragment>\n <h2 id={this.languageId} class=\"stzh-header__vhidden\">\n {this.localization.languageLabel}\n </h2>\n {this._menuItems.length > 0 && this.languageStay &&\n <button\n class={{\n \"stzh-header__metanav-item\": true,\n \"is-popover-mobile\": true,\n \"is-stay\": this.languageStay\n }}\n aria-expanded={this.currentOpenLanguage ? \"true\" : \"false\"}\n aria-controls=\"submenu-languages\"\n onClick={(e: MouseEvent) => {\n if (this.currentOpenLanguage) {\n this.closeLanguage();\n } else {\n this.openLanguage(e)\n }\n }}\n >\n <span class=\"stzh-header__metanav-item-text\">{activeLanguageOption?.text}</span>\n <stzh-icon class=\"stzh-header__metanav-icon is-close\" name=\"angle-down\"></stzh-icon>\n <stzh-icon class=\"stzh-header__metanav-icon is-open\" name=\"angle-up\"></stzh-icon>\n </button>\n }\n <stzh-popover\n class=\"stzh-header__metanav-popover is-langnav\"\n placement=\"bottom-end\"\n distance={20}\n >\n <button\n class={{\n \"stzh-header__metanav-item\": true,\n \"is-popover-desktop\": this._menuItems.length > 0,\n \"is-stay\": this.languageStay\n }}\n >\n <span class=\"stzh-header__metanav-item-text\">{activeLanguageOption?.text}</span>\n <stzh-icon class=\"stzh-header__metanav-icon is-close\" name=\"angle-down\"></stzh-icon>\n <stzh-icon class=\"stzh-header__metanav-icon is-open\" name=\"angle-up\"></stzh-icon>\n </button>\n <div slot=\"content\">\n <stzh-menu>\n {this._languages.map((language) =>\n <stzh-menu-item\n class=\"stzh-header__metanav-menu-item\"\n active={activeLanguageOption?.value === language.value}\n href={language.value}\n onClick={(event) => this.handleLanguageClick(event, language)}\n >\n {language.text}\n </stzh-menu-item>\n )}\n </stzh-menu>\n </div>\n </stzh-popover>\n </Fragment>\n }\n\n <slot name=\"metanav-after\"></slot>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n\n {this._menuItems.length > 0 &&\n <div\n ref={(el) => (this.flyoutElement = el as HTMLElement)}\n class=\"stzh-header__flyout\"\n >\n <div class=\"stzh-header__flyout-backdrop\" onClick={this.handleBackdropClick}></div>\n <div class=\"stzh-header__flyout-scrollbar\"></div>\n <div class=\"stzh-header__menu\">\n <nav\n class=\"stzh-header__menu-nav\"\n ref={(el) => (this.menunavElement = el as HTMLElement)}\n aria-label={this.localization.navigationLabel}\n >\n <ul class=\"stzh-header__menu-list is-level-1\">\n {this._menuItems.map((item) =>\n <li\n class={{\n 'stzh-header__menu-list-item': true,\n 'is-open': item === this.currentOpenMenuItem\n }}\n >\n {item.items?.length > 0\n ?\n <button\n aria-expanded={item === this.currentOpenMenuItem ? \"true\" : \"false\"}\n aria-controls={item.id}\n class=\"stzh-header__menu-item is-level-1 has-items\"\n onClick={\n item === this.currentOpenMenuItem\n ? () => this.closeMenuItem()\n : (e) => this.openMenuItem(e, item)\n }\n >\n {item.label}\n </button>\n :\n <a href={item.href} class=\"stzh-header__menu-item is-level-1\">\n {item.label}\n </a>\n }\n {item.items?.length > 0 &&\n <ul\n id={item.id}\n class=\"stzh-header__menu-list is-level-2\"\n onFocusout={this.handleMenuListFocusout}\n >\n <li class=\"stzh-header__menu-list-item is-backlink\">\n <button class=\"stzh-header__menu-item is-level-2 is-backlink\" onClick={() => this.closeMenuItem()}>\n <stzh-icon name=\"angle-left\"></stzh-icon>\n <span>{this.menuBackLabel ? this.menuBackLabel : this.localization.menuBackLabel}</span>\n </button>\n </li>\n <li class=\"stzh-header__menu-list-item\">\n <a href={item.href} class=\"stzh-header__menu-item is-level-2 is-main\">\n {item.label}\n </a>\n </li>\n {item.items.map((item) =>\n <li class=\"stzh-header__menu-list-item\">\n <a href={item.href} class=\"stzh-header__menu-item is-level-2\">\n {item.label}\n </a>\n </li>\n )}\n </ul>\n }\n </li>\n )}\n </ul>\n </nav>\n\n {(this._metanavItems?.length > 0 || this._languages?.length > 0) &&\n <div class=\"stzh-header__menu-metanav\">\n <nav class=\"stzh-header__menu-metanav-nav\">\n <ul class=\"stzh-header__menu-metanav-list is-level-1\">\n {this._metanavItems.map((item) =>\n <li\n class={{\n 'stzh-header__menu-metanav-list-item': true,\n 'is-open': item === this.currentOpenMetanavItem\n }}>\n {item.items?.length > 0\n ?\n <button\n aria-expanded={item === this.currentOpenMetanavItem ? \"true\" : \"false\"}\n aria-controls={item.id}\n class={{\n \"stzh-header__menu-metanav-item is-level-1\": true,\n \"is-hidden\": item.stay && !item.stayAndShowInMobileMenu\n }}\n onClick={(e: MouseEvent) => {\n if (item === this.currentOpenMetanavItem) {\n this.closeMetanavItem();\n } else {\n this.openMetanavItem(e, item)\n }\n\n this.handleMetanavItemClick(e, item);\n }}\n >\n <span\n class={{\n \"stzh-header__menu-metanav-item-text\": true,\n \"is-vhidden\": item.labelHidden,\n }}\n >\n {item.label}\n </span>\n {item.icon && <stzh-icon class=\"stzh-header__menu-metanav-item-icon\" name={item.icon}></stzh-icon>}\n </button>\n :\n <a\n href={item.href}\n class={{\n \"stzh-header__menu-metanav-item is-level-1\": true,\n \"is-hidden\": item.stay && !item.stayAndShowInMobileMenu\n }}\n onClick={(e: MouseEvent) => {\n this.handleMetanavItemClick(e, item);\n }}\n >\n <span\n class={{\n \"stzh-header__menu-metanav-item-text\": true,\n \"is-vhidden\": item.labelHidden,\n }}\n >\n {item.label}\n </span>\n {item.icon && <stzh-icon class=\"stzh-header__menu-metanav-item-icon\" name={item.icon}></stzh-icon>}\n </a>\n }\n {item.items?.length > 0 &&\n <ul\n id={item.id}\n class=\"stzh-header__menu-metanav-list is-level-2\"\n >\n <li class=\"stzh-header__menu-metanav-list-item\">\n <div class=\"stzh-header__menu-metanav-item is-level-2 is-title\">\n <span>{item.label}</span>\n <stzh-button\n class=\"stzh-header__menu-metanav-item-icon\"\n variant=\"tertiary\"\n icon=\"close\"\n iconOnly={true}\n label={this.localization.closeMetanavMenuLabel?.replace(/\\{itemLabel\\}/gi, item.label)}\n onClick={() => this.closeMetanavItem()}\n ></stzh-button>\n </div>\n </li>\n {item.items.map((item) =>\n <li class=\"stzh-header__menu-metanav-list-item\">\n <a href={item.href} class=\"stzh-header__menu-metanav-item is-level-2\">\n {item.icon && <stzh-icon class=\"stzh-header__menu-metanav-item-icon\" name={item.icon}></stzh-icon>}\n <span class=\"stzh-header__menu-metanav-item-text\">\n <span>{item.label}</span>\n {item.counter &&\n <span class=\"stzh-header__menu-metanav-item-counter\">({item.counter})</span>\n }\n </span>\n </a>\n </li>\n )}\n\n {item.itemButton &&\n <li class=\"stzh-header__menu-metanav-list-item\">\n <div class=\"stzh-header__menu-metanav-item is-level-2 is-action\">\n <stzh-button\n href={item.itemButton.href}\n target={item.itemButton.target}\n >\n {item.itemButton.label}\n </stzh-button>\n </div>\n </li>\n }\n </ul>\n }\n </li>\n )}\n\n {this._languages?.length > 0 &&\n <li\n class={{\n 'stzh-header__menu-metanav-list-item': true,\n 'is-open': this.currentOpenLanguage\n }}\n >\n <button\n aria-expanded={this.currentOpenLanguage ? \"true\" : \"false\"}\n aria-controls=\"submenu-languages\"\n class=\"stzh-header__menu-metanav-item is-level-1\"\n onClick={(e) => this.openLanguage(e)}\n >\n <span>{activeLanguageOption?.text}</span>\n <stzh-icon class=\"stzh-header__menu-metanav-item-icon\" name=\"angle-down\"></stzh-icon>\n </button>\n <ul\n id=\"submenu-languages\"\n class=\"stzh-header__menu-metanav-list is-level-2\"\n >\n <div class=\"stzh-header__menu-metanav-item is-level-2 is-title\">\n <span>{this.localization.dialogLanguageTitle}</span>\n <stzh-button\n class=\"stzh-header__menu-metanav-item-icon\"\n variant=\"tertiary\"\n icon=\"close\"\n iconOnly={true}\n label={\"Sprach-Dialog schliessen\"}\n onClick={() => this.closeLanguage()}\n ></stzh-button>\n </div>\n {this._languages.map((language) =>\n <li class=\"stzh-header__menu-metanav-list-item\">\n <a\n class=\"stzh-header__menu-metanav-item is-level-2 is-language\"\n href={language.value}\n onClick={(event) => this.handleLanguageClick(event, language)}\n >\n <span>{language.text}</span>\n {activeLanguageOption?.value === language.value &&\n <stzh-icon class=\"stzh-header__menu-metanav-item-icon\" name=\"checkmark\"></stzh-icon>}\n </a>\n </li>\n )}\n </ul>\n </li>\n }\n </ul>\n </nav>\n </div>\n }\n </div>\n </div>\n }\n </header>\n </Host>\n );\n }\n}\n"],"mappings":"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"}

package/dist/stzh-components/p-5e48450d.entry.js DELETED Viewed

	@@ -1,2 +0,0 @@
1	- import{r as t,c as a,h as s,a as c,g as e}from"./p-c7bfac7a.js";import{h as i}from"./p-7e304ea3.js";import"./p-9b063923.js";const h='.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{display:none}.sc-stzh-cta-h::-moz-selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.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);--heading-color:var(--stzh-color-primary70);--lead-color:var(--stzh-color-white);--sticky-background-color:var(--background-color);--button-color:var(--stzh-color-white);--button-background-color:var(--stzh-color-primary70);--button-border-radius:var(--stzh-button-border-radius);--hover-button-color:var(--stzh-color-white);--hover-button-background-color:var(--stzh-color-secondary60);--stuck-background-color:var(--stzh-color-grey10);--stuck-heading-color:var(--stzh-color-primary70);--stuck-lead-color:var(--stzh-base-color);--stuck-sticky-background-color:var(--background-color);--grid-template-areas:var(\n --stzh-cta-grid-template-areas,\n "cta cta cta cta"\n );--grid-template-columns:var(\n --stzh-cta-grid-template-columns,\n repeat(4, minmax(0, 1fr))\n )}@media screen and (min-width: 900px){.sc-stzh-cta-h{--grid-template-areas:var(\n --stzh-cta-grid-template-areas,\n "cta cta cta cta cta cta cta cta"\n );--grid-template-columns:var(\n --stzh-cta-grid-template-columns,\n repeat(8, minmax(0, 1fr))\n )}}@media screen and (min-width: 1260px){.sc-stzh-cta-h{--grid-template-areas:var(\n --stzh-cta-grid-template-areas,\n "cta cta cta cta cta cta cta cta"\n );--grid-template-columns:var(\n --stzh-cta-grid-template-columns,\n repeat(8, minmax(0, 1fr))\n )}}[size=small].sc-stzh-cta-h{--button-background-color:transparent;--hover-button-color:var(--button-color);--hover-button-background-color:var(--button-background-color);--stuck-background-color:var(--background-color)}@media screen and (min-width: 600px){[size=small].sc-stzh-cta-h{--grid-template-areas:var(\n --stzh-cta-small-grid-template-areas,\n "cta cta cta cta"\n )}}@media screen and (min-width: 900px){[size=small].sc-stzh-cta-h{--grid-template-areas:var(\n --stzh-cta-small-grid-template-areas,\n "cta cta cta cta cta cta cta cta"\n )}}@keyframes stzh-cta-effect{0%,20%,50%,80%,100%{transform:translateX(0)}40%{transform:translateX(-0.5rem)}60%{transform:translateX(-0.25rem)}}.stzh-cta.sc-stzh-cta{font-family:var(--stzh-font-family-heavy);font-weight:var(--stzh-font-weight-heavy);font-style:var(--stzh-font-style-heavy);-moz-column-gap:var(--stzh-grid-gutter);column-gap:var(--stzh-grid-gutter);display:grid;grid-template-areas:var(--grid-template-areas);grid-template-columns:var(--grid-template-columns)}@media screen and (min-width: 600px){.stzh-cta.sc-stzh-cta{-moz-column-gap:var(--stzh-grid-gutter-small);column-gap:var(--stzh-grid-gutter-small)}}@media screen and (min-width: 900px){.stzh-cta.sc-stzh-cta{-moz-column-gap:var(--stzh-grid-gutter-medium);column-gap:var(--stzh-grid-gutter-medium)}}@media screen and (min-width: 1260px){.stzh-cta.sc-stzh-cta{-moz-column-gap:var(--stzh-grid-gutter-large);column-gap:var(--stzh-grid-gutter-large)}}@media screen and (min-width: 1600px){.stzh-cta.sc-stzh-cta{-moz-column-gap:var(--stzh-grid-gutter-ultra);column-gap:var(--stzh-grid-gutter-ultra)}}.stzh-cta__wrapper.sc-stzh-cta{grid-area:cta;background-color:var(--background-color);transition-property:background-color;transition-duration:var(--stzh-base-transition-animation-speed)}.stzh-cta__wrapper.sc-stzh-cta:has(.stzh-cta__sticky[is-stuck]:not([is-stuck=false])){background-color:var(--stuck-background-color)}.stzh-cta__heading.sc-stzh-cta,.stzh-cta__lead.sc-stzh-cta{transition-property:color;transition-duration:var(--stzh-base-transition-animation-speed)}.stzh-cta__heading.sc-stzh-cta:not(:empty),.stzh-cta__lead.sc-stzh-cta:not(:empty){margin-left:var(--stzh-space-xlarge);margin-right:var(--stzh-space-xlarge);margin-bottom:var(--stzh-space-xlarge)}@media screen and (min-width: 900px){.stzh-cta__heading.sc-stzh-cta:not(:empty),.stzh-cta__lead.sc-stzh-cta:not(:empty){margin-left:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){.stzh-cta__heading.sc-stzh-cta:not(:empty),.stzh-cta__lead.sc-stzh-cta:not(:empty){margin-left:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 900px){.stzh-cta__heading.sc-stzh-cta:not(:empty),.stzh-cta__lead.sc-stzh-cta:not(:empty){margin-right:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){.stzh-cta__heading.sc-stzh-cta:not(:empty),.stzh-cta__lead.sc-stzh-cta:not(:empty){margin-right:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 900px){.stzh-cta__heading.sc-stzh-cta:not(:empty),.stzh-cta__lead.sc-stzh-cta:not(:empty){margin-bottom:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){.stzh-cta__heading.sc-stzh-cta:not(:empty),.stzh-cta__lead.sc-stzh-cta:not(:empty){margin-bottom:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 600px){.stzh-cta__heading.sc-stzh-cta:not(:empty),.stzh-cta__lead.sc-stzh-cta:not(:empty){margin-bottom:var(--stzh-space-xxlarge)}}@media screen and (min-width: 900px){.stzh-cta__heading.sc-stzh-cta:not(:empty),.stzh-cta__lead.sc-stzh-cta:not(:empty){margin-bottom:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){.stzh-cta__heading.sc-stzh-cta:not(:empty),.stzh-cta__lead.sc-stzh-cta:not(:empty){margin-bottom:var(--stzh-space-xxxxlarge)}}.stzh-cta__heading.sc-stzh-cta{font-size:var(--stzh-font-curve-h2-default-font-size, var(--stzh-font-deci-font-size));line-height:var(--stzh-font-curve-h2-default-heading-line-height, var(--stzh-font-deci-heading-line-height));letter-spacing:var(--stzh-font-curve-h2-default-heading-letter-spacing);color:var(--heading-color)}@media screen and (min-width: 600px){.stzh-cta__heading.sc-stzh-cta{font-size:var(--stzh-font-curve-h2-small-font-size, var(--stzh-font-deca-font-size));line-height:var(--stzh-font-curve-h2-small-heading-line-height, var(--stzh-font-deca-text-line-height));letter-spacing:var(--stzh-font-curve-h2-small-heading-letter-spacing, var(--stzh-font-deca-text-letter-spacing))}}@media screen and (min-width: 900px){.stzh-cta__heading.sc-stzh-cta{font-size:var(--stzh-font-curve-h2-medium-font-size, var(--stzh-font-hecto-font-size));line-height:var(--stzh-font-curve-h2-medium-heading-line-height, var(--stzh-font-hecto-text-line-height));letter-spacing:var(--stzh-font-curve-h2-medium-heading-letter-spacing, var(--stzh-font-hecto-text-letter-spacing))}}@media screen and (min-width: 1600px){.stzh-cta__heading.sc-stzh-cta{font-size:var(--stzh-font-curve-h2-ultra-font-size, var(--stzh-font-kilo-font-size));line-height:var(--stzh-font-curve-h2-ultra-heading-line-height, var(--stzh-font-kilo-text-line-height));letter-spacing:var(--stzh-font-curve-h2-ultra-heading-letter-spacing, var(--stzh-font-kilo-text-letter-spacing))}}.stzh-cta__wrapper.sc-stzh-cta:has(.stzh-cta__sticky[is-stuck]:not([is-stuck=false])) .stzh-cta__heading.sc-stzh-cta{color:var(--stuck-heading-color)}.stzh-cta__lead.sc-stzh-cta{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));color:var(--lead-color)}@media screen and (min-width: 900px){.stzh-cta__lead.sc-stzh-cta{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)}}.stzh-cta__lead.sc-stzh-cta:not(:empty){padding-top:var(--stzh-space-medium);padding-bottom:var(--stzh-space-medium)}@media screen and (min-width: 600px){.stzh-cta__lead.sc-stzh-cta:not(:empty){padding-top:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-cta__lead.sc-stzh-cta:not(:empty){padding-top:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-cta__lead.sc-stzh-cta:not(:empty){padding-top:var(--stzh-space-xxlarge)}}@media screen and (min-width: 600px){.stzh-cta__lead.sc-stzh-cta:not(:empty){padding-bottom:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-cta__lead.sc-stzh-cta:not(:empty){padding-bottom:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-cta__lead.sc-stzh-cta:not(:empty){padding-bottom:var(--stzh-space-xxlarge)}}.stzh-cta__wrapper.sc-stzh-cta:has(.stzh-cta__sticky[is-stuck]:not([is-stuck=false])) .stzh-cta__lead.sc-stzh-cta{color:var(--stuck-lead-color)}.stzh-cta__button.sc-stzh-cta{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-centi-font-size);line-height:var(--stzh-font-centi-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing);width:100%;display:flex;align-items:center;justify-content:space-between;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;text-decoration:none;border-radius:var(--button-border-radius);color:var(--button-color);background-color:var(--button-background-color);gap:var(--stzh-space-xsmall);transition-property:width, height, min-height, color, background-color, font-size, padding;transition-duration:var(--stzh-base-transition-animation-speed)}@media screen and (min-width: 600px){.stzh-cta__button.sc-stzh-cta{width:auto}}.stzh-cta__button.sc-stzh-cta:hover{color:var(--hover-button-color);background-color:var(--hover-button-background-color)}.stzh-cta__sticky[is-stuck].sc-stzh-cta:not([is-stuck=false]) .stzh-cta__button.sc-stzh-cta{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)}@media screen and (min-width: 900px){.stzh-cta__sticky[is-stuck].sc-stzh-cta:not([is-stuck=false]) .stzh-cta__button.sc-stzh-cta{font-size:var(--stzh-font-centi-font-size);line-height:var(--stzh-font-centi-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}}.stzh-cta__button-text.sc-stzh-cta{display:block}.stzh-cta__button-icon.sc-stzh-cta{--size:var(--stzh-icon-size-medium)}.stzh-cta__button.sc-stzh-cta:hover .stzh-cta__button-icon.sc-stzh-cta{animation:stzh-cta-effect 1s}.stzh-cta__sticky.sc-stzh-cta{--padding-left:var(--stzh-space-xlarge);--padding-right:var(--stzh-space-xlarge);--padding-top:var(--stzh-space-large);--padding-bottom:var(--stzh-space-large);--background-color:var(--sticky-background-color);--stuck-background-color:var(--stuck-sticky-background-color);--stuck-padding-left:0px;--stuck-padding-right:0px;display:block}@media screen and (min-width: 900px){.stzh-cta__sticky.sc-stzh-cta{--padding-left:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){.stzh-cta__sticky.sc-stzh-cta{--padding-left:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 900px){.stzh-cta__sticky.sc-stzh-cta{--padding-right:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){.stzh-cta__sticky.sc-stzh-cta{--padding-right:var(--stzh-space-xxxlarge)}}.stzh-cta__buttons.sc-stzh-cta{display:flex;gap:var(--stzh-space-medium)}.stzh-cta--has-lead.sc-stzh-cta .stzh-cta__heading.sc-stzh-cta{margin-bottom:0}.stzh-cta--size-default.sc-stzh-cta .stzh-cta__wrapper.sc-stzh-cta{padding-top:var(--stzh-space-xxlarge);padding-bottom:var(--stzh-space-xxlarge)}@media screen and (min-width: 900px){.stzh-cta--size-default.sc-stzh-cta .stzh-cta__wrapper.sc-stzh-cta{padding-top:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){.stzh-cta--size-default.sc-stzh-cta .stzh-cta__wrapper.sc-stzh-cta{padding-top:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 900px){.stzh-cta--size-default.sc-stzh-cta .stzh-cta__wrapper.sc-stzh-cta{padding-bottom:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){.stzh-cta--size-default.sc-stzh-cta .stzh-cta__wrapper.sc-stzh-cta{padding-bottom:var(--stzh-space-xxxxlarge)}}.stzh-cta--size-default.sc-stzh-cta .stzh-cta__button.sc-stzh-cta{padding:var(--stzh-space-xsmall) var(--stzh-space-xlarge);min-height:var(--stzh-form-input-height)}@media screen and (max-width: 599px){.stzh-cta--size-default.sc-stzh-cta .stzh-cta__button-icon.sc-stzh-cta{display:none}}.stzh-cta--size-default.sc-stzh-cta .stzh-cta__sticky[is-stuck].sc-stzh-cta:not([is-stuck=false]) .stzh-cta__button.sc-stzh-cta{min-height:var(--stzh-form-input-small-height)}@media screen and (min-width: 900px){.stzh-cta--size-default.sc-stzh-cta .stzh-cta__sticky[is-stuck].sc-stzh-cta:not([is-stuck=false]) .stzh-cta__button.sc-stzh-cta{min-height:var(--stzh-form-input-height)}}.stzh-cta--size-default.sc-stzh-cta .stzh-cta__sticky.sc-stzh-cta{margin-top:calc(var(--padding-top) / -1);margin-bottom:calc(var(--padding-bottom) / -1)}.stzh-cta--size-small.sc-stzh-cta .stzh-cta__button.sc-stzh-cta{width:100%;max-width:100%;gap:var(--stzh-space-medium)}.stzh-cta--size-small.sc-stzh-cta .stzh-cta__button.is-placeholder.sc-stzh-cta{width:auto;max-width:none;visibility:hidden;position:absolute;pointer-events:none}.stzh-cta--size-small.sc-stzh-cta .stzh-cta__sticky[is-stuck].sc-stzh-cta:not([is-stuck=false]) .stzh-cta__button.sc-stzh-cta:not(.is-placeholder){width:var(--button-width, auto)}.stzh-cta--size-small.sc-stzh-cta .stzh-cta__button-icon.sc-stzh-cta{--size:var(--stzh-icon-size-large)}.stzh-cta--size-small.sc-stzh-cta .stzh-cta__sticky.sc-stzh-cta{--padding-top:var(--stzh-space-xxlarge);--padding-bottom:var(--stzh-space-xxlarge)}@media screen and (min-width: 900px){.stzh-cta--size-small.sc-stzh-cta .stzh-cta__sticky.sc-stzh-cta{--padding-top:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){.stzh-cta--size-small.sc-stzh-cta .stzh-cta__sticky.sc-stzh-cta{--padding-top:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 900px){.stzh-cta--size-small.sc-stzh-cta .stzh-cta__sticky.sc-stzh-cta{--padding-bottom:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){.stzh-cta--size-small.sc-stzh-cta .stzh-cta__sticky.sc-stzh-cta{--padding-bottom:var(--stzh-space-xxxxlarge)}}.stzh-cta--size-small.sc-stzh-cta .stzh-cta__sticky[is-stuck].sc-stzh-cta:not([is-stuck=false]){--padding-top:var(--stzh-space-xlarge);--padding-bottom:var(--stzh-space-xlarge)}@media screen and (min-width: 900px){.stzh-cta--size-small.sc-stzh-cta .stzh-cta__sticky[is-stuck].sc-stzh-cta:not([is-stuck=false]){--padding-top:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){.stzh-cta--size-small.sc-stzh-cta .stzh-cta__sticky[is-stuck].sc-stzh-cta:not([is-stuck=false]){--padding-top:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 900px){.stzh-cta--size-small.sc-stzh-cta .stzh-cta__sticky[is-stuck].sc-stzh-cta:not([is-stuck=false]){--padding-bottom:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){.stzh-cta--size-small.sc-stzh-cta .stzh-cta__sticky[is-stuck].sc-stzh-cta:not([is-stuck=false]){--padding-bottom:var(--stzh-space-xxxlarge)}}.stzh-cta--is-not-loaded.sc-stzh-cta{visibility:hidden}.stzh-cta--is-not-loaded.sc-stzh-cta .stzh-cta__wrapper.sc-stzh-cta,.stzh-cta--is-not-loaded.sc-stzh-cta .stzh-cta__heading.sc-stzh-cta,.stzh-cta--is-not-loaded.sc-stzh-cta .stzh-cta__lead.sc-stzh-cta,.stzh-cta--is-not-loaded.sc-stzh-cta .stzh-cta__button.sc-stzh-cta{transition-duration:0ms}';var n=0;const r=class{constructor(s){t(this,s);this.stzhFocus=a(this,"stzhFocus",7);this.stzhBlur=a(this,"stzhBlur",7);this.focusedByInput=false;this.onRootFocus=()=>{if(!this.focusedByInput){this.button.focus()}this.focusedByInput=false};this.onFocus=t=>{this.focusedByInput=true;const a=new FocusEvent("focus",{view:window,bubbles:false,cancelable:false});this.element.dispatchEvent(a);this.stzhFocus.emit({component:"stzh-cta",originalEvent:t})};this.onBlur=t=>{const a=new FocusEvent("blur",{view:window,bubbles:false,cancelable:false});this.element.dispatchEvent(a);this.stzhBlur.emit({component:"stzh-cta",originalEvent:t})};this.handlePlaceholderButtonResize=()=>{if(this.debounceResize){window.cancelAnimationFrame(this.debounceResize)}this.debounceResize=requestAnimationFrame(this.updateButtonWidthByResize)};this.updateButtonWidthByResize=()=>{if(!this.placeholderButton){return}const{width:t}=this.placeholderButton.getBoundingClientRect();this.element.style.setProperty("--button-width",`${t}px`)};this.heading="";this.lead="";this.label="";this.href="";this.stickyDisabled=true;this.loaded=false}componentDidLoad(){this.stickyDisabled=n>1;this.placeholderButtonResizeObserver=new ResizeObserver(this.handlePlaceholderButtonResize);if(this.placeholderButton){this.placeholderButtonResizeObserver.observe(this.placeholderButton)}requestAnimationFrame((()=>{requestAnimationFrame((()=>{this.updateButtonWidthByResize();window.setTimeout((()=>{this.loaded=true}),250)}))}))}componentDidRender(){if(this.placeholderButton&&this.placeholderButtonResizeObserver){this.placeholderButtonResizeObserver.observe(this.placeholderButton)}}connectedCallback(){n=n+1}disconnectedCallback(){var t;n=n-1;(t=this.placeholderButtonResizeObserver)===null\|\|t===void 0?void 0:t.disconnect()}renderButtons(t){return s("div",{class:"stzh-cta__buttons"},t==="small"&&s("div",{class:"stzh-cta__button is-placeholder",ref:t=>this.placeholderButton=t},s("span",{class:"stzh-cta__button-text"},this.label),s("stzh-icon",{class:"stzh-cta__button-icon",name:"arrow-right"})),this.href?s("a",{class:"stzh-cta__button",href:this.href,ref:t=>this.button=t,onFocus:this.onFocus,onBlur:this.onBlur},s("span",{class:"stzh-cta__button-text"},this.label),s("stzh-icon",{class:"stzh-cta__button-icon",name:"arrow-right"})):s("button",{class:"stzh-cta__button",ref:t=>this.button=t,onFocus:this.onFocus,onBlur:this.onBlur},s("span",{class:"stzh-cta__button-text"},this.label),s("stzh-icon",{class:"stzh-cta__button-icon",name:"arrow-right"})))}render(){const t=i(this.element,"heading");const a=i(this.element,"lead");const e=!!this.heading\|\|t;const h=!!this.lead\|\|a;const n=e\|\|h;const r=!n?"small":"default";const o={"stzh-cta":true,"stzh-cta--is-sticky-disabled":this.stickyDisabled,"stzh-cta--is-not-loaded":!this.loaded,"stzh-cta--has-heading":e,"stzh-cta--has-lead":h,[`stzh-cta--size-${r}`]:!!r};return s(c,{size:r,tabindex:"-1",onFocus:this.onRootFocus},s("article",{class:o,"data-stzh-sticky-width-container":true},s("div",{class:"stzh-cta__wrapper"},s("div",{class:"stzh-cta__heading"},this.heading?this.heading:s("slot",{name:"heading"})),s("div",{class:"stzh-cta__lead"},this.lead?this.lead:s("slot",{name:"lead"})),s("stzh-sticky",{name:"cta",class:"stzh-cta__sticky",position:"fixed",bleeding:true,disableStickyBottom:this.stickyDisabled,disableStickyTop:true},this.renderButtons(r)))))}get element(){return e(this)}};r.style=h;export{r as stzh_cta};
2	- //# sourceMappingURL=p-5e48450d.entry.js.map

package/dist/stzh-components/p-5e48450d.entry.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"names":["stzhCtaCss","counter","StzhCta","this","focusedByInput","onRootFocus","button","focus","onFocus","event","focusEvent","FocusEvent","view","window","bubbles","cancelable","element","dispatchEvent","stzhFocus","emit","component","originalEvent","onBlur","blurEvent","stzhBlur","handlePlaceholderButtonResize","debounceResize","cancelAnimationFrame","requestAnimationFrame","updateButtonWidthByResize","placeholderButton","width","getBoundingClientRect","style","setProperty","componentDidLoad","stickyDisabled","placeholderButtonResizeObserver","ResizeObserver","observe","setTimeout","loaded","componentDidRender","connectedCallback","disconnectedCallback","_a","disconnect","renderButtons","size","h","class","ref","el","label","name","href","render","headingSlotUsed","hasSlot","leadSlotUsed","hasHeading","heading","hasLead","lead","hasHeadingOrLead","classes","Host","tabindex","position","bleeding","disableStickyBottom","disableStickyTop"],"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: #{$ctaBackgroundColor};\n --heading-color: #{$colorPrimary70};\n --lead-color: #{$colorWhite};\n --sticky-background-color: var(--background-color);\n --button-color: #{$colorWhite};\n --button-background-color: #{$colorPrimary70};\n --button-border-radius: #{$buttonBorderRadius};\n\n --hover-button-color: #{$colorWhite};\n --hover-button-background-color: #{$colorSecondary60};\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(\n --stzh-cta-grid-template-areas,\n \"cta cta cta cta\"\n );\n\n --grid-template-columns: var(\n --stzh-cta-grid-template-columns,\n #{$gridColumns}\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\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\t0%,\n\t20%,\n\t50%,\n\t80%,\n\t100% {\n\t\ttransform: translateX(0);\n\t}\n\n\t40% {\n\t\ttransform: translateX(-8px);\n\t}\n\n\t60% {\n\t\ttransform: translateX(-4px);\n\t}\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\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('p2');\n color: var(--lead-color);\n\n &:not(:empty) {\n @include spaceCurve('padding-top', 'regular');\n @include spaceCurve('padding-bottom', 'regular');\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: 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\t\tanimation: 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 @include spaceCurve('padding-top', 'large');\n @include spaceCurve('padding-bottom', 'large');\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 &__sticky[is-stuck]:not([is-stuck=\"false\"]) &__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 {\n Component,\n Host,\n h,\n Element,\n Prop,\n State,\n Event,\n EventEmitter,\n} from \"@stencil/core\";\n\nimport {\n StzhCtaFocusEvent,\n StzhCtaBlurEvent\n} 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 /** Input focus event */\n @Event() stzhFocus: EventEmitter<StzhCtaFocusEvent>;\n\n /** Input blur event */\n @Event() stzhBlur: EventEmitter<StzhCtaBlurEvent>;\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 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\n class=\"stzh-cta__button is-placeholder\"\n ref={(el) => (this.placeholderButton = el as HTMLElement)}\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 </div>\n }\n\n {this.href\n ?\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 >\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\n ? \"small\"\n : \"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\">\n {this.heading ? this.heading : <slot name=\"heading\"></slot>}\n </div>\n <div class=\"stzh-cta__lead\">\n {this.lead ? this.lead : <slot name=\"lead\"></slot>}\n </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"],"mappings":"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"}