@oiz/stzh-components 2.6.0-aalpha → 2.6.0

package/dist/esm-es5/loader.js.map

@@ -1 +1 @@
-{"version":3,"names":["patchEsm","promiseResolve","defineCustomElements","win","options","window","Promise","resolve","then","globalScripts","bootstrapLazy","JSON","parse"],"sources":["node_modules/@stencil/core/internal/client/patch-esm.js","@lazy-external-entrypoint?app-data=conditional"],"sourcesContent":["/*\n Stencil Client Patch Esm v3.3.0 | MIT Licensed | https://stenciljs.com\n */\nimport { BUILD } from '@stencil/core/internal/app-data';\nimport { CSS, plt, win, promiseResolve } from '@stencil/core';\nconst patchEsm = () => {\n    // NOTE!! This fn cannot use async/await!\n    // TODO(STENCIL-659): Remove code implementing the CSS variable shim\n    // @ts-ignore\n    if (BUILD.cssVarShim && !(CSS && CSS.supports && CSS.supports('color', 'var(--c)'))) {\n        // @ts-ignore\n        return import(/* webpackChunkName: \"polyfills-css-shim\" */ './css-shim.js').then(() => {\n            if ((plt.$cssShim$ = win.__cssshim)) {\n                // TODO(STENCIL-659): Remove code implementing the CSS variable shim\n                return plt.$cssShim$.i();\n            }\n            else {\n                // for better minification\n                return 0;\n            }\n        });\n    }\n    return promiseResolve();\n};\nexport { patchEsm };\n","export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { patchEsm } from '@stencil/core/internal/client/patch-esm';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\nexport const defineCustomElements = (win, options) => {\n  if (typeof window === 'undefined') return Promise.resolve();\n  return patchEsm().then(() => {\n  globalScripts();\n  return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n  });\n};\n"],"mappings":"iLAKA,IAAMA,SAAW,WAiBb,OAAOC,gBACX,ECnBY,IAACC,qBAAuB,SAACC,EAAKC,GACxC,UAAWC,SAAW,YAAa,OAAOC,QAAQC,UAClD,OAAOP,WAAWQ,MAAK,WACvBC,gBACA,OAAOC,cAAcC,KAAAC,MAAA,qrvBAAuCR,EAC9D,GACA,S"}
+{"version":3,"names":["patchEsm","promiseResolve","defineCustomElements","win","options","window","Promise","resolve","then","globalScripts","bootstrapLazy","JSON","parse"],"sources":["node_modules/@stencil/core/internal/client/patch-esm.js","@lazy-external-entrypoint?app-data=conditional"],"sourcesContent":["/*\n Stencil Client Patch Esm v3.3.0 | MIT Licensed | https://stenciljs.com\n */\nimport { BUILD } from '@stencil/core/internal/app-data';\nimport { CSS, plt, win, promiseResolve } from '@stencil/core';\nconst patchEsm = () => {\n    // NOTE!! This fn cannot use async/await!\n    // TODO(STENCIL-659): Remove code implementing the CSS variable shim\n    // @ts-ignore\n    if (BUILD.cssVarShim && !(CSS && CSS.supports && CSS.supports('color', 'var(--c)'))) {\n        // @ts-ignore\n        return import(/* webpackChunkName: \"polyfills-css-shim\" */ './css-shim.js').then(() => {\n            if ((plt.$cssShim$ = win.__cssshim)) {\n                // TODO(STENCIL-659): Remove code implementing the CSS variable shim\n                return plt.$cssShim$.i();\n            }\n            else {\n                // for better minification\n                return 0;\n            }\n        });\n    }\n    return promiseResolve();\n};\nexport { patchEsm };\n","export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { patchEsm } from '@stencil/core/internal/client/patch-esm';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\nexport const defineCustomElements = (win, options) => {\n  if (typeof window === 'undefined') return Promise.resolve();\n  return patchEsm().then(() => {\n  globalScripts();\n  return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n  });\n};\n"],"mappings":"iLAKA,IAAMA,SAAW,WAiBb,OAAOC,gBACX,ECnBY,IAACC,qBAAuB,SAACC,EAAKC,GACxC,UAAWC,SAAW,YAAa,OAAOC,QAAQC,UAClD,OAAOP,WAAWQ,MAAK,WACvBC,gBACA,OAAOC,cAAcC,KAAAC,MAAA,2uvBAAuCR,EAC9D,GACA,S"}

package/dist/esm-es5/stzh-actions.entry.js

@@ -1,2 +1,2 @@
-import{r as registerInstance,h,a as Host,g as getElement}from"./index-67fd55c9.js";import{s as setPropsIfNull}from"./utils-51148d9a.js";var stzhActionsCss=".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 StzhActions=function(){function t(t){var s=this;registerInstance(this,t);this.init=function(){var t=s.element.querySelectorAll('stzh-button[slot="secondary"], [slot="secondary"] stzh-button');var o=s.element.querySelectorAll("stzh-button");t.forEach((function(t){setPropsIfNull(t,{variant:"secondary"})}));o.forEach((function(t){t.setAttribute("role","listitem")}))};this.variant="form";this.withBorder=false}t.prototype.connectedCallback=function(){this.init();this.observer=new MutationObserver(this.init);this.observer.observe(this.element,{childList:true,subtree:true})};t.prototype.disconnectedCallback=function(){if(this.observer){this.observer.disconnect()}};t.prototype.render=function(){var t;var s=(t={"stzh-actions":true,"stzh-actions--has-border":this.withBorder},t["stzh-actions--".concat(this.variant)]=!!this.variant,t);return h(Host,null,h("div",{class:s},h("div",{class:"stzh-actions__actions",role:"list"},h("div",{class:"stzh-actions__secondary-actions"},h("slot",{name:"secondary"})),h("div",{class:"stzh-actions__primary-actions"},h("slot",{name:"primary"})))))};Object.defineProperty(t.prototype,"element",{get:function(){return getElement(this)},enumerable:false,configurable:true});return t}();StzhActions.style=stzhActionsCss;export{StzhActions as stzh_actions};
+import{r as registerInstance,h,a as Host,g as getElement}from"./index-67fd55c9.js";import{s as setPropsIfNull}from"./utils-51148d9a.js";var stzhActionsCss=".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 StzhActions=function(){function s(s){var t=this;registerInstance(this,s);this.init=function(){var s=t.element.querySelectorAll('stzh-button[slot="secondary"], [slot="secondary"] stzh-button');s.forEach((function(s){setPropsIfNull(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 h(Host,null,h("div",{class:t},h("div",{class:"stzh-actions__actions",role:"group"},h("div",{class:"stzh-actions__secondary-actions"},h("slot",{name:"secondary"})),h("div",{class:"stzh-actions__primary-actions"},h("slot",{name:"primary"})))))};Object.defineProperty(s.prototype,"element",{get:function(){return getElement(this)},enumerable:false,configurable:true});return s}();StzhActions.style=stzhActionsCss;export{StzhActions as stzh_actions};
 //# sourceMappingURL=stzh-actions.entry.js.map

package/dist/esm-es5/stzh-actions.entry.js.map

@@ -1 +1 @@
-{"version":3,"names":["stzhActionsCss","StzhActions","this","init","secondaryButtons","_this","element","querySelectorAll","buttons","forEach","button","setPropsIfNull","variant","setAttribute","prototype","connectedCallback","observer","MutationObserver","observe","childList","subtree","disconnectedCallback","disconnect","render","classes","_a","withBorder","concat","h","Host","class","role","name"],"sources":["src/components/stzh-actions/stzh-actions.scss?tag=stzh-actions&encapsulation=scoped","src/components/stzh-actions/stzh-actions.tsx"],"sourcesContent":[":host {\n  ::slotted([slot=\"primary\"]),\n  ::slotted([slot=\"secondary\"]) {\n    flex-grow: 1;\n    margin: space('xxsmall');\n  }\n\n  &[variant=\"cta\"] ::slotted([slot=\"primary\"]),\n  &[variant=\"cta\"] ::slotted([slot=\"secondary\"]) {\n    flex-grow: 0;\n  }\n}\n\n.stzh-actions {\n  &__actions {\n    display: flex;\n    flex-direction: column;\n    margin: calc(#{space('xxsmall')} * -1);\n\n    @include mq($from: small) {\n      flex-direction: row;\n    }\n  }\n\n  &__primary-actions,\n  &__secondary-actions {\n    display: flex;\n  }\n\n  &--dialog &__actions {\n    justify-content: flex-end;\n  }\n\n  &--process &__actions {\n    justify-content: space-between;\n  }\n\n  &--has-border {\n    padding-top: space('medium');\n    border-top: 1px solid $baseBorderColor;\n  }\n}\n","import {\n  Component,\n  Host,\n  Prop,\n  h,\n  Element\n} from \"@stencil/core\";\n\nimport { setPropsIfNull } from \"../../utils/utils\";\n\n/**\n * @slot primary - Slot for primary button\n * @slot secondary - Slot for secondary button\n */\n@Component({\n  tag: \"stzh-actions\",\n  styleUrl: \"stzh-actions.scss\",\n  scoped: true\n})\nexport class StzhActions {\n  /** Variant determining what position the action buttons are */\n  @Prop({ reflect: true }) variant: \"form\" | \"dialog\" | \"process\" | \"cta\" = \"form\";\n\n  /** With border separator */\n  @Prop({ reflect: true }) withBorder: boolean = false;\n\n  @Element() element: HTMLStzhActionsElement;\n\n  private observer: MutationObserver;\n\n  private init = () => {\n    const secondaryButtons = this.element.querySelectorAll(\n      'stzh-button[slot=\"secondary\"], [slot=\"secondary\"] stzh-button'\n    );\n\n    const buttons = this.element.querySelectorAll('stzh-button');\n\n    secondaryButtons.forEach((button) => {\n      setPropsIfNull(button, {\n        variant: \"secondary\"\n      } as HTMLStzhButtonElement)\n    });\n\n    buttons.forEach((button) => {\n      button.setAttribute(\"role\", \"listitem\");\n    });\n  }\n\n  connectedCallback() {\n    this.init();\n\n    this.observer = new MutationObserver(this.init);\n    this.observer.observe(this.element, {\n      childList: true,\n      subtree: true\n    });\n  }\n\n  disconnectedCallback() {\n    if (this.observer) {\n      this.observer.disconnect();\n    }\n  }\n\n  render() {\n    const classes = {\n      \"stzh-actions\": true,\n      \"stzh-actions--has-border\": this.withBorder,\n      [`stzh-actions--${this.variant}`]: !!this.variant\n    };\n\n    return (\n      <Host>\n        <div class={classes}>\n          <div class=\"stzh-actions__actions\" role=\"list\">\n            <div class=\"stzh-actions__secondary-actions\">\n              <slot name=\"secondary\"></slot>\n            </div>\n            <div class=\"stzh-actions__primary-actions\">\n              <slot name=\"primary\"></slot>\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"wIAAA,IAAMA,eAAiB,4qD,ICmBVC,YAAW,W,kDAWdC,KAAAC,KAAO,WACb,IAAMC,EAAmBC,EAAKC,QAAQC,iBACpC,iEAGF,IAAMC,EAAUH,EAAKC,QAAQC,iBAAiB,eAE9CH,EAAiBK,SAAQ,SAACC,GACxBC,eAAeD,EAAQ,CACrBE,QAAS,a,IAIbJ,EAAQC,SAAQ,SAACC,GACfA,EAAOG,aAAa,OAAQ,W,kBAvB0C,O,gBAG3B,K,CAwB/CZ,EAAAa,UAAAC,kBAAA,WACEb,KAAKC,OAELD,KAAKc,SAAW,IAAIC,iBAAiBf,KAAKC,MAC1CD,KAAKc,SAASE,QAAQhB,KAAKI,QAAS,CAClCa,UAAW,KACXC,QAAS,M,EAIbnB,EAAAa,UAAAO,qBAAA,WACE,GAAInB,KAAKc,SAAU,CACjBd,KAAKc,SAASM,Y,GAIlBrB,EAAAa,UAAAS,OAAA,W,MACE,IAAMC,GAAOC,EAAA,CACX,eAAgB,KAChB,2BAA4BvB,KAAKwB,YACjCD,EAAC,iBAAAE,OAAiBzB,KAAKU,YAAcV,KAAKU,Q,GAG5C,OACEgB,EAACC,KAAI,KACHD,EAAA,OAAKE,MAAON,GACVI,EAAA,OAAKE,MAAM,wBAAwBC,KAAK,QACtCH,EAAA,OAAKE,MAAM,mCACTF,EAAA,QAAMI,KAAK,eAEbJ,EAAA,OAAKE,MAAM,iCACTF,EAAA,QAAMI,KAAK,e,qIA5DD,G"}
+{"version":3,"names":["stzhActionsCss","StzhActions","this","init","secondaryButtons","_this","element","querySelectorAll","forEach","button","setPropsIfNull","variant","prototype","connectedCallback","observer","MutationObserver","observe","childList","subtree","disconnectedCallback","disconnect","render","classes","_a","withBorder","concat","h","Host","class","role","name"],"sources":["src/components/stzh-actions/stzh-actions.scss?tag=stzh-actions&encapsulation=scoped","src/components/stzh-actions/stzh-actions.tsx"],"sourcesContent":[":host {\n  ::slotted([slot=\"primary\"]),\n  ::slotted([slot=\"secondary\"]) {\n    flex-grow: 1;\n    margin: space('xxsmall');\n  }\n\n  &[variant=\"cta\"] ::slotted([slot=\"primary\"]),\n  &[variant=\"cta\"] ::slotted([slot=\"secondary\"]) {\n    flex-grow: 0;\n  }\n}\n\n.stzh-actions {\n  &__actions {\n    display: flex;\n    flex-direction: column;\n    margin: calc(#{space('xxsmall')} * -1);\n\n    @include mq($from: small) {\n      flex-direction: row;\n    }\n  }\n\n  &__primary-actions,\n  &__secondary-actions {\n    display: flex;\n  }\n\n  &--dialog &__actions {\n    justify-content: flex-end;\n  }\n\n  &--process &__actions {\n    justify-content: space-between;\n  }\n\n  &--has-border {\n    padding-top: space('medium');\n    border-top: 1px solid $baseBorderColor;\n  }\n}\n","import {\n  Component,\n  Host,\n  Prop,\n  h,\n  Element\n} from \"@stencil/core\";\n\nimport { setPropsIfNull } from \"../../utils/utils\";\n\n/**\n * @slot primary - Slot for primary button\n * @slot secondary - Slot for secondary button\n */\n@Component({\n  tag: \"stzh-actions\",\n  styleUrl: \"stzh-actions.scss\",\n  scoped: true\n})\nexport class StzhActions {\n  /** Variant determining what position the action buttons are */\n  @Prop({ reflect: true }) variant: \"form\" | \"dialog\" | \"process\" | \"cta\" = \"form\";\n\n  /** With border separator */\n  @Prop({ reflect: true }) withBorder: boolean = false;\n\n  @Element() element: HTMLStzhActionsElement;\n\n  private observer: MutationObserver;\n\n  private init = () => {\n    const secondaryButtons = this.element.querySelectorAll(\n      'stzh-button[slot=\"secondary\"], [slot=\"secondary\"] stzh-button'\n    );\n\n    secondaryButtons.forEach((button) => {\n      setPropsIfNull(button, {\n        variant: \"secondary\"\n      } as HTMLStzhButtonElement)\n    });\n\n  }\n\n  connectedCallback() {\n    this.init();\n\n    this.observer = new MutationObserver(this.init);\n    this.observer.observe(this.element, {\n      childList: true,\n      subtree: true\n    });\n  }\n\n  disconnectedCallback() {\n    if (this.observer) {\n      this.observer.disconnect();\n    }\n  }\n\n  render() {\n    const classes = {\n      \"stzh-actions\": true,\n      \"stzh-actions--has-border\": this.withBorder,\n      [`stzh-actions--${this.variant}`]: !!this.variant\n    };\n\n    return (\n      <Host>\n        <div class={classes}>\n          <div class=\"stzh-actions__actions\" role=\"group\">\n            <div class=\"stzh-actions__secondary-actions\">\n              <slot name=\"secondary\"></slot>\n            </div>\n            <div class=\"stzh-actions__primary-actions\">\n              <slot name=\"primary\"></slot>\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"wIAAA,IAAMA,eAAiB,4qD,ICmBVC,YAAW,W,kDAWdC,KAAAC,KAAO,WACb,IAAMC,EAAmBC,EAAKC,QAAQC,iBACpC,iEAGFH,EAAiBI,SAAQ,SAACC,GACxBC,eAAeD,EAAQ,CACrBE,QAAS,a,kBAhB2D,O,gBAG3B,K,CAmB/CV,EAAAW,UAAAC,kBAAA,WACEX,KAAKC,OAELD,KAAKY,SAAW,IAAIC,iBAAiBb,KAAKC,MAC1CD,KAAKY,SAASE,QAAQd,KAAKI,QAAS,CAClCW,UAAW,KACXC,QAAS,M,EAIbjB,EAAAW,UAAAO,qBAAA,WACE,GAAIjB,KAAKY,SAAU,CACjBZ,KAAKY,SAASM,Y,GAIlBnB,EAAAW,UAAAS,OAAA,W,MACE,IAAMC,GAAOC,EAAA,CACX,eAAgB,KAChB,2BAA4BrB,KAAKsB,YACjCD,EAAC,iBAAAE,OAAiBvB,KAAKS,YAAcT,KAAKS,Q,GAG5C,OACEe,EAACC,KAAI,KACHD,EAAA,OAAKE,MAAON,GACVI,EAAA,OAAKE,MAAM,wBAAwBC,KAAK,SACtCH,EAAA,OAAKE,MAAM,mCACTF,EAAA,QAAMI,KAAK,eAEbJ,EAAA,OAAKE,MAAM,iCACTF,EAAA,QAAMI,KAAK,e,qIAvDD,G"}

package/dist/esm-es5/stzh-actionset.entry.js

@@ -1,2 +1,2 @@
-var __awaiter=this&&this.__awaiter||function(t,e,i,s){function n(t){return t instanceof i?t:new i((function(e){e(t)}))}return new(i||(i=Promise))((function(i,a){function o(t){try{r(s.next(t))}catch(t){a(t)}}function c(t){try{r(s["throw"](t))}catch(t){a(t)}}function r(t){t.done?i(t.value):n(t.value).then(o,c)}r((s=s.apply(t,e||[])).next())}))};var __generator=this&&this.__generator||function(t,e){var i={label:0,sent:function(){if(a[0]&1)throw a[1];return a[1]},trys:[],ops:[]},s,n,a,o;return o={next:c(0),throw:c(1),return:c(2)},typeof Symbol==="function"&&(o[Symbol.iterator]=function(){return this}),o;function c(t){return function(e){return r([t,e])}}function r(c){if(s)throw new TypeError("Generator is already executing.");while(o&&(o=0,c[0]&&(i=0)),i)try{if(s=1,n&&(a=c[0]&2?n["return"]:c[0]?n["throw"]||((a=n["return"])&&a.call(n),0):n.next)&&!(a=a.call(n,c[1])).done)return a;if(n=0,a)c=[c[0]&2,a.value];switch(c[0]){case 0:case 1:a=c;break;case 4:i.label++;return{value:c[1],done:false};case 5:i.label++;n=c[1];c=[0];continue;case 7:c=i.ops.pop();i.trys.pop();continue;default:if(!(a=i.trys,a=a.length>0&&a[a.length-1])&&(c[0]===6||c[0]===2)){i=0;continue}if(c[0]===3&&(!a||c[1]>a[0]&&c[1]<a[3])){i.label=c[1];break}if(c[0]===6&&i.label<a[1]){i.label=a[1];a=c;break}if(a&&i.label<a[2]){i.label=a[2];i.ops.push(c);break}if(a[2])i.ops.pop();i.trys.pop();continue}c=e.call(t,i)}catch(t){c=[6,t];n=0}finally{s=a=0}if(c[0]&5)throw c[1];return{value:c[0]?c[1]:void 0,done:true}}};import{r as registerInstance,c as createEvent,h,a as Host,g as getElement}from"./index-67fd55c9.js";import{f as fetchTranslations}from"./translation-utils-2623783f.js";import{m as media,a as addMediaChangeListener,r as removeMediaChangeListener}from"./media-utils-9b041ceb.js";var stzhActionsetCss=".sc-stzh-actionset-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-actionset-h{display:none}.sc-stzh-actionset-h *.sc-stzh-actionset,.sc-stzh-actionset-h *.sc-stzh-actionset::before,.sc-stzh-actionset-h *.sc-stzh-actionset::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-actionset__actions.sc-stzh-actionset{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.stzh-actionset__actions-wrapper.sc-stzh-actionset{position:relative;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;overflow:hidden}.stzh-actionset__action.sc-stzh-actionset:not(:last-child){margin-right:var(--stzh-space-xsmall)}.stzh-actionset__action-popover.sc-stzh-actionset{opacity:0}.stzh-actionset--has-collapsed-items.sc-stzh-actionset .stzh-actionset__action-popover.sc-stzh-actionset{--width:auto;opacity:1}@media screen and (min-width: 1024px){.stzh-actionset--overflow.sc-stzh-actionset .stzh-actionset__action.sc-stzh-actionset{--white-space:nowrap}}@media screen and (max-width: 599px){.stzh-actionset--stack.sc-stzh-actionset .stzh-actionset__actions.sc-stzh-actionset{-ms-flex-direction:column;flex-direction:column;-ms-flex-align:stretch;align-items:stretch}}@media screen and (max-width: 599px){.stzh-actionset--stack.sc-stzh-actionset .stzh-actionset__actions-wrapper.sc-stzh-actionset{-ms-flex-direction:column;flex-direction:column;-ms-flex-align:stretch;align-items:stretch}}@media screen and (min-width: 600px){.stzh-actionset--stack.sc-stzh-actionset .stzh-actionset__action.sc-stzh-actionset{--white-space:nowrap}}@media screen and (max-width: 599px){.stzh-actionset--stack.sc-stzh-actionset .stzh-actionset__action.sc-stzh-actionset:not(:last-child){margin-bottom:var(--stzh-space-xsmall);margin-right:0}}@media screen and (max-width: 599px){.stzh-actionset--stack.sc-stzh-actionset .stzh-actionset__action-popover.sc-stzh-actionset{margin-top:var(--stzh-space-xsmall)}}@media screen and (max-width: 599px){.stzh-actionset--stack.sc-stzh-actionset:not(.stzh-actionset--has-collapsed-items) .stzh-actionset__action-popover.sc-stzh-actionset{display:none}}";var StzhActionset=function(){function t(t){var e=this;registerInstance(this,t);this.stzhActionClick=createEvent(this,"stzhActionClick",7);this._actions=[];this.actionClick=function(t,i){e.stzhActionClick.emit({component:"stzh-actionset",action:t,originalEvent:i})};this.update=function(){e.isSmall=media("small").matches;e.isMedium=media("medium").matches;if(!e.actionsElement){return}Object.assign(e.actionsElement.style,{width:null,height:null});var t=0;if(e.variant==="overflow"&&e.isMedium||e.variant==="stack"&&e.isSmall){e.dynamicActions=true;var i=0;var s=0;Array.from(e.actionsElement.children).forEach((function(e){if(e.offsetTop===0){t++;var n=getComputedStyle(e);var a=parseInt(n.marginLeft);var o=parseInt(n.marginRight);var c=parseInt(n.marginTop);var r=parseInt(n.marginBottom);var h=e.offsetWidth+a+o;var l=e.offsetHeight+c+r;if(i<l){i=l}s=s+h+1}}));Object.assign(e.actionsElement.style,{width:"".concat(s,"px"),height:"".concat(i,"px")})}else{e.dynamicActions=false;if(e.variant==="overflow"){t=0}else if(e.variant==="stack"){t=e._actions.length<=3?e._actions.length:2}}e.actionsCollapsed=e._actions.slice(t)};this.handleResize=function(){if(e.debounceResize){window.cancelAnimationFrame(e.debounceResize)}e.debounceResize=requestAnimationFrame(e.update)};this.mediaChangeHandler=function(){e.actionsCollapsed=[];requestAnimationFrame(e.update)};this.localization=undefined;this.variant="stack";this.popoverButtonVariant="";this.popoverButtonSize="";this.popoverPlacement="bottom-end";this.actions=[];this.actionsCollapsed=[];this.dynamicActions=undefined;this.isSmall=undefined;this.isMedium=undefined}t.prototype.actionsWatcher=function(t){if(typeof t==="string"){this._actions=JSON.parse(t)}else{this._actions=t}};t.prototype.componentWillLoad=function(){return __awaiter(this,void 0,void 0,(function(){var t;return __generator(this,(function(e){switch(e.label){case 0:this.actionsWatcher(this.actions);if(!!this.localization)return[3,2];t=this;return[4,fetchTranslations(this.element,"actionset")];case 1:t.localization=e.sent();e.label=2;case 2:return[2]}}))}))};t.prototype.connectedCallback=function(){addMediaChangeListener(this.mediaChangeHandler);this.resizeObserver=new ResizeObserver(this.handleResize);this.resizeObserver.observe(this.element)};t.prototype.disconnectedCallback=function(){removeMediaChangeListener(this.mediaChangeHandler);if(this.resizeObserver){this.resizeObserver.disconnect()}};t.prototype.componentDidLoad=function(){this.update()};t.prototype.render=function(){var t;var e=this;var i=(t={"stzh-actionset":true,"stzh-actionset--has-collapsed-items":this.actionsCollapsed.length>0},t["stzh-actionset--".concat(this.variant)]=!!this.variant,t);var s=function(t){return h("stzh-button",{class:{"stzh-actionset__action":true,"is-button":true},role:"listitem",icon:t.icon,iconPosition:t.iconPosition,iconOnly:t.iconOnly,badge:t.badge,variant:t.variant?t.variant:e.variant==="stack"?"secondary":"tertiary",size:t.size?t.size:e.variant==="stack"?"default":"tiny",badgePosition:"icon",onClick:function(i){e.actionClick(t,i)}},h("span",{class:{}},t.label))};return h(Host,{"has-collapsed-items":this.actionsCollapsed.length>0},h("div",{class:i},h("div",{class:"stzh-actionset__actions",role:"list"},h("div",{ref:function(t){return e.actionsElement=t},class:"stzh-actionset__actions-wrapper"},this._actions.map((function(t){return(e.dynamicActions||!e.dynamicActions&&e.actionsCollapsed.indexOf(t)===-1)&&(t.tooltipContent?h("stzh-tooltip",{strategy:"fixed",content:t.tooltipContent},s(t)):s(t))}))),h("stzh-popover",{label:this.variant==="stack"?this.localization.furtherActions:!this.isMedium?this.localization.actions:"",strategy:"fixed",placement:this.popoverPlacement,class:"stzh-actionset__action-popover"},h("stzh-button",{fullwidth:true,disabled:this.actionsCollapsed.length===0,class:"stzh-actionset__action is-further",variant:this.popoverButtonVariant!==""?this.popoverButtonVariant:this.variant==="stack"?"secondary":"tertiary",size:this.popoverButtonSize!==""?this.popoverButtonSize:this.variant==="stack"?"default":"tiny",icon:this.variant==="stack"?"angle-down":"more-vertical",iconOnly:this.variant==="overflow"&&this.isMedium,iconPosition:"right",label:this.variant==="stack"?this.localization.furtherActions:!this.isMedium?this.localization.actions:""}),h("stzh-menu",{slot:"content"},this.actionsCollapsed.map((function(t){return h("stzh-menu-item",{icon:t.icon,badge:t.badge,badgeEmpty:t.badgeEmpty,badgeType:t.badgeType,onClick:function(i){e.actionClick(t,i)}},t.label)})))))))};Object.defineProperty(t.prototype,"element",{get:function(){return getElement(this)},enumerable:false,configurable:true});Object.defineProperty(t,"watchers",{get:function(){return{actions:["actionsWatcher"]}},enumerable:false,configurable:true});return t}();StzhActionset.style=stzhActionsetCss;export{StzhActionset as stzh_actionset};
+var __awaiter=this&&this.__awaiter||function(t,e,i,s){function n(t){return t instanceof i?t:new i((function(e){e(t)}))}return new(i||(i=Promise))((function(i,a){function o(t){try{r(s.next(t))}catch(t){a(t)}}function c(t){try{r(s["throw"](t))}catch(t){a(t)}}function r(t){t.done?i(t.value):n(t.value).then(o,c)}r((s=s.apply(t,e||[])).next())}))};var __generator=this&&this.__generator||function(t,e){var i={label:0,sent:function(){if(a[0]&1)throw a[1];return a[1]},trys:[],ops:[]},s,n,a,o;return o={next:c(0),throw:c(1),return:c(2)},typeof Symbol==="function"&&(o[Symbol.iterator]=function(){return this}),o;function c(t){return function(e){return r([t,e])}}function r(c){if(s)throw new TypeError("Generator is already executing.");while(o&&(o=0,c[0]&&(i=0)),i)try{if(s=1,n&&(a=c[0]&2?n["return"]:c[0]?n["throw"]||((a=n["return"])&&a.call(n),0):n.next)&&!(a=a.call(n,c[1])).done)return a;if(n=0,a)c=[c[0]&2,a.value];switch(c[0]){case 0:case 1:a=c;break;case 4:i.label++;return{value:c[1],done:false};case 5:i.label++;n=c[1];c=[0];continue;case 7:c=i.ops.pop();i.trys.pop();continue;default:if(!(a=i.trys,a=a.length>0&&a[a.length-1])&&(c[0]===6||c[0]===2)){i=0;continue}if(c[0]===3&&(!a||c[1]>a[0]&&c[1]<a[3])){i.label=c[1];break}if(c[0]===6&&i.label<a[1]){i.label=a[1];a=c;break}if(a&&i.label<a[2]){i.label=a[2];i.ops.push(c);break}if(a[2])i.ops.pop();i.trys.pop();continue}c=e.call(t,i)}catch(t){c=[6,t];n=0}finally{s=a=0}if(c[0]&5)throw c[1];return{value:c[0]?c[1]:void 0,done:true}}};import{r as registerInstance,c as createEvent,h,a as Host,g as getElement}from"./index-67fd55c9.js";import{f as fetchTranslations}from"./translation-utils-2623783f.js";import{m as media,a as addMediaChangeListener,r as removeMediaChangeListener}from"./media-utils-9b041ceb.js";var stzhActionsetCss=".sc-stzh-actionset-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-actionset-h{display:none}.sc-stzh-actionset-h *.sc-stzh-actionset,.sc-stzh-actionset-h *.sc-stzh-actionset::before,.sc-stzh-actionset-h *.sc-stzh-actionset::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-actionset__actions.sc-stzh-actionset{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.stzh-actionset__actions-wrapper.sc-stzh-actionset{position:relative;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;overflow:hidden}.stzh-actionset__action.sc-stzh-actionset:not(:last-child){margin-right:var(--stzh-space-xsmall)}.stzh-actionset__action-popover.sc-stzh-actionset{opacity:0}.stzh-actionset--has-collapsed-items.sc-stzh-actionset .stzh-actionset__action-popover.sc-stzh-actionset{--width:auto;opacity:1}@media screen and (min-width: 1024px){.stzh-actionset--overflow.sc-stzh-actionset .stzh-actionset__action.sc-stzh-actionset{--white-space:nowrap}}@media screen and (max-width: 599px){.stzh-actionset--stack.sc-stzh-actionset .stzh-actionset__actions.sc-stzh-actionset{-ms-flex-direction:column;flex-direction:column;-ms-flex-align:stretch;align-items:stretch}}@media screen and (max-width: 599px){.stzh-actionset--stack.sc-stzh-actionset .stzh-actionset__actions-wrapper.sc-stzh-actionset{-ms-flex-direction:column;flex-direction:column;-ms-flex-align:stretch;align-items:stretch}}@media screen and (min-width: 600px){.stzh-actionset--stack.sc-stzh-actionset .stzh-actionset__action.sc-stzh-actionset{--white-space:nowrap}}@media screen and (max-width: 599px){.stzh-actionset--stack.sc-stzh-actionset .stzh-actionset__action.sc-stzh-actionset:not(:last-child){margin-bottom:var(--stzh-space-xsmall);margin-right:0}}@media screen and (max-width: 599px){.stzh-actionset--stack.sc-stzh-actionset .stzh-actionset__action-popover.sc-stzh-actionset{margin-top:var(--stzh-space-xsmall)}}@media screen and (max-width: 599px){.stzh-actionset--stack.sc-stzh-actionset:not(.stzh-actionset--has-collapsed-items) .stzh-actionset__action-popover.sc-stzh-actionset{display:none}}";var StzhActionset=function(){function t(t){var e=this;registerInstance(this,t);this.stzhActionClick=createEvent(this,"stzhActionClick",7);this._actions=[];this.actionClick=function(t,i){e.stzhActionClick.emit({component:"stzh-actionset",action:t,originalEvent:i})};this.update=function(){e.isSmall=media("small").matches;e.isMedium=media("medium").matches;if(!e.actionsElement){return}Object.assign(e.actionsElement.style,{width:null,height:null});var t=0;if(e.variant==="overflow"&&e.isMedium||e.variant==="stack"&&e.isSmall){e.dynamicActions=true;var i=0;var s=0;Array.from(e.actionsElement.children).forEach((function(e){if(e.offsetTop===0){t++;var n=getComputedStyle(e);var a=parseInt(n.marginLeft);var o=parseInt(n.marginRight);var c=parseInt(n.marginTop);var r=parseInt(n.marginBottom);var h=e.offsetWidth+a+o;var l=e.offsetHeight+c+r;if(i<l){i=l}s=s+h+1}}));Object.assign(e.actionsElement.style,{width:"".concat(s,"px"),height:"".concat(i,"px")})}else{e.dynamicActions=false;if(e.variant==="overflow"){t=0}else if(e.variant==="stack"){t=e._actions.length<=3?e._actions.length:2}}e.actionsCollapsed=e._actions.slice(t)};this.handleResize=function(){if(e.debounceResize){window.cancelAnimationFrame(e.debounceResize)}e.debounceResize=requestAnimationFrame(e.update)};this.mediaChangeHandler=function(){e.actionsCollapsed=[];requestAnimationFrame(e.update)};this.localization=undefined;this.variant="stack";this.popoverButtonVariant="";this.popoverButtonSize="";this.popoverPlacement="bottom-end";this.actions=[];this.actionsCollapsed=[];this.dynamicActions=undefined;this.isSmall=undefined;this.isMedium=undefined}t.prototype.actionsWatcher=function(t){if(typeof t==="string"){this._actions=JSON.parse(t)}else{this._actions=t}};t.prototype.componentWillLoad=function(){return __awaiter(this,void 0,void 0,(function(){var t;return __generator(this,(function(e){switch(e.label){case 0:this.actionsWatcher(this.actions);if(!!this.localization)return[3,2];t=this;return[4,fetchTranslations(this.element,"actionset")];case 1:t.localization=e.sent();e.label=2;case 2:return[2]}}))}))};t.prototype.connectedCallback=function(){addMediaChangeListener(this.mediaChangeHandler);this.resizeObserver=new ResizeObserver(this.handleResize);this.resizeObserver.observe(this.element)};t.prototype.disconnectedCallback=function(){removeMediaChangeListener(this.mediaChangeHandler);if(this.resizeObserver){this.resizeObserver.disconnect()}};t.prototype.componentDidLoad=function(){this.update()};t.prototype.render=function(){var t;var e=this;var i=(t={"stzh-actionset":true,"stzh-actionset--has-collapsed-items":this.actionsCollapsed.length>0},t["stzh-actionset--".concat(this.variant)]=!!this.variant,t);var s=function(t){return h("stzh-button",{class:{"stzh-actionset__action":true,"is-button":true},icon:t.icon,iconPosition:t.iconPosition,iconOnly:t.iconOnly,badge:t.badge,variant:t.variant?t.variant:e.variant==="stack"?"secondary":"tertiary",size:t.size?t.size:e.variant==="stack"?"default":"tiny",badgePosition:"icon",onClick:function(i){e.actionClick(t,i)}},h("span",{class:{}},t.label))};return h(Host,{"has-collapsed-items":this.actionsCollapsed.length>0},h("div",{class:i},h("div",{class:"stzh-actionset__actions",role:"group"},h("div",{ref:function(t){return e.actionsElement=t},class:"stzh-actionset__actions-wrapper"},this._actions.map((function(t){return(e.dynamicActions||!e.dynamicActions&&e.actionsCollapsed.indexOf(t)===-1)&&(t.tooltipContent?h("stzh-tooltip",{strategy:"fixed",content:t.tooltipContent},s(t)):s(t))}))),h("stzh-popover",{label:this.variant==="stack"?this.localization.furtherActions:!this.isMedium?this.localization.actions:"",strategy:"fixed",placement:this.popoverPlacement,class:"stzh-actionset__action-popover"},h("stzh-button",{fullwidth:true,disabled:this.actionsCollapsed.length===0,class:"stzh-actionset__action is-further",variant:this.popoverButtonVariant!==""?this.popoverButtonVariant:this.variant==="stack"?"secondary":"tertiary",size:this.popoverButtonSize!==""?this.popoverButtonSize:this.variant==="stack"?"default":"tiny",icon:this.variant==="stack"?"angle-down":"more-vertical",iconOnly:this.variant==="overflow"&&this.isMedium,iconPosition:"right",label:this.variant==="stack"?this.localization.furtherActions:!this.isMedium?this.localization.actions:""}),h("stzh-menu",{slot:"content"},this.actionsCollapsed.map((function(t){return h("stzh-menu-item",{icon:t.icon,badge:t.badge,badgeEmpty:t.badgeEmpty,badgeType:t.badgeType,onClick:function(i){e.actionClick(t,i)}},t.label)})))))))};Object.defineProperty(t.prototype,"element",{get:function(){return getElement(this)},enumerable:false,configurable:true});Object.defineProperty(t,"watchers",{get:function(){return{actions:["actionsWatcher"]}},enumerable:false,configurable:true});return t}();StzhActionset.style=stzhActionsetCss;export{StzhActionset as stzh_actionset};
 //# sourceMappingURL=stzh-actionset.entry.js.map

package/dist/esm-es5/stzh-actionset.entry.js.map

@@ -1 +1 @@
-{"version":3,"names":["stzhActionsetCss","StzhActionset","this","_actions","actionClick","action","originalEvent","_this","stzhActionClick","emit","component","update","isSmall","media","matches","isMedium","actionsElement","Object","assign","style","width","height","newActionsVisible","variant","dynamicActions","newActionsHeight_1","newActionsWidth_1","Array","from","children","forEach","child","offsetTop","getComputedStyle","marginLeft","parseInt","marginRight","marginTop","marginBottom","childWidth","offsetWidth","childHeight","offsetHeight","concat","length","actionsCollapsed","slice","handleResize","debounceResize","window","cancelAnimationFrame","requestAnimationFrame","mediaChangeHandler","class_1","prototype","actionsWatcher","newValue","JSON","parse","componentWillLoad","actions","localization","_a","fetchTranslations","element","_b","sent","connectedCallback","addMediaChangeListener","resizeObserver","ResizeObserver","observe","disconnectedCallback","removeMediaChangeListener","disconnect","componentDidLoad","render","classes","Action","h","class","role","icon","iconPosition","iconOnly","badge","size","badgePosition","onClick","e","label","Host","ref","el","map","indexOf","tooltipContent","strategy","content","furtherActions","placement","popoverPlacement","fullwidth","disabled","popoverButtonVariant","popoverButtonSize","slot","badgeEmpty","badgeType"],"sources":["src/components/stzh-actionset/stzh-actionset.scss?tag=stzh-actionset&encapsulation=scoped","src/components/stzh-actionset/stzh-actionset.tsx"],"sourcesContent":[":host {\n\n}\n\n.stzh-actionset {\n  &__actions {\n    display: flex;\n    align-items: center;\n  }\n\n  &__actions-wrapper {\n    position: relative;\n    display: flex;\n    flex-wrap: wrap;\n    overflow: hidden;\n  }\n\n  &__action {\n    &:not(:last-child) {\n      margin-right: space('xsmall');\n    }\n  }\n\n  &__action-popover {\n    opacity: 0;\n  }\n\n  &--has-collapsed-items &__action-popover {\n    --width: auto;\n    opacity: 1;\n  }\n\n  /* Overflow variant */\n\n  &--overflow &__action {\n    @include mq($from: medium) {\n      --white-space: nowrap;\n    }\n  }\n\n  /* Stack variant */\n\n  &--stack &__actions {\n    @include mq($to: small) {\n      flex-direction: column;\n      align-items: stretch;\n    }\n  }\n\n  &--stack &__actions-wrapper {    \n    @include mq($to: small) {\n      flex-direction: column;\n      align-items: stretch;\n    }\n  }\n\n  &--stack &__action {\n    @include mq($from: small) {\n      --white-space: nowrap;\n    }\n\n    &:not(:last-child) {\n      @include mq($to: small) {\n        margin-bottom: space('xsmall');\n        margin-right: 0;\n      }\n    }\n  }\n\n  &--stack &__action-popover {\n    @include mq($to: small) {\n      margin-top: space('xsmall');\n    }\n  }\n\n  // Hide more action popover on small if it has no collapsed items\n\n  &--stack:not(#{&}--has-collapsed-items) &__action-popover {\n    @include mq($to: small) {\n      display: none;\n    }\n  }\n}\n","import {\n  Component,\n  Host,\n  Prop,\n  h,\n  Element,\n  Watch,\n  Event,\n  EventEmitter,\n  State\n} from \"@stencil/core\";\n\nimport {\n  StzhActionsetItem,\n  StzhActionsetItemClickEvent\n} from \"../../index\";\n\nimport { fetchTranslations } from \"../../utils/translation-utils\";\nimport { StzhActionsetLocalizedText } from './stzh-actionset.localization';\n\nimport {\n  media,\n  addMediaChangeListener,\n  removeMediaChangeListener\n} from '../../utils/media-utils';\n\nimport {\n  Placement,\n} from \"@floating-ui/dom\";\n\n/**\n */\n@Component({\n  tag: \"stzh-actionset\",\n  styleUrl: \"stzh-actionset.scss\",\n  scoped: true\n})\nexport class StzhActionset {\n  /** Translation strings */\n  @Prop() localization: StzhActionsetLocalizedText;\n\n  /** Variant determining what position the action buttons are */\n  @Prop({ reflect: true }) variant: \"stack\" | \"overflow\" = \"stack\";\n\n  /** Button variant of popover button (button thats holds collapsed actions) */\n  @Prop({ reflect: true }) popoverButtonVariant: \"\" | \"default\" | \"secondary\" | \"input\" | \"tertiary\" = \"\";\n\n  /** Button size of popover button (button that holds collapsed actions) */\n  @Prop({ reflect: true }) popoverButtonSize: \"\" | \"default\" | \"small\" | \"tiny\" = \"\";\n\n  /** Popover placement of button that holds collapsed actions */\n  @Prop({ reflect: true }) popoverPlacement: Placement = \"bottom-end\";\n\n  /**\n   * Card header actions.\n   * Array of objects that can include the button attributes `id`, `variant`, `icon`, `size`, `iconPosition`, `iconOnly`, `label` or `badge`:\n   * `[{\"id\":\"action-1\", \"icon\": \"alarm-bell\", \"label\": \"Lorem\"}, {\"id\":\"action-2\", \"icon\": \"mail\", \"label\": \"Lorem\"}]`\n   */\n  @Prop() actions: StzhActionsetItem[] | string = [];\n  private _actions: StzhActionsetItem[] = [];\n\n  /** Header action click event */\n  @Event() stzhActionClick: EventEmitter<StzhActionsetItemClickEvent>;\n\n  @Element() element: HTMLStzhActionsetElement;\n\n  @Watch(\"actions\")\n  actionsWatcher(newValue: StzhActionsetItem[] | string) {\n    if (typeof newValue === \"string\") {\n      this._actions = JSON.parse(newValue);\n    } else {\n      this._actions = newValue;\n    }\n  }\n\n  @State() actionsCollapsed: StzhActionsetItem[] = [];\n  @State() dynamicActions: boolean;\n  @State() isSmall: boolean;\n  @State() isMedium: boolean;\n\n  private actionsElement: HTMLElement;\n  private debounceResize: number;\n  private resizeObserver: ResizeObserver;\n\n  private actionClick = (action: StzhActionsetItem, originalEvent: MouseEvent) => {\n    this.stzhActionClick.emit({\n      component: \"stzh-actionset\",\n      action,\n      originalEvent\n    });\n  }\n\n  private update = () => {\n    this.isSmall = media(\"small\").matches;\n    this.isMedium = media(\"medium\").matches;\n\n    if (!this.actionsElement) {\n      return;\n    }\n\n    Object.assign(this.actionsElement.style, {\n      width: null,\n      height: null\n    });\n\n    let newActionsVisible = 0;\n\n    if (\n      this.variant === \"overflow\" && this.isMedium\n      || this.variant === \"stack\" && this.isSmall\n    ) {\n      this.dynamicActions = true;\n\n      let newActionsHeight = 0;\n      let newActionsWidth = 0;\n\n      // update height and width\n      Array.from(this.actionsElement.children).forEach((child: HTMLElement) => {\n        // check which item is visible and\n        if (child.offsetTop === 0) {\n          newActionsVisible++;\n\n          const style = getComputedStyle(child);\n          const marginLeft = parseInt(style.marginLeft);\n          const marginRight = parseInt(style.marginRight);\n          const marginTop = parseInt(style.marginTop);\n          const marginBottom = parseInt(style.marginBottom);\n\n          const childWidth = child.offsetWidth + marginLeft + marginRight;\n          const childHeight = child.offsetHeight + marginTop + marginBottom;\n\n          if (newActionsHeight < childHeight) {\n            newActionsHeight = childHeight;\n          }\n\n          newActionsWidth = newActionsWidth + childWidth + 1;\n        }\n      });\n\n      Object.assign(this.actionsElement.style, {\n        width: `${newActionsWidth}px`,\n        height: `${newActionsHeight}px`\n      });\n    } else {\n      this.dynamicActions = false;\n\n      if (this.variant === \"overflow\") {\n        newActionsVisible = 0;\n      } else if (this.variant === \"stack\") {\n        newActionsVisible = this._actions.length <= 3 ? this._actions.length : 2;\n      }\n    }\n\n    this.actionsCollapsed = this._actions.slice(newActionsVisible);\n  }\n\n  private handleResize = () => {\n    if (this.debounceResize) {\n      window.cancelAnimationFrame(this.debounceResize);\n    }\n\n    this.debounceResize = requestAnimationFrame(this.update);\n  }\n\n  private mediaChangeHandler = () => {\n    this.actionsCollapsed = [];\n    requestAnimationFrame(this.update);\n  }\n\n  async componentWillLoad() {\n    this.actionsWatcher(this.actions);\n\n    if (!this.localization) {\n      this.localization = await fetchTranslations(this.element, \"actionset\");\n    }\n  }\n\n  connectedCallback() {\n    addMediaChangeListener(this.mediaChangeHandler);\n\n    this.resizeObserver = new ResizeObserver(this.handleResize);\n    this.resizeObserver.observe(this.element);\n  }\n\n  disconnectedCallback() {\n    removeMediaChangeListener(this.mediaChangeHandler);\n\n    if (this.resizeObserver) {\n      this.resizeObserver.disconnect();\n    }\n  }\n\n  componentDidLoad() {\n    this.update();\n  }\n\n  render() {\n    const classes = {\n      \"stzh-actionset\": true,\n      // \"stzh-actionset--has-dynamic-actions\": this.dynamicActions,\n      \"stzh-actionset--has-collapsed-items\": this.actionsCollapsed.length > 0,\n      [`stzh-actionset--${this.variant}`]: !!this.variant\n    };\n\n    const Action = (action: StzhActionsetItem) => (\n      <stzh-button\n        class={{\n          \"stzh-actionset__action\": true,\n          \"is-button\": true,\n          // \"show-medium\": !action.onlyCollapseText,\n          // \"hide-when-collapsed\": !action.onlyCollapseText,\n          // \"hide-text-when-collapsed\": action.onlyCollapseText\n        }}\n        role=\"listitem\"\n        icon={action.icon}\n        iconPosition={action.iconPosition}\n        iconOnly={action.iconOnly}\n        badge={action.badge}\n        variant={action.variant\n          ? action.variant\n          : (this.variant === \"stack\" ? \"secondary\" : \"tertiary\")}\n        size={action.size\n          ? action.size\n          : (this.variant === \"stack\" ? \"default\" : \"tiny\")}\n        badgePosition=\"icon\"\n        onClick={(e) => { this.actionClick(action, e) }}\n      >\n        <span\n          class={{\n            // \"show-medium\": action.onlyCollapseText,\n            // \"hide-when-collapsed\": action.onlyCollapseText\n          }}\n        >\n          {action.label}\n        </span>\n      </stzh-button>\n    );\n\n    return (\n      <Host has-collapsed-items={this.actionsCollapsed.length > 0}>\n        <div class={classes}>\n          <div class=\"stzh-actionset__actions\" role=\"list\">\n            <div\n              ref={(el) => (this.actionsElement = el as HTMLElement)}\n              class=\"stzh-actionset__actions-wrapper\"\n            >\n              {this._actions.map(action => (\n                (this.dynamicActions\n                  || (!this.dynamicActions &&\n                    this.actionsCollapsed.indexOf(action) === -1))\n                &&\n                  (action.tooltipContent\n                    ?\n                    <stzh-tooltip\n                      strategy=\"fixed\"\n                      content={action.tooltipContent}\n                    >\n                      {Action(action)}\n                    </stzh-tooltip>\n                    :\n                    Action(action))\n              ))}\n            </div>\n\n            <stzh-popover\n              label={this.variant === \"stack\"\n                ? this.localization.furtherActions\n                : (!this.isMedium ? this.localization.actions : \"\")}\n              strategy=\"fixed\"\n              placement={this.popoverPlacement}\n              class=\"stzh-actionset__action-popover\"\n            >\n              <stzh-button\n                fullwidth\n                disabled={this.actionsCollapsed.length === 0}\n                class=\"stzh-actionset__action is-further\"\n                variant={this.popoverButtonVariant !== \"\"\n                  ? this.popoverButtonVariant\n                  : (this.variant === \"stack\" ? \"secondary\" : \"tertiary\")}\n                size={this.popoverButtonSize !== \"\"\n                ? this.popoverButtonSize\n                : (this.variant === \"stack\" ? \"default\" : \"tiny\")}\n                icon={this.variant === \"stack\" ? \"angle-down\" : \"more-vertical\"}\n                iconOnly={this.variant === \"overflow\" && this.isMedium}\n                iconPosition=\"right\"\n                label={this.variant === \"stack\"\n                  ? this.localization.furtherActions\n                  : (!this.isMedium ? this.localization.actions : \"\")}\n              ></stzh-button>\n              <stzh-menu slot=\"content\">\n                {this.actionsCollapsed.map(action => (\n                  <stzh-menu-item\n                    // class=\"hide-medium show-when-collapsed\"\n                    icon={action.icon}\n                    badge={action.badge}\n                    badgeEmpty={action.badgeEmpty}\n                    badgeType={action.badgeType}\n                    onClick={(e) => { this.actionClick(action, e) }}\n                  >\n                    {action.label}\n                  </stzh-menu-item>\n                ))}\n              </stzh-menu>\n            </stzh-popover>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}
+{"version":3,"names":["stzhActionsetCss","StzhActionset","this","_actions","actionClick","action","originalEvent","_this","stzhActionClick","emit","component","update","isSmall","media","matches","isMedium","actionsElement","Object","assign","style","width","height","newActionsVisible","variant","dynamicActions","newActionsHeight_1","newActionsWidth_1","Array","from","children","forEach","child","offsetTop","getComputedStyle","marginLeft","parseInt","marginRight","marginTop","marginBottom","childWidth","offsetWidth","childHeight","offsetHeight","concat","length","actionsCollapsed","slice","handleResize","debounceResize","window","cancelAnimationFrame","requestAnimationFrame","mediaChangeHandler","class_1","prototype","actionsWatcher","newValue","JSON","parse","componentWillLoad","actions","localization","_a","fetchTranslations","element","_b","sent","connectedCallback","addMediaChangeListener","resizeObserver","ResizeObserver","observe","disconnectedCallback","removeMediaChangeListener","disconnect","componentDidLoad","render","classes","Action","h","class","icon","iconPosition","iconOnly","badge","size","badgePosition","onClick","e","label","Host","role","ref","el","map","indexOf","tooltipContent","strategy","content","furtherActions","placement","popoverPlacement","fullwidth","disabled","popoverButtonVariant","popoverButtonSize","slot","badgeEmpty","badgeType"],"sources":["src/components/stzh-actionset/stzh-actionset.scss?tag=stzh-actionset&encapsulation=scoped","src/components/stzh-actionset/stzh-actionset.tsx"],"sourcesContent":[":host {\n\n}\n\n.stzh-actionset {\n  &__actions {\n    display: flex;\n    align-items: center;\n  }\n\n  &__actions-wrapper {\n    position: relative;\n    display: flex;\n    flex-wrap: wrap;\n    overflow: hidden;\n  }\n\n  &__action {\n    &:not(:last-child) {\n      margin-right: space('xsmall');\n    }\n  }\n\n  &__action-popover {\n    opacity: 0;\n  }\n\n  &--has-collapsed-items &__action-popover {\n    --width: auto;\n    opacity: 1;\n  }\n\n  /* Overflow variant */\n\n  &--overflow &__action {\n    @include mq($from: medium) {\n      --white-space: nowrap;\n    }\n  }\n\n  /* Stack variant */\n\n  &--stack &__actions {\n    @include mq($to: small) {\n      flex-direction: column;\n      align-items: stretch;\n    }\n  }\n\n  &--stack &__actions-wrapper {    \n    @include mq($to: small) {\n      flex-direction: column;\n      align-items: stretch;\n    }\n  }\n\n  &--stack &__action {\n    @include mq($from: small) {\n      --white-space: nowrap;\n    }\n\n    &:not(:last-child) {\n      @include mq($to: small) {\n        margin-bottom: space('xsmall');\n        margin-right: 0;\n      }\n    }\n  }\n\n  &--stack &__action-popover {\n    @include mq($to: small) {\n      margin-top: space('xsmall');\n    }\n  }\n\n  // Hide more action popover on small if it has no collapsed items\n\n  &--stack:not(#{&}--has-collapsed-items) &__action-popover {\n    @include mq($to: small) {\n      display: none;\n    }\n  }\n}\n","import {\n  Component,\n  Host,\n  Prop,\n  h,\n  Element,\n  Watch,\n  Event,\n  EventEmitter,\n  State\n} from \"@stencil/core\";\n\nimport {\n  StzhActionsetItem,\n  StzhActionsetItemClickEvent\n} from \"../../index\";\n\nimport { fetchTranslations } from \"../../utils/translation-utils\";\nimport { StzhActionsetLocalizedText } from './stzh-actionset.localization';\n\nimport {\n  media,\n  addMediaChangeListener,\n  removeMediaChangeListener\n} from '../../utils/media-utils';\n\nimport {\n  Placement,\n} from \"@floating-ui/dom\";\n\n/**\n */\n@Component({\n  tag: \"stzh-actionset\",\n  styleUrl: \"stzh-actionset.scss\",\n  scoped: true\n})\nexport class StzhActionset {\n  /** Translation strings */\n  @Prop() localization: StzhActionsetLocalizedText;\n\n  /** Variant determining what position the action buttons are */\n  @Prop({ reflect: true }) variant: \"stack\" | \"overflow\" = \"stack\";\n\n  /** Button variant of popover button (button thats holds collapsed actions) */\n  @Prop({ reflect: true }) popoverButtonVariant: \"\" | \"default\" | \"secondary\" | \"input\" | \"tertiary\" = \"\";\n\n  /** Button size of popover button (button that holds collapsed actions) */\n  @Prop({ reflect: true }) popoverButtonSize: \"\" | \"default\" | \"small\" | \"tiny\" = \"\";\n\n  /** Popover placement of button that holds collapsed actions */\n  @Prop({ reflect: true }) popoverPlacement: Placement = \"bottom-end\";\n\n  /**\n   * Card header actions.\n   * Array of objects that can include the button attributes `id`, `variant`, `icon`, `size`, `iconPosition`, `iconOnly`, `label` or `badge`:\n   * `[{\"id\":\"action-1\", \"icon\": \"alarm-bell\", \"label\": \"Lorem\"}, {\"id\":\"action-2\", \"icon\": \"mail\", \"label\": \"Lorem\"}]`\n   */\n  @Prop() actions: StzhActionsetItem[] | string = [];\n  private _actions: StzhActionsetItem[] = [];\n\n  /** Header action click event */\n  @Event() stzhActionClick: EventEmitter<StzhActionsetItemClickEvent>;\n\n  @Element() element: HTMLStzhActionsetElement;\n\n  @Watch(\"actions\")\n  actionsWatcher(newValue: StzhActionsetItem[] | string) {\n    if (typeof newValue === \"string\") {\n      this._actions = JSON.parse(newValue);\n    } else {\n      this._actions = newValue;\n    }\n  }\n\n  @State() actionsCollapsed: StzhActionsetItem[] = [];\n  @State() dynamicActions: boolean;\n  @State() isSmall: boolean;\n  @State() isMedium: boolean;\n\n  private actionsElement: HTMLElement;\n  private debounceResize: number;\n  private resizeObserver: ResizeObserver;\n\n  private actionClick = (action: StzhActionsetItem, originalEvent: MouseEvent) => {\n    this.stzhActionClick.emit({\n      component: \"stzh-actionset\",\n      action,\n      originalEvent\n    });\n  }\n\n  private update = () => {\n    this.isSmall = media(\"small\").matches;\n    this.isMedium = media(\"medium\").matches;\n\n    if (!this.actionsElement) {\n      return;\n    }\n\n    Object.assign(this.actionsElement.style, {\n      width: null,\n      height: null\n    });\n\n    let newActionsVisible = 0;\n\n    if (\n      this.variant === \"overflow\" && this.isMedium\n      || this.variant === \"stack\" && this.isSmall\n    ) {\n      this.dynamicActions = true;\n\n      let newActionsHeight = 0;\n      let newActionsWidth = 0;\n\n      // update height and width\n      Array.from(this.actionsElement.children).forEach((child: HTMLElement) => {\n        // check which item is visible and\n        if (child.offsetTop === 0) {\n          newActionsVisible++;\n\n          const style = getComputedStyle(child);\n          const marginLeft = parseInt(style.marginLeft);\n          const marginRight = parseInt(style.marginRight);\n          const marginTop = parseInt(style.marginTop);\n          const marginBottom = parseInt(style.marginBottom);\n\n          const childWidth = child.offsetWidth + marginLeft + marginRight;\n          const childHeight = child.offsetHeight + marginTop + marginBottom;\n\n          if (newActionsHeight < childHeight) {\n            newActionsHeight = childHeight;\n          }\n\n          newActionsWidth = newActionsWidth + childWidth + 1;\n        }\n      });\n\n      Object.assign(this.actionsElement.style, {\n        width: `${newActionsWidth}px`,\n        height: `${newActionsHeight}px`\n      });\n    } else {\n      this.dynamicActions = false;\n\n      if (this.variant === \"overflow\") {\n        newActionsVisible = 0;\n      } else if (this.variant === \"stack\") {\n        newActionsVisible = this._actions.length <= 3 ? this._actions.length : 2;\n      }\n    }\n\n    this.actionsCollapsed = this._actions.slice(newActionsVisible);\n  }\n\n  private handleResize = () => {\n    if (this.debounceResize) {\n      window.cancelAnimationFrame(this.debounceResize);\n    }\n\n    this.debounceResize = requestAnimationFrame(this.update);\n  }\n\n  private mediaChangeHandler = () => {\n    this.actionsCollapsed = [];\n    requestAnimationFrame(this.update);\n  }\n\n  async componentWillLoad() {\n    this.actionsWatcher(this.actions);\n\n    if (!this.localization) {\n      this.localization = await fetchTranslations(this.element, \"actionset\");\n    }\n  }\n\n  connectedCallback() {\n    addMediaChangeListener(this.mediaChangeHandler);\n\n    this.resizeObserver = new ResizeObserver(this.handleResize);\n    this.resizeObserver.observe(this.element);\n  }\n\n  disconnectedCallback() {\n    removeMediaChangeListener(this.mediaChangeHandler);\n\n    if (this.resizeObserver) {\n      this.resizeObserver.disconnect();\n    }\n  }\n\n  componentDidLoad() {\n    this.update();\n  }\n\n  render() {\n    const classes = {\n      \"stzh-actionset\": true,\n      // \"stzh-actionset--has-dynamic-actions\": this.dynamicActions,\n      \"stzh-actionset--has-collapsed-items\": this.actionsCollapsed.length > 0,\n      [`stzh-actionset--${this.variant}`]: !!this.variant\n    };\n\n    const Action = (action: StzhActionsetItem) => (\n      <stzh-button\n        class={{\n          \"stzh-actionset__action\": true,\n          \"is-button\": true,\n          // \"show-medium\": !action.onlyCollapseText,\n          // \"hide-when-collapsed\": !action.onlyCollapseText,\n          // \"hide-text-when-collapsed\": action.onlyCollapseText\n        }}\n        icon={action.icon}\n        iconPosition={action.iconPosition}\n        iconOnly={action.iconOnly}\n        badge={action.badge}\n        variant={action.variant\n          ? action.variant\n          : (this.variant === \"stack\" ? \"secondary\" : \"tertiary\")}\n        size={action.size\n          ? action.size\n          : (this.variant === \"stack\" ? \"default\" : \"tiny\")}\n        badgePosition=\"icon\"\n        onClick={(e) => { this.actionClick(action, e) }}\n      >\n        <span\n          class={{\n            // \"show-medium\": action.onlyCollapseText,\n            // \"hide-when-collapsed\": action.onlyCollapseText\n          }}\n        >\n          {action.label}\n        </span>\n      </stzh-button>\n    );\n\n    return (\n      <Host has-collapsed-items={this.actionsCollapsed.length > 0}>\n        <div class={classes}>\n          <div class=\"stzh-actionset__actions\" role=\"group\">\n            <div\n              ref={(el) => (this.actionsElement = el as HTMLElement)}\n              class=\"stzh-actionset__actions-wrapper\"\n            >\n              {this._actions.map(action => (\n                (this.dynamicActions\n                  || (!this.dynamicActions &&\n                    this.actionsCollapsed.indexOf(action) === -1))\n                &&\n                  (action.tooltipContent\n                    ?\n                    <stzh-tooltip\n                      strategy=\"fixed\"\n                      content={action.tooltipContent}\n                    >\n                      {Action(action)}\n                    </stzh-tooltip>\n                    :\n                    Action(action))\n              ))}\n            </div>\n\n            <stzh-popover\n              label={this.variant === \"stack\"\n                ? this.localization.furtherActions\n                : (!this.isMedium ? this.localization.actions : \"\")}\n              strategy=\"fixed\"\n              placement={this.popoverPlacement}\n              class=\"stzh-actionset__action-popover\"\n            >\n              <stzh-button\n                fullwidth\n                disabled={this.actionsCollapsed.length === 0}\n                class=\"stzh-actionset__action is-further\"\n                variant={this.popoverButtonVariant !== \"\"\n                  ? this.popoverButtonVariant\n                  : (this.variant === \"stack\" ? \"secondary\" : \"tertiary\")}\n                size={this.popoverButtonSize !== \"\"\n                ? this.popoverButtonSize\n                : (this.variant === \"stack\" ? \"default\" : \"tiny\")}\n                icon={this.variant === \"stack\" ? \"angle-down\" : \"more-vertical\"}\n                iconOnly={this.variant === \"overflow\" && this.isMedium}\n                iconPosition=\"right\"\n                label={this.variant === \"stack\"\n                  ? this.localization.furtherActions\n                  : (!this.isMedium ? this.localization.actions : \"\")}\n              ></stzh-button>\n              <stzh-menu slot=\"content\">\n                {this.actionsCollapsed.map(action => (\n                  <stzh-menu-item\n                    // class=\"hide-medium show-when-collapsed\"\n                    icon={action.icon}\n                    badge={action.badge}\n                    badgeEmpty={action.badgeEmpty}\n                    badgeType={action.badgeType}\n                    onClick={(e) => { this.actionClick(action, e) }}\n                  >\n                    {action.label}\n                  </stzh-menu-item>\n                ))}\n              </stzh-menu>\n            </stzh-popover>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/esm-es5/stzh-amount.entry.js

@@ -1,2 +1,2 @@
-var __awaiter=this&&this.__awaiter||function(t,e,o,n){function r(t){return t instanceof o?t:new o((function(e){e(t)}))}return new(o||(o=Promise))((function(o,i){function s(t){try{h(n.next(t))}catch(t){i(t)}}function a(t){try{h(n["throw"](t))}catch(t){i(t)}}function h(t){t.done?o(t.value):r(t.value).then(s,a)}h((n=n.apply(t,e||[])).next())}))};var __generator=this&&this.__generator||function(t,e){var o={label:0,sent:function(){if(i[0]&1)throw i[1];return i[1]},trys:[],ops:[]},n,r,i,s;return s={next:a(0),throw:a(1),return:a(2)},typeof Symbol==="function"&&(s[Symbol.iterator]=function(){return this}),s;function a(t){return function(e){return h([t,e])}}function h(a){if(n)throw new TypeError("Generator is already executing.");while(s&&(s=0,a[0]&&(o=0)),o)try{if(n=1,r&&(i=a[0]&2?r["return"]:a[0]?r["throw"]||((i=r["return"])&&i.call(r),0):r.next)&&!(i=i.call(r,a[1])).done)return i;if(r=0,i)a=[a[0]&2,i.value];switch(a[0]){case 0:case 1:i=a;break;case 4:o.label++;return{value:a[1],done:false};case 5:o.label++;r=a[1];a=[0];continue;case 7:a=o.ops.pop();o.trys.pop();continue;default:if(!(i=o.trys,i=i.length>0&&i[i.length-1])&&(a[0]===6||a[0]===2)){o=0;continue}if(a[0]===3&&(!i||a[1]>i[0]&&a[1]<i[3])){o.label=a[1];break}if(a[0]===6&&o.label<i[1]){o.label=i[1];i=a;break}if(i&&o.label<i[2]){o.label=i[2];o.ops.push(a);break}if(i[2])o.ops.pop();o.trys.pop();continue}a=e.call(t,o)}catch(t){a=[6,t];r=0}finally{n=i=0}if(a[0]&5)throw a[1];return{value:a[0]?a[1]:void 0,done:true}}};import{r as registerInstance,h,a as Host}from"./index-67fd55c9.js";import{S as StzhInputDescription}from"./stzh-input-description-cceaa066.js";var stzhAmountCss=":host{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}:host[hidden]{display:none}:host *,:host *::before,:host *::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-amount__marker-symbol{font-family:var(--stzh-font-family-regular);font-weight:var(--stzh-font-weight-regular);font-style:normal}.stzh-amount__marker-text{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-amount__description-wrapper{display:-ms-flexbox;display:flex;-ms-flex-direction:column-reverse;flex-direction:column-reverse}.stzh-amount__error,.stzh-amount__description{font-size:var(--stzh-font-micro-font-size);line-height:var(--stzh-font-micro-text-line-height);color:var(--stzh-base-color)}.stzh-amount__error{color:var(--stzh-color-error)}.stzh-amount__error-list{list-style:none;margin:0;padding:0}.stzh-amount__description{display:-ms-flexbox;display:flex;-ms-flex-align:start;align-items:flex-start}.stzh-amount__description-long{margin-left:var(--stzh-space-xxsmall);margin-top:0.1875rem}.stzh-amount__description-long-popover{--width:auto;--max-width:27.3125rem}.stzh-amount__description-long-popover[open]:not([open=false]) .stzh-amount__description-long-button{color:var(--stzh-color-primary, var(--stzh-color-zueriblue))}.stzh-amount__description-long-button{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-amount__description-long-button:hover{color:var(--stzh-color-primary, var(--stzh-color-zueriblue))}.stzh-amount stzh-icon.stzh-amount__description-long-icon{--size:var(--stzh-icon-size-xsmall)}.stzh-amount--has-error .stzh-amount__error,.stzh-amount--has-description .stzh-amount__description{margin-top:var(--stzh-space-xxsmall)}.stzh-amount__stepper-wrapper{display:-ms-flexbox;display:flex;gap:var(--stzh-space-xxsmall)}.stzh-amount stzh-input.stzh-amount__stepper-input{--text-align:center;width:100%}";var DROPDOWN_ITEM_PLUS_OPTION_VALUE="stzh-amount__dropdown-plus-option";var amountCounter=0;var StzhAmount=function(){function t(t){var e=this;registerInstance(this,t);this._showDropdown=!Number.isNaN(this.minValueDropdown)&&!Number.isNaN(this.maxValueDropdown)&&this.minValueDropdown<this.maxValueDropdown;this.onDropdownChange=function(t){if(t.detail.value===DROPDOWN_ITEM_PLUS_OPTION_VALUE){e._showDropdown=false;e.value=(e.maxValueDropdown+e.step).toString()}else{e.value=(+t.detail.value).toString()}};this.onInputMinusStepClick=function(){e.value=(+e.value-e.step).toString();e.value=e.roundToStep(+e.value).toString()};this.onInputPlusStepClick=function(){e.value=(+e.value+e.step).toString();e.value=e.roundToStep(+e.value).toString()};this.onStepperInputChange=function(t){var o=t.detail.value;o=e.roundToStep(+o).toString();if(+o>e.maxValue){o=e.maxValue.toString()}else if(+o<e.minValue){o=e.minValue.toString()}e.value=o};this.minValue=-9007199254740991;this.maxValue=9007199254740991;this.minValueDropdown=null;this.maxValueDropdown=null;this.value="";this.step=1;this.name="";this.size="default";this.disabled=false;this.popoverPlacement="bottom";this.label="";this.invalid=false;this.required=false;this.clearable=false;this.showMarker=false;this.description=undefined;this.descriptionLong=undefined;this.error=undefined;this.a11yDescribedby=""}t.prototype.minValueDropdownWatcher=function(){this.setDropdownOptions()};t.prototype.maxValueDropdownWatcher=function(){this.setDropdownOptions()};t.prototype.errorWatcher=function(t){if(typeof t==="string"){try{this._error=JSON.parse(t)}catch(e){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.setDropdownOptions=function(){if(this._showDropdown){var t=[];for(var e=this.minValueDropdown;e<=this.maxValueDropdown;e++){t.push({text:e.toString(),value:e.toString()})}if(this.maxValue!=undefined&&this.maxValue>this.maxValueDropdown){t.push({text:"".concat(this.maxValueDropdown.toString(),"+"),value:DROPDOWN_ITEM_PLUS_OPTION_VALUE})}this._dropdownOptions=JSON.stringify(t)}};t.prototype.roundToStep=function(t){var e=Math.max(0,-Math.floor(Math.log10(this.step)));var o=Math.pow(10,e);var n=Math.round(t/this.step)*this.step;return Number((n*o/o).toFixed(e))};t.prototype.componentWillLoad=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){this.amountId="stzh-amount-".concat(amountCounter++);this.stepperInputId="".concat(this.amountId,"-stepper-input");this.setDropdownOptions();this.errorWatcher(this.error);return[2]}))}))};t.prototype.renderDropdown=function(){var t;var e=(t={"stzh-amount__dropdown":true},t["stzh-amount--popover-placement-".concat(this.popoverPlacement)]=!!this.popoverPlacement,t);return h("div",{class:e},h("stzh-dropdown",{options:this._dropdownOptions,items:[this.value],label:this.label,required:this.required,disabled:this.disabled,description:this.description,descriptionLong:this.descriptionLong,error:this.error,popoverPlacement:this.popoverPlacement,a11yDescribedby:this.a11yDescribedby,name:this.name,size:this.size,invalid:this.invalid,showMarker:this.showMarker,onStzhChange:this.onDropdownChange}))};t.prototype.renderInputStepper=function(){return h("div",{class:"stzh-amount__stepper"},h("div",{class:"stzh-amount__stepper-wrapper"},h("stzh-button",{class:"stzh-amount__stepper-minus",onClick:this.onInputMinusStepClick,variant:"secondary",icon:"minus",iconOnly:true,a11yControls:this.stepperInputId,a11yDescribedby:this.a11yDescribedby,size:this.size,disabled:+this.value<=+this.minValue||this.disabled}),h("stzh-input",{class:"stzh-amount__stepper-input",value:this.value,type:"number",label:this.label,min:this.minValue,max:this.maxValue,invalid:this.invalid,name:this.name,id:this.stepperInputId,size:this.size,step:this.step,showMarker:this.showMarker,descriptionLong:this.descriptionLong,clearable:this.clearable,disabled:this.disabled,a11yDescribedby:this.a11yDescribedby,onStzhChange:this.onStepperInputChange}),h("stzh-button",{class:"stzh-amount__stepper-plus",onClick:this.onInputPlusStepClick,variant:"secondary",icon:"plus",iconOnly:true,a11yControls:this.stepperInputId,a11yDescribedby:this.a11yDescribedby,size:this.size,disabled:+this.value>=+this.maxValue||this.disabled})),h(StzhInputDescription,{classPrefix:"stzh-amount",id:"".concat(this.amountId,"-description"),error:this._error,description:this.description,descriptionLong:this.descriptionLong}))};t.prototype.render=function(){var t={"stzh-amount":true,"stzh-amount--has-description":!!this.description,"stzh-amount--has-description-long":!!this.descriptionLong,"stzh-amount--has-error":!!this.error};return h(Host,null,h("div",{class:t,id:this.amountId},this._showDropdown?this.renderDropdown():this.renderInputStepper()))};Object.defineProperty(t,"watchers",{get:function(){return{minValueDropdown:["minValueDropdownWatcher"],maxValueDropdown:["maxValueDropdownWatcher"],error:["errorWatcher"]}},enumerable:false,configurable:true});return t}();StzhAmount.style=stzhAmountCss;export{StzhAmount as stzh_amount};
+var __awaiter=this&&this.__awaiter||function(t,e,o,n){function i(t){return t instanceof o?t:new o((function(e){e(t)}))}return new(o||(o=Promise))((function(o,r){function s(t){try{l(n.next(t))}catch(t){r(t)}}function a(t){try{l(n["throw"](t))}catch(t){r(t)}}function l(t){t.done?o(t.value):i(t.value).then(s,a)}l((n=n.apply(t,e||[])).next())}))};var __generator=this&&this.__generator||function(t,e){var o={label:0,sent:function(){if(r[0]&1)throw r[1];return r[1]},trys:[],ops:[]},n,i,r,s;return s={next:a(0),throw:a(1),return:a(2)},typeof Symbol==="function"&&(s[Symbol.iterator]=function(){return this}),s;function a(t){return function(e){return l([t,e])}}function l(a){if(n)throw new TypeError("Generator is already executing.");while(s&&(s=0,a[0]&&(o=0)),o)try{if(n=1,i&&(r=a[0]&2?i["return"]:a[0]?i["throw"]||((r=i["return"])&&r.call(i),0):i.next)&&!(r=r.call(i,a[1])).done)return r;if(i=0,r)a=[a[0]&2,r.value];switch(a[0]){case 0:case 1:r=a;break;case 4:o.label++;return{value:a[1],done:false};case 5:o.label++;i=a[1];a=[0];continue;case 7:a=o.ops.pop();o.trys.pop();continue;default:if(!(r=o.trys,r=r.length>0&&r[r.length-1])&&(a[0]===6||a[0]===2)){o=0;continue}if(a[0]===3&&(!r||a[1]>r[0]&&a[1]<r[3])){o.label=a[1];break}if(a[0]===6&&o.label<r[1]){o.label=r[1];r=a;break}if(r&&o.label<r[2]){o.label=r[2];o.ops.push(a);break}if(r[2])o.ops.pop();o.trys.pop();continue}a=e.call(t,o)}catch(t){a=[6,t];i=0}finally{n=r=0}if(a[0]&5)throw a[1];return{value:a[0]?a[1]:void 0,done:true}}};var __spreadArray=this&&this.__spreadArray||function(t,e,o){if(o||arguments.length===2)for(var n=0,i=e.length,r;n<i;n++){if(r||!(n in e)){if(!r)r=Array.prototype.slice.call(e,0,n);r[n]=e[n]}}return t.concat(r||Array.prototype.slice.call(e))};import{r as registerInstance,c as createEvent,h,a as Host,g as getElement}from"./index-67fd55c9.js";import{f as fetchTranslations}from"./translation-utils-2623783f.js";var stzhAmountCss=":host{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}:host[hidden]{display:none}:host *,:host *::before,:host *::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-amount__marker-symbol{font-family:var(--stzh-font-family-regular);font-weight:var(--stzh-font-weight-regular);font-style:normal}.stzh-amount__marker-text{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-amount__description-wrapper{display:-ms-flexbox;display:flex;-ms-flex-direction:column-reverse;flex-direction:column-reverse}.stzh-amount__error,.stzh-amount__description{font-size:var(--stzh-font-micro-font-size);line-height:var(--stzh-font-micro-text-line-height);color:var(--stzh-base-color)}.stzh-amount__error{color:var(--stzh-color-error)}.stzh-amount__error-list{list-style:none;margin:0;padding:0}.stzh-amount__description{display:-ms-flexbox;display:flex;-ms-flex-align:start;align-items:flex-start}.stzh-amount__description-long{margin-left:var(--stzh-space-xxsmall);margin-top:0.1875rem}.stzh-amount__description-long-popover{--width:auto;--max-width:27.3125rem}.stzh-amount__description-long-popover[open]:not([open=false]) .stzh-amount__description-long-button{color:var(--stzh-color-primary, var(--stzh-color-zueriblue))}.stzh-amount__description-long-button{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-amount__description-long-button:hover{color:var(--stzh-color-primary, var(--stzh-color-zueriblue))}.stzh-amount stzh-icon.stzh-amount__description-long-icon{--size:var(--stzh-icon-size-xsmall)}.stzh-amount--has-error .stzh-amount__error,.stzh-amount--has-description .stzh-amount__description{margin-top:var(--stzh-space-xxsmall)}.stzh-amount__stepper-wrapper{display:-ms-flexbox;display:flex;-ms-flex-align:start;align-items:flex-start;gap:var(--stzh-space-xxsmall)}.stzh-amount stzh-input.stzh-amount__stepper-input{--text-align:center;width:100%}";var DROPDOWN_ITEM_PLUS_OPTION_VALUE="stzh-amount__dropdown-plus-option";var amountCounter=0;var StzhAmount=function(){function t(t){var e=this;registerInstance(this,t);this.stzhChange=createEvent(this,"stzhChange",7);this._showDropdown=!Number.isNaN(this.minValueDropdown)&&!Number.isNaN(this.maxValueDropdown)&&this.minValueDropdown<this.maxValueDropdown;this.onDropdownChange=function(t){if(t.detail.value===DROPDOWN_ITEM_PLUS_OPTION_VALUE){e._showDropdown=false;e.value=(e.maxValueDropdown+e.step).toString()}else{e.value=(+t.detail.value).toString()}e.stzhChange.emit({component:"stzh-amount",value:e.value})};this.onInputMinusStepClick=function(){e.value=(+e.value-e.step).toString();e.value=e.roundToStep(+e.value).toString();e.stzhChange.emit({component:"stzh-amount",value:e.value})};this.onInputPlusStepClick=function(){e.value=(+e.value+e.step).toString();e.value=e.roundToStep(+e.value).toString();e.stzhChange.emit({component:"stzh-amount",value:e.value})};this.onStepperInputChange=function(t){e.value=t.detail.value;e.stzhChange.emit({component:"stzh-amount",value:e.value})};this.minValue=-9007199254740991;this.maxValue=9007199254740991;this.minValueDropdown=null;this.maxValueDropdown=null;this.value="";this.step=1;this.name="";this.size="default";this.disabled=false;this.popoverPlacement="bottom";this.label="";this.invalid=false;this.required=false;this.clearable=false;this.showMarker=false;this.description=undefined;this.descriptionLong=undefined;this.error=undefined;this.a11yDescribedby="";this.localization=undefined}t.prototype.minValueDropdownWatcher=function(){this.setDropdownOptions()};t.prototype.maxValueDropdownWatcher=function(){this.setDropdownOptions()};t.prototype.errorWatcher=function(t){if(typeof t==="string"){try{this._error=JSON.parse(t)}catch(e){if(t){this._error=[t]}else{this._error=[]}}}else{this._error=t||[]}this.invalid=this._error.length>0};t.prototype.valueWatcher=function(t){if(!this._showDropdown){this.handleOutOfRangeValue(t)}};t.prototype.setDropdownOptions=function(){if(this._showDropdown){var t=[];for(var e=this.minValueDropdown;e<=this.maxValueDropdown;e++){t.push({text:e.toString(),value:e.toString()})}if(this.maxValue!=undefined&&this.maxValue>this.maxValueDropdown){t.push({text:"".concat(this.maxValueDropdown.toString(),"+"),value:DROPDOWN_ITEM_PLUS_OPTION_VALUE})}this._dropdownOptions=JSON.stringify(t)}};t.prototype.handleOutOfRangeValue=function(t){var e,o;if(!this.localization){return}var n=[];if(typeof this.error==="string"){n.push(this.error)}else if(this.error){n=__spreadArray([],this.error,true)}var i=(e=this.localization.amountTooGreatError)===null||e===void 0?void 0:e.replace(/{maxValue}/gi,this.maxValue.toString());var r=(o=this.localization.amountTooSmallError)===null||o===void 0?void 0:o.replace(/{minValue}/gi,this.minValue.toString());if(+t>this.maxValue){if(!n.includes(i)){n.push(i)}}else if(+t<this.minValue){if(!n.includes(r)){n.push(r)}}else{n=n.filter((function(t){return t!==i&&t!==r}))}this.error=n.length>0?n:[]};t.prototype.roundToStep=function(t){var e=Math.max(0,-Math.floor(Math.log10(this.step)));var o=Math.pow(10,e);var n=Math.round(t/this.step)*this.step;return Number((n*o/o).toFixed(e))};t.prototype.componentWillLoad=function(){return __awaiter(this,void 0,void 0,(function(){var t;return __generator(this,(function(e){switch(e.label){case 0:this.errorWatcher(this.error);this.valueWatcher(this.value);if(!!this.localization)return[3,2];t=this;return[4,fetchTranslations(this.element,"amount")];case 1:t.localization=e.sent();e.label=2;case 2:this.amountId="stzh-amount-".concat(amountCounter++);if(this._showDropdown){this.setDropdownOptions()}else{this.stepperInputId="".concat(this.amountId,"-stepper-input")}return[2]}}))}))};t.prototype.renderDropdown=function(){var t;var e=(t={"stzh-amount__dropdown":true},t["stzh-amount--popover-placement-".concat(this.popoverPlacement)]=!!this.popoverPlacement,t);return h("div",{class:e},h("stzh-dropdown",{options:this._dropdownOptions,items:[this.value],label:this.label,required:this.required,disabled:this.disabled,description:this.description,descriptionLong:this.descriptionLong,error:this.error,popoverPlacement:this.popoverPlacement,a11yDescribedby:this.a11yDescribedby,name:this.name,size:this.size,invalid:this.invalid,showMarker:this.showMarker,onStzhChange:this.onDropdownChange}))};t.prototype.renderInputStepper=function(){return h("div",{class:"stzh-amount__stepper"},h("div",{class:"stzh-amount__stepper-wrapper"},h("stzh-button",{class:"stzh-amount__stepper-minus",onClick:this.onInputMinusStepClick,variant:"secondary",icon:"minus",iconOnly:true,a11yControls:this.stepperInputId,a11yDescribedby:this.a11yDescribedby,a11yLabel:"".concat(this.label," ").concat(this.localization.stepperMinusLabel,", ").concat(this.localization.selectedAmountMessage," ").concat(this.value),size:this.size,disabled:+this.value<=+this.minValue||this.disabled,tabindex:this.disabled?null:"-1"}),h("stzh-input",{class:"stzh-amount__stepper-input",value:this.value,type:"number",label:this.label,min:this.minValue,max:this.maxValue,invalid:this.invalid,error:this._error,required:this.required,name:this.name,id:this.stepperInputId,size:this.size,step:this.step,showMarker:this.showMarker,description:this.description,descriptionLong:this.descriptionLong,clearable:this.clearable,disabled:this.disabled,a11yDescribedby:this.a11yDescribedby,onStzhChange:this.onStepperInputChange}),h("stzh-button",{class:"stzh-amount__stepper-plus",onClick:this.onInputPlusStepClick,variant:"secondary",icon:"plus",iconOnly:true,a11yControls:this.stepperInputId,a11yDescribedby:this.a11yDescribedby,a11yLabel:"".concat(this.label," ").concat(this.localization.stepperPlusLabel,", ").concat(this.localization.selectedAmountMessage," ").concat(this.value),size:this.size,disabled:+this.value>=+this.maxValue||this.disabled,tabindex:this.disabled?null:"-1"})))};t.prototype.render=function(){var t={"stzh-amount":true,"stzh-amount--has-description":!!this.description,"stzh-amount--has-description-long":!!this.descriptionLong,"stzh-amount--has-error":!!this.error,"stzh-amount--is-required":!!this.required};return h(Host,null,h("div",{class:t,id:this.amountId},this._showDropdown?this.renderDropdown():this.renderInputStepper()))};Object.defineProperty(t.prototype,"element",{get:function(){return getElement(this)},enumerable:false,configurable:true});Object.defineProperty(t,"watchers",{get:function(){return{minValueDropdown:["minValueDropdownWatcher"],maxValueDropdown:["maxValueDropdownWatcher"],error:["errorWatcher"],value:["valueWatcher"]}},enumerable:false,configurable:true});return t}();StzhAmount.style=stzhAmountCss;export{StzhAmount as stzh_amount};
 //# sourceMappingURL=stzh-amount.entry.js.map

package/dist/esm-es5/stzh-amount.entry.js.map

@@ -1 +1 @@
-{"version":3,"names":["stzhAmountCss","DROPDOWN_ITEM_PLUS_OPTION_VALUE","amountCounter","StzhAmount","this","_showDropdown","Number","isNaN","minValueDropdown","maxValueDropdown","onDropdownChange","event","detail","value","_this","step","toString","onInputMinusStepClick","roundToStep","onInputPlusStepClick","onStepperInputChange","newValue","maxValue","minValue","class_1","prototype","minValueDropdownWatcher","setDropdownOptions","maxValueDropdownWatcher","errorWatcher","_error","JSON","parse","e","invalid","length","options","i","push","text","undefined","concat","_dropdownOptions","stringify","input","decimals","Math","max","floor","log10","factor","pow","rounded","round","toFixed","componentWillLoad","amountId","stepperInputId","error","renderDropdown","classes","_a","popoverPlacement","h","class","items","label","required","disabled","description","descriptionLong","a11yDescribedby","name","size","showMarker","onStzhChange","renderInputStepper","onClick","variant","icon","iconOnly","a11yControls","type","min","id","clearable","StzhInputDescription","classPrefix","render","Host"],"sources":["src/components/stzh-amount/stzh-amount.scss?tag=stzh-amount","src/components/stzh-amount/stzh-amount.tsx"],"sourcesContent":[".stzh-amount {\n  @include input-description;\n\n  &__stepper-wrapper {\n    display: flex;\n    gap: space('xxsmall');\n  }\n\n  stzh-input#{&}__stepper-input {\n    --text-align: center;\n    width: 100%;\n  }\n}\n","import {\n  Component,\n  Host,\n  Prop,\n  h,\n  Watch,\n} from \"@stencil/core\";\n\nimport {\n  StzhDropdownChangeEvent,\n  StzhDropdownCustomEvent,\n  StzhInputChangeEvent,\n  StzhInputCustomEvent\n} from \"../../index\";\nimport { StzhInputDescription } from '../stzh-input/stzh-input-description';\n\nconst DROPDOWN_ITEM_PLUS_OPTION_VALUE = \"stzh-amount__dropdown-plus-option\"\n\nlet amountCounter = 0;\n\n@Component({\n  tag: \"stzh-amount\",\n  styleUrl: \"stzh-amount.scss\"\n})\nexport class StzhAmount {\n  /** The lowest allowed amount (can be negative). */\n  @Prop({ reflect: true }) minValue: number = -9007199254740991;\n\n  /** The highest allowed amount. */\n  @Prop({ reflect: true }) maxValue: number = 9007199254740991;\n\n  /** The lowest amount as option in the dropdown. Needs to be set to initially display a dropdown. */\n  @Prop({ reflect: true }) minValueDropdown: number | null = null;\n\n  /** The highest amount as option in the dropdown. Needs to be set to initially display a dropdown. */\n  @Prop({ reflect: true }) maxValueDropdown: number | null = null;\n  private _showDropdown: boolean = !Number.isNaN(this.minValueDropdown) && !Number.isNaN(this.maxValueDropdown)\n    && this.minValueDropdown < this.maxValueDropdown;\n\n  private _dropdownOptions: string;\n\n  /** The initial value of the amount element */\n  @Prop({ reflect: true }) value: string = \"\";\n\n  /** The step the amount can be increased or decreased */\n  @Prop({ reflect: true }) step: number = 1;\n\n  /** Name of the element (hidden select element in case of dropdown) */\n  @Prop({ reflect: true }) name: string = \"\";\n\n  /** Size variant */\n  @Prop({ reflect: true }) size: \"default\" | \"small\" = \"default\";\n\n  /** Whether the amount component is disabled */\n  @Prop({ reflect: true }) disabled: boolean = false;\n\n  /** Popover placement for the dropdown (if applicable) */\n  @Prop({ reflect: true }) popoverPlacement: \"bottom\" | \"top\" = \"bottom\";\n\n  /** Label */\n  @Prop() label: 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  /** Whether clearable button is showing for the input field (does not apply to dropdown) */\n  @Prop({ reflect: true }) clearable: boolean = false;\n\n  /** Show text in label depending on whether field is optional/required */\n  @Prop({ reflect: true }) showMarker: boolean = false;\n\n  /** Description placed below the amount */\n  @Prop() description: string;\n\n  /** Long description message appearing in a popover */\n  @Prop() descriptionLong: string;\n\n  /** One or multiple error message(s) */\n  @Prop() error: string | string[];\n  private _error: string[];\n\n  /** Id of the element which describes the input (this will be overwritten if description prop is used) */\n  @Prop({ attribute: \"a11y-describedby\" }) a11yDescribedby: string = '';\n\n  @Watch(\"minValueDropdown\")\n  minValueDropdownWatcher() {\n    this.setDropdownOptions();\n  }\n\n  @Watch(\"maxValueDropdown\")\n  maxValueDropdownWatcher() {\n    this.setDropdownOptions();\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  private amountId: string;\n  private stepperInputId: string;\n\n  /** Fill the dropdown with options according to maxValueDropdown & minValueDropdown. */\n  private setDropdownOptions(): void {\n    if (this._showDropdown) {\n      const options = [];\n\n      for (let i = this.minValueDropdown; i <= this.maxValueDropdown; i++) {\n        options.push({text: i.toString(), value: i.toString()});\n      }\n      if (this.maxValue != undefined && this.maxValue > this.maxValueDropdown) {\n        options.push({text: `${this.maxValueDropdown.toString()}+`, value: DROPDOWN_ITEM_PLUS_OPTION_VALUE})\n      }\n      this._dropdownOptions = JSON.stringify(options);\n    }\n  }\n\n  /** Handling dropdown changes (switch to input stepper if the plus option is selected in the dropdown). */\n  private onDropdownChange = (event: StzhDropdownCustomEvent<StzhDropdownChangeEvent>) => {\n    if (event.detail.value === DROPDOWN_ITEM_PLUS_OPTION_VALUE) {\n      this._showDropdown = false;\n      this.value = (this.maxValueDropdown + this.step).toString();\n    } else {\n      this.value = (+event.detail.value).toString();\n    }\n  }\n\n  /** Handling the minus button. */\n  private onInputMinusStepClick = () => {\n    this.value = (+this.value - this.step).toString();\n    this.value = this.roundToStep(+this.value).toString();\n  }\n\n  /** Handling the plus button. */\n  private onInputPlusStepClick = () => {\n    this.value = (+this.value + this.step).toString();\n    this.value = this.roundToStep(+this.value).toString();\n  }\n\n  /** Handling manual value change of the stepper input. */\n  private onStepperInputChange = (event: StzhInputCustomEvent<StzhInputChangeEvent>) => {\n    let newValue = event.detail.value;\n    newValue = this.roundToStep(+newValue).toString();\n\n    if (+newValue > this.maxValue) {\n      newValue = this.maxValue.toString();\n    } else if (+newValue < this.minValue) {\n      newValue = this.minValue.toString();\n    }\n\n    this.value = newValue;\n  }\n\n  /** Making sure, that the value is rounded correctly according to the step  */\n  private roundToStep(input: number): number {\n    const decimals = Math.max(0, -Math.floor(Math.log10(this.step)));\n    const factor = Math.pow(10, decimals);\n    const rounded = Math.round(input / this.step) * this.step;\n    return Number((rounded * factor / factor).toFixed(decimals));\n  }\n\n  async componentWillLoad() {\n    this.amountId = `stzh-amount-${amountCounter++}`;\n    this.stepperInputId = `${this.amountId}-stepper-input`\n    this.setDropdownOptions();\n    this.errorWatcher(this.error);\n  }\n\n  private renderDropdown(): HTMLDivElement {\n    const classes = {\n      \"stzh-amount__dropdown\": true,\n      [`stzh-amount--popover-placement-${this.popoverPlacement}`]: !!this.popoverPlacement,\n    };\n    return (\n      <div class={classes}>\n        <stzh-dropdown\n          options={this._dropdownOptions}\n          items={[this.value]}\n          label={this.label}\n          required={this.required}\n          disabled={this.disabled}\n          description={this.description}\n          descriptionLong={this.descriptionLong}\n          error={this.error}\n          popoverPlacement={this.popoverPlacement}\n          a11yDescribedby={this.a11yDescribedby}\n          name={this.name}\n          size={this.size}\n          invalid={this.invalid}\n          showMarker={this.showMarker}\n          onStzhChange={this.onDropdownChange}\n        ></stzh-dropdown>\n      </div>\n    );\n  }\n\n  private renderInputStepper(): HTMLDivElement {\n    return (\n      <div class=\"stzh-amount__stepper\">\n        <div class=\"stzh-amount__stepper-wrapper\">\n          <stzh-button\n            class=\"stzh-amount__stepper-minus\"\n            onClick={this.onInputMinusStepClick}\n            variant=\"secondary\"\n            icon=\"minus\"\n            iconOnly={true}\n            a11yControls={this.stepperInputId}\n            a11yDescribedby={this.a11yDescribedby}\n            size={this.size}\n            disabled={+this.value <= +this.minValue || this.disabled}\n          ></stzh-button>\n          <stzh-input\n            class=\"stzh-amount__stepper-input\"\n            value={this.value}\n            type=\"number\"\n            label={this.label}\n            min={this.minValue}\n            max={this.maxValue}\n            invalid={this.invalid}\n            name={this.name}\n            id={this.stepperInputId}\n            size={this.size}\n            step={this.step}\n            showMarker={this.showMarker}\n            descriptionLong={this.descriptionLong}\n            clearable={this.clearable}\n            disabled={this.disabled}\n            a11yDescribedby={this.a11yDescribedby}\n            onStzhChange={this.onStepperInputChange}\n          ></stzh-input>\n          <stzh-button\n            class=\"stzh-amount__stepper-plus\"\n            onClick={this.onInputPlusStepClick}\n            variant=\"secondary\"\n            icon=\"plus\"\n            iconOnly={true}\n            a11yControls={this.stepperInputId}\n            a11yDescribedby={this.a11yDescribedby}\n            size={this.size}\n            disabled={+this.value >= +this.maxValue || this.disabled}\n          ></stzh-button>\n        </div>\n        <StzhInputDescription\n          classPrefix=\"stzh-amount\"\n          id={`${this.amountId}-description`}\n          error={this._error}\n          description={this.description}\n          descriptionLong={this.descriptionLong}\n        />\n      </div>\n    );\n  }\n\n  render() {\n    const classes = {\n      \"stzh-amount\": true,\n      \"stzh-amount--has-description\": !!this.description,\n      \"stzh-amount--has-description-long\": !!this.descriptionLong,\n      \"stzh-amount--has-error\": !!this.error,\n    };\n\n    return (\n      <Host>\n        <div\n          class={classes}\n          id={this.amountId}\n        >\n          {\n            this._showDropdown ?\n            this.renderDropdown()\n            :\n            this.renderInputStepper()\n          }\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}
+{"version":3,"names":["stzhAmountCss","DROPDOWN_ITEM_PLUS_OPTION_VALUE","amountCounter","StzhAmount","this","_showDropdown","Number","isNaN","minValueDropdown","maxValueDropdown","onDropdownChange","event","detail","value","_this","step","toString","stzhChange","emit","component","onInputMinusStepClick","roundToStep","onInputPlusStepClick","onStepperInputChange","class_1","prototype","minValueDropdownWatcher","setDropdownOptions","maxValueDropdownWatcher","errorWatcher","newValue","_error","JSON","parse","e","invalid","length","valueWatcher","handleOutOfRangeValue","options","i","push","text","maxValue","undefined","concat","_dropdownOptions","stringify","localization","currentErrors","error","__spreadArray","maxValueError","_a","amountTooGreatError","replace","minValueError","_b","amountTooSmallError","minValue","includes","filter","input","decimals","Math","max","floor","log10","factor","pow","rounded","round","toFixed","componentWillLoad","_c","fetchTranslations","element","_d","sent","amountId","stepperInputId","renderDropdown","classes","popoverPlacement","h","class","items","label","required","disabled","description","descriptionLong","a11yDescribedby","name","size","showMarker","onStzhChange","renderInputStepper","onClick","variant","icon","iconOnly","a11yControls","a11yLabel","stepperMinusLabel","selectedAmountMessage","tabindex","type","min","id","clearable","stepperPlusLabel","render","Host"],"sources":["src/components/stzh-amount/stzh-amount.scss?tag=stzh-amount","src/components/stzh-amount/stzh-amount.tsx"],"sourcesContent":[".stzh-amount {\n  @include input-description;\n\n  &__stepper-wrapper {\n    display: flex;\n    align-items: flex-start;\n    gap: space('xxsmall');\n  }\n\n  stzh-input#{&}__stepper-input {\n    --text-align: center;\n    width: 100%;\n  }\n}\n","import {\n  Component,\n  Host,\n  Prop,\n  h,\n  Watch,\n  Element,\n  Event,\n  EventEmitter\n} from \"@stencil/core\";\n\nimport {\n  StzhAmountChangeEvent,\n  StzhDropdownChangeEvent,\n  StzhDropdownCustomEvent,\n  StzhInputChangeEvent,\n  StzhInputCustomEvent,\n} from \"../../index\";\nimport { StzhAmountLocalizedText } from './stzh-amount.localization';\nimport {fetchTranslations} from '../../utils/translation-utils';\n\nconst DROPDOWN_ITEM_PLUS_OPTION_VALUE = \"stzh-amount__dropdown-plus-option\"\n\nlet amountCounter = 0;\n\n@Component({\n  tag: \"stzh-amount\",\n  styleUrl: \"stzh-amount.scss\"\n})\nexport class StzhAmount {\n  /** The lowest allowed amount (can be negative). */\n  @Prop() minValue: number = -9007199254740991;\n\n  /** The highest allowed amount. */\n  @Prop() maxValue: number = 9007199254740991;\n\n  /** The lowest amount as option in the dropdown. Needs to be set to initially display a dropdown. */\n  @Prop() minValueDropdown: number | null = null;\n\n  /** The highest amount as option in the dropdown. Needs to be set to initially display a dropdown. */\n  @Prop() maxValueDropdown: number | null = null;\n  private _showDropdown: boolean = !Number.isNaN(this.minValueDropdown) && !Number.isNaN(this.maxValueDropdown)\n    && this.minValueDropdown < this.maxValueDropdown;\n\n  private _dropdownOptions: string;\n\n  /** The initial value of the amount element */\n  @Prop({ mutable: true }) value: string = \"\";\n\n  /** The step the amount can be increased or decreased */\n  @Prop() step: number = 1;\n\n  /** Name of the element (hidden select element in case of dropdown) */\n  @Prop({ reflect: true }) name: string = \"\";\n\n  /** Size variant */\n  @Prop({ reflect: true }) size: \"default\" | \"small\" = \"default\";\n\n  /** Whether the amount component is disabled */\n  @Prop({ reflect: true }) disabled: boolean = false;\n\n  /** Popover placement for the dropdown (if applicable) */\n  @Prop({ reflect: true }) popoverPlacement:  \"bottom\" | \"bottom-end\" | \"bottom-center\" | \"top\" | \"top-end\" | \"top-center\" = \"bottom\";\n\n  /** Label */\n  @Prop() label: 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  /** Whether clearable button is showing for the input field (does not apply to dropdown) */\n  @Prop({ reflect: true }) clearable: boolean = false;\n\n  /** Show text in label depending on whether field is optional/required */\n  @Prop({ reflect: true }) showMarker: boolean = false;\n\n  /** Description placed below the amount */\n  @Prop() description: string;\n\n  /** Long description message appearing in a popover */\n  @Prop() descriptionLong: string;\n\n  /** One or multiple error message(s) */\n  @Prop({ mutable: true }) error: string | string[];\n  private _error: string[];\n\n  /** Id of the element which describes the input (this will be overwritten if description prop is used) */\n  @Prop({ attribute: \"a11y-describedby\" }) a11yDescribedby: string = '';\n\n  /**  Translation strings. */\n  @Prop() localization: StzhAmountLocalizedText;\n\n  @Watch(\"minValueDropdown\")\n  minValueDropdownWatcher() {\n    this.setDropdownOptions();\n  }\n\n  @Watch(\"maxValueDropdown\")\n  maxValueDropdownWatcher() {\n    this.setDropdownOptions();\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 {\n      this._error = newValue || [];\n    }\n\n    this.invalid = this._error.length > 0;\n  }\n\n  /** Update stepper button a11y-labels when value has changed */\n  @Watch(\"value\")\n  valueWatcher(newValue: string) {\n    if (!this._showDropdown) {\n      this.handleOutOfRangeValue(newValue);\n    }\n  }\n\n  /** Amount change event */\n  @Event() stzhChange: EventEmitter<StzhAmountChangeEvent>;\n\n  @Element() element: HTMLStzhAmountElement;\n\n  private amountId: string;\n  private stepperInputId: string;\n\n  /** Fill the dropdown with options according to maxValueDropdown & minValueDropdown. */\n  private setDropdownOptions(): void {\n    if (this._showDropdown) {\n      const options = [];\n\n      for (let i = this.minValueDropdown; i <= this.maxValueDropdown; i++) {\n        options.push({text: i.toString(), value: i.toString()});\n      }\n      if (this.maxValue != undefined && this.maxValue > this.maxValueDropdown) {\n        options.push({text: `${this.maxValueDropdown.toString()}+`, value: DROPDOWN_ITEM_PLUS_OPTION_VALUE})\n      }\n\n      this._dropdownOptions = JSON.stringify(options);\n    }\n  }\n\n  /** Handling dropdown changes (switch to input stepper if the plus option is selected in the dropdown). */\n  private onDropdownChange = (event: StzhDropdownCustomEvent<StzhDropdownChangeEvent>) => {\n    if (event.detail.value === DROPDOWN_ITEM_PLUS_OPTION_VALUE) {\n      this._showDropdown = false;\n      this.value = (this.maxValueDropdown + this.step).toString();\n    } else {\n      this.value = (+event.detail.value).toString();\n    }\n\n    this.stzhChange.emit({\n      component: \"stzh-amount\",\n      value: this.value\n    });\n  }\n\n  /** Handling the minus button. */\n  private onInputMinusStepClick = () => {\n    this.value = (+this.value - this.step).toString();\n    this.value = this.roundToStep(+this.value).toString();\n\n    this.stzhChange.emit({\n      component: \"stzh-amount\",\n      value: this.value\n    });\n  }\n\n  /** Handling the plus button. */\n  private onInputPlusStepClick = () => {\n    this.value = (+this.value + this.step).toString();\n    this.value = this.roundToStep(+this.value).toString();\n\n    this.stzhChange.emit({\n      component: \"stzh-amount\",\n      value: this.value\n    })\n  }\n\n  /** Handling manual value change of the stepper input. */\n  private handleOutOfRangeValue(newValue: string): void {\n    if (!this.localization) {\n      return;\n    }\n\n    let currentErrors: string[] = [];\n\n    if (typeof this.error === \"string\") {\n      currentErrors.push(this.error);\n    } else if (this.error) {\n      currentErrors = [...this.error];\n    }\n\n    const maxValueError = this.localization.amountTooGreatError?.replace(/{maxValue}/gi, this.maxValue.toString());\n    const minValueError = this.localization.amountTooSmallError?.replace(/{minValue}/gi, this.minValue.toString());\n\n    if (+newValue > this.maxValue) {\n      if (!currentErrors.includes(maxValueError)) {\n        currentErrors.push(maxValueError);\n      }\n    } else if (+newValue < this.minValue) {\n      if (!currentErrors.includes(minValueError)) {\n        currentErrors.push(minValueError);\n      }\n    } else {\n      currentErrors = currentErrors.filter(e => e !== maxValueError && e !== minValueError);\n    }\n\n    this.error = currentErrors.length > 0 ? currentErrors : [];\n  }\n\n  /** Handling manual value change of the stepper input. */\n  private onStepperInputChange = (event: StzhInputCustomEvent<StzhInputChangeEvent>) => {\n    this.value = event.detail.value;\n\n    this.stzhChange.emit({\n      component: \"stzh-amount\",\n      value: this.value\n    });\n  }\n\n  /** Making sure, that the value is rounded correctly according to the step  */\n  private roundToStep(input: number): number {\n    const decimals = Math.max(0, -Math.floor(Math.log10(this.step)));\n    const factor = Math.pow(10, decimals);\n    const rounded = Math.round(input / this.step) * this.step;\n    return Number((rounded * factor / factor).toFixed(decimals));\n  }\n\n  async componentWillLoad() {\n    this.errorWatcher(this.error);\n    this.valueWatcher(this.value);\n\n    if (!this.localization) {\n      this.localization = await fetchTranslations(this.element, \"amount\");\n    }\n\n    this.amountId = `stzh-amount-${amountCounter++}`;\n\n    if (this._showDropdown) {\n      this.setDropdownOptions()\n    } else {\n      this.stepperInputId = `${this.amountId}-stepper-input`\n    }\n  }\n\n  private renderDropdown(): HTMLDivElement {\n    const classes = {\n      \"stzh-amount__dropdown\": true,\n      [`stzh-amount--popover-placement-${this.popoverPlacement}`]: !!this.popoverPlacement,\n    };\n    return (\n      <div class={classes}>\n        <stzh-dropdown\n          options={this._dropdownOptions}\n          items={[this.value]}\n          label={this.label}\n          required={this.required}\n          disabled={this.disabled}\n          description={this.description}\n          descriptionLong={this.descriptionLong}\n          error={this.error}\n          popoverPlacement={this.popoverPlacement}\n          a11yDescribedby={this.a11yDescribedby}\n          name={this.name}\n          size={this.size}\n          invalid={this.invalid}\n          showMarker={this.showMarker}\n          onStzhChange={this.onDropdownChange}\n        ></stzh-dropdown>\n      </div>\n    );\n  }\n\n  private renderInputStepper(): HTMLDivElement {\n    return (\n      <div class=\"stzh-amount__stepper\">\n        <div class=\"stzh-amount__stepper-wrapper\">\n          <stzh-button\n            class=\"stzh-amount__stepper-minus\"\n            onClick={this.onInputMinusStepClick}\n            variant=\"secondary\"\n            icon=\"minus\"\n            iconOnly={true}\n            a11yControls={this.stepperInputId}\n            a11yDescribedby={this.a11yDescribedby}\n            a11yLabel={`${this.label} ${this.localization.stepperMinusLabel}, ${this.localization.selectedAmountMessage} ${this.value}`}\n            size={this.size}\n            disabled={+this.value <= +this.minValue || this.disabled}\n            tabindex={this.disabled ? null : \"-1\"}\n          ></stzh-button>\n          <stzh-input\n            class=\"stzh-amount__stepper-input\"\n            value={this.value}\n            type=\"number\"\n            label={this.label}\n            min={this.minValue}\n            max={this.maxValue}\n            invalid={this.invalid}\n            error={this._error}\n            required={this.required}\n            name={this.name}\n            id={this.stepperInputId}\n            size={this.size}\n            step={this.step}\n            showMarker={this.showMarker}\n            description={this.description}\n            descriptionLong={this.descriptionLong}\n            clearable={this.clearable}\n            disabled={this.disabled}\n            a11yDescribedby={this.a11yDescribedby}\n            onStzhChange={this.onStepperInputChange}\n          ></stzh-input>\n          <stzh-button\n            class=\"stzh-amount__stepper-plus\"\n            onClick={this.onInputPlusStepClick}\n            variant=\"secondary\"\n            icon=\"plus\"\n            iconOnly={true}\n            a11yControls={this.stepperInputId}\n            a11yDescribedby={this.a11yDescribedby}\n            a11yLabel={`${this.label} ${this.localization.stepperPlusLabel}, ${this.localization.selectedAmountMessage} ${this.value}`}\n            size={this.size}\n            disabled={+this.value >= +this.maxValue || this.disabled}\n            tabindex={this.disabled ? null : \"-1\"}\n          ></stzh-button>\n        </div>\n      </div>\n    );\n  }\n\n  render() {\n    const classes = {\n      \"stzh-amount\": true,\n      \"stzh-amount--has-description\": !!this.description,\n      \"stzh-amount--has-description-long\": !!this.descriptionLong,\n      \"stzh-amount--has-error\": !!this.error,\n      \"stzh-amount--is-required\": !!this.required,\n    };\n\n    return (\n      <Host>\n        <div\n          class={classes}\n          id={this.amountId}\n        >\n          {\n            this._showDropdown ?\n            this.renderDropdown()\n            :\n            this.renderInputStepper()\n          }\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/esm-es5/stzh-badge_3.entry.js

@@ -1,2 +1,2 @@
-var __awaiter=this&&this.__awaiter||function(t,o,e,s){function n(t){return t instanceof e?t:new e((function(o){o(t)}))}return new(e||(e=Promise))((function(e,r){function i(t){try{h(s.next(t))}catch(t){r(t)}}function a(t){try{h(s["throw"](t))}catch(t){r(t)}}function h(t){t.done?e(t.value):n(t.value).then(i,a)}h((s=s.apply(t,o||[])).next())}))};var __generator=this&&this.__generator||function(t,o){var e={label:0,sent:function(){if(r[0]&1)throw r[1];return r[1]},trys:[],ops:[]},s,n,r,i;return i={next:a(0),throw:a(1),return:a(2)},typeof Symbol==="function"&&(i[Symbol.iterator]=function(){return this}),i;function a(t){return function(o){return h([t,o])}}function h(a){if(s)throw new TypeError("Generator is already executing.");while(i&&(i=0,a[0]&&(e=0)),e)try{if(s=1,n&&(r=a[0]&2?n["return"]:a[0]?n["throw"]||((r=n["return"])&&r.call(n),0):n.next)&&!(r=r.call(n,a[1])).done)return r;if(n=0,r)a=[a[0]&2,r.value];switch(a[0]){case 0:case 1:r=a;break;case 4:e.label++;return{value:a[1],done:false};case 5:e.label++;n=a[1];a=[0];continue;case 7:a=e.ops.pop();e.trys.pop();continue;default:if(!(r=e.trys,r=r.length>0&&r[r.length-1])&&(a[0]===6||a[0]===2)){e=0;continue}if(a[0]===3&&(!r||a[1]>r[0]&&a[1]<r[3])){e.label=a[1];break}if(a[0]===6&&e.label<r[1]){e.label=r[1];r=a;break}if(r&&e.label<r[2]){e.label=r[2];e.ops.push(a);break}if(r[2])e.ops.pop();e.trys.pop();continue}a=o.call(t,e)}catch(t){a=[6,t];n=0}finally{s=r=0}if(a[0]&5)throw a[1];return{value:a[0]?a[1]:void 0,done:true}}};import{r as registerInstance,h,a as Host,c as createEvent,F as Fragment,g as getElement}from"./index-67fd55c9.js";import{h as hasSlot}from"./utils-51148d9a.js";import{f as fetchTranslations}from"./translation-utils-2623783f.js";var stzhBadgeCss=".sc-stzh-badge-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-badge-h{display:none}.sc-stzh-badge-h *.sc-stzh-badge,.sc-stzh-badge-h *.sc-stzh-badge::before,.sc-stzh-badge-h *.sc-stzh-badge::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-badge-h{--color:var(--stzh-color-white);--background-color:var(--stzh-base-color);display:-ms-inline-flexbox;display:inline-flex}[type=success].sc-stzh-badge-h{--background-color:var(--stzh-color-truegreen)}[type=warning].sc-stzh-badge-h{--color:var(--stzh-color-grey87);--background-color:var(--stzh-color-warning)}[type=error].sc-stzh-badge-h{--background-color:var(--stzh-color-error)}[type=info].sc-stzh-badge-h{--background-color:var(--stzh-color-zueriblue)}.stzh-badge.sc-stzh-badge{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:normal;-webkit-box-sizing:content-box;box-sizing:content-box;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;min-width:0.625rem;font-size:0.625rem;line-height:1.4;-webkit-box-shadow:0 0 0 0.0625rem #fff;box-shadow:0 0 0 0.0625rem #fff;border-radius:0.875rem;padding:0.0625rem 0.375rem;background-color:var(--background-color);color:var(--color);text-transform:uppercase}.stzh-badge.sc-stzh-badge:empty{width:0.875rem;height:0.875rem;padding:0}";var StzhBadge=function(){function t(t){registerInstance(this,t);this.label="";this.type="default"}t.prototype.render=function(){var t;var o=(t={"stzh-badge":true},t["stzh-badge--type-".concat(this.type)]=!!this.type,t);return h(Host,null,h("div",{class:o},this.label))};return t}();StzhBadge.style=stzhBadgeCss;var stzhButtonCss='@charset "UTF-8";.sc-stzh-button-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-button-h{display:none}.sc-stzh-button-h *.sc-stzh-button,.sc-stzh-button-h *.sc-stzh-button::before,.sc-stzh-button-h *.sc-stzh-button::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-button-h{--color:var(--stzh-color-white);--background-color:var(--stzh-color-primary, var(--stzh-color-zueriblue));--border-width:0.0625rem;--border-color:var(--stzh-color-primary, var(--stzh-color-zueriblue));--border-radius:var(--stzh-button-border-radius);--height:var(--stzh-form-input-height);--icon-size:var(--stzh-icon-size-small);--icon-text-margin:var(--stzh-space-small);--badge-icon-text-margin:calc(var(--icon-text-margin) + var(--stzh-space-xxsmall));--padding:calc(var(--stzh-space-xsmall) - 0.0625rem) var(--stzh-space-xlarge);--white-space:normal;--border-radius:var(--stzh-button-border-radius);--hover-color:var(--stzh-color-white);--hover-background-color:var(--stzh-color-primary-hover, var(--stzh-color-zueribluedark));--hover-border-color:var(--stzh-color-primary-hover, var(--stzh-color-zueribluedark));--floating-position:sticky;--floating-float:right;--floating-bottom:var(--stzh-space-medium);--floating-right:var(--stzh-space-medium);display:inline-block}@media screen and (min-width: 600px){.sc-stzh-button-h{--floating-bottom:var(--stzh-space-xlarge);--floating-right:var(--stzh-space-xlarge)}}[fullwidth].sc-stzh-button-h:not([fullwidth=false]){width:100%;display:block}[rounded].sc-stzh-button-h:not([rounded=false]){--border-radius:var(--height)}[floating].sc-stzh-button-h:not([floating=false]){position:var(--floating-position);bottom:var(--floating-bottom);right:var(--floating-right);float:var(--floating-float)}[size=small].sc-stzh-button-h{--height:var(--stzh-form-input-small-height)}[size=tiny].sc-stzh-button-h{--height:var(--stzh-form-input-tiny-height);--icon-text-margin:var(--stzh-space-xsmall);--padding:calc(var(--stzh-space-xxsmall) - 0.0625rem) var(--stzh-space-medium)}[variant=secondary].sc-stzh-button-h{--color:var(--stzh-color-primary, var(--stzh-color-zueriblue));--background-color:var(--stzh-color-white);--border-color:var(--stzh-color-primary60op)}[variant=input].sc-stzh-button-h{--color:var(--stzh-color-grey61);--background-color:transparent;--border-color:var(--stzh-color-grey61);--hover-color:var(--stzh-color-primary-hover, var(--stzh-color-zueribluedark));--hover-background-color:transparent;--hover-border-color:var(--stzh-color-primary-hover, var(--stzh-color-zueribluedark))}[variant=tertiary].sc-stzh-button-h{--color:var(--stzh-color-primary, var(--stzh-color-zueriblue));--background-color:transparent;--border-color:transparent;--hover-color:var(--stzh-color-primary-hover, var(--stzh-color-zueribluedark));--hover-background-color:var(--stzh-button-text-hover-background);--hover-border-color:transparent}[active].sc-stzh-button-h:not([active=false]){--color:var(--stzh-color-white);--background-color:var(--stzh-color-primary-hover, var(--stzh-color-zueribluedark));--border-color:var(--stzh-color-primary-hover, var(--stzh-color-zueribluedark));--hover-color:var(--stzh-color-white);--hover-background-color:var(--stzh-color-primary-hover, var(--stzh-color-zueribluedark));--hover-border-color:var(--stzh-color-primary-hover, var(--stzh-color-zueribluedark))}[disabled].sc-stzh-button-h:not([disabled=false]){--border-color:var(--stzh-color-grey13);--background-color:var(--stzh-color-grey13);--hover-border-color:var(--stzh-color-grey13);--hover-background-color:var(--stzh-color-grey13)}[disabled].sc-stzh-button-h:not([disabled=false])[variant=secondary],[disabled].sc-stzh-button-h:not([disabled=false])[variant=input],[disabled].sc-stzh-button-h:not([disabled=false])[variant=tertiary]{--color:var(--stzh-color-grey25);--border-color:var(--stzh-color-grey13);--background-color:transparent;--hover-color:var(--stzh-color-grey25);--hover-border-color:var(--stzh-color-grey13);--hover-background-color:transparent}@-webkit-keyframes stzh-button-effect-cta{0%,20%,50%,80%,100%{-webkit-transform:translateX(0);transform:translateX(0)}40%{-webkit-transform:translateX(-0.5rem);transform:translateX(-0.5rem)}60%{-webkit-transform:translateX(-0.25rem);transform:translateX(-0.25rem)}}@keyframes stzh-button-effect-cta{0%,20%,50%,80%,100%{-webkit-transform:translateX(0);transform:translateX(0)}40%{-webkit-transform:translateX(-0.5rem);transform:translateX(-0.5rem)}60%{-webkit-transform:translateX(-0.25rem);transform:translateX(-0.25rem)}}.sc-stzh-button-h .sc-stzh-button-s>stzh-icon,.stzh-button__icon.sc-stzh-button{--size:var(--icon-size)}.stzh-button.sc-stzh-button{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);line-height:1.25;font-family:inherit;position:relative;z-index:0;overflow:visible;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:stretch;justify-content:stretch;-webkit-appearance:none;-moz-appearance:none;appearance:none;color:var(--color);padding:var(--padding);background-color:var(--background-color);-webkit-transition-duration:var(--stzh-base-transition-animation-speed);transition-duration:var(--stzh-base-transition-animation-speed);-webkit-transition-property:color, background-color, border-color;transition-property:color, background-color, border-color;border-style:solid;border-width:var(--border-width);border-color:var(--border-color);cursor:pointer;-webkit-text-decoration-line:none;text-decoration-line:none;width:100%;min-width:var(--height);min-height:var(--height);border-radius:var(--border-radius);text-align:left}.stzh-button.sc-stzh-button:hover{border-color:var(--hover-border-color);background-color:var(--hover-background-color);color:var(--hover-color)}.stzh-button__vhidden.sc-stzh-button{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-button__inner.sc-stzh-button{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;-ms-flex-positive:1;flex-grow:1}.stzh-button__icon-wrapper.sc-stzh-button{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;-ms-flex-negative:0;flex-shrink:0;width:auto;height:1em}.stzh-button__text.sc-stzh-button{overflow-wrap:break-word;word-wrap:break-word;word-break:break-word;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto;white-space:var(--white-space);text-align:center}.stzh-button__icon-wrapper.sc-stzh-button:not(:empty)+.stzh-button__text.sc-stzh-button:not(:empty),.stzh-button__text.sc-stzh-button:not(:empty)+.stzh-button__icon-wrapper.sc-stzh-button:not(:empty){margin-left:var(--icon-text-margin)}.stzh-button__badge.sc-stzh-button{position:absolute;z-index:1;top:0;right:0}.stzh-button__input.sc-stzh-button{position:absolute;top:0;left:0;width:100%;height:100%;margin:0;z-index:-1;opacity:0;pointer-events:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.stzh-button__mark.sc-stzh-button{border:0.0625rem solid var(--stzh-color-grey61);background-color:var(--stzh-color-white);width:1.5rem;height:1.5rem;-ms-flex-negative:0;flex-shrink:0;border-radius:50%;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;-webkit-transition:border-color var(--stzh-base-transition-animation-speed);transition:border-color var(--stzh-base-transition-animation-speed);width:1.25rem;height:1.25rem;margin-right:var(--stzh-space-xsmall);border-color:currentColor}.stzh-button__mark.sc-stzh-button::before{content:""}.stzh-button__check.sc-stzh-button{background-color:currentColor;color:var(--stzh-color-primary, var(--stzh-color-zueriblue));width:0.5rem;height:0.5rem;border-radius:50%;opacity:0}@media (forced-colors: active), (-ms-high-contrast: active){.stzh-button__check.sc-stzh-button{background-color:ButtonText}}.stzh-button__input.sc-stzh-button:checked:hover~.stzh-button__inner.sc-stzh-button .stzh-button__mark.sc-stzh-button .stzh-button__check.sc-stzh-button,.stzh-button__input.sc-stzh-button:checked:focus~.stzh-button__inner.sc-stzh-button .stzh-button__mark.sc-stzh-button .stzh-button__check.sc-stzh-button{color:var(--stzh-color-primary-hover, var(--stzh-color-zueribluedark))}.stzh-button.sc-stzh-button:hover .stzh-button__mark.sc-stzh-button,.stzh-button__input.sc-stzh-button:focus:hover~.stzh-button__inner.sc-stzh-button .stzh-button__mark.sc-stzh-button,.stzh-button__input.sc-stzh-button:checked:hover~.stzh-button__inner.sc-stzh-button .stzh-button__mark.sc-stzh-button,.stzh-button__input.sc-stzh-button:checked:focus~.stzh-button__inner.sc-stzh-button .stzh-button__mark.sc-stzh-button{border-color:var(--stzh-color-primary-hover, var(--stzh-color-zueribluedark))}.stzh-button__input.sc-stzh-button:focus~.stzh-button__inner.sc-stzh-button .stzh-button__mark.sc-stzh-button,.stzh-button__input.sc-stzh-button:checked~.stzh-button__inner.sc-stzh-button .stzh-button__mark.sc-stzh-button{border-color:var(--stzh-color-primary, var(--stzh-color-zueriblue))}.stzh-button__input.sc-stzh-button:checked~.stzh-button__inner.sc-stzh-button .stzh-button__mark.sc-stzh-button .stzh-button__check.sc-stzh-button{opacity:1}.stzh-button--is-disabled.sc-stzh-button .stzh-button__input.sc-stzh-button~.stzh-button__inner.sc-stzh-button .stzh-button__mark.sc-stzh-button .stzh-button__check.sc-stzh-button{color:var(--stzh-color-grey61)}.stzh-button--is-disabled.sc-stzh-button .stzh-button__input.sc-stzh-button~.stzh-button__inner.sc-stzh-button .stzh-button__mark.sc-stzh-button{border-color:transparent}.stzh-button--is-disabled.sc-stzh-button .stzh-button__mark.sc-stzh-button{background-color:var(--stzh-color-black8)}.stzh-button--size-small.sc-stzh-button,.stzh-button--size-tiny.sc-stzh-button{font-size:var(--stzh-font-micro-font-size);line-height:var(--stzh-font-micro-text-line-height)}.stzh-button--is-floating.sc-stzh-button{-webkit-box-shadow:var(--stzh-box-shadow-overlay);box-shadow:var(--stzh-box-shadow-overlay)}.stzh-button--badge-position-button.sc-stzh-button .stzh-button__icon-wrapper.sc-stzh-button{position:static}.stzh-button__badge.sc-stzh-button,.stzh-button--badge-position-button.sc-stzh-button .stzh-button__badge.sc-stzh-button{top:calc(var(--stzh-space-xsmall) * -1);right:calc(var(--stzh-space-xsmall) * -1)}.stzh-button--badge-position-icon.stzh-button--has-icon.sc-stzh-button .stzh-button__icon-wrapper.sc-stzh-button{position:relative}.stzh-button--badge-position-icon.stzh-button--has-icon.sc-stzh-button .stzh-button__badge.sc-stzh-button{top:calc(var(--stzh-space-xsmall) * -1);right:calc(var(--stzh-space-small) * -1)}.stzh-button--badge-position-icon.stzh-button--has-icon.stzh-button--has-badge.sc-stzh-button .stzh-button__icon-wrapper.sc-stzh-button:not(:empty)+.stzh-button__text.sc-stzh-button:not(:empty),.stzh-button--badge-position-icon.stzh-button--has-icon.stzh-button--has-badge.sc-stzh-button .stzh-button__text.sc-stzh-button:not(:empty)+.stzh-button__icon-wrapper.sc-stzh-button:not(:empty){margin-left:var(--badge-icon-text-margin)}.stzh-button--has-icon-only.sc-stzh-button{width:var(--height);height:var(--height);padding:0}.stzh-button--has-icon-only.sc-stzh-button .stzh-button__text.sc-stzh-button{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-button--effect-cta.sc-stzh-button:hover .stzh-button__icon-wrapper.sc-stzh-button{-webkit-animation:stzh-button-effect-cta 1s;animation:stzh-button-effect-cta 1s}.stzh-button--align-left.sc-stzh-button .stzh-button__inner.sc-stzh-button{-ms-flex-pack:start;justify-content:flex-start}.stzh-button--align-right.sc-stzh-button .stzh-button__inner.sc-stzh-button{-ms-flex-pack:end;justify-content:flex-end}.stzh-button--align-center.sc-stzh-button .stzh-button__inner.sc-stzh-button{-ms-flex-pack:center;justify-content:center}.stzh-button--align-space-between.sc-stzh-button .stzh-button__inner.sc-stzh-button{-ms-flex-pack:justify;justify-content:space-between}.stzh-button--is-disabled.sc-stzh-button{cursor:not-allowed}';var StzhButton=function(){function t(t){var o=this;registerInstance(this,t);this.stzhFocus=createEvent(this,"stzhFocus",7);this.stzhBlur=createEvent(this,"stzhBlur",7);this.stzhChange=createEvent(this,"stzhChange",7);this.focusedByInput=false;this.onInput=function(t){o.checked=o.input.checked;o.stzhChange.emit({component:"stzh-button",originalEvent:t,value:o.value,checked:o.checked})};this.onRootFocus=function(){if(!o.focusedByInput){o.setFocus()}o.focusedByInput=false};this.onFocus=function(t){o.focusedByInput=true;var e=new FocusEvent("focus",{view:window,bubbles:false,cancelable:false});o.element.dispatchEvent(e);o.stzhFocus.emit({component:"stzh-button",originalEvent:t})};this.onBlur=function(t){var e=new FocusEvent("blur",{view:window,bubbles:false,cancelable:false});o.element.dispatchEvent(e);o.stzhBlur.emit({component:"stzh-button",originalEvent:t})};this.onClick=function(t){if(o.disabled){t.stopPropagation();t.preventDefault()}};this.localization=undefined;this.badge="";this.badgeType="default";this.badgePosition="button";this.badgeEmpty=false;this.fullwidth=false;this.rounded=false;this.floating=false;this.size="default";this.textAlign="default";this.variant="default";this.icon="";this.iconPosition="left";this.checked=false;this.name="";this.value="";this.href="";this.rel=undefined;this.target="";this.download=undefined;this.type="button";this.disabled=false;this.active=false;this.label="";this.effect="default";this.iconOnly=false;this.linkAccesskey=undefined;this.a11yLabel=undefined;this.a11yDescribedby="";this.a11yExpanded=undefined;this.a11yDisabled=undefined;this.a11yControls=undefined;this.a11yTabindex=undefined;this.analyticsId=undefined}t.prototype.setFocus=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){this.button.focus();return[2]}))}))};t.prototype.renderIcon=function(t){return h("div",{class:"stzh-button__icon-wrapper"},this.icon?h("stzh-icon",{class:"stzh-button__icon",name:this.icon}):h("slot",{name:"icon"}),(this.badge||this.badgeEmpty)&&this.badgePosition==="icon"&&t&&h("stzh-badge",{class:"stzh-button__badge",label:this.badge,type:this.badgeType}))};t.prototype.renderContent=function(){var t=this;return h("div",{class:"stzh-button__text"},this.rel&&this.rel.includes("external")&&h("div",{class:"stzh-button__vhidden"},this.localization.$globals.externalLinkLabel),this.download&&h("div",{class:"stzh-button__vhidden"},this.localization.$globals.downloadLinkLabel),h("div",{ref:function(o){return t.text=o}},this.label?this.label:h("slot",null)))};t.prototype.renderInner=function(t){return h(Fragment,null,h("div",{class:"stzh-button__inner",onClick:this.onClick},this.type==="radio"&&h("div",{class:"stzh-button__mark"},h("div",{class:"stzh-button__check"})),this.iconPosition==="left"&&this.renderIcon(t),this.renderContent(),this.iconPosition==="right"&&this.renderIcon(t)),(this.badge||this.badgeEmpty)&&(this.badgePosition==="button"||!t)&&h("stzh-badge",{class:"stzh-button__badge",label:this.badge,type:this.badgeType,onClick:this.onClick}))};t.prototype.componentWillLoad=function(){return __awaiter(this,void 0,void 0,(function(){var t;return __generator(this,(function(o){switch(o.label){case 0:if(!!this.localization)return[3,2];t=this;return[4,fetchTranslations(this.element,"button")];case 1:t.localization=o.sent();o.label=2;case 2:return[2]}}))}))};t.prototype.componentDidRender=function(){var t=this;requestAnimationFrame((function(){t.button.setAttribute("s-object-id",t.analyticsId||t.text.innerText)}))};t.prototype.render=function(){var t;var o=this;var e=hasSlot(this.element,"icon")||!!this.icon;var s=(t={"stzh-button":true,"stzh-button--has-icon":e,"stzh-button--has-icon-only":this.iconOnly,"stzh-button--has-badge":!!this.badge,"stzh-button--is-floating":this.floating,"stzh-button--is-rounded":this.rounded,"stzh-button--is-fullwidth":this.fullwidth,"stzh-button--is-disabled":this.disabled,"stzh-button--is-active":this.active},t["stzh-button--effect-".concat(this.effect)]=!!this.effect,t["stzh-button--badge-position-".concat(this.badgePosition)]=!!this.badgePosition,t["stzh-button--align-".concat(this.textAlign)]=!!this.textAlign,t["stzh-button--size-".concat(this.size)]=!!this.size,t["stzh-button--type-".concat(this.type)]=!!this.type,t["stzh-button--".concat(this.variant)]=!!this.variant,t);return h(Host,{tabindex:this.disabled?null:"-1",onFocus:this.onRootFocus},this.href?h("a",{ref:function(t){return o.button=t},href:this.disabled?null:this.href,rel:this.rel,download:this.download,target:this.target,class:s,"aria-label":this.a11yLabel,"aria-describedby":this.a11yDescribedby,"aria-disabled":typeof this.a11yDisabled!=="undefined"?this.a11yDisabled?"true":"false":null,"aria-expanded":typeof this.a11yExpanded!=="undefined"?this.a11yExpanded?"true":"false":null,"aria-controls":this.a11yControls,accessKey:this.linkAccesskey,tabindex:this.a11yTabindex,onFocus:this.onFocus,onBlur:this.onBlur,onClick:this.onClick},this.renderInner(e)):this.type==="radio"?h("label",{ref:function(t){return o.button=t},class:s,onClick:this.onClick},h("input",{ref:function(t){return o.input=t},type:"radio",class:"stzh-button__input",name:this.name,value:this.value,checked:this.checked,disabled:this.disabled,"aria-label":this.a11yLabel,"aria-describedby":this.a11yDescribedby,"aria-disabled":typeof this.a11yDisabled!=="undefined"?this.a11yDisabled?"true":"false":null,"aria-expanded":typeof this.a11yExpanded!=="undefined"?this.a11yExpanded?"true":"false":null,"aria-controls":this.a11yControls,accessKey:this.linkAccesskey,tabindex:this.a11yTabindex,onFocus:this.onFocus,onBlur:this.onBlur,onClick:this.onClick,onInput:this.onInput}),this.renderInner(e)):h("button",{ref:function(t){return o.button=t},class:s,type:this.type,disabled:this.disabled,"aria-label":this.a11yLabel,"aria-describedby":this.a11yDescribedby,"aria-disabled":typeof this.a11yDisabled!=="undefined"?this.a11yDisabled?"true":"false":null,"aria-expanded":typeof this.a11yExpanded!=="undefined"?this.a11yExpanded?"true":"false":null,"aria-controls":this.a11yControls,accessKey:this.linkAccesskey,tabindex:this.a11yTabindex,onFocus:this.onFocus,onBlur:this.onBlur,onClick:this.onClick},this.renderInner(e)))};Object.defineProperty(t.prototype,"element",{get:function(){return getElement(this)},enumerable:false,configurable:true});return t}();StzhButton.style=stzhButtonCss;var stzhIconCss=".sc-stzh-icon-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-icon-h{display:none}.sc-stzh-icon-h *.sc-stzh-icon,.sc-stzh-icon-h *.sc-stzh-icon::before,.sc-stzh-icon-h *.sc-stzh-icon::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-icon-h{--size:var(--stzh-icon-size-default);display:-ms-inline-flexbox;display:inline-flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;color:currentColor;vertical-align:text-top}.stzh-icon.sc-stzh-icon{width:var(--size);height:var(--size)}";var iconCounter=0;var StzhIcon=function(){function t(t){registerInstance(this,t);this.name="";this.a11yTitle=""}t.prototype.componentWillLoad=function(){this.iconId="stzh-icon-".concat(iconCounter++)};t.prototype.render=function(){return h(Host,null,this.name&&h("svg",{class:"stzh-icon",role:this.a11yTitle?"img":"presentation","aria-hidden":this.a11yTitle?null:"true",focusable:this.a11yTitle?"true":"false","aria-labelledby":this.a11yTitle?"".concat(this.iconId,"-title"):null},this.a11yTitle&&h("title",{id:"".concat(this.iconId,"-title")},this.a11yTitle),h("use",{href:"#stzh-icon-".concat(this.name)})))};return t}();StzhIcon.style=stzhIconCss;export{StzhBadge as stzh_badge,StzhButton as stzh_button,StzhIcon as stzh_icon};
+var __awaiter=this&&this.__awaiter||function(t,o,e,s){function n(t){return t instanceof e?t:new e((function(o){o(t)}))}return new(e||(e=Promise))((function(e,r){function i(t){try{h(s.next(t))}catch(t){r(t)}}function a(t){try{h(s["throw"](t))}catch(t){r(t)}}function h(t){t.done?e(t.value):n(t.value).then(i,a)}h((s=s.apply(t,o||[])).next())}))};var __generator=this&&this.__generator||function(t,o){var e={label:0,sent:function(){if(r[0]&1)throw r[1];return r[1]},trys:[],ops:[]},s,n,r,i;return i={next:a(0),throw:a(1),return:a(2)},typeof Symbol==="function"&&(i[Symbol.iterator]=function(){return this}),i;function a(t){return function(o){return h([t,o])}}function h(a){if(s)throw new TypeError("Generator is already executing.");while(i&&(i=0,a[0]&&(e=0)),e)try{if(s=1,n&&(r=a[0]&2?n["return"]:a[0]?n["throw"]||((r=n["return"])&&r.call(n),0):n.next)&&!(r=r.call(n,a[1])).done)return r;if(n=0,r)a=[a[0]&2,r.value];switch(a[0]){case 0:case 1:r=a;break;case 4:e.label++;return{value:a[1],done:false};case 5:e.label++;n=a[1];a=[0];continue;case 7:a=e.ops.pop();e.trys.pop();continue;default:if(!(r=e.trys,r=r.length>0&&r[r.length-1])&&(a[0]===6||a[0]===2)){e=0;continue}if(a[0]===3&&(!r||a[1]>r[0]&&a[1]<r[3])){e.label=a[1];break}if(a[0]===6&&e.label<r[1]){e.label=r[1];r=a;break}if(r&&e.label<r[2]){e.label=r[2];e.ops.push(a);break}if(r[2])e.ops.pop();e.trys.pop();continue}a=o.call(t,e)}catch(t){a=[6,t];n=0}finally{s=r=0}if(a[0]&5)throw a[1];return{value:a[0]?a[1]:void 0,done:true}}};import{r as registerInstance,h,a as Host,c as createEvent,F as Fragment,g as getElement}from"./index-67fd55c9.js";import{h as hasSlot}from"./utils-51148d9a.js";import{f as fetchTranslations}from"./translation-utils-2623783f.js";var stzhBadgeCss=".sc-stzh-badge-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-badge-h{display:none}.sc-stzh-badge-h *.sc-stzh-badge,.sc-stzh-badge-h *.sc-stzh-badge::before,.sc-stzh-badge-h *.sc-stzh-badge::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-badge-h{--color:var(--stzh-color-white);--background-color:var(--stzh-base-color);display:-ms-inline-flexbox;display:inline-flex}[type=success].sc-stzh-badge-h{--background-color:var(--stzh-color-truegreen)}[type=warning].sc-stzh-badge-h{--color:var(--stzh-color-grey87);--background-color:var(--stzh-color-warning)}[type=error].sc-stzh-badge-h{--background-color:var(--stzh-color-error)}[type=info].sc-stzh-badge-h{--background-color:var(--stzh-color-zueriblue)}.stzh-badge.sc-stzh-badge{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:normal;-webkit-box-sizing:content-box;box-sizing:content-box;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;min-width:0.625rem;font-size:0.625rem;line-height:1.4;-webkit-box-shadow:0 0 0 0.0625rem #fff;box-shadow:0 0 0 0.0625rem #fff;border-radius:0.875rem;padding:0.0625rem 0.375rem;background-color:var(--background-color);color:var(--color);text-transform:uppercase}.stzh-badge.sc-stzh-badge:empty{width:0.875rem;height:0.875rem;padding:0}";var StzhBadge=function(){function t(t){registerInstance(this,t);this.label="";this.type="default"}t.prototype.render=function(){var t;var o=(t={"stzh-badge":true},t["stzh-badge--type-".concat(this.type)]=!!this.type,t);return h(Host,null,h("div",{class:o},this.label))};return t}();StzhBadge.style=stzhBadgeCss;var stzhButtonCss='@charset "UTF-8";.sc-stzh-button-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-button-h{display:none}.sc-stzh-button-h *.sc-stzh-button,.sc-stzh-button-h *.sc-stzh-button::before,.sc-stzh-button-h *.sc-stzh-button::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-button-h{--color:var(--stzh-color-white);--background-color:var(--stzh-color-primary, var(--stzh-color-zueriblue));--border-width:0.0625rem;--border-color:var(--stzh-color-primary, var(--stzh-color-zueriblue));--border-radius:var(--stzh-button-border-radius);--height:var(--stzh-form-input-height);--icon-size:var(--stzh-icon-size-small);--icon-text-margin:var(--stzh-space-small);--badge-icon-text-margin:calc(var(--icon-text-margin) + var(--stzh-space-xxsmall));--padding:calc(var(--stzh-space-xsmall) - 0.0625rem) var(--stzh-space-xlarge);--white-space:normal;--border-radius:var(--stzh-button-border-radius);--hover-color:var(--stzh-color-white);--hover-background-color:var(--stzh-color-primary-hover, var(--stzh-color-zueribluedark));--hover-border-color:var(--stzh-color-primary-hover, var(--stzh-color-zueribluedark));--floating-position:sticky;--floating-float:right;--floating-bottom:var(--stzh-space-medium);--floating-right:var(--stzh-space-medium);display:inline-block}@media screen and (min-width: 600px){.sc-stzh-button-h{--floating-bottom:var(--stzh-space-xlarge);--floating-right:var(--stzh-space-xlarge)}}[fullwidth].sc-stzh-button-h:not([fullwidth=false]){width:100%;display:block}[rounded].sc-stzh-button-h:not([rounded=false]){--border-radius:var(--height)}[floating].sc-stzh-button-h:not([floating=false]){position:var(--floating-position);bottom:var(--floating-bottom);right:var(--floating-right);float:var(--floating-float)}[size=small].sc-stzh-button-h{--height:var(--stzh-form-input-small-height)}[size=tiny].sc-stzh-button-h{--height:var(--stzh-form-input-tiny-height);--icon-text-margin:var(--stzh-space-xsmall);--padding:calc(var(--stzh-space-xxsmall) - 0.0625rem) var(--stzh-space-medium)}[variant=secondary].sc-stzh-button-h{--color:var(--stzh-color-primary, var(--stzh-color-zueriblue));--background-color:var(--stzh-color-white);--border-color:var(--stzh-color-primary60op)}[variant=input].sc-stzh-button-h{--color:var(--stzh-color-grey61);--background-color:transparent;--border-color:var(--stzh-color-grey61);--hover-color:var(--stzh-color-primary-hover, var(--stzh-color-zueribluedark));--hover-background-color:transparent;--hover-border-color:var(--stzh-color-primary-hover, var(--stzh-color-zueribluedark))}[variant=tertiary].sc-stzh-button-h{--color:var(--stzh-color-primary, var(--stzh-color-zueriblue));--background-color:transparent;--border-color:transparent;--hover-color:var(--stzh-color-primary-hover, var(--stzh-color-zueribluedark));--hover-background-color:var(--stzh-button-text-hover-background);--hover-border-color:transparent}[active].sc-stzh-button-h:not([active=false]){--color:var(--stzh-color-white);--background-color:var(--stzh-color-primary-hover, var(--stzh-color-zueribluedark));--border-color:var(--stzh-color-primary-hover, var(--stzh-color-zueribluedark));--hover-color:var(--stzh-color-white);--hover-background-color:var(--stzh-color-primary-hover, var(--stzh-color-zueribluedark));--hover-border-color:var(--stzh-color-primary-hover, var(--stzh-color-zueribluedark))}[disabled].sc-stzh-button-h:not([disabled=false]),[a11y-disabled].sc-stzh-button-h:not([a11y-disabled=false]){--border-color:var(--stzh-color-grey13);--background-color:var(--stzh-color-grey13);--hover-border-color:var(--stzh-color-grey13);--hover-background-color:var(--stzh-color-grey13)}[disabled].sc-stzh-button-h:not([disabled=false])[variant=secondary],[disabled].sc-stzh-button-h:not([disabled=false])[variant=input],[disabled].sc-stzh-button-h:not([disabled=false])[variant=tertiary],[a11y-disabled].sc-stzh-button-h:not([a11y-disabled=false])[variant=secondary],[a11y-disabled].sc-stzh-button-h:not([a11y-disabled=false])[variant=input],[a11y-disabled].sc-stzh-button-h:not([a11y-disabled=false])[variant=tertiary]{--color:var(--stzh-color-grey25);--border-color:var(--stzh-color-grey13);--background-color:transparent;--hover-color:var(--stzh-color-grey25);--hover-border-color:var(--stzh-color-grey13);--hover-background-color:transparent}@-webkit-keyframes stzh-button-effect-cta{0%,20%,50%,80%,100%{-webkit-transform:translateX(0);transform:translateX(0)}40%{-webkit-transform:translateX(-0.5rem);transform:translateX(-0.5rem)}60%{-webkit-transform:translateX(-0.25rem);transform:translateX(-0.25rem)}}@keyframes stzh-button-effect-cta{0%,20%,50%,80%,100%{-webkit-transform:translateX(0);transform:translateX(0)}40%{-webkit-transform:translateX(-0.5rem);transform:translateX(-0.5rem)}60%{-webkit-transform:translateX(-0.25rem);transform:translateX(-0.25rem)}}.sc-stzh-button-h .sc-stzh-button-s>stzh-icon,.stzh-button__icon.sc-stzh-button{--size:var(--icon-size)}.stzh-button.sc-stzh-button{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);line-height:1.25;font-family:inherit;position:relative;z-index:0;overflow:visible;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:stretch;justify-content:stretch;-webkit-appearance:none;-moz-appearance:none;appearance:none;color:var(--color);padding:var(--padding);background-color:var(--background-color);-webkit-transition-duration:var(--stzh-base-transition-animation-speed);transition-duration:var(--stzh-base-transition-animation-speed);-webkit-transition-property:color, background-color, border-color;transition-property:color, background-color, border-color;border-style:solid;border-width:var(--border-width);border-color:var(--border-color);cursor:pointer;-webkit-text-decoration-line:none;text-decoration-line:none;width:100%;min-width:var(--height);min-height:var(--height);border-radius:var(--border-radius);text-align:left}.stzh-button.sc-stzh-button:hover{border-color:var(--hover-border-color);background-color:var(--hover-background-color);color:var(--hover-color)}.stzh-button__vhidden.sc-stzh-button{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-button__inner.sc-stzh-button{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;-ms-flex-positive:1;flex-grow:1}.stzh-button__icon-wrapper.sc-stzh-button{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;-ms-flex-negative:0;flex-shrink:0;width:auto;height:1em}.stzh-button__text.sc-stzh-button{overflow-wrap:break-word;word-wrap:break-word;word-break:break-word;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto;white-space:var(--white-space);text-align:center}.stzh-button__icon-wrapper.sc-stzh-button:not(:empty)+.stzh-button__text.sc-stzh-button:not(:empty),.stzh-button__text.sc-stzh-button:not(:empty)+.stzh-button__icon-wrapper.sc-stzh-button:not(:empty){margin-left:var(--icon-text-margin)}.stzh-button__badge.sc-stzh-button{position:absolute;z-index:1;top:0;right:0}.stzh-button__input.sc-stzh-button{position:absolute;top:0;left:0;width:100%;height:100%;margin:0;z-index:-1;opacity:0;pointer-events:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.stzh-button__mark.sc-stzh-button{border:0.0625rem solid var(--stzh-color-grey61);background-color:var(--stzh-color-white);width:1.5rem;height:1.5rem;-ms-flex-negative:0;flex-shrink:0;border-radius:50%;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;-webkit-transition:border-color var(--stzh-base-transition-animation-speed);transition:border-color var(--stzh-base-transition-animation-speed);width:1.25rem;height:1.25rem;margin-right:var(--stzh-space-xsmall);border-color:currentColor}.stzh-button__mark.sc-stzh-button::before{content:""}.stzh-button__check.sc-stzh-button{background-color:currentColor;color:var(--stzh-color-primary, var(--stzh-color-zueriblue));width:0.5rem;height:0.5rem;border-radius:50%;opacity:0}@media (forced-colors: active), (-ms-high-contrast: active){.stzh-button__check.sc-stzh-button{background-color:ButtonText}}.stzh-button__input.sc-stzh-button:checked:hover~.stzh-button__inner.sc-stzh-button .stzh-button__mark.sc-stzh-button .stzh-button__check.sc-stzh-button,.stzh-button__input.sc-stzh-button:checked:focus~.stzh-button__inner.sc-stzh-button .stzh-button__mark.sc-stzh-button .stzh-button__check.sc-stzh-button{color:var(--stzh-color-primary-hover, var(--stzh-color-zueribluedark))}.stzh-button.sc-stzh-button:hover .stzh-button__mark.sc-stzh-button,.stzh-button__input.sc-stzh-button:focus:hover~.stzh-button__inner.sc-stzh-button .stzh-button__mark.sc-stzh-button,.stzh-button__input.sc-stzh-button:checked:hover~.stzh-button__inner.sc-stzh-button .stzh-button__mark.sc-stzh-button,.stzh-button__input.sc-stzh-button:checked:focus~.stzh-button__inner.sc-stzh-button .stzh-button__mark.sc-stzh-button{border-color:var(--stzh-color-primary-hover, var(--stzh-color-zueribluedark))}.stzh-button__input.sc-stzh-button:focus~.stzh-button__inner.sc-stzh-button .stzh-button__mark.sc-stzh-button,.stzh-button__input.sc-stzh-button:checked~.stzh-button__inner.sc-stzh-button .stzh-button__mark.sc-stzh-button{border-color:var(--stzh-color-primary, var(--stzh-color-zueriblue))}.stzh-button__input.sc-stzh-button:checked~.stzh-button__inner.sc-stzh-button .stzh-button__mark.sc-stzh-button .stzh-button__check.sc-stzh-button{opacity:1}.stzh-button--is-disabled.sc-stzh-button .stzh-button__input.sc-stzh-button~.stzh-button__inner.sc-stzh-button .stzh-button__mark.sc-stzh-button .stzh-button__check.sc-stzh-button{color:var(--stzh-color-grey61)}.stzh-button--is-disabled.sc-stzh-button .stzh-button__input.sc-stzh-button~.stzh-button__inner.sc-stzh-button .stzh-button__mark.sc-stzh-button{border-color:transparent}.stzh-button--is-disabled.sc-stzh-button .stzh-button__mark.sc-stzh-button{background-color:var(--stzh-color-black8)}.stzh-button--size-small.sc-stzh-button,.stzh-button--size-tiny.sc-stzh-button{font-size:var(--stzh-font-micro-font-size);line-height:var(--stzh-font-micro-text-line-height)}.stzh-button--is-floating.sc-stzh-button{-webkit-box-shadow:var(--stzh-box-shadow-overlay);box-shadow:var(--stzh-box-shadow-overlay)}.stzh-button--badge-position-button.sc-stzh-button .stzh-button__icon-wrapper.sc-stzh-button{position:static}.stzh-button__badge.sc-stzh-button,.stzh-button--badge-position-button.sc-stzh-button .stzh-button__badge.sc-stzh-button{top:calc(var(--stzh-space-xsmall) * -1);right:calc(var(--stzh-space-xsmall) * -1)}.stzh-button--badge-position-icon.stzh-button--has-icon.sc-stzh-button .stzh-button__icon-wrapper.sc-stzh-button{position:relative}.stzh-button--badge-position-icon.stzh-button--has-icon.sc-stzh-button .stzh-button__badge.sc-stzh-button{top:calc(var(--stzh-space-xsmall) * -1);right:calc(var(--stzh-space-small) * -1)}.stzh-button--badge-position-icon.stzh-button--has-icon.stzh-button--has-badge.sc-stzh-button .stzh-button__icon-wrapper.sc-stzh-button:not(:empty)+.stzh-button__text.sc-stzh-button:not(:empty),.stzh-button--badge-position-icon.stzh-button--has-icon.stzh-button--has-badge.sc-stzh-button .stzh-button__text.sc-stzh-button:not(:empty)+.stzh-button__icon-wrapper.sc-stzh-button:not(:empty){margin-left:var(--badge-icon-text-margin)}.stzh-button--has-icon-only.sc-stzh-button{width:var(--height);height:var(--height);padding:0}.stzh-button--has-icon-only.sc-stzh-button .stzh-button__text.sc-stzh-button{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-button--effect-cta.sc-stzh-button:hover .stzh-button__icon-wrapper.sc-stzh-button{-webkit-animation:stzh-button-effect-cta 1s;animation:stzh-button-effect-cta 1s}.stzh-button--align-left.sc-stzh-button .stzh-button__inner.sc-stzh-button{-ms-flex-pack:start;justify-content:flex-start}.stzh-button--align-right.sc-stzh-button .stzh-button__inner.sc-stzh-button{-ms-flex-pack:end;justify-content:flex-end}.stzh-button--align-center.sc-stzh-button .stzh-button__inner.sc-stzh-button{-ms-flex-pack:center;justify-content:center}.stzh-button--align-space-between.sc-stzh-button .stzh-button__inner.sc-stzh-button{-ms-flex-pack:justify;justify-content:space-between}.stzh-button--is-disabled.sc-stzh-button{cursor:not-allowed}';var StzhButton=function(){function t(t){var o=this;registerInstance(this,t);this.stzhFocus=createEvent(this,"stzhFocus",7);this.stzhBlur=createEvent(this,"stzhBlur",7);this.stzhChange=createEvent(this,"stzhChange",7);this.focusedByInput=false;this.onInput=function(t){o.checked=o.input.checked;o.stzhChange.emit({component:"stzh-button",originalEvent:t,value:o.value,checked:o.checked})};this.onRootFocus=function(){if(!o.focusedByInput){o.setFocus()}o.focusedByInput=false};this.onFocus=function(t){o.focusedByInput=true;var e=new FocusEvent("focus",{view:window,bubbles:false,cancelable:false});o.element.dispatchEvent(e);o.stzhFocus.emit({component:"stzh-button",originalEvent:t})};this.onBlur=function(t){var e=new FocusEvent("blur",{view:window,bubbles:false,cancelable:false});o.element.dispatchEvent(e);o.stzhBlur.emit({component:"stzh-button",originalEvent:t})};this.onClick=function(t){if(o.disabled){t.stopPropagation();t.preventDefault()}};this.localization=undefined;this.badge="";this.badgeType="default";this.badgePosition="button";this.badgeEmpty=false;this.fullwidth=false;this.rounded=false;this.floating=false;this.size="default";this.textAlign="default";this.variant="default";this.icon="";this.iconPosition="left";this.checked=false;this.name="";this.value="";this.href="";this.rel=undefined;this.target="";this.download=undefined;this.type="button";this.disabled=false;this.active=false;this.label="";this.effect="default";this.iconOnly=false;this.linkAccesskey=undefined;this.a11yLabel=undefined;this.a11yDescribedby="";this.a11yExpanded=undefined;this.a11yDisabled=undefined;this.a11yControls=undefined;this.a11yTabindex=undefined;this.analyticsId=undefined}t.prototype.setFocus=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){this.button.focus();return[2]}))}))};t.prototype.renderIcon=function(t){return h("div",{class:"stzh-button__icon-wrapper"},this.icon?h("stzh-icon",{class:"stzh-button__icon",name:this.icon}):h("slot",{name:"icon"}),(this.badge||this.badgeEmpty)&&this.badgePosition==="icon"&&t&&h("stzh-badge",{class:"stzh-button__badge",label:this.badge,type:this.badgeType}))};t.prototype.renderContent=function(){var t=this;return h("div",{class:"stzh-button__text"},this.rel&&this.rel.includes("external")&&h("div",{class:"stzh-button__vhidden"},this.localization.$globals.externalLinkLabel),this.download&&h("div",{class:"stzh-button__vhidden"},this.localization.$globals.downloadLinkLabel),h("div",{ref:function(o){return t.text=o}},this.label?this.label:h("slot",null)))};t.prototype.renderInner=function(t){return h(Fragment,null,h("div",{class:"stzh-button__inner",onClick:this.onClick},this.type==="radio"&&h("div",{class:"stzh-button__mark"},h("div",{class:"stzh-button__check"})),this.iconPosition==="left"&&this.renderIcon(t),this.renderContent(),this.iconPosition==="right"&&this.renderIcon(t)),(this.badge||this.badgeEmpty)&&(this.badgePosition==="button"||!t)&&h("stzh-badge",{class:"stzh-button__badge",label:this.badge,type:this.badgeType,onClick:this.onClick}))};t.prototype.componentWillLoad=function(){return __awaiter(this,void 0,void 0,(function(){var t;return __generator(this,(function(o){switch(o.label){case 0:if(!!this.localization)return[3,2];t=this;return[4,fetchTranslations(this.element,"button")];case 1:t.localization=o.sent();o.label=2;case 2:return[2]}}))}))};t.prototype.componentDidRender=function(){var t=this;requestAnimationFrame((function(){t.button.setAttribute("s-object-id",t.analyticsId||t.text.innerText)}))};t.prototype.render=function(){var t;var o=this;var e=hasSlot(this.element,"icon")||!!this.icon;var s=(t={"stzh-button":true,"stzh-button--has-icon":e,"stzh-button--has-icon-only":this.iconOnly,"stzh-button--has-badge":!!this.badge,"stzh-button--is-floating":this.floating,"stzh-button--is-rounded":this.rounded,"stzh-button--is-fullwidth":this.fullwidth,"stzh-button--is-disabled":this.disabled||this.a11yDisabled,"stzh-button--is-active":this.active},t["stzh-button--effect-".concat(this.effect)]=!!this.effect,t["stzh-button--badge-position-".concat(this.badgePosition)]=!!this.badgePosition,t["stzh-button--align-".concat(this.textAlign)]=!!this.textAlign,t["stzh-button--size-".concat(this.size)]=!!this.size,t["stzh-button--type-".concat(this.type)]=!!this.type,t["stzh-button--".concat(this.variant)]=!!this.variant,t);return h(Host,{tabindex:this.disabled?null:"-1",onFocus:this.onRootFocus},this.href?h("a",{ref:function(t){return o.button=t},href:this.disabled?null:this.href,rel:this.rel,download:this.download,target:this.target,class:s,"aria-label":this.a11yLabel,"aria-describedby":this.a11yDescribedby,"aria-disabled":typeof this.a11yDisabled!=="undefined"?this.a11yDisabled?"true":"false":null,"aria-expanded":typeof this.a11yExpanded!=="undefined"?this.a11yExpanded?"true":"false":null,"aria-controls":this.a11yControls,accessKey:this.linkAccesskey,tabindex:this.a11yTabindex,onFocus:this.onFocus,onBlur:this.onBlur,onClick:this.onClick},this.renderInner(e)):this.type==="radio"?h("label",{ref:function(t){return o.button=t},class:s,onClick:this.onClick},h("input",{ref:function(t){return o.input=t},type:"radio",class:"stzh-button__input",name:this.name,value:this.value,checked:this.checked,disabled:this.disabled,"aria-label":this.a11yLabel,"aria-describedby":this.a11yDescribedby,"aria-disabled":typeof this.a11yDisabled!=="undefined"?this.a11yDisabled?"true":"false":null,"aria-expanded":typeof this.a11yExpanded!=="undefined"?this.a11yExpanded?"true":"false":null,"aria-controls":this.a11yControls,accessKey:this.linkAccesskey,tabindex:this.a11yTabindex,onFocus:this.onFocus,onBlur:this.onBlur,onClick:this.onClick,onInput:this.onInput}),this.renderInner(e)):h("button",{ref:function(t){return o.button=t},class:s,type:this.type,disabled:this.disabled,"aria-label":this.a11yLabel,"aria-describedby":this.a11yDescribedby,"aria-disabled":typeof this.a11yDisabled!=="undefined"?this.a11yDisabled?"true":"false":null,"aria-expanded":typeof this.a11yExpanded!=="undefined"?this.a11yExpanded?"true":"false":null,"aria-controls":this.a11yControls,accessKey:this.linkAccesskey,tabindex:this.a11yTabindex,onFocus:this.onFocus,onBlur:this.onBlur,onClick:this.onClick},this.renderInner(e)))};Object.defineProperty(t.prototype,"element",{get:function(){return getElement(this)},enumerable:false,configurable:true});return t}();StzhButton.style=stzhButtonCss;var stzhIconCss=".sc-stzh-icon-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-icon-h{display:none}.sc-stzh-icon-h *.sc-stzh-icon,.sc-stzh-icon-h *.sc-stzh-icon::before,.sc-stzh-icon-h *.sc-stzh-icon::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-icon-h{--size:var(--stzh-icon-size-default);display:-ms-inline-flexbox;display:inline-flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;color:currentColor;vertical-align:text-top}.stzh-icon.sc-stzh-icon{width:var(--size);height:var(--size)}";var iconCounter=0;var StzhIcon=function(){function t(t){registerInstance(this,t);this.name="";this.a11yTitle=""}t.prototype.componentWillLoad=function(){this.iconId="stzh-icon-".concat(iconCounter++)};t.prototype.render=function(){return h(Host,null,this.name&&h("svg",{class:"stzh-icon",role:this.a11yTitle?"img":"presentation","aria-hidden":this.a11yTitle?null:"true",focusable:this.a11yTitle?"true":"false","aria-labelledby":this.a11yTitle?"".concat(this.iconId,"-title"):null},this.a11yTitle&&h("title",{id:"".concat(this.iconId,"-title")},this.a11yTitle),h("use",{href:"#stzh-icon-".concat(this.name)})))};return t}();StzhIcon.style=stzhIconCss;export{StzhBadge as stzh_badge,StzhButton as stzh_button,StzhIcon as stzh_icon};
 //# sourceMappingURL=stzh-badge_3.entry.js.map