npm - @oiz/stzh-components - Versions diffs - 3.3.0-beta1 → 3.3.0-beta2 - Mend

@oiz/stzh-components 3.3.0-beta1 → 3.3.0-beta2

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 (118) hide show

package/dist/stzh-components/p-10dc377b.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["stzhPagetitleCss","StzhPagetitle","this","isDisturberOpen","update","disturberElement","isMedium","media","matches","disturberHeight","_a","offsetHeight","hasDisturber","isStuck","document","documentElement","style","setProperty","init","heading","element","querySelector","disturber","leads","querySelectorAll","show","readspeakerButton","tag","setPropsIfNull","curve","level","initialOpenAnimation","mikro","type","size","nonInteractive","variant","noPaddingLeft","noPaddingRight","sizeMedium","buttonAccesskey","forEach","lead","handleResize","debounceResize","window","cancelAnimationFrame","requestAnimationFrame","handleStzhOpen","event","detail","component","handleStzhClose","componentDidRender","connectedCallback","observer","MutationObserver","observe","childList","subtree","disconnectedCallback","disconnect","render","imageSlotUsed","hasSlot","leadSlotUsed","tagSlotUsed","readspeakerSlotUsed","classes","hyphensEnabled","background","h","Host","class","name","dateline","ratio","ratioSmall","ratioMedium","ref","el"],"sources":["src/components/stzh-pagetitle/stzh-pagetitle.scss?tag=stzh-pagetitle&encapsulation=scoped","src/components/stzh-pagetitle/stzh-pagetitle.tsx"],"sourcesContent":["/**\n * @prop --background-color: Background color\n * @prop --image-background-color: Background color of image\n *\n * @prop --stzh-pagetitle-disturber-height: Global: Disturber height\n * @prop --stzh-pagetitle-disturber-stuck-height: Global: Disturber height when sticky (below medium breakpoint)\n * @prop --stzh-pagetitle-disturber-is-stuck: **Global**: Whether disturber is currently sticky (readonly variable on `<html>`)\n * @prop --stzh-pagetitle-disturber-is-not-stuck: **Global**: Whether disturber is currently not sticky (readonly variable on `<html>`)\n * @prop --stzh-pagetitle-background-color: **Global**: Background color of pagetitle.\n */\n\n:host {\n --background-color: var(--stzh-pagetitle-background-color, #{$pagetitleBackgroundColor});\n --image-background-color: #{$ratioBackgroundColor};\n\n ::slotted([slot=\"image\"]) {\n position: absolute;\n inset: 0;\n width: 100%;\n height: 100%;\n object-fit: cover;\n }\n\n &[background=\"default\"] {\n --stzh-readspeaker-background-color: var(--background-color);\n --stzh-readspeaker-audio-track-progress-background-color: #{$colorWhite};\n }\n\n &[background=\"transparent\"] {\n --background-color: transparent;\n }\n}\n\n.stzh-pagetitle {\n background-color: var(--background-color);\n\n &__container {\n @include container;\n }\n\n &__wrapper {\n position: relative;\n display: grid;\n }\n\n &__text {\n @include spaceCurve('padding-top', 'big');\n @include spaceCurve('padding-bottom', 'big');\n display: flex;\n flex-direction: column;\n justify-content: center;\n }\n\n &__image-wrapper {\n position: relative;\n }\n\n &__ratio {\n --background-color: var(--image-background-color);\n }\n\n &__image-inner-wrapper {\n background-color: var(--image-background-color);\n position: absolute;\n inset: 0;\n height: 100%;\n margin-left: calc(#{$containerMargin} / -1);\n margin-right: calc(#{$containerMargin} / -1);\n\n @include mq($from: small) {\n margin-left: calc(#{$containerMarginSmall} / -1);\n margin-right: calc(#{$containerMarginSmall} / -1);\n }\n\n @include mq($from: medium) {\n margin-left: 0;\n margin-right: 0;\n width: calc(100% + #{$containerMarginMedium});\n }\n\n @include mq($from: large) {\n width: calc(100% + #{$containerMarginLarge});\n }\n\n @include mq($from: ultra) {\n width: calc(100% + ((#{map-get($breakpoints, 'ultra')} - #{$containerMaxWidth}) / 2));\n }\n }\n\n &__meta {\n display: flex;\n flex-direction: column-reverse;\n row-gap: space('xsmall');\n\n @include mq($from: medium) {\n flex-direction: row;\n }\n }\n\n &__tag {\n &:not(:empty) {\n margin-right: auto;\n }\n }\n\n &__readspeaker {\n @include mq($from: small, $to: medium) {\n --stzh-readspeaker-dropdown-position: relative;\n --stzh-readspeaker-dropdown-top: auto;\n }\n }\n\n &__dateline {\n @include fontSize('milli');\n @include spaceCurve('margin-top', 'regular');\n color: $colorPrimary70;\n margin-bottom: space('xsmall');\n }\n\n &__lead {\n --stzh-base-lead-color: #{$headingColor};\n }\n\n &__heading:not(:empty) + &__lead:not(:empty) {\n @include spaceCurve('margin-top', 'medium');\n }\n\n &__disturber {\n z-index: $zIndexSticky;\n position: fixed;\n left: 0;\n right: 0;\n bottom: 0;\n\n @include mq($from: medium) {\n z-index: initial;\n position: absolute;\n width: calc(((100% - 7 * #{$gridGutterMedium}) / 8 * 3) + 2 * #{$gridGutterMedium});\n left: auto;\n bottom: calc((#{spaceCurveValue('huge', 'medium')} - #{spaceCurveValue('regular', 'medium')}) / -1);\n }\n\n @include mq($from: large) {\n width: calc(((100% - 11 * #{$gridGutterLarge}) / 12 * 4) + 3 * #{$gridGutterLarge});\n // bottom: calc(#{spaceCurveValue('huge', 'large')} / -1);\n }\n\n @include mq($from: ultra) {\n width: calc(((100% - 11 * #{$gridGutterUltra}) / 12 * 4) + 3 * #{$gridGutterUltra});\n }\n }\n\n /* Has no image variant */\n\n &--has-no-image &__ratio {\n display: none;\n }\n\n &--has-no-image &__text {\n @include grid;\n }\n\n &--has-no-image &__meta,\n &--has-no-image &__dateline,\n &--has-no-image &__heading,\n &--has-no-image &__lead {\n grid-column: 1 / span 4;\n }\n\n &--has-no-image &__meta,\n &--has-no-image &__dateline,\n &--has-no-image &__heading {\n @include mq($from: medium) {\n grid-column: 1 / span 8;\n }\n }\n\n &--has-no-image &__lead {\n @include mq($from: medium) {\n grid-column: 1 / span 6;\n }\n\n @include mq($from: large) {\n grid-column: 1 / span 7;\n }\n }\n\n /* Has image variant */\n\n &--has-image &__wrapper {\n @include mq($from: medium) {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n gap: space('xxlarge');\n }\n }\n\n /* Has meta */\n\n &--has-meta &__text {\n @include spaceCurve('padding-top', 'regular');\n }\n\n /* Has tag */\n\n &--has-tag &__readspeaker {\n @include mq($from: medium) {\n --stzh-readspeaker-dropdown-left: auto;\n --stzh-readspeaker-dropdown-right: 0px;\n\n --stzh-readspeaker-dropdown-settings-left: auto;\n --stzh-readspeaker-dropdown-settings-right: 0px;\n }\n }\n\n /* Default background */\n\n &--background-default &__text {\n --stzh-selection-background-color: #{$colorWhite};\n }\n\n /* Transparent background */\n\n &--background-transparent &__text {\n @include spaceCurve('padding-bottom', 'large');\n }\n\n /* Hyphens */\n &--hyphens &__heading {\n hyphens: auto;\n }\n}\n","import { Component, Element, h, Host, Listen, Prop } from \"@stencil/core\";\n\nimport { StzhDisturberCloseEvent, StzhDisturberOpenEvent } from \"../../index\";\n\nimport { hasSlot, setPropsIfNull } from \"../../utils/utils\";\nimport { media } from \"../../utils/media-utils\";\n\n/**\n * @slot heading - Slot for `stzh-heading` element\n * @slot image - Slot for `stzh-figure` or `img` element\n * @slot lead - Slot for `stzh-text` element\n * @slot tag - Slot for `stzh-tag` element\n * @slot readspeaker - Slot for `stzh-readspeaker` element\n * @slot disturber - Slot for disturber content\n */\n@Component({\n tag: \"stzh-pagetitle\",\n styleUrl: \"stzh-pagetitle.scss\",\n scoped: true,\n})\nexport class StzhPagetitle {\n @Element() element: HTMLStzhPagetitleElement;\n\n /** Background color */\n @Prop({ reflect: true }) background: \"default\" | \"transparent\" = \"default\";\n\n /** Automatic Hyphens */\n @Prop({ reflect: true }) hyphensEnabled: boolean = false;\n\n /** Dateline */\n @Prop() dateline: string;\n\n @Listen(\"resize\", { target: \"window\" })\n handleResize() {\n if (this.debounceResize) {\n window.cancelAnimationFrame(this.debounceResize);\n }\n\n this.debounceResize = requestAnimationFrame(this.update);\n }\n\n @Listen(\"stzhOpen\")\n handleStzhOpen(event: CustomEvent<StzhDisturberOpenEvent>) {\n if (event.detail.component === \"stzh-disturber\") {\n this.isDisturberOpen = true;\n requestAnimationFrame(() => {\n requestAnimationFrame(this.update);\n });\n }\n }\n\n @Listen(\"stzhClose\")\n handleStzhClose(event: CustomEvent<StzhDisturberCloseEvent>) {\n if (event.detail.component === \"stzh-disturber\") {\n this.isDisturberOpen = false;\n requestAnimationFrame(() => {\n requestAnimationFrame(this.update);\n });\n }\n }\n\n private observer: MutationObserver;\n private debounceResize: number;\n private disturberElement: HTMLDivElement;\n private isDisturberOpen: boolean = false;\n\n private update = () => {\n if (!this.disturberElement) {\n return;\n }\n\n const isMedium = media(\"medium\").matches;\n const disturberHeight = this.disturberElement?.offsetHeight || 0;\n const hasDisturber = disturberHeight && this.isDisturberOpen;\n const isStuck = hasDisturber && !isMedium;\n\n document.documentElement.style.setProperty(\n \"--stzh-pagetitle-disturber-height\",\n hasDisturber ? `${disturberHeight}px` : \"0px\"\n );\n document.documentElement.style.setProperty(\n \"--stzh-pagetitle-disturber-stuck-height\",\n isStuck ? `${disturberHeight}px` : \"0px\"\n );\n document.documentElement.style.setProperty(\"--stzh-pagetitle-disturber-is-stuck\", isStuck ? \"1\" : \"0\");\n document.documentElement.style.setProperty(\"--stzh-pagetitle-disturber-is-not-stuck\", isStuck ? \"0\" : \"1\");\n\n // document.documentElement.classList.toggle(\"stzh-pagetitle-disturber-is-stuck\", isStuck);\n };\n\n private init = () => {\n const heading = this.element.querySelector('stzh-heading[slot=\"heading\"], [slot=\"heading\"] stzh-heading');\n const disturber = this.element.querySelector('stzh-disturber[slot=\"disturber\"], [slot=\"disturber\"] stzh-disturber');\n const leads = this.element.querySelectorAll('stzh-text[slot=\"lead\"], [slot=\"lead\"] stzh-text');\n const show = this.element.querySelector('stzh-show[slot=\"disturber\"], [slot=\"disturber\"] stzh-show');\n const readspeakerButton = this.element.querySelector('[slot=\"readspeaker\"] stzh-button');\n const tag = this.element.querySelector('stzh-tag[slot=\"tag\"], [slot=\"tag\"] stzh-tag');\n\n if (heading) {\n setPropsIfNull(heading, {\n curve: \"hero\",\n level: \"1\",\n } as HTMLStzhHeadingElement);\n }\n\n if (disturber) {\n setPropsIfNull(disturber, {\n initialOpenAnimation: true,\n } as HTMLStzhDisturberElement);\n }\n\n if (show) {\n setPropsIfNull(show, {\n mikro: true,\n } as HTMLStzhShowElement);\n }\n\n if (tag) {\n setPropsIfNull(tag, {\n type: \"secondary\",\n size: \"large\",\n nonInteractive: true,\n } as HTMLStzhTagElement);\n }\n\n if (readspeakerButton) {\n setPropsIfNull(readspeakerButton, {\n variant: \"tertiary-plain\",\n noPaddingLeft: true,\n noPaddingRight: true,\n size: \"small\",\n sizeMedium: \"tiny\",\n buttonAccesskey: \"L\",\n } as HTMLStzhButtonElement);\n }\n\n leads.forEach(lead => {\n setPropsIfNull(lead, {\n lead: true,\n } as HTMLStzhTextElement);\n });\n };\n\n componentDidRender() {\n requestAnimationFrame(() => {\n requestAnimationFrame(this.update);\n });\n }\n\n connectedCallback() {\n this.init();\n\n this.observer = new MutationObserver(this.init);\n this.observer.observe(this.element, {\n childList: true,\n subtree: true,\n });\n }\n\n disconnectedCallback() {\n this.observer?.disconnect();\n }\n\n render() {\n const imageSlotUsed = hasSlot(this.element, \"image\");\n const leadSlotUsed = hasSlot(this.element, \"lead\");\n const tagSlotUsed = hasSlot(this.element, \"tag\");\n const readspeakerSlotUsed = hasSlot(this.element, \"readspeaker\");\n\n const classes = {\n \"stzh-pagetitle\": true,\n \"stzh-pagetitle--has-image\": imageSlotUsed,\n \"stzh-pagetitle--has-no-image\": !imageSlotUsed,\n \"stzh-pagetitle--has-lead\": leadSlotUsed,\n \"stzh-pagetitle--has-tag\": tagSlotUsed,\n \"stzh-pagetitle--has-meta\": tagSlotUsed || readspeakerSlotUsed,\n \"stzh-pagetitle--hyphens\": this.hyphensEnabled,\n [`stzh-pagetitle--background-${this.background}`]: !!this.background,\n };\n\n return (\n <Host>\n <div class={classes}>\n <div class=\"stzh-pagetitle__container\">\n <div class=\"stzh-pagetitle__wrapper\">\n <div class=\"stzh-pagetitle__text\">\n <div class=\"stzh-pagetitle__meta\">\n <div class=\"stzh-pagetitle__tag\">\n <slot name=\"tag\"></slot>\n </div>\n\n <div class=\"stzh-pagetitle__readspeaker\">\n <slot name=\"readspeaker\"></slot>\n </div>\n </div>\n\n {this.dateline && <div class=\"stzh-pagetitle__dateline\">{this.dateline}</div>}\n\n <div class=\"stzh-pagetitle__heading\">\n <slot name=\"heading\"></slot>\n </div>\n\n <div class=\"stzh-pagetitle__lead\">\n <slot name=\"lead\"></slot>\n </div>\n </div>\n\n <div class=\"stzh-pagetitle__image-wrapper\">\n <stzh-ratio\n ratio={\"16:9\"}\n ratioSmall={\"3:2\"}\n ratioMedium={\"16:9\"}\n class=\"stzh-pagetitle__ratio\"\n ></stzh-ratio>\n <div class=\"stzh-pagetitle__image-inner-wrapper\">\n <slot name=\"image\"></slot>\n </div>\n </div>\n\n <div class=\"stzh-pagetitle__disturber\" ref={el => (this.disturberElement = el as HTMLDivElement)}>\n <slot name=\"disturber\"></slot>\n </div>\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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"}

package/dist/stzh-components/p-487b6e52.entry.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{r as t,c as i,h as s,F as r,a as o,g as e}from"./p-c7bfac7a.js";import{a}from"./p-23d404e1.js";import{h}from"./p-d789f265.js";import{S as n}from"./p-fc692303.js";import{c as d}from"./p-9b063923.js";const c=".sc-stzh-datepicker-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-datepicker-h{display:none}.sc-stzh-datepicker-h::-moz-selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-datepicker-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-datepicker-h .sc-stzh-datepicker,.sc-stzh-datepicker-h .sc-stzh-datepicker::before,.sc-stzh-datepicker-h .sc-stzh-datepicker::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-datepicker-h .has-focus.sc-stzh-datepicker{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-datepicker-h .stzh-fylingfocus-focused.sc-stzh-datepicker{outline-style:none !important}.sc-stzh-datepicker-h .stzh-fylingfocus-focused.sc-stzh-datepicker::-moz-focus-inner{border:0 !important}.sc-stzh-datepicker-h{--calendar-width:var(--stzh-calendar-width);width:100%}[inline].sc-stzh-datepicker-h:not([inline=false]){width:var(--calendar-width)}.stzh-datepicker__popover.sc-stzh-datepicker{--width:auto}.stzh-datepicker__calendar.sc-stzh-datepicker{margin-left:auto;margin-right:auto}.stzh-datepicker__calendar.is-inline.sc-stzh-datepicker{width:100%;margin-left:0px;margin-right:0px}.stzh-datepicker__actions.sc-stzh-datepicker{display:flex;width:var(--calendar-width);margin-left:auto;margin-right:auto}.stzh-datepicker__actions.is-inline.sc-stzh-datepicker{width:100%;margin-left:0px;margin-right:0px}.stzh-datepicker__actions.sc-stzh-datepicker:not(:empty){padding-left:var(--stzh-space-small);padding-right:var(--stzh-space-small)}.stzh-datepicker--has-action.sc-stzh-datepicker .stzh-datepicker__popover.sc-stzh-datepicker{--content-padding:0 0 var(--stzh-space-small) 0}";const l=class{constructor(s){t(this,s);this.stzhChange=i(this,"stzhChange",7);this.handleReset=async()=>{this.value=this.defaultValue};this.onRootFocus=()=>{if(this.input){this.input.focus()}};this.onInputChanged=()=>{const t=this.dateAdapter.parse(this.input.value,"dateInput");if(this.input.value===""\|\|t){const i=this._internalDateAdapter.format(t,"dateInput");if(this.value!==i){this.value=i}else{this.valueWatcher(i)}this.stzhChange.emit({component:"stzh-datepicker",value:this.value,valueAsDate:t})}};this.onCalendarChange=t=>{if(t.detail.component!=="stzh-calendar"){t.stopPropagation();return}this.value=t.detail.valueAsDate&&this._internalDateAdapter.format(t.detail.valueAsDate,"dateInput");this.stzhChange.emit({component:"stzh-datepicker",value:this.value,valueAsDate:t.detail.valueAsDate});if(this.popover){this.popover.hide()}};this.calendarMin="";this.calendarMax="";this.calendarIsDateDisabled=()=>false;this.name="";this.value="";this.calendarValue="";this.inputValue="";this.defaultValue="";this.label="";this.labelHidden=false;this.readonly=false;this.disabled=false;this.description=undefined;this.descriptionLong=undefined;this.error=undefined;this.invalid=false;this.required=false;this.hideOptional=false;this.size="default";this.inline=false;this.dateAdapter=undefined;this.internalDateAdapter="iso";this.localization=undefined;this.buttonLabel=undefined}resetListener(t){if(t.target.contains(this.element)){requestAnimationFrame((()=>{this.handleReset()}))}}createDateFormatters(){if(this.localization){this.dateFormatLong=new Intl.DateTimeFormat(this.localization.$locale,{day:"numeric",month:"long",year:"numeric"})}}valueWatcher(t){if(!this._internalDateAdapter){return}const i=this._internalDateAdapter.parse(t,"dateInput");this.calendarValue=a(i);this.inputValue=this.dateAdapter.format(i,"dateInput");this.updateButtonAccessibleLabel()}dateAdapterWatcher(t){if(!t){this.dateAdapter=window.stzhComponents.utils.createFormatParseAdapter(this.localization.$formats,this.localization.$globals)}}internalDateAdapterWatcher(t){if(t==="iso"\|\|!t){this._internalDateAdapter=window.stzhComponents.utils.createFormatParseAdapter(this.localization.$formatsIso,this.localization.$globals)}else if(t==="legacy"){this._internalDateAdapter=window.stzhComponents.utils.createFormatParseAdapter(this.localization.$formatsLegacy,this.localization.$globals)}else{this._internalDateAdapter=t}}async setDate(t){this.value=this._internalDateAdapter.format(t,"dateInput")}async getPopover(){return this.popover}updateButtonAccessibleLabel(){if(!this.localization){return}try{const t=this._internalDateAdapter.parse(this.value,"dateInput");this.buttonLabel=`${this.label}, ${this.localization.buttonLabel}, ${this.localization.selectedDateMessage} ${this.dateFormatLong.format(t)}`}catch(t){this.buttonLabel=`${this.label}, ${this.localization.buttonLabel}`}}connectedCallback(){this.createDateFormatters()}async componentWillLoad(){if(!this.localization){this.localization=await window.stzhComponents.utils.fetchTranslations(this.element,"datepicker")}this.dateAdapterWatcher(this.dateAdapter);this.internalDateAdapterWatcher(this.internalDateAdapter);this.valueWatcher(this.value);this.defaultValue=this.defaultValue\|\|this.value}render(){const t=h(this.element,"action");const i={"stzh-datepicker":true,"stzh-datepicker--inline":this.inline,"stzh-datepicker--has-action":t};return s(o,{tabindex:this.disabled?null:"-1",onFocus:this.onRootFocus},s("div",{class:i},s("input",{type:"hidden",name:this.name,value:this.value,defaultValue:this.defaultValue}),this.inline&&s(r,null,s("stzh-calendar",{value:this.calendarValue,class:"stzh-datepicker__calendar is-inline",isDateDisabled:this.calendarIsDateDisabled,min:this.calendarMin,max:this.calendarMax,onStzhChange:this.onCalendarChange}),s("div",{class:"stzh-datepicker__actions"},s("slot",{name:"action"}))),!this.inline&&s("stzh-input",{value:this.inputValue,label:this.label,labelHidden:this.labelHidden,ref:t=>this.input=t,noAutocomplete:true,onStzhChanged:this.onInputChanged,readonly:this.readonly,disabled:this.disabled,description:this.description,descriptionLong:this.descriptionLong,error:this.error,invalid:this.invalid,required:this.required,hideOptional:this.hideOptional,size:this.size},s("stzh-popover",{ref:t=>this.popover=t,class:"stzh-datepicker__popover",slot:"button-right",placement:"bottom-end",label:this.label},s("stzh-button",{"icon-only":true,icon:"calendar",size:this.size,disabled:this.disabled,a11yLabel:this.buttonLabel}),s("div",{slot:"content"},s("stzh-calendar",{value:this.calendarValue,class:"stzh-datepicker__calendar is-popover",isDateDisabled:this.calendarIsDateDisabled,min:this.calendarMin,max:this.calendarMax,onStzhChange:this.onCalendarChange}),s("div",{class:"stzh-datepicker__actions"},s("slot",{name:"action"})))))))}get element(){return e(this)}static get watchers(){return{localization:["createDateFormatters"],value:["valueWatcher"],dateAdapter:["dateAdapterWatcher"],internalDateAdapter:["internalDateAdapterWatcher"]}}};l.style=c;const z='.sc-stzh-radio-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-radio-h{display:none}.sc-stzh-radio-h::-moz-selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-radio-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-radio-h .sc-stzh-radio,.sc-stzh-radio-h .sc-stzh-radio::before,.sc-stzh-radio-h .sc-stzh-radio::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-radio-h .has-focus.sc-stzh-radio{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-radio-h .stzh-fylingfocus-focused.sc-stzh-radio{outline-style:none !important}.sc-stzh-radio-h .stzh-fylingfocus-focused.sc-stzh-radio::-moz-focus-inner{border:0 !important}.sc-stzh-radio-h{display:inline-block}[disabled].sc-stzh-radio-h:not([disabled=false]){--description-color:var(--stzh-color-grey70)}.stzh-radio.sc-stzh-radio{display:grid}.stzh-radio__marker-symbol.sc-stzh-radio{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium)}.stzh-radio__marker-text.sc-stzh-radio{border:0;clip:rect(0 0 0 0);-webkit-clip-path:inset(100%);clip-path:inset(100%);width:0.0625rem;height:0.0625rem;overflow:hidden;padding:0;position:absolute}.stzh-radio__description-wrapper.sc-stzh-radio{display:flex;flex-direction:column-reverse;min-height:var(--description-min-height, var(--stzh-description-min-height, none))}.stzh-radio__error.sc-stzh-radio,.stzh-radio__description.sc-stzh-radio{font-size:var(--stzh-font-nano-font-size);line-height:var(--stzh-font-nano-text-line-height)}.stzh-radio__error.sc-stzh-radio{color:var(--stzh-color-error60)}.stzh-radio__error-list.sc-stzh-radio{list-style:none;margin:0;padding:0}.stzh-radio__description.sc-stzh-radio{display:flex;align-items:flex-start;color:var(--stzh-input-description-color, var(--description-color, var(--stzh-color-coolgrey70)));transition:color var(--stzh-base-transition-animation-speed)}.stzh-radio__description-long.sc-stzh-radio{margin-right:var(--stzh-space-xxsmall);margin-top:0.125rem}@supports (font: -apple-system-body) and (-webkit-appearance: none){.stzh-radio__description-long.sc-stzh-radio{margin-top:0}}.stzh-radio__description-long-popover.sc-stzh-radio{--width:auto;--max-width:27.3125rem}.stzh-radio__description-long-button.sc-stzh-radio{display:flex;justify-content:center;align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;font-family:inherit;padding:0;border:none;background-color:transparent;border-radius:0.5rem;cursor:pointer}.stzh-radio.sc-stzh-radio stzh-icon.stzh-radio__description-long-icon.sc-stzh-radio{--size:var(--stzh-icon-size-xsmall)}.stzh-radio--has-error.sc-stzh-radio .stzh-radio__error.sc-stzh-radio,.stzh-radio--has-description.sc-stzh-radio .stzh-radio__description.sc-stzh-radio{margin-top:var(--stzh-space-xxxsmall)}.stzh-radio__field-wrapper.sc-stzh-radio{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);position:relative;display:flex;-webkit-user-select:none;-moz-user-select:none;user-select:none;cursor:pointer}.stzh-radio__input.sc-stzh-radio{position:absolute;top:0;left:0;width:100%;height:100%;margin:0;z-index:-1;opacity:0;pointer-events:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:var(--stzh-form-input-border-radius)}.stzh-radio__mark.sc-stzh-radio{border:0.125rem solid var(--stzh-color-black);background-color:var(--stzh-color-white);width:1.5rem;height:1.5rem;flex-shrink:0;border-radius:50%;display:inline-flex;justify-content:center;align-items:center;transition:border-color var(--stzh-base-transition-animation-speed)}.stzh-radio__mark.sc-stzh-radio::before{content:""}.stzh-radio__check.sc-stzh-radio{background-color:currentColor;color:var(--stzh-color-primary70);width:1rem;height:1rem;border-radius:50%;opacity:0;transition-property:color;transition-duration:var(--stzh-base-transition-animation-speed)}@media (forced-colors: active), (-ms-high-contrast: active){.stzh-radio__check.sc-stzh-radio{background-color:ButtonText}}.stzh-radio__label.sc-stzh-radio{--stzh-base-color:initial;display:inline-block;color:var(--stzh-base-color);transition:color var(--stzh-base-transition-animation-speed);margin-left:var(--stzh-space-small);line-height:1.5rem}.stzh-radio__label.sc-stzh-radio:empty{display:none}.stzh-radio__marker.sc-stzh-radio{font-size:var(--stzh-font-micro-font-size);line-height:var(--stzh-font-micro-text-line-height);margin-left:calc(-0.25em + var(--stzh-space-xsmall))}.stzh-radio.sc-stzh-radio:hover .stzh-radio__label.sc-stzh-radio,.stzh-radio__input.sc-stzh-radio:checked~.stzh-radio__label.sc-stzh-radio{color:var(--stzh-color-primary70)}.stzh-radio__input.sc-stzh-radio:checked:hover~.stzh-radio__label.sc-stzh-radio,.stzh-radio__input.sc-stzh-radio:checked:hover~.stzh-radio__mark.sc-stzh-radio .stzh-radio__check.sc-stzh-radio{color:var(--stzh-color-primary90)}.stzh-radio.sc-stzh-radio:hover .stzh-radio__mark.sc-stzh-radio,.stzh-radio__input.sc-stzh-radio:checked~.stzh-radio__mark.sc-stzh-radio{border-color:var(--stzh-color-primary70)}.stzh-radio__input.sc-stzh-radio:checked:hover~.stzh-radio__mark.sc-stzh-radio{border-color:var(--stzh-color-primary90)}.stzh-radio__input.sc-stzh-radio:checked~.stzh-radio__mark.sc-stzh-radio .stzh-radio__check.sc-stzh-radio{opacity:1}.stzh-radio--is-invalid.sc-stzh-radio .stzh-radio__input.sc-stzh-radio~.stzh-radio__label.sc-stzh-radio,.stzh-radio--is-invalid.sc-stzh-radio .stzh-radio__input.sc-stzh-radio~.stzh-radio__mark.sc-stzh-radio .stzh-radio__check.sc-stzh-radio{color:var(--stzh-color-error60)}.stzh-radio--is-invalid.sc-stzh-radio .stzh-radio__input.sc-stzh-radio~.stzh-radio__mark.sc-stzh-radio{border-color:var(--stzh-color-error60)}.stzh-radio--is-disabled.sc-stzh-radio .stzh-radio__field-wrapper.sc-stzh-radio{cursor:not-allowed}.stzh-radio--is-disabled.sc-stzh-radio .stzh-radio__input.sc-stzh-radio~.stzh-radio__label.sc-stzh-radio{color:var(--stzh-color-grey60)}.stzh-radio--is-disabled.sc-stzh-radio .stzh-radio__input.sc-stzh-radio~.stzh-radio__mark.sc-stzh-radio .stzh-radio__check.sc-stzh-radio{color:var(--stzh-color-grey50)}.stzh-radio--is-disabled.sc-stzh-radio .stzh-radio__input.sc-stzh-radio~.stzh-radio__mark.sc-stzh-radio{border-color:var(--stzh-color-grey50)}.stzh-radio--is-disabled.sc-stzh-radio .stzh-radio__mark.sc-stzh-radio{background-color:var(--stzh-color-grey20)}';let p=0;const u=class{constructor(s){t(this,s);this.stzhChange=i(this,"stzhChange",7);this.stzhFocus=i(this,"stzhFocus",7);this.stzhBlur=i(this,"stzhBlur",7);this.focusedByInput=false;this.handleReset=async()=>{this.checked=this.defaultChecked};this.onInput=t=>{this.checked=this.input.checked;this.stzhChange.emit({component:"stzh-radio",originalEvent:t,value:this.value,checked:this.checked})};this.onRootFocus=()=>{if(!this.focusedByInput){this.input.focus()}this.focusedByInput=false};this.onFocus=t=>{this.focusedByInput=true;const i=new FocusEvent("focus",{view:window,bubbles:false,cancelable:false});this.element.dispatchEvent(i);this.stzhFocus.emit({component:"stzh-radio",originalEvent:t})};this.onBlur=t=>{const i=new FocusEvent("blur",{view:window,bubbles:false,cancelable:false});this.element.dispatchEvent(i);this.stzhBlur.emit({component:"stzh-radio",originalEvent:t})};this.localization=undefined;this.disabled=false;this.name="";this.value="";this.invalid=false;this.required=false;this.hideOptional=false;this.checked=false;this.defaultChecked=undefined;this.label="";this.description=undefined;this.descriptionLong=undefined;this.descriptionLongTitle=undefined;this.error=undefined;this.a11yDescribedby=""}resetListener(t){if(t.target.contains(this.element)){requestAnimationFrame((()=>{this.handleReset()}))}}errorWatcher(t){if(typeof t==="string"){try{this._error=JSON.parse(t)}catch(i){if(t){this._error=[t]}else{this._error=[]}}}else if(t){this._error=t}else{this._error=[]}}async componentWillLoad(){this.inputId=`stzh-radio-${p++}`;this.errorWatcher(this.error);this.defaultChecked=typeof this.defaultChecked==="boolean"?this.defaultChecked:this.checked;if(!this.localization){this.localization=await window.stzhComponents.utils.fetchTranslations(this.element,"radio")}}render(){var t,i;const r=h(this.element,"description")\|\|!!this.description;const e=h(this.element,"description-long")\|\|!!this.descriptionLong;const a=h(this.element,"error")\|\|((t=this._error)===null\|\|t===void 0?void 0:t.length)>0;const d={"stzh-radio":true,"stzh-radio--has-description":r,"stzh-radio--has-description-long":e,"stzh-radio--has-error":a,"stzh-radio--is-required":this.required,"stzh-radio--is-invalid":this.invalid\|\|a,"stzh-radio--is-disabled":this.disabled};return s(o,{"is-invalid":this.invalid\|\|a,tabindex:this.disabled?null:"-1",onFocus:this.onRootFocus},s("div",{class:d},s("label",{class:"stzh-radio__field-wrapper"},s("input",{class:"stzh-radio__input",ref:t=>this.input=t,type:"radio",id:this.inputId,name:this.name,value:this.value,disabled:this.disabled,"aria-describedby":`${this.inputId}-description ${this.a11yDescribedby}`,"aria-required":this.required?"true":"false","aria-invalid":this.invalid?"true":"false",checked:this.checked,defaultChecked:this.defaultChecked,onInput:this.onInput,onFocus:this.onFocus,onBlur:this.onBlur}),s("div",{class:"stzh-radio__mark"},s("div",{class:"stzh-radio__check"})),s("div",{class:"stzh-radio__label"},this.label?this.label:s("slot",null),!this.hideOptional&&s("span",{class:"stzh-radio__marker"},s("span",{class:"stzh-radio__marker-symbol","aria-hidden":"true"},this.required?this.localization.$globals.requiredFieldMarker:this.localization.$globals.optionalFieldMarker),s("span",{class:"stzh-radio__marker-text"},this.required?this.localization.$globals.requiredFieldText:this.localization.$globals.optionalFieldText)))),(((i=this._error)===null\|\|i===void 0?void 0:i.length)>0\|\|this.description)&&s(n,{classPrefix:"stzh-radio",id:`${this.inputId}-description`,error:this._error,description:this.description,descriptionLong:this.descriptionLong,descriptionLongTitle:this.descriptionLongTitle,descriptionLongUsed:e,moreInfoButtonLabel:this.localization.$globals.moreInfoButtonLabel})))}get element(){return e(this)}static get watchers(){return{error:["errorWatcher"]}}};u.style=z;const f=".sc-stzh-radiogroup-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-radiogroup-h{display:none}.sc-stzh-radiogroup-h::-moz-selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-radiogroup-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-radiogroup-h .sc-stzh-radiogroup,.sc-stzh-radiogroup-h .sc-stzh-radiogroup::before,.sc-stzh-radiogroup-h *.sc-stzh-radiogroup::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-radiogroup-h .has-focus.sc-stzh-radiogroup{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-radiogroup-h .stzh-fylingfocus-focused.sc-stzh-radiogroup{outline-style:none !important}.sc-stzh-radiogroup-h .stzh-fylingfocus-focused.sc-stzh-radiogroup::-moz-focus-inner{border:0 !important}[disabled].sc-stzh-radiogroup-h:not([disabled=false]){--description-color:var(--stzh-color-grey70)}.stzh-radiogroup.sc-stzh-radiogroup{margin:0;padding:0;border:none}.stzh-radiogroup__marker-symbol.sc-stzh-radiogroup{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium)}.stzh-radiogroup__marker-text.sc-stzh-radiogroup{border:0;clip:rect(0 0 0 0);-webkit-clip-path:inset(100%);clip-path:inset(100%);width:0.0625rem;height:0.0625rem;overflow:hidden;padding:0;position:absolute}.stzh-radiogroup__description-wrapper.sc-stzh-radiogroup{display:flex;flex-direction:column-reverse;min-height:var(--description-min-height, var(--stzh-description-min-height, none))}.stzh-radiogroup__error.sc-stzh-radiogroup,.stzh-radiogroup__description.sc-stzh-radiogroup{font-size:var(--stzh-font-nano-font-size);line-height:var(--stzh-font-nano-text-line-height)}.stzh-radiogroup__error.sc-stzh-radiogroup{color:var(--stzh-color-error60)}.stzh-radiogroup__error-list.sc-stzh-radiogroup{list-style:none;margin:0;padding:0}.stzh-radiogroup__description.sc-stzh-radiogroup{display:flex;align-items:flex-start;color:var(--stzh-input-description-color, var(--description-color, var(--stzh-color-coolgrey70)));transition:color var(--stzh-base-transition-animation-speed)}.stzh-radiogroup__description-long.sc-stzh-radiogroup{margin-right:var(--stzh-space-xxsmall);margin-top:0.125rem}@supports (font: -apple-system-body) and (-webkit-appearance: none){.stzh-radiogroup__description-long.sc-stzh-radiogroup{margin-top:0}}.stzh-radiogroup__description-long-popover.sc-stzh-radiogroup{--width:auto;--max-width:27.3125rem}.stzh-radiogroup__description-long-button.sc-stzh-radiogroup{display:flex;justify-content:center;align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;font-family:inherit;padding:0;border:none;background-color:transparent;border-radius:0.5rem;cursor:pointer}.stzh-radiogroup.sc-stzh-radiogroup stzh-icon.stzh-radiogroup__description-long-icon.sc-stzh-radiogroup{--size:var(--stzh-icon-size-xsmall)}.stzh-radiogroup--has-error.sc-stzh-radiogroup .stzh-radiogroup__error.sc-stzh-radiogroup,.stzh-radiogroup--has-description.sc-stzh-radiogroup .stzh-radiogroup__description.sc-stzh-radiogroup{margin-top:var(--stzh-space-xxxsmall)}.stzh-radiogroup__fields.sc-stzh-radiogroup{display:flex;align-items:flex-start;flex-direction:column;gap:var(--stzh-space-medium)}.stzh-radiogroup__legend.sc-stzh-radiogroup{font-family:var(--stzh-font-family-heavy);font-weight:var(--stzh-font-weight-heavy);font-style:var(--stzh-font-style-heavy);font-size:var(--stzh-font-micro-font-size);line-height:var(--stzh-font-micro-text-line-height);color:var(--stzh-heading-color);padding:0;margin-bottom:var(--stzh-space-xsmall)}.stzh-radiogroup__marker.sc-stzh-radiogroup{font-size:var(--stzh-font-nano-font-size);line-height:var(--stzh-font-nano-text-line-height);margin-left:calc(-0.25em + var(--stzh-space-xsmall))}.stzh-radiogroup--hide-legend.sc-stzh-radiogroup .stzh-radiogroup__legend.sc-stzh-radiogroup{border:0;clip:rect(0 0 0 0);-webkit-clip-path:inset(100%);clip-path:inset(100%);width:0.0625rem;height:0.0625rem;overflow:hidden;padding:0;position:absolute}.stzh-radiogroup--direction-horizontal.sc-stzh-radiogroup .stzh-radiogroup__fields.sc-stzh-radiogroup{flex-wrap:wrap;flex-direction:row;row-gap:var(--stzh-space-medium);-moz-column-gap:var(--stzh-space-xxlarge);column-gap:var(--stzh-space-xxlarge)}";const g="stzh-radio, stzh-button[type=radio], stzh-card";let m=0;const _=class{constructor(i){t(this,i);this._preventUpdateProperties=[];this.handleReset=async()=>{this.value=this.defaultValue};this.init=()=>{this.radios=Array.from(this.element.querySelectorAll(g));this.updateRadiosProperty("hide-optional",true);this.updateRadiosProperty("a11y-describedby",`${this.radiogroupId}-description`);this.updateRadiosProperty("invalid",this.invalid\|\|this.errorUsed);this.watchValue(this.value);this.watchName(this.name);this.watchDisabled(this.disabled);this.watchRequired(this.required)};this.localization=undefined;this.disabled=false;this.name=undefined;this.legend=undefined;this.hideLegend=false;this.invalid=false;this.required=false;this.hideOptional=false;this.value="";this.defaultValue="";this.direction="vertical";this.description=undefined;this.descriptionLong=undefined;this.descriptionLongTitle=undefined;this.error=undefined;this.checkedRadio=null;this.preventUpdateProperties=[]}watchName(t){this.updateRadiosProperty("name",t)}watchDisabled(t){this.updateRadiosProperty("disabled",t)}watchRequired(t){this.updateRadiosProperty("required",t)}watchValue(t){this.updateCheckedRadioByValue(t)}errorWatcher(t){if(typeof t==="string"){try{this._error=JSON.parse(t)}catch(i){if(t){this._error=[t]}else{this._error=[]}}}else if(t){this._error=t}else{this._error=[]}}preventUpdatePropertiesWatcher(t){if(typeof t==="string"){this._preventUpdateProperties=JSON.parse(t)}else{this._preventUpdateProperties=t}}resetListener(t){if(t.target.contains(this.element)){requestAnimationFrame((()=>{this.handleReset()}))}}onChange(t){this.value=t.detail.value}updateRadiosProperty(t,i){this.radios.forEach((s=>{if(t==="disabled"){if(!s.disabled){s.disabled=i}}else if(t==="name"\|\|this._preventUpdateProperties.indexOf(t)===-1){s[d(t)]=i}}))}get errorUsed(){var t;return h(this.element,"error")\|\|((t=this._error)===null\|\|t===void 0?void 0:t.length)>0}updateCheckedRadioByValue(t){this.checkedRadio=this.radios.find((i=>i.value===t));if(this.checkedRadio){this.checkedRadio.checked=true}this.uncheckRadios()}uncheckRadios(){this.radios.forEach((t=>{if(!this.checkedRadio\|\|t!==this.checkedRadio){t.checked=false}}))}componentDidLoad(){this.defaultValue=this.defaultValue?this.defaultValue:this.value}async componentWillLoad(){this.radiogroupId=`stzh-radiogroup-${m++}`;this.errorWatcher(this.error);this.preventUpdatePropertiesWatcher(this.preventUpdateProperties);if(!this.localization){this.localization=await window.stzhComponents.utils.fetchTranslations(this.element,"radiogroup")}}componentShouldUpdate(t,i,s){return s!=="checkedRadio"}componentDidRender(){this.init()}connectedCallback(){if(!this.value){this.radios=Array.from(this.element.querySelectorAll(g));const t=this.radios.find((t=>t.checked));if(t){this.value=t.value}}this.observer=new MutationObserver(this.init);this.observer.observe(this.element,{childList:true,subtree:true})}disconnectedCallback(){if(this.observer){this.observer.disconnect()}}render(){var t;const i=h(this.element,"description")\|\|!!this.description;const r=h(this.element,"description-long")\|\|!!this.descriptionLong;const e={"stzh-radiogroup":true,"stzh-radiogroup--has-description":i,"stzh-radiogroup--has-description-long":r,"stzh-radiogroup--has-error":this.errorUsed,"stzh-radiogroup--is-required":this.required,"stzh-radiogroup--is-disabled":this.disabled,"stzh-radiogroup--is-invalid":this.invalid\|\|this.errorUsed,"stzh-radiogroup--hide-legend":this.hideLegend,[`stzh-radiogroup--direction-${this.direction}`]:!!this.direction};return s(o,{"is-invalid":this.invalid\|\|this.errorUsed},s("fieldset",{class:e},this.legend&&s("legend",{class:"stzh-radiogroup__legend"},this.legend,!this.hideOptional&&s("span",{class:"stzh-radiogroup__marker"},s("span",{class:"stzh-radiogroup__marker-symbol","aria-hidden":"true"},this.required?this.localization.$globals.requiredFieldMarker:this.localization.$globals.optionalFieldMarker),s("span",{class:"stzh-radiogroup__marker-text"},this.required?this.localization.$globals.requiredFieldText:this.localization.$globals.optionalFieldText))),s("div",{class:"stzh-radiogroup__fields"},s("slot",null)),(((t=this._error)===null\|\|t===void 0?void 0:t.length)>0\|\|this.description)&&s(n,{classPrefix:"stzh-radiogroup",id:`${this.radiogroupId}-description`,error:this._error,description:this.description,descriptionLong:this.descriptionLong,descriptionLongTitle:this.descriptionLongTitle,descriptionLongUsed:r,moreInfoButtonLabel:this.localization.$globals.moreInfoButtonLabel})))}get element(){return e(this)}static get watchers(){return{name:["watchName"],disabled:["watchDisabled"],required:["watchRequired"],value:["watchValue"],error:["errorWatcher"],preventUpdateProperties:["preventUpdatePropertiesWatcher"]}}};_.style=f;export{l as stzh_datepicker,u as stzh_radio,_ as stzh_radiogroup};
2	+ //# sourceMappingURL=p-487b6e52.entry.js.map

package/dist/stzh-components/p-487b6e52.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["stzhDatepickerCss","StzhDatepicker","this","handleReset","async","value","defaultValue","onRootFocus","input","focus","onInputChanged","parsedDate","dateAdapter","parse","formattedDate","_internalDateAdapter","format","valueWatcher","stzhChange","emit","component","valueAsDate","onCalendarChange","event","detail","stopPropagation","popover","hide","resetListener","target","contains","element","requestAnimationFrame","createDateFormatters","localization","dateFormatLong","Intl","DateTimeFormat","$locale","day","month","year","newValue","date","calendarValue","printISODate","inputValue","updateButtonAccessibleLabel","dateAdapterWatcher","window","stzhComponents","utils","createFormatParseAdapter","$formats","$globals","internalDateAdapterWatcher","$formatsIso","$formatsLegacy","setDate","getPopover","buttonLabel","label","selectedDateMessage","err","connectedCallback","componentWillLoad","fetchTranslations","internalDateAdapter","render","actionUsed","hasSlot","classes","inline","h","Host","tabindex","disabled","onFocus","class","type","name","Fragment","isDateDisabled","calendarIsDateDisabled","min","calendarMin","max","calendarMax","onStzhChange","labelHidden","ref","el","noAutocomplete","onStzhChanged","readonly","description","descriptionLong","error","invalid","required","hideOptional","size","slot","placement","icon","a11yLabel","stzhRadioCss","radioCounter","StzhRadio","focusedByInput","checked","defaultChecked","onInput","originalEvent","focusEvent","FocusEvent","view","bubbles","cancelable","dispatchEvent","stzhFocus","onBlur","blurEvent","stzhBlur","errorWatcher","_error","JSON","e","inputId","descriptionUsed","descriptionLongUsed","errorUsed","_a","length","id","a11yDescribedby","requiredFieldMarker","optionalFieldMarker","requiredFieldText","optionalFieldText","_b","StzhInputDescription","classPrefix","descriptionLongTitle","moreInfoButtonLabel","stzhRadiogroupCss","SELECTOR_RADIO","radiogroupCounter","StzhRadiogroup","_preventUpdateProperties","init","radios","Array","from","querySelectorAll","updateRadiosProperty","radiogroupId","watchValue","watchName","watchDisabled","watchRequired","updateCheckedRadioByValue","preventUpdatePropertiesWatcher","onChange","prop","forEach","radio","indexOf","camelCase","checkedRadio","find","uncheckRadios","componentDidLoad","preventUpdateProperties","componentShouldUpdate","_newValue","_oldValue","componentDidRender","observer","MutationObserver","observe","childList","subtree","disconnectedCallback","disconnect","hideLegend","direction","legend"],"sources":["src/components/stzh-datepicker/stzh-datepicker.scss?tag=stzh-datepicker&encapsulation=scoped","src/components/stzh-datepicker/stzh-datepicker.tsx","src/components/stzh-radio/stzh-radio.scss?tag=stzh-radio&encapsulation=scoped","src/components/stzh-radio/stzh-radio.tsx","src/components/stzh-radiogroup/stzh-radiogroup.scss?tag=stzh-radiogroup&encapsulation=scoped","src/components/stzh-radiogroup/stzh-radiogroup.tsx"],"sourcesContent":[":host {\n --calendar-width: #{$calendarWidth};\n\n width: 100%;\n\n &[inline]:not([inline=\"false\"]) {\n width: var(--calendar-width);\n }\n}\n\n.stzh-datepicker {\n &__popover {\n --width: auto;\n }\n\n &__calendar {\n margin-left: auto;\n margin-right: auto;\n\n &.is-inline {\n width: 100%;\n margin-left: 0px;\n margin-right: 0px;\n }\n }\n\n &__actions {\n display: flex;\n width: var(--calendar-width);\n margin-left: auto;\n margin-right: auto;\n\n &.is-inline {\n width: 100%;\n margin-left: 0px;\n margin-right: 0px;\n }\n\n &:not(:empty) {\n padding-left: space('small');\n padding-right: space('small');\n }\n }\n\n /* Has action */\n\n &--has-action &__popover {\n --content-padding: 0 0 #{space('small')} 0;\n }\n}\n","import {\n Component,\n Prop,\n Host,\n Element,\n h,\n Event,\n EventEmitter,\n Method,\n Watch,\n Fragment,\n State,\n Listen\n} from \"@stencil/core\";\n\nimport {\n StzhCalendarChangeEvent,\n StzhDatepickerChangeEvent\n} from \"../../index\";\n\nimport { StzhCalendarDateDisabledPredicate } from \"../../index\";\n\nimport { printISODate } from \"../../utils/date-utils\"\nimport { StzhLocaleAdapter } from \"../../utils/date-adapter\"\n\nimport { StzhDatepickerLocalizedText } from \"./stzh-datepicker.localization\";\nimport { hasSlot } from \"../../utils/utils\";\n\n/**\n * @slot action - Slot for action below calendar (stzh-link element)\n */\n@Component({\n tag: \"stzh-datepicker\",\n styleUrl: \"stzh-datepicker.scss\",\n scoped: true\n})\nexport class StzhDatepicker {\n /**\n * Minimum date allowed to be picked. Must be in IS0-8601 format: YYYY-MM-DD.\n * This setting can be used alone or together with the max property.\n */\n @Prop() calendarMin: string = \"\"\n\n /**\n * Maximum date allowed to be picked. Must be in IS0-8601 format: YYYY-MM-DD.\n * This setting can be used alone or together with the min property.\n */\n @Prop() calendarMax: string = \"\"\n\n /**\n * Controls which days are disabled and therefore disallowed.\n * For example, this can be used to disallow selection of weekends.\n */\n @Prop() calendarIsDateDisabled: StzhCalendarDateDisabledPredicate = () => false\n\n /** Name of the hidden date picker input. */\n @Prop({ reflect: true }) name: string = \"\";\n\n /** Value of the hidden date picker input. If a date can be parsed (via picker always), the value is in ISO format. Otherwise the value equals the manual input. */\n @Prop({ mutable: true }) value: string = \"\";\n @State() calendarValue: string = \"\";\n @State() inputValue: string = \"\";\n\n /** Default value (used by reset) */\n @Prop({ mutable: true }) defaultValue: string = \"\";\n\n /** Label for input field and popover */\n @Prop() label: string = \"\";\n\n /** Whether label is visually hidden. */\n @Prop() labelHidden: boolean = false;\n\n /** Whether the element is readonly or not */\n @Prop({ reflect: true }) readonly: boolean = false;\n\n /** Whether the element is disabled or not */\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /** Description message (use description slot as alternative) */\n @Prop() description: string;\n\n /** Long description message appearing in a popover (use description-long slot as alternative) */\n @Prop() descriptionLong: string;\n\n /** One or multiple error message (use error slot as alternative) */\n @Prop() error: string | string[];\n\n /** Invalid status */\n @Prop({ reflect: true }) invalid: boolean = false;\n\n /** Required status */\n @Prop({ reflect: true }) required: boolean = false;\n\n /** Hide `(optional)` label (or use `required` inside form to hide it) */\n @Prop({ reflect: true }) hideOptional: boolean = false;\n\n /** Size variant */\n @Prop({ reflect: true }) size: \"default\" | \"small\" = \"default\";\n\n /** Show calendar inline */\n @Prop({ reflect: true }) inline: boolean = false;\n\n /**\n * Date adapter visible date shown to the user, for custom parsing/formatting.\n * Must be object with a `parse` function which accepts a `string` and returns a `Date`,\n * and a `format` function which accepts a `Date` and returns a `string`.\n */\n @Prop() dateAdapter: StzhLocaleAdapter;\n\n /**\n * Date adapter for internal date passed to backend, for custom parsing/formatting.\n * Can be `\"iso\"` (default, date in ISO format) / `\"legacy\"` (date in `d.m.Y` format)\n * or `StzhLocaleAdapter` (must be object with a `parse` function which accepts a `string` and returns a `Date`,\n * and a `format` function which accepts a `Date` and returns a `string`.)\n */\n @Prop() internalDateAdapter: \"iso\" | \"legacy\" | StzhLocaleAdapter = \"iso\";\n private _internalDateAdapter: StzhLocaleAdapter;\n\n /** Translation strings. */\n @Prop() localization: StzhDatepickerLocalizedText;\n\n @State() buttonLabel: string;\n\n @Listen(\"reset\", { target: \"document\" })\n resetListener(event: Event) {\n if ((event.target as HTMLElement).contains(this.element)) {\n requestAnimationFrame(() => {\n this.handleReset();\n });\n }\n }\n\n @Watch(\"localization\")\n createDateFormatters() {\n if (this.localization) {\n this.dateFormatLong = new Intl.DateTimeFormat(this.localization.$locale, {\n day: \"numeric\",\n month: \"long\",\n year: \"numeric\",\n })\n }\n }\n\n /** Update calendar and input when value prop has changed */\n @Watch(\"value\")\n valueWatcher(newValue: string) {\n if (!this._internalDateAdapter) {\n return;\n }\n\n const date = this._internalDateAdapter.parse(newValue, \"dateInput\");\n\n this.calendarValue = printISODate(date);\n this.inputValue = this.dateAdapter.format(date, \"dateInput\");\n\n this.updateButtonAccessibleLabel();\n }\n\n @Watch(\"dateAdapter\")\n dateAdapterWatcher(newValue: StzhLocaleAdapter) {\n if (!newValue) {\n this.dateAdapter = window.stzhComponents.utils.createFormatParseAdapter(\n this.localization.$formats,\n this.localization.$globals\n );\n }\n }\n\n @Watch(\"internalDateAdapter\")\n internalDateAdapterWatcher(newValue: \"iso\" | \"legacy\" | StzhLocaleAdapter) {\n if (newValue === \"iso\" || !newValue) {\n this._internalDateAdapter = window.stzhComponents.utils.createFormatParseAdapter(\n this.localization.$formatsIso,\n this.localization.$globals\n );\n } else if (newValue === \"legacy\") {\n this._internalDateAdapter = window.stzhComponents.utils.createFormatParseAdapter(\n this.localization.$formatsLegacy,\n this.localization.$globals\n );\n } else {\n this._internalDateAdapter = newValue;\n }\n }\n\n /** Set value by a JS Date object */\n @Method()\n async setDate(date: Date) {\n this.value = this._internalDateAdapter.format(date, \"dateInput\");\n }\n\n /** Return internal popover element */\n @Method()\n async getPopover(): Promise<HTMLStzhPopoverElement> {\n return this.popover;\n }\n\n /** Datepicker change event */\n @Event() stzhChange: EventEmitter<StzhDatepickerChangeEvent>;\n\n @Element() element: HTMLStzhDatepickerElement;\n\n /**\n * To format dates exclusively for the benefit of screen readers.\n *\n * We prefer DateTimeFormat over date.toLocaleDateString, as the former has\n * better performance when formatting large number of dates. See:\n * https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString#Performance\n */\n private dateFormatLong: Intl.DateTimeFormat\n\n private input: HTMLStzhInputElement;\n private popover: HTMLStzhPopoverElement;\n // private calendar: HTMLStzhCalendarElement;\n\n private handleReset = async () => {\n this.value = this.defaultValue;\n }\n\n private onRootFocus = () => {\n if (this.input) {\n this.input.focus();\n }\n }\n\n private onInputChanged = () => {\n const parsedDate = this.dateAdapter.parse(this.input.value, \"dateInput\");\n\n if (this.input.value === \"\" || parsedDate) {\n const formattedDate = this._internalDateAdapter.format(parsedDate, \"dateInput\");\n\n if (this.value !== formattedDate) {\n this.value = formattedDate;\n } else {\n this.valueWatcher(formattedDate);\n }\n\n this.stzhChange.emit({\n component: \"stzh-datepicker\",\n value: this.value,\n valueAsDate: parsedDate,\n })\n }\n }\n\n private onCalendarChange = (event: CustomEvent<StzhCalendarChangeEvent>) => {\n if (event.detail.component !== \"stzh-calendar\") {\n // Do not emit stzhChange event from year/month dropdowns\n event.stopPropagation();\n return;\n }\n\n this.value = event.detail.valueAsDate\n && this._internalDateAdapter.format(event.detail.valueAsDate, \"dateInput\");\n\n this.stzhChange.emit({\n component: \"stzh-datepicker\",\n value: this.value,\n valueAsDate: event.detail.valueAsDate,\n });\n\n if (this.popover) {\n this.popover.hide();\n }\n }\n\n private updateButtonAccessibleLabel() {\n if (!this.localization) {\n return;\n }\n\n try {\n const valueAsDate = this._internalDateAdapter.parse(this.value, \"dateInput\");\n this.buttonLabel = `${this.label}, ${this.localization.buttonLabel}, ${this.localization.selectedDateMessage} ${this.dateFormatLong.format(valueAsDate)}`;\n } catch (err) {\n this.buttonLabel = `${this.label}, ${this.localization.buttonLabel}`;\n }\n }\n\n connectedCallback() {\n this.createDateFormatters();\n }\n\n async componentWillLoad() {\n if (!this.localization) {\n this.localization = await window.stzhComponents.utils.fetchTranslations(this.element, \"datepicker\");\n }\n\n this.dateAdapterWatcher(this.dateAdapter);\n this.internalDateAdapterWatcher(this.internalDateAdapter);\n this.valueWatcher(this.value);\n this.defaultValue = this.defaultValue || this.value;\n }\n\n render() {\n const actionUsed = hasSlot(this.element, 'action');\n\n const classes = {\n \"stzh-datepicker\": true,\n \"stzh-datepicker--inline\": this.inline,\n \"stzh-datepicker--has-action\": actionUsed\n };\n\n return (\n <Host tabindex={this.disabled ? null : \"-1\"} onFocus={this.onRootFocus}>\n <div class={classes}>\n <input\n type=\"hidden\"\n name={this.name}\n value={this.value}\n defaultValue={this.defaultValue}\n />\n\n {this.inline &&\n <Fragment>\n <stzh-calendar\n // ref={(el) => (this.calendar = el as HTMLStzhCalendarElement)}\n value={this.calendarValue}\n class=\"stzh-datepicker__calendar is-inline\"\n isDateDisabled={this.calendarIsDateDisabled}\n min={this.calendarMin}\n max={this.calendarMax}\n onStzhChange={this.onCalendarChange}\n ></stzh-calendar>\n <div class=\"stzh-datepicker__actions\">\n <slot name=\"action\"></slot>\n </div>\n </Fragment>\n }\n\n {!this.inline &&\n <stzh-input\n value={this.inputValue}\n label={this.label}\n labelHidden={this.labelHidden}\n ref={(el) => (this.input = el as HTMLStzhInputElement)}\n noAutocomplete\n onStzhChanged={this.onInputChanged}\n readonly={this.readonly}\n disabled={this.disabled}\n description={this.description}\n descriptionLong={this.descriptionLong}\n error={this.error}\n invalid={this.invalid}\n required={this.required}\n hideOptional={this.hideOptional}\n size={this.size}\n >\n <stzh-popover\n ref={(el) => (this.popover = el as HTMLStzhPopoverElement)}\n class=\"stzh-datepicker__popover\"\n slot=\"button-right\"\n placement=\"bottom-end\"\n label={this.label}\n >\n <stzh-button\n icon-only\n icon=\"calendar\"\n size={this.size}\n disabled={this.disabled}\n a11yLabel={this.buttonLabel}\n ></stzh-button>\n <div slot=\"content\">\n <stzh-calendar\n // ref={(el) => (this.calendar = el as HTMLStzhCalendarElement)}\n value={this.calendarValue}\n class=\"stzh-datepicker__calendar is-popover\"\n isDateDisabled={this.calendarIsDateDisabled}\n min={this.calendarMin}\n max={this.calendarMax}\n onStzhChange={this.onCalendarChange}\n >\n </stzh-calendar>\n <div class=\"stzh-datepicker__actions\">\n <slot name=\"action\"></slot>\n </div>\n </div>\n </stzh-popover>\n </stzh-input>\n }\n </div>\n </Host>\n );\n }\n}\n",":host {\n display: inline-block;\n\n &[disabled]:not([disabled=\"false\"]) {\n --description-color: #{$formDisabledColor};\n }\n}\n\n.stzh-radio {\n @include input-description;\n display: grid;\n\n &__field-wrapper {\n @include fontSize('milli');\n position: relative;\n display: flex;\n user-select: none;\n cursor: pointer;\n }\n\n &__input {\n @include visuallyhiddenInput;\n border-radius: $formInputBorderRadius;\n }\n\n &__mark {\n @include radio__mark();\n }\n\n &__check {\n @include radio__check();\n }\n\n &__label {\n --stzh-base-color: initial;\n\n display: inline-block;\n color: $baseColor;\n transition: color $baseTransitionAnimationSpeed;\n margin-left: space('small');\n line-height: 24px;\n\n &:empty {\n display: none;\n }\n }\n\n &__marker {\n @include fontSize('micro');\n margin-left: calc(-0.25em + #{space('xsmall')});\n }\n\n /* Hover / Focus / Checked */\n\n &:hover &__label,\n &__input:checked ~ &__label {\n color: $colorPrimary70;\n }\n\n &__input:checked:hover ~ &__label,\n &__input:checked:hover ~ &__mark &__check {\n color: $colorPrimary90;\n }\n\n &:hover &__mark,\n &__input:checked ~ &__mark {\n border-color: $colorPrimary70;\n }\n\n &__input:checked:hover ~ &__mark {\n border-color: $colorPrimary90;\n }\n\n &__input:checked ~ &__mark &__check {\n opacity: 1;\n }\n\n /* Invalid */\n\n &--is-invalid &__input ~ &__label,\n &--is-invalid &__input ~ &__mark &__check {\n color: $colorError60;\n }\n\n &--is-invalid &__input ~ &__mark {\n border-color: $colorError60;\n }\n\n /* Disabled */\n\n\t&--is-disabled &__field-wrapper {\n cursor: not-allowed;\n }\n\n &--is-disabled &__input ~ &__label {\n color: $colorGrey60;\n }\n\n &--is-disabled &__input ~ &__mark &__check {\n color: $colorGrey50;\n }\n\n &--is-disabled &__input ~ &__mark {\n border-color: $colorGrey50;\n }\n\n &--is-disabled &__mark {\n background-color: $colorGrey20;\n }\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Listen, Prop, Watch } from \"@stencil/core\";\n\nimport { StzhRadioBlurEvent, StzhRadioChangeEvent, StzhRadioFocusEvent } from \"../../index\";\n\nimport { hasSlot } from \"../../utils/utils\";\nimport { StzhLocaleComponent } from \"../../utils/translation-utils\";\n\nimport { StzhInputDescription } from \"../stzh-input/stzh-input-description\";\n\nlet radioCounter = 0;\n\n/**\n * @slot - Slot for label content\n * @slot description - Slot for description\n * @slot description-long - Slot for long description (in popover)\n * @slot description-long-title - Slot for long description title (in popover) / instead of descriptionLongTitle or description property\n * @slot error - Slot for error\n */\n@Component({\n tag: \"stzh-radio\",\n styleUrl: \"stzh-radio.scss\",\n scoped: true,\n})\nexport class StzhRadio {\n /** Translation strings */\n @Prop() localization: StzhLocaleComponent;\n\n /** Whether the element is disabled or not */\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /** The name of the input element */\n @Prop({ reflect: true }) name: string = \"\";\n\n /** The value of the input element */\n @Prop({ mutable: true }) value: string = \"\";\n\n /** Invalid status */\n @Prop({ reflect: true }) invalid: boolean = false;\n\n /** Required status */\n @Prop({ reflect: true }) required: boolean = false;\n\n /** Hide `(optional)` label (or use `required` inside form to hide it) */\n @Prop({ reflect: true }) hideOptional: boolean = false;\n\n /** Checked status */\n @Prop({ mutable: true, reflect: true }) checked: boolean = false;\n\n /** Default checked (used by reset) */\n @Prop({ mutable: true }) defaultChecked: boolean;\n\n /** Label */\n @Prop() label: string = \"\";\n\n /** Description message (use description slot as alternative) */\n @Prop() description: string;\n\n /** Long description message appearing in a popover (use description-long slot as alternative) */\n @Prop() descriptionLong: string;\n\n /** Long description title appearing in a popover (use description-long-title slot as or description property alternative) */\n @Prop() descriptionLongTitle: string;\n\n /** One or multiple error message (use error slot as alternative) */\n @Prop() error: string | string[];\n private _error: string[];\n\n /** Id for element which describes the radio button (this will be overwritten if description prop or slot is used, used by stzh-radiogroup) */\n @Prop({ attribute: \"a11y-describedby\" }) a11yDescribedby: string = \"\";\n\n /** Input change event */\n @Event() stzhChange: EventEmitter<StzhRadioChangeEvent>;\n\n /** Input focus event */\n @Event() stzhFocus: EventEmitter<StzhRadioFocusEvent>;\n\n /** Input blur event */\n @Event() stzhBlur: EventEmitter<StzhRadioBlurEvent>;\n\n @Listen(\"reset\", { target: \"document\" })\n resetListener(event: Event) {\n if ((event.target as HTMLElement).contains(this.element)) {\n requestAnimationFrame(() => {\n this.handleReset();\n });\n }\n }\n\n @Watch(\"error\")\n errorWatcher(newValue: string | string[]) {\n if (typeof newValue === \"string\") {\n try {\n this._error = JSON.parse(newValue);\n } catch (e) {\n if (newValue) {\n this._error = [newValue];\n } else {\n this._error = [];\n }\n }\n } else if (newValue) {\n this._error = newValue;\n } else {\n this._error = [];\n }\n }\n\n @Element() element: HTMLStzhRadioElement;\n\n private input: HTMLInputElement;\n private inputId: string;\n private focusedByInput: boolean = false;\n\n private handleReset = async () => {\n this.checked = this.defaultChecked;\n };\n\n private onInput = (event: InputEvent) => {\n this.checked = this.input.checked;\n this.stzhChange.emit({\n component: \"stzh-radio\",\n originalEvent: event,\n value: this.value,\n checked: this.checked,\n });\n };\n\n private onRootFocus = () => {\n if (!this.focusedByInput) {\n this.input.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-radio\",\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-radio\",\n originalEvent: event,\n });\n };\n\n async componentWillLoad() {\n this.inputId = `stzh-radio-${radioCounter++}`;\n this.errorWatcher(this.error);\n\n this.defaultChecked = typeof this.defaultChecked === \"boolean\" ? this.defaultChecked : this.checked;\n\n if (!this.localization) {\n this.localization = await window.stzhComponents.utils.fetchTranslations(this.element, \"radio\");\n }\n }\n\n render() {\n const descriptionUsed = hasSlot(this.element, \"description\") || !!this.description;\n const descriptionLongUsed = hasSlot(this.element, \"description-long\") || !!this.descriptionLong;\n const errorUsed = hasSlot(this.element, \"error\") || this._error?.length > 0;\n\n const classes = {\n \"stzh-radio\": true,\n \"stzh-radio--has-description\": descriptionUsed,\n \"stzh-radio--has-description-long\": descriptionLongUsed,\n \"stzh-radio--has-error\": errorUsed,\n \"stzh-radio--is-required\": this.required,\n \"stzh-radio--is-invalid\": this.invalid || errorUsed,\n \"stzh-radio--is-disabled\": this.disabled,\n };\n\n return (\n <Host is-invalid={this.invalid || errorUsed} tabindex={this.disabled ? null : \"-1\"} onFocus={this.onRootFocus}>\n <div class={classes}>\n <label class=\"stzh-radio__field-wrapper\">\n <input\n class=\"stzh-radio__input\"\n ref={el => (this.input = el as HTMLInputElement)}\n type=\"radio\"\n id={this.inputId}\n name={this.name}\n value={this.value}\n disabled={this.disabled}\n aria-describedby={`${this.inputId}-description ${this.a11yDescribedby}`}\n aria-required={this.required ? \"true\" : \"false\"}\n aria-invalid={this.invalid ? \"true\" : \"false\"}\n checked={this.checked}\n defaultChecked={this.defaultChecked}\n onInput={this.onInput}\n onFocus={this.onFocus}\n onBlur={this.onBlur}\n />\n <div class=\"stzh-radio__mark\">\n <div class=\"stzh-radio__check\"></div>\n </div>\n <div class=\"stzh-radio__label\">\n {this.label ? this.label : <slot></slot>}\n {!this.hideOptional && (\n <span class=\"stzh-radio__marker\">\n <span class=\"stzh-radio__marker-symbol\" aria-hidden=\"true\">\n {this.required\n ? this.localization.$globals.requiredFieldMarker\n : this.localization.$globals.optionalFieldMarker}\n </span>\n <span class=\"stzh-radio__marker-text\">\n {this.required\n ? this.localization.$globals.requiredFieldText\n : this.localization.$globals.optionalFieldText}\n </span>\n </span>\n )}\n </div>\n </label>\n {(this._error?.length > 0 || this.description) && (\n <StzhInputDescription\n classPrefix=\"stzh-radio\"\n id={`${this.inputId}-description`}\n error={this._error}\n description={this.description}\n descriptionLong={this.descriptionLong}\n descriptionLongTitle={this.descriptionLongTitle}\n descriptionLongUsed={descriptionLongUsed}\n moreInfoButtonLabel={this.localization.$globals.moreInfoButtonLabel}\n />\n )}\n </div>\n </Host>\n );\n }\n}\n",":host {\n &[disabled]:not([disabled=\"false\"]) {\n --description-color: #{$formDisabledColor};\n }\n}\n\n.stzh-radiogroup {\n @include input-description;\n margin: 0;\n padding: 0;\n border: none;\n\n &__fields {\n display: flex;\n align-items: flex-start;\n flex-direction: column;\n gap: space('medium');\n }\n\n &__legend {\n @include font('heavy');\n @include fontSize('micro');\n color: $headingColor;\n padding: 0;\n margin-bottom: space('xsmall');\n }\n\n &__marker {\n @include fontSize('nano');\n margin-left: calc(-0.25em + #{space('xsmall')});\n }\n\n &--hide-legend &__legend {\n @include visuallyhidden;\n }\n\n &--direction-horizontal &__fields {\n flex-wrap: wrap;\n flex-direction: row;\n row-gap: space('medium');\n column-gap: space('xxlarge');\n }\n}\n","import { Component, Element, h, Host, Listen, Prop, Watch } from \"@stencil/core\";\n\nimport { StzhRadioChangeEvent } from \"../../index\";\n\nimport { hasSlot } from \"../../utils/utils\";\nimport { camelCase } from \"../../utils/string-utils\";\nimport { StzhLocaleComponent } from \"../../utils/translation-utils\";\n\nimport { StzhInputDescription } from \"../stzh-input/stzh-input-description\";\n\nconst SELECTOR_RADIO = \"stzh-radio, stzh-button[type=radio], stzh-card\";\n\nlet radiogroupCounter = 0;\n\n/**\n * @slot - Slot for `stzh-radio`, `stzh-button[type=\"radio\"]` or `stzh-card` elements\n * @slot description - Slot for description\n * @slot description-long - Slot for long description (in popover)\n * @slot description-long-title - Slot for long description title (in popover) / instead of descriptionLongTitle or description property\n * @slot error - Slot for error\n */\n@Component({\n tag: \"stzh-radiogroup\",\n styleUrl: \"stzh-radiogroup.scss\",\n scoped: true,\n})\nexport class StzhRadiogroup {\n /** Translation strings */\n @Prop() localization: StzhLocaleComponent;\n\n /** Whether the element is disabled or not */\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /** The name of the input radio elements, will define the radio group. If you have more than one radio group on a page, every group needs to have its own unique name */\n @Prop({ reflect: true }) name: string;\n\n /** The legend */\n @Prop() legend: string;\n\n /** Hide legend to show only for screenreaders */\n @Prop({ reflect: true }) hideLegend: boolean = false;\n\n /** Invalid status */\n @Prop({ reflect: true }) invalid: boolean = false;\n\n /** Required status */\n @Prop({ reflect: true }) required: boolean = false;\n\n /** Hide `(optional)` label (or use `required` inside form to hide it) */\n @Prop({ reflect: true }) hideOptional: boolean = false;\n\n /** Select a radio by value */\n @Prop({ mutable: true }) value: string = \"\";\n\n /** Default value (used by reset) */\n @Prop({ mutable: true }) defaultValue: string = \"\";\n\n /** Direction */\n @Prop({ reflect: true }) direction: \"vertical\" | \"horizontal\" = \"vertical\";\n\n /** Description message (use description slot as alternative) */\n @Prop() description: string;\n\n /** Long description message appearing in a popover (use description-long slot as alternative) */\n @Prop() descriptionLong: string;\n\n /** Long description title appearing in a popover (use description-long-title slot as or description property alternative) */\n @Prop() descriptionLongTitle: string;\n\n /** One or multiple error message (use error slot as alternative) */\n @Prop() error: string | string[];\n private _error: string[];\n\n /** Current checked radio element (readonly) */\n @Prop() checkedRadio: HTMLStzhRadioElement | null = null;\n\n /** Prevent updating certain properties of radio elements (possible values inside array: disabled, invalid, required, hide-marker) */\n @Prop() preventUpdateProperties: string[] | string = [];\n private _preventUpdateProperties: string[] = [];\n\n /** Host element */\n @Element() element: HTMLElement;\n\n @Watch(\"name\")\n watchName(newValue: string) {\n this.updateRadiosProperty(\"name\", newValue);\n }\n\n @Watch(\"disabled\")\n watchDisabled(newValue: boolean) {\n this.updateRadiosProperty(\"disabled\", newValue);\n }\n\n @Watch(\"required\")\n watchRequired(newValue: boolean) {\n this.updateRadiosProperty(\"required\", newValue);\n }\n\n @Watch(\"value\")\n watchValue(newValue: string) {\n this.updateCheckedRadioByValue(newValue);\n }\n\n @Watch(\"error\")\n errorWatcher(newValue: string | string[]) {\n if (typeof newValue === \"string\") {\n try {\n this._error = JSON.parse(newValue);\n } catch (e) {\n if (newValue) {\n this._error = [newValue];\n } else {\n this._error = [];\n }\n }\n } else if (newValue) {\n this._error = newValue;\n } else {\n this._error = [];\n }\n }\n\n @Watch(\"preventUpdateProperties\")\n preventUpdatePropertiesWatcher(newValue: string[] | string) {\n if (typeof newValue === \"string\") {\n this._preventUpdateProperties = JSON.parse(newValue);\n } else {\n this._preventUpdateProperties = newValue;\n }\n }\n\n @Listen(\"reset\", { target: \"document\" })\n resetListener(event: Event) {\n if ((event.target as HTMLElement).contains(this.element)) {\n requestAnimationFrame(() => {\n this.handleReset();\n });\n }\n }\n\n @Listen(\"stzhChange\")\n onChange(event: CustomEvent<StzhRadioChangeEvent>) {\n this.value = event.detail.value;\n }\n\n /** Radio elements */\n private radios: HTMLStzhRadioElement[];\n private radiogroupId: string;\n private observer: MutationObserver;\n\n private updateRadiosProperty(prop: string, value: any) {\n this.radios.forEach((radio: HTMLStzhRadioElement) => {\n if (prop === \"disabled\") {\n // Only set the disabled if the radio is not already disabled\n if (!radio.disabled) {\n radio.disabled = value;\n }\n } else if (prop === \"name\" || this._preventUpdateProperties.indexOf(prop) === -1) {\n radio[camelCase(prop)] = value;\n }\n });\n }\n\n private get errorUsed(): boolean {\n return hasSlot(this.element, \"error\") || this._error?.length > 0;\n }\n\n private updateCheckedRadioByValue(value: string) {\n this.checkedRadio = this.radios.find(radio => radio.value === value);\n\n if (this.checkedRadio) {\n this.checkedRadio.checked = true;\n }\n\n this.uncheckRadios();\n }\n\n private uncheckRadios() {\n // make sure that no other radios are checked than the current one or no one\n this.radios.forEach((radio: HTMLStzhRadioElement) => {\n if (!this.checkedRadio || radio !== this.checkedRadio) {\n radio.checked = false;\n }\n });\n }\n\n private handleReset = async () => {\n this.value = this.defaultValue;\n };\n\n private init = () => {\n // update radios\n this.radios = Array.from(this.element.querySelectorAll(SELECTOR_RADIO));\n\n this.updateRadiosProperty(\"hide-optional\", true);\n this.updateRadiosProperty(\"a11y-describedby\", `${this.radiogroupId}-description`);\n this.updateRadiosProperty(\"invalid\", this.invalid || this.errorUsed);\n\n this.watchValue(this.value);\n this.watchName(this.name);\n this.watchDisabled(this.disabled);\n this.watchRequired(this.required);\n };\n\n componentDidLoad() {\n this.defaultValue = this.defaultValue ? this.defaultValue : this.value;\n }\n\n async componentWillLoad() {\n this.radiogroupId = `stzh-radiogroup-${radiogroupCounter++}`;\n this.errorWatcher(this.error);\n this.preventUpdatePropertiesWatcher(this.preventUpdateProperties);\n\n if (!this.localization) {\n this.localization = await window.stzhComponents.utils.fetchTranslations(this.element, \"radiogroup\");\n }\n }\n\n componentShouldUpdate(_newValue, _oldValue, prop: string) {\n return prop !== \"checkedRadio\";\n }\n\n componentDidRender() {\n this.init();\n }\n\n connectedCallback() {\n if (!this.value) {\n this.radios = Array.from(this.element.querySelectorAll(SELECTOR_RADIO));\n\n // try to find a checkbox that might has checked set to true\n const checkedRadio = this.radios.find(radio => radio.checked);\n\n if (checkedRadio) {\n this.value = checkedRadio.value;\n }\n }\n\n this.observer = new MutationObserver(this.init);\n this.observer.observe(this.element, {\n childList: true,\n subtree: true,\n });\n }\n\n disconnectedCallback() {\n if (this.observer) {\n this.observer.disconnect();\n }\n }\n\n render() {\n const descriptionUsed = hasSlot(this.element, \"description\") || !!this.description;\n const descriptionLongUsed = hasSlot(this.element, \"description-long\") || !!this.descriptionLong;\n\n const classes = {\n \"stzh-radiogroup\": true,\n \"stzh-radiogroup--has-description\": descriptionUsed,\n \"stzh-radiogroup--has-description-long\": descriptionLongUsed,\n \"stzh-radiogroup--has-error\": this.errorUsed,\n \"stzh-radiogroup--is-required\": this.required,\n \"stzh-radiogroup--is-disabled\": this.disabled,\n \"stzh-radiogroup--is-invalid\": this.invalid || this.errorUsed,\n \"stzh-radiogroup--hide-legend\": this.hideLegend,\n [`stzh-radiogroup--direction-${this.direction}`]: !!this.direction,\n };\n\n return (\n <Host is-invalid={this.invalid || this.errorUsed}>\n <fieldset class={classes}>\n {this.legend && (\n <legend class=\"stzh-radiogroup__legend\">\n {this.legend}\n {!this.hideOptional && (\n <span class=\"stzh-radiogroup__marker\">\n <span class=\"stzh-radiogroup__marker-symbol\" aria-hidden=\"true\">\n {this.required\n ? this.localization.$globals.requiredFieldMarker\n : this.localization.$globals.optionalFieldMarker}\n </span>\n <span class=\"stzh-radiogroup__marker-text\">\n {this.required\n ? this.localization.$globals.requiredFieldText\n : this.localization.$globals.optionalFieldText}\n </span>\n </span>\n )}\n </legend>\n )}\n <div class=\"stzh-radiogroup__fields\">\n <slot></slot>\n </div>\n {(this._error?.length > 0 || this.description) && (\n <StzhInputDescription\n classPrefix=\"stzh-radiogroup\"\n id={`${this.radiogroupId}-description`}\n error={this._error}\n description={this.description}\n descriptionLong={this.descriptionLong}\n descriptionLongTitle={this.descriptionLongTitle}\n descriptionLongUsed={descriptionLongUsed}\n moreInfoButtonLabel={this.localization.$globals.moreInfoButtonLabel}\n />\n )}\n </fieldset>\n </Host>\n );\n }\n}\n"],"mappings":"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"}

package/dist/stzh-components/p-4f7f4362.entry.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{r as e,c as t,e as s,w as a,h,F as i,a as r,g as n}from"./p-c7bfac7a.js";import{h as d}from"./p-d789f265.js";import{m as o}from"./p-10e2901a.js";import{t as l,c}from"./p-ed63ed76.js";import{c as m}from"./p-3d5f9ac0.js";import"./p-9b063923.js";const z=".sc-stzh-header-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-header-h{display:none}.sc-stzh-header-h::-moz-selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-header-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-header-h .sc-stzh-header,.sc-stzh-header-h .sc-stzh-header::before,.sc-stzh-header-h .sc-stzh-header::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-header-h .has-focus.sc-stzh-header{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-header-h .stzh-fylingfocus-focused.sc-stzh-header{outline-style:none !important}.sc-stzh-header-h .stzh-fylingfocus-focused.sc-stzh-header::-moz-focus-inner{border:0 !important}.sc-stzh-header-h{--logo-width:auto;--logo-height:100%;--logobar-background-color:var(--stzh-header-logobar-background-color)}@media print{.sc-stzh-header-h{display:none}}[logo-type=aoz].sc-stzh-header-h,[logo-type=pkzh].sc-stzh-header-h,[logo-type=uvz].sc-stzh-header-h{--logo-height:1.9375rem}@media screen and (min-width: 900px){[logo-type=aoz].sc-stzh-header-h,[logo-type=pkzh].sc-stzh-header-h,[logo-type=uvz].sc-stzh-header-h{--logo-height:2.1875rem}}@media screen and (min-width: 1600px){[logo-type=aoz].sc-stzh-header-h,[logo-type=pkzh].sc-stzh-header-h,[logo-type=uvz].sc-stzh-header-h{--logo-height:3.3125rem}}[logo-type=vbz].sc-stzh-header-h{--logo-height:1.8125rem}@media screen and (min-width: 900px){[logo-type=vbz].sc-stzh-header-h{--logo-height:3.3125rem}}@media screen and (min-width: 1600px){[logo-type=vbz].sc-stzh-header-h{--logo-height:3.75rem}}.sc-stzh-header-h[logo-type=vbz] .sc-stzh-header-s>[slot=logo]{align-self:center}.sc-stzh-header-h .sc-stzh-header-s>[slot=logo]{width:var(--logo-width);height:var(--logo-height)}.stzh-header.sc-stzh-header{font-size:var(--stzh-font-milli-font-size);line-height:var(--stzh-font-milli-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing);color:var(--stzh-color-grey90)}.stzh-header__inner.sc-stzh-header,.stzh-header__main.sc-stzh-header{max-width:calc(100vw - var(--stzh-scrollbar-width))}@media screen and (min-width: 600px){.stzh-header__inner.sc-stzh-header{position:relative;z-index:var(--stzh-z-index-header)}}.stzh-header__vhidden.sc-stzh-header{border:0;clip:rect(0 0 0 0);-webkit-clip-path:inset(100%);clip-path:inset(100%);width:0.0625rem;height:0.0625rem;overflow:hidden;padding:0;position:absolute}.stzh-header__main.sc-stzh-header{display:flex;flex-direction:column;background-color:var(--stzh-color-white)}@media screen and (max-width: 599px){.stzh-header__main.sc-stzh-header{position:relative;z-index:var(--stzh-z-index-header)}}.stzh-header__metabar.sc-stzh-header{background-color:var(--stzh-color-coolgrey10)}.stzh-header__metabar-inner.sc-stzh-header{margin-left:1.25rem;margin-right:1.25rem;display:flex;align-items:center;height:4rem}@media screen and (min-width: 600px){.stzh-header__metabar-inner.sc-stzh-header{margin-left:2rem;margin-right:2rem}}@media screen and (min-width: 900px){.stzh-header__metabar-inner.sc-stzh-header{margin-left:2.5rem;margin-right:2.5rem}}@media screen and (min-width: 1260px){.stzh-header__metabar-inner.sc-stzh-header{margin-left:4rem;margin-right:4rem}}@media screen and (min-width: 1600px){.stzh-header__metabar-inner.sc-stzh-header{margin-left:auto;margin-right:auto;max-width:84.25rem}}@media screen and (min-width: 900px){.stzh-header__metabar-inner.sc-stzh-header{height:4rem}}.stzh-header__burger.sc-stzh-header,.stzh-header__search.sc-stzh-header,.stzh-header__metanav-item.sc-stzh-header{color:var(--stzh-color-grey90);transition:color var(--stzh-base-transition-animation-speed);cursor:pointer}.stzh-header__burger.sc-stzh-header:hover,.stzh-header__search.sc-stzh-header:hover,.stzh-header__metanav-item.sc-stzh-header:hover{color:var(--stzh-color-black)}.stzh-header__burger.sc-stzh-header{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-milli-font-size);line-height:var(--stzh-font-milli-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing);display:flex;align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:none;padding:0;margin-right:var(--stzh-space-medium);gap:var(--stzh-space-medium);color:var(--stzh-color-primary70)}@media screen and (min-width: 600px){.stzh-header__burger.sc-stzh-header{margin-right:var(--stzh-space-xxlarge)}}@media screen and (min-width: 900px){.stzh-header__burger.sc-stzh-header{margin-right:var(--stzh-space-xxxxlarge)}}.stzh-header__burger-icon.is-open.sc-stzh-header{display:none}.stzh-header__burger.is-open.sc-stzh-header .stzh-header__burger-icon.is-open.sc-stzh-header{display:inline-flex}.stzh-header__burger.is-open.sc-stzh-header .stzh-header__burger-icon.is-close.sc-stzh-header{display:none}.stzh-header__metabar-search.sc-stzh-header{overflow:hidden;margin-right:var(--stzh-space-medium);transition-property:width;transition-duration:var(--stzh-base-transition-animation-speed);width:2.5rem;max-width:21.5625rem}.stzh-header__metabar-search.sc-stzh-header:focus-within{width:100%}@media screen and (min-width: 600px){.stzh-header__metabar-search.sc-stzh-header{width:6rem;margin-right:var(--stzh-space-xxlarge)}}@media screen and (min-width: 900px){.stzh-header__metabar-search.sc-stzh-header{width:10rem;margin-left:0;margin-right:var(--stzh-space-xxxxlarge)}}.stzh-header__search.sc-stzh-header{position:relative;display:block;width:100%}.stzh-header__search-input.sc-stzh-header{width:100%;max-width:100%;background-color:transparent;color:transparent;font-family:inherit;font-size:inherit;border:none;padding:var(--stzh-space-xsmall);padding-left:0;padding-right:0;height:var(--stzh-form-input-small-height);transition-property:padding-left, padding-right, background-color, color;transition-duration:var(--stzh-base-transition-animation-speed)}@media screen and (min-width: 600px){.stzh-header__search-input.sc-stzh-header{color:var(--stzh-color-secondary60);padding-left:calc(var(--stzh-icon-size) + var(--stzh-space-medium))}}.stzh-header__search-input.sc-stzh-header:focus{color:var(--stzh-color-secondary60);background-color:var(--stzh-color-white);padding-left:calc(var(--stzh-space-medium) + var(--stzh-icon-size) + var(--stzh-space-medium));padding-right:var(--stzh-space-xlarge)}.stzh-header__search-input.sc-stzh-header:-webkit-autofill{-webkit-background-clip:text;background-clip:text}.stzh-header__search-input[type=search].sc-stzh-header::-webkit-search-decoration,.stzh-header__search-input[type=search].sc-stzh-header::-webkit-search-cancel-button,.stzh-header__search-input[type=search].sc-stzh-header::-webkit-search-results-button,.stzh-header__search-input[type=search].sc-stzh-header::-webkit-search-results-decoration{-webkit-appearance:none}.stzh-header__search-input.sc-stzh-header:focus~.stzh-header__search-icon.sc-stzh-header,.stzh-header__search-input.sc-stzh-header:focus~.stzh-header__search-text.sc-stzh-header{transform:translate(var(--stzh-space-medium), -50%)}.stzh-header__search-input.sc-stzh-header:focus~.stzh-header__search-text.sc-stzh-header{color:var(--stzh-color-grey70)}.stzh-header__search-text.sc-stzh-header,.stzh-header__search-icon.sc-stzh-header{position:absolute;top:50%;transform:translate(0, -50%);transition:transform var(--stzh-base-transition-animation-speed)}.stzh-header__search-icon.sc-stzh-header{left:0px}@media screen and (max-width: 599px){.stzh-header__search-icon.sc-stzh-header{transform:translate(0.5rem, -50%)}}.stzh-header__search-text.sc-stzh-header{pointer-events:none;left:calc(var(--stzh-icon-size) + var(--stzh-space-medium))}@media screen and (max-width: 599px){.stzh-header__search-text.sc-stzh-header{border:0;clip:rect(0 0 0 0);-webkit-clip-path:inset(100%);clip-path:inset(100%);width:0.0625rem;height:0.0625rem;overflow:hidden;padding:0;position:absolute}}.stzh-header__metabar-nav.sc-stzh-header{display:flex;align-items:center;margin-left:auto;gap:var(--stzh-space-medium)}@media screen and (min-width: 600px){.stzh-header__metabar-nav.sc-stzh-header{gap:var(--stzh-space-xlarge)}}@media screen and (min-width: 900px){.stzh-header__metabar-nav.sc-stzh-header{gap:var(--stzh-space-xxlarge)}}.stzh-header__metanav-popover.sc-stzh-header{--width:auto;--min-width:15.875rem}.stzh-header__metanav-popover.is-langnav.sc-stzh-header{--min-width:8.75rem}.stzh-header__metanav-item.sc-stzh-header{display:none;gap:var(--stzh-space-small);align-items:center;justify-content:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;padding:0;border:none;text-decoration:none;font-size:100%;font-family:inherit;white-space:nowrap;min-width:2.5rem}@media screen and (min-width: 900px){.stzh-header__metanav-item.sc-stzh-header{display:flex}}.stzh-header__metanav-item[aria-expanded=true].sc-stzh-header{color:var(--stzh-color-primary70)}.stzh-header__metanav-item.is-heavy.sc-stzh-header{font-family:var(--stzh-font-family-heavy);font-weight:var(--stzh-font-weight-heavy);font-style:var(--stzh-font-style-heavy)}.stzh-header__metanav-item.is-stay.sc-stzh-header{display:flex}@media screen and (min-width: 900px){.stzh-header__metanav-item.is-popover-mobile.sc-stzh-header{display:none}}.stzh-header__metanav-item.is-popover-desktop.sc-stzh-header{display:none}@media screen and (min-width: 900px){.stzh-header__metanav-item.is-popover-desktop.sc-stzh-header{display:flex}}.stzh-header__metanav-menu-item.is-heavy.sc-stzh-header{font-family:var(--stzh-font-family-heavy);font-weight:var(--stzh-font-weight-heavy);font-style:var(--stzh-font-style-heavy)}.stzh-header__metanav-item-text.sc-stzh-header{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.stzh-header__metanav-item-text.is-vhidden.sc-stzh-header{border:0;clip:rect(0 0 0 0);-webkit-clip-path:inset(100%);clip-path:inset(100%);width:0.0625rem;height:0.0625rem;overflow:hidden;padding:0;position:absolute}@media screen and (max-width: 899px){.stzh-header__metanav-item-text.has-no-short-label.sc-stzh-header{border:0;clip:rect(0 0 0 0);-webkit-clip-path:inset(100%);clip-path:inset(100%);width:0.0625rem;height:0.0625rem;overflow:hidden;padding:0;position:absolute}}@media screen and (max-width: 899px){.stzh-header__metanav-item-text-label-long.sc-stzh-header{border:0;clip:rect(0 0 0 0);-webkit-clip-path:inset(100%);clip-path:inset(100%);width:0.0625rem;height:0.0625rem;overflow:hidden;padding:0;position:absolute}}.stzh-header__metanav-item-text-label-short.sc-stzh-header{display:none}@media screen and (min-width: 600px){.stzh-header__metanav-item-text-label-short.sc-stzh-header{display:flex}}@media screen and (min-width: 900px){.stzh-header__metanav-item-text-label-short.sc-stzh-header{display:none}}.stzh-header__metanav-icon-wrapper.sc-stzh-header{position:relative;display:flex;align-items:center;justify-content:center}.stzh-header__metanav-icon-badge.sc-stzh-header{position:absolute;top:-0.25rem;right:-0.25rem}.stzh-header__metanav-icon.is-open.sc-stzh-header{display:none}.stzh-header__metanav-item[aria-expanded=true].sc-stzh-header .stzh-header__metanav-icon.is-open.sc-stzh-header{display:inline-flex}.stzh-header__metanav-item[aria-expanded=true].sc-stzh-header .stzh-header__metanav-icon.is-close.sc-stzh-header{display:none}.stzh-header__logobar.sc-stzh-header{display:flex}@media screen and (min-width: 1600px){.stzh-header__logobar.sc-stzh-header{margin-left:auto;margin-right:auto;width:84.25rem}}.stzh-header__logobar-logo.sc-stzh-header{box-sizing:content-box;display:flex;overflow:hidden;flex-shrink:0}.stzh-header__logobar-decoration.sc-stzh-header{background-color:var(--logobar-background-color);flex-grow:1}@media screen and (min-width: 1600px){.stzh-header__logobar-decoration.sc-stzh-header{width:calc((100% - 34.5625rem) + ((100vw - 84.25rem - var(--stzh-scrollbar-width, 0px)) / 2));margin-right:calc((100vw - 84.25rem - var(--stzh-scrollbar-width, 0px)) / -2)}}.stzh-header__logo-link.sc-stzh-header{padding-left:var(--stzh-space-medium);padding-right:var(--stzh-space-medium);padding-top:0.875rem;padding-bottom:0.6875rem;padding-left:1.25rem;display:inline-flex;width:18rem;height:4.125rem;transition:opacity var(--stzh-base-transition-animation-speed)}@media screen and (min-width: 600px){.stzh-header__logo-link.sc-stzh-header{padding-left:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-header__logo-link.sc-stzh-header{padding-left:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-header__logo-link.sc-stzh-header{padding-left:var(--stzh-space-xxlarge)}}@media screen and (min-width: 600px){.stzh-header__logo-link.sc-stzh-header{padding-right:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-header__logo-link.sc-stzh-header{padding-right:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-header__logo-link.sc-stzh-header{padding-right:var(--stzh-space-xxlarge)}}@media screen and (min-width: 600px){.stzh-header__logo-link.sc-stzh-header{width:18.75rem;padding-left:2rem}}@media screen and (min-width: 900px){.stzh-header__logo-link.sc-stzh-header{width:24.9375rem;height:5.5rem;padding-top:1.125rem;padding-bottom:1.125rem;padding-left:2.5rem}}@media screen and (min-width: 1260px){.stzh-header__logo-link.sc-stzh-header{width:38.5625rem;height:8.4375rem;padding-top:1.75rem;padding-bottom:1.5rem;padding-left:4rem}}@media screen and (min-width: 1600px){.stzh-header__logo-link.sc-stzh-header{width:34.5625rem;padding-left:0}}.stzh-header__flyout.sc-stzh-header,.stzh-header__flyout-search.sc-stzh-header{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);z-index:calc(var(--stzh-z-index-header) - 1);position:fixed;visibility:hidden;top:0;left:0;right:0;bottom:0;width:100dvw;height:100dvh;overflow:auto;transition:visibility var(--stzh-base-transition-animation-speed)}@media (min-height: 580px){.stzh-header__flyout.sc-stzh-header{overflow:hidden}}@media screen and (min-width: 900px){.stzh-header__flyout.sc-stzh-header{overflow:hidden}}.stzh-header__flyout-backdrop.sc-stzh-header{position:absolute;width:100%;height:100%;background-color:var(--stzh-color-black40op);opacity:0;transition:opacity var(--stzh-base-transition-animation-speed)}.stzh-header__menu.sc-stzh-header{position:absolute;width:100%;height:auto;background-color:var(--stzh-color-secondary30);display:grid;grid-template-rows:auto auto;transition-property:opacity, transform;transition-duration:var(--stzh-base-transition-animation-speed);transform:translateX(-100%);opacity:0}@media (min-height: 580px){.stzh-header__menu.sc-stzh-header{height:100%;grid-template-rows:minmax(0, 1fr) auto}}@media screen and (min-width: 900px){.stzh-header__menu.sc-stzh-header{height:100%;grid-template-rows:minmax(0, 1fr) auto}}@media screen and (min-width: 900px){.stzh-header__menu.sc-stzh-header{width:20.9375rem}}@media screen and (min-width: 1260px){.stzh-header__menu.sc-stzh-header{width:23.375rem}}@media screen and (min-width: 1260px){.stzh-header__menu.sc-stzh-header{width:27.4375rem}}@media screen and (min-width: 1600px){.stzh-header__menu.sc-stzh-header{width:calc((27.4375rem - 4rem) + ((100vw - 84.25rem - var(--stzh-scrollbar-width, 0px)) / 2))}}.stzh-header__menu-nav.sc-stzh-header{position:relative;overflow-x:hidden;overflow-y:hidden}@media (min-height: 580px){.stzh-header__menu-nav.sc-stzh-header{overflow-y:auto}}@media screen and (min-width: 900px){.stzh-header__menu-nav.sc-stzh-header{overflow-y:auto;position:static}}.stzh-header__menu-metanav.sc-stzh-header{padding-top:var(--stzh-space-xsmall);padding-bottom:var(--stzh-space-xlarge);background-color:var(--stzh-color-secondary20)}@media screen and (min-width: 900px){.stzh-header__menu-metanav.sc-stzh-header{padding-top:var(--stzh-space-small)}}@media screen and (min-width: 1260px){.stzh-header__menu-metanav.sc-stzh-header{padding-top:var(--stzh-space-medium)}}@media screen and (min-width: 900px){.stzh-header__menu-metanav.sc-stzh-header{padding-bottom:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){.stzh-header__menu-metanav.sc-stzh-header{padding-bottom:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 900px){.stzh-header__menu-metanav.sc-stzh-header{display:none}}.stzh-header__menu-metanav-nav.sc-stzh-header{max-width:23.4375rem}.stzh-header__menu-list.sc-stzh-header,.stzh-header__menu-metanav-list.sc-stzh-header{display:block;list-style:none;padding:0;margin:0}.stzh-header__menu-list.sc-stzh-header,.stzh-header__menu-metanav-list.is-level-2.sc-stzh-header{padding-top:calc(var(--stzh-header-main-height) + var(--stzh-space-xxxlarge));padding-bottom:var(--stzh-space-xxxlarge)}@media screen and (min-width: 900px){.stzh-header__menu-list.sc-stzh-header,.stzh-header__menu-metanav-list.is-level-2.sc-stzh-header{padding-top:calc(var(--stzh-header-main-height) + var(--stzh-space-huge))}}.stzh-header__menu-list.is-level-2.sc-stzh-header,.stzh-header__menu-metanav-list.is-level-2.sc-stzh-header{overflow:auto;background-color:var(--stzh-color-secondary20);visibility:hidden;opacity:0;transform:translateX(100%);position:absolute;z-index:200;top:0;left:0;width:100%;height:100%;transition-property:opacity, visibility, transform;transition-duration:var(--stzh-base-transition-animation-speed)}@media screen and (min-width: 900px){.stzh-header__menu-list.is-level-2.sc-stzh-header,.stzh-header__menu-metanav-list.is-level-2.sc-stzh-header{z-index:initial;width:19.6875rem;transform:none;left:100%;transition-property:opacity, visibility}}@media screen and (min-width: 1260px){.stzh-header__menu-list.is-level-2.sc-stzh-header,.stzh-header__menu-metanav-list.is-level-2.sc-stzh-header{width:20.875rem}}@media screen and (min-width: 1600px){.stzh-header__menu-list.is-level-2.sc-stzh-header,.stzh-header__menu-metanav-list.is-level-2.sc-stzh-header{width:21.5625rem}}.stzh-header__menu-list.is-level-2.sc-stzh-header{height:-webkit-max-content;height:-moz-max-content;height:max-content}@media (min-height: 580px){.stzh-header__menu-list.is-level-2.sc-stzh-header{height:100%}}@media screen and (min-width: 900px){.stzh-header__menu-list.is-level-2.sc-stzh-header{height:100%}}.stzh-header__menu-metanav-list.is-level-2.sc-stzh-header{background-color:var(--stzh-color-secondary30);transform:none;transition-property:opacity, visibility}@media screen and (min-width: 900px){.stzh-header__menu-list.sc-stzh-header:where(:has(>.stzh-header__menu-list-item.sc-stzh-header:hover>.stzh-header__menu-list).sc-stzh-header>.stzh-header__menu-list-item.sc-stzh-header>.stzh-header__menu-list).sc-stzh-header,.stzh-header__menu-list.sc-stzh-header:where(:has(>.stzh-header__menu-list-item.is-open.sc-stzh-header>.stzh-header__menu-list).sc-stzh-header>.stzh-header__menu-list-item.sc-stzh-header>.stzh-header__menu-list).sc-stzh-header{transition-delay:var(--stzh-base-transition-animation-speed)}}@media screen and (min-width: 900px){.stzh-header__menu-list-item.sc-stzh-header:hover>.stzh-header__menu-list.sc-stzh-header,.stzh-header__menu-list-item.is-open.sc-stzh-header>.stzh-header__menu-list.sc-stzh-header{z-index:200;transition-delay:0ms;visibility:visible;opacity:1}}@media screen and (min-width: 900px){.stzh-header__menu-list-item.sc-stzh-header:hover>.stzh-header__menu-item.sc-stzh-header,.stzh-header__menu-list-item.is-open.sc-stzh-header>.stzh-header__menu-item.sc-stzh-header{background-color:var(--stzh-color-secondary40)}}@media screen and (min-width: 900px){.stzh-header__menu-list-item.sc-stzh-header:hover>.stzh-header__menu-item.is-level-2.sc-stzh-header,.stzh-header__menu-list-item.is-open.sc-stzh-header>.stzh-header__menu-item.is-level-2.sc-stzh-header{background-color:var(--stzh-color-secondary10)}}@media screen and (max-width: 899px){.stzh-header__menu-nav.sc-stzh-header:has(.stzh-header__menu-list-item.is-open),.stzh-header__menu.sc-stzh-header:has(.stzh-header__menu-metanav-list-item.is-open) .stzh-header__menu-nav.sc-stzh-header,.stzh-header__menu-list.sc-stzh-header:has(.stzh-header__menu-list-item.is-open),.stzh-header__menu-metanav-list.sc-stzh-header:has(.stzh-header__menu-metanav-list-item.is-open){transition-property:visibility;transition-duration:0ms;transition-delay:var(--stzh-base-transition-animation-speed);visibility:hidden}}@media screen and (max-width: 899px){.stzh-header__menu-list-item.is-open.sc-stzh-header>.sc-stzh-header:where(.stzh-header__menu-list),.stzh-header__menu-metanav-list-item.is-open.sc-stzh-header>.sc-stzh-header:where(.stzh-header__menu-metanav-list){transform:translateX(0);opacity:1;visibility:visible}}.stzh-header__menu-list-item.sc-stzh-header,.stzh-header__menu-metanav-list-item.sc-stzh-header{display:grid}.stzh-header__menu-list-item.is-backlink.sc-stzh-header{display:block}.stzh-header__menu-item.sc-stzh-header,.stzh-header__menu-metanav-item.sc-stzh-header{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-milli-font-size);line-height:var(--stzh-font-milli-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing);text-align:left;display:flex;align-items:center;gap:var(--stzh-space-xsmall);-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;text-decoration:none;background-color:transparent;color:var(--stzh-color-primary70);padding-left:var(--stzh-space-xxxlarge);padding-top:var(--stzh-space-small);padding-bottom:var(--stzh-space-small);padding-right:var(--stzh-space-large);transition-property:color, background-color;transition-duration:var(--stzh-base-transition-animation-speed);cursor:pointer}.stzh-header__menu-item.sc-stzh-header,.stzh-header__menu-metanav-item.is-title.sc-stzh-header{font-size:var(--stzh-font-deci-font-size);line-height:var(--stzh-font-deci-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing);min-height:3.5rem}@media screen and (min-width: 900px){.stzh-header__menu-item.sc-stzh-header,.stzh-header__menu-metanav-item.is-title.sc-stzh-header{padding-left:2.5rem}}@media screen and (min-width: 1260px){.stzh-header__menu-item.sc-stzh-header,.stzh-header__menu-metanav-item.is-title.sc-stzh-header{padding-left:4rem}}@media screen and (min-width: 1600px){.stzh-header__menu-item.is-level-1.sc-stzh-header{padding-left:calc(((100vw - 84.25rem - var(--stzh-scrollbar-width, 0px)) / 2))}}@media screen and (min-width: 900px){.stzh-header__menu-item.has-items.sc-stzh-header{cursor:default}}.stzh-header__menu-item.is-level-2.sc-stzh-header{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);min-height:3rem}@media screen and (min-width: 900px){.stzh-header__menu-item.is-level-2.sc-stzh-header{padding-left:var(--stzh-space-xlarge)}}@media screen and (min-width: 1600px){.stzh-header__menu-item.is-level-2.sc-stzh-header{padding-left:var(--stzh-space-xxlarge)}}.stzh-header__menu-item.is-level-2.is-backlink.sc-stzh-header{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);font-size:var(--stzh-font-micro-font-size);line-height:var(--stzh-font-micro-text-line-height);margin-bottom:var(--stzh-space-medium);padding-top:var(--stzh-space-medium);padding-bottom:var(--stzh-space-small);min-height:none;padding-left:1.25rem;padding-right:1.25rem;gap:var(--stzh-space-xxsmall)}@media screen and (min-width: 600px){.stzh-header__menu-item.is-level-2.is-backlink.sc-stzh-header{margin-bottom:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-header__menu-item.is-level-2.is-backlink.sc-stzh-header{margin-bottom:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-header__menu-item.is-level-2.is-backlink.sc-stzh-header{margin-bottom:var(--stzh-space-xxlarge)}}@media screen and (min-width: 600px){.stzh-header__menu-item.is-level-2.is-backlink.sc-stzh-header{padding-top:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-header__menu-item.is-level-2.is-backlink.sc-stzh-header{padding-top:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-header__menu-item.is-level-2.is-backlink.sc-stzh-header{padding-top:var(--stzh-space-xxlarge)}}@media screen and (min-width: 900px){.stzh-header__menu-item.is-level-2.is-backlink.sc-stzh-header{padding-bottom:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){.stzh-header__menu-item.is-level-2.is-backlink.sc-stzh-header{padding-bottom:var(--stzh-space-large)}}@media screen and (min-width: 600px){.stzh-header__menu-item.is-level-2.is-backlink.sc-stzh-header{padding-left:2rem;padding-right:2rem}}@media screen and (min-width: 900px){.stzh-header__menu-item.is-level-2.is-backlink.sc-stzh-header{display:none}}.stzh-header__menu-item.is-level-2.is-main.sc-stzh-header{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);margin-bottom:var(--stzh-space-xlarge)}.stzh-header__menu-metanav-item.is-level-1.sc-stzh-header{min-height:2.75rem;padding-top:var(--stzh-space-xsmall);padding-bottom:var(--stzh-space-xsmall)}.stzh-header__menu-metanav-item.is-level-2.sc-stzh-header{min-height:3.5rem;gap:var(--stzh-space-medium);padding-right:var(--stzh-space-xxlarge)}.stzh-header__menu-metanav-item.is-title.sc-stzh-header{font-family:var(--stzh-font-family-heavy);font-weight:var(--stzh-font-weight-heavy);font-style:var(--stzh-font-style-heavy);justify-content:space-between;padding-top:0;padding-bottom:0;padding-right:var(--stzh-space-medium);margin-bottom:var(--stzh-space-xlarge);cursor:default}.stzh-header__menu-metanav-item.is-language.sc-stzh-header{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);justify-content:space-between}.stzh-header__menu-metanav-item.is-action.sc-stzh-header{display:grid;padding-right:var(--stzh-space-xxxlarge);margin-top:var(--stzh-space-xlarge)}.stzh-header__menu-metanav-item.is-hidden.sc-stzh-header{display:none}.stzh-header__menu-metanav-item.is-level-1.sc-stzh-header .stzh-header__menu-metanav-item-icon.sc-stzh-header{--size:var(--stzh-icon-size-small)}.stzh-header__menu-metanav-item-text.sc-stzh-header{display:flex;gap:var(--stzh-space-xsmall)}.stzh-header__menu-metanav-item-text.is-vhidden.sc-stzh-header{border:0;clip:rect(0 0 0 0);-webkit-clip-path:inset(100%);clip-path:inset(100%);width:0.0625rem;height:0.0625rem;overflow:hidden;padding:0;position:absolute}.stzh-header__menu-metanav-item-counter.sc-stzh-header{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium)}.stzh-header__app-nav.sc-stzh-header{display:none}@media screen and (min-width: 900px){.stzh-header__app-nav.sc-stzh-header{display:block}}.stzh-header__app-nav-bottom.sc-stzh-header{position:fixed;bottom:0;left:0;width:calc(100vw - var(--stzh-scrollbar-width));z-index:var(--stzh-z-index-header)}@media screen and (min-width: 900px){.stzh-header__app-nav-bottom.sc-stzh-header{display:none}}.stzh-header--is-search-filled.sc-stzh-header .stzh-header__search-text.sc-stzh-header{border:0;clip:rect(0 0 0 0);-webkit-clip-path:inset(100%);clip-path:inset(100%);width:0.0625rem;height:0.0625rem;overflow:hidden;padding:0;position:absolute}.stzh-header--hide-logo.sc-stzh-header .stzh-header__logo-link.sc-stzh-header{opacity:0}@media screen and (min-width: 600px){.stzh-header--is-fixed.sc-stzh-header .stzh-header__inner.sc-stzh-header{transform:translateY(-100%);position:fixed;top:0;left:0;right:0;margin-top:calc(var(--stzh-header-logobar-height) / -1)}}@media screen and (max-width: 599px){.stzh-header--is-fixed.sc-stzh-header .stzh-header__main.sc-stzh-header{transform:translateY(-100%);position:fixed;top:0;left:0;right:0;margin-top:calc(var(--stzh-header-logobar-height) / -1)}}@media screen and (min-width: 600px){.stzh-header--is-fixed-transition.sc-stzh-header .stzh-header__inner.sc-stzh-header{transition-property:transform;transition-duration:var(--stzh-base-transition-animation-speed)}}@media screen and (max-width: 599px){.stzh-header--is-fixed-transition.sc-stzh-header .stzh-header__main.sc-stzh-header{transition-property:transform;transition-duration:var(--stzh-base-transition-animation-speed)}}.stzh-header--is-sticky-transition.sc-stzh-header .stzh-header__logobar.sc-stzh-header{transition-property:opacity, visibility;transition-duration:var(--stzh-base-transition-animation-speed)}.stzh-header--is-sticky-transition.sc-stzh-header .stzh-header__inner.sc-stzh-header,.stzh-header--is-sticky-transition.sc-stzh-header .stzh-header__main.sc-stzh-header{transition-property:transform, margin-top;transition-duration:var(--stzh-base-transition-animation-speed)}@media screen and (min-width: 600px){.stzh-header--is-sticky.sc-stzh-header .stzh-header__inner.sc-stzh-header{transform:translateY(0)}}@media screen and (max-width: 599px){.stzh-header--is-sticky.sc-stzh-header .stzh-header__main.sc-stzh-header{transform:translateY(0)}}@media screen and (min-width: 600px) and (max-width: 899px){.stzh-header--is-sticky.sc-stzh-header:where(.stzh-header--has-empty-metabar-mobile) .stzh-header__inner.sc-stzh-header{margin-top:calc((var(--stzh-header-logobar-height) + var(--stzh-header-metabar-height)) / -1)}}@media screen and (max-width: 599px){.stzh-header--is-sticky.sc-stzh-header:where(.stzh-header--has-empty-metabar-mobile) .stzh-header__main.sc-stzh-header{margin-top:calc((var(--stzh-header-logobar-height) + var(--stzh-header-metabar-height)) / -1)}}@media screen and (max-width: 899px){.stzh-header--is-sticky.sc-stzh-header:where(.stzh-header--has-empty-metabar-mobile) .stzh-header__metabar.sc-stzh-header{visibility:hidden}}@media screen and (min-width: 600px){.stzh-header--is-sticky.sc-stzh-header:where(.stzh-header--has-empty-metabar) .stzh-header__inner.sc-stzh-header{margin-top:calc((var(--stzh-header-logobar-height) + var(--stzh-header-metabar-height)) / -1)}}@media screen and (max-width: 599px){.stzh-header--is-sticky.sc-stzh-header:where(.stzh-header--has-empty-metabar) .stzh-header__main.sc-stzh-header{margin-top:calc((var(--stzh-header-logobar-height) + var(--stzh-header-metabar-height)) / -1)}}.stzh-header--is-sticky.sc-stzh-header:where(.stzh-header--has-empty-metabar) .stzh-header__metabar.sc-stzh-header{visibility:hidden}.stzh-header--is-sticky.sc-stzh-header .stzh-header__logobar.sc-stzh-header{visibility:hidden;opacity:0}.stzh-header--sticky-always-full.sc-stzh-header .stzh-header__inner.sc-stzh-header,.stzh-header--sticky-always-full.sc-stzh-header .stzh-header__main.sc-stzh-header{margin-top:0px}.stzh-header--sticky-always-full.sc-stzh-header .stzh-header__logobar.sc-stzh-header{visibility:visible;opacity:1}.stzh-header__flyout-search-main.sc-stzh-header{position:absolute;width:100%;transition-property:opacity, transform;transition-duration:var(--stzh-base-transition-animation-speed);transform:translateY(-6.25rem);opacity:0;margin-top:var(--stzh-header-main-height);overflow:auto}.stzh-header--is-flyout-open.sc-stzh-header .stzh-header__flyout.sc-stzh-header,.stzh-header--is-flyout-search-open.sc-stzh-header .stzh-header__flyout-search.sc-stzh-header{visibility:visible}.stzh-header--is-flyout-open.sc-stzh-header .stzh-header__flyout-backdrop.sc-stzh-header,.stzh-header--is-flyout-search-open.sc-stzh-header .stzh-header__flyout-backdrop.sc-stzh-header{opacity:1}.stzh-header--is-flyout-open.sc-stzh-header .stzh-header__flyout-scrollbar.sc-stzh-header,.stzh-header--is-flyout-search-open.sc-stzh-header .stzh-header__flyout-scrollbar.sc-stzh-header{display:none;z-index:999;position:absolute;top:0;right:0;bottom:0;width:var(--stzh-scrollbar-width);background-color:var(--stzh-color-grey10);border-left:calc(0.5px var(--stzh-scrollbar-active)) solid var(--stzh-color-grey30)}@media (min-height: 580px){.stzh-header--is-flyout-open.sc-stzh-header .stzh-header__flyout-scrollbar.sc-stzh-header,.stzh-header--is-flyout-search-open.sc-stzh-header .stzh-header__flyout-scrollbar.sc-stzh-header{display:block}}@media screen and (min-width: 900px){.stzh-header--is-flyout-open.sc-stzh-header .stzh-header__flyout-scrollbar.sc-stzh-header,.stzh-header--is-flyout-search-open.sc-stzh-header .stzh-header__flyout-scrollbar.sc-stzh-header{display:block}}.stzh-header--is-flyout-open.sc-stzh-header .stzh-header__menu.sc-stzh-header{opacity:1;transform:translateX(0)}.stzh-header--is-flyout-search-open.sc-stzh-header .stzh-header__flyout-search-main.sc-stzh-header{opacity:1;transform:translateX(0)}@media screen and (min-width: 600px){.stzh-header--is-flyout-open.sc-stzh-header .stzh-header__inner.sc-stzh-header,.stzh-header--is-flyout-search-open.sc-stzh-header .stzh-header__inner.sc-stzh-header{z-index:var(--stzh-z-index-header);transform:translateY(0);position:fixed;top:0;left:0;right:var(--stzh-scrollbar-width);margin-top:0}}@media screen and (max-width: 599px){.stzh-header--is-flyout-open.sc-stzh-header .stzh-header__main.sc-stzh-header,.stzh-header--is-flyout-search-open.sc-stzh-header .stzh-header__main.sc-stzh-header{z-index:var(--stzh-z-index-header);transform:translateY(0);position:fixed;top:0;left:0;right:var(--stzh-scrollbar-width);margin-top:0}}.stzh-header--is-flyout-open.sc-stzh-header .stzh-header__logobar.sc-stzh-header,.stzh-header--is-flyout-search-open.sc-stzh-header .stzh-header__logobar.sc-stzh-header{opacity:1}.stzh-header--is-flyout-open.sc-stzh-header .stzh-header__logobar.sc-stzh-header,.stzh-header--is-flyout-search-open.sc-stzh-header .stzh-header__logobar.sc-stzh-header,.stzh-header--is-flyout-open.sc-stzh-header .stzh-header__metabar.sc-stzh-header,.stzh-header--is-flyout-search-open.sc-stzh-header .stzh-header__metabar.sc-stzh-header{visibility:visible}.stzh-header--is-flyout-open.sc-stzh-header .stzh-header__logo-link.sc-stzh-header,.stzh-header--is-flyout-search-open.sc-stzh-header .stzh-header__logo-link.sc-stzh-header{opacity:1;transition:none}.stzh-header__search-button--is-hidden.sc-stzh-header{display:none}";const p="stzh-header-open";const _=class{constructor(h){e(this,h);this.stzhMetanavItemClick=t(this,"stzhMetanavItemClick",7);this.stzhMetanavItemChildClick=t(this,"stzhMetanavItemChildClick",7);this.stzhMetanavItemButtonClick=t(this,"stzhMetanavItemButtonClick",7);this.stzhMenuItemClick=t(this,"stzhMenuItemClick",7);this.stzhLanguageChange=t(this,"stzhLanguageChange",7);this.stzhSearchChange=t(this,"stzhSearchChange",7);this.stzhSearchChanged=t(this,"stzhSearchChanged",7);this.lastOpener=null;this.flyoutOpenedByMetanavItem=null;this.handleMenuListFocusout=e=>{const t=!e.currentTarget.contains(e.relatedTarget);if(this.isMedium&&t){this.closeMenuItem(false)}};this.handleBurgerClick=async()=>{if(this.flyoutOpenedByMetanavItem){this.flyoutOpenedByMetanavItem=false;this.closeMetanavItem()}else{this.flyoutSearchOpen=false;this.flyoutOpen=!this.flyoutOpen}const e=this.element.querySelector(".stzh-header__menu-item");if(e){window.setTimeout((()=>{e.focus()}),100)}this.updatePosition()};this.handleSearchButtonClick=async()=>{this.flyoutOpen=false;this.flyoutSearchOpen=!this.flyoutSearchOpen;const e=this.element.querySelector(".stzh-search input[type='search']");if(e){window.setTimeout((()=>{e.focus()}),100)}this.updatePosition()};this.handleBackdropClick=async()=>{this.flyoutOpen=false;this.updatePosition()};this.handleBackdropSearchClick=async()=>{this.flyoutSearchOpen=false;this.updatePosition()};this.handleMetanavItemClick=(e,t)=>{this.stzhMetanavItemClick.emit({component:"stzh-header",item:t,originalEvent:e})};this.handleMetanavItemChildClick=(e,t)=>{this.stzhMetanavItemChildClick.emit({component:"stzh-header",itemChild:t,originalEvent:e})};this.handleMetanavItemButtonClick=(e,t)=>{this.stzhMetanavItemButtonClick.emit({component:"stzh-header",itemButton:t,originalEvent:e})};this.handleMenuItemClick=(e,t)=>{this.flyoutOpen=false;this.stzhMenuItemClick.emit({component:"stzh-header",item:t,originalEvent:e})};this.handleSearchInput=e=>{this.searchValue=this.searchInput.value;this.stzhSearchChange.emit({component:"stzh-header",originalEvent:e,value:this.searchValue})};this.handleSearchChange=e=>{this.searchValue=this.searchInput.value;this.stzhSearchChanged.emit({component:"stzh-header",originalEvent:e,value:this.searchValue})};this.handleLanguageClick=(e,t)=>{if(this.languagePreventUrlchange){e.preventDefault()}this.languageActive=t.value;this.stzhLanguageChange.emit({component:"stzh-header",value:this.languageActive})};this.handleFlyoutResize=()=>{this.resizeMenunavElement()};this.handleResize=()=>{if(this.sticky==="disabled"){return}if(this.debounceResize){window.cancelAnimationFrame(this.debounceResize)}this.debounceResize=requestAnimationFrame((()=>{s((()=>{var e,t,s;this.isMedium=o("medium").matches;this.mainHeight=((e=this.mainElement)===null\|\|e===void 0?void 0:e.offsetHeight)\|\|0;this.metabarHeight=((t=this.metabarElement)===null\|\|t===void 0?void 0:t.offsetHeight)\|\|0;this.logobarHeight=((s=this.logobarElement)===null\|\|s===void 0?void 0:s.offsetHeight)\|\|0;this.headerTop=this.element.offsetTop;this.headerHeight=this.metabarHeight+this.logobarHeight}));a((()=>{document.documentElement.style.setProperty("--stzh-header-height",`${this.headerHeight}px`);document.documentElement.style.setProperty("--stzh-header-main-height",`${this.mainHeight}px`);document.documentElement.style.setProperty("--stzh-header-metabar-height",`${this.metabarHeight}px`);document.documentElement.style.setProperty("--stzh-header-logobar-height",`${this.logobarHeight}px`)}));this.scrollListener()}))};this.localization=undefined;this.href="https://www.stadt-zuerich.ch";this.menuId="anchorNavMain";this.searchId="anchorSearch";this.metanavId="anchorNavMeta";this.languageId="anchorNavLang";this.logoType="default";this.menuItems=[];this.menuBackLabel=undefined;this.standardMetanavItems=[];this.userSpecificMetanavItemsNotLoggedIn=[];this.appNavItems=[];this.userSpecificMetanavItemsEndpoint=undefined;this.languageActive=undefined;this.languages=[];this.languagePreventUrlchange=false;this.languageStay=false;this.hideMetabar=false;this.searchAction=undefined;this.searchFieldName="q";this.searchValue="";this.sticky="default";this.loginErrorMessage="";this.logoAnalyticsId=undefined;this.hideLogo=false;this.headerHeight=undefined;this.paddingTop=undefined;this.stickyActive=false;this.flyoutOpen=false;this.flyoutSearchOpen=false;this.searchFilled=undefined;this.fixed=false;this.fixedTransition=false;this.currentOpenMenuItem=null;this.currentOpenMetanavItem=null;this.currentOpenLanguage=false;this.userSpecificMetanavItemsLoggedIn=[];this.combinedMetanavItems=[]}handleKeydown(e){if(e.key==="Escape"){this.flyoutOpen=false;this.flyoutSearchOpen=false}}flyoutCloseClicked(){this.flyoutSearchOpen=false;this.updatePosition()}async flyoutOpenWatcher(e){if(!e){this.currentOpenMenuItem=null;this.currentOpenMetanavItem=null;this.currentOpenLanguage=null;this.flyoutOpenedByMetanavItem=false;document.body.classList.remove(p);this.enableSiblings();if(this.trap){this.trap.deactivate()}}else{document.body.classList.add(p);this.disableSiblings();if(this.trap){this.trap.activate()}}}async fixedWatcher(){this.paddingTop=this.fixed\|\|this.flyoutOpen\|\|this.flyoutSearchOpen?this.headerHeight:0;await this.waitForNextRender();this.fixedTransition=this.fixed\|\|this.flyoutOpen\|\|this.flyoutSearchOpen}stickyWatcher(){this.updatePosition()}async updatePosition(){if(this.flyoutOpen\|\|this.flyoutSearchOpen){return}const e=()=>{this.stickyActive=true;document.documentElement.style.setProperty("--stzh-header-is-stuck","1");document.documentElement.style.setProperty("--stzh-header-is-not-stuck","0")};const t=()=>{document.documentElement.style.setProperty("--stzh-header-is-stuck","0");document.documentElement.style.setProperty("--stzh-header-is-not-stuck","1");this.stickyActive=false};if(this.sticky==="disabled"){t()}else if(this.sticky==="always-full"){e()}else if(this.sticky==="always"){if(this.belowStayStickyPoint){e()}else{t()}}else{if(this.scrollingUp&&this.belowStayStickyPoint){if(!this.stickyActive&&this.belowStartStickyPoint){e()}}else{if(this.stickyActive&&this.belowStayStickyPoint){t()}else{t()}}}}scrollListener(){if(this.sticky==="disabled"){return}s((()=>{this.currentScrollY=window.scrollY;this.scrollingUp=this.lastScrollY&&this.lastScrollY>this.currentScrollY;this.lastScrollY=this.currentScrollY;this.belowStayStickyPoint=this.currentScrollY>this.logobarHeight;this.belowStartStickyPoint=this.currentScrollY>this.headerHeight;this.fixed=this.belowStartStickyPoint\|\|this.scrollingUp&&this.belowStayStickyPoint&&this.stickyActive\|\|this.sticky==="always"&&this.belowStayStickyPoint\|\|this.sticky==="always-full";this.headerOverlap=(this.headerTop-this.currentScrollY)/-1;this.hideLogo=this.sticky!=="always-full"&&this.isMedium&&this.headerOverlap>1}));a((()=>{this.updatePosition()}))}searchValueWatcher(e){this.searchFilled=e!==""}menuItemsWatcher(e){if(typeof e==="string"){this._menuItems=JSON.parse(e)}else{this._menuItems=e}this._menuItems=this._menuItems.map(((e,t)=>Object.assign({id:`submenu-${t}`},e)))}standardMetanavItemsWatcher(e){if(typeof e==="string"){this._standardMetanavItems=JSON.parse(e)}else{this._standardMetanavItems=e}this._standardMetanavItems=this._standardMetanavItems.map(((e,t)=>Object.assign({id:`metanav-submenu-${t}`},e)))}userSpecificMetanavItemsNotLoggedInWatcher(e){this._userSpecificMetanavItemsNotLoggedIn=e}languagesWatcher(e){if(typeof e==="string"){this._languages=JSON.parse(e)}else{this._languages=e}}getSiblings(){if(!this._parentElement){return[]}return Array.from(this._parentElement.children).filter((e=>e!==this.element))}disableSiblings(){this.getSiblings().forEach((e=>{e.setAttribute("aria-hidden","true")}))}enableSiblings(){this.getSiblings().forEach((e=>{e.removeAttribute("aria-hidden")}))}waitForNextRender(){return new Promise((e=>this.renderPromiseResolve=e))}resizeMenunavElement(){if(o("headerMetanavSticky").matches\|\|o("medium").matches\|\|!this.openSubmenuElement){Object.assign(this.menunavElement.style,{height:null})}else{const{height:e}=this.openSubmenuElement.getBoundingClientRect();Object.assign(this.menunavElement.style,{height:`${e}px`})}}async openMenuItem(e,t){this.flyoutOpen=true;this.lastOpener=e.currentTarget;this.openSubmenuElement=this.element.querySelector(`#${t.id}`);this.currentOpenMenuItem=t;await this.waitForNextRender();requestAnimationFrame((()=>{this.menunavElement.scrollTop=0;const e=this.openSubmenuElement&&l(this.openSubmenuElement)[0];e===null\|\|e===void 0?void 0:e.focus();this.resizeMenunavElement()}))}async closeMenuItem(e=true){this.openSubmenuElement=null;this.currentOpenMenuItem=null;await this.waitForNextRender();if(e){requestAnimationFrame((()=>{this.lastOpener.focus();this.lastOpener=null;this.resizeMenunavElement()}))}}async openMetanavItem(e,t){if(!this.flyoutOpen){this.flyoutOpenedByMetanavItem=true;this.flyoutOpen=true}this.lastOpener=e.currentTarget;this.currentOpenMetanavItem=t;await this.waitForNextRender();requestAnimationFrame((()=>{const e=this.element.querySelector(`#${t.id}`);const s=e&&l(e)[0];s===null\|\|s===void 0?void 0:s.focus()}))}async closeMetanavItem(){this.currentOpenMetanavItem=null;if(this.flyoutOpenedByMetanavItem){this.flyoutOpen=false}await this.waitForNextRender();requestAnimationFrame((()=>{this.lastOpener.focus();this.lastOpener=null}))}async openLanguage(e){if(!this.flyoutOpen){this.flyoutOpenedByMetanavItem=true;this.flyoutOpen=true}this.lastOpener=e.currentTarget;this.currentOpenLanguage=true;await this.waitForNextRender();requestAnimationFrame((()=>{const e=this.element.querySelector("#submenu-languages");const t=e&&l(e)[0];t===null\|\|t===void 0?void 0:t.focus()}))}async closeLanguage(){this.currentOpenLanguage=false;if(this.flyoutOpenedByMetanavItem){this.flyoutOpen=false}await this.waitForNextRender();requestAnimationFrame((()=>{this.lastOpener.focus();this.lastOpener=null}))}async requestUserSpecificMetanavItems(){if(!this.userSpecificMetanavItemsEndpoint){this.combinedMetanavItems=[...this._standardMetanavItems,...this._userSpecificMetanavItemsNotLoggedIn];return}try{const e=await fetch(this.userSpecificMetanavItemsEndpoint);this.userSpecificMetanavItemsLoggedIn=await e.json();this.combinedMetanavItems=[...this._standardMetanavItems,...this.userSpecificMetanavItemsLoggedIn]}catch(e){this.combinedMetanavItems=[...this._standardMetanavItems,...this._userSpecificMetanavItemsNotLoggedIn];console.error("Error fetching data:",e);if(this.loginErrorMessage){document.querySelector("stzh-toastbar").toast(this.loginErrorMessage,{type:"error"})}}}async componentWillLoad(){this.menuItemsWatcher(this.menuItems);this.standardMetanavItemsWatcher(this.standardMetanavItems);this.languagesWatcher(this.languages);this.searchValueWatcher(this.searchValue);this.userSpecificMetanavItemsNotLoggedInWatcher(this.userSpecificMetanavItemsNotLoggedIn);this.requestUserSpecificMetanavItems();if(!this.localization){this.localization=await window.stzhComponents.utils.fetchTranslations(this.element,"header")}}componentDidRender(){if(this.renderPromiseResolve){this.renderPromiseResolve()}if(this.flyoutElement&&this.flyoutResizeObserver){this.flyoutResizeObserver.observe(this.flyoutElement)}if(this.flyoutSearchElement&&this.flyoutResizeObserver){this.flyoutResizeObserver.observe(this.flyoutSearchElement)}}componentDidLoad(){this.trap=c(this.element,Object.assign(Object.assign({},m()),{initialFocus:false}));this.flyoutResizeObserver=new ResizeObserver(this.handleFlyoutResize);if(this.flyoutElement){this.flyoutResizeObserver.observe(this.flyoutElement)}}connectedCallback(){this._parentElement=this.element.parentElement;this.resizeObserver=new ResizeObserver(this.handleResize);this.resizeObserver.observe(this.element)}disconnectedCallback(){var e,t;this.flyoutOpenWatcher(false);(e=this.resizeObserver)===null\|\|e===void 0?void 0:e.disconnect();(t=this.flyoutResizeObserver)===null\|\|t===void 0?void 0:t.disconnect()}render(){var e,t,s,a,n,o;const l=d(this.element,"metanav-before");const c=d(this.element,"metanav-after");const m={"stzh-header":true,"stzh-header--is-flyout-open":this.flyoutOpen,"stzh-header--is-flyout-search-open":this.flyoutSearchOpen,"stzh-header--is-search-filled":this.searchFilled,"stzh-header--is-fixed":this.fixed,"stzh-header--is-fixed-transition":this.fixedTransition,"stzh-header--is-sticky":this.stickyActive,"stzh-header--is-sticky-transition":this.stickyActive&&this.fixedTransition,"stzh-header--hide-logo":this.hideLogo,"stzh-header--has-empty-metabar-mobile":!l&&!c&&this._standardMetanavItems.filter((e=>e.stay\|\|e.stayAndShowInMobileMenu)).length===0&&this._menuItems.length===0&&(this._languages.length===0\|\|this._languages.length>0&&!this.languageStay)&&!this.searchAction,"stzh-header--has-empty-metabar":!l&&!c&&this._standardMetanavItems.length===0&&this._menuItems.length===0&&this._languages.length===0&&!this.searchAction,[`stzh-header--sticky-${this.sticky}`]:!!this.sticky};const z=this.languageActive\|\|window.stzhComponents.utils.getLocale(this.element);const p=((e=this._languages)===null\|\|e===void 0?void 0:e.find((({value:e})=>e===z)))\|\|((t=this._languages)===null\|\|t===void 0?void 0:t[0])\|\|null;const _=(e,t,s)=>{var a;const i=((a=e.items)===null\|\|a===void 0?void 0:a.length)>0\|\|e.itemButton\|\|!e.href?"button":"a";return h(i,Object.assign({},s,{href:i==="a"&&e.href,target:i==="a"&&e.target,style:{order:e.cssOrder},class:Object.assign({"stzh-header__metanav-item":true,"is-heavy":e.important,"is-stay":e.stay\|\|e.stayAndShowInMobileMenu},t\|\|{})}),h("span",{class:{"stzh-header__metanav-item-text":true,"is-vhidden":e.labelHidden,"has-no-short-label":!e.labelShort}},h("span",{class:"stzh-header__metanav-item-text-label-long"},e.label),h("span",{class:"stzh-header__metanav-item-text-label-short","aria-hidden":"true"},e.labelShort)),e.icon&&h("span",{class:"stzh-header__metanav-icon-wrapper"},e.icon&&h("stzh-icon",{class:`stzh-header__metanav-icon ${e.iconOpen?"is-close":""}`,name:e.icon}),e.iconOpen&&h("stzh-icon",{class:"stzh-header__metanav-icon is-open",name:e.iconOpen}),(e.badge\|\|e.badgeEmpty)&&h("stzh-badge",{class:"stzh-header__metanav-icon-badge",label:e.badge,type:typeof e.badgeType==="undefined"?"error":e.badgeType})))};return h(r,null,h("header",{class:m},h("div",{class:"stzh-header__header",style:{paddingTop:`${this.paddingTop}px`}},this.appNavItems.length>0&&h("div",{class:"stzh-header__app-nav-bottom"},h("stzh-app-nav",{items:this.appNavItems})),h("div",{class:"stzh-header__inner"},h("div",{class:"stzh-header__main",ref:e=>this.mainElement=e},h("div",{class:"stzh-header__logobar",ref:e=>this.logobarElement=e},h("div",{class:"stzh-header__logobar-logo"},h("a",{href:this.href,class:"stzh-header__logo-link","s-object-id":this.logoAnalyticsId\|\|"Header Logo"},h("slot",{name:"logo"}))),h("div",{class:"stzh-header__logobar-decoration"})),!this.hideMetabar&&h("div",{class:"stzh-header__metabar",ref:e=>this.metabarElement=e},h("div",{class:"stzh-header__metabar-inner"},h("slot",{name:"menu-before"}),this._menuItems.length>0&&h("button",{id:this.menuId,class:`stzh-header__burger ${this.flyoutOpen&&!this.flyoutOpenedByMetanavItem&&"is-open"}`,onClick:this.handleBurgerClick},h("stzh-icon",{class:"stzh-header__burger-icon is-close",name:"menu"}),h("stzh-icon",{class:"stzh-header__burger-icon is-open",name:"close"}),h("div",{class:"stzh-header__burger-text"},this.localization.menuLabel)),this.searchAction&&!d(this.element,"search")&&h("form",{class:"stzh-header__metabar-search",action:this.searchAction,role:"search"},h("label",{class:"stzh-header__search"},h("input",{id:this.searchId,ref:e=>this.searchInput=e,class:"stzh-header__search-input",type:"search",name:this.searchFieldName,onChange:this.handleSearchChange,onInput:this.handleSearchInput}),h("stzh-icon",{class:"stzh-header__search-icon",name:"search"}),h("div",{class:"stzh-header__search-text"},this.localization.searchLabel))),d(this.element,"search")&&h("stzh-button",{iconPosition:"left",onClick:this.handleSearchButtonClick,variant:"tertiary-plain",size:"small"},h("stzh-icon",{slot:"icon",name:"search",class:this.flyoutSearchOpen?"stzh-header__search-button--is-hidden":""}),h("stzh-icon",{slot:"icon",name:"close",class:this.flyoutSearchOpen?"":"stzh-header__search-button--is-hidden"}),this.localization.searchLabel),h("slot",{name:"menu-after"}),this.appNavItems.length>0&&h("div",{class:"stzh-header__app-nav"},h("stzh-app-nav",{items:this.appNavItems})),h("div",{class:"stzh-header__metabar-nav",id:this.metanavId},h("slot",{name:"metanav-before"}),this.combinedMetanavItems.map((e=>{var t,s;return((t=e.items)===null\|\|t===void 0?void 0:t.length)>0\|\|e.itemButton?h(i,null,_(e,{"is-popover-mobile":true},{"aria-expanded":e===this.currentOpenMetanavItem?"true":"false","aria-controls":e.id,onClick:t=>{if(e===this.currentOpenMetanavItem){this.closeMetanavItem()}else{this.openMetanavItem(t,e)}this.handleMetanavItemClick(t,e)}}),h("stzh-popover",{class:{"stzh-header__metanav-popover":true},placement:"bottom-end",distance:20,variant:e.variant,size:typeof e.size==="undefined"?"large":e.size},_(e,{"is-popover-desktop":true},{onClick:t=>{this.handleMetanavItemClick(t,e)}}),h("div",{slot:"content"},((s=e.items)===null\|\|s===void 0?void 0:s.length)>0&&h("stzh-menu",null,e.items.map((t=>h("stzh-menu-item",{class:{"stzh-header__metanav-menu-item":true,"is-heavy":typeof e.importantSubmenu==="undefined"\|\|e.importantSubmenu},size:typeof e.size==="undefined"?"large":e.size,variant:e.variant,href:t.href,target:t.target,icon:t.icon,counter:t.counter,badge:t.badge,badgeType:t.badgeType,onClick:e=>{this.handleMetanavItemChildClick(e,t)}},t.label))))),e.itemButton&&h("stzh-button",{slot:"action",size:e.itemButton.size,href:e.itemButton.href,target:e.itemButton.target,onClick:t=>{this.handleMetanavItemButtonClick(t,e.itemButton)}},e.itemButton.label))):_(e,{},{onClick:t=>{this.handleMetanavItemClick(t,e)}})})),((s=this._languages)===null\|\|s===void 0?void 0:s.length)>0&&h(i,null,h("h2",{id:this.languageId,class:"stzh-header__vhidden"},this.localization.languageLabel),this._menuItems.length>0&&this.languageStay&&h("button",{class:{"stzh-header__metanav-item":true,"is-popover-mobile":true,"is-stay":this.languageStay},"aria-expanded":this.currentOpenLanguage?"true":"false","aria-controls":"submenu-languages",onClick:e=>{if(this.currentOpenLanguage){this.closeLanguage()}else{this.openLanguage(e)}}},h("span",{class:"stzh-header__metanav-item-text"},p===null\|\|p===void 0?void 0:p.text),h("stzh-icon",{class:"stzh-header__metanav-icon is-close",name:"angle-down"}),h("stzh-icon",{class:"stzh-header__metanav-icon is-open",name:"angle-up"})),h("stzh-popover",{class:"stzh-header__metanav-popover is-langnav",placement:"bottom-end",distance:20},h("button",{class:{"stzh-header__metanav-item":true,"is-popover-desktop":this._menuItems.length>0,"is-stay":this.languageStay}},h("span",{class:"stzh-header__metanav-item-text"},p===null\|\|p===void 0?void 0:p.text),h("stzh-icon",{class:"stzh-header__metanav-icon is-close",name:"angle-down"}),h("stzh-icon",{class:"stzh-header__metanav-icon is-open",name:"angle-up"})),h("div",{slot:"content"},h("stzh-menu",null,this._languages.map((e=>h("stzh-menu-item",{class:"stzh-header__metanav-menu-item",active:(p===null\|\|p===void 0?void 0:p.value)===e.value,href:e.value,onClick:t=>this.handleLanguageClick(t,e)},e.text))))))),h("slot",{name:"metanav-after"}))))))),this._menuItems.length>0&&h("div",{ref:e=>this.flyoutElement=e,class:"stzh-header__flyout"},h("div",{class:"stzh-header__flyout-backdrop",onClick:this.handleBackdropClick}),h("div",{class:"stzh-header__flyout-scrollbar"}),h("div",{class:"stzh-header__menu"},h("nav",{class:"stzh-header__menu-nav",ref:e=>this.menunavElement=e,"aria-label":this.localization.navigationLabel},h("ul",{class:"stzh-header__menu-list is-level-1"},this._menuItems.map((e=>{var t,s;return h("li",{class:{"stzh-header__menu-list-item":true,"is-open":e===this.currentOpenMenuItem}},((t=e.items)===null\|\|t===void 0?void 0:t.length)>0?h("button",{"aria-expanded":e===this.currentOpenMenuItem?"true":"false","aria-controls":e.id,class:"stzh-header__menu-item is-level-1 has-items",onClick:e===this.currentOpenMenuItem?()=>this.closeMenuItem():t=>this.openMenuItem(t,e)},e.label):h("a",{href:e.href,onClick:t=>this.handleMenuItemClick(t,e),class:"stzh-header__menu-item is-level-1"},e.label),((s=e.items)===null\|\|s===void 0?void 0:s.length)>0&&h("ul",{id:e.id,class:"stzh-header__menu-list is-level-2",onFocusout:this.handleMenuListFocusout},h("li",{class:"stzh-header__menu-list-item is-backlink"},h("button",{class:"stzh-header__menu-item is-level-2 is-backlink",onClick:()=>this.closeMenuItem()},h("stzh-icon",{name:"angle-left"}),h("span",null,this.menuBackLabel?this.menuBackLabel:this.localization.menuBackLabel))),h("li",{class:"stzh-header__menu-list-item"},h("a",{href:e.href,onClick:t=>this.handleMenuItemClick(t,e),class:"stzh-header__menu-item is-level-2 is-main"},e.label)),e.items.map((e=>h("li",{class:"stzh-header__menu-list-item"},h("a",{href:e.href,onClick:t=>this.handleMenuItemClick(t,e),class:"stzh-header__menu-item is-level-2"},e.label))))))})))),(((a=this.combinedMetanavItems)===null\|\|a===void 0?void 0:a.length)>0\|\|((n=this._languages)===null\|\|n===void 0?void 0:n.length)>0)&&h("div",{class:"stzh-header__menu-metanav"},h("nav",{class:"stzh-header__menu-metanav-nav"},h("ul",{class:"stzh-header__menu-metanav-list is-level-1"},this.combinedMetanavItems.map((e=>{var t,s,a;return h("li",{class:{"stzh-header__menu-metanav-list-item":true,"is-open":e===this.currentOpenMetanavItem}},((t=e.items)===null\|\|t===void 0?void 0:t.length)>0?h("button",{"aria-expanded":e===this.currentOpenMetanavItem?"true":"false","aria-controls":e.id,class:{"stzh-header__menu-metanav-item is-level-1":true,"is-hidden":e.stay&&!e.stayAndShowInMobileMenu},onClick:t=>{if(e===this.currentOpenMetanavItem){this.closeMetanavItem()}else{this.openMetanavItem(t,e)}this.handleMetanavItemClick(t,e)}},h("span",{class:{"stzh-header__menu-metanav-item-text":true,"is-vhidden":e.labelHidden}},e.label),e.icon&&h("stzh-icon",{class:"stzh-header__menu-metanav-item-icon",name:e.icon})):h("a",{href:e.href,class:{"stzh-header__menu-metanav-item is-level-1":true,"is-hidden":e.stay&&!e.stayAndShowInMobileMenu},onClick:t=>{this.handleMetanavItemClick(t,e)}},h("span",{class:{"stzh-header__menu-metanav-item-text":true,"is-vhidden":e.labelHidden}},e.label),e.icon&&h("stzh-icon",{class:"stzh-header__menu-metanav-item-icon",name:e.icon})),((s=e.items)===null\|\|s===void 0?void 0:s.length)>0&&h("ul",{id:e.id,class:"stzh-header__menu-metanav-list is-level-2"},h("li",{class:"stzh-header__menu-metanav-list-item"},h("div",{class:"stzh-header__menu-metanav-item is-level-2 is-title"},h("span",null,e.label),h("stzh-button",{class:"stzh-header__menu-metanav-item-icon",variant:"tertiary",icon:"close",iconOnly:true,label:(a=this.localization.closeMetanavMenuLabel)===null\|\|a===void 0?void 0:a.replace(/\{itemLabel\}/gi,e.label),onClick:()=>this.closeMetanavItem()}))),e.items.map((e=>h("li",{class:"stzh-header__menu-metanav-list-item"},h("a",{href:e.href,class:"stzh-header__menu-metanav-item is-level-2"},e.icon&&h("stzh-icon",{class:"stzh-header__menu-metanav-item-icon",name:e.icon}),h("span",{class:"stzh-header__menu-metanav-item-text"},h("span",null,e.label),e.counter&&h("span",{class:"stzh-header__menu-metanav-item-counter"},"(",e.counter,")")))))),e.itemButton&&h("li",{class:"stzh-header__menu-metanav-list-item"},h("div",{class:"stzh-header__menu-metanav-item is-level-2 is-action"},h("stzh-button",{href:e.itemButton.href,target:e.itemButton.target},e.itemButton.label)))))})),((o=this._languages)===null\|\|o===void 0?void 0:o.length)>0&&h("li",{class:{"stzh-header__menu-metanav-list-item":true,"is-open":this.currentOpenLanguage}},h("button",{"aria-expanded":this.currentOpenLanguage?"true":"false","aria-controls":"submenu-languages",class:"stzh-header__menu-metanav-item is-level-1",onClick:e=>this.openLanguage(e)},h("span",null,p===null\|\|p===void 0?void 0:p.text),h("stzh-icon",{class:"stzh-header__menu-metanav-item-icon",name:"angle-down"})),h("ul",{id:"submenu-languages",class:"stzh-header__menu-metanav-list is-level-2"},h("div",{class:"stzh-header__menu-metanav-item is-level-2 is-title"},h("span",null,this.localization.dialogLanguageTitle),h("stzh-button",{class:"stzh-header__menu-metanav-item-icon",variant:"tertiary",icon:"close",iconOnly:true,label:"Sprach-Dialog schliessen",onClick:()=>this.closeLanguage()})),this._languages.map((e=>h("li",{class:"stzh-header__menu-metanav-list-item"},h("a",{class:"stzh-header__menu-metanav-item is-level-2 is-language",href:e.value,onClick:t=>this.handleLanguageClick(t,e)},h("span",null,e.text),(p===null\|\|p===void 0?void 0:p.value)===e.value&&h("stzh-icon",{class:"stzh-header__menu-metanav-item-icon",name:"checkmark"})))))))))))),d(this.element,"search")&&h("div",{ref:e=>this.flyoutSearchElement=e,class:"stzh-header__flyout-search"},h("div",{class:"stzh-header__flyout-backdrop",onClick:this.handleBackdropSearchClick}),h("div",{class:"stzh-header__flyout-scrollbar"}),h("div",{class:"stzh-header__flyout-search-main"},h("slot",{name:"search"})))))}get element(){return n(this)}static get watchers(){return{flyoutOpen:["flyoutOpenWatcher","fixedWatcher"],flyoutSearchOpen:["flyoutOpenWatcher","fixedWatcher"],fixed:["fixedWatcher"],headerHeight:["fixedWatcher"],sticky:["stickyWatcher"],searchValue:["searchValueWatcher"],menuItems:["menuItemsWatcher"],standardMetanavItems:["standardMetanavItemsWatcher"],userSpecificMetanavItemsNotLoggedIn:["userSpecificMetanavItemsNotLoggedInWatcher"],languages:["languagesWatcher"]}}};_.style=z;export{_ as stzh_header};
2	+ //# sourceMappingURL=p-4f7f4362.entry.js.map