@oiz/stzh-components 4.5.0 → 4.6.0-beta2

package/dist/stzh-components/p-0f546f1c.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as s,h as i,F as e,a as r,g as o}from"./p-ef5985a3.js";import{a}from"./p-9cc086e2.js";import{h}from"./p-87c329f2.js";import{S as d}from"./p-9531514f.js";import{c as n}from"./p-dae15605.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,[stzh-hidden].sc-stzh-datepicker-h{display:none}.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%;position:relative}[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=c;const z=class{constructor(i){t(this,i);this.stzhChange=s(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 s=this._internalDateAdapter.format(t,"dateInput");if(this.value!==s){this.value=s}else{this.valueWatcher(s)}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 s=this._internalDateAdapter.parse(t,"dateInput");this.calendarValue=a(s);this.inputValue=this.dateAdapter.format(s,"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 s={"stzh-datepicker":true,"stzh-datepicker--inline":this.inline,"stzh-datepicker--has-action":t};return i(r,{key:"4ff21a8fcd972b2619acae49ee0f22d3d0de2147",tabindex:this.disabled?null:"-1",onFocus:this.onRootFocus},i("div",{key:"8bc68db9617210bdaf0130c979e5db77bd271366",class:s},i("input",{key:"3a580a6831d811e4bc3c9739aec1748b8a3bcf90",type:"hidden",name:this.name,value:this.value,defaultValue:this.defaultValue}),this.inline&&i(e,{key:"a3f0746ac7bfd4a627f1fafd42c524df03681600"},i("stzh-calendar",{key:"7514b26698908cfa19e0d965f0d838b471eef594",value:this.calendarValue,class:"stzh-datepicker__calendar is-inline",isDateDisabled:this.calendarIsDateDisabled,min:this.calendarMin,max:this.calendarMax,onStzhChange:this.onCalendarChange}),i("div",{key:"e893e6f4b8cdf52a16011dffe2a228baaf6eaa4b",class:"stzh-datepicker__actions"},i("slot",{key:"190ffdaab1a41fbd6b31e63ed4b91b9cbf648fe4",name:"action"}))),!this.inline&&i("stzh-input",{key:"5b06696ac06ec03e8db3e771957b6309a9b77a4a",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},i("stzh-popover",{key:"033bb37fd62713376ad0ee54381b4f2d0cabe9be",ref:t=>this.popover=t,class:"stzh-datepicker__popover",slot:"button-right",placement:"bottom-end",strategy:"fixed",label:this.label},i("stzh-button",{key:"e1f192ae423808b8ae971f96f091d447a47beb10","icon-only":true,icon:"calendar",size:this.size,disabled:this.disabled,a11yLabel:this.buttonLabel}),i("div",{key:"a8ab8497e4bc47f2295bc77945748e3669dec0c6",slot:"content"},i("stzh-calendar",{key:"434c79f929e60d7007454550cb1d5cbff71fe743",value:this.calendarValue,class:"stzh-datepicker__calendar is-popover",isDateDisabled:this.calendarIsDateDisabled,min:this.calendarMin,max:this.calendarMax,onStzhChange:this.onCalendarChange}),i("div",{key:"e11f352cb4f42017425498de2454a4e259eb0d9f",class:"stzh-datepicker__actions"},i("slot",{key:"09e89c4faa8f7f7916fe1b4ee60e086a45cf787a",name:"action"})))))))}get element(){return o(this)}static get watchers(){return{localization:["createDateFormatters"],value:["valueWatcher"],dateAdapter:["dateAdapterWatcher"],internalDateAdapter:["internalDateAdapterWatcher"]}}};z.style=l;const p='.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,[stzh-hidden].sc-stzh-radio-h{display:none}.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{--label-color:var(--stzh-radio-label-color, var(--stzh-base-color));--label-hover-color:var(--stzh-radio-label-hover-color, var(--stzh-color-primary70));--label-hover-checked-color:var(\n    --stzh-radio-label-hover-checked-color,\n    var(--stzh-color-primary90)\n  );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);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;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;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;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(--label-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(--label-hover-color)}.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(--label-hover-checked-color)}.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(--label-hover-color)}.stzh-radio__input.sc-stzh-radio:checked:hover~.stzh-radio__mark.sc-stzh-radio{border-color:var(--label-hover-checked-color)}.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)}';const f=p;let u=0;const g=class{constructor(i){t(this,i);this.stzhChange=s(this,"stzhChange",7);this.stzhFocus=s(this,"stzhFocus",7);this.stzhBlur=s(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 s=new FocusEvent("focus",{view:window,bubbles:false,cancelable:false});this.element.dispatchEvent(s);this.stzhFocus.emit({component:"stzh-radio",originalEvent:t})};this.onBlur=t=>{const s=new FocusEvent("blur",{view:window,bubbles:false,cancelable:false});this.element.dispatchEvent(s);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(s){if(t){this._error=[t]}else{this._error=[]}}}else if(t){this._error=t}else{this._error=[]}}async componentWillLoad(){this.inputId=`stzh-radio-${u++}`;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;const s=h(this.element,"description")||!!this.description;const e=h(this.element,"description-long")||!!this.descriptionLong;const o=h(this.element,"error")||((t=this._error)===null||t===void 0?void 0:t.length)>0;const a={"stzh-radio":true,"stzh-radio--has-description":s,"stzh-radio--has-description-long":e,"stzh-radio--has-error":o,"stzh-radio--is-required":this.required,"stzh-radio--is-invalid":this.invalid||o,"stzh-radio--is-disabled":this.disabled};return i(r,{key:"dbf8b21aff62ac6f5be491da9f776bd582c5d28c","is-invalid":this.invalid||o,tabindex:this.disabled?null:"-1",onFocus:this.onRootFocus},i("div",{key:"eb23bd8a14864cbe0bc5cf612f2c08b68342eb59",class:a},i("label",{key:"e1c6512dd48fd52895d0e8e7e86dcace891a1910",class:"stzh-radio__field-wrapper"},i("input",{key:"50d32323f0e8d5cc13b707d4f7b8f15ef11f8e83",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}),i("div",{key:"1bf92e53b6c0ef409f22a1db1ece84cf6bc545a4",class:"stzh-radio__mark"},i("div",{key:"a62785dd316355109f7ea356fa615ec31b27d507",class:"stzh-radio__check"})),i("div",{key:"3072bc6b20dc92e59aa23f96774aad632050ae2f",class:"stzh-radio__label"},this.label?this.label:i("slot",null),!this.hideOptional&&i("span",{key:"c0d39971566a8339b55596d09f83ae2dfe43041f",class:"stzh-radio__marker"},i("span",{key:"02d0d416d960f924c96635fdd7bfadd3a4a3191a",class:"stzh-radio__marker-symbol","aria-hidden":"true"},this.required?this.localization.$globals.requiredFieldMarker:this.localization.$globals.optionalFieldMarker),i("span",{key:"87ab5acf3285e08d28bcc5e31efd788a4895d317",class:"stzh-radio__marker-text"},this.required?this.localization.$globals.requiredFieldText:this.localization.$globals.optionalFieldText)))),(o||this.description)&&i(d,{key:"b791dde46aca700c13b08a4b79739e67f2edab42",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 o(this)}static get watchers(){return{error:["errorWatcher"]}}};g.style=f;const b=".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,[stzh-hidden].sc-stzh-radiogroup-h{display:none}.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}.sc-stzh-radiogroup-h{--legend-color:var(--stzh-radio-group-legend-color, var(--stzh-heading-color))}[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);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;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(--legend-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);clip-path:inset(100%);width:0.0625rem;height:0.0625rem;overflow:hidden;padding:0;position:absolute}.stzh-radiogroup--is-invalid.sc-stzh-radiogroup .stzh-radiogroup__legend.sc-stzh-radiogroup,.stzh-radiogroup--has-error.sc-stzh-radiogroup .stzh-radiogroup__legend.sc-stzh-radiogroup{color:var(--stzh-color-error60)}.stzh-radiogroup--is-disabled.sc-stzh-radiogroup .stzh-radiogroup__legend.sc-stzh-radiogroup{color:var(--stzh-color-grey60)}.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);column-gap:var(--stzh-space-xxlarge)}";const m=b;const _="stzh-radio, stzh-button[type=radio], stzh-card";let v=0;const k=class{constructor(s){t(this,s);this._preventUpdateProperties=[];this.handleReset=async()=>{this.value=this.defaultValue};this.init=()=>{this.radios=Array.from(this.element.querySelectorAll(_));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(s){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,s){this.radios.forEach((i=>{if(t==="disabled"){if(!i.disabled){i.disabled=s}}else if(t==="name"||this._preventUpdateProperties.indexOf(t)===-1){i[n(t)]=s}}))}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((s=>s.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-${v++}`;this.errorWatcher(this.error);this.preventUpdatePropertiesWatcher(this.preventUpdateProperties);if(!this.localization){this.localization=await window.stzhComponents.utils.fetchTranslations(this.element,"radiogroup")}}componentShouldUpdate(t,s,i){return i!=="checkedRadio"}componentDidRender(){this.init()}connectedCallback(){if(!this.value){this.radios=Array.from(this.element.querySelectorAll(_));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(){const t=h(this.element,"description")||!!this.description;const s=h(this.element,"description-long")||!!this.descriptionLong;const e={"stzh-radiogroup":true,"stzh-radiogroup--has-description":t,"stzh-radiogroup--has-description-long":s,"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 i(r,{key:"3740b25eec16d9fad4da5980f3af77f404758ed5","is-invalid":this.invalid||this.errorUsed},i("fieldset",{key:"378419593f1c8ec674ab05ae5c21d2ac479df47e",class:e},this.legend&&i("legend",{key:"9001d54aa5c245ea896e31571022fd3a2cfe689c",class:"stzh-radiogroup__legend"},this.legend,!this.hideOptional&&i("span",{key:"43daa7ee9ed341ec99d2296693093fa58bf0974a",class:"stzh-radiogroup__marker"},i("span",{key:"368c20f2f5549f3c8fe9cdea1651756fd101d44f",class:"stzh-radiogroup__marker-symbol","aria-hidden":"true"},this.required?this.localization.$globals.requiredFieldMarker:this.localization.$globals.optionalFieldMarker),i("span",{key:"9e2af580b4cf76df2cb23085e9c00d3f4d5b5490",class:"stzh-radiogroup__marker-text"},this.required?this.localization.$globals.requiredFieldText:this.localization.$globals.optionalFieldText))),i("div",{key:"cd50cb2242004743ffe6806c21a863ac18189ed5",class:"stzh-radiogroup__fields"},i("slot",{key:"983b6975197132434ce41131edb29a531e71017b"})),(this.errorUsed||this.description)&&i(d,{key:"1ef57d5d0cf9fcaf96dc368b7f48c4f39acb8c21",classPrefix:"stzh-radiogroup",id:`${this.radiogroupId}-description`,error:this._error,description:this.description,descriptionLong:this.descriptionLong,descriptionLongTitle:this.descriptionLongTitle,descriptionLongUsed:s,moreInfoButtonLabel:this.localization.$globals.moreInfoButtonLabel})))}get element(){return o(this)}static get watchers(){return{name:["watchName"],disabled:["watchDisabled"],required:["watchRequired"],value:["watchValue"],error:["errorWatcher"],preventUpdateProperties:["preventUpdatePropertiesWatcher"]}}};k.style=m;export{z as stzh_datepicker,g as stzh_radio,k as stzh_radiogroup};
+//# sourceMappingURL=p-0f546f1c.entry.js.map

package/dist/stzh-components/p-0f546f1c.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["stzhDatepickerCss","StzhDatepickerStyle0","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","key","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","strategy","icon","a11yLabel","stzhRadioCss","StzhRadioStyle0","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","StzhInputDescription","classPrefix","descriptionLongTitle","moreInfoButtonLabel","stzhRadiogroupCss","StzhRadiogroupStyle0","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  position: relative;\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 { StzhCalendarChangeEvent, StzhDatepickerChangeEvent } from \"../../index\";\n\nimport { StzhCalendarDateDisabledPredicate } from \"../../index\";\n\nimport { printISODate } from \"../../utils/date-utils\";\nimport { StzhLocaleAdapter } from \"../../index\";\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 && 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 type=\"hidden\" name={this.name} value={this.value} defaultValue={this.defaultValue} />\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                strategy=\"fixed\"\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                  ></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  --label-color: var(--stzh-radio-label-color, #{$baseColor});\n  --label-hover-color: var(--stzh-radio-label-hover-color, #{$colorPrimary70});\n  --label-hover-checked-color: var(\n    --stzh-radio-label-hover-checked-color,\n    #{$colorPrimary90}\n  );\n\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: var(--label-color);\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: var(--label-hover-color);\n  }\n\n  &__input:checked:hover ~ &__label,\n  &__input:checked:hover ~ &__mark &__check {\n    color: var(--label-hover-checked-color);\n  }\n\n  &:hover &__mark,\n  &__input:checked ~ &__mark {\n    border-color: var(--label-hover-color);\n  }\n\n  &__input:checked:hover ~ &__mark {\n    border-color: var(--label-hover-checked-color);\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  &--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 \"../../index\";\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  /**\n   * **Do not use this property. It will be deprecated with the next major release.**\n   * Long description title appearing in a popover (use description-long-title slot as or description property alternative) */\n  @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          {(errorUsed || 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  --legend-color: var(--stzh-radio-group-legend-color, #{$headingColor});\n\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: var(--legend-color);\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  &--is-invalid &__legend,\n  &--has-error &__legend {\n    color: $colorError60;\n  }\n\n  &--is-disabled &__legend {\n    color: $colorGrey60;\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 \"../../index\";\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  /**\n   * **Do not use this property. It will be deprecated with the next major release.**\n   * Long description title appearing in a popover (use description-long-title slot as or description property alternative) */\n  @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.errorUsed || 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-c5de2eae.entry.js → p-1187dcb3.entry.js}

@@ -1,2 +1,2 @@
-import{r as t,h as c,a as o,g as s}from"./p-ef5985a3.js";const a=".sc-stzh-poicard-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-poicard-h,[stzh-hidden].sc-stzh-poicard-h{display:none}.sc-stzh-poicard-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-poicard-h *.sc-stzh-poicard,.sc-stzh-poicard-h *.sc-stzh-poicard::before,.sc-stzh-poicard-h *.sc-stzh-poicard::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-poicard-h .has-focus.sc-stzh-poicard{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-poicard-h .stzh-fylingfocus-focused.sc-stzh-poicard{outline-style:none !important}.sc-stzh-poicard-h .stzh-fylingfocus-focused.sc-stzh-poicard::-moz-focus-inner{border:0 !important}.sc-stzh-poicard-h{--background-color:var(--stzh-color-grey10);--hover-background-color:var(--stzh-color-grey20);--title-color:var(--stzh-color-primary70);--title-hover-color:var(--stzh-color-primary80);--title-background-color:var(--stzh-color-secondary20);--title-hover-background-color:var(--stzh-color-secondary30)}.stzh-poicard.sc-stzh-poicard{display:block;background-color:var(--background-color);text-decoration:none;height:100%}.stzh-poicard.sc-stzh-poicard:hover{--title-color:var(--title-hover-color);--title-background-color:var(--title-hover-background-color);--background-color:var(--hover-background-color)}.stzh-poicard__content.sc-stzh-poicard{display:flex;flex-direction:column;gap:var(--stzh-space-small)}.stzh-poicard__content-with-icon.sc-stzh-poicard,.stzh-poicard__content-with-badge.sc-stzh-poicard{display:flex;align-items:center;gap:var(--stzh-space-xxsmall)}.stzh-poicard__content-with-icon.sc-stzh-poicard stzh-text.sc-stzh-poicard{width:auto;--color:var(--stzh-color-primary70)}.stzh-poicard__content-with-icon.sc-stzh-poicard stzh-icon.sc-stzh-poicard{--color:var(--stzh-color-primary70)}.stzh-poicard__content-with-badge.sc-stzh-poicard stzh-text.sc-stzh-poicard{width:auto;--color:var(--stzh-color-grey80)}.stzh-poicard__content-head.sc-stzh-poicard{display:flex;align-items:center;padding:var(--stzh-space-xsmall) var(--stzh-space-medium) var(--stzh-space-small);--color:var(--title-color);background-color:var(--title-background-color)}.stzh-poicard__content-head.sc-stzh-poicard stzh-icon.sc-stzh-poicard{--color:var(--stzh-color-primary)}.stzh-poicard__content-title.sc-stzh-poicard{width:100%;--color:var(--stzh-color-grey80)}.stzh-poicard.sc-stzh-poicard:hover .stzh-poicard__content-title.sc-stzh-poicard{--color:var(--stzh-color-black)}.stzh-poicard__content-body.sc-stzh-poicard{padding:var(--stzh-space-xsmall) var(--stzh-space-medium) var(--stzh-space-medium);display:flex;flex-direction:column;gap:var(--stzh-space-xsmall)}";const e=a;const r=class{constructor(c){t(this,c);this.init=()=>{this.itemWatcher(this.item)};this.item=""}itemWatcher(t){if(!t){this._item=undefined}else if(typeof t==="string"){try{this._item=JSON.parse(t)}catch(t){this._item=undefined}}else{this._item=t}}connectedCallback(){this.init()}render(){const t={"stzh-poicard":true};return c(o,{key:"fd756d25f714586291f6257e067cdcb3a71d9962"},c("a",{key:"680220b5958f56db3453c7e6700e3897d4c1d127",class:t,href:this._item.url,target:"_blank"},c("div",{key:"8fe3116fe188503fd750d2fcc895cc4a03fd461a",class:"stzh-poicard__content"},c("div",{key:"dcc00fe19a6f5426888b0ca8a87eb9a8011d1783",class:"stzh-poicard__content-head"},c("stzh-heading",{key:"6c17f47680bab5f9091bcd2a2a42ae03e84272c9"},this._item.title)),c("div",{key:"dbf7996c15c0d651018479d2a4cd436c110220a8",class:"stzh-poicard__content-body"},this._item.distance&&c("div",{key:"bab8ab3fccdf82457e4383d263015e3e25bf0742",class:"stzh-poicard__content-with-icon"},c("stzh-icon",{key:"b146c076f1c6aa520a6c0eaf6a606a785deba4ab",name:"pin"}),c("stzh-text",{key:"0e41396cf91bff05276fe9da042a5ec97d9676f5"},this._item.distance)),this._item.temp&&c("div",{key:"2741d9d23e1ccd37e9862ce27d305dbe3b51de5c",class:"stzh-poicard__content-with-icon"},c("stzh-icon",{key:"ba125601a25778d381883e447efffcc3ce8e6ad2",name:"thermometer"}),c("stzh-text",{key:"29ed34c8dd36617a94dc0b9abf0d433be4471b3d"},this._item.temp)),(this._item.statusMessageContent||this._item.statusMessage)&&c("div",{key:"58ce3646878980ba7dc7a4286472c641f2415238",class:"stzh-poicard__content-with-badge"},this._item.statusMessage&&c("stzh-text",{key:"25bb8733b1641ba78b1b3088b9e1387f615692bd",size:"milli"},this._item.statusMessage),this._item.statusMessageContent&&c("stzh-chip",{key:"cab5f3bd34c3db3385bb9352af35c53ca61eb412",variant:"tag",size:"small",inverted:true,icon:"",type:this._item.success?"default":"error",label:this._item.statusMessageContent}))))))}get element(){return s(this)}static get watchers(){return{item:["itemWatcher"]}}};r.style=e;export{r as stzh_poicard};
-//# sourceMappingURL=p-c5de2eae.entry.js.map
+import{r as t,h as c,a as o,g as s}from"./p-ef5985a3.js";const e=".sc-stzh-poicard-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-poicard-h,[stzh-hidden].sc-stzh-poicard-h{display:none}.sc-stzh-poicard-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-poicard-h *.sc-stzh-poicard,.sc-stzh-poicard-h *.sc-stzh-poicard::before,.sc-stzh-poicard-h *.sc-stzh-poicard::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-poicard-h .has-focus.sc-stzh-poicard{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-poicard-h .stzh-fylingfocus-focused.sc-stzh-poicard{outline-style:none !important}.sc-stzh-poicard-h .stzh-fylingfocus-focused.sc-stzh-poicard::-moz-focus-inner{border:0 !important}.sc-stzh-poicard-h{--background-color:var(--stzh-color-grey10);--hover-background-color:var(--stzh-color-grey20);--title-color:var(--stzh-color-primary70);--title-hover-color:var(--stzh-color-primary80);--title-background-color:var(--stzh-color-secondary20);--title-hover-background-color:var(--stzh-color-secondary30)}.stzh-poicard.sc-stzh-poicard{display:block;background-color:var(--background-color);text-decoration:none;height:100%}.stzh-poicard.sc-stzh-poicard:hover{--title-color:var(--title-hover-color);--title-background-color:var(--title-hover-background-color);--background-color:var(--hover-background-color)}.stzh-poicard__content.sc-stzh-poicard{display:flex;flex-direction:column;gap:var(--stzh-space-small)}.stzh-poicard__content-with-icon.sc-stzh-poicard,.stzh-poicard__content-with-badge.sc-stzh-poicard{display:flex;align-items:center;gap:var(--stzh-space-xxsmall)}.stzh-poicard__content-with-icon.sc-stzh-poicard stzh-text.sc-stzh-poicard{width:auto;--color:var(--stzh-color-primary70)}.stzh-poicard__content-with-icon.sc-stzh-poicard stzh-icon.sc-stzh-poicard{--color:var(--stzh-color-primary70)}.stzh-poicard__content-with-badge.sc-stzh-poicard stzh-text.sc-stzh-poicard{width:auto;--color:var(--stzh-color-grey80)}.stzh-poicard__content-head.sc-stzh-poicard{display:flex;align-items:center;padding:var(--stzh-space-xsmall) var(--stzh-space-medium) var(--stzh-space-small);--color:var(--title-color);background-color:var(--title-background-color)}.stzh-poicard__content-head.sc-stzh-poicard stzh-icon.sc-stzh-poicard{--color:var(--stzh-color-primary)}.stzh-poicard__content-title.sc-stzh-poicard{width:100%;--color:var(--stzh-color-grey80)}.stzh-poicard.sc-stzh-poicard:hover .stzh-poicard__content-title.sc-stzh-poicard{--color:var(--stzh-color-black)}.stzh-poicard__content-body.sc-stzh-poicard{padding:var(--stzh-space-xsmall) var(--stzh-space-medium) var(--stzh-space-medium);display:flex;flex-direction:column;gap:var(--stzh-space-xsmall)}";const a=e;const r=class{constructor(c){t(this,c);this.init=()=>{this.itemWatcher(this.item)};this.item=""}itemWatcher(t){if(!t){this._item=undefined}else if(typeof t==="string"){try{this._item=JSON.parse(t)}catch(t){this._item=undefined}}else{this._item=t}}connectedCallback(){this.init()}render(){const t={"stzh-poicard":true};return c(o,{key:"5e22e3edd9a5f53f212b24b9322384a860c0a10c"},c("a",{key:"f4df00d9dd0c9cc69a9c4392d589cf0bda1dffb2",class:t,href:this._item.url,target:"_blank"},c("div",{key:"b0ccedb5f59c1cf6c95404c5f24896fbc8760a17",class:"stzh-poicard__content"},c("div",{key:"5b0669e4ec18d010c9273269d061ff21d00ac1f5",class:"stzh-poicard__content-head"},c("stzh-heading",{key:"01c998690195acad9a2ebc74709580916a16b7ae"},this._item.title)),c("div",{key:"d738c83014e40a372a8f4fcaec31f5a7ebca4c31",class:"stzh-poicard__content-body"},this._item.distance&&c("div",{key:"2e7f8bbd107b14cd3a4ec619bef0e9e7074894be",class:"stzh-poicard__content-with-icon"},c("stzh-icon",{key:"c76f980a8e646895d676c9315327c275022fca2d",name:"pin"}),c("stzh-text",{key:"681dc3751ceaa78c7c92472d78aab67cbcb920b9"},this._item.distance)),this._item.temp&&c("div",{key:"405b370c59f0817ad9c275661ce3c915381804e7",class:"stzh-poicard__content-with-icon"},c("stzh-icon",{key:"e5406e5d365ad4ceeec3d596084c57aca7e3272c",name:"thermometer"}),c("stzh-text",{key:"78cbcc97a6c6c5e7ffcee163ecce12a05b0ccde2"},this._item.temp)),(this._item.statusMessageContent||this._item.statusMessage)&&c("div",{key:"299ee1359498476745aeea101181c23b2730d472",class:"stzh-poicard__content-with-badge"},this._item.statusMessage&&c("stzh-text",{key:"b4260538c72566bccfd33cb2a4fed59dd9ff4697",size:"milli"},this._item.statusMessage),this._item.statusMessageContent&&c("stzh-chip",{key:"286452c1d25334a84649a259ff5d3fddd8ed88ef",variant:"tag",size:"small",inverted:true,icon:"",type:this._item.success?"default":"error",label:this._item.statusMessageContent}))))))}get element(){return s(this)}static get watchers(){return{item:["itemWatcher"]}}};r.style=a;export{r as stzh_poicard};
+//# sourceMappingURL=p-1187dcb3.entry.js.map

package/dist/stzh-components/{p-822fd427.entry.js → p-12146af8.entry.js}

@@ -1,2 +1,2 @@
-import{r as t,c as s,h as i,a as o,g as h}from"./p-ef5985a3.js";import{h as n}from"./p-87c329f2.js";import{S as r}from"./p-9531514f.js";import"./p-dae15605.js";const e=".sc-stzh-input-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-input-h,[stzh-hidden].sc-stzh-input-h{display:none}.sc-stzh-input-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-input-h *.sc-stzh-input,.sc-stzh-input-h *.sc-stzh-input::before,.sc-stzh-input-h *.sc-stzh-input::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-input-h .has-focus.sc-stzh-input{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-input-h .stzh-fylingfocus-focused.sc-stzh-input{outline-style:none !important}.sc-stzh-input-h .stzh-fylingfocus-focused.sc-stzh-input::-moz-focus-inner{border:0 !important}.sc-stzh-input-h{--text-align:left;--color:var(--stzh-input-color, var(--stzh-color-secondary60));--border-color:var(--stzh-color-grey70);--border-radius:var(--stzh-form-input-border-radius);--background-color:var(--stzh-color-white);--padding-top:var(--stzh-space-xsmall);--padding-bottom:var(--stzh-space-xsmall);--padding-left:var(--stzh-space-medium);--padding-right:var(--stzh-space-medium);--height:var(--stzh-form-input-height);--input-width:100%;--label-color:var(--stzh-input-label-color, var(--stzh-color-primary));--placeholder-color:var(--stzh-color-grey70);--button-right-color:var(--stzh-color-grey80);--hover-color:var(--stzh-input-hover-color, var(--stzh-color-secondary60));--hover-border-color:var(\n    --stzh-input-hover-border-color,\n    var(--stzh-color-secondary50)\n  );--hover-background-color:var(--stzh-color-white);--hover-button-right-color:var(--stzh-color-primary70);--focus-color:var(--stzh-color-black);--focus-border-color:var(--stzh-color-secondary50);--focus-background-color:var(--stzh-color-secondary20);--focus-button-right-color:var(--stzh-color-primary70);--text-selection-background-color:var(--stzh-color-secondary30);width:100%}[type=hidden].sc-stzh-input-h{position:absolute;top:-624.9375rem;left:-624.9375rem;visibility:hidden}[size=small].sc-stzh-input-h{--height:var(--stzh-form-input-small-height)}[is-filled].sc-stzh-input-h:not([is-filled=false]){--button-right-color:var(--stzh-color-primary70);--hover-button-right-color:var(--stzh-color-primary70);--focus-button-right-color:var(--stzh-color-black)}[is-invalid].sc-stzh-input-h{--color:var(--stzh-color-error60);--border-color:var(--stzh-color-error60);--background-color:var(--stzh-color-white);--label-color:var(--stzh-color-error60);--placeholder-color:var(--stzh-color-error60);--button-right-color:var(--stzh-color-error60);--hover-color:var(--stzh-color-error60);--hover-border-color:var(--stzh-color-error60);--hover-background-color:var(--stzh-color-white);--hover-button-right-color:var(--stzh-color-error60);--focus-color:var(--stzh-color-error60);--focus-border-color:var(--stzh-color-error60);--focus-background-color:var(--stzh-color-white);--focus-button-right-color:var(--stzh-color-error60)}[readonly].sc-stzh-input-h:not([readonly=false]),[disabled].sc-stzh-input-h:not([disabled=false]){--color:var(--stzh-color-grey70);--border-color:var(--stzh-color-grey70);--background-color:var(--stzh-color-grey10);--label-color:var(--stzh-color-grey70);--placeholder-color:var(--stzh-color-grey70);--description-color:var(--stzh-color-grey70);--button-right-color:var(--stzh-color-grey70);--hover-color:var(--stzh-color-grey70);--hover-border-color:var(--stzh-color-grey70);--hover-background-color:var(--stzh-color-grey10);--hover-button-right-color:var(--stzh-color-grey70);--focus-color:var(--stzh-color-grey70);--focus-border-color:var(--stzh-color-grey70);--focus-background-color:var(--stzh-color-grey10);--focus-button-right-color:var(--stzh-color-grey70)}.sc-stzh-input-h:is(:has(.stzh-input__input:hover)){--button-right-color:var(--hover-button-right-color)}.sc-stzh-input-h:is(:has(.stzh-input__input:focus)){--button-right-color:var(--focus-button-right-color)}.sc-stzh-input-h.sc-stzh-input-s>[slot=button-right],.sc-stzh-input-h .sc-stzh-input-s>[slot=button-right],.stzh-input__button-right.sc-stzh-input{position:absolute;top:0px;right:0px}.sc-stzh-input-h.sc-stzh-input-s>stzh-popover[slot=button-right],.sc-stzh-input-h .sc-stzh-input-s>stzh-popover[slot=button-right],.sc-stzh-input-h.sc-stzh-input-s>[slot=button-right],.sc-stzh-input-h.sc-stzh-input-s>[slot=button-right] stzh-popover,.sc-stzh-input-h .sc-stzh-input-s>[slot=button-right] stzh-popover{display:block}.sc-stzh-input-h.sc-stzh-input-s>stzh-button[slot=button-right],.sc-stzh-input-h .sc-stzh-input-s>stzh-button[slot=button-right],.sc-stzh-input-h.sc-stzh-input-s>stzh-button[slot=button-right][disabled]:not([disabled=false]),.sc-stzh-input-h .sc-stzh-input-s>stzh-button[slot=button-right][disabled]:not([disabled=false]),.sc-stzh-input-h.sc-stzh-input-s>stzh-popover[slot=button-right],.sc-stzh-input-h.sc-stzh-input-s>stzh-popover[slot=button-right] .stzh-popover__trigger stzh-button,.sc-stzh-input-h .sc-stzh-input-s>stzh-popover[slot=button-right] .stzh-popover__trigger stzh-button,.sc-stzh-input-h.sc-stzh-input-s>stzh-popover[slot=button-right] .stzh-popover__trigger stzh-button[disabled]:not([disabled=false]),.sc-stzh-input-h .sc-stzh-input-s>stzh-popover[slot=button-right] .stzh-popover__trigger stzh-button[disabled]:not([disabled=false]),.sc-stzh-input-h.sc-stzh-input-s>stzh-tooltip[slot=button-right] .stzh-tooltip__trigger stzh-button,.sc-stzh-input-h .sc-stzh-input-s>stzh-tooltip[slot=button-right] .stzh-tooltip__trigger stzh-button,.sc-stzh-input-h.sc-stzh-input-s>stzh-tooltip[slot=button-right] .stzh-tooltip__trigger stzh-button[disabled]:not([disabled=false]),.sc-stzh-input-h .sc-stzh-input-s>stzh-tooltip[slot=button-right] .stzh-tooltip__trigger stzh-button[disabled]:not([disabled=false]),.stzh-input__button-right.sc-stzh-input,.stzh-input__button-right[disabled].sc-stzh-input:not([disabled=false]){--color:var(--button-right-color);--background-color:transparent;--border-color:transparent;--hover-color:var(--button-right-color);--hover-background-color:transparent;--hover-border-color:transparent}.sc-stzh-input-h.sc-stzh-input-s>stzh-button[slot=button-right],.sc-stzh-input-h.sc-stzh-input-s>stzh-button[slot=button-right][size=default][icon-only]:not([icon-only=false]),.sc-stzh-input-h .sc-stzh-input-s>stzh-button[slot=button-right][size=default][icon-only]:not([icon-only=false]),.sc-stzh-input-h.sc-stzh-input-s>stzh-popover[slot=button-right],.sc-stzh-input-h.sc-stzh-input-s>stzh-popover[slot=button-right] .stzh-popover__trigger stzh-button,.sc-stzh-input-h.sc-stzh-input-s>stzh-popover[slot=button-right] .stzh-popover__trigger stzh-button[icon-only][size=default]:not([icon-only=false]),.sc-stzh-input-h .sc-stzh-input-s>stzh-popover[slot=button-right] .stzh-popover__trigger stzh-button[icon-only][size=default]:not([icon-only=false]),.sc-stzh-input-h.sc-stzh-input-s>stzh-tooltip[slot=button-right] .stzh-tooltip__trigger stzh-button,.sc-stzh-input-h.sc-stzh-input-s>stzh-tooltip[slot=button-right] .stzh-tooltip__trigger stzh-button[icon-only][size=default]:not([icon-only=false]),.sc-stzh-input-h .sc-stzh-input-s>stzh-tooltip[slot=button-right] .stzh-tooltip__trigger stzh-button[icon-only][size=default]:not([icon-only=false]),.stzh-input__button-right[size=default][icon-only].sc-stzh-input:not([icon-only=false]){--icon-size:var(--stzh-icon-size-medium)}.stzh-input__marker-symbol.sc-stzh-input{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium)}.stzh-input__marker-text.sc-stzh-input{border:0;clip:rect(0 0 0 0);clip-path:inset(100%);width:0.0625rem;height:0.0625rem;overflow:hidden;padding:0;position:absolute}.stzh-input__description-wrapper.sc-stzh-input{display:flex;flex-direction:column-reverse;min-height:var(--description-min-height, var(--stzh-description-min-height, none))}.stzh-input__error.sc-stzh-input,.stzh-input__description.sc-stzh-input{font-size:var(--stzh-font-nano-font-size);line-height:var(--stzh-font-nano-text-line-height)}.stzh-input__error.sc-stzh-input{color:var(--stzh-color-error60)}.stzh-input__error-list.sc-stzh-input{list-style:none;margin:0;padding:0}.stzh-input__description.sc-stzh-input{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-input__description-long.sc-stzh-input{margin-right:var(--stzh-space-xxsmall);margin-top:0.125rem}@supports (font: -apple-system-body) and (-webkit-appearance: none){.stzh-input__description-long.sc-stzh-input{margin-top:0}}.stzh-input__description-long-popover.sc-stzh-input{--width:auto;--max-width:27.3125rem}.stzh-input__description-long-button.sc-stzh-input{display:flex;justify-content:center;align-items:center;appearance:none;font-family:inherit;padding:0;border:none;background-color:transparent;border-radius:0.5rem;cursor:pointer}.stzh-input.sc-stzh-input stzh-icon.stzh-input__description-long-icon.sc-stzh-input{--size:var(--stzh-icon-size-xsmall)}.stzh-input--has-error.sc-stzh-input .stzh-input__error.sc-stzh-input,.stzh-input--has-description.sc-stzh-input .stzh-input__description.sc-stzh-input{margin-top:var(--stzh-space-xxxsmall)}.stzh-input.sc-stzh-input .sc-stzh-input::selection{background:var(--text-selection-background-color)}.stzh-input__field-wrapper.sc-stzh-input{position:relative;display:flex;width:var(--input-width)}.stzh-input__input.sc-stzh-input{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-milli-font-size);line-height:var(--stzh-font-milli-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing);border:0.125rem solid var(--border-color);transition-property:color, border-color, background-color;transition-duration:var(--stzh-base-transition-animation-speed);border-radius:var(--border-radius);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);padding-left:var(--padding-left);padding-right:var(--padding-right);margin:0;width:100%;color:var(--color);background-color:var(--background-color);appearance:none;text-align:var(--text-align)}.stzh-input__input.sc-stzh-input::-webkit-input-placeholder{color:var(--placeholder-color)}.stzh-input__input.sc-stzh-input:-moz-placeholder{color:var(--placeholder-color)}.stzh-input__input.sc-stzh-input::-moz-placeholder{color:var(--placeholder-color)}.stzh-input__input.sc-stzh-input:-ms-input-placeholder{color:var(--placeholder-color)}.stzh-input__input.sc-stzh-input:hover{color:var(--hover-color);border-color:var(--hover-border-color);background-color:var(--hover-background-color)}.stzh-input__input.sc-stzh-input:focus{color:var(--focus-color);border-color:var(--focus-border-color);background-color:var(--focus-background-color)}.stzh-input__input.sc-stzh-input:-webkit-autofill{background-clip:text}.stzh-input__input.sc-stzh-input:placeholder-shown{text-overflow:ellipsis}.stzh-input__input[type=search].sc-stzh-input::-webkit-search-decoration,.stzh-input__input[type=search].sc-stzh-input::-webkit-search-cancel-button,.stzh-input__input[type=search].sc-stzh-input::-webkit-search-results-button,.stzh-input__input[type=search].sc-stzh-input::-webkit-search-results-decoration{-webkit-appearance:none}.stzh-input__input--input.sc-stzh-input{height:var(--height)}.stzh-input__input--textarea.sc-stzh-input{min-height:var(--height);resize:vertical}.stzh-input__label.sc-stzh-input{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);text-overflow:ellipsis;white-space:nowrap;overflow:hidden;display:block;color:var(--label-color);width:auto;max-width:100%;margin-bottom:var(--stzh-space-xxxsmall)}.stzh-input__label.no-label-truncate.sc-stzh-input{text-overflow:clip;white-space:normal;overflow:visible}.stzh-input__label.sc-stzh-input:empty{display:none}.stzh-input__marker.sc-stzh-input{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-input--type-password.stzh-input--is-not-filled.sc-stzh-input .stzh-input__button-right.sc-stzh-input,.stzh-input--type-password.stzh-input--is-readonly.sc-stzh-input .stzh-input__button-right.sc-stzh-input,.stzh-input--type-password.stzh-input--is-disabled.sc-stzh-input .stzh-input__button-right.sc-stzh-input,.stzh-input--type-search.stzh-input--is-not-clearable.sc-stzh-input .stzh-input__button-right.sc-stzh-input,.stzh-input--type-search.stzh-input--is-not-filled.sc-stzh-input .stzh-input__button-right.sc-stzh-input,.stzh-input--type-search.stzh-input--is-readonly.sc-stzh-input .stzh-input__button-right.sc-stzh-input,.stzh-input--type-search.stzh-input--is-disabled.sc-stzh-input .stzh-input__button-right.sc-stzh-input{pointer-events:none}.stzh-input--has-button-right.sc-stzh-input .stzh-input__input.sc-stzh-input{padding-right:var(--height)}.stzh-input--size-small.sc-stzh-input .stzh-input__input.sc-stzh-input{font-size:var(--stzh-font-micro-font-size);line-height:var(--stzh-font-micro-text-line-height)}.stzh-input.sc-stzh-input:not(.stzh-input--has-spin) .stzh-input__input.sc-stzh-input::-webkit-outer-spin-button,.stzh-input.sc-stzh-input:not(.stzh-input--has-spin) .stzh-input__input.sc-stzh-input::-webkit-inner-spin-button{appearance:none;margin:0}.stzh-input.sc-stzh-input:not(.stzh-input--has-spin) .stzh-input__input[type=number].sc-stzh-input{appearance:textfield}.stzh-input--has-label-hidden.sc-stzh-input .stzh-input__label.sc-stzh-input{border:0;clip:rect(0 0 0 0);clip-path:inset(100%);width:0.0625rem;height:0.0625rem;overflow:hidden;padding:0;position:absolute}.stzh-input--is-readonly.sc-stzh-input .stzh-input__input.sc-stzh-input,.stzh-input--is-disabled.sc-stzh-input .stzh-input__input.sc-stzh-input,.stzh-input--is-readonly.sc-stzh-input .stzh-input__label.sc-stzh-input,.stzh-input--is-disabled.sc-stzh-input .stzh-input__label.sc-stzh-input{cursor:not-allowed}";const a=e;let c=0;const l=class{constructor(i){t(this,i);this.stzhChange=s(this,"stzhChange",7);this.stzhChanged=s(this,"stzhChanged",7);this.stzhFocus=s(this,"stzhFocus",7);this.stzhBlur=s(this,"stzhBlur",7);this.focusedByInput=false;this.onClearClick=async t=>{this.value="";this.input.focus();await this.waitForNextRender();this.stzhChange.emit({component:"stzh-input",originalEvent:t,value:this.value});this.stzhChanged.emit({component:"stzh-input",originalEvent:t,value:this.value})};this.onTogglePasswordVisibilityClick=async()=>{this.showPassword=!this.showPassword};this.handleReset=async()=>{this.value=this.defaultValue;this.input.value=this.defaultValue};this.onInput=t=>{this.value=this.input.value;this.stzhChange.emit({component:"stzh-input",originalEvent:t,value:this.value})};this.onChange=t=>{this.value=this.input.value;this.stzhChanged.emit({component:"stzh-input",originalEvent:t,value:this.value})};this.onRootFocus=()=>{if(!this.focusedByInput){this.input.focus()}this.focusedByInput=false};this.onFocus=t=>{this.focusedByInput=true;const s=new FocusEvent("focus",{view:window,bubbles:false,cancelable:false});this.element.dispatchEvent(s);this.stzhFocus.emit({component:"stzh-input",originalEvent:t})};this.onBlur=t=>{this.input.value=this.input.value;const s=new FocusEvent("blur",{view:window,bubbles:false,cancelable:false});this.element.dispatchEvent(s);this.stzhBlur.emit({component:"stzh-input",originalEvent:t})};this.localization=undefined;this.multiline=false;this.rows=undefined;this.type="text";this.step=1;this.min=undefined;this.max=undefined;this.showSpin=false;this.readonly=false;this.disabled=false;this.clearable=false;this.hideOptional=false;this.minlength=undefined;this.maxlength=undefined;this.name=undefined;this.value="";this.defaultValue="";this.description=undefined;this.descriptionLong=undefined;this.descriptionLongTitle=undefined;this.error=undefined;this.invalid=false;this.required=false;this.inputmode=undefined;this.autocomplete="on";this.noAutocomplete=false;this.label="";this.noLabelTruncate=false;this.labelHidden=false;this.size="default";this.a11yDescribedby="";this.filled=undefined;this.showPassword=undefined}resetListener(t){if(t.target.contains(this.element)){requestAnimationFrame((()=>{this.handleReset()}))}}valueWatcher(t){this.filled=t!==""}errorWatcher(t){if(typeof t==="string"){try{this._error=JSON.parse(t)}catch(s){if(t){this._error=[t]}else{this._error=[]}}}else if(t){this._error=t}else{this._error=[]}}typeWatcher(t){const s=["text","search","password","email","url","tel","number","hidden"];if(!this.multiline&&!s.includes(t)){throw new Error(`Type ${t} not supported`)}}waitForNextRender(){return new Promise((t=>this.renderPromiseResolve=t))}renderTextarea(){return i("textarea",{class:"stzh-input__input stzh-input__input--textarea",ref:t=>this.input=t,id:this.inputId,name:this.name,value:this.value,rows:this.rows,disabled:this.disabled,readonly:this.readonly,minlength:this.minlength,maxlength:this.maxlength,"aria-describedby":`${this.inputId}-description ${this.a11yDescribedby}`,"aria-required":this.required?"true":"false","aria-invalid":this.invalid?"true":"false",onChange:this.onChange,onInput:this.onInput,onFocus:this.onFocus,onBlur:this.onBlur})}renderInput(){return i("input",{class:"stzh-input__input stzh-input__input--input",ref:t=>this.input=t,id:this.inputId,type:this.showPassword?"text":this.type,name:this.name,value:this.value,defaultValue:this.defaultValue,min:this.min,max:this.max,step:this.step,inputmode:this.inputmode,disabled:this.disabled,readonly:this.readonly,minlength:this.minlength,maxlength:this.maxlength,autocomplete:this.noAutocomplete?"off":this.autocomplete,"aria-autocomplete":this.noAutocomplete?"none":undefined,"aria-describedby":`${this.inputId}-description ${this.a11yDescribedby}`,"aria-required":this.required?"true":"false","aria-invalid":this.invalid?"true":"false",onChange:this.onChange,onInput:this.onInput,onFocus:this.onFocus,onBlur:this.onBlur})}componentDidRender(){if(this.renderPromiseResolve){this.renderPromiseResolve()}}async componentWillLoad(){this.inputId=`stzh-input-${c++}`;this.typeWatcher(this.type);this.valueWatcher(this.value);this.errorWatcher(this.error);this.defaultValue=this.defaultValue||this.value;if(!this.localization){this.localization=await window.stzhComponents.utils.fetchTranslations(this.element,"input")}}render(){var t;const s=n(this.element,"button-right");const h=n(this.element,"description")||!!this.description;const e=n(this.element,"description-long")||!!this.descriptionLong;const a=n(this.element,"error")||((t=this._error)===null||t===void 0?void 0:t.length)>0;const c={"stzh-input":true,"stzh-input--has-button-right":s||this.type==="search"||this.clearable&&this.filled&&!this.readonly&&!this.disabled,"stzh-input--has-description":h,"stzh-input--has-description-long":e,"stzh-input--has-error":a,"stzh-input--has-spin":this.showSpin,"stzh-input--is-invalid":this.invalid||a,"stzh-input--is-disabled":this.disabled,"stzh-input--is-readonly":this.readonly,"stzh-input--is-required":this.required,"stzh-input--is-filled":this.filled,"stzh-input--is-not-filled":!this.filled,"stzh-input--is-clearable":this.clearable,"stzh-input--is-not-clearable":!this.clearable,"stzh-input--has-label-hidden":this.labelHidden,[`stzh-input--size-${this.size}`]:!!this.size,[`stzh-input--type-${this.type}`]:!!this.type};return i(o,{key:"17df6e3219c089d1791e3533fb099577c892c8c3","is-invalid":this.invalid||a,tabindex:this.disabled?null:"-1",onFocus:this.onRootFocus,"is-filled":this.filled},i("div",{key:"55d0301064497397505a75f91ec62b0629e03c18",class:c},i("label",{key:"3728b2367e14541d4eb9e782af64eeb2d0218047",class:{"stzh-input__label":true,"no-label-truncate":this.noLabelTruncate},htmlFor:this.inputId},this.label?this.label:i("slot",null),!this.hideOptional&&i("span",{key:"306d38c386af56938121ad68567a2f73d04dff7b",class:"stzh-input__marker"},i("span",{key:"bea49dc3d8ab84702852fa199cf3e9ca1f25be65",class:"stzh-input__marker-symbol","aria-hidden":"true"},this.required?this.localization.$globals.requiredFieldMarker:this.localization.$globals.optionalFieldMarker),i("span",{key:"57de6fba296cf9919913b31ddb2be9b111001649",class:"stzh-input__marker-text"},this.required?this.localization.$globals.requiredFieldText:this.localization.$globals.optionalFieldText))),i("div",{key:"a3e047e750630011f3a9ff59689df5f0d25c589f",class:"stzh-input__field-wrapper"},this.multiline?this.renderTextarea():this.renderInput(),this.clearable||this.type==="search"||this.type==="password"?(!this.clearable||this.disabled||this.readonly||!this.filled)&&(this.type==="search"||this.type==="password")?i("stzh-button",{class:"stzh-input__button-right",icon:this.type==="search"?"search":"view",size:this.size,iconOnly:true,onClick:this.onTogglePasswordVisibilityClick,disabled:this.disabled||this.readonly}):this.filled?i("stzh-button",{class:"stzh-input__button-right",icon:"close",size:this.size,iconOnly:true,onClick:this.onClearClick,a11yLabel:this.localization.$globals.clearButtonLabel,"aria-controls":this.inputId}):i("slot",{name:"button-right"}):i("slot",{name:"button-right"})),(a||this.description)&&i(r,{key:"da996df70a5143981754de29594b80f4dcc79ca3",classPrefix:"stzh-input",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 h(this)}static get watchers(){return{value:["valueWatcher"],error:["errorWatcher"],type:["typeWatcher"]}}};l.style=a;export{l as stzh_input};
-//# sourceMappingURL=p-822fd427.entry.js.map
+import{r as t,c as s,h as i,a as o,g as h}from"./p-ef5985a3.js";import{h as n}from"./p-87c329f2.js";import{S as r}from"./p-9531514f.js";import"./p-dae15605.js";const e=".sc-stzh-input-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-input-h,[stzh-hidden].sc-stzh-input-h{display:none}.sc-stzh-input-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-input-h *.sc-stzh-input,.sc-stzh-input-h *.sc-stzh-input::before,.sc-stzh-input-h *.sc-stzh-input::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-input-h .has-focus.sc-stzh-input{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-input-h .stzh-fylingfocus-focused.sc-stzh-input{outline-style:none !important}.sc-stzh-input-h .stzh-fylingfocus-focused.sc-stzh-input::-moz-focus-inner{border:0 !important}.sc-stzh-input-h{--text-align:left;--color:var(--stzh-input-color, var(--stzh-color-secondary60));--border-color:var(--stzh-color-grey70);--border-radius:var(--stzh-form-input-border-radius);--background-color:var(--stzh-color-white);--padding-top:var(--stzh-space-xsmall);--padding-bottom:var(--stzh-space-xsmall);--padding-left:var(--stzh-space-medium);--padding-right:var(--stzh-space-medium);--height:var(--stzh-form-input-height);--input-width:100%;--label-color:var(--stzh-input-label-color, var(--stzh-color-primary));--placeholder-color:var(--stzh-color-grey70);--button-right-color:var(--stzh-color-grey80);--hover-color:var(--stzh-input-hover-color, var(--stzh-color-secondary60));--hover-border-color:var(\n    --stzh-input-hover-border-color,\n    var(--stzh-color-secondary50)\n  );--hover-background-color:var(--stzh-color-white);--hover-button-right-color:var(--stzh-color-primary70);--focus-color:var(--stzh-color-black);--focus-border-color:var(--stzh-color-secondary50);--focus-background-color:var(--stzh-color-secondary20);--focus-button-right-color:var(--stzh-color-primary70);--text-selection-background-color:var(--stzh-color-secondary30);width:100%}[type=hidden].sc-stzh-input-h{position:absolute;top:-624.9375rem;left:-624.9375rem;visibility:hidden}[size=small].sc-stzh-input-h{--height:var(--stzh-form-input-small-height)}[is-filled].sc-stzh-input-h:not([is-filled=false]){--button-right-color:var(--stzh-color-primary70);--hover-button-right-color:var(--stzh-color-primary70);--focus-button-right-color:var(--stzh-color-black)}[is-invalid].sc-stzh-input-h{--color:var(--stzh-color-error60);--border-color:var(--stzh-color-error60);--background-color:var(--stzh-color-white);--label-color:var(--stzh-color-error60);--placeholder-color:var(--stzh-color-error60);--button-right-color:var(--stzh-color-error60);--hover-color:var(--stzh-color-error60);--hover-border-color:var(--stzh-color-error60);--hover-background-color:var(--stzh-color-white);--hover-button-right-color:var(--stzh-color-error60);--focus-color:var(--stzh-color-error60);--focus-border-color:var(--stzh-color-error60);--focus-background-color:var(--stzh-color-white);--focus-button-right-color:var(--stzh-color-error60)}[readonly].sc-stzh-input-h:not([readonly=false]),[disabled].sc-stzh-input-h:not([disabled=false]){--color:var(--stzh-color-grey70);--border-color:var(--stzh-color-grey70);--background-color:var(--stzh-color-grey10);--label-color:var(--stzh-color-grey70);--placeholder-color:var(--stzh-color-grey70);--description-color:var(--stzh-color-grey70);--button-right-color:var(--stzh-color-grey70);--hover-color:var(--stzh-color-grey70);--hover-border-color:var(--stzh-color-grey70);--hover-background-color:var(--stzh-color-grey10);--hover-button-right-color:var(--stzh-color-grey70);--focus-color:var(--stzh-color-grey70);--focus-border-color:var(--stzh-color-grey70);--focus-background-color:var(--stzh-color-grey10);--focus-button-right-color:var(--stzh-color-grey70)}.sc-stzh-input-h:is(:has(.stzh-input__input:hover)){--button-right-color:var(--hover-button-right-color)}.sc-stzh-input-h:is(:has(.stzh-input__input:focus)){--button-right-color:var(--focus-button-right-color)}.sc-stzh-input-h.sc-stzh-input-s>[slot=button-right],.sc-stzh-input-h .sc-stzh-input-s>[slot=button-right],.stzh-input__button-right.sc-stzh-input{position:absolute;top:0px;right:0px}.sc-stzh-input-h.sc-stzh-input-s>stzh-popover[slot=button-right],.sc-stzh-input-h .sc-stzh-input-s>stzh-popover[slot=button-right],.sc-stzh-input-h.sc-stzh-input-s>[slot=button-right],.sc-stzh-input-h.sc-stzh-input-s>[slot=button-right] stzh-popover,.sc-stzh-input-h .sc-stzh-input-s>[slot=button-right] stzh-popover{display:block}.sc-stzh-input-h.sc-stzh-input-s>stzh-button[slot=button-right],.sc-stzh-input-h .sc-stzh-input-s>stzh-button[slot=button-right],.sc-stzh-input-h.sc-stzh-input-s>stzh-button[slot=button-right][disabled]:not([disabled=false]),.sc-stzh-input-h .sc-stzh-input-s>stzh-button[slot=button-right][disabled]:not([disabled=false]),.sc-stzh-input-h.sc-stzh-input-s>stzh-popover[slot=button-right],.sc-stzh-input-h.sc-stzh-input-s>stzh-popover[slot=button-right] .stzh-popover__trigger stzh-button,.sc-stzh-input-h .sc-stzh-input-s>stzh-popover[slot=button-right] .stzh-popover__trigger stzh-button,.sc-stzh-input-h.sc-stzh-input-s>stzh-popover[slot=button-right] .stzh-popover__trigger stzh-button[disabled]:not([disabled=false]),.sc-stzh-input-h .sc-stzh-input-s>stzh-popover[slot=button-right] .stzh-popover__trigger stzh-button[disabled]:not([disabled=false]),.sc-stzh-input-h.sc-stzh-input-s>stzh-tooltip[slot=button-right] .stzh-tooltip__trigger stzh-button,.sc-stzh-input-h .sc-stzh-input-s>stzh-tooltip[slot=button-right] .stzh-tooltip__trigger stzh-button,.sc-stzh-input-h.sc-stzh-input-s>stzh-tooltip[slot=button-right] .stzh-tooltip__trigger stzh-button[disabled]:not([disabled=false]),.sc-stzh-input-h .sc-stzh-input-s>stzh-tooltip[slot=button-right] .stzh-tooltip__trigger stzh-button[disabled]:not([disabled=false]),.stzh-input__button-right.sc-stzh-input,.stzh-input__button-right[disabled].sc-stzh-input:not([disabled=false]){--color:var(--button-right-color);--background-color:transparent;--border-color:transparent;--hover-color:var(--button-right-color);--hover-background-color:transparent;--hover-border-color:transparent}.sc-stzh-input-h.sc-stzh-input-s>stzh-button[slot=button-right],.sc-stzh-input-h.sc-stzh-input-s>stzh-button[slot=button-right][size=default][icon-only]:not([icon-only=false]),.sc-stzh-input-h .sc-stzh-input-s>stzh-button[slot=button-right][size=default][icon-only]:not([icon-only=false]),.sc-stzh-input-h.sc-stzh-input-s>stzh-popover[slot=button-right],.sc-stzh-input-h.sc-stzh-input-s>stzh-popover[slot=button-right] .stzh-popover__trigger stzh-button,.sc-stzh-input-h.sc-stzh-input-s>stzh-popover[slot=button-right] .stzh-popover__trigger stzh-button[icon-only][size=default]:not([icon-only=false]),.sc-stzh-input-h .sc-stzh-input-s>stzh-popover[slot=button-right] .stzh-popover__trigger stzh-button[icon-only][size=default]:not([icon-only=false]),.sc-stzh-input-h.sc-stzh-input-s>stzh-tooltip[slot=button-right] .stzh-tooltip__trigger stzh-button,.sc-stzh-input-h.sc-stzh-input-s>stzh-tooltip[slot=button-right] .stzh-tooltip__trigger stzh-button[icon-only][size=default]:not([icon-only=false]),.sc-stzh-input-h .sc-stzh-input-s>stzh-tooltip[slot=button-right] .stzh-tooltip__trigger stzh-button[icon-only][size=default]:not([icon-only=false]),.stzh-input__button-right[size=default][icon-only].sc-stzh-input:not([icon-only=false]){--icon-size:var(--stzh-icon-size-medium)}.stzh-input__marker-symbol.sc-stzh-input{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium)}.stzh-input__marker-text.sc-stzh-input{border:0;clip:rect(0 0 0 0);clip-path:inset(100%);width:0.0625rem;height:0.0625rem;overflow:hidden;padding:0;position:absolute}.stzh-input__description-wrapper.sc-stzh-input{display:flex;flex-direction:column-reverse;min-height:var(--description-min-height, var(--stzh-description-min-height, none))}.stzh-input__error.sc-stzh-input,.stzh-input__description.sc-stzh-input{font-size:var(--stzh-font-nano-font-size);line-height:var(--stzh-font-nano-text-line-height)}.stzh-input__error.sc-stzh-input{color:var(--stzh-color-error60)}.stzh-input__error-list.sc-stzh-input{list-style:none;margin:0;padding:0}.stzh-input__description.sc-stzh-input{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-input__description-long.sc-stzh-input{margin-right:var(--stzh-space-xxsmall);margin-top:0.125rem}@supports (font: -apple-system-body) and (-webkit-appearance: none){.stzh-input__description-long.sc-stzh-input{margin-top:0}}.stzh-input__description-long-popover.sc-stzh-input{--width:auto;--max-width:27.3125rem}.stzh-input__description-long-button.sc-stzh-input{display:flex;justify-content:center;align-items:center;appearance:none;font-family:inherit;padding:0;border:none;background-color:transparent;border-radius:0.5rem;cursor:pointer}.stzh-input.sc-stzh-input stzh-icon.stzh-input__description-long-icon.sc-stzh-input{--size:var(--stzh-icon-size-xsmall)}.stzh-input--has-error.sc-stzh-input .stzh-input__error.sc-stzh-input,.stzh-input--has-description.sc-stzh-input .stzh-input__description.sc-stzh-input{margin-top:var(--stzh-space-xxxsmall)}.stzh-input.sc-stzh-input .sc-stzh-input::selection{background:var(--text-selection-background-color)}.stzh-input__field-wrapper.sc-stzh-input{position:relative;display:flex;width:var(--input-width)}.stzh-input__input.sc-stzh-input{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-milli-font-size);line-height:var(--stzh-font-milli-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing);border:0.125rem solid var(--border-color);transition-property:color, border-color, background-color;transition-duration:var(--stzh-base-transition-animation-speed);border-radius:var(--border-radius);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);padding-left:var(--padding-left);padding-right:var(--padding-right);margin:0;width:100%;color:var(--color);background-color:var(--background-color);appearance:none;text-align:var(--text-align)}.stzh-input__input.sc-stzh-input::-webkit-input-placeholder{color:var(--placeholder-color)}.stzh-input__input.sc-stzh-input:-moz-placeholder{color:var(--placeholder-color)}.stzh-input__input.sc-stzh-input::-moz-placeholder{color:var(--placeholder-color)}.stzh-input__input.sc-stzh-input:-ms-input-placeholder{color:var(--placeholder-color)}.stzh-input__input.sc-stzh-input:hover{color:var(--hover-color);border-color:var(--hover-border-color);background-color:var(--hover-background-color)}.stzh-input__input.sc-stzh-input:focus{color:var(--focus-color);border-color:var(--focus-border-color);background-color:var(--focus-background-color)}.stzh-input__input.sc-stzh-input:-webkit-autofill{background-clip:text}.stzh-input__input.sc-stzh-input:placeholder-shown{text-overflow:ellipsis}.stzh-input__input[type=search].sc-stzh-input::-webkit-search-decoration,.stzh-input__input[type=search].sc-stzh-input::-webkit-search-cancel-button,.stzh-input__input[type=search].sc-stzh-input::-webkit-search-results-button,.stzh-input__input[type=search].sc-stzh-input::-webkit-search-results-decoration{-webkit-appearance:none}.stzh-input__input--input.sc-stzh-input{height:var(--height)}.stzh-input__input--textarea.sc-stzh-input{min-height:var(--height);resize:vertical}.stzh-input__label.sc-stzh-input{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);text-overflow:ellipsis;white-space:nowrap;overflow:hidden;display:block;color:var(--label-color);width:auto;max-width:100%;margin-bottom:var(--stzh-space-xxxsmall)}.stzh-input__label.no-label-truncate.sc-stzh-input{text-overflow:clip;white-space:normal;overflow:visible}.stzh-input__label.sc-stzh-input:empty{display:none}.stzh-input__marker.sc-stzh-input{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-input--type-password.stzh-input--is-not-filled.sc-stzh-input .stzh-input__button-right.sc-stzh-input,.stzh-input--type-password.stzh-input--is-readonly.sc-stzh-input .stzh-input__button-right.sc-stzh-input,.stzh-input--type-password.stzh-input--is-disabled.sc-stzh-input .stzh-input__button-right.sc-stzh-input,.stzh-input--type-search.stzh-input--is-not-clearable.sc-stzh-input .stzh-input__button-right.sc-stzh-input,.stzh-input--type-search.stzh-input--is-not-filled.sc-stzh-input .stzh-input__button-right.sc-stzh-input,.stzh-input--type-search.stzh-input--is-readonly.sc-stzh-input .stzh-input__button-right.sc-stzh-input,.stzh-input--type-search.stzh-input--is-disabled.sc-stzh-input .stzh-input__button-right.sc-stzh-input{pointer-events:none}.stzh-input--has-button-right.sc-stzh-input .stzh-input__input.sc-stzh-input{padding-right:var(--height)}.stzh-input--size-small.sc-stzh-input .stzh-input__input.sc-stzh-input{font-size:var(--stzh-font-micro-font-size);line-height:var(--stzh-font-micro-text-line-height)}.stzh-input.sc-stzh-input:not(.stzh-input--has-spin) .stzh-input__input.sc-stzh-input::-webkit-outer-spin-button,.stzh-input.sc-stzh-input:not(.stzh-input--has-spin) .stzh-input__input.sc-stzh-input::-webkit-inner-spin-button{appearance:none;margin:0}.stzh-input.sc-stzh-input:not(.stzh-input--has-spin) .stzh-input__input[type=number].sc-stzh-input{appearance:textfield}.stzh-input--has-label-hidden.sc-stzh-input .stzh-input__label.sc-stzh-input{border:0;clip:rect(0 0 0 0);clip-path:inset(100%);width:0.0625rem;height:0.0625rem;overflow:hidden;padding:0;position:absolute}.stzh-input--is-readonly.sc-stzh-input .stzh-input__input.sc-stzh-input,.stzh-input--is-disabled.sc-stzh-input .stzh-input__input.sc-stzh-input,.stzh-input--is-readonly.sc-stzh-input .stzh-input__label.sc-stzh-input,.stzh-input--is-disabled.sc-stzh-input .stzh-input__label.sc-stzh-input{cursor:not-allowed}";const a=e;let c=0;const l=class{constructor(i){t(this,i);this.stzhChange=s(this,"stzhChange",7);this.stzhChanged=s(this,"stzhChanged",7);this.stzhFocus=s(this,"stzhFocus",7);this.stzhBlur=s(this,"stzhBlur",7);this.focusedByInput=false;this.onClearClick=async t=>{this.value="";this.input.focus();await this.waitForNextRender();this.stzhChange.emit({component:"stzh-input",originalEvent:t,value:this.value});this.stzhChanged.emit({component:"stzh-input",originalEvent:t,value:this.value})};this.onTogglePasswordVisibilityClick=async()=>{this.showPassword=!this.showPassword};this.handleReset=async()=>{this.value=this.defaultValue;this.input.value=this.defaultValue};this.onInput=t=>{this.value=this.input.value;this.stzhChange.emit({component:"stzh-input",originalEvent:t,value:this.value})};this.onChange=t=>{this.value=this.input.value;this.stzhChanged.emit({component:"stzh-input",originalEvent:t,value:this.value})};this.onRootFocus=()=>{if(!this.focusedByInput){this.input.focus()}this.focusedByInput=false};this.onFocus=t=>{this.focusedByInput=true;const s=new FocusEvent("focus",{view:window,bubbles:false,cancelable:false});this.element.dispatchEvent(s);this.stzhFocus.emit({component:"stzh-input",originalEvent:t})};this.onBlur=t=>{this.input.value=this.input.value;const s=new FocusEvent("blur",{view:window,bubbles:false,cancelable:false});this.element.dispatchEvent(s);this.stzhBlur.emit({component:"stzh-input",originalEvent:t})};this.localization=undefined;this.multiline=false;this.rows=undefined;this.type="text";this.step=1;this.min=undefined;this.max=undefined;this.showSpin=false;this.readonly=false;this.disabled=false;this.clearable=false;this.hideOptional=false;this.minlength=undefined;this.maxlength=undefined;this.name=undefined;this.value="";this.defaultValue="";this.description=undefined;this.descriptionLong=undefined;this.descriptionLongTitle=undefined;this.error=undefined;this.invalid=false;this.required=false;this.inputmode=undefined;this.autocomplete="on";this.noAutocomplete=false;this.label="";this.noLabelTruncate=false;this.labelHidden=false;this.size="default";this.a11yDescribedby="";this.filled=undefined;this.showPassword=undefined}resetListener(t){if(t.target.contains(this.element)){requestAnimationFrame((()=>{this.handleReset()}))}}valueWatcher(t){this.filled=t!==""}errorWatcher(t){if(typeof t==="string"){try{this._error=JSON.parse(t)}catch(s){if(t){this._error=[t]}else{this._error=[]}}}else if(t){this._error=t}else{this._error=[]}}typeWatcher(t){const s=["text","search","password","email","url","tel","number","hidden"];if(!this.multiline&&!s.includes(t)){throw new Error(`Type ${t} not supported`)}}waitForNextRender(){return new Promise((t=>this.renderPromiseResolve=t))}renderTextarea(){return i("textarea",{class:"stzh-input__input stzh-input__input--textarea",ref:t=>this.input=t,id:this.inputId,name:this.name,value:this.value,rows:this.rows,disabled:this.disabled,readonly:this.readonly,minlength:this.minlength,maxlength:this.maxlength,"aria-describedby":`${this.inputId}-description ${this.a11yDescribedby}`,"aria-required":this.required?"true":"false","aria-invalid":this.invalid?"true":"false",onChange:this.onChange,onInput:this.onInput,onFocus:this.onFocus,onBlur:this.onBlur})}renderInput(){return i("input",{class:"stzh-input__input stzh-input__input--input",ref:t=>this.input=t,id:this.inputId,type:this.showPassword?"text":this.type,name:this.name,value:this.value,defaultValue:this.defaultValue,min:this.min,max:this.max,step:this.step,inputmode:this.inputmode,disabled:this.disabled,readonly:this.readonly,minlength:this.minlength,maxlength:this.maxlength,autocomplete:this.noAutocomplete?"off":this.autocomplete,"aria-autocomplete":this.noAutocomplete?"none":undefined,"aria-describedby":`${this.inputId}-description ${this.a11yDescribedby}`,"aria-required":this.required?"true":"false","aria-invalid":this.invalid?"true":"false",onChange:this.onChange,onInput:this.onInput,onFocus:this.onFocus,onBlur:this.onBlur})}componentDidRender(){if(this.renderPromiseResolve){this.renderPromiseResolve()}}async componentWillLoad(){this.inputId=`stzh-input-${c++}`;this.typeWatcher(this.type);this.valueWatcher(this.value);this.errorWatcher(this.error);this.defaultValue=this.defaultValue||this.value;if(!this.localization){this.localization=await window.stzhComponents.utils.fetchTranslations(this.element,"input")}}render(){var t;const s=n(this.element,"button-right");const h=n(this.element,"description")||!!this.description;const e=n(this.element,"description-long")||!!this.descriptionLong;const a=n(this.element,"error")||((t=this._error)===null||t===void 0?void 0:t.length)>0;const c={"stzh-input":true,"stzh-input--has-button-right":s||this.type==="search"||this.clearable&&this.filled&&!this.readonly&&!this.disabled,"stzh-input--has-description":h,"stzh-input--has-description-long":e,"stzh-input--has-error":a,"stzh-input--has-spin":this.showSpin,"stzh-input--is-invalid":this.invalid||a,"stzh-input--is-disabled":this.disabled,"stzh-input--is-readonly":this.readonly,"stzh-input--is-required":this.required,"stzh-input--is-filled":this.filled,"stzh-input--is-not-filled":!this.filled,"stzh-input--is-clearable":this.clearable,"stzh-input--is-not-clearable":!this.clearable,"stzh-input--has-label-hidden":this.labelHidden,[`stzh-input--size-${this.size}`]:!!this.size,[`stzh-input--type-${this.type}`]:!!this.type};return i(o,{key:"c8ff5c6cf276eb2d2d72c5c2bc294a9a77c0ec31","is-invalid":this.invalid||a,tabindex:this.disabled?null:"-1",onFocus:this.onRootFocus,"is-filled":this.filled},i("div",{key:"df948658df21c668ac305a01cdc55b8162a19aec",class:c},i("label",{key:"9de88ea9e9bf363595a393f80c642c95bb083b18",class:{"stzh-input__label":true,"no-label-truncate":this.noLabelTruncate},htmlFor:this.inputId},this.label?this.label:i("slot",null),!this.hideOptional&&i("span",{key:"8a5b00a3a40572563c50e8151244ebaae7b69c4c",class:"stzh-input__marker"},i("span",{key:"47a7f9eaa1aeb7e3ca6e0998d4e2f87e6c5adc00",class:"stzh-input__marker-symbol","aria-hidden":"true"},this.required?this.localization.$globals.requiredFieldMarker:this.localization.$globals.optionalFieldMarker),i("span",{key:"4840d3301f83bfe247e7d4efb33aa5296c642e3d",class:"stzh-input__marker-text"},this.required?this.localization.$globals.requiredFieldText:this.localization.$globals.optionalFieldText))),i("div",{key:"61add2f342230323672b9b4d47e851f4e2ed41c3",class:"stzh-input__field-wrapper"},this.multiline?this.renderTextarea():this.renderInput(),this.clearable||this.type==="search"||this.type==="password"?(!this.clearable||this.disabled||this.readonly||!this.filled)&&(this.type==="search"||this.type==="password")?i("stzh-button",{class:"stzh-input__button-right",icon:this.type==="search"?"search":"view",size:this.size,iconOnly:true,onClick:this.onTogglePasswordVisibilityClick,disabled:this.disabled||this.readonly}):this.filled?i("stzh-button",{class:"stzh-input__button-right",icon:"close",size:this.size,iconOnly:true,onClick:this.onClearClick,a11yLabel:this.localization.$globals.clearButtonLabel,"aria-controls":this.inputId}):i("slot",{name:"button-right"}):i("slot",{name:"button-right"})),(a||this.description)&&i(r,{key:"94fa5b40af158681ef33b435dec70eb6e667fe99",classPrefix:"stzh-input",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 h(this)}static get watchers(){return{value:["valueWatcher"],error:["errorWatcher"],type:["typeWatcher"]}}};l.style=a;export{l as stzh_input};
+//# sourceMappingURL=p-12146af8.entry.js.map

package/dist/stzh-components/p-15dc154c.entry.js

@@ -0,0 +1,2 @@
+import{r as t,h as e,a as r,g as s}from"./p-ef5985a3.js";import{m as i,a}from"./p-f4adb3cd.js";import{h}from"./p-87c329f2.js";import"./p-dae15605.js";const n='.sc-stzh-pi-teaser-layout-h{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);color:var(--stzh-base-color);box-sizing:border-box;display:block}[hidden].sc-stzh-pi-teaser-layout-h,[stzh-hidden].sc-stzh-pi-teaser-layout-h{display:none}.sc-stzh-pi-teaser-layout-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-pi-teaser-layout-h *.sc-stzh-pi-teaser-layout,.sc-stzh-pi-teaser-layout-h *.sc-stzh-pi-teaser-layout::before,.sc-stzh-pi-teaser-layout-h *.sc-stzh-pi-teaser-layout::after{box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness);-webkit-text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink);text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink)}.sc-stzh-pi-teaser-layout-h .has-focus.sc-stzh-pi-teaser-layout{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-pi-teaser-layout-h .stzh-fylingfocus-focused.sc-stzh-pi-teaser-layout{outline-style:none !important}.sc-stzh-pi-teaser-layout-h .stzh-fylingfocus-focused.sc-stzh-pi-teaser-layout::-moz-focus-inner{border:0 !important}.sc-stzh-pi-teaser-layout-h{--grid-pi-teaser-layout-columns:repeat(12, 1fr);--min-height:112.5rem;--max-height:118.75rem;--gap:1rem;--grid-pi-teaser-layout-template:"t1 t1 t1 t1 t1 t1 t1 t1 t1 t1 t1 t1"\n    "t2 t2 t2 t2 t2 t2 t2 t2 t2 t2 t2 t2" "t3 t3 t3 t3 t3 t3 t3 t3 t3 t3 t3 t3"\n    "t4 t4 t4 t4 t4 t4 t4 t4 t4 t4 t4 t4" "t5 t5 t5 t5 t5 t5 t5 t5 t5 t5 t5 t5"\n    "t6 t6 t6 t6 t6 t6 t6 t6 t6 t6 t6 t6";--grid-pi-teaser-layout-rows:0.9fr 0.9fr 0.25fr 0.25fr 0.25fr 0.25fr}@media screen and (min-width: 600px){.sc-stzh-pi-teaser-layout-h{--gap:1.25rem;--min-height:118.75rem;--max-height:118.75rem;--grid-pi-teaser-layout-rows:0.9fr 0.9fr 0.25fr 0.25fr 0.25fr 0.25fr}}@media screen and (min-width: 900px){.sc-stzh-pi-teaser-layout-h{--gap:1.25rem;--min-height:96.875rem;--max-height:103.125rem;--grid-pi-teaser-layout-template:"t1 t1 t1 t1 t1 t1 t2 t2 t2 t2 t2 t2"\n      "t3 t3 t3 t3 t3 t3 t4 t4 t4 t4 t4 t4"\n      "t5 t5 t5 t5 t5 t5 t5 t5 t5 t5 t5 t5"\n      "t6 t6 t6 t6 t6 t6 t6 t6 t6 t6 t6 t6";--grid-pi-teaser-layout-rows:0.6fr 0.4fr 0.25fr 0.25fr}[has-side=true].sc-stzh-pi-teaser-layout-h{--min-height:146.875rem;--max-height:146.875rem;--grid-pi-teaser-layout-template:"t1 t1 t1 t1 t1 t1 t1 t1 t1 t1 t1 t1"\n      "t2 t2 t2 t2 t2 t2 t2 t2 t2 t2 t2 t2"\n      "t3 t3 t3 t3 t3 t3 t3 t3 t3 t3 t3 t3"\n      "t4 t4 t4 t4 t4 t4 t4 t4 t4 t4 t4 t4"\n      "t5 t5 t5 t5 t5 t5 t5 t5 t5 t5 t5 t5"\n      "t6 t6 t6 t6 t6 t6 t6 t6 t6 t6 t6 t6";--grid-pi-teaser-layout-rows:0.85fr 0.85fr 0.4fr 0.4fr 0.36fr 0.36fr}}@media screen and (min-width: 1260px){.sc-stzh-pi-teaser-layout-h{--gap:1.5rem;--min-height:84.375rem;--max-height:84.375rem;--grid-pi-teaser-layout-template:"t1 t1 t1 t1 t1 t1 t2 t2 t2 t2 t2 t2"\n      "t3 t3 t3 t3 t4 t4 t4 t4 t5 t5 t5 t5"\n      "t3 t3 t3 t3 t4 t4 t4 t4 t6 t6 t6 t6";--grid-pi-teaser-layout-rows:0.7fr 0.3fr 0.3fr}[has-side=true].sc-stzh-pi-teaser-layout-h{--min-height:84.375rem;--max-height:84.375rem;--grid-pi-teaser-layout-template:"t1 t1 t1 t1 t1 t1 t2 t2 t2 t2 t2 t2"\n      "t3 t3 t3 t3 t4 t4 t4 t4 t5 t5 t5 t5"\n      "t3 t3 t3 t3 t4 t4 t4 t4 t6 t6 t6 t6";--grid-pi-teaser-layout-rows:0.7fr 0.3fr 0.3fr}}@media screen and (min-width: 1600px){.sc-stzh-pi-teaser-layout-h{--gap:2rem;--min-height:84.375rem;--max-height:84.375rem;--grid-pi-teaser-layout-rows:0.7fr 0.3fr 0.3fr}[has-side=true].sc-stzh-pi-teaser-layout-h{--min-height:84.375rem;--max-height:84.375rem;--grid-pi-teaser-layout-rows:0.7fr 0.3fr 0.3fr}}.sc-stzh-pi-teaser-layout-h .stzh-pi-teaser-layout-teaser.sc-stzh-pi-teaser-layout{background-color:white}.sc-stzh-pi-teaser-layout-h .stzh-pi-teaser-layout-teaser--1.sc-stzh-pi-teaser-layout{grid-area:t1}.sc-stzh-pi-teaser-layout-h .stzh-pi-teaser-layout-teaser--2.sc-stzh-pi-teaser-layout{grid-area:t2}.sc-stzh-pi-teaser-layout-h .stzh-pi-teaser-layout-teaser--3.sc-stzh-pi-teaser-layout{grid-area:t3}.sc-stzh-pi-teaser-layout-h .stzh-pi-teaser-layout-teaser--4.sc-stzh-pi-teaser-layout{grid-area:t4}.sc-stzh-pi-teaser-layout-h .stzh-pi-teaser-layout-teaser--5.sc-stzh-pi-teaser-layout{grid-area:t5}.sc-stzh-pi-teaser-layout-h .stzh-pi-teaser-layout-teaser--6.sc-stzh-pi-teaser-layout{grid-area:t6}[is-rubrick=true][amount=one].sc-stzh-pi-teaser-layout-h{--grid-pi-teaser-layout-template:"t1 t1 t1 t1 t1 t1 t1 t1 t1 t1 t1 t1";--grid-pi-teaser-layout-rows:1fr;--min-height:32.8125rem;--max-height:37.5rem}[is-rubrick=true][amount=two].sc-stzh-pi-teaser-layout-h{--grid-pi-teaser-layout-template:"t1 t1 t1 t1 t1 t1 t1 t1 t1 t1 t1 t1"\n    "t2 t2 t2 t2 t2 t2 t2 t2 t2 t2 t2 t2";--grid-pi-teaser-layout-rows:1fr 1fr;--min-height:65.625rem;--max-height:75rem}[is-rubrick=true][amount=three].sc-stzh-pi-teaser-layout-h{--grid-pi-teaser-layout-template:"t1 t1 t1 t1 t1 t1 t1 t1 t1 t1 t1 t1"\n    "t2 t2 t2 t2 t2 t2 t2 t2 t2 t2 t2 t2"\n    "t3 t3 t3 t3 t3 t3 t3 t3 t3 t3 t3 t3";--grid-pi-teaser-layout-rows:1.1fr 1.1fr 0.3fr;--min-height:75rem;--max-height:87.5rem}[is-rubrick=true][amount=four].sc-stzh-pi-teaser-layout-h{--grid-pi-teaser-layout-template:"t1 t1 t1 t1 t1 t1 t1 t1 t1 t1 t1 t1"\n    "t2 t2 t2 t2 t2 t2 t2 t2 t2 t2 t2 t2"\n    "t3 t3 t3 t3 t3 t3 t3 t3 t3 t3 t3 t3"\n    "t4 t4 t4 t4 t4 t4 t4 t4 t4 t4 t4 t4";--grid-pi-teaser-layout-rows:1fr 1fr 0.3fr 0.3fr;--min-height:87.5rem;--max-height:103.125rem}[is-rubrick=true][amount=five].sc-stzh-pi-teaser-layout-h{--grid-pi-teaser-layout-template:"t1 t1 t1 t1 t1 t1 t1 t1 t1 t1 t1 t1"\n    "t2 t2 t2 t2 t2 t2 t2 t2 t2 t2 t2 t2"\n    "t3 t3 t3 t3 t3 t3 t3 t3 t3 t3 t3 t3"\n    "t4 t4 t4 t4 t4 t4 t4 t4 t4 t4 t4 t4"\n    "t5 t5 t5 t5 t5 t5 t5 t5 t5 t5 t5 t5";--grid-pi-teaser-layout-rows:1fr 1fr 0.3fr 0.3fr 0.3fr;--min-height:100rem;--max-height:118.75rem}[is-rubrick=true][amount=six].sc-stzh-pi-teaser-layout-h{--grid-pi-teaser-layout-template:"t1 t1 t1 t1 t1 t1 t1 t1 t1 t1 t1 t1"\n    "t2 t2 t2 t2 t2 t2 t2 t2 t2 t2 t2 t2"\n    "t3 t3 t3 t3 t3 t3 t3 t3 t3 t3 t3 t3"\n    "t4 t4 t4 t4 t4 t4 t4 t4 t4 t4 t4 t4"\n    "t5 t5 t5 t5 t5 t5 t5 t5 t5 t5 t5 t5"\n    "t6 t6 t6 t6 t6 t6 t6 t6 t6 t6 t6 t6";--grid-pi-teaser-layout-rows:1fr 1fr 0.3fr 0.3fr 0.3fr 0.3fr;--min-height:112.5rem;--max-height:143.75rem}@media screen and (min-width: 600px){[is-rubrick=true][amount=three].sc-stzh-pi-teaser-layout-h{--grid-pi-teaser-layout-rows:0.95fr 0.95fr 0.26fr;--min-height:81.25rem;--max-height:87.5rem}[is-rubrick=true][amount=four].sc-stzh-pi-teaser-layout-h{--grid-pi-teaser-layout-rows:0.95fr 0.95fr 0.26fr 0.26fr;--min-height:93.75rem;--max-height:106.25rem}[is-rubrick=true][amount=five].sc-stzh-pi-teaser-layout-h{--grid-pi-teaser-layout-rows:0.95fr 0.95fr 0.26fr 0.26fr 0.26fr;--min-height:103.125rem;--max-height:118.75rem}[is-rubrick=true][amount=six].sc-stzh-pi-teaser-layout-h{--grid-pi-teaser-layout-rows:0.95fr 0.95fr 0.26fr 0.26fr 0.26fr 0.26fr;--min-height:112.5rem;--max-height:131.25rem}}@media screen and (min-width: 900px){[is-rubrick=true][amount=one].sc-stzh-pi-teaser-layout-h,[is-rubrick=true][amount=two].sc-stzh-pi-teaser-layout-h{--grid-pi-teaser-layout-template:"t1 t1 t1 t1 t1 t1 t2 t2 t2 t2 t2 t2";--grid-pi-teaser-layout-rows:1fr;--min-height:37.5rem;--max-height:40.625rem}[is-rubrick=true][amount=three].sc-stzh-pi-teaser-layout-h{--grid-pi-teaser-layout-template:"t1 t1 t1 t1 t1 t1 t2 t2 t2 t2 t2 t2"\n      "t3 t3 t3 t3 t3 t3 t4 t4 t4 t4 t4 t4";--grid-pi-teaser-layout-rows:1fr 1fr;--min-height:75rem;--max-height:78.125rem}[is-rubrick=true][amount=three][has-side=true].sc-stzh-pi-teaser-layout-h{--grid-pi-teaser-layout-rows:1fr 1fr;--min-height:71.875rem;--max-height:75rem}[is-rubrick=true][amount=four].sc-stzh-pi-teaser-layout-h{--grid-pi-teaser-layout-template:"t1 t1 t1 t1 t1 t1 t2 t2 t2 t2 t2 t2"\n      "t3 t3 t3 t3 t3 t3 t4 t4 t4 t4 t4 t4";--grid-pi-teaser-layout-rows:1fr 1fr;--min-height:75rem;--max-height:78.125rem}[is-rubrick=true][amount=four][has-side=true].sc-stzh-pi-teaser-layout-h{--grid-pi-teaser-layout-rows:1fr 1fr;--min-height:71.875rem;--max-height:75rem}[is-rubrick=true][amount=five].sc-stzh-pi-teaser-layout-h{--grid-pi-teaser-layout-template:"t1 t1 t1 t1 t1 t1 t2 t2 t2 t2 t2 t2"\n      "t3 t3 t3 t3 t3 t3 t4 t4 t4 t4 t4 t4"\n      "t5 t5 t5 t5 t5 t5 t5 t5 t5 t5 t5 t5";--grid-pi-teaser-layout-rows:1fr 1fr 0.35fr;--min-height:87.5rem;--max-height:93.75rem}[is-rubrick=true][amount=five][has-side=true].sc-stzh-pi-teaser-layout-h{--grid-pi-teaser-layout-rows:1.1fr 1.1fr 0.35fr;--min-height:84.375rem;--max-height:87.5rem}[is-rubrick=true][amount=six].sc-stzh-pi-teaser-layout-h{--grid-pi-teaser-layout-template:"t1 t1 t1 t1 t1 t1 t2 t2 t2 t2 t2 t2"\n      "t3 t3 t3 t3 t3 t3 t4 t4 t4 t4 t4 t4"\n      "t5 t5 t5 t5 t5 t5 t5 t5 t5 t5 t5 t5"\n      "t6 t6 t6 t6 t6 t6 t6 t6 t6 t6 t6 t6";--grid-pi-teaser-layout-rows:1fr 1fr 0.35fr 0.35fr;--min-height:103.125rem;--max-height:106.25rem}[is-rubrick=true][amount=six][has-side=true].sc-stzh-pi-teaser-layout-h{--grid-pi-teaser-layout-rows:1.2fr 1.2fr 0.4fr 0.4fr;--min-height:112.5rem;--max-height:112.5rem}}@media screen and (min-width: 1260px){[is-rubrick=true][amount=three][has-side=true].sc-stzh-pi-teaser-layout-h{--grid-pi-teaser-layout-template:"t1 t1 t1 t1 t1 t1 t2 t2 t2 t2 t2 t2"\n      "t3 t3 t3 t3 t3 t3 t4 t4 t4 t4 t4 t4";--grid-pi-teaser-layout-rows:1fr 1fr;--min-height:81.25rem;--max-height:81.25rem}[is-rubrick=true][amount=four].sc-stzh-pi-teaser-layout-h{--grid-pi-teaser-layout-template:"t1 t1 t1 t2 t2 t2 t3 t3 t3 t4 t4 t4"\n      "t1 t1 t1 t2 t2 t2 t3 t3 t3 t4 t4 t4";--grid-pi-teaser-layout-rows:1fr 1fr;--min-height:35rem;--max-height:43.75rem}[is-rubrick=true][amount=four][has-side=true].sc-stzh-pi-teaser-layout-h{--grid-pi-teaser-layout-template:"t1 t1 t1 t1 t1 t1 t2 t2 t2 t2 t2 t2"\n      "t3 t3 t3 t3 t3 t3 t4 t4 t4 t4 t4 t4"\n      "t3 t3 t3 t3 t3 t3 t4 t4 t4 t4 t4 t4";--grid-pi-teaser-layout-rows:1fr 0.5fr 0.5fr;--min-height:75rem;--max-height:81.25rem}[is-rubrick=true][amount=five].sc-stzh-pi-teaser-layout-h{--grid-pi-teaser-layout-template:"t1 t1 t1 t2 t2 t2 t3 t3 t3 t4 t4 t4"\n      "t1 t1 t1 t2 t2 t2 t3 t3 t3 t5 t5 t5";--grid-pi-teaser-layout-rows:1fr 1fr;--min-height:35rem;--max-height:43.75rem}[is-rubrick=true][amount=five][has-side=true].sc-stzh-pi-teaser-layout-h{--grid-pi-teaser-layout-template:"t1 t1 t1 t1 t1 t1 t2 t2 t2 t2 t2 t2"\n      "t3 t3 t3 t3 t3 t3 t4 t4 t4 t4 t4 t4"\n      "t3 t3 t3 t3 t3 t3 t5 t5 t5 t5 t5 t5";--grid-pi-teaser-layout-rows:1fr 0.45fr 0.45fr;--min-height:75rem;--max-height:81.25rem}[is-rubrick=true][amount=six].sc-stzh-pi-teaser-layout-h{--grid-pi-teaser-layout-template:"t1 t1 t1 t2 t2 t2 t3 t3 t3 t5 t5 t5"\n      "t1 t1 t1 t2 t2 t2 t4 t4 t4 t6 t6 t6";--grid-pi-teaser-layout-rows:1fr 1fr;--min-height:35rem;--max-height:43.75rem}[is-rubrick=true][amount=six][has-side=true].sc-stzh-pi-teaser-layout-h{--grid-pi-teaser-layout-template:"t1 t1 t1 t1 t1 t1 t2 t2 t2 t2 t2 t2"\n      "t3 t3 t3 t3 t3 t3 t5 t5 t5 t5 t5 t5"\n      "t4 t4 t4 t4 t4 t4 t6 t6 t6 t6 t6 t6";--grid-pi-teaser-layout-rows:1fr 0.4fr 0.4fr;--min-height:75rem;--max-height:78.125rem}}[is-rubrick=true].sc-stzh-pi-teaser-layout-h .stzh-pi-teaser-layout-teaser--5--four.sc-stzh-pi-teaser-layout{display:none}[is-rubrick=true].sc-stzh-pi-teaser-layout-h .stzh-pi-teaser-layout-teaser--6--four.sc-stzh-pi-teaser-layout,[is-rubrick=true].sc-stzh-pi-teaser-layout-h .stzh-pi-teaser-layout-teaser--6--five.sc-stzh-pi-teaser-layout{display:none}.stzh-pi-teaser-layout.sc-stzh-pi-teaser-layout{font-size:var(--stzh-font-curve-p1-default-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-p1-default-text-line-height, var(--stzh-font-milli-text-line-height));letter-spacing:var(--stzh-font-curve-p1-default-text-letter-spacing);width:100%;display:grid;gap:var(--gap);min-height:var(--min-height);max-height:var(--max-height);grid-template-columns:var(--grid-pi-teaser-layout-columns);grid-template-areas:var(--grid-pi-teaser-layout-template);grid-template-rows:var(--grid-pi-teaser-layout-rows)}@media screen and (min-width: 900px){.stzh-pi-teaser-layout.sc-stzh-pi-teaser-layout{font-size:var(--stzh-font-curve-p1-medium-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-p1-medium-text-line-height, var(--stzh-font-centi-text-line-height));letter-spacing:var(--stzh-font-curve-p1-medium-text-letter-spacing)}}.stzh-pi-teaser-layout.sc-stzh-pi-teaser-layout>*.sc-stzh-pi-teaser-layout{min-height:0;overflow:hidden}.stzh-pi-teaser-layout__header-holder.sc-stzh-pi-teaser-layout{margin-bottom:var(--stzh-space-medium)}.stzh-pi-teaser-layout__header.sc-stzh-pi-teaser-layout{font-size:var(--stzh-font-curve-h2-default-font-size, var(--stzh-font-deci-font-size));line-height:var(--stzh-font-curve-h2-default-text-line-height, var(--stzh-font-deci-text-line-height));letter-spacing:var(--stzh-font-curve-h2-default-text-letter-spacing);font-family:var(--stzh-font-family-title);font-weight:var(--stzh-font-weight-title);font-style:var(--stzh-font-style-title);color:var(--stzh-heading-color);margin:0;padding-top:var(--stzh-space-medium);padding-bottom:var(--stzh-space-xxsmall)}@media screen and (min-width: 600px){.stzh-pi-teaser-layout__header.sc-stzh-pi-teaser-layout{font-size:var(--stzh-font-curve-h2-small-font-size, var(--stzh-font-deca-font-size));line-height:var(--stzh-font-curve-h2-small-text-line-height, var(--stzh-font-deca-text-line-height));letter-spacing:var(--stzh-font-curve-h2-small-text-letter-spacing, var(--stzh-font-deca-text-letter-spacing))}}@media screen and (min-width: 900px){.stzh-pi-teaser-layout__header.sc-stzh-pi-teaser-layout{font-size:var(--stzh-font-curve-h2-medium-font-size, var(--stzh-font-hecto-font-size));line-height:var(--stzh-font-curve-h2-medium-text-line-height, var(--stzh-font-hecto-text-line-height));letter-spacing:var(--stzh-font-curve-h2-medium-text-letter-spacing, var(--stzh-font-hecto-text-letter-spacing))}}@media screen and (min-width: 1600px){.stzh-pi-teaser-layout__header.sc-stzh-pi-teaser-layout{font-size:var(--stzh-font-curve-h2-ultra-font-size, var(--stzh-font-kilo-font-size));line-height:var(--stzh-font-curve-h2-ultra-text-line-height, var(--stzh-font-kilo-text-line-height));letter-spacing:var(--stzh-font-curve-h2-ultra-text-letter-spacing, var(--stzh-font-kilo-text-letter-spacing))}}@media screen and (min-width: 600px){.stzh-pi-teaser-layout__header.sc-stzh-pi-teaser-layout{padding-top:var(--stzh-space-large);padding-bottom:var(--stzh-space-xxsmall)}}@media screen and (min-width: 900px){.stzh-pi-teaser-layout__header.sc-stzh-pi-teaser-layout{padding-top:var(--stzh-space-xlarge);padding-bottom:var(--stzh-space-xsmall)}}@media screen and (min-width: 1260px){.stzh-pi-teaser-layout__header.sc-stzh-pi-teaser-layout{padding-top:var(--stzh-space-xxlarge);padding-bottom:var(--stzh-space-small)}}.stzh-pi-teaser-layout__bottom-slot.sc-stzh-pi-teaser-layout{margin-top:var(--stzh-space-medium);display:grid;justify-content:end}';const u=n;var o;(function(t){t["xxxsmall"]="one";t["xxsmall"]="two";t["xsmall"]="three";t["small"]="four";t["medium"]="five";t["large"]="six"})(o||(o={}));const l=t=>{switch(t){case 1:return o.xxxsmall;case 2:return o.xxsmall;case 3:return o.xsmall;case 4:return o.small;case 5:return o.medium;case 6:return o.large;default:return null}};const p=class{constructor(e){t(this,e);this.mediaChangeHandler=()=>{this.isSmall=i("small").matches;this.isMedium=i("medium").matches;this.isLarge=i("large").matches;this.isUltra=i("ultra").matches};this.variant="hero";this.hasSide=false;this.heading="";this.headingLevel="3";this.contentList=[];this.isSmall=undefined;this.isMedium=undefined;this.isLarge=undefined;this.isUltra=undefined}componentDidLoad(){this.mediaChangeHandler();this.contentList=this.contentList.slice(0,6);if(this.variant=="rubrick"&&this.contentList.length<4){if((this.isLarge||this.isUltra)&&!this.hasSide){const t=Math.max(0,4-this.contentList.length);this.contentList=[...this.contentList,...Array(t).fill({type:"empty-teaser"})]}}}connectedCallback(){a(this.mediaChangeHandler)}render(){const t=this.variant=="rubrick";const s=l(this.contentList.length);const i=`h${this.headingLevel}`;const a={"stzh-pi-teaser-layout":true,"stzh-pi-teaser-layout--rubrick":t,"stzh-pi-teaser-layout--has-side":this.hasSide};const n=!!this.heading;const u=h(this.element,"bottom");const p=e=>{const r=this.isUltra||this.isLarge;const i=this.hasSide?"M":"L";if(t){switch(e){case 1:case 2:return r?"L":this.isMedium?i:this.isSmall?"L":"M";case 3:if(s==o.xsmall){return r?"L":this.isMedium?i:this.isSmall?"S":"XS"}if(s==o.small){return r?"L":this.isMedium?i:this.isSmall?"S":"XS"}if(s==o.medium){return r?"L":this.isMedium?i:this.isSmall?"S":"XS"}if(s==o.large){return r?"M":this.isMedium?i:this.isSmall?"S":"XS"}case 4:if(s==o.small){return r?"L":this.isMedium?i:this.isSmall?"S":"XS"}if(s==o.medium){return r?"M":this.isMedium?i:this.isSmall?"S":"XS"}if(s==o.large){return r?"M":this.isMedium?i:this.isSmall?"S":"XS"}case 5:if(s==o.medium){return r?"M":this.isMedium?"M":this.isSmall?"S":"XS"}if(s==o.large){return r?"M":this.isMedium?"M":this.isSmall?"S":"XS"}case 6:if(s==o.large){return r?"M":this.isMedium?"M":this.isSmall?"S":"XS"}}}else{switch(e){case 1:case 2:return r?"XL":this.isMedium?"L":this.isSmall?"L":"M";case 3:case 4:return r?"L":this.isMedium?"M":this.isSmall?"S":"XS";case 5:case 6:return r?"M":this.isMedium?"M":this.isSmall?"S":"XS"}}};const c=(e,r,i)=>{const a=this.isUltra||this.isLarge;const h=i==null||i==undefined;if(t){switch(r){case 1:case 2:return e;case 3:if(h){return a?e:this.isMedium?e:this.isSmall?e:null}if(s==o.large){if(this.hasSide){return this.isUltra?null:this.isLarge?null:this.isMedium?e:null}return this.isUltra?e:this.isLarge?e:this.isMedium?e:null}return a?e:this.isMedium?e:null;case 4:if(h){return a?e:this.isMedium?e:this.isSmall?e:null}if(s==o.medium){if(this.hasSide){return this.isUltra?null:this.isLarge?null:this.isMedium?e:null}return this.isUltra?e:this.isLarge?e:this.isMedium?e:null}if(s==o.large){if(this.hasSide){return this.isUltra?null:this.isLarge?null:this.isMedium?e:null}return this.isUltra?e:this.isLarge?e:this.isMedium?e:null}return a?e:this.isMedium?e:null;case 5:if(h){return a?e:this.isMedium?e:null}if(this.hasSide){return null}return a?e:this.isMedium?null:null;case 6:if(h){return a?e:this.isMedium?e:null}if(this.hasSide){return null}return a?e:this.isMedium?null:null}}else{switch(r){case 1:case 2:return e;case 3:case 4:if(h){return e}if(this.hasSide){return a?e:this.isMedium?e:null}return a?e:this.isMedium?null:null;case 5:case 6:return a?e:this.isMedium?e:null}}return e};const m=(e,r)=>{const i=this.isUltra||this.isLarge;const a=e==null||e==undefined;if(a){return null}if(t){switch(r){case 1:case 2:return"top";case 3:if(s==o.medium){if(this.hasSide){return i?"top":this.isMedium?"top":this.isSmall?null:null}}if(s==o.large){if(this.hasSide){return i?"right":this.isMedium?"top":this.isSmall?null:null}return i?null:this.isMedium?"top":this.isSmall?null:null}return i?"top":this.isMedium?"top":this.isSmall?null:null;case 4:if(s==o.medium){if(this.hasSide){return i?"right":this.isMedium?"top":this.isSmall?null:null}return i?null:this.isMedium?"top":this.isSmall?null:null}if(s==o.large){if(this.hasSide){return i?"right":this.isMedium?"top":this.isSmall?null:null}return i?null:this.isMedium?"top":this.isSmall?null:null}return i?"top":this.isMedium?"top":this.isSmall?null:null;case 5:if(s==o.medium||s==o.large){if(this.hasSide){return i?"right":this.isMedium?"right":null}return i?null:this.isMedium?"right":null}case 6:if(s==o.large){if(this.hasSide){return i?"right":this.isMedium?"right":null}return i?null:this.isMedium?"right":null}}}else{switch(r){case 1:case 2:return"top";case 3:case 4:if(this.hasSide){return i?"top":this.isMedium?"right":this.isSmall?"right":"top"}return i?"top":this.isMedium?"top":this.isSmall?null:null;case 5:case 6:return i?null:this.isMedium?null:this.isSmall?null:null}}};if(!t&&this.contentList.length<6){return e("div",null,"At least add 6 elements for hero")}const f=t=>({"stzh-pi-teaser-layout-teaser":true,[`stzh-pi-teaser-layout-teaser--${t+1}`]:true,[`stzh-pi-teaser-layout-teaser--${t+1}--${this.hasSide?"side":"no-side"}`]:true,[`stzh-pi-teaser-layout-teaser--${t+1}--${s}`]:true,[`stzh-pi-teaser-layout-teaser--${t+1}--${s}--${this.hasSide?"side":"no-side"}`]:true});return e(r,{"is-rubrick":t?"true":"false",amount:s,"has-side":this.hasSide?"true":"false"},n&&e("div",{class:"stzh-pi-teaser-layout__header-holder"},e(i,{class:"stzh-pi-teaser-layout__header",level:this.headingLevel},this.heading)),e("div",{class:a},...this.contentList.map(((t,r)=>t.type=="empty-teaser"?e("div",{class:f(r)}):e("stzh-pi-teaser-layout-item",{key:r,href:t.href,dateline:t.dateline,heading:t.heading,date:t.date,imageSrc:t.imageSrc,contentSize:p(r+1),lead:c(t.lead,r+1,t.imageSrc),imagePosition:m(t.imageSrc,r+1),class:f(r)})))),u&&e("div",{class:"stzh-pi-teaser-layout__bottom-slot"},e("slot",{name:"bottom"})))}get element(){return s(this)}};p.style=u;export{p as stzh_pi_teaser_layout};
+//# sourceMappingURL=p-15dc154c.entry.js.map

package/dist/stzh-components/p-15dc154c.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["stzhPiTeaserLayoutCss","StzhPiTeaserLayoutStyle0","RubrickSize","getRubrickSize","length","xxxsmall","xxsmall","xsmall","small","medium","large","StzhPiTeaserLayout","this","mediaChangeHandler","isSmall","media","matches","isMedium","isLarge","isUltra","componentDidLoad","contentList","slice","variant","hasSide","paddingNeeded","Math","max","Array","fill","type","connectedCallback","addMediaChangeListener","render","isRubrick","rubrickSize","Heading","headingLevel","classes","hasHeading","heading","bottomSlotUsed","hasSlot","element","contentSizeBehavior","index","big","sideSize","leadBehavior","lead","imageSrc","noImage","undefined","imageBehavior","h","teaserClasses","Host","amount","class","level","map","teaser","key","href","dateline","date","contentSize","imagePosition","name"],"sources":["src/components/CMS/stzh-pi-teaser-layout/stzh-pi-teaser-layout.scss?tag=stzh-pi-teaser-layout&encapsulation=scoped","src/components/CMS/stzh-pi-teaser-layout/stzh-pi-teaser-layout.tsx"],"sourcesContent":[":host {\n  --grid-pi-teaser-layout-columns: repeat(12, 1fr);\n  --min-height: 1800px;\n  --max-height: 1900px;\n  --gap: 16px;\n\n  // Default mobile layout\n  --grid-pi-teaser-layout-template: \"t1 t1 t1 t1 t1 t1 t1 t1 t1 t1 t1 t1\"\n    \"t2 t2 t2 t2 t2 t2 t2 t2 t2 t2 t2 t2\" \"t3 t3 t3 t3 t3 t3 t3 t3 t3 t3 t3 t3\"\n    \"t4 t4 t4 t4 t4 t4 t4 t4 t4 t4 t4 t4\" \"t5 t5 t5 t5 t5 t5 t5 t5 t5 t5 t5 t5\"\n    \"t6 t6 t6 t6 t6 t6 t6 t6 t6 t6 t6 t6\";\n  --grid-pi-teaser-layout-rows: 0.9fr 0.9fr 0.25fr 0.25fr 0.25fr 0.25fr;\n\n  // Small mobile layout\n  @include mq($from: small) {\n    --gap: 20px;\n    --min-height: 1900px;\n    --max-height: 1900px;\n    --grid-pi-teaser-layout-rows: 0.9fr 0.9fr 0.25fr 0.25fr 0.25fr 0.25fr;\n  }\n\n  // Medium mobile layout\n  @include mq($from: medium) {\n    --gap: 20px;\n    --min-height: 1550px;\n    --max-height: 1650px;\n    --grid-pi-teaser-layout-template: \"t1 t1 t1 t1 t1 t1 t2 t2 t2 t2 t2 t2\"\n      \"t3 t3 t3 t3 t3 t3 t4 t4 t4 t4 t4 t4\"\n      \"t5 t5 t5 t5 t5 t5 t5 t5 t5 t5 t5 t5\"\n      \"t6 t6 t6 t6 t6 t6 t6 t6 t6 t6 t6 t6\";\n    --grid-pi-teaser-layout-rows: 0.6fr 0.4fr 0.25fr 0.25fr;\n\n    &[has-side=\"true\"] {\n      --min-height: 2350px;\n      --max-height: 2350px;\n      --grid-pi-teaser-layout-template: \"t1 t1 t1 t1 t1 t1 t1 t1 t1 t1 t1 t1\"\n        \"t2 t2 t2 t2 t2 t2 t2 t2 t2 t2 t2 t2\"\n        \"t3 t3 t3 t3 t3 t3 t3 t3 t3 t3 t3 t3\"\n        \"t4 t4 t4 t4 t4 t4 t4 t4 t4 t4 t4 t4\"\n        \"t5 t5 t5 t5 t5 t5 t5 t5 t5 t5 t5 t5\"\n        \"t6 t6 t6 t6 t6 t6 t6 t6 t6 t6 t6 t6\";\n      --grid-pi-teaser-layout-rows: 0.85fr 0.85fr 0.4fr 0.4fr 0.36fr 0.36fr;\n    }\n  }\n\n  // Large mobile layout\n  @include mq($from: large) {\n    --gap: 24px;\n    --min-height: 1350px;\n    --max-height: 1350px;\n    --grid-pi-teaser-layout-template: \"t1 t1 t1 t1 t1 t1 t2 t2 t2 t2 t2 t2\"\n      \"t3 t3 t3 t3 t4 t4 t4 t4 t5 t5 t5 t5\"\n      \"t3 t3 t3 t3 t4 t4 t4 t4 t6 t6 t6 t6\";\n    --grid-pi-teaser-layout-rows: 0.7fr 0.3fr 0.3fr;\n\n    &[has-side=\"true\"] {\n      --min-height: 1350px;\n      --max-height: 1350px;\n      --grid-pi-teaser-layout-template: \"t1 t1 t1 t1 t1 t1 t2 t2 t2 t2 t2 t2\"\n        \"t3 t3 t3 t3 t4 t4 t4 t4 t5 t5 t5 t5\"\n        \"t3 t3 t3 t3 t4 t4 t4 t4 t6 t6 t6 t6\";\n      --grid-pi-teaser-layout-rows: 0.7fr 0.3fr 0.3fr;\n    }\n  }\n\n  // Ultra mobile layout\n  @include mq($from: ultra) {\n    --gap: 32px;\n    --min-height: 1350px;\n    --max-height: 1350px;\n    --grid-pi-teaser-layout-rows: 0.7fr 0.3fr 0.3fr;\n\n    &[has-side=\"true\"] {\n      --min-height: 1350px;\n      --max-height: 1350px;\n      --grid-pi-teaser-layout-rows: 0.7fr 0.3fr 0.3fr;\n    }\n  }\n\n  .stzh-pi-teaser-layout-teaser {\n    background-color: white;\n\n    &--1 {\n      grid-area: t1;\n    }\n\n    &--2 {\n      grid-area: t2;\n    }\n\n    &--3 {\n      grid-area: t3;\n    }\n\n    &--4 {\n      grid-area: t4;\n    }\n\n    &--5 {\n      grid-area: t5;\n    }\n\n    &--6 {\n      grid-area: t6;\n    }\n  }\n\n  // Rubrick layouts\n  &[is-rubrick=\"true\"] {\n    // Mobile rubrick layouts\n    &[amount=\"one\"] {\n      --grid-pi-teaser-layout-template: \"t1 t1 t1 t1 t1 t1 t1 t1 t1 t1 t1 t1\";\n      --grid-pi-teaser-layout-rows: 1fr;\n      --min-height: 525px;\n      --max-height: 600px;\n    }\n\n    &[amount=\"two\"] {\n      --grid-pi-teaser-layout-template: \"t1 t1 t1 t1 t1 t1 t1 t1 t1 t1 t1 t1\"\n        \"t2 t2 t2 t2 t2 t2 t2 t2 t2 t2 t2 t2\";\n      --grid-pi-teaser-layout-rows: 1fr 1fr;\n      --min-height: 1050px;\n      --max-height: 1200px;\n    }\n\n    &[amount=\"three\"] {\n      --grid-pi-teaser-layout-template: \"t1 t1 t1 t1 t1 t1 t1 t1 t1 t1 t1 t1\"\n        \"t2 t2 t2 t2 t2 t2 t2 t2 t2 t2 t2 t2\"\n        \"t3 t3 t3 t3 t3 t3 t3 t3 t3 t3 t3 t3\";\n      --grid-pi-teaser-layout-rows: 1.1fr 1.1fr 0.3fr;\n      --min-height: 1200px;\n      --max-height: 1400px;\n    }\n\n    &[amount=\"four\"] {\n      --grid-pi-teaser-layout-template: \"t1 t1 t1 t1 t1 t1 t1 t1 t1 t1 t1 t1\"\n        \"t2 t2 t2 t2 t2 t2 t2 t2 t2 t2 t2 t2\"\n        \"t3 t3 t3 t3 t3 t3 t3 t3 t3 t3 t3 t3\"\n        \"t4 t4 t4 t4 t4 t4 t4 t4 t4 t4 t4 t4\";\n      --grid-pi-teaser-layout-rows: 1fr 1fr 0.3fr 0.3fr;\n      --min-height: 1400px;\n      --max-height: 1650px;\n    }\n\n    &[amount=\"five\"] {\n      --grid-pi-teaser-layout-template: \"t1 t1 t1 t1 t1 t1 t1 t1 t1 t1 t1 t1\"\n        \"t2 t2 t2 t2 t2 t2 t2 t2 t2 t2 t2 t2\"\n        \"t3 t3 t3 t3 t3 t3 t3 t3 t3 t3 t3 t3\"\n        \"t4 t4 t4 t4 t4 t4 t4 t4 t4 t4 t4 t4\"\n        \"t5 t5 t5 t5 t5 t5 t5 t5 t5 t5 t5 t5\";\n      --grid-pi-teaser-layout-rows: 1fr 1fr 0.3fr 0.3fr 0.3fr;\n      --min-height: 1600px;\n      --max-height: 1900px;\n    }\n\n    &[amount=\"six\"] {\n      --grid-pi-teaser-layout-template: \"t1 t1 t1 t1 t1 t1 t1 t1 t1 t1 t1 t1\"\n        \"t2 t2 t2 t2 t2 t2 t2 t2 t2 t2 t2 t2\"\n        \"t3 t3 t3 t3 t3 t3 t3 t3 t3 t3 t3 t3\"\n        \"t4 t4 t4 t4 t4 t4 t4 t4 t4 t4 t4 t4\"\n        \"t5 t5 t5 t5 t5 t5 t5 t5 t5 t5 t5 t5\"\n        \"t6 t6 t6 t6 t6 t6 t6 t6 t6 t6 t6 t6\";\n      --grid-pi-teaser-layout-rows: 1fr 1fr 0.3fr 0.3fr 0.3fr 0.3fr;\n      --min-height: 1800px;\n      --max-height: 2300px;\n    }\n\n    // Small breakpoint rubrick layouts\n    @include mq($from: small) {\n      &[amount=\"three\"] {\n        --grid-pi-teaser-layout-rows: 0.95fr 0.95fr 0.26fr;\n        --min-height: 1300px;\n        --max-height: 1400px;\n      }\n\n      &[amount=\"four\"] {\n        --grid-pi-teaser-layout-rows: 0.95fr 0.95fr 0.26fr 0.26fr;\n        --min-height: 1500px;\n        --max-height: 1700px;\n      }\n\n      &[amount=\"five\"] {\n        --grid-pi-teaser-layout-rows: 0.95fr 0.95fr 0.26fr 0.26fr 0.26fr;\n        --min-height: 1650px;\n        --max-height: 1900px;\n      }\n\n      &[amount=\"six\"] {\n        --grid-pi-teaser-layout-rows: 0.95fr 0.95fr 0.26fr 0.26fr 0.26fr 0.26fr;\n        --min-height: 1800px;\n        --max-height: 2100px;\n      }\n    }\n\n    // Medium breakpoint rubrick layouts\n    @include mq($from: medium) {\n      &[amount=\"one\"],\n      &[amount=\"two\"] {\n        --grid-pi-teaser-layout-template: \"t1 t1 t1 t1 t1 t1 t2 t2 t2 t2 t2 t2\";\n        --grid-pi-teaser-layout-rows: 1fr;\n        --min-height: 600px;\n        --max-height: 650px;\n      }\n\n      &[amount=\"three\"] {\n        --grid-pi-teaser-layout-template: \"t1 t1 t1 t1 t1 t1 t2 t2 t2 t2 t2 t2\"\n          \"t3 t3 t3 t3 t3 t3 t4 t4 t4 t4 t4 t4\";\n        --grid-pi-teaser-layout-rows: 1fr 1fr;\n        --min-height: 1200px;\n        --max-height: 1250px;\n\n        &[has-side=\"true\"] {\n          --grid-pi-teaser-layout-rows: 1fr 1fr;\n          --min-height: 1150px;\n          --max-height: 1200px;\n        }\n      }\n\n      &[amount=\"four\"] {\n        --grid-pi-teaser-layout-template: \"t1 t1 t1 t1 t1 t1 t2 t2 t2 t2 t2 t2\"\n          \"t3 t3 t3 t3 t3 t3 t4 t4 t4 t4 t4 t4\";\n        --grid-pi-teaser-layout-rows: 1fr 1fr;\n        --min-height: 1200px;\n        --max-height: 1250px;\n\n        &[has-side=\"true\"] {\n          --grid-pi-teaser-layout-rows: 1fr 1fr;\n          --min-height: 1150px;\n          --max-height: 1200px;\n        }\n      }\n\n      &[amount=\"five\"] {\n        --grid-pi-teaser-layout-template: \"t1 t1 t1 t1 t1 t1 t2 t2 t2 t2 t2 t2\"\n          \"t3 t3 t3 t3 t3 t3 t4 t4 t4 t4 t4 t4\"\n          \"t5 t5 t5 t5 t5 t5 t5 t5 t5 t5 t5 t5\";\n        --grid-pi-teaser-layout-rows: 1fr 1fr 0.35fr;\n        --min-height: 1400px;\n        --max-height: 1500px;\n\n        &[has-side=\"true\"] {\n          --grid-pi-teaser-layout-rows: 1.1fr 1.1fr 0.35fr;\n          --min-height: 1350px;\n          --max-height: 1400px;\n        }\n      }\n\n      &[amount=\"six\"] {\n        --grid-pi-teaser-layout-template: \"t1 t1 t1 t1 t1 t1 t2 t2 t2 t2 t2 t2\"\n          \"t3 t3 t3 t3 t3 t3 t4 t4 t4 t4 t4 t4\"\n          \"t5 t5 t5 t5 t5 t5 t5 t5 t5 t5 t5 t5\"\n          \"t6 t6 t6 t6 t6 t6 t6 t6 t6 t6 t6 t6\";\n        --grid-pi-teaser-layout-rows: 1fr 1fr 0.35fr 0.35fr;\n        --min-height: 1650px;\n        --max-height: 1700px;\n\n        &[has-side=\"true\"] {\n          --grid-pi-teaser-layout-rows: 1.2fr 1.2fr 0.4fr 0.4fr;\n          --min-height: 1800px;\n          --max-height: 1800px;\n        }\n      }\n    }\n\n    // Large breakpoint rubrick layouts\n    @include mq($from: large) {\n      &[amount=\"three\"] {\n        &[has-side=\"true\"] {\n          --grid-pi-teaser-layout-template: \"t1 t1 t1 t1 t1 t1 t2 t2 t2 t2 t2 t2\"\n            \"t3 t3 t3 t3 t3 t3 t4 t4 t4 t4 t4 t4\";\n          --grid-pi-teaser-layout-rows: 1fr 1fr;\n          --min-height: 1300px;\n          --max-height: 1300px;\n        }\n      }\n\n      &[amount=\"four\"] {\n        --grid-pi-teaser-layout-template: \"t1 t1 t1 t2 t2 t2 t3 t3 t3 t4 t4 t4\"\n          \"t1 t1 t1 t2 t2 t2 t3 t3 t3 t4 t4 t4\";\n        --grid-pi-teaser-layout-rows: 1fr 1fr;\n        --min-height: 560px;\n        --max-height: 700px;\n\n        &[has-side=\"true\"] {\n          --grid-pi-teaser-layout-template: \"t1 t1 t1 t1 t1 t1 t2 t2 t2 t2 t2 t2\"\n            \"t3 t3 t3 t3 t3 t3 t4 t4 t4 t4 t4 t4\"\n            \"t3 t3 t3 t3 t3 t3 t4 t4 t4 t4 t4 t4\";\n          --grid-pi-teaser-layout-rows: 1fr 0.5fr 0.5fr;\n          --min-height: 1200px;\n          --max-height: 1300px;\n        }\n      }\n\n      &[amount=\"five\"] {\n        --grid-pi-teaser-layout-template: \"t1 t1 t1 t2 t2 t2 t3 t3 t3 t4 t4 t4\"\n          \"t1 t1 t1 t2 t2 t2 t3 t3 t3 t5 t5 t5\";\n        --grid-pi-teaser-layout-rows: 1fr 1fr;\n        --min-height: 560px;\n        --max-height: 700px;\n\n        &[has-side=\"true\"] {\n          --grid-pi-teaser-layout-template: \"t1 t1 t1 t1 t1 t1 t2 t2 t2 t2 t2 t2\"\n            \"t3 t3 t3 t3 t3 t3 t4 t4 t4 t4 t4 t4\"\n            \"t3 t3 t3 t3 t3 t3 t5 t5 t5 t5 t5 t5\";\n          --grid-pi-teaser-layout-rows: 1fr 0.45fr 0.45fr;\n          --min-height: 1200px;\n          --max-height: 1300px;\n        }\n      }\n\n      &[amount=\"six\"] {\n        --grid-pi-teaser-layout-template: \"t1 t1 t1 t2 t2 t2 t3 t3 t3 t5 t5 t5\"\n          \"t1 t1 t1 t2 t2 t2 t4 t4 t4 t6 t6 t6\";\n        --grid-pi-teaser-layout-rows: 1fr 1fr;\n        --min-height: 560px;\n        --max-height: 700px;\n\n        &[has-side=\"true\"] {\n          --grid-pi-teaser-layout-template: \"t1 t1 t1 t1 t1 t1 t2 t2 t2 t2 t2 t2\"\n            \"t3 t3 t3 t3 t3 t3 t5 t5 t5 t5 t5 t5\"\n            \"t4 t4 t4 t4 t4 t4 t6 t6 t6 t6 t6 t6\";\n          --grid-pi-teaser-layout-rows: 1fr 0.4fr 0.4fr;\n          --min-height: 1200px;\n          --max-height: 1250px;\n        }\n      }\n    }\n\n    // Hide elements that shouldn't be displayed\n    .stzh-pi-teaser-layout-teaser {\n      &--5 {\n        &--four {\n          display: none;\n        }\n      }\n\n      &--6 {\n        &--four,\n        &--five {\n          display: none;\n        }\n      }\n    }\n  }\n}\n\n.stzh-pi-teaser-layout {\n  @include fontCurve(\"p1\");\n  width: 100%;\n  display: grid;\n  gap: var(--gap);\n  min-height: var(--min-height);\n  max-height: var(--max-height);\n  grid-template-columns: var(--grid-pi-teaser-layout-columns);\n  grid-template-areas: var(--grid-pi-teaser-layout-template);\n  grid-template-rows: var(--grid-pi-teaser-layout-rows);\n\n  & > * {\n    /* Prevents content from expanding grid items */\n    min-height: 0;\n    overflow: hidden;\n  }\n\n  &__header-holder {\n    margin-bottom: space(\"medium\");\n  }\n\n  &__header {\n    @include fontCurve(\"h2\");\n    @include font(\"title\");\n    color: var(--stzh-heading-color);\n\n    margin: 0;\n    padding-top: space(\"medium\");\n    padding-bottom: space(\"xxsmall\");\n\n    @include mq($from: small) {\n      padding-top: space(\"large\");\n      padding-bottom: space(\"xxsmall\");\n    }\n\n    @include mq($from: medium) {\n      padding-top: space(\"xlarge\");\n      padding-bottom: space(\"xsmall\");\n    }\n\n    @include mq($from: large) {\n      padding-top: space(\"xxlarge\");\n      padding-bottom: space(\"small\");\n    }\n  }\n\n  &__bottom-slot {\n    margin-top: space(\"medium\");\n    display: grid;\n    justify-content: end;\n  }\n}\n","import { Component, h, Element, Host, Prop, State } from \"@stencil/core\";\nimport { addMediaChangeListener, media } from \"../../../utils/media-utils\";\nimport { hasSlot } from \"../../../utils/utils\";\nimport { EmptyTeaser, PiTeaser } from \"../../..\";\n\nexport enum RubrickSize {\n  xxxsmall = \"one\",\n  xxsmall = \"two\",\n  xsmall = \"three\",\n  small = \"four\",\n  medium = \"five\",\n  large = \"six\",\n}\n\nconst getRubrickSize = (length: number): RubrickSize => {\n  switch (length) {\n    case 1:\n      return RubrickSize.xxxsmall;\n    case 2:\n      return RubrickSize.xxsmall;\n    case 3:\n      return RubrickSize.xsmall;\n    case 4:\n      return RubrickSize.small;\n    case 5:\n      return RubrickSize.medium;\n    case 6:\n      return RubrickSize.large;\n    default:\n      return null;\n  }\n};\n/**\n * @slot bottom - Slot for bottom content - like buttons to load more data\n */\n@Component({\n  tag: \"stzh-pi-teaser-layout\",\n  styleUrl: \"stzh-pi-teaser-layout.scss\",\n  scoped: true,\n})\nexport class StzhPiTeaserLayout {\n  /**\n    Variant specifies which grid is being shown\n  **/\n  @Prop() variant: \"hero\" | \"rubrick\" = \"hero\";\n\n  /**\n    Aside changes the grid behavior when the layout is presented beside other content aside like menu\n  **/\n  @Prop() hasSide: boolean = false;\n\n  /**  Heading for the section **/\n  @Prop() heading: string = \"\";\n\n  /** Heading level, for accessibility, no visual impact */\n  @Prop({ reflect: true }) headingLevel: \"1\" | \"2\" | \"3\" = \"3\";\n\n  /**\n    The Hero variant has 6 teaser items list requirement, if there is more the list will be cut if less an error will be shown.\n    The rubrick is either 1,2,3,4,5 or 6 elements big if there is more the list will be cut to 6 if there is less we show an empty div for every empty element.\n  **/\n  @Prop() contentList: PiTeaser[] | EmptyTeaser[] = [];\n\n  /** Break points for displays */\n  @State() isSmall: boolean;\n  @State() isMedium: boolean;\n  @State() isLarge: boolean;\n  @State() isUltra: boolean;\n\n  @Element() element: HTMLStzhPiPagetitleElement;\n\n  componentDidLoad() {\n    this.mediaChangeHandler();\n    /**\n      The Hero variant has 6 teaser items list requirement, if there is more the list will be cut if less an error will be shown.\n      The rubrick is either 1,2,3,4,5 or 6 elements big if there is more the list will be cut to 6 if there is less we show an empty div for every empty element.\n    **/\n    this.contentList = this.contentList.slice(0, 6);\n\n    if (this.variant == \"rubrick\" && this.contentList.length < 4) {\n      // Always make sure you have at least 4 elements\n      if ((this.isLarge || this.isUltra) && !this.hasSide) {\n        const paddingNeeded = Math.max(0, 4 - this.contentList.length);\n        this.contentList = [...this.contentList, ...Array(paddingNeeded).fill({ type: \"empty-teaser\" })];\n      }\n    }\n  }\n\n  private mediaChangeHandler = () => {\n    this.isSmall = media(\"small\").matches;\n    this.isMedium = media(\"medium\").matches;\n    this.isLarge = media(\"large\").matches;\n    this.isUltra = media(\"ultra\").matches;\n  };\n\n  connectedCallback() {\n    addMediaChangeListener(this.mediaChangeHandler);\n  }\n\n  render() {\n    const isRubrick = this.variant == \"rubrick\";\n    const rubrickSize: RubrickSize = getRubrickSize(this.contentList.length);\n    const Heading = `h${this.headingLevel}`;\n    const classes = {\n      \"stzh-pi-teaser-layout\": true,\n      \"stzh-pi-teaser-layout--rubrick\": isRubrick,\n      \"stzh-pi-teaser-layout--has-side\": this.hasSide,\n    };\n    const hasHeading = !!this.heading;\n    const bottomSlotUsed = hasSlot(this.element, \"bottom\");\n\n    const contentSizeBehavior = (index: number): \"XS\" | \"S\" | \"M\" | \"L\" | \"XL\" => {\n      const big = this.isUltra || this.isLarge;\n      const sideSize = this.hasSide ? \"M\" : \"L\";\n\n      if (isRubrick) {\n        switch (index) {\n          case 1:\n          case 2:\n            return big ? \"L\" : this.isMedium ? sideSize : this.isSmall ? \"L\" : \"M\";\n          case 3:\n            if (rubrickSize == RubrickSize.xsmall) {\n              return big ? \"L\" : this.isMedium ? sideSize : this.isSmall ? \"S\" : \"XS\";\n            }\n            if (rubrickSize == RubrickSize.small) {\n              return big ? \"L\" : this.isMedium ? sideSize : this.isSmall ? \"S\" : \"XS\";\n            }\n            if (rubrickSize == RubrickSize.medium) {\n              return big ? \"L\" : this.isMedium ? sideSize : this.isSmall ? \"S\" : \"XS\";\n            }\n            if (rubrickSize == RubrickSize.large) {\n              return big ? \"M\" : this.isMedium ? sideSize : this.isSmall ? \"S\" : \"XS\";\n            }\n          case 4:\n            if (rubrickSize == RubrickSize.small) {\n              return big ? \"L\" : this.isMedium ? sideSize : this.isSmall ? \"S\" : \"XS\";\n            }\n            if (rubrickSize == RubrickSize.medium) {\n              return big ? \"M\" : this.isMedium ? sideSize : this.isSmall ? \"S\" : \"XS\";\n            }\n            if (rubrickSize == RubrickSize.large) {\n              return big ? \"M\" : this.isMedium ? sideSize : this.isSmall ? \"S\" : \"XS\";\n            }\n          case 5:\n            if (rubrickSize == RubrickSize.medium) {\n              return big ? \"M\" : this.isMedium ? \"M\" : this.isSmall ? \"S\" : \"XS\";\n            }\n            if (rubrickSize == RubrickSize.large) {\n              return big ? \"M\" : this.isMedium ? \"M\" : this.isSmall ? \"S\" : \"XS\";\n            }\n          case 6:\n            if (rubrickSize == RubrickSize.large) {\n              return big ? \"M\" : this.isMedium ? \"M\" : this.isSmall ? \"S\" : \"XS\";\n            }\n        }\n      } else {\n        switch (index) {\n          case 1:\n          case 2:\n            return big ? \"XL\" : this.isMedium ? \"L\" : this.isSmall ? \"L\" : \"M\";\n          case 3:\n          case 4:\n            return big ? \"L\" : this.isMedium ? \"M\" : this.isSmall ? \"S\" : \"XS\";\n          case 5:\n          case 6:\n            return big ? \"M\" : this.isMedium ? \"M\" : this.isSmall ? \"S\" : \"XS\";\n        }\n      }\n    };\n\n    const leadBehavior = (lead: string | null, index: number, imageSrc: string | null): string | null => {\n      const big = this.isUltra || this.isLarge;\n      const noImage = imageSrc == null || imageSrc == undefined;\n\n      if (isRubrick) {\n        switch (index) {\n          case 1:\n          case 2:\n            return lead;\n          case 3:\n            if (noImage) {\n              return big ? lead : this.isMedium ? lead : this.isSmall ? lead : null;\n            }\n            if (rubrickSize == RubrickSize.large) {\n              if (this.hasSide) {\n                return this.isUltra ? null : this.isLarge ? null : this.isMedium ? lead : null;\n              }\n              return this.isUltra ? lead : this.isLarge ? lead : this.isMedium ? lead : null;\n            }\n            return big ? lead : this.isMedium ? lead : null;\n          case 4:\n            if (noImage) {\n              return big ? lead : this.isMedium ? lead : this.isSmall ? lead : null;\n            }\n            if (rubrickSize == RubrickSize.medium) {\n              if (this.hasSide) {\n                return this.isUltra ? null : this.isLarge ? null : this.isMedium ? lead : null;\n              }\n              return this.isUltra ? lead : this.isLarge ? lead : this.isMedium ? lead : null;\n            }\n            if (rubrickSize == RubrickSize.large) {\n              if (this.hasSide) {\n                return this.isUltra ? null : this.isLarge ? null : this.isMedium ? lead : null;\n              }\n              return this.isUltra ? lead : this.isLarge ? lead : this.isMedium ? lead : null;\n            }\n            return big ? lead : this.isMedium ? lead : null;\n          case 5:\n            if (noImage) {\n              return big ? lead : this.isMedium ? lead : null;\n            }\n            if (this.hasSide) {\n              return null;\n            }\n            return big ? lead : this.isMedium ? null : null;\n          case 6:\n            if (noImage) {\n              return big ? lead : this.isMedium ? lead : null;\n            }\n            if (this.hasSide) {\n              return null;\n            }\n            return big ? lead : this.isMedium ? null : null;\n        }\n      } else {\n        switch (index) {\n          case 1:\n          case 2:\n            return lead;\n          case 3:\n          case 4:\n            if (noImage) {\n              return lead;\n            }\n            if (this.hasSide) {\n              return big ? lead : this.isMedium ? lead : null;\n            }\n            return big ? lead : this.isMedium ? null : null;\n          case 5:\n          case 6:\n            return big ? lead : this.isMedium ? lead : null;\n        }\n      }\n      return lead;\n    };\n\n    const imageBehavior = (imageSrc: string | null, index: number): \"top\" | \"right\" | null => {\n      // Image has higher priority than lead\n      const big = this.isUltra || this.isLarge;\n      const noImage = imageSrc == null || imageSrc == undefined;\n\n      if (noImage) {\n        return null;\n      }\n\n      if (isRubrick) {\n        switch (index) {\n          case 1:\n          case 2:\n            return \"top\";\n          case 3:\n            if (rubrickSize == RubrickSize.medium) {\n              if (this.hasSide) {\n                return big ? \"top\" : this.isMedium ? \"top\" : this.isSmall ? null : null;\n              }\n            }\n\n            if (rubrickSize == RubrickSize.large) {\n              if (this.hasSide) {\n                return big ? \"right\" : this.isMedium ? \"top\" : this.isSmall ? null : null;\n              }\n              return big ? null : this.isMedium ? \"top\" : this.isSmall ? null : null;\n            }\n\n            return big ? \"top\" : this.isMedium ? \"top\" : this.isSmall ? null : null;\n          case 4:\n            if (rubrickSize == RubrickSize.medium) {\n              if (this.hasSide) {\n                return big ? \"right\" : this.isMedium ? \"top\" : this.isSmall ? null : null;\n              }\n              return big ? null : this.isMedium ? \"top\" : this.isSmall ? null : null;\n            }\n\n            if (rubrickSize == RubrickSize.large) {\n              if (this.hasSide) {\n                return big ? \"right\" : this.isMedium ? \"top\" : this.isSmall ? null : null;\n              }\n              return big ? null : this.isMedium ? \"top\" : this.isSmall ? null : null;\n            }\n\n            return big ? \"top\" : this.isMedium ? \"top\" : this.isSmall ? null : null;\n          case 5:\n            if (rubrickSize == RubrickSize.medium || rubrickSize == RubrickSize.large) {\n              if (this.hasSide) {\n                return big ? \"right\" : this.isMedium ? \"right\" : null;\n              }\n              return big ? null : this.isMedium ? \"right\" : null;\n            }\n\n          case 6:\n            if (rubrickSize == RubrickSize.large) {\n              if (this.hasSide) {\n                return big ? \"right\" : this.isMedium ? \"right\" : null;\n              }\n              return big ? null : this.isMedium ? \"right\" : null;\n            }\n        }\n      } else {\n        switch (index) {\n          case 1:\n          case 2:\n            return \"top\";\n          case 3:\n          case 4:\n            if (this.hasSide) {\n              return big ? \"top\" : this.isMedium ? \"right\" : this.isSmall ? \"right\" : \"top\";\n            }\n            return big ? \"top\" : this.isMedium ? \"top\" : this.isSmall ? null : null;\n          case 5:\n          case 6:\n            return big ? null : this.isMedium ? null : this.isSmall ? null : null;\n        }\n      }\n    };\n\n    if (!isRubrick && this.contentList.length < 6) {\n      return <div>At least add 6 elements for hero</div>;\n    }\n\n    const teaserClasses = (index: number) => ({\n      \"stzh-pi-teaser-layout-teaser\": true,\n      [`stzh-pi-teaser-layout-teaser--${index + 1}`]: true,\n      [`stzh-pi-teaser-layout-teaser--${index + 1}--${this.hasSide ? \"side\" : \"no-side\"}`]: true,\n      [`stzh-pi-teaser-layout-teaser--${index + 1}--${rubrickSize}`]: true,\n      [`stzh-pi-teaser-layout-teaser--${index + 1}--${rubrickSize}--${this.hasSide ? \"side\" : \"no-side\"}`]: true,\n    });\n\n    return (\n      <Host is-rubrick={isRubrick ? \"true\" : \"false\"} amount={rubrickSize} has-side={this.hasSide ? \"true\" : \"false\"}>\n        {hasHeading && (\n          <div class=\"stzh-pi-teaser-layout__header-holder\">\n            <Heading class=\"stzh-pi-teaser-layout__header\" level={this.headingLevel}>\n              {this.heading}\n            </Heading>\n          </div>\n        )}\n        <div class={classes}>\n          {...this.contentList.map((teaser: PiTeaser | EmptyTeaser, index) =>\n            teaser.type == \"empty-teaser\" ? (\n              <div class={teaserClasses(index)} />\n            ) : (\n              <stzh-pi-teaser-layout-item\n                key={index}\n                href={teaser.href}\n                dateline={teaser.dateline}\n                heading={teaser.heading}\n                date={teaser.date}\n                imageSrc={teaser.imageSrc}\n                contentSize={contentSizeBehavior(index + 1)}\n                lead={leadBehavior(teaser.lead, index + 1, teaser.imageSrc)}\n                imagePosition={imageBehavior(teaser.imageSrc, index + 1)}\n                class={teaserClasses(index)}\n              />\n            ),\n          )}\n        </div>\n        {bottomSlotUsed && (\n          <div class=\"stzh-pi-teaser-layout__bottom-slot\">\n            <slot name=\"bottom\" />\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"sJAAA,MAAMA,EAAwB,8udAC9B,MAAAC,EAAeD,ECIf,IAAYE,GAAZ,SAAYA,GACVA,EAAA,kBACAA,EAAA,iBACAA,EAAA,kBACAA,EAAA,gBACAA,EAAA,iBACAA,EAAA,cACD,EAPD,CAAYA,MAAW,KASvB,MAAMC,EAAkBC,IACtB,OAAQA,GACN,KAAK,EACH,OAAOF,EAAYG,SACrB,KAAK,EACH,OAAOH,EAAYI,QACrB,KAAK,EACH,OAAOJ,EAAYK,OACrB,KAAK,EACH,OAAOL,EAAYM,MACrB,KAAK,EACH,OAAON,EAAYO,OACrB,KAAK,EACH,OAAOP,EAAYQ,MACrB,QACE,OAAO,K,QAWAC,EAAkB,M,yBAgDrBC,KAAAC,mBAAqB,KAC3BD,KAAKE,QAAUC,EAAM,SAASC,QAC9BJ,KAAKK,SAAWF,EAAM,UAAUC,QAChCJ,KAAKM,QAAUH,EAAM,SAASC,QAC9BJ,KAAKO,QAAUJ,EAAM,SAASC,OAAO,E,aAhDD,O,aAKX,M,aAGD,G,kBAG+B,I,iBAMP,G,6FAUlD,gBAAAI,GACER,KAAKC,qBAKLD,KAAKS,YAAcT,KAAKS,YAAYC,MAAM,EAAG,GAE7C,GAAIV,KAAKW,SAAW,WAAaX,KAAKS,YAAYjB,OAAS,EAAG,CAE5D,IAAKQ,KAAKM,SAAWN,KAAKO,WAAaP,KAAKY,QAAS,CACnD,MAAMC,EAAgBC,KAAKC,IAAI,EAAG,EAAIf,KAAKS,YAAYjB,QACvDQ,KAAKS,YAAc,IAAIT,KAAKS,eAAgBO,MAAMH,GAAeI,KAAK,CAAEC,KAAM,iB,GAYpF,iBAAAC,GACEC,EAAuBpB,KAAKC,mB,CAG9B,MAAAoB,GACE,MAAMC,EAAYtB,KAAKW,SAAW,UAClC,MAAMY,EAA2BhC,EAAeS,KAAKS,YAAYjB,QACjE,MAAMgC,EAAU,IAAIxB,KAAKyB,eACzB,MAAMC,EAAU,CACd,wBAAyB,KACzB,iCAAkCJ,EAClC,kCAAmCtB,KAAKY,SAE1C,MAAMe,IAAe3B,KAAK4B,QAC1B,MAAMC,EAAiBC,EAAQ9B,KAAK+B,QAAS,UAE7C,MAAMC,EAAuBC,IAC3B,MAAMC,EAAMlC,KAAKO,SAAWP,KAAKM,QACjC,MAAM6B,EAAWnC,KAAKY,QAAU,IAAM,IAEtC,GAAIU,EAAW,CACb,OAAQW,GACN,KAAK,EACL,KAAK,EACH,OAAOC,EAAM,IAAMlC,KAAKK,SAAW8B,EAAWnC,KAAKE,QAAU,IAAM,IACrE,KAAK,EACH,GAAIqB,GAAejC,EAAYK,OAAQ,CACrC,OAAOuC,EAAM,IAAMlC,KAAKK,SAAW8B,EAAWnC,KAAKE,QAAU,IAAM,I,CAErE,GAAIqB,GAAejC,EAAYM,MAAO,CACpC,OAAOsC,EAAM,IAAMlC,KAAKK,SAAW8B,EAAWnC,KAAKE,QAAU,IAAM,I,CAErE,GAAIqB,GAAejC,EAAYO,OAAQ,CACrC,OAAOqC,EAAM,IAAMlC,KAAKK,SAAW8B,EAAWnC,KAAKE,QAAU,IAAM,I,CAErE,GAAIqB,GAAejC,EAAYQ,MAAO,CACpC,OAAOoC,EAAM,IAAMlC,KAAKK,SAAW8B,EAAWnC,KAAKE,QAAU,IAAM,I,CAEvE,KAAK,EACH,GAAIqB,GAAejC,EAAYM,MAAO,CACpC,OAAOsC,EAAM,IAAMlC,KAAKK,SAAW8B,EAAWnC,KAAKE,QAAU,IAAM,I,CAErE,GAAIqB,GAAejC,EAAYO,OAAQ,CACrC,OAAOqC,EAAM,IAAMlC,KAAKK,SAAW8B,EAAWnC,KAAKE,QAAU,IAAM,I,CAErE,GAAIqB,GAAejC,EAAYQ,MAAO,CACpC,OAAOoC,EAAM,IAAMlC,KAAKK,SAAW8B,EAAWnC,KAAKE,QAAU,IAAM,I,CAEvE,KAAK,EACH,GAAIqB,GAAejC,EAAYO,OAAQ,CACrC,OAAOqC,EAAM,IAAMlC,KAAKK,SAAW,IAAML,KAAKE,QAAU,IAAM,I,CAEhE,GAAIqB,GAAejC,EAAYQ,MAAO,CACpC,OAAOoC,EAAM,IAAMlC,KAAKK,SAAW,IAAML,KAAKE,QAAU,IAAM,I,CAElE,KAAK,EACH,GAAIqB,GAAejC,EAAYQ,MAAO,CACpC,OAAOoC,EAAM,IAAMlC,KAAKK,SAAW,IAAML,KAAKE,QAAU,IAAM,I,OAG/D,CACL,OAAQ+B,GACN,KAAK,EACL,KAAK,EACH,OAAOC,EAAM,KAAOlC,KAAKK,SAAW,IAAML,KAAKE,QAAU,IAAM,IACjE,KAAK,EACL,KAAK,EACH,OAAOgC,EAAM,IAAMlC,KAAKK,SAAW,IAAML,KAAKE,QAAU,IAAM,KAChE,KAAK,EACL,KAAK,EACH,OAAOgC,EAAM,IAAMlC,KAAKK,SAAW,IAAML,KAAKE,QAAU,IAAM,K,GAKtE,MAAMkC,EAAe,CAACC,EAAqBJ,EAAeK,KACxD,MAAMJ,EAAMlC,KAAKO,SAAWP,KAAKM,QACjC,MAAMiC,EAAUD,GAAY,MAAQA,GAAYE,UAEhD,GAAIlB,EAAW,CACb,OAAQW,GACN,KAAK,EACL,KAAK,EACH,OAAOI,EACT,KAAK,EACH,GAAIE,EAAS,CACX,OAAOL,EAAMG,EAAOrC,KAAKK,SAAWgC,EAAOrC,KAAKE,QAAUmC,EAAO,I,CAEnE,GAAId,GAAejC,EAAYQ,MAAO,CACpC,GAAIE,KAAKY,QAAS,CAChB,OAAOZ,KAAKO,QAAU,KAAOP,KAAKM,QAAU,KAAON,KAAKK,SAAWgC,EAAO,I,CAE5E,OAAOrC,KAAKO,QAAU8B,EAAOrC,KAAKM,QAAU+B,EAAOrC,KAAKK,SAAWgC,EAAO,I,CAE5E,OAAOH,EAAMG,EAAOrC,KAAKK,SAAWgC,EAAO,KAC7C,KAAK,EACH,GAAIE,EAAS,CACX,OAAOL,EAAMG,EAAOrC,KAAKK,SAAWgC,EAAOrC,KAAKE,QAAUmC,EAAO,I,CAEnE,GAAId,GAAejC,EAAYO,OAAQ,CACrC,GAAIG,KAAKY,QAAS,CAChB,OAAOZ,KAAKO,QAAU,KAAOP,KAAKM,QAAU,KAAON,KAAKK,SAAWgC,EAAO,I,CAE5E,OAAOrC,KAAKO,QAAU8B,EAAOrC,KAAKM,QAAU+B,EAAOrC,KAAKK,SAAWgC,EAAO,I,CAE5E,GAAId,GAAejC,EAAYQ,MAAO,CACpC,GAAIE,KAAKY,QAAS,CAChB,OAAOZ,KAAKO,QAAU,KAAOP,KAAKM,QAAU,KAAON,KAAKK,SAAWgC,EAAO,I,CAE5E,OAAOrC,KAAKO,QAAU8B,EAAOrC,KAAKM,QAAU+B,EAAOrC,KAAKK,SAAWgC,EAAO,I,CAE5E,OAAOH,EAAMG,EAAOrC,KAAKK,SAAWgC,EAAO,KAC7C,KAAK,EACH,GAAIE,EAAS,CACX,OAAOL,EAAMG,EAAOrC,KAAKK,SAAWgC,EAAO,I,CAE7C,GAAIrC,KAAKY,QAAS,CAChB,OAAO,I,CAET,OAAOsB,EAAMG,EAAOrC,KAAKK,SAAW,KAAO,KAC7C,KAAK,EACH,GAAIkC,EAAS,CACX,OAAOL,EAAMG,EAAOrC,KAAKK,SAAWgC,EAAO,I,CAE7C,GAAIrC,KAAKY,QAAS,CAChB,OAAO,I,CAET,OAAOsB,EAAMG,EAAOrC,KAAKK,SAAW,KAAO,K,KAE1C,CACL,OAAQ4B,GACN,KAAK,EACL,KAAK,EACH,OAAOI,EACT,KAAK,EACL,KAAK,EACH,GAAIE,EAAS,CACX,OAAOF,C,CAET,GAAIrC,KAAKY,QAAS,CAChB,OAAOsB,EAAMG,EAAOrC,KAAKK,SAAWgC,EAAO,I,CAE7C,OAAOH,EAAMG,EAAOrC,KAAKK,SAAW,KAAO,KAC7C,KAAK,EACL,KAAK,EACH,OAAO6B,EAAMG,EAAOrC,KAAKK,SAAWgC,EAAO,K,CAGjD,OAAOA,CAAI,EAGb,MAAMI,EAAgB,CAACH,EAAyBL,KAE9C,MAAMC,EAAMlC,KAAKO,SAAWP,KAAKM,QACjC,MAAMiC,EAAUD,GAAY,MAAQA,GAAYE,UAEhD,GAAID,EAAS,CACX,OAAO,I,CAGT,GAAIjB,EAAW,CACb,OAAQW,GACN,KAAK,EACL,KAAK,EACH,MAAO,MACT,KAAK,EACH,GAAIV,GAAejC,EAAYO,OAAQ,CACrC,GAAIG,KAAKY,QAAS,CAChB,OAAOsB,EAAM,MAAQlC,KAAKK,SAAW,MAAQL,KAAKE,QAAU,KAAO,I,EAIvE,GAAIqB,GAAejC,EAAYQ,MAAO,CACpC,GAAIE,KAAKY,QAAS,CAChB,OAAOsB,EAAM,QAAUlC,KAAKK,SAAW,MAAQL,KAAKE,QAAU,KAAO,I,CAEvE,OAAOgC,EAAM,KAAOlC,KAAKK,SAAW,MAAQL,KAAKE,QAAU,KAAO,I,CAGpE,OAAOgC,EAAM,MAAQlC,KAAKK,SAAW,MAAQL,KAAKE,QAAU,KAAO,KACrE,KAAK,EACH,GAAIqB,GAAejC,EAAYO,OAAQ,CACrC,GAAIG,KAAKY,QAAS,CAChB,OAAOsB,EAAM,QAAUlC,KAAKK,SAAW,MAAQL,KAAKE,QAAU,KAAO,I,CAEvE,OAAOgC,EAAM,KAAOlC,KAAKK,SAAW,MAAQL,KAAKE,QAAU,KAAO,I,CAGpE,GAAIqB,GAAejC,EAAYQ,MAAO,CACpC,GAAIE,KAAKY,QAAS,CAChB,OAAOsB,EAAM,QAAUlC,KAAKK,SAAW,MAAQL,KAAKE,QAAU,KAAO,I,CAEvE,OAAOgC,EAAM,KAAOlC,KAAKK,SAAW,MAAQL,KAAKE,QAAU,KAAO,I,CAGpE,OAAOgC,EAAM,MAAQlC,KAAKK,SAAW,MAAQL,KAAKE,QAAU,KAAO,KACrE,KAAK,EACH,GAAIqB,GAAejC,EAAYO,QAAU0B,GAAejC,EAAYQ,MAAO,CACzE,GAAIE,KAAKY,QAAS,CAChB,OAAOsB,EAAM,QAAUlC,KAAKK,SAAW,QAAU,I,CAEnD,OAAO6B,EAAM,KAAOlC,KAAKK,SAAW,QAAU,I,CAGlD,KAAK,EACH,GAAIkB,GAAejC,EAAYQ,MAAO,CACpC,GAAIE,KAAKY,QAAS,CAChB,OAAOsB,EAAM,QAAUlC,KAAKK,SAAW,QAAU,I,CAEnD,OAAO6B,EAAM,KAAOlC,KAAKK,SAAW,QAAU,I,OAG/C,CACL,OAAQ4B,GACN,KAAK,EACL,KAAK,EACH,MAAO,MACT,KAAK,EACL,KAAK,EACH,GAAIjC,KAAKY,QAAS,CAChB,OAAOsB,EAAM,MAAQlC,KAAKK,SAAW,QAAUL,KAAKE,QAAU,QAAU,K,CAE1E,OAAOgC,EAAM,MAAQlC,KAAKK,SAAW,MAAQL,KAAKE,QAAU,KAAO,KACrE,KAAK,EACL,KAAK,EACH,OAAOgC,EAAM,KAAOlC,KAAKK,SAAW,KAAOL,KAAKE,QAAU,KAAO,K,GAKzE,IAAKoB,GAAatB,KAAKS,YAAYjB,OAAS,EAAG,CAC7C,OAAOkD,EAAA,8C,CAGT,MAAMC,EAAiBV,IAAa,CAClC,+BAAgC,KAChC,CAAC,iCAAiCA,EAAQ,KAAM,KAChD,CAAC,iCAAiCA,EAAQ,MAAMjC,KAAKY,QAAU,OAAS,aAAc,KACtF,CAAC,iCAAiCqB,EAAQ,MAAMV,KAAgB,KAChE,CAAC,iCAAiCU,EAAQ,MAAMV,MAAgBvB,KAAKY,QAAU,OAAS,aAAc,OAGxG,OACE8B,EAACE,EAAI,cAAatB,EAAY,OAAS,QAASuB,OAAQtB,EAAW,WAAYvB,KAAKY,QAAU,OAAS,SACpGe,GACCe,EAAA,OAAKI,MAAM,wCACTJ,EAAClB,EAAO,CAACsB,MAAM,gCAAgCC,MAAO/C,KAAKyB,cACxDzB,KAAK4B,UAIZc,EAAA,OAAKI,MAAOpB,MACN1B,KAAKS,YAAYuC,KAAI,CAACC,EAAgChB,IACxDgB,EAAO/B,MAAQ,eACbwB,EAAA,OAAKI,MAAOH,EAAcV,KAE1BS,EAAA,8BACEQ,IAAKjB,EACLkB,KAAMF,EAAOE,KACbC,SAAUH,EAAOG,SACjBxB,QAASqB,EAAOrB,QAChByB,KAAMJ,EAAOI,KACbf,SAAUW,EAAOX,SACjBgB,YAAatB,EAAoBC,EAAQ,GACzCI,KAAMD,EAAaa,EAAOZ,KAAMJ,EAAQ,EAAGgB,EAAOX,UAClDiB,cAAed,EAAcQ,EAAOX,SAAUL,EAAQ,GACtDa,MAAOH,EAAcV,QAK5BJ,GACCa,EAAA,OAAKI,MAAM,sCACTJ,EAAA,QAAMc,KAAK,Y"}

package/dist/stzh-components/{p-e973ae31.entry.js → p-1617973f.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,h as t,a as n,g as s}from"./p-ef5985a3.js";import{s as i}from"./p-87c329f2.js";import"./p-dae15605.js";const a=".sc-stzh-eventinfo-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-eventinfo-h,[stzh-hidden].sc-stzh-eventinfo-h{display:none}.sc-stzh-eventinfo-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-eventinfo-h *.sc-stzh-eventinfo,.sc-stzh-eventinfo-h *.sc-stzh-eventinfo::before,.sc-stzh-eventinfo-h *.sc-stzh-eventinfo::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-eventinfo-h .has-focus.sc-stzh-eventinfo{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-eventinfo-h .stzh-fylingfocus-focused.sc-stzh-eventinfo{outline-style:none !important}.sc-stzh-eventinfo-h .stzh-fylingfocus-focused.sc-stzh-eventinfo::-moz-focus-inner{border:0 !important}.stzh-eventinfo.sc-stzh-eventinfo{display:flex}.stzh-eventinfo__left.sc-stzh-eventinfo{font-size:var(--stzh-font-nano-font-size);line-height:var(--stzh-font-nano-text-line-height);flex-shrink:0;text-transform:uppercase;display:flex;flex-direction:column;align-items:center;color:var(--stzh-color-black);background-color:var(--stzh-color-secondary30);padding-top:var(--stzh-space-small);width:4.5rem}@media screen and (min-width: 600px){.stzh-eventinfo__left.sc-stzh-eventinfo{width:5.5rem}}.stzh-eventinfo__main-event-day.sc-stzh-eventinfo{font-family:var(--stzh-font-family-heavy);font-weight:var(--stzh-font-weight-heavy);font-style:var(--stzh-font-style-heavy);font-size:var(--stzh-font-hecto-font-size);line-height:var(--stzh-font-hecto-text-line-height);letter-spacing:var(--stzh-font-hecto-text-letter-spacing);color:var(--stzh-color-primary70);margin-top:-0.4375rem;margin-bottom:-0.4375rem}.stzh-eventinfo__right.sc-stzh-eventinfo{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);flex-grow:1;color:var(--stzh-color-grey80);background-color:var(--stzh-color-grey10);padding-top:var(--stzh-space-small);padding-bottom:var(--stzh-space-medium);padding-left:var(--stzh-space-small);padding-right:var(--stzh-space-medium)}@media screen and (min-width: 600px){.stzh-eventinfo__right.sc-stzh-eventinfo{padding-left:var(--stzh-space-xlarge);padding-right:var(--stzh-space-xlarge)}}@media screen and (min-width: 900px){.stzh-eventinfo__right.sc-stzh-eventinfo{padding-top:var(--stzh-space-medium);padding-bottom:var(--stzh-space-large)}}@media screen and (min-width: 1260px){.stzh-eventinfo__right.sc-stzh-eventinfo{padding-top:var(--stzh-space-large);padding-bottom:var(--stzh-space-xlarge)}}.stzh-eventinfo__head.sc-stzh-eventinfo{display:flex;flex-direction:column;column-gap:var(--stzh-space-large)}@media screen and (min-width: 900px){.stzh-eventinfo__head.sc-stzh-eventinfo{flex-direction:row;justify-content:space-between}}.stzh-eventinfo__main-date.sc-stzh-eventinfo{display:flex;column-gap:var(--stzh-space-medium);flex-wrap:wrap}.stzh-eventinfo__main-event-link.sc-stzh-eventinfo{flex-shrink:0}.stzh-eventinfo__text.sc-stzh-eventinfo{display:flex;flex-direction:column;row-gap:var(--stzh-space-medium);column-gap:var(--stzh-space-large);margin-top:var(--stzh-space-medium)}@media screen and (min-width: 900px){.stzh-eventinfo__text.sc-stzh-eventinfo{margin-top:var(--stzh-space-xxsmall)}}@media screen and (min-width: 900px) and (min-width: 900px){.stzh-eventinfo__text.sc-stzh-eventinfo{margin-top:var(--stzh-space-xsmall)}}@media screen and (min-width: 900px) and (min-width: 1260px){.stzh-eventinfo__text.sc-stzh-eventinfo{margin-top:var(--stzh-space-small)}}.stzh-eventinfo__details-wrapper.sc-stzh-eventinfo{margin-top:var(--stzh-space-medium)}@media screen and (min-width: 900px){.stzh-eventinfo__details-wrapper.sc-stzh-eventinfo{margin-top:var(--stzh-space-xxsmall)}}@media screen and (min-width: 900px) and (min-width: 900px){.stzh-eventinfo__details-wrapper.sc-stzh-eventinfo{margin-top:var(--stzh-space-xsmall)}}@media screen and (min-width: 900px) and (min-width: 1260px){.stzh-eventinfo__details-wrapper.sc-stzh-eventinfo{margin-top:var(--stzh-space-small)}}.stzh-eventinfo__details.sc-stzh-eventinfo{color:inherit}.stzh-eventinfo__details-link-collapse.sc-stzh-eventinfo{display:none}.stzh-eventinfo__details-link[a11y-expanded].sc-stzh-eventinfo:not([a11y-expanded=false]) .stzh-eventinfo__details-link-collapse.sc-stzh-eventinfo{display:block}.stzh-eventinfo__details-link[a11y-expanded].sc-stzh-eventinfo:not([a11y-expanded=false]) .stzh-eventinfo__details-link-expand.sc-stzh-eventinfo{display:none}.stzh-eventinfo__month-list.sc-stzh-eventinfo,.stzh-eventinfo__event-list.sc-stzh-eventinfo{list-style:none;margin:0;padding:0}.stzh-eventinfo__month-list.sc-stzh-eventinfo{font-size:var(--stzh-font-curve-p1-default-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-p1-default-text-line-height, var(--stzh-font-milli-text-line-height));letter-spacing:var(--stzh-font-curve-p1-default-text-letter-spacing);display:grid;column-gap:var(--stzh-space-small)}@media screen and (min-width: 900px){.stzh-eventinfo__month-list.sc-stzh-eventinfo{font-size:var(--stzh-font-curve-p1-medium-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-p1-medium-text-line-height, var(--stzh-font-centi-text-line-height));letter-spacing:var(--stzh-font-curve-p1-medium-text-letter-spacing)}}@media screen and (min-width: 600px){.stzh-eventinfo__month-list.sc-stzh-eventinfo{grid-template-columns:minmax(0, 1fr) auto}}@media screen and (min-width: 900px){.stzh-eventinfo__month-list.sc-stzh-eventinfo{column-gap:var(--stzh-space-xxlarge);grid-template-columns:minmax(6.25rem, auto) minmax(11.25rem, auto) minmax(0, 1fr) auto}}.stzh-eventinfo__month-list-item.sc-stzh-eventinfo:not(:first-child) .stzh-eventinfo__heading.sc-stzh-eventinfo{margin-top:var(--stzh-space-medium)}@media screen and (min-width: 600px){.stzh-eventinfo__month-list-item.sc-stzh-eventinfo:not(:first-child) .stzh-eventinfo__heading.sc-stzh-eventinfo{margin-top:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-eventinfo__month-list-item.sc-stzh-eventinfo:not(:first-child) .stzh-eventinfo__heading.sc-stzh-eventinfo{margin-top:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-eventinfo__month-list-item.sc-stzh-eventinfo:not(:first-child) .stzh-eventinfo__heading.sc-stzh-eventinfo{margin-top:var(--stzh-space-xxlarge)}}.stzh-eventinfo__month-list-item.sc-stzh-eventinfo{display:contents}.stzh-eventinfo__month-list-item.sc-stzh-eventinfo:last-child .stzh-eventinfo__event-list-item.sc-stzh-eventinfo:last-child .stzh-eventinfo__event-weekday.sc-stzh-eventinfo,.stzh-eventinfo__month-list-item.sc-stzh-eventinfo:last-child .stzh-eventinfo__event-list-item.sc-stzh-eventinfo:last-child .stzh-eventinfo__event-date.sc-stzh-eventinfo,.stzh-eventinfo__month-list-item.sc-stzh-eventinfo:last-child .stzh-eventinfo__event-list-item.sc-stzh-eventinfo:last-child .stzh-eventinfo__event-time.sc-stzh-eventinfo,.stzh-eventinfo__month-list-item.sc-stzh-eventinfo:last-child .stzh-eventinfo__event-list-item.sc-stzh-eventinfo:last-child .stzh-eventinfo__event-link.sc-stzh-eventinfo,.stzh-eventinfo__month-list-item.sc-stzh-eventinfo:last-child .stzh-eventinfo__event-list-item.sc-stzh-eventinfo:last-child .stzh-eventinfo__event-datetime-wrapper.sc-stzh-eventinfo{margin-bottom:0px}.stzh-eventinfo__heading.sc-stzh-eventinfo{font-family:var(--stzh-font-family-title);font-weight:var(--stzh-font-weight-title);font-style:var(--stzh-font-style-title);font-size:var(--stzh-font-centi-font-size);line-height:var(--stzh-font-centi-heading-line-height);letter-spacing:var(--stzh-font-curve---heading-letter-spacing);margin-bottom:var(--stzh-space-xxsmall);margin-top:0;color:var(--stzh-color-primary70)}@media screen and (min-width: 900px){.stzh-eventinfo__heading.sc-stzh-eventinfo{margin-bottom:var(--stzh-space-xsmall)}}@media screen and (min-width: 1260px){.stzh-eventinfo__heading.sc-stzh-eventinfo{margin-bottom:var(--stzh-space-small)}}@media screen and (min-width: 600px){.stzh-eventinfo__heading.sc-stzh-eventinfo{grid-column:1/3}}@media screen and (min-width: 900px){.stzh-eventinfo__heading.sc-stzh-eventinfo{grid-column:1/5}}.stzh-eventinfo__event-list.sc-stzh-eventinfo{display:contents}.stzh-eventinfo__event-list-item.sc-stzh-eventinfo{display:contents}@media screen and (min-width: 900px){.stzh-eventinfo__event-weekday.sc-stzh-eventinfo,.stzh-eventinfo__event-date.sc-stzh-eventinfo,.stzh-eventinfo__event-time.sc-stzh-eventinfo{margin-bottom:var(--stzh-space-small)}}@media screen and (min-width: 1260px){.stzh-eventinfo__event-weekday.sc-stzh-eventinfo,.stzh-eventinfo__event-date.sc-stzh-eventinfo,.stzh-eventinfo__event-time.sc-stzh-eventinfo{margin-bottom:var(--stzh-space-medium)}}.stzh-eventinfo__event-link.sc-stzh-eventinfo{margin-bottom:var(--stzh-space-medium)}@media screen and (min-width: 900px){.stzh-eventinfo__event-link.sc-stzh-eventinfo{margin-bottom:var(--stzh-space-small)}}@media screen and (min-width: 1260px){.stzh-eventinfo__event-link.sc-stzh-eventinfo{margin-bottom:var(--stzh-space-medium)}}.stzh-eventinfo__event-datetime-wrapper.sc-stzh-eventinfo{display:grid}@media screen and (min-width: 600px) and (max-width: 899px){.stzh-eventinfo__event-datetime-wrapper.sc-stzh-eventinfo{margin-bottom:var(--stzh-space-medium)}}@media screen and (min-width: 900px){.stzh-eventinfo__event-datetime-wrapper.sc-stzh-eventinfo{display:contents}}.stzh-eventinfo__event-date-wrapper.sc-stzh-eventinfo{display:flex;flex-direction:column;column-gap:var(--stzh-space-xxlarge)}@media screen and (min-width: 900px){.stzh-eventinfo__event-date-wrapper.sc-stzh-eventinfo{display:contents}}@media screen and (min-width: 600px) and (max-width: 899px){.stzh-eventinfo__event-weekday.sc-stzh-eventinfo{min-width:5.625rem}}";const h=a;const o=class{constructor(t){e(this,t);this._items=[];this._itemsGroupedByMonth=[];this.init=()=>{const e=this.element.querySelectorAll('stzh-text[slot="location"], [slot="location"] stzh-text');const t=this.element.querySelectorAll('stzh-text[slot="additional-info"], [slot="additional-info"] stzh-text');e.forEach((e=>{i(e,{color:"inherit",curve:"none"})}));t.forEach((e=>{i(e,{color:"inherit",curve:"none"})}))};this.localization=undefined;this.monthHeadingLevel="4";this.start=undefined;this.end=undefined;this.calendarUrl=undefined;this.calendarLabel=undefined;this.itemsSortDirection="descending";this.items=undefined;this.dateAdapter=undefined}itemsWatcher(){if(!this.dateAdapter){return}const e=typeof this.items==="string"?JSON.parse(this.items):this.items;if(!e){return}const t=this.itemsSortDirection==="ascending";this._items=e.map((e=>Object.assign(Object.assign({},e),{start:e.start?new Date(e.start):undefined,end:e.end?new Date(e.end):undefined}))).sort(((e,n)=>{try{const s=e.start.getTime()-n.start.getTime();return t?s:-s}catch(e){return 1}}));const n=this._items.reduce(((e,n)=>{const s=(n.start.getMonth()+1).toString().padStart(2,"0");const i=`${n.start.getFullYear()}-${s}`;if(!e[i]){e[i]={name:this.localization.$globals.monthNames[n.start.getMonth()]+" "+n.start.getFullYear(),events:[]}}e[i].events.push(n);e[i].events.sort(((e,n)=>{const s=e.start.getTime()-n.start.getTime();return t?s:-s}));return e}),{});this._itemsGroupedByMonth=Object.values(n)}hasProperStartAndOrEndDate(e,t){return!(!!e&&e.getHours()===0&&!t)}async componentWillLoad(){if(!this.localization){this.localization=await window.stzhComponents.utils.fetchTranslations(this.element,"eventinfo")}if(!this.dateAdapter){this.dateAdapter=window.stzhComponents.utils.createFormatParseAdapter(this.localization.$formats,this.localization.$globals)}this.itemsWatcher()}connectedCallback(){this.init();this.observer=new MutationObserver(this.init);this.observer.observe(this.element,{childList:true,subtree:true})}disconnectedCallback(){if(this.observer){this.observer.disconnect()}}render(){const e={"stzh-eventinfo":true};const s=this.start&&new Date(this.start);const i=this.end&&new Date(this.end);const a=`h${this.monthHeadingLevel}`;return t(n,{key:"e36815481d42e206d790f02ebae56134307f0bb1"},t("div",{key:"d2dd8172e8ba2ba9ac0b46c30d8c1fb15ee0454f",class:e},t("div",{key:"5d157b270db59c345e65b7d5e6dcea6a77aa91c1",class:"stzh-eventinfo__left"},t("div",{key:"05419bcc8815ba29b34ee30b57f4eaec0842ca6d",class:"stzh-eventinfo__main-event-day-name"},this.localization.$globals.dayNamesShort[s.getDay()]),t("div",{key:"5ae972b52f0421cee71348005e3ff4b4951854c8",class:"stzh-eventinfo__main-event-day"},s.getDate()<10&&"0",s.getDate()),t("div",{key:"16c739e003177607926cd1136c9eab260493f76f",class:"stzh-eventinfo__main-event-month"},this.localization.$globals.monthNamesShort[s.getMonth()])),t("div",{key:"2ecb7e2a55cc0f3eac1354c18a196fb61ebb1165",class:"stzh-eventinfo__right"},t("div",{key:"4c7e802a996e23d8a6939a92087ee6d581d46909"},t("div",{key:"2cc496e037d3e122a7e19319c773ea8fb55ff7bf",class:"stzh-eventinfo__head"},t("div",{key:"41de130350e8b118722a4af55bae3d251d595e2a",class:"stzh-eventinfo__main-date"},t("span",{key:"e853f910a2445c54b8019dacda1c15506f8e0358"},this.localization.$globals.dayNames[s.getDay()]),t("span",{key:"c2a98c3feeea3b8e805f202c4a47a77424e1b945"},this.dateAdapter.format(s,"date")),this.hasProperStartAndOrEndDate(s,i)&&t("span",{key:"b3675031da3f5266b11290c502eeb1a6e0d6d5ec"},this.dateAdapter.formatSpan(s,i,"time"))),this.calendarUrl&&t("div",{key:"9d611bc39968f5da171d962b08d498f37e9a6960",class:"stzh-eventinfo__main-event-link"},t("stzh-link",{key:"331a6f47a11341f56773006de0bdc1032b01935c",href:this.calendarUrl,label:this.calendarLabel||this.localization.addToCalendar,size:"inherit"}))),t("div",{key:"510773d29dc3c8bfa3e0c0c0f83da885881f8741",class:"stzh-eventinfo__text"},t("div",{key:"0c5bc4c79bf0e737526db9eef0bc69d25cb7a0f7",class:"stzh-eventinfo__location"},t("slot",{key:"49c70b4b49c9ed0d33437c4d5e14eceae4f0da50",name:"location"})),t("div",{key:"c7883912606ed5cf67a1de54a55ae5c82bd5adb2",class:"stzh-eventinfo__additional-info"},t("slot",{key:"11116d63d311f7c69e0b1f800da1fc1451861d42",name:"additional-info"})))),this._itemsGroupedByMonth.length>0&&t("div",{key:"89adf3c665e7560da07b10853becbfbc9f964850",class:"stzh-eventinfo__details-wrapper"},t("stzh-details",{key:"2dcf3044da3e8784bc5a0d7b625358264b7d2fc5",class:"stzh-eventinfo__details"},t("stzh-link",{key:"e5d104b8fa5792420a5fe0c843d5cdcd6af1e4a0",class:"stzh-eventinfo__details-link",icon:"calendar",size:"inherit"},t("span",{key:"f5a2b07bc371f1b6e59a2375a779141b4fd98bde",class:"stzh-eventinfo__details-link-expand"},this.localization.expandMoreDates),t("span",{key:"61af8286b97203310f6a8d3a7e9721539d13c920",class:"stzh-eventinfo__details-link-collapse"},this.localization.collapseMoreDates)),t("ul",{key:"7b439130e219df59fe6fd8ca308e7ae88fb58d3e",slot:"content",class:"stzh-eventinfo__month-list"},this._itemsGroupedByMonth.map((e=>t("li",{class:"stzh-eventinfo__month-list-item"},t(a,{class:"stzh-eventinfo__heading"},e.name),e.events.length>0&&t("ul",{class:"stzh-eventinfo__event-list"},e.events.map((e=>t("li",{class:"stzh-eventinfo__event-list-item"},t("span",{class:"stzh-eventinfo__event-datetime-wrapper"},t("span",{class:"stzh-eventinfo__event-date-wrapper"},t("span",{class:"stzh-eventinfo__event-weekday"},this.localization.$globals.dayNames[e.start.getDay()]),t("span",{class:"stzh-eventinfo__event-date"},this.dateAdapter.format(e.start,"date"))),t("span",{class:"stzh-eventinfo__event-time"},this.hasProperStartAndOrEndDate(e.start,e.end)&&this.dateAdapter.formatSpan(e.start,e.end,"time"))),t("span",{class:"stzh-eventinfo__event-link"},e.calendarUrl&&t("stzh-link",{href:e.calendarUrl,label:e.calendarLabel||this.localization.addToCalendar})))))))))))))))}get element(){return s(this)}static get watchers(){return{items:["itemsWatcher"],dateAdapter:["itemsWatcher"]}}};o.style=h;export{o as stzh_eventinfo};
-//# sourceMappingURL=p-e973ae31.entry.js.map
+import{r as e,h as t,a as n,g as s}from"./p-ef5985a3.js";import{s as i}from"./p-87c329f2.js";import"./p-dae15605.js";const a=".sc-stzh-eventinfo-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-eventinfo-h,[stzh-hidden].sc-stzh-eventinfo-h{display:none}.sc-stzh-eventinfo-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-eventinfo-h *.sc-stzh-eventinfo,.sc-stzh-eventinfo-h *.sc-stzh-eventinfo::before,.sc-stzh-eventinfo-h *.sc-stzh-eventinfo::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-eventinfo-h .has-focus.sc-stzh-eventinfo{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-eventinfo-h .stzh-fylingfocus-focused.sc-stzh-eventinfo{outline-style:none !important}.sc-stzh-eventinfo-h .stzh-fylingfocus-focused.sc-stzh-eventinfo::-moz-focus-inner{border:0 !important}.stzh-eventinfo.sc-stzh-eventinfo{display:flex}.stzh-eventinfo__left.sc-stzh-eventinfo{font-size:var(--stzh-font-nano-font-size);line-height:var(--stzh-font-nano-text-line-height);flex-shrink:0;text-transform:uppercase;display:flex;flex-direction:column;align-items:center;color:var(--stzh-color-black);background-color:var(--stzh-color-secondary30);padding-top:var(--stzh-space-small);width:4.5rem}@media screen and (min-width: 600px){.stzh-eventinfo__left.sc-stzh-eventinfo{width:5.5rem}}.stzh-eventinfo__main-event-day.sc-stzh-eventinfo{font-family:var(--stzh-font-family-heavy);font-weight:var(--stzh-font-weight-heavy);font-style:var(--stzh-font-style-heavy);font-size:var(--stzh-font-hecto-font-size);line-height:var(--stzh-font-hecto-text-line-height);letter-spacing:var(--stzh-font-hecto-text-letter-spacing);color:var(--stzh-color-primary70);margin-top:-0.4375rem;margin-bottom:-0.4375rem}.stzh-eventinfo__right.sc-stzh-eventinfo{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);flex-grow:1;color:var(--stzh-color-grey80);background-color:var(--stzh-color-grey10);padding-top:var(--stzh-space-small);padding-bottom:var(--stzh-space-medium);padding-left:var(--stzh-space-small);padding-right:var(--stzh-space-medium)}@media screen and (min-width: 600px){.stzh-eventinfo__right.sc-stzh-eventinfo{padding-left:var(--stzh-space-xlarge);padding-right:var(--stzh-space-xlarge)}}@media screen and (min-width: 900px){.stzh-eventinfo__right.sc-stzh-eventinfo{padding-top:var(--stzh-space-medium);padding-bottom:var(--stzh-space-large)}}@media screen and (min-width: 1260px){.stzh-eventinfo__right.sc-stzh-eventinfo{padding-top:var(--stzh-space-large);padding-bottom:var(--stzh-space-xlarge)}}.stzh-eventinfo__head.sc-stzh-eventinfo{display:flex;flex-direction:column;column-gap:var(--stzh-space-large)}@media screen and (min-width: 900px){.stzh-eventinfo__head.sc-stzh-eventinfo{flex-direction:row;justify-content:space-between}}.stzh-eventinfo__main-date.sc-stzh-eventinfo{display:flex;column-gap:var(--stzh-space-medium);flex-wrap:wrap}.stzh-eventinfo__main-event-link.sc-stzh-eventinfo{flex-shrink:0}.stzh-eventinfo__text.sc-stzh-eventinfo{display:flex;flex-direction:column;row-gap:var(--stzh-space-medium);column-gap:var(--stzh-space-large);margin-top:var(--stzh-space-medium)}@media screen and (min-width: 900px){.stzh-eventinfo__text.sc-stzh-eventinfo{margin-top:var(--stzh-space-xxsmall)}}@media screen and (min-width: 900px) and (min-width: 900px){.stzh-eventinfo__text.sc-stzh-eventinfo{margin-top:var(--stzh-space-xsmall)}}@media screen and (min-width: 900px) and (min-width: 1260px){.stzh-eventinfo__text.sc-stzh-eventinfo{margin-top:var(--stzh-space-small)}}.stzh-eventinfo__details-wrapper.sc-stzh-eventinfo{margin-top:var(--stzh-space-medium)}@media screen and (min-width: 900px){.stzh-eventinfo__details-wrapper.sc-stzh-eventinfo{margin-top:var(--stzh-space-xxsmall)}}@media screen and (min-width: 900px) and (min-width: 900px){.stzh-eventinfo__details-wrapper.sc-stzh-eventinfo{margin-top:var(--stzh-space-xsmall)}}@media screen and (min-width: 900px) and (min-width: 1260px){.stzh-eventinfo__details-wrapper.sc-stzh-eventinfo{margin-top:var(--stzh-space-small)}}.stzh-eventinfo__details.sc-stzh-eventinfo{color:inherit}.stzh-eventinfo__details-link-collapse.sc-stzh-eventinfo{display:none}.stzh-eventinfo__details-link[a11y-expanded].sc-stzh-eventinfo:not([a11y-expanded=false]) .stzh-eventinfo__details-link-collapse.sc-stzh-eventinfo{display:block}.stzh-eventinfo__details-link[a11y-expanded].sc-stzh-eventinfo:not([a11y-expanded=false]) .stzh-eventinfo__details-link-expand.sc-stzh-eventinfo{display:none}.stzh-eventinfo__month-list.sc-stzh-eventinfo,.stzh-eventinfo__event-list.sc-stzh-eventinfo{list-style:none;margin:0;padding:0}.stzh-eventinfo__month-list.sc-stzh-eventinfo{font-size:var(--stzh-font-curve-p1-default-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-p1-default-text-line-height, var(--stzh-font-milli-text-line-height));letter-spacing:var(--stzh-font-curve-p1-default-text-letter-spacing);display:grid;column-gap:var(--stzh-space-small)}@media screen and (min-width: 900px){.stzh-eventinfo__month-list.sc-stzh-eventinfo{font-size:var(--stzh-font-curve-p1-medium-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-p1-medium-text-line-height, var(--stzh-font-centi-text-line-height));letter-spacing:var(--stzh-font-curve-p1-medium-text-letter-spacing)}}@media screen and (min-width: 600px){.stzh-eventinfo__month-list.sc-stzh-eventinfo{grid-template-columns:minmax(0, 1fr) auto}}@media screen and (min-width: 900px){.stzh-eventinfo__month-list.sc-stzh-eventinfo{column-gap:var(--stzh-space-xxlarge);grid-template-columns:minmax(6.25rem, auto) minmax(11.25rem, auto) minmax(0, 1fr) auto}}.stzh-eventinfo__month-list-item.sc-stzh-eventinfo:not(:first-child) .stzh-eventinfo__heading.sc-stzh-eventinfo{margin-top:var(--stzh-space-medium)}@media screen and (min-width: 600px){.stzh-eventinfo__month-list-item.sc-stzh-eventinfo:not(:first-child) .stzh-eventinfo__heading.sc-stzh-eventinfo{margin-top:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-eventinfo__month-list-item.sc-stzh-eventinfo:not(:first-child) .stzh-eventinfo__heading.sc-stzh-eventinfo{margin-top:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-eventinfo__month-list-item.sc-stzh-eventinfo:not(:first-child) .stzh-eventinfo__heading.sc-stzh-eventinfo{margin-top:var(--stzh-space-xxlarge)}}.stzh-eventinfo__month-list-item.sc-stzh-eventinfo{display:contents}.stzh-eventinfo__month-list-item.sc-stzh-eventinfo:last-child .stzh-eventinfo__event-list-item.sc-stzh-eventinfo:last-child .stzh-eventinfo__event-weekday.sc-stzh-eventinfo,.stzh-eventinfo__month-list-item.sc-stzh-eventinfo:last-child .stzh-eventinfo__event-list-item.sc-stzh-eventinfo:last-child .stzh-eventinfo__event-date.sc-stzh-eventinfo,.stzh-eventinfo__month-list-item.sc-stzh-eventinfo:last-child .stzh-eventinfo__event-list-item.sc-stzh-eventinfo:last-child .stzh-eventinfo__event-time.sc-stzh-eventinfo,.stzh-eventinfo__month-list-item.sc-stzh-eventinfo:last-child .stzh-eventinfo__event-list-item.sc-stzh-eventinfo:last-child .stzh-eventinfo__event-link.sc-stzh-eventinfo,.stzh-eventinfo__month-list-item.sc-stzh-eventinfo:last-child .stzh-eventinfo__event-list-item.sc-stzh-eventinfo:last-child .stzh-eventinfo__event-datetime-wrapper.sc-stzh-eventinfo{margin-bottom:0px}.stzh-eventinfo__heading.sc-stzh-eventinfo{font-family:var(--stzh-font-family-title);font-weight:var(--stzh-font-weight-title);font-style:var(--stzh-font-style-title);font-size:var(--stzh-font-centi-font-size);line-height:var(--stzh-font-centi-heading-line-height);letter-spacing:var(--stzh-font-curve---heading-letter-spacing);margin-bottom:var(--stzh-space-xxsmall);margin-top:0;color:var(--stzh-color-primary70)}@media screen and (min-width: 900px){.stzh-eventinfo__heading.sc-stzh-eventinfo{margin-bottom:var(--stzh-space-xsmall)}}@media screen and (min-width: 1260px){.stzh-eventinfo__heading.sc-stzh-eventinfo{margin-bottom:var(--stzh-space-small)}}@media screen and (min-width: 600px){.stzh-eventinfo__heading.sc-stzh-eventinfo{grid-column:1/3}}@media screen and (min-width: 900px){.stzh-eventinfo__heading.sc-stzh-eventinfo{grid-column:1/5}}.stzh-eventinfo__event-list.sc-stzh-eventinfo{display:contents}.stzh-eventinfo__event-list-item.sc-stzh-eventinfo{display:contents}@media screen and (min-width: 900px){.stzh-eventinfo__event-weekday.sc-stzh-eventinfo,.stzh-eventinfo__event-date.sc-stzh-eventinfo,.stzh-eventinfo__event-time.sc-stzh-eventinfo{margin-bottom:var(--stzh-space-small)}}@media screen and (min-width: 1260px){.stzh-eventinfo__event-weekday.sc-stzh-eventinfo,.stzh-eventinfo__event-date.sc-stzh-eventinfo,.stzh-eventinfo__event-time.sc-stzh-eventinfo{margin-bottom:var(--stzh-space-medium)}}.stzh-eventinfo__event-link.sc-stzh-eventinfo{margin-bottom:var(--stzh-space-medium)}@media screen and (min-width: 900px){.stzh-eventinfo__event-link.sc-stzh-eventinfo{margin-bottom:var(--stzh-space-small)}}@media screen and (min-width: 1260px){.stzh-eventinfo__event-link.sc-stzh-eventinfo{margin-bottom:var(--stzh-space-medium)}}.stzh-eventinfo__event-datetime-wrapper.sc-stzh-eventinfo{display:grid}@media screen and (min-width: 600px) and (max-width: 899px){.stzh-eventinfo__event-datetime-wrapper.sc-stzh-eventinfo{margin-bottom:var(--stzh-space-medium)}}@media screen and (min-width: 900px){.stzh-eventinfo__event-datetime-wrapper.sc-stzh-eventinfo{display:contents}}.stzh-eventinfo__event-date-wrapper.sc-stzh-eventinfo{display:flex;flex-direction:column;column-gap:var(--stzh-space-xxlarge)}@media screen and (min-width: 900px){.stzh-eventinfo__event-date-wrapper.sc-stzh-eventinfo{display:contents}}@media screen and (min-width: 600px) and (max-width: 899px){.stzh-eventinfo__event-weekday.sc-stzh-eventinfo{min-width:5.625rem}}";const h=a;const o=class{constructor(t){e(this,t);this._items=[];this._itemsGroupedByMonth=[];this.init=()=>{const e=this.element.querySelectorAll('stzh-text[slot="location"], [slot="location"] stzh-text');const t=this.element.querySelectorAll('stzh-text[slot="additional-info"], [slot="additional-info"] stzh-text');e.forEach((e=>{i(e,{color:"inherit",curve:"none"})}));t.forEach((e=>{i(e,{color:"inherit",curve:"none"})}))};this.localization=undefined;this.monthHeadingLevel="4";this.start=undefined;this.end=undefined;this.calendarUrl=undefined;this.calendarLabel=undefined;this.itemsSortDirection="descending";this.items=undefined;this.dateAdapter=undefined}itemsWatcher(){if(!this.dateAdapter){return}const e=typeof this.items==="string"?JSON.parse(this.items):this.items;if(!e){return}const t=this.itemsSortDirection==="ascending";this._items=e.map((e=>Object.assign(Object.assign({},e),{start:e.start?new Date(e.start):undefined,end:e.end?new Date(e.end):undefined}))).sort(((e,n)=>{try{const s=e.start.getTime()-n.start.getTime();return t?s:-s}catch(e){return 1}}));const n=this._items.reduce(((e,n)=>{const s=(n.start.getMonth()+1).toString().padStart(2,"0");const i=`${n.start.getFullYear()}-${s}`;if(!e[i]){e[i]={name:this.localization.$globals.monthNames[n.start.getMonth()]+" "+n.start.getFullYear(),events:[]}}e[i].events.push(n);e[i].events.sort(((e,n)=>{const s=e.start.getTime()-n.start.getTime();return t?s:-s}));return e}),{});this._itemsGroupedByMonth=Object.values(n)}hasProperStartAndOrEndDate(e,t){return!(!!e&&e.getHours()===0&&!t)}async componentWillLoad(){if(!this.localization){this.localization=await window.stzhComponents.utils.fetchTranslations(this.element,"eventinfo")}if(!this.dateAdapter){this.dateAdapter=window.stzhComponents.utils.createFormatParseAdapter(this.localization.$formats,this.localization.$globals)}this.itemsWatcher()}connectedCallback(){this.init();this.observer=new MutationObserver(this.init);this.observer.observe(this.element,{childList:true,subtree:true})}disconnectedCallback(){if(this.observer){this.observer.disconnect()}}render(){const e={"stzh-eventinfo":true};const s=this.start&&new Date(this.start);const i=this.end&&new Date(this.end);const a=`h${this.monthHeadingLevel}`;return t(n,{key:"82bda2a0763e141162b814fbbb79118bac1e64dd"},t("div",{key:"572cb08bc805e2358c5c9f91c864297662f401d6",class:e},t("div",{key:"9a8761e876ac56b91a7982a600c969c848b1ef77",class:"stzh-eventinfo__left"},t("div",{key:"2cc2f87e763206a8fd3b62a9c9e62a653fdfdcf1",class:"stzh-eventinfo__main-event-day-name"},this.localization.$globals.dayNamesShort[s.getDay()]),t("div",{key:"eeba6906100f4c517d84e89eb1c74f4895c86c4a",class:"stzh-eventinfo__main-event-day"},s.getDate()<10&&"0",s.getDate()),t("div",{key:"8acffdcb6c6ace2f7ce0c9c10281d92dae9148e0",class:"stzh-eventinfo__main-event-month"},this.localization.$globals.monthNamesShort[s.getMonth()])),t("div",{key:"6abaf07acb610a15fd6cf906adeed9ca341cf753",class:"stzh-eventinfo__right"},t("div",{key:"5b8cc4a44cebc9982bfec745c3e900e9fdb93795"},t("div",{key:"5b039ffae534fa493a185e601d030bcc5b700788",class:"stzh-eventinfo__head"},t("div",{key:"59f0c8b4d549fff00949f2128cd66640d79283b4",class:"stzh-eventinfo__main-date"},t("span",{key:"ece12cb7af54075b7cc39e7ba08861697c72dddd"},this.localization.$globals.dayNames[s.getDay()]),t("span",{key:"7623b4ac184faa43e4bee6ebdc924bb17fdbc416"},this.dateAdapter.format(s,"date")),this.hasProperStartAndOrEndDate(s,i)&&t("span",{key:"ca0746ceeadcc8cc443f40de0e7aab9fe74f073b"},this.dateAdapter.formatSpan(s,i,"time"))),this.calendarUrl&&t("div",{key:"c7799622bbde73631618651eb3838e9f8e3a4f5c",class:"stzh-eventinfo__main-event-link"},t("stzh-link",{key:"ebf56e96788ecfd86d4601870b74f66485d55d38",href:this.calendarUrl,label:this.calendarLabel||this.localization.addToCalendar,size:"inherit"}))),t("div",{key:"bf2b28cd5b6be79142d5370d00ec50c2caccc81e",class:"stzh-eventinfo__text"},t("div",{key:"a455d25ecc8c272fc35ab170229dc277aaccf70a",class:"stzh-eventinfo__location"},t("slot",{key:"09c1ad33b9ef9829c6a3a68f9be202f3b4c0a16e",name:"location"})),t("div",{key:"f5210891a7c420582f8362b0137c956fadce42c4",class:"stzh-eventinfo__additional-info"},t("slot",{key:"b7aa8669b9f0c568eb57a91525274f2f989664c5",name:"additional-info"})))),this._itemsGroupedByMonth.length>0&&t("div",{key:"9e7d0b771900f6ed840b27f559a7b7c431e0239f",class:"stzh-eventinfo__details-wrapper"},t("stzh-details",{key:"a54fc00f9e00b23c9d8002667c6f4701877fcef2",class:"stzh-eventinfo__details"},t("stzh-link",{key:"5e11a21a53f60dbce4c9421ae2bf561ab39a3129",class:"stzh-eventinfo__details-link",icon:"calendar",size:"inherit"},t("span",{key:"df34267f5e0b57c7f47cc9d7f39ab308f13abfbe",class:"stzh-eventinfo__details-link-expand"},this.localization.expandMoreDates),t("span",{key:"3026ac1fa50c75e56f4b0a5470209a59f8b6a111",class:"stzh-eventinfo__details-link-collapse"},this.localization.collapseMoreDates)),t("ul",{key:"854dcc887188e193d587f81b5de31c0f61b9747f",slot:"content",class:"stzh-eventinfo__month-list"},this._itemsGroupedByMonth.map((e=>t("li",{class:"stzh-eventinfo__month-list-item"},t(a,{class:"stzh-eventinfo__heading"},e.name),e.events.length>0&&t("ul",{class:"stzh-eventinfo__event-list"},e.events.map((e=>t("li",{class:"stzh-eventinfo__event-list-item"},t("span",{class:"stzh-eventinfo__event-datetime-wrapper"},t("span",{class:"stzh-eventinfo__event-date-wrapper"},t("span",{class:"stzh-eventinfo__event-weekday"},this.localization.$globals.dayNames[e.start.getDay()]),t("span",{class:"stzh-eventinfo__event-date"},this.dateAdapter.format(e.start,"date"))),t("span",{class:"stzh-eventinfo__event-time"},this.hasProperStartAndOrEndDate(e.start,e.end)&&this.dateAdapter.formatSpan(e.start,e.end,"time"))),t("span",{class:"stzh-eventinfo__event-link"},e.calendarUrl&&t("stzh-link",{href:e.calendarUrl,label:e.calendarLabel||this.localization.addToCalendar})))))))))))))))}get element(){return s(this)}static get watchers(){return{items:["itemsWatcher"],dateAdapter:["itemsWatcher"]}}};o.style=h;export{o as stzh_eventinfo};
+//# sourceMappingURL=p-1617973f.entry.js.map