@oiz/stzh-components 2.7.0 → 2.8.0-beta

package/dist/stzh-components/{p-94a5e295.system.entry.js → p-0d302a14.system.entry.js}

@@ -1,2 +1,2 @@
-System.register(["./p-7b184ebb.system.js","./p-d4b7a303.system.js"],(function(s){"use strict";var t,o,i,n,e;return{setters:[function(s){t=s.r;o=s.h;i=s.a;n=s.g},function(s){e=s.s}],execute:function(){var a=".sc-stzh-actions-h{font-family:var(--stzh-font-family-regular);font-weight:var(--stzh-font-weight-regular);font-style:normal;color:var(--stzh-base-color);-webkit-box-sizing:border-box;box-sizing:border-box;display:block}[hidden].sc-stzh-actions-h{display:none}.sc-stzh-actions-h *.sc-stzh-actions,.sc-stzh-actions-h *.sc-stzh-actions::before,.sc-stzh-actions-h *.sc-stzh-actions::after{-webkit-box-sizing:border-box;box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness)}.sc-stzh-actions-h .sc-stzh-actions-s>[slot=primary],.sc-stzh-actions-h .sc-stzh-actions-s>[slot=secondary]{-ms-flex-positive:1;flex-grow:1;margin:var(--stzh-space-xxsmall)}.sc-stzh-actions-h[variant=cta] .sc-stzh-actions-s>[slot=primary],.sc-stzh-actions-h[variant=cta] .sc-stzh-actions-s>[slot=secondary]{-ms-flex-positive:0;flex-grow:0}.stzh-actions__actions.sc-stzh-actions{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;margin:calc(var(--stzh-space-xxsmall) * -1)}@media screen and (min-width: 600px){.stzh-actions__actions.sc-stzh-actions{-ms-flex-direction:row;flex-direction:row}}.stzh-actions__primary-actions.sc-stzh-actions,.stzh-actions__secondary-actions.sc-stzh-actions{display:-ms-flexbox;display:flex}.stzh-actions--dialog.sc-stzh-actions .stzh-actions__actions.sc-stzh-actions{-ms-flex-pack:end;justify-content:flex-end}.stzh-actions--process.sc-stzh-actions .stzh-actions__actions.sc-stzh-actions{-ms-flex-pack:justify;justify-content:space-between}.stzh-actions--has-border.sc-stzh-actions{padding-top:var(--stzh-space-medium);border-top:0.0625rem solid var(--stzh-base-border-color)}";var c=s("stzh_actions",function(){function s(s){var o=this;t(this,s);this.init=function(){var s=o.element.querySelectorAll('stzh-button[slot="secondary"], [slot="secondary"] stzh-button');s.forEach((function(s){e(s,{variant:"secondary"})}))};this.variant="form";this.withBorder=false}s.prototype.connectedCallback=function(){this.init();this.observer=new MutationObserver(this.init);this.observer.observe(this.element,{childList:true,subtree:true})};s.prototype.disconnectedCallback=function(){if(this.observer){this.observer.disconnect()}};s.prototype.render=function(){var s;var t=(s={"stzh-actions":true,"stzh-actions--has-border":this.withBorder},s["stzh-actions--".concat(this.variant)]=!!this.variant,s);return o(i,null,o("div",{class:t},o("div",{class:"stzh-actions__actions",role:"group"},o("div",{class:"stzh-actions__secondary-actions"},o("slot",{name:"secondary"})),o("div",{class:"stzh-actions__primary-actions"},o("slot",{name:"primary"})))))};Object.defineProperty(s.prototype,"element",{get:function(){return n(this)},enumerable:false,configurable:true});return s}());c.style=a}}}));
-//# sourceMappingURL=p-94a5e295.system.entry.js.map
+System.register(["./p-7b184ebb.system.js","./p-22a2f4c1.system.js"],(function(s){"use strict";var t,o,i,n,e;return{setters:[function(s){t=s.r;o=s.h;i=s.a;n=s.g},function(s){e=s.s}],execute:function(){var a=".sc-stzh-actions-h{font-family:var(--stzh-font-family-regular);font-weight:var(--stzh-font-weight-regular);font-style:normal;color:var(--stzh-base-color);-webkit-box-sizing:border-box;box-sizing:border-box;display:block}[hidden].sc-stzh-actions-h{display:none}.sc-stzh-actions-h *.sc-stzh-actions,.sc-stzh-actions-h *.sc-stzh-actions::before,.sc-stzh-actions-h *.sc-stzh-actions::after{-webkit-box-sizing:border-box;box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness)}.sc-stzh-actions-h .sc-stzh-actions-s>[slot=primary],.sc-stzh-actions-h .sc-stzh-actions-s>[slot=secondary]{-ms-flex-positive:1;flex-grow:1;margin:var(--stzh-space-xxsmall)}.sc-stzh-actions-h[variant=cta] .sc-stzh-actions-s>[slot=primary],.sc-stzh-actions-h[variant=cta] .sc-stzh-actions-s>[slot=secondary]{-ms-flex-positive:0;flex-grow:0}.stzh-actions__actions.sc-stzh-actions{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;margin:calc(var(--stzh-space-xxsmall) * -1)}@media screen and (min-width: 600px){.stzh-actions__actions.sc-stzh-actions{-ms-flex-direction:row;flex-direction:row}}.stzh-actions__primary-actions.sc-stzh-actions,.stzh-actions__secondary-actions.sc-stzh-actions{display:-ms-flexbox;display:flex}.stzh-actions--dialog.sc-stzh-actions .stzh-actions__actions.sc-stzh-actions{-ms-flex-pack:end;justify-content:flex-end}.stzh-actions--process.sc-stzh-actions .stzh-actions__actions.sc-stzh-actions{-ms-flex-pack:justify;justify-content:space-between}.stzh-actions--has-border.sc-stzh-actions{padding-top:var(--stzh-space-medium);border-top:0.0625rem solid var(--stzh-base-border-color)}";var c=s("stzh_actions",function(){function s(s){var o=this;t(this,s);this.init=function(){var s=o.element.querySelectorAll('stzh-button[slot="secondary"], [slot="secondary"] stzh-button');s.forEach((function(s){e(s,{variant:"secondary"})}))};this.variant="form";this.withBorder=false}s.prototype.connectedCallback=function(){this.init();this.observer=new MutationObserver(this.init);this.observer.observe(this.element,{childList:true,subtree:true})};s.prototype.disconnectedCallback=function(){if(this.observer){this.observer.disconnect()}};s.prototype.render=function(){var s;var t=(s={"stzh-actions":true,"stzh-actions--has-border":this.withBorder},s["stzh-actions--".concat(this.variant)]=!!this.variant,s);return o(i,null,o("div",{class:t},o("div",{class:"stzh-actions__actions",role:"group"},o("div",{class:"stzh-actions__secondary-actions"},o("slot",{name:"secondary"})),o("div",{class:"stzh-actions__primary-actions"},o("slot",{name:"primary"})))))};Object.defineProperty(s.prototype,"element",{get:function(){return n(this)},enumerable:false,configurable:true});return s}());c.style=a}}}));
+//# sourceMappingURL=p-0d302a14.system.entry.js.map

package/dist/stzh-components/p-1016d03d.system.entry.js

@@ -0,0 +1,2 @@
+System.register(["./p-7b184ebb.system.js"],(function(t){"use strict";var i,n,e;return{setters:[function(t){i=t.r;n=t.h;e=t.a}],execute:function(){var r=".sc-stzh-container-h{font-family:var(--stzh-font-family-regular);font-weight:var(--stzh-font-weight-regular);font-style:normal;color:var(--stzh-base-color);-webkit-box-sizing:border-box;box-sizing:border-box;display:block}[hidden].sc-stzh-container-h{display:none}.sc-stzh-container-h *.sc-stzh-container,.sc-stzh-container-h *.sc-stzh-container::before,.sc-stzh-container-h *.sc-stzh-container::after{-webkit-box-sizing:border-box;box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness)}.sc-stzh-container-h .sc-stzh-container-s stzh-header{margin-left:-1.25rem;margin-right:-1.25rem}@media screen and (min-width: 600px){.sc-stzh-container-h .sc-stzh-container-s stzh-header{margin-left:-2rem;margin-right:-2rem}}@media screen and (min-width: 1024px){.sc-stzh-container-h .sc-stzh-container-s stzh-header{margin-left:-2.5rem;margin-right:-2.5rem}}@media screen and (min-width: 1260px){.sc-stzh-container-h .sc-stzh-container-s stzh-header{margin-left:-5.5rem;margin-right:-5.5rem}}@media screen and (min-width: 1440px){.sc-stzh-container-h .sc-stzh-container-s stzh-header{margin-left:calc((100vw - 78.75rem - var(--stzh-scrollbar-width, 0px)) / -2);margin-right:calc((100vw - 78.75rem - var(--stzh-scrollbar-width, 0px)) / -2)}}.sc-stzh-container-h .sc-stzh-container-s stzh-container{position:relative;left:50%;right:50%;margin-left:-50vw;margin-right:-50vw;width:100vw;max-width:100vw}.sc-stzh-container-h .sc-stzh-container-s stzh-section[variant=highlight]{--highlight-horizontal-padding:1.25rem}@media screen and (min-width: 600px){.sc-stzh-container-h .sc-stzh-container-s stzh-section[variant=highlight]{--highlight-horizontal-padding:2rem}}@media screen and (min-width: 1024px){.sc-stzh-container-h .sc-stzh-container-s stzh-section[variant=highlight]{--highlight-horizontal-padding:2.5rem}}@media screen and (min-width: 1260px){.sc-stzh-container-h .sc-stzh-container-s stzh-section[variant=highlight]{--highlight-horizontal-padding:var(--stzh-space-xlarge)}}@media screen and (max-width: 1259px){.sc-stzh-container-h .sc-stzh-container-s stzh-section[variant=highlight]{position:relative;left:50%;right:50%;margin-left:-50vw;margin-right:-50vw;width:100vw;max-width:100vw}}.sc-stzh-container-h .sc-stzh-container-s stzh-row stzh-section[variant=highlight]{--highlight-horizontal-padding:var(--stzh-section-highlight-horizontal-padding)}@media screen and (max-width: 1259px){.sc-stzh-container-h .sc-stzh-container-s stzh-row stzh-section[variant=highlight]{left:initial;right:initial;margin-left:initial;margin-right:initial;width:initial;max-width:initial}}.stzh-container.sc-stzh-container{margin:0 1.25rem}@media screen and (min-width: 600px){.stzh-container.sc-stzh-container{margin:0 2rem}}@media screen and (min-width: 1024px){.stzh-container.sc-stzh-container{margin:0 2.5rem}}@media screen and (min-width: 1260px){.stzh-container.sc-stzh-container{margin:0 5.5rem}}@media screen and (min-width: 1440px){.stzh-container.sc-stzh-container{margin:0 auto;width:78.75rem}}";var h=t("stzh_container",function(){function t(t){i(this,t)}t.prototype.render=function(){return n(e,null,n("div",{class:"stzh-container"},n("slot",null)))};return t}());h.style=r}}}));
+//# sourceMappingURL=p-1016d03d.system.entry.js.map

package/dist/stzh-components/p-1016d03d.system.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["stzhContainerCss","StzhContainer","exports","class_1","prototype","render","h","Host","class"],"sources":["src/components/stzh-container/stzh-container.scss?tag=stzh-container&encapsulation=scoped","src/components/stzh-container/stzh-container.tsx"],"sourcesContent":[":host {\n  ::slotted(*) {\n    stzh-header {\n      margin-left: -$containerMargin;\n      margin-right: -$containerMargin;\n\n      @include mq($from: small) {\n        margin-left: -$containerMarginSmall;\n        margin-right: -$containerMarginSmall;\n      }\n\n      @include mq($from: medium) {\n        margin-left: -$containerMarginMedium;\n        margin-right: -$containerMarginMedium;\n      }\n\n      @include mq($from: large) {\n        margin-left: -$containerMarginLarge;\n        margin-right: -$containerMarginLarge;\n      }\n\n      @include mq($from: ultra) {\n        margin-left: calc((100vw - #{$containerMaxWidth} - var(--stzh-scrollbar-width, 0px)) / -2);\n        margin-right: calc((100vw - #{$containerMaxWidth} - var(--stzh-scrollbar-width, 0px)) / -2);\n      }\n    }\n\n    stzh-container {\n      position: relative;\n      left: 50%;\n      right: 50%;\n      margin-left: -50vw;\n      margin-right: -50vw;\n      width: 100vw;\n      max-width: 100vw;\n    }\n\n    stzh-section[variant=\"highlight\"] {\n      --highlight-horizontal-padding: #{$containerMargin};\n\n      @include mq($from: small) {\n        --highlight-horizontal-padding: #{$containerMarginSmall};\n      }\n\n      @include mq($from: medium) {\n        --highlight-horizontal-padding: #{$containerMarginMedium};\n      }\n\n      @include mq($from: large) {\n        --highlight-horizontal-padding: #{space('xlarge')};\n      }\n\n      @include mq($to: large) {\n        position: relative;\n        left: 50%;\n        right: 50%;\n        margin-left: -50vw;\n        margin-right: -50vw;\n        width: 100vw;\n        max-width: 100vw;\n      }\n    }\n\n    stzh-row stzh-section[variant=\"highlight\"] {\n      --highlight-horizontal-padding: #{$sectionHighlightHorizontalPadding};\n\n      @include mq($to: large) {\n        left: initial;\n        right: initial;\n        margin-left: initial;\n        margin-right: initial;\n        width: initial;\n        max-width: initial;\n      }\n    }\n  }\n}\n\n.stzh-container {\n  @include container;\n}\n","import {\n  Component,\n  Host,\n  h\n} from \"@stencil/core\";\n\n/**\n * @slot - Slot for any content\n */\n@Component({\n  tag: \"stzh-container\",\n  styleUrl: \"stzh-container.scss\",\n  scoped: true\n})\nexport class StzhContainer {\n  render() {\n    return (\n      <Host>\n        <div class=\"stzh-container\">\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"kJAAA,IAAMA,EAAmB,8gG,ICcZC,EAAaC,EAAA,4B,wBACxBC,EAAAC,UAAAC,OAAA,WACE,OACEC,EAACC,EAAI,KACHD,EAAA,OAAKE,MAAM,kBACTF,EAAA,c,WALgB,I"}

package/dist/stzh-components/p-1760118e.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as s,h as i,a as e,g as r}from"./p-9e02896c.js";import{a as h}from"./p-9a2c004f.js";import{a}from"./p-e787179c.js";import{f as o}from"./p-25a09313.js";import{c}from"./p-c8bcceac.js";import{VBZ as n}from"./index.esm.js";const l=".sc-stzh-vbz-majorticker-h{font-family:var(--stzh-font-family-regular);font-weight:var(--stzh-font-weight-regular);font-style:normal;color:var(--stzh-base-color);-webkit-box-sizing:border-box;box-sizing:border-box;display:block}[hidden].sc-stzh-vbz-majorticker-h{display:none}.sc-stzh-vbz-majorticker-h *.sc-stzh-vbz-majorticker,.sc-stzh-vbz-majorticker-h *.sc-stzh-vbz-majorticker::before,.sc-stzh-vbz-majorticker-h *.sc-stzh-vbz-majorticker::after{-webkit-box-sizing:border-box;box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness)}.stzh-vbz-majorticker__ghettobox.sc-stzh-vbz-majorticker{--stzh-base-invert-color:var(--stzh-color-black);--stzh-base-invert-color72:var(--stzh-color-black72);--stzh-base-invert-color32:var(--stzh-color-black32);--stzh-base-invert-color16:var(--stzh-color-black16);--background-color:var(--stzh-color-coral)}";const z=class{constructor(i){t(this,i);this.stzhDisturbanceFetched=s(this,"stzhDisturbanceFetched",7);this.disturbance=null;this.onGhettoboxOpen=()=>{this.ghettoboxShown=true};this.onGhettoboxClose=()=>{this.ghettoboxShown=false};this.api="https://fpbe.zvv.ch/restproxy/himsearch?format=json&accessId=unic&channels=ticker&additionalfields=tickers:VBZ&orderBy=LMOD_DESC&lang={lang}";this.data="";this.moreInfoLink="https://zvv.ch/zvv/{lang}/fahrplan/vl.html?himIds={id}";this.dateAdapter=undefined;this.localization=undefined;this.ghettoboxCloseTimeKey=undefined;this.ghettoboxShown=true}async getGhettoboxShown(){return this.ghettoboxShown}async getDisturbance(){return this.disturbance}async apiWatcher(t){if(!t){return}let s=this.api.replace(/\{lang\}/,this.localization.$locale);s=s+(s.includes("?")?"&":"?")+Date.now();const{data:i}=await h.get(s);this.data=i}async dataWatcher(t){var s,i;if(typeof t==="string"){this._data=JSON.parse(t)}else{this._data=t}const e=(i=(s=this._data)===null||s===void 0?void 0:s.Message)===null||i===void 0?void 0:i.find((t=>t.category===n.DISTURBANCE_INFORMATION&&t.baseType===n.BASE_TYPE_GLOBAL));if(e){const t=e.channel.filter((t=>t.name===n.CHANNEL_TICKER&&t.url)).map((t=>t.url)).reduce(((t,s)=>t.concat(s)),[]);const s=t.find((t=>t.url.indexOf(n.CHANNEL_INFO_URL_FILTER)!==-1));this.disturbance={id:e.id,head:e.head,text:a(e.text),startDate:new Date(`${e.sDate}T${e.sTime}+02:00`),endDate:new Date(`${e.eDate}T${e.eTime}+02:00`),altStart:e.altStart,altEnd:e.altEnd,infoUrl:s}}this.stzhDisturbanceFetched.emit({component:"stzh-vbz-majorticker",disturbance:this.disturbance})}async componentWillLoad(){if(!this.localization){this.localization=await o(this.element,"vbz-majorticker")}if(!this.dateAdapter){this.dateAdapter=c(this.localization.$formats,this.localization.$globals)}if(this.data){await this.dataWatcher(this.data)}else{await this.apiWatcher(this.api)}}render(){const t={"stzh-vbz-majorticker":true};return i(e,{hidden:!this.disturbance||!this.ghettoboxShown},i("div",{class:t},this.disturbance&&i("stzh-ghettobox",{onStzhOpen:this.onGhettoboxOpen,onStzhClose:this.onGhettoboxClose,class:"stzh-vbz-majorticker__ghettobox",hideClose:true,closeTimeKey:this.ghettoboxCloseTimeKey,mainTitle:this.disturbance.head,publishDate:this.disturbance.startDate},i("stzh-richtext",{innerHTML:this.disturbance.text}),this.disturbance.infoUrl?i("stzh-button",{slot:"button",href:this.disturbance.infoUrl.url},this.disturbance.infoUrl.name):i("stzh-button",{slot:"button",target:"_blank",href:this.moreInfoLink.replace(/\{lang\}/,this.localization.$locale).replace(/\{id\}/,this.disturbance.id)},this.localization.moreInfo))))}get element(){return r(this)}static get watchers(){return{api:["apiWatcher"],data:["dataWatcher"]}}};z.style=l;export{z as stzh_vbz_majorticker};
+//# sourceMappingURL=p-1760118e.entry.js.map

package/dist/stzh-components/{p-a1c02179.entry.js.map → p-1760118e.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["stzhVbzMajortickerCss","StzhVbzMajorticker","this","disturbance","onGhettoboxOpen","ghettoboxShown","onGhettoboxClose","async","newValue","apiUrl","api","replace","localization","$locale","includes","Date","now","data","axios","get","_data","JSON","parse","bigDisturbance","_b","_a","Message","find","message","category","VBZ","DISTURBANCE_INFORMATION","baseType","BASE_TYPE_GLOBAL","urls","channel","filter","name","CHANNEL_TICKER","url","map","reduce","a","b","concat","infoUrl","indexOf","CHANNEL_INFO_URL_FILTER","id","head","text","createParagraphsFromBrs","startDate","sDate","sTime","endDate","eDate","eTime","altStart","altEnd","stzhDisturbanceFetched","emit","component","fetchTranslations","element","dateAdapter","createGlobalAdapter","$formats","$globals","dataWatcher","apiWatcher","render","classes","h","Host","hidden","class","onStzhOpen","onStzhClose","hideClose","closeTimeKey","ghettoboxCloseTimeKey","mainTitle","publishDate","innerHTML","slot","href","target","moreInfoLink","moreInfo"],"sources":["./src/components/stzh-vbz-majorticker/stzh-vbz-majorticker.scss?tag=stzh-vbz-majorticker&encapsulation=scoped","./src/components/stzh-vbz-majorticker/stzh-vbz-majorticker.tsx"],"sourcesContent":[":host {\n}\n\n.stzh-vbz-majorticker {\n  &__ghettobox {\n    --stzh-base-invert-color: #{$colorBlack};\n    --stzh-base-invert-color72: #{$colorBlack72};\n    --stzh-base-invert-color32: #{$colorBlack32};\n    --stzh-base-invert-color16: #{$colorBlack16};\n\n    --background-color: #{$colorCoral};\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  State,\n  Watch,\n  Element,\n  Event,\n  EventEmitter,\n  Method\n} from \"@stencil/core\";\n\nimport axios from \"axios\";\n\nimport { createParagraphsFromBrs } from \"../../utils/string-utils\";\nimport { fetchTranslations } from \"../../utils/translation-utils\";\nimport { StzhLocaleAdapter, createGlobalAdapter } from \"../../utils/date-adapter\";\n\nimport { StzhVbzMajortickerLocalizedText } from \"./stzh-vbz-majorticker.localization\";\n\nimport {\n  VBZ,\n  StzhVbzMajortickerDisturbanceFetchedEvent,\n  StzhVbzMajortickerDisturbance,\n  VbzTickerInfoUrl\n} from \"../../index\";\n\n/**\n */\n@Component({\n  tag: \"stzh-vbz-majorticker\",\n  styleUrl: \"stzh-vbz-majorticker.scss\",\n  scoped: true\n})\nexport class StzhVbzMajorticker {\n  /** API URL (`{lang}` is replaced in the URL)  */\n  @Prop() api: string = \"https://fpbe.zvv.ch/restproxy/himsearch?format=json&accessId=unic&channels=ticker&additionalfields=tickers:VBZ&orderBy=LMOD_DESC&lang={lang}\";\n\n  /** Data to pass in directly (alternative for API call) */\n  @Prop() data: any = \"\";\n  private _data: any;\n\n  /** More info link (`{lang}` and `{id}` are replaced in the URL) */\n  @Prop() moreInfoLink: string = \"https://zvv.ch/zvv/{lang}/fahrplan/vl.html?himIds={id}\";\n\n  /**\n   * Date adapter, 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  /** Translation strings. */\n  @Prop() localization: StzhVbzMajortickerLocalizedText;\n\n  /** Overwrite ghettobox close time cookie option if needed */\n  @Prop() ghettoboxCloseTimeKey: string;\n\n  /** Whether ghettobox is shown (if has not been closed before) */\n  @State() ghettoboxShown: boolean = true;\n\n  @Element() element: HTMLStzhVbzMajortickerElement;\n\n  /** Event when major disturbance was fetched */\n  @Event() stzhDisturbanceFetched: EventEmitter<StzhVbzMajortickerDisturbanceFetchedEvent>;\n\n  /** Return whether ghettobox is shown (if has not been closed before) */\n  @Method()\n  async getGhettoboxShown() {\n    return this.ghettoboxShown;\n  }\n\n  /** Return fetched disturbance */\n  @Method()\n  async getDisturbance() {\n    return this.disturbance;\n  }\n\n  @Watch(\"api\")\n  async apiWatcher(newValue: string) {\n    if (!newValue) {\n      return;\n    }\n\n    let apiUrl = this.api.replace(/\\{lang\\}/, this.localization.$locale)\n    apiUrl = apiUrl + (apiUrl.includes(\"?\") ? \"&\" : \"?\") + Date.now();\n\n    // load data from API\n    const { data } = await axios.get(apiUrl);\n\n    this.data = data;\n  }\n\n  @Watch(\"data\")\n  async dataWatcher(newValue: any) {\n    if (typeof newValue === \"string\") {\n      this._data = JSON.parse(newValue);\n    } else {\n      this._data = newValue;\n    }\n\n    const bigDisturbance = this._data?.Message\n      ?.find(message => message.category === VBZ.DISTURBANCE_INFORMATION && message.baseType === VBZ.BASE_TYPE_GLOBAL);\n\n    if (bigDisturbance) {\n      const urls: VbzTickerInfoUrl[] = bigDisturbance.channel\n        .filter(channel => channel.name === VBZ.CHANNEL_TICKER && channel.url)\n        .map(channel => channel.url)\n        .reduce((a, b) => a.concat(b), []);\n\n      const infoUrl = urls\n        .find(url => url.url.indexOf(VBZ.CHANNEL_INFO_URL_FILTER) !== -1);\n\n      this.disturbance = {\n        id: bigDisturbance.id,\n        head: bigDisturbance.head,\n        text: createParagraphsFromBrs(bigDisturbance.text),\n        startDate: new Date(`${bigDisturbance.sDate}T${bigDisturbance.sTime}+02:00`),\n        endDate: new Date(`${bigDisturbance.eDate}T${bigDisturbance.eTime}+02:00`),\n        altStart: bigDisturbance.altStart,\n        altEnd: bigDisturbance.altEnd,\n        infoUrl: infoUrl\n      };\n    }\n\n    this.stzhDisturbanceFetched.emit({\n      component: \"stzh-vbz-majorticker\",\n      disturbance: this.disturbance\n    })\n  }\n\n  private disturbance: StzhVbzMajortickerDisturbance = null;\n\n  private onGhettoboxOpen = () => {\n    this.ghettoboxShown = true;\n  }\n\n  private onGhettoboxClose = () => {\n    this.ghettoboxShown = false;\n  }\n\n  async componentWillLoad() {\n    if (!this.localization) {\n      this.localization = await fetchTranslations(this.element, \"vbz-majorticker\");\n    }\n\n    if (!this.dateAdapter) {\n      this.dateAdapter = createGlobalAdapter(\n        this.localization.$formats,\n        this.localization.$globals\n      );\n    }\n\n    if (this.data) {\n      await this.dataWatcher(this.data);\n    } else {\n      await this.apiWatcher(this.api);\n    }\n  }\n\n  render() {\n    const classes = {\n      \"stzh-vbz-majorticker\": true\n    };\n\n    return (\n      <Host hidden={!this.disturbance || !this.ghettoboxShown}>\n        <div class={classes}>\n          {this.disturbance &&\n            <stzh-ghettobox\n              onStzhOpen={this.onGhettoboxOpen}\n              onStzhClose={this.onGhettoboxClose}\n              class=\"stzh-vbz-majorticker__ghettobox\"\n              hideClose={true}\n              closeTimeKey={this.ghettoboxCloseTimeKey}\n              mainTitle={this.disturbance.head}\n              publishDate={this.disturbance.startDate}\n            >\n              <stzh-richtext innerHTML={this.disturbance.text}></stzh-richtext>\n              {this.disturbance.infoUrl ?\n                <stzh-button\n                  slot=\"button\"\n                  href={this.disturbance.infoUrl.url}\n                >\n                  {this.disturbance.infoUrl.name}\n                </stzh-button>\n              :\n                <stzh-button\n                  slot=\"button\"\n                  target=\"_blank\"\n                  href={this.moreInfoLink\n                    .replace(/\\{lang\\}/, this.localization.$locale)\n                    .replace(/\\{id\\}/, this.disturbance.id)}\n                >\n                  {this.localization.moreInfo}\n                </stzh-button>\n              }\n            </stzh-ghettobox>\n          }\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}
+{"version":3,"names":["stzhVbzMajortickerCss","StzhVbzMajorticker","this","disturbance","onGhettoboxOpen","ghettoboxShown","onGhettoboxClose","async","newValue","apiUrl","api","replace","localization","$locale","includes","Date","now","data","axios","get","_data","JSON","parse","bigDisturbance","_b","_a","Message","find","message","category","VBZ","DISTURBANCE_INFORMATION","baseType","BASE_TYPE_GLOBAL","urls","channel","filter","name","CHANNEL_TICKER","url","map","reduce","a","b","concat","infoUrl","indexOf","CHANNEL_INFO_URL_FILTER","id","head","text","createParagraphsFromBrs","startDate","sDate","sTime","endDate","eDate","eTime","altStart","altEnd","stzhDisturbanceFetched","emit","component","fetchTranslations","element","dateAdapter","createGlobalAdapter","$formats","$globals","dataWatcher","apiWatcher","render","classes","h","Host","hidden","class","onStzhOpen","onStzhClose","hideClose","closeTimeKey","ghettoboxCloseTimeKey","mainTitle","publishDate","innerHTML","slot","href","target","moreInfoLink","moreInfo"],"sources":["./src/components/stzh-vbz-majorticker/stzh-vbz-majorticker.scss?tag=stzh-vbz-majorticker&encapsulation=scoped","./src/components/stzh-vbz-majorticker/stzh-vbz-majorticker.tsx"],"sourcesContent":[":host {\n}\n\n.stzh-vbz-majorticker {\n  &__ghettobox {\n    --stzh-base-invert-color: #{$colorBlack};\n    --stzh-base-invert-color72: #{$colorBlack72};\n    --stzh-base-invert-color32: #{$colorBlack32};\n    --stzh-base-invert-color16: #{$colorBlack16};\n\n    --background-color: #{$colorCoral};\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  State,\n  Watch,\n  Element,\n  Event,\n  EventEmitter,\n  Method\n} from \"@stencil/core\";\n\nimport axios from \"axios\";\n\nimport { createParagraphsFromBrs } from \"../../utils/string-utils\";\nimport { fetchTranslations } from \"../../utils/translation-utils\";\nimport { StzhLocaleAdapter, createGlobalAdapter } from \"../../utils/date-adapter\";\n\nimport { StzhVbzMajortickerLocalizedText } from \"./stzh-vbz-majorticker.localization\";\n\nimport {\n  VBZ,\n  StzhVbzMajortickerDisturbanceFetchedEvent,\n  StzhVbzMajortickerDisturbance,\n  VbzTickerInfoUrl\n} from \"../../index\";\n\n/**\n */\n@Component({\n  tag: \"stzh-vbz-majorticker\",\n  styleUrl: \"stzh-vbz-majorticker.scss\",\n  scoped: true\n})\nexport class StzhVbzMajorticker {\n  /** API URL (`{lang}` is replaced in the URL)  */\n  @Prop() api: string = \"https://fpbe.zvv.ch/restproxy/himsearch?format=json&accessId=unic&channels=ticker&additionalfields=tickers:VBZ&orderBy=LMOD_DESC&lang={lang}\";\n\n  /** Data to pass in directly (alternative for API call) */\n  @Prop() data: any = \"\";\n  private _data: any;\n\n  /** More info link (`{lang}` and `{id}` are replaced in the URL) */\n  @Prop() moreInfoLink: string = \"https://zvv.ch/zvv/{lang}/fahrplan/vl.html?himIds={id}\";\n\n  /**\n   * Date adapter, 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  /** Translation strings. */\n  @Prop() localization: StzhVbzMajortickerLocalizedText;\n\n  /** Overwrite ghettobox close time cookie option if needed */\n  @Prop() ghettoboxCloseTimeKey: string;\n\n  /** Whether ghettobox is shown (if has not been closed before) */\n  @State() ghettoboxShown: boolean = true;\n\n  @Element() element: HTMLStzhVbzMajortickerElement;\n\n  /** Event when major disturbance was fetched */\n  @Event() stzhDisturbanceFetched: EventEmitter<StzhVbzMajortickerDisturbanceFetchedEvent>;\n\n  /** Return whether ghettobox is shown (if has not been closed before) */\n  @Method()\n  async getGhettoboxShown() {\n    return this.ghettoboxShown;\n  }\n\n  /** Return fetched disturbance */\n  @Method()\n  async getDisturbance() {\n    return this.disturbance;\n  }\n\n  @Watch(\"api\")\n  async apiWatcher(newValue: string) {\n    if (!newValue) {\n      return;\n    }\n\n    let apiUrl = this.api.replace(/\\{lang\\}/, this.localization.$locale)\n    apiUrl = apiUrl + (apiUrl.includes(\"?\") ? \"&\" : \"?\") + Date.now();\n\n    // load data from API\n    const { data } = await axios.get(apiUrl);\n\n    this.data = data;\n  }\n\n  @Watch(\"data\")\n  async dataWatcher(newValue: any) {\n    if (typeof newValue === \"string\") {\n      this._data = JSON.parse(newValue);\n    } else {\n      this._data = newValue;\n    }\n\n    const bigDisturbance = this._data?.Message\n      ?.find(message => message.category === VBZ.DISTURBANCE_INFORMATION && message.baseType === VBZ.BASE_TYPE_GLOBAL);\n\n    if (bigDisturbance) {\n      const urls: VbzTickerInfoUrl[] = bigDisturbance.channel\n        .filter(channel => channel.name === VBZ.CHANNEL_TICKER && channel.url)\n        .map(channel => channel.url)\n        .reduce((a, b) => a.concat(b), []);\n\n      const infoUrl = urls\n        .find(url => url.url.indexOf(VBZ.CHANNEL_INFO_URL_FILTER) !== -1);\n\n      this.disturbance = {\n        id: bigDisturbance.id,\n        head: bigDisturbance.head,\n        text: createParagraphsFromBrs(bigDisturbance.text),\n        startDate: new Date(`${bigDisturbance.sDate}T${bigDisturbance.sTime}+02:00`),\n        endDate: new Date(`${bigDisturbance.eDate}T${bigDisturbance.eTime}+02:00`),\n        altStart: bigDisturbance.altStart,\n        altEnd: bigDisturbance.altEnd,\n        infoUrl: infoUrl\n      };\n    }\n\n    this.stzhDisturbanceFetched.emit({\n      component: \"stzh-vbz-majorticker\",\n      disturbance: this.disturbance\n    })\n  }\n\n  private disturbance: StzhVbzMajortickerDisturbance = null;\n\n  private onGhettoboxOpen = () => {\n    this.ghettoboxShown = true;\n  }\n\n  private onGhettoboxClose = () => {\n    this.ghettoboxShown = false;\n  }\n\n  async componentWillLoad() {\n    if (!this.localization) {\n      this.localization = await fetchTranslations(this.element, \"vbz-majorticker\");\n    }\n\n    if (!this.dateAdapter) {\n      this.dateAdapter = createGlobalAdapter(\n        this.localization.$formats,\n        this.localization.$globals\n      );\n    }\n\n    if (this.data) {\n      await this.dataWatcher(this.data);\n    } else {\n      await this.apiWatcher(this.api);\n    }\n  }\n\n  render() {\n    const classes = {\n      \"stzh-vbz-majorticker\": true\n    };\n\n    return (\n      <Host hidden={!this.disturbance || !this.ghettoboxShown}>\n        <div class={classes}>\n          {this.disturbance &&\n            <stzh-ghettobox\n              onStzhOpen={this.onGhettoboxOpen}\n              onStzhClose={this.onGhettoboxClose}\n              class=\"stzh-vbz-majorticker__ghettobox\"\n              hideClose={true}\n              closeTimeKey={this.ghettoboxCloseTimeKey}\n              mainTitle={this.disturbance.head}\n              publishDate={this.disturbance.startDate}\n            >\n              <stzh-richtext innerHTML={this.disturbance.text}></stzh-richtext>\n              {this.disturbance.infoUrl ?\n                <stzh-button\n                  slot=\"button\"\n                  href={this.disturbance.infoUrl.url}\n                >\n                  {this.disturbance.infoUrl.name}\n                </stzh-button>\n              :\n                <stzh-button\n                  slot=\"button\"\n                  target=\"_blank\"\n                  href={this.moreInfoLink\n                    .replace(/\\{lang\\}/, this.localization.$locale)\n                    .replace(/\\{id\\}/, this.disturbance.id)}\n                >\n                  {this.localization.moreInfo}\n                </stzh-button>\n              }\n            </stzh-ghettobox>\n          }\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/stzh-components/p-1ad68cac.system.entry.js

@@ -0,0 +1,2 @@
+var __awaiter=this&&this.__awaiter||function(t,i,s,n){function e(t){return t instanceof s?t:new s((function(i){i(t)}))}return new(s||(s=Promise))((function(s,h){function r(t){try{p(n.next(t))}catch(t){h(t)}}function u(t){try{p(n["throw"](t))}catch(t){h(t)}}function p(t){t.done?s(t.value):e(t.value).then(r,u)}p((n=n.apply(t,i||[])).next())}))};var __generator=this&&this.__generator||function(t,i){var s={label:0,sent:function(){if(h[0]&1)throw h[1];return h[1]},trys:[],ops:[]},n,e,h,r;return r={next:u(0),throw:u(1),return:u(2)},typeof Symbol==="function"&&(r[Symbol.iterator]=function(){return this}),r;function u(t){return function(i){return p([t,i])}}function p(u){if(n)throw new TypeError("Generator is already executing.");while(r&&(r=0,u[0]&&(s=0)),s)try{if(n=1,e&&(h=u[0]&2?e["return"]:u[0]?e["throw"]||((h=e["return"])&&h.call(e),0):e.next)&&!(h=h.call(e,u[1])).done)return h;if(e=0,h)u=[u[0]&2,h.value];switch(u[0]){case 0:case 1:h=u;break;case 4:s.label++;return{value:u[1],done:false};case 5:s.label++;e=u[1];u=[0];continue;case 7:u=s.ops.pop();s.trys.pop();continue;default:if(!(h=s.trys,h=h.length>0&&h[h.length-1])&&(u[0]===6||u[0]===2)){s=0;continue}if(u[0]===3&&(!h||u[1]>h[0]&&u[1]<h[3])){s.label=u[1];break}if(u[0]===6&&s.label<h[1]){s.label=h[1];h=u;break}if(h&&s.label<h[2]){s.label=h[2];s.ops.push(u);break}if(h[2])s.ops.pop();s.trys.pop();continue}u=i.call(t,s)}catch(t){u=[6,t];e=0}finally{n=h=0}if(u[0]&5)throw u[1];return{value:u[0]?u[1]:void 0,done:true}}};System.register(["./p-7b184ebb.system.js","./p-22a2f4c1.system.js","./p-a408bfba.system.js","./p-60521956.system.js"],(function(t){"use strict";var i,s,n,e,h,r,u,p;return{setters:[function(t){i=t.r;s=t.c;n=t.h;e=t.a;h=t.g},function(t){r=t.h},function(t){u=t.f},function(t){p=t.S}],execute:function(){var a='.sc-stzh-input-h{font-family:var(--stzh-font-family-regular);font-weight:var(--stzh-font-weight-regular);font-style:normal;color:var(--stzh-base-color);-webkit-box-sizing:border-box;box-sizing:border-box;display:block}[hidden].sc-stzh-input-h{display:none}.sc-stzh-input-h *.sc-stzh-input,.sc-stzh-input-h *.sc-stzh-input::before,.sc-stzh-input-h *.sc-stzh-input::after{-webkit-box-sizing:border-box;box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness)}.sc-stzh-input-h{--text-align:left;--input-width:100%;--padding:var(--stzh-space-xsmall) var(--stzh-space-medium);width:100%}.sc-stzh-input-h .sc-stzh-input-s>[slot=button-right],.stzh-input__button-right.sc-stzh-input{position:absolute;top:0;right:0}.sc-stzh-input-h .sc-stzh-input-s>stzh-button[slot=button-right][variant=input],.sc-stzh-input-h .sc-stzh-input-s>[slot=button-right] stzh-button[variant=input],.stzh-input__button-right[variant=input].sc-stzh-input{--border-color:transparent;--hover-border-color:transparent}.stzh-input.sc-stzh-input{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)}.stzh-input__marker-symbol.sc-stzh-input{font-family:var(--stzh-font-family-regular);font-weight:var(--stzh-font-weight-regular);font-style:normal}.stzh-input__marker-text.sc-stzh-input{border:0;clip:rect(0 0 0 0);-webkit-clip-path:inset(100%);clip-path:inset(100%);width:0.0625rem;height:0.0625rem;overflow:hidden;padding:0;position:absolute}.stzh-input__description-wrapper.sc-stzh-input{display:-ms-flexbox;display:flex;-ms-flex-direction:column-reverse;flex-direction:column-reverse}.stzh-input__error.sc-stzh-input,.stzh-input__description.sc-stzh-input{font-size:var(--stzh-font-micro-font-size);line-height:var(--stzh-font-micro-text-line-height);color:var(--stzh-base-color)}.stzh-input__error.sc-stzh-input{color:var(--stzh-color-error)}.stzh-input__error-list.sc-stzh-input{list-style:none;margin:0;padding:0}.stzh-input__description.sc-stzh-input{display:-ms-flexbox;display:flex;-ms-flex-align:start;align-items:flex-start}.stzh-input__description-long.sc-stzh-input{margin-left:var(--stzh-space-xxsmall);margin-top:0.1875rem}.stzh-input__description-long-popover.sc-stzh-input{--width:auto;--max-width:27.3125rem}.stzh-input__description-long-popover[open].sc-stzh-input:not([open=false]) .stzh-input__description-long-button.sc-stzh-input{color:var(--stzh-color-primary, var(--stzh-color-zueriblue))}.stzh-input__description-long-button.sc-stzh-input{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;font-family:inherit;padding:0;border:none;background-color:transparent;border-radius:0.5rem;cursor:pointer;-webkit-transition:color var(--stzh-base-transition-animation-speed);transition:color var(--stzh-base-transition-animation-speed);color:var(--stzh-base-lead-color)}.stzh-input__description-long-button.sc-stzh-input:hover{color:var(--stzh-color-primary, var(--stzh-color-zueriblue))}.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-xxsmall)}.stzh-input__field-wrapper.sc-stzh-input{position:relative;display:-ms-flexbox;display:flex;width:var(--input-width)}.stzh-input__input.sc-stzh-input{font-family:var(--stzh-font-family-regular);font-weight:var(--stzh-font-weight-regular);font-style:normal;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.0625rem solid var(--stzh-color-grey61);-webkit-transition-property:color, border-color;transition-property:color, border-color;-webkit-transition-duration:var(--stzh-base-transition-animation-speed);transition-duration:var(--stzh-base-transition-animation-speed);border-radius:var(--stzh-form-input-border-radius);padding:var(--padding);width:100%;color:var(--stzh-color-primary, var(--stzh-color-zueriblue));background:var(--stzh-color-white);-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:var(--text-align)}.stzh-input__input.sc-stzh-input::-webkit-input-placeholder{color:var(--stzh-color-grey61)}.stzh-input__input.sc-stzh-input:-moz-placeholder{color:var(--stzh-color-grey61)}.stzh-input__input.sc-stzh-input::-moz-placeholder{color:var(--stzh-color-grey61)}.stzh-input__input.sc-stzh-input:-ms-input-placeholder{color:var(--stzh-color-grey61)}.stzh-input__input.sc-stzh-input:hover,.stzh-input__input.sc-stzh-input:focus{color:var(--stzh-color-primary-hover, var(--stzh-color-zueribluedark));border-color:var(--stzh-color-primary-hover, var(--stzh-color-zueribluedark))}.stzh-input__input.sc-stzh-input::-ms-clear{display:none}.stzh-input__input.sc-stzh-input:-webkit-autofill{-webkit-background-clip:text;background-clip:text}.stzh-input__input.sc-stzh-input:-moz-placeholder-shown{text-overflow:ellipsis}.stzh-input__input.sc-stzh-input:-ms-input-placeholder{text-overflow:ellipsis}.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(--stzh-form-input-height)}.stzh-input__input--textarea.sc-stzh-input{min-height:var(--stzh-form-input-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:normal;font-size:var(--stzh-font-nano-font-size);line-height:var(--stzh-font-nano-text-line-height);text-overflow:ellipsis;white-space:nowrap;overflow:hidden;color:var(--stzh-color-grey61);width:auto;position:absolute;top:calc(var(--stzh-form-input-height) / 2);left:calc(var(--stzh-space-medium) + 0.0625rem);max-width:calc(100% - var(--stzh-space-medium) * 2);-webkit-transform:translateY(-50%);transform:translateY(-50%);-webkit-transition:all var(--stzh-base-transition-animation-speed);transition:all var(--stzh-base-transition-animation-speed);pointer-events:none}.stzh-input__label.sc-stzh-input:empty{display:none}.stzh-input__label.sc-stzh-input::before{content:"";display:none;background:var(--stzh-color-white);position:absolute;width:100%;z-index:-1;left:0;top:50%;margin-top:-0.5px;height:0.125rem}.stzh-input__input.sc-stzh-input:hover+.stzh-input__label.sc-stzh-input,.stzh-input__input.sc-stzh-input:focus+.stzh-input__label.sc-stzh-input{color:var(--stzh-color-primary-hover, var(--stzh-color-zueribluedark))}.stzh-input__button-right.sc-stzh-input{display:none}.stzh-input__button-right[disabled].sc-stzh-input:not([disabled=false])[variant=input]{--color:var(--stzh-color-grey61);--background-color:transparent;--border-color:transparent;--hover-color:var(--stzh-color-primary-hover, var(--stzh-color-zueribluedark));--hover-background-color:transparent;--hover-border-color:transparent}.stzh-input--is-clearable.stzh-input--is-filled.sc-stzh-input:not(.stzh-input--is-readonly):not(.stzh-input--is-disabled) .stzh-input__button-right.sc-stzh-input,.stzh-input--type-search.sc-stzh-input .stzh-input__button-right.sc-stzh-input{display:block}.stzh-input--type-search.sc-stzh-input:not(.stzh-input--is-filled) .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--is-filled.sc-stzh-input .stzh-input__button-right.is-search.sc-stzh-input{pointer-events:initial}.stzh-input.sc-stzh-input:not(.stzh-input--is-readonly):not(.stzh-input--is-disabled) .stzh-input__input.sc-stzh-input:focus+.stzh-input__label.sc-stzh-input,.stzh-input--has-fixed-label.sc-stzh-input .stzh-input__label.sc-stzh-input,.stzh-input--is-filled.sc-stzh-input .stzh-input__label.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,.stzh-input--is-invalid.sc-stzh-input .stzh-input__label.sc-stzh-input{display:block;top:0;left:calc(var(--stzh-space-medium) - var(--stzh-space-xxsmall));height:1.25rem;line-height:1.25rem;padding:0 var(--stzh-space-xxsmall);max-width:calc(100% - var(--stzh-space-small) * 2);pointer-events:all}.stzh-input.sc-stzh-input:not(.stzh-input--is-readonly):not(.stzh-input--is-disabled) .stzh-input__input.sc-stzh-input:focus+.stzh-input__label.sc-stzh-input:not(:empty)::before,.stzh-input--has-fixed-label.sc-stzh-input .stzh-input__label.sc-stzh-input:not(:empty)::before,.stzh-input--is-filled.sc-stzh-input .stzh-input__label.sc-stzh-input:not(:empty)::before,.stzh-input--is-readonly.sc-stzh-input .stzh-input__label.sc-stzh-input:not(:empty)::before,.stzh-input--is-disabled.sc-stzh-input .stzh-input__label.sc-stzh-input:not(:empty)::before,.stzh-input--is-invalid.sc-stzh-input .stzh-input__label.sc-stzh-input:not(:empty)::before{display:block}.stzh-input--has-button-right.sc-stzh-input .stzh-input__input.sc-stzh-input{padding-right:calc(var(--stzh-space-xsmall) + var(--stzh-form-input-height))}.stzh-input--has-button-right.sc-stzh-input .stzh-input__label.sc-stzh-input{max-width:calc(100% - (var(--stzh-space-medium) + 0.0625rem) * 2 - var(--stzh-form-input-height))}.stzh-input--has-button-right.stzh-input.sc-stzh-input:not(.stzh-input--is-readonly):not(.stzh-input--is-disabled) .stzh-input__input.sc-stzh-input:focus+.stzh-input__label.sc-stzh-input,.stzh-input--has-button-right.stzh-input--has-fixed-label.sc-stzh-input .stzh-input__label.sc-stzh-input,.stzh-input--has-button-right.stzh-input--is-filled.sc-stzh-input .stzh-input__label.sc-stzh-input,.stzh-input--has-button-right.stzh-input--is-readonly.sc-stzh-input .stzh-input__label.sc-stzh-input,.stzh-input--has-button-right.stzh-input--is-disabled.sc-stzh-input .stzh-input__label.sc-stzh-input,.stzh-input--has-button-right.stzh-input--is-invalid.sc-stzh-input .stzh-input__label.sc-stzh-input{max-width:calc(100% - var(--stzh-space-medium) - var(--stzh-space-xxsmall) - 0.0625rem + var(--stzh-space-xxsmall) - var(--stzh-form-input-height))}.stzh-input--size-small.sc-stzh-input{font-size:var(--stzh-font-micro-font-size);line-height:var(--stzh-font-micro-text-line-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--size-small.sc-stzh-input .stzh-input__input--input.sc-stzh-input{height:var(--stzh-form-input-small-height)}.stzh-input--size-small.sc-stzh-input .stzh-input__input--textarea.sc-stzh-input{min-height:var(--stzh-form-input-small-height)}.stzh-input--size-small.sc-stzh-input .stzh-input__label.sc-stzh-input{top:calc(var(--stzh-form-input-small-height) / 2)}.stzh-input--size-small.stzh-input.sc-stzh-input:not(.stzh-input--is-readonly):not(.stzh-input--is-disabled) .stzh-input__input.sc-stzh-input:focus+.stzh-input__label.sc-stzh-input,.stzh-input--size-small.stzh-input--has-fixed-label.sc-stzh-input .stzh-input__label.sc-stzh-input,.stzh-input--size-small.stzh-input--is-filled.sc-stzh-input .stzh-input__label.sc-stzh-input,.stzh-input--size-small.stzh-input--is-readonly.sc-stzh-input .stzh-input__label.sc-stzh-input,.stzh-input--size-small.stzh-input--is-disabled.sc-stzh-input .stzh-input__label.sc-stzh-input,.stzh-input--size-small.stzh-input--is-invalid.sc-stzh-input .stzh-input__label.sc-stzh-input{top:0}.stzh-input--size-small.stzh-input--has-button-right.sc-stzh-input .stzh-input__input.sc-stzh-input{padding-right:calc(var(--stzh-space-xxsmall) + var(--stzh-form-input-small-height))}.stzh-input--size-small.stzh-input--has-button-right.sc-stzh-input .stzh-input__label.sc-stzh-input{max-width:calc(100% - (var(--stzh-space-medium) + 0.0625rem) * 2 - var(--stzh-form-input-small-height))}.stzh-input--size-small.stzh-input--has-button-right.stzh-input.sc-stzh-input:not(.stzh-input--is-readonly):not(.stzh-input--is-disabled) .stzh-input__input.sc-stzh-input:focus+.stzh-input__label.sc-stzh-input,.stzh-input--size-small.stzh-input--has-button-right.stzh-input--has-fixed-label.sc-stzh-input .stzh-input__label.sc-stzh-input,.stzh-input--size-small.stzh-input--has-button-right.stzh-input--is-filled.sc-stzh-input .stzh-input__label.sc-stzh-input,.stzh-input--size-small.stzh-input--has-button-right.stzh-input--is-readonly.sc-stzh-input .stzh-input__label.sc-stzh-input,.stzh-input--size-small.stzh-input--has-button-right.stzh-input--is-disabled.sc-stzh-input .stzh-input__label.sc-stzh-input,.stzh-input--size-small.stzh-input--has-button-right.stzh-input--is-invalid.sc-stzh-input .stzh-input__label.sc-stzh-input{max-width:calc(100% - var(--stzh-space-medium) - var(--stzh-space-xxsmall) - 0.0625rem + var(--stzh-space-xsmall) - var(--stzh-form-input-small-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{-webkit-appearance:none;appearance:none;margin:0}.stzh-input.sc-stzh-input:not(.stzh-input--has-spin) .stzh-input__input[type=number].sc-stzh-input{-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield}.stzh-input--has-label-hidden.sc-stzh-input .stzh-input__label.sc-stzh-input{border:0;clip:rect(0 0 0 0);-webkit-clip-path:inset(100%);clip-path:inset(100%);width:0.0625rem;height:0.0625rem;overflow:hidden;padding:0;position:absolute}.stzh-input--is-invalid.sc-stzh-input .stzh-input__input.sc-stzh-input,.stzh-input--is-invalid.sc-stzh-input .stzh-input__label.sc-stzh-input,.stzh-input--is-invalid.sc-stzh-input .stzh-input__input.sc-stzh-input+.stzh-input__label.sc-stzh-input{color:var(--stzh-color-error)}.stzh-input--is-invalid.sc-stzh-input .stzh-input__input.sc-stzh-input{border-color:var(--stzh-color-error)}.stzh-input--is-invalid.sc-stzh-input .stzh-input__input.sc-stzh-input::-webkit-input-placeholder{color:var(--stzh-color-error)}.stzh-input--is-invalid.sc-stzh-input .stzh-input__input.sc-stzh-input:-moz-placeholder{color:var(--stzh-color-error)}.stzh-input--is-invalid.sc-stzh-input .stzh-input__input.sc-stzh-input::-moz-placeholder{color:var(--stzh-color-error)}.stzh-input--is-invalid.sc-stzh-input .stzh-input__input.sc-stzh-input:-ms-input-placeholder{color:var(--stzh-color-error)}.stzh-input--is-readonly.sc-stzh-input .stzh-input__input.sc-stzh-input,.stzh-input--is-readonly.sc-stzh-input .stzh-input__input.sc-stzh-input+.stzh-input__label.sc-stzh-input,.stzh-input--is-disabled.sc-stzh-input .stzh-input__input.sc-stzh-input,.stzh-input--is-disabled.sc-stzh-input .stzh-input__input.sc-stzh-input+.stzh-input__label.sc-stzh-input{color:var(--stzh-color-grey61)}.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{color:var(--stzh-color-grey61);border-color:transparent;background-color:var(--stzh-color-black8);cursor:not-allowed}.stzh-input--is-readonly.sc-stzh-input .stzh-input__input.sc-stzh-input::-webkit-input-placeholder,.stzh-input--is-disabled.sc-stzh-input .stzh-input__input.sc-stzh-input::-webkit-input-placeholder{color:var(--stzh-color-grey61)}.stzh-input--is-readonly.sc-stzh-input .stzh-input__input.sc-stzh-input:-moz-placeholder,.stzh-input--is-disabled.sc-stzh-input .stzh-input__input.sc-stzh-input:-moz-placeholder{color:var(--stzh-color-grey61)}.stzh-input--is-readonly.sc-stzh-input .stzh-input__input.sc-stzh-input::-moz-placeholder,.stzh-input--is-disabled.sc-stzh-input .stzh-input__input.sc-stzh-input::-moz-placeholder{color:var(--stzh-color-grey61)}.stzh-input--is-readonly.sc-stzh-input .stzh-input__input.sc-stzh-input:-ms-input-placeholder,.stzh-input--is-disabled.sc-stzh-input .stzh-input__input.sc-stzh-input:-ms-input-placeholder{color:var(--stzh-color-grey61)}.stzh-input--is-readonly.sc-stzh-input .stzh-input__input.sc-stzh-input:hover,.stzh-input--is-readonly.sc-stzh-input .stzh-input__input.sc-stzh-input:focus,.stzh-input--is-disabled.sc-stzh-input .stzh-input__input.sc-stzh-input:hover,.stzh-input--is-disabled.sc-stzh-input .stzh-input__input.sc-stzh-input:focus{border-color:transparent}.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}.stzh-input--is-readonly.sc-stzh-input .stzh-input__label.sc-stzh-input::before,.stzh-input--is-disabled.sc-stzh-input .stzh-input__label.sc-stzh-input::before{background:transparent}.stzh-input--is-readonly.sc-stzh-input .stzh-input__button-right[disabled].sc-stzh-input:not([disabled=false])[variant=input],.stzh-input--is-disabled.sc-stzh-input .stzh-input__button-right[disabled].sc-stzh-input:not([disabled=false])[variant=input]{--color:var(--stzh-color-grey61);--hover-color:var(--stzh-color-grey61)}';var o=0;var l=t("stzh_input",function(){function t(t){var n=this;i(this,t);this.stzhChange=s(this,"stzhChange",7);this.stzhFocus=s(this,"stzhFocus",7);this.stzhBlur=s(this,"stzhBlur",7);this.focusedByInput=false;this.onClearClick=function(t){n.value="";n.input.focus();n.stzhChange.emit({component:"stzh-input",originalEvent:t,value:n.value})};this.onInput=function(t){n.value=n.input.value;n.stzhChange.emit({component:"stzh-input",originalEvent:t,value:n.value})};this.onRootFocus=function(){if(!n.focusedByInput){n.setFocus()}n.focusedByInput=false};this.onFocus=function(t){n.focusedByInput=true;var i=new FocusEvent("focus",{view:window,bubbles:false,cancelable:false});n.element.dispatchEvent(i);n.stzhFocus.emit({component:"stzh-input",originalEvent:t})};this.onBlur=function(t){n.input.value=n.input.value;var i=new FocusEvent("blur",{view:window,bubbles:false,cancelable:false});n.element.dispatchEvent(i);n.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.showMarker=false;this.minlength=undefined;this.maxlength=undefined;this.name=undefined;this.value="";this.description=undefined;this.descriptionLong=undefined;this.error=undefined;this.invalid=false;this.required=false;this.inputmode=undefined;this.autocomplete="on";this.noAutocomplete=false;this.label="";this.labelHidden=false;this.size="default";this.a11yDescribedby="";this.filled=undefined}t.prototype.setFocus=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){this.input.focus();return[2]}))}))};t.prototype.valueWatcher=function(t){this.filled=t!==""};t.prototype.errorWatcher=function(t){if(typeof t==="string"){try{this._error=JSON.parse(t)}catch(i){if(t){this._error=[t]}else{this._error=[]}}}else if(t){this._error=t}else{this._error=[]}this.invalid=this._error.length>0};t.prototype.typeWatcher=function(t){var i=["text","search","password","email","url","tel","number"];if(!this.multiline&&!i.includes(t)){throw new Error("Type ".concat(t," not supported"))}};t.prototype.renderTextarea=function(){var t=this;return n("textarea",{class:"stzh-input__input stzh-input__input--textarea",ref:function(i){return t.input=i},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":"".concat(this.inputId,"-description ").concat(this.a11yDescribedby),"aria-required":this.required?"true":"false","aria-invalid":this.invalid?"true":"false",onInput:this.onInput,onFocus:this.onFocus,onBlur:this.onBlur})};t.prototype.renderInput=function(){var t=this;return n("input",{class:"stzh-input__input stzh-input__input--input",ref:function(i){return t.input=i},id:this.inputId,type:this.type,name:this.name,value:this.value,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":"".concat(this.inputId,"-description ").concat(this.a11yDescribedby),"aria-required":this.required?"true":"false","aria-invalid":this.invalid?"true":"false",onInput:this.onInput,onFocus:this.onFocus,onBlur:this.onBlur})};t.prototype.componentWillLoad=function(){return __awaiter(this,void 0,void 0,(function(){var t;return __generator(this,(function(i){switch(i.label){case 0:this.inputId="stzh-input-".concat(o++);this.typeWatcher(this.type);this.valueWatcher(this.value);this.errorWatcher(this.error);if(!!this.localization)return[3,2];t=this;return[4,u(this.element,"input")];case 1:t.localization=i.sent();i.label=2;case 2:return[2]}}))}))};t.prototype.render=function(){var t;var i;var s=r(this.element,"button-right");var h=r(this.element,"description")||!!this.description;var u=r(this.element,"description-long")||!!this.descriptionLong;var a=r(this.element,"error")||!!this.error;var o=(t={"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":u,"stzh-input--has-error":a,"stzh-input--has-spin":this.showSpin,"stzh-input--is-invalid":this.invalid,"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-clearable":this.clearable,"stzh-input--has-fixed-label":((i=window===null||window===void 0?void 0:window.stzhComponents)===null||i===void 0?void 0:i.labels)==="fixed","stzh-input--has-label-hidden":this.labelHidden},t["stzh-input--size-".concat(this.size)]=!!this.size,t["stzh-input--type-".concat(this.type)]=!!this.type,t);return n(e,{tabindex:this.disabled?null:"-1",onFocus:this.onRootFocus},n("div",{class:o},n("div",{class:"stzh-input__field-wrapper"},this.multiline?this.renderTextarea():this.renderInput(),n("label",{class:"stzh-input__label",htmlFor:this.inputId},this.label?this.label:n("slot",null),this.showMarker&&n("span",{class:"stzh-input__marker"},n("span",{class:"stzh-input__marker-symbol","aria-hidden":"true"},this.required?this.localization.$globals.requiredFieldMarker:this.localization.$globals.optionalFieldMarker),n("span",{class:"stzh-input__marker-text"},this.required?this.localization.$globals.requiredFieldText:this.localization.$globals.optionalFieldText))),this.clearable||this.type==="search"?n("stzh-button",{class:"stzh-input__button-right",icon:this.disabled||this.readonly||!this.filled?"search":"close-circle","icon-only":true,variant:"input",onClick:this.onClearClick,disabled:this.disabled||this.readonly||!this.filled,a11yLabel:this.localization.$globals.clearButtonLabel,"aria-controls":this.inputId}):n("slot",{name:"button-right"})),n(p,{classPrefix:"stzh-input",id:"".concat(this.inputId,"-description"),error:this._error,description:this.description,descriptionLong:this.descriptionLong,descriptionLongUsed:u,moreInfoButtonLabel:this.localization.$globals.moreInfoButtonLabel})))};Object.defineProperty(t.prototype,"element",{get:function(){return h(this)},enumerable:false,configurable:true});Object.defineProperty(t,"watchers",{get:function(){return{value:["valueWatcher"],error:["errorWatcher"],type:["typeWatcher"]}},enumerable:false,configurable:true});return t}());l.style=a}}}));
+//# sourceMappingURL=p-1ad68cac.system.entry.js.map

package/dist/stzh-components/p-1ad68cac.system.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["stzhInputCss","inputCounter","StzhInput","exports","this","focusedByInput","onClearClick","event","_this","value","input","focus","stzhChange","emit","component","originalEvent","onInput","onRootFocus","setFocus","onFocus","focusEvent","FocusEvent","view","window","bubbles","cancelable","element","dispatchEvent","stzhFocus","onBlur","blurEvent","stzhBlur","class_1","prototype","valueWatcher","newValue","filled","errorWatcher","_error","JSON","parse","e","invalid","length","typeWatcher","types","multiline","includes","Error","concat","renderTextarea","h","class","ref","el","id","inputId","name","rows","disabled","readonly","minlength","maxlength","a11yDescribedby","required","renderInput","type","min","max","step","inputmode","autocomplete","noAutocomplete","undefined","componentWillLoad","error","localization","_b","fetchTranslations","_c","sent","render","buttonRightSlotUsed","hasSlot","descriptionUsed","description","descriptionLongUsed","descriptionLong","errorUsed","classes","clearable","showSpin","_a","stzhComponents","labels","labelHidden","size","Host","tabindex","htmlFor","label","showMarker","$globals","requiredFieldMarker","optionalFieldMarker","requiredFieldText","optionalFieldText","icon","variant","onClick","a11yLabel","clearButtonLabel","StzhInputDescription","classPrefix","moreInfoButtonLabel"],"sources":["src/components/stzh-input/stzh-input.scss?tag=stzh-input&encapsulation=scoped","src/components/stzh-input/stzh-input.tsx"],"sourcesContent":[":host {\n  --text-align: left;\n  --input-width: 100%;\n  --padding: #{space('xsmall')} #{space('medium')};\n  width: 100%;\n}\n\n:host ::slotted([slot=\"button-right\"]),\n.stzh-input__button-right {\n  position: absolute;\n  top: 0;\n  right: 0;\n}\n\n:host ::slotted(stzh-button[slot=\"button-right\"][variant=\"input\"]),\n:host ::slotted([slot=\"button-right\"]) stzh-button[variant=\"input\"],\n.stzh-input__button-right[variant=\"input\"] {\n  --border-color: transparent;\n  --hover-border-color: transparent;\n}\n\n.stzh-input {\n\t@include input-description;\n\t@include fontSize('milli');\n\n  &__field-wrapper {\n    position: relative;\n    display: flex;\n    width: var(--input-width);\n  }\n\n  &__input {\n    @include font;\n    @include fontSize('milli');\n    border: 1px solid $formBorderColor;\n    transition-property: color, border-color;\n    transition-duration: $baseTransitionAnimationSpeed;\n    border-radius: $formInputBorderRadius;\n    padding: var(--padding);\n    width: 100%;\n    color: $colorPrimary;\n    background: $colorWhite;\n    appearance: none;\n    text-align: var(--text-align);\n\n    @include placeholder {\n      color: $formInputPlaceholderColor;\n    }\n\n    &:hover,\n    &:focus {\n      color: $colorPrimaryHover;\n      border-color: $colorPrimaryHover;\n    }\n\n    // remove clear button for IE11\n    &::-ms-clear {\n      display: none;\n    }\n\n    // prevent ugly autofill background color in chrome\n    &:-webkit-autofill {\n      background-clip: text;\n    }\n\n    // show ellipsis for placeholders that are too long\n    &:placeholder-shown {\n      text-overflow: ellipsis;\n    }\n\n    // hide search clear icon on chrome\n    &[type=\"search\"]::-webkit-search-decoration,\n    &[type=\"search\"]::-webkit-search-cancel-button,\n    &[type=\"search\"]::-webkit-search-results-button,\n    &[type=\"search\"]::-webkit-search-results-decoration {\n      -webkit-appearance: none;\n    }\n\n    /* Normal inputs */\n\n    &--input {\n      height: $formInputHeight;\n    }\n\n    /* Textarea */\n\n    &--textarea {\n      min-height: $formInputHeight;\n      resize: vertical;\n    }\n  }\n\n  &__label {\n    @include font('heavy');\n    @include fontSize('nano');\n    @include truncate;\n    color: $formColor;\n    width: auto;\n    position: absolute;\n    top: calc(#{$formInputHeight} / 2);\n    // padding-left (medium) + border-left\n    left: calc(#{space('medium')} + 1px);\n    max-width: calc(100% - #{space('medium')} * 2);\n    transform: translateY(-50%);\n    transition: all $baseTransitionAnimationSpeed;\n    pointer-events: none;\n\n    &:empty {\n      display: none;\n    }\n\n    &::before {\n      content: '';\n      display: none;\n      background: $colorWhite;\n      position: absolute;\n      width: 100%;\n      z-index: -1;\n      left: 0;\n      top: 50%;\n      // prevent white line not fully overlaping border of input\n      margin-top: -0.5px;\n      height: 2px;\n    }\n  }\n\n  &__input:hover + &__label,\n  &__input:focus + &__label {\n    color: $colorPrimaryHover;\n  }\n\n  &__button-right {\n    display: none;\n\n    &[disabled]:not([disabled=\"false\"])[variant=\"input\"] {\n      --color: #{$formColor};\n      --background-color: transparent;\n      --border-color: transparent;\n\n      --hover-color: #{$colorPrimaryHover};\n      --hover-background-color: transparent;\n      --hover-border-color: transparent;\n    }\n  }\n\n  /* Clearable / Search input */\n\n  &--is-clearable#{&}--is-filled:not(#{&}--is-readonly):not(#{&}--is-disabled) &__button-right,\n  &--type-search &__button-right {\n    display: block;\n  }\n\n  &--type-search:not(#{&}--is-filled) &__button-right,\n  &--type-search#{&}--is-readonly &__button-right,\n  &--type-search#{&}--is-disabled &__button-right {\n    pointer-events: none;\n  }\n\n  /* Filled variant */\n\n  &--is-filled &__button-right {\n    &.is-search {\n      pointer-events: initial;\n    }\n  }\n\n  /* Styles for floating label */\n\n  &:not(#{&}--is-readonly):not(#{&}--is-disabled) &__input:focus + &__label,\n  &--has-fixed-label &__label,\n  &--is-filled &__label,\n  &--is-readonly &__label,\n  &--is-disabled &__label,\n  &--is-invalid &__label {\n    display: block;\n    top: 0;\n    // padding-left (input field medium) - padding-left\n    left: calc(#{space('medium')} - #{space('xxsmall')});\n    height: 20px; // dividable by two (so before element is always positioned correctly)\n    line-height: 20px;\n    padding: 0 space('xxsmall');\n    max-width: calc(100% - #{space('small')} * 2);\n    pointer-events: all;\n\n    &:not(:empty)::before {\n      display: block;\n    }\n  }\n\n  /* Button Right Variant */\n\n  &--has-button-right &__input {\n    // distance to icon + icon button width\n    padding-right: calc(#{space('xsmall')} + #{$formInputHeight});\n  }\n\n  &--has-button-right &__label {\n    // 100% - ((padding left of normal variant + border 1px) * 2) - icon button width\n    max-width: calc(100% - (#{space('medium')} + 1px) * 2 - #{$formInputHeight});\n  }\n\n  &--has-button-right#{&}:not(#{&}--is-readonly):not(#{&}--is-disabled) &__input:focus + &__label,\n  &--has-button-right#{&}--has-fixed-label &__label,\n  &--has-button-right#{&}--is-filled &__label,\n  &--has-button-right#{&}--is-readonly &__label,\n  &--has-button-right#{&}--is-disabled &__label,\n  &--has-button-right#{&}--is-invalid &__label {\n    // 100% - left distance to text + 1px border + padding label right side - icon button width\n    max-width: calc(100% - #{space('medium')} - #{space('xxsmall')} - 1px + #{space('xxsmall')} - #{$formInputHeight});\n  }\n\n  /* Size variants */\n\n  &--size-small {\n    @include fontSize('micro');\n  }\n\n  &--size-small &__input {\n    @include fontSize('micro');\n\n    &--input {\n      height: $formInputHeightSmall;\n    }\n\n    &--textarea {\n      min-height: $formInputHeightSmall;\n    }\n  }\n\n  &--size-small &__label {\n    top: calc(#{$formInputHeightSmall} / 2);\n  }\n\n  &--size-small#{&}:not(#{&}--is-readonly):not(#{&}--is-disabled) &__input:focus + &__label,\n  &--size-small#{&}--has-fixed-label &__label,\n  &--size-small#{&}--is-filled &__label,\n  &--size-small#{&}--is-readonly &__label,\n  &--size-small#{&}--is-disabled &__label,\n  &--size-small#{&}--is-invalid &__label {\n    top: 0;\n  }\n\n  &--size-small#{&}--has-button-right &__input {\n    padding-right: calc(#{space('xxsmall')} + #{$formInputHeightSmall});\n  }\n\n  &--size-small#{&}--has-button-right &__label {\n    max-width: calc(100% - (#{space('medium')} + 1px) * 2 - #{$formInputHeightSmall});\n  }\n\n  &--size-small#{&}--has-button-right#{&}:not(#{&}--is-readonly):not(#{&}--is-disabled) &__input:focus + &__label,\n  &--size-small#{&}--has-button-right#{&}--has-fixed-label &__label,\n  &--size-small#{&}--has-button-right#{&}--is-filled &__label,\n  &--size-small#{&}--has-button-right#{&}--is-readonly &__label,\n  &--size-small#{&}--has-button-right#{&}--is-disabled &__label,\n  &--size-small#{&}--has-button-right#{&}--is-invalid &__label {\n    max-width: calc(100% - #{space('medium')} - #{space('xxsmall')} - 1px + #{space('xsmall')} - #{$formInputHeightSmall});\n  }\n\n  /* Spin button */\n\n  &:not(#{&}--has-spin) &__input {\n    &::-webkit-outer-spin-button,\n    &::-webkit-inner-spin-button {\n      appearance: none;\n      margin: 0;\n    }\n\n    &[type=number] {\n      appearance: textfield;\n    }\n  }\n\n  /* Hidden label */\n  &--has-label-hidden &__label {\n    @include visuallyhidden;\n  }\n\n  /* Invalid */\n\n  &--is-invalid &__input,\n  &--is-invalid &__label,\n  &--is-invalid &__input + &__label {\n    color: $colorError;\n  }\n\n  &--is-invalid &__input {\n    border-color: $colorError;\n\n    @include placeholder {\n      color: $colorError;\n    }\n  }\n\n  /* Readonly / Disabled */\n\n  &--is-readonly &__input,\n  &--is-readonly &__input + &__label,\n  &--is-disabled &__input,\n  &--is-disabled &__input + &__label {\n    color: $formDisabledColor;\n  }\n\n  &--is-readonly &__input,\n  &--is-disabled &__input {\n    color: $formDisabledColor;\n    border-color: $formDisabledBorderColor;\n    background-color: $formDisabledBackgroundColor;\n    cursor: not-allowed;\n\n    @include placeholder {\n      color: $formDisabledColor;\n    }\n\n    &:hover,\n    &:focus {\n      border-color: $formDisabledBorderColor;\n    }\n  }\n\n  &--is-readonly &__label,\n  &--is-disabled &__label {\n    cursor: not-allowed;\n\n    &::before {\n      background: transparent;\n    }\n  }\n\n  &--is-readonly &__button-right,\n  &--is-disabled &__button-right {\n    &[disabled]:not([disabled=\"false\"])[variant=\"input\"] {\n      --color: #{$formDisabledColor};\n      --hover-color: #{$formDisabledColor};\n    }\n  }\n}\n","import {\n  Component,\n  Prop,\n  Host,\n  Event,\n  EventEmitter,\n  State,\n  Method,\n  Element,\n  h,\n  Watch\n} from \"@stencil/core\";\n\nimport {\n  StzhInputChangeEvent,\n  StzhInputFocusEvent,\n  StzhInputBlurEvent\n} from \"../../index\";\n\nimport { hasSlot } from \"../../utils/utils\";\nimport { fetchTranslations, StzhLocaleComponent } from \"../../utils/translation-utils\";\n\nimport { StzhInputDescription } from \"./stzh-input-description\";\n\nlet inputCounter = 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 error - Slot for error\n * @slot button-right - Slot for right button\n */\n@Component({\n  tag: \"stzh-input\",\n  styleUrl: \"stzh-input.scss\",\n  scoped: true\n})\nexport class StzhInput {\n  /** Translation strings */\n  @Prop() localization: StzhLocaleComponent;\n\n  /** Whether the input is a textarea or an input field */\n  @Prop() multiline: boolean = false;\n\n  /** Rows attribute if input element is textarea */\n  @Prop() rows: number;\n\n  /** If input field, this defines the type (if `search`, a search icon will be displayed) */\n  @Prop() type: \"text\" | \"search\" | \"password\" | \"email\" | \"url\" | \"tel\" | \"number\" = \"text\";\n\n  /** If input type is number, this will be the step size  */\n  @Prop() step: number = 1;\n\n  /** If input type is number, this will be the minimum step number  */\n  @Prop() min: number;\n\n  /** If input type is number, this will be the maximum step number  */\n  @Prop() max: number;\n\n  /** If input type is number and this property is true, this will show the spin buttons on hover/focus */\n  @Prop({ reflect: true }) showSpin: 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  /** Whether clearable button is showing when input field has value and is enabled (button-right slot not usable anymore when true) */\n  @Prop({ reflect: true }) clearable: boolean = false;\n\n  /** Append text to label depending if field is optional/required. true -> show \"(optional)\", false -> show nothing */\n  @Prop({ reflect: true }) showMarker: boolean = false;\n\n  /** Minimum of characters */\n  @Prop() minlength: number;\n\n  /** Maxlength of characters */\n  @Prop() maxlength: number;\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  /** 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  private _error: 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  /**\n   * Specify inputmode.\n   * See [MDN](https://developer.mozilla.org/de/docs/Web/HTML/Global_attributes/inputmode) for possible values\n   */\n  @Prop() inputmode: string;\n\n  /**\n   * Specify what the user agent has to provide as automated assistance.\n   * See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete) for possible values\n   */\n  @Prop() autocomplete: string = \"on\";\n\n  /** Whether autocomplete should be turned off  */\n  @Prop() noAutocomplete: boolean = false;\n\n  /** Label */\n  @Prop() label: string = \"\";\n\n  /** Whether label should be visually hidden. */\n  @Prop() labelHidden: boolean = false;\n\n  /** Size variant */\n  @Prop({ reflect: true }) size: \"default\" | \"small\" = \"default\";\n\n  /** Id for element which describes the input (this will be overwritten if description prop or slot is used, used by stzh-radiogroup) */\n  @Prop({ attribute: \"a11y-describedby\" }) a11yDescribedby: string = \"\";\n\n  /** Whether the input is filled or not */\n  @State() filled: boolean;\n\n  @Element() element: HTMLStzhInputElement;\n\n  /** Focus input field */\n  @Method()\n  async setFocus() {\n    this.input.focus();\n  }\n\n  /** Input change event */\n  @Event() stzhChange: EventEmitter<StzhInputChangeEvent>;\n\n  /** Input focus event */\n  @Event() stzhFocus: EventEmitter<StzhInputFocusEvent>;\n\n  /** Input blur event */\n  @Event() stzhBlur: EventEmitter<StzhInputBlurEvent>;\n\n  @Watch(\"value\")\n  valueWatcher(newValue: string) {\n    this.filled = 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    this.invalid = this._error.length > 0;\n  }\n\n  @Watch(\"type\")\n  typeWatcher(newValue: string) {\n    const types = [\n      \"text\", \"search\", \"password\", \"email\", \"url\", \"tel\", \"number\"\n    ];\n\n    if (!this.multiline && !types.includes(newValue)) {\n      throw new Error(`Type ${newValue} not supported`);\n    }\n  }\n\n  private input: HTMLInputElement | HTMLTextAreaElement;\n  private inputId: string;\n  private focusedByInput: boolean = false;\n\n  private onClearClick = (event: MouseEvent) => {\n    this.value = \"\";\n    this.input.focus();\n\n    this.stzhChange.emit({\n      component: \"stzh-input\",\n      originalEvent: event,\n      value: this.value\n    });\n  }\n\n  private onInput = (event: InputEvent) => {\n    this.value = this.input.value;\n\n    this.stzhChange.emit({\n      component: \"stzh-input\",\n      originalEvent: event,\n      value: this.value\n    });\n  }\n\n  private onRootFocus = () => {\n    if (!this.focusedByInput) {\n      this.setFocus();\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-input\",\n      originalEvent: event\n    });\n  }\n\n  private onBlur = (event: FocusEvent) => {\n    // fixes weird bug where autofill selection doesn't get removed\n    this.input.value = this.input.value;\n\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-input\",\n      originalEvent: event\n    });\n  }\n\n  private renderTextarea(): HTMLTextAreaElement {\n    return (\n      <textarea\n        class=\"stzh-input__input stzh-input__input--textarea\"\n        ref={(el) => (this.input = el as HTMLTextAreaElement)}\n        id={this.inputId}\n        name={this.name}\n        value={this.value}\n        rows={this.rows}\n        disabled={this.disabled}\n        readonly={this.readonly}\n        minlength={this.minlength}\n        maxlength={this.maxlength}\n        aria-describedby={`${this.inputId}-description ${this.a11yDescribedby}`}\n        aria-required={this.required ? \"true\" : \"false\"}\n        aria-invalid={this.invalid ? \"true\" : \"false\"}\n        onInput={this.onInput}\n        onFocus={this.onFocus}\n        onBlur={this.onBlur}\n      ></textarea>\n    );\n  }\n\n  private renderInput(): HTMLInputElement {\n    return (\n      <input\n        class=\"stzh-input__input stzh-input__input--input\"\n        ref={(el) => (this.input = el as HTMLInputElement)}\n        id={this.inputId}\n        type={this.type}\n        name={this.name}\n        value={this.value}\n        min={this.min}\n        max={this.max}\n        step={this.step}\n        inputmode={this.inputmode}\n        disabled={this.disabled}\n        readonly={this.readonly}\n        minlength={this.minlength}\n        maxlength={this.maxlength}\n        autocomplete={this.noAutocomplete ? \"off\" : this.autocomplete}\n        aria-autocomplete={this.noAutocomplete ? \"none\" : undefined}\n        aria-describedby={`${this.inputId}-description ${this.a11yDescribedby}`}\n        aria-required={this.required ? \"true\" : \"false\"}\n        aria-invalid={this.invalid ? \"true\" : \"false\"}\n        onInput={this.onInput}\n        onFocus={this.onFocus}\n        onBlur={this.onBlur}\n      />\n    );\n  }\n\n  async componentWillLoad() {\n    this.inputId = `stzh-input-${inputCounter++}`;\n    this.typeWatcher(this.type);\n    this.valueWatcher(this.value);\n    this.errorWatcher(this.error);\n\n    if (!this.localization) {\n      this.localization = await fetchTranslations(this.element, \"input\");\n    }\n  }\n\n  render() {\n    const buttonRightSlotUsed = hasSlot(this.element, 'button-right');\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;\n    const classes = {\n      \"stzh-input\": true,\n      \"stzh-input--has-button-right\": buttonRightSlotUsed\n        || this.type === \"search\"\n        || (this.clearable && this.filled && !this.readonly && !this.disabled),\n      \"stzh-input--has-description\": descriptionUsed,\n      \"stzh-input--has-description-long\": descriptionLongUsed,\n      \"stzh-input--has-error\": errorUsed,\n      \"stzh-input--has-spin\": this.showSpin,\n      \"stzh-input--is-invalid\": this.invalid,\n      \"stzh-input--is-disabled\": this.disabled,\n      \"stzh-input--is-readonly\": this.readonly,\n      \"stzh-input--is-required\": this.required,\n      \"stzh-input--is-filled\": this.filled,\n      \"stzh-input--is-clearable\": this.clearable,\n      \"stzh-input--has-fixed-label\": window?.stzhComponents?.labels === \"fixed\",\n      \"stzh-input--has-label-hidden\": this.labelHidden,\n      [`stzh-input--size-${this.size}`]: !!this.size,\n      [`stzh-input--type-${this.type}`]: !!this.type,\n    };\n\n    return (\n      <Host tabindex={this.disabled ? null : \"-1\"} onFocus={this.onRootFocus}>\n        <div class={classes}>\n          <div class=\"stzh-input__field-wrapper\">\n            {this.multiline ? this.renderTextarea() : this.renderInput()}\n            <label class=\"stzh-input__label\" htmlFor={this.inputId}>\n              {this.label ? this.label : <slot></slot>}\n              {this.showMarker &&\n                <span class=\"stzh-input__marker\">\n                  <span class=\"stzh-input__marker-symbol\" aria-hidden=\"true\">\n                    {this.required\n                      ? this.localization.$globals.requiredFieldMarker\n                      : this.localization.$globals.optionalFieldMarker\n                    }\n                  </span>\n                  <span class=\"stzh-input__marker-text\">\n                    {this.required\n                      ? this.localization.$globals.requiredFieldText\n                      : this.localization.$globals.optionalFieldText\n                    }\n                  </span>\n                </span>\n              }\n            </label>\n            {this.clearable || this.type === \"search\"\n              ?\n              <stzh-button\n                class=\"stzh-input__button-right\"\n                icon={this.disabled || this.readonly || !this.filled ? \"search\" : \"close-circle\"}\n                icon-only\n                variant=\"input\"\n                onClick={this.onClearClick}\n                disabled={this.disabled || this.readonly || !this.filled}\n                a11yLabel={this.localization.$globals.clearButtonLabel}\n                aria-controls={this.inputId}\n              ></stzh-button>\n              :\n              <slot name=\"button-right\"></slot>\n            }\n          </div>\n          <StzhInputDescription\n            classPrefix=\"stzh-input\"\n            id={`${this.inputId}-description`}\n            error={this._error}\n            description={this.description}\n            descriptionLong={this.descriptionLong}\n            descriptionLongUsed={descriptionLongUsed}\n            moreInfoButtonLabel={this.localization.$globals.moreInfoButtonLabel}\n          />\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"0vDAAA,IAAMA,EAAe,8liBCwBrB,IAAIC,EAAe,E,IAcNC,EAASC,EAAA,wB,kJAuJZC,KAAAC,eAA0B,MAE1BD,KAAAE,aAAe,SAACC,GACtBC,EAAKC,MAAQ,GACbD,EAAKE,MAAMC,QAEXH,EAAKI,WAAWC,KAAK,CACnBC,UAAW,aACXC,cAAeR,EACfE,MAAOD,EAAKC,O,EAIRL,KAAAY,QAAU,SAACT,GACjBC,EAAKC,MAAQD,EAAKE,MAAMD,MAExBD,EAAKI,WAAWC,KAAK,CACnBC,UAAW,aACXC,cAAeR,EACfE,MAAOD,EAAKC,O,EAIRL,KAAAa,YAAc,WACpB,IAAKT,EAAKH,eAAgB,CACxBG,EAAKU,U,CAGPV,EAAKH,eAAiB,K,EAGhBD,KAAAe,QAAU,SAACZ,GACjBC,EAAKH,eAAiB,KAEtB,IAAMe,EAAa,IAAIC,WAAW,QAAS,CACzCC,KAAMC,OACNC,QAAS,MACTC,WAAY,QAGdjB,EAAKkB,QAAQC,cAAcP,GAC3BZ,EAAKoB,UAAUf,KAAK,CAClBC,UAAW,aACXC,cAAeR,G,EAIXH,KAAAyB,OAAS,SAACtB,GAEhBC,EAAKE,MAAMD,MAAQD,EAAKE,MAAMD,MAE9B,IAAMqB,EAAY,IAAIT,WAAW,OAAQ,CACvCC,KAAMC,OACNC,QAAS,MACTC,WAAY,QAGdjB,EAAKkB,QAAQC,cAAcG,GAC3BtB,EAAKuB,SAASlB,KAAK,CACjBC,UAAW,aACXC,cAAeR,G,6CA9MU,M,8BAMuD,O,UAG7D,E,oDASsB,M,cAGA,M,cAGA,M,eAGC,M,gBAGC,M,iFAYN,G,4FAaG,M,cAGC,M,2CAYd,K,oBAGG,M,WAGV,G,iBAGO,M,UAGsB,U,qBAGc,G,sBAS7DyB,EAAAC,UAAAf,SAAN,W,qFACEd,KAAKM,MAAMC,Q,iBAabqB,EAAAC,UAAAC,aAAA,SAAaC,GACX/B,KAAKgC,OAASD,IAAa,E,EAI7BH,EAAAC,UAAAI,aAAA,SAAaF,GACX,UAAWA,IAAa,SAAU,CAChC,IACE/B,KAAKkC,OAASC,KAAKC,MAAML,E,CACzB,MAAOM,GACP,GAAIN,EAAU,CACZ/B,KAAKkC,OAAS,CAACH,E,KACV,CACL/B,KAAKkC,OAAS,E,QAGb,GAAIH,EAAU,CACnB/B,KAAKkC,OAASH,C,KACT,CACL/B,KAAKkC,OAAS,E,CAGhBlC,KAAKsC,QAAUtC,KAAKkC,OAAOK,OAAS,C,EAItCX,EAAAC,UAAAW,YAAA,SAAYT,GACV,IAAMU,EAAQ,CACZ,OAAQ,SAAU,WAAY,QAAS,MAAO,MAAO,UAGvD,IAAKzC,KAAK0C,YAAcD,EAAME,SAASZ,GAAW,CAChD,MAAM,IAAIa,MAAM,QAAAC,OAAQd,EAAQ,kB,GAsE5BH,EAAAC,UAAAiB,eAAA,eAAA1C,EAAAJ,KACN,OACE+C,EAAA,YACEC,MAAM,gDACNC,IAAK,SAACC,GAAE,OAAM9C,EAAKE,MAAQ4C,CAAnB,EACRC,GAAInD,KAAKoD,QACTC,KAAMrD,KAAKqD,KACXhD,MAAOL,KAAKK,MACZiD,KAAMtD,KAAKsD,KACXC,SAAUvD,KAAKuD,SACfC,SAAUxD,KAAKwD,SACfC,UAAWzD,KAAKyD,UAChBC,UAAW1D,KAAK0D,UAAS,mBACP,GAAAb,OAAG7C,KAAKoD,QAAO,iBAAAP,OAAgB7C,KAAK2D,iBAAiB,gBACxD3D,KAAK4D,SAAW,OAAS,QAAO,eACjC5D,KAAKsC,QAAU,OAAS,QACtC1B,QAASZ,KAAKY,QACdG,QAASf,KAAKe,QACdU,OAAQzB,KAAKyB,Q,EAKXG,EAAAC,UAAAgC,YAAA,eAAAzD,EAAAJ,KACN,OACE+C,EAAA,SACEC,MAAM,6CACNC,IAAK,SAACC,GAAE,OAAM9C,EAAKE,MAAQ4C,CAAnB,EACRC,GAAInD,KAAKoD,QACTU,KAAM9D,KAAK8D,KACXT,KAAMrD,KAAKqD,KACXhD,MAAOL,KAAKK,MACZ0D,IAAK/D,KAAK+D,IACVC,IAAKhE,KAAKgE,IACVC,KAAMjE,KAAKiE,KACXC,UAAWlE,KAAKkE,UAChBX,SAAUvD,KAAKuD,SACfC,SAAUxD,KAAKwD,SACfC,UAAWzD,KAAKyD,UAChBC,UAAW1D,KAAK0D,UAChBS,aAAcnE,KAAKoE,eAAiB,MAAQpE,KAAKmE,aAAY,oBAC1CnE,KAAKoE,eAAiB,OAASC,UAAS,mBACzC,GAAAxB,OAAG7C,KAAKoD,QAAO,iBAAAP,OAAgB7C,KAAK2D,iBAAiB,gBACxD3D,KAAK4D,SAAW,OAAS,QAAO,eACjC5D,KAAKsC,QAAU,OAAS,QACtC1B,QAASZ,KAAKY,QACdG,QAASf,KAAKe,QACdU,OAAQzB,KAAKyB,Q,EAKbG,EAAAC,UAAAyC,kBAAN,W,kHACEtE,KAAKoD,QAAU,cAAAP,OAAchD,KAC7BG,KAAKwC,YAAYxC,KAAK8D,MACtB9D,KAAK8B,aAAa9B,KAAKK,OACvBL,KAAKiC,aAAajC,KAAKuE,O,KAElBvE,KAAKwE,aAAN,YACFC,EAAAzE,KAAoB,SAAM0E,EAAkB1E,KAAKsB,QAAS,U,OAA1DmD,EAAKD,aAAeG,EAAAC,O,mCAIxBhD,EAAAC,UAAAgD,OAAA,W,YACE,IAAMC,EAAsBC,EAAQ/E,KAAKsB,QAAS,gBAClD,IAAM0D,EAAkBD,EAAQ/E,KAAKsB,QAAS,kBAAoBtB,KAAKiF,YACvE,IAAMC,EAAsBH,EAAQ/E,KAAKsB,QAAS,uBAAyBtB,KAAKmF,gBAChF,IAAMC,EAAYL,EAAQ/E,KAAKsB,QAAS,YAActB,KAAKuE,MAC3D,IAAMc,GAAOZ,EAAA,CACX,aAAc,KACd,+BAAgCK,GAC3B9E,KAAK8D,OAAS,UACb9D,KAAKsF,WAAatF,KAAKgC,SAAWhC,KAAKwD,WAAaxD,KAAKuD,SAC/D,8BAA+ByB,EAC/B,mCAAoCE,EACpC,wBAAyBE,EACzB,uBAAwBpF,KAAKuF,SAC7B,yBAA0BvF,KAAKsC,QAC/B,0BAA2BtC,KAAKuD,SAChC,0BAA2BvD,KAAKwD,SAChC,0BAA2BxD,KAAK4D,SAChC,wBAAyB5D,KAAKgC,OAC9B,2BAA4BhC,KAAKsF,UACjC,gCAA+BE,EAAArE,SAAM,MAANA,cAAM,SAANA,OAAQsE,kBAAc,MAAAD,SAAA,SAAAA,EAAEE,UAAW,QAClE,+BAAgC1F,KAAK2F,aACrClB,EAAC,oBAAA5B,OAAoB7C,KAAK4F,SAAW5F,KAAK4F,KAC1CnB,EAAC,oBAAA5B,OAAoB7C,KAAK8D,SAAW9D,KAAK8D,K,GAG5C,OACEf,EAAC8C,EAAI,CAACC,SAAU9F,KAAKuD,SAAW,KAAO,KAAMxC,QAASf,KAAKa,aACzDkC,EAAA,OAAKC,MAAOqC,GACVtC,EAAA,OAAKC,MAAM,6BACRhD,KAAK0C,UAAY1C,KAAK8C,iBAAmB9C,KAAK6D,cAC/Cd,EAAA,SAAOC,MAAM,oBAAoB+C,QAAS/F,KAAKoD,SAC5CpD,KAAKgG,MAAQhG,KAAKgG,MAAQjD,EAAA,aAC1B/C,KAAKiG,YACJlD,EAAA,QAAMC,MAAM,sBACVD,EAAA,QAAMC,MAAM,4BAA2B,cAAa,QACjDhD,KAAK4D,SACF5D,KAAKwE,aAAa0B,SAASC,oBAC3BnG,KAAKwE,aAAa0B,SAASE,qBAGjCrD,EAAA,QAAMC,MAAM,2BACThD,KAAK4D,SACF5D,KAAKwE,aAAa0B,SAASG,kBAC3BrG,KAAKwE,aAAa0B,SAASI,qBAMtCtG,KAAKsF,WAAatF,KAAK8D,OAAS,SAE/Bf,EAAA,eACEC,MAAM,2BACNuD,KAAMvG,KAAKuD,UAAYvD,KAAKwD,WAAaxD,KAAKgC,OAAS,SAAW,eAAc,iBAEhFwE,QAAQ,QACRC,QAASzG,KAAKE,aACdqD,SAAUvD,KAAKuD,UAAYvD,KAAKwD,WAAaxD,KAAKgC,OAClD0E,UAAW1G,KAAKwE,aAAa0B,SAASS,iBAAgB,gBACvC3G,KAAKoD,UAGtBL,EAAA,QAAMM,KAAK,kBAGfN,EAAC6D,EAAoB,CACnBC,YAAY,aACZ1D,GAAI,GAAAN,OAAG7C,KAAKoD,QAAO,gBACnBmB,MAAOvE,KAAKkC,OACZ+C,YAAajF,KAAKiF,YAClBE,gBAAiBnF,KAAKmF,gBACtBD,oBAAqBA,EACrB4B,oBAAqB9G,KAAKwE,aAAa0B,SAASY,uB,gSA/VtC,I"}