npm - @oiz/stzh-components - Versions diffs - 2.7.0 → 2.8.0-beta - Mend

@oiz/stzh-components 2.7.0 → 2.8.0-beta

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

Files changed (773) hide show

package/dist/cjs/stzh-link.cjs.entry.js CHANGED Viewed

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-bf651831.js');
-const utils = require('./utils-a2ff9f84.js');
+const utils = require('./utils-916583be.js');
 const translationUtils = require('./translation-utils-73073e44.js');
 const stzhLinkCss = "@charset \"UTF-8\";.sc-stzh-link-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-link-h{display:none}.sc-stzh-link-h *.sc-stzh-link,.sc-stzh-link-h *.sc-stzh-link::before,.sc-stzh-link-h *.sc-stzh-link::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-link-h{--color:var(--stzh-link-color);--text-decoration-line:underline;--icon-size:var(--stzh-icon-size-medium);--icon-wrapper-height:var(--stzh-link-icon-wrapper-height);--hover-color:var(--stzh-link-hover-color);--hover-text-decoration-line:underline;color:var(--color);display:inline-block}.sc-stzh-link-h .sc-stzh-link-s>stzh-text{--color:initial}[fullwidth].sc-stzh-link-h:not([fullwidth=false]){width:100%;display:block}[size=small].sc-stzh-link-h{--icon-size:var(--stzh-icon-size-small)}[variant=secondary].sc-stzh-link-h{--color:var(--stzh-base-color)}[active].sc-stzh-link-h:not([active=false]){--color:var(--hover-color)}[disabled].sc-stzh-link-h:not([disabled=false]){--color:var(--stzh-color-grey25);--hover-color:var(--stzh-color-grey25)}.sc-stzh-link-h .sc-stzh-link-s>stzh-icon,.stzh-link__icon.sc-stzh-link{--size:var(--icon-size)}.stzh-link.sc-stzh-link{font-size:var(--stzh-font-curve-p1-default-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-p1-default-text-line-height, var(--stzh-font-milli-text-line-height));letter-spacing:var(--stzh-font-curve-p1-default-text-letter-spacing);font-family:inherit;position:relative;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;border:none;color:var(--color);-webkit-transition:color var(--stzh-base-transition-animation-speed);transition:color var(--stzh-base-transition-animation-speed);cursor:pointer;width:100%;-webkit-text-decoration-line:none;text-decoration-line:none;background-color:transparent;padding:0;border-radius:var(--stzh-button-border-radius);text-align:left}@media screen and (min-width: 1024px){.stzh-link.sc-stzh-link{font-size:var(--stzh-font-curve-p1-medium-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-p1-medium-text-line-height, var(--stzh-font-centi-text-line-height));letter-spacing:var(--stzh-font-curve-p1-medium-text-letter-spacing)}}.stzh-link.sc-stzh-link:hover{color:var(--hover-color)}.stzh-link.sc-stzh-link:hover .stzh-link__text.sc-stzh-link{-webkit-text-decoration-line:var(--hover-text-decoration-line);text-decoration-line:var(--hover-text-decoration-line)}.stzh-link__vhidden.sc-stzh-link{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-link__inner.sc-stzh-link{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-link__icon-wrapper.sc-stzh-link{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:var(--icon-wrapper-height)}.stzh-link__text.sc-stzh-link{-webkit-text-decoration-line:var(--text-decoration-line);text-decoration-line:var(--text-decoration-line)}.stzh-link__icon-wrapper.sc-stzh-link:not(:empty)+.stzh-link__text.sc-stzh-link:not(:empty),.stzh-link__text.sc-stzh-link:not(:empty)+.stzh-link__icon-wrapper.sc-stzh-link:not(:empty){margin-left:var(--stzh-space-xxsmall)}.stzh-link__badge.sc-stzh-link{position:absolute;z-index:1;top:0;right:0}.stzh-link--has-icon-only.sc-stzh-link .stzh-link__text.sc-stzh-link{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-link--badge-position-link.sc-stzh-link .stzh-link__icon-wrapper.sc-stzh-link{position:static}.stzh-link__badge.sc-stzh-link,.stzh-link--badge-position-link.sc-stzh-link .stzh-link__badge.sc-stzh-link{top:calc(var(--stzh-space-xxsmall) * -1);right:calc(var(--stzh-space-large) * -1)}.stzh-link--badge-position-icon.stzh-link--has-icon.sc-stzh-link .stzh-link__icon-wrapper.sc-stzh-link{position:relative}.stzh-link--badge-position-icon.stzh-link--has-icon.sc-stzh-link .stzh-link__badge.sc-stzh-link{top:calc(var(--stzh-space-xsmall) * -1);right:calc(var(--stzh-space-small) * -1)}.stzh-link--badge-position-icon.stzh-link--has-icon.stzh-link--has-badge.sc-stzh-link .stzh-link__icon-wrapper.sc-stzh-link+.stzh-link__text.sc-stzh-link:not(:empty){margin-left:var(--stzh-space-small)}.stzh-link--size-small.sc-stzh-link{font-size:var(--stzh-font-micro-font-size);line-height:var(--stzh-font-micro-text-line-height)}.stzh-link--size-inherit.sc-stzh-link{font-size:inherit;line-height:inherit;letter-spacing:inherit}.stzh-link--align-left.sc-stzh-link .stzh-link__inner.sc-stzh-link{-ms-flex-pack:start;justify-content:flex-start}.stzh-link--align-right.sc-stzh-link .stzh-link__inner.sc-stzh-link{-ms-flex-pack:end;justify-content:flex-end}.stzh-link--align-center.sc-stzh-link .stzh-link__inner.sc-stzh-link{-ms-flex-pack:center;justify-content:center}.stzh-link--align-space-between.sc-stzh-link .stzh-link__inner.sc-stzh-link{-ms-flex-pack:justify;justify-content:space-between}.stzh-link--is-disabled.sc-stzh-link{cursor:not-allowed}";
@@ -118,13 +118,13 @@ const StzhLink = class {
       [`stzh-link--${this.variant}`]: !!this.variant,
     };
     return (index.h(index.Host, { tabindex: this.disabled ? null : "-1", onFocus: this.onRootFocus }, this.href ?
-      index.h("a", { ref: (el) => (this.link = el), href: this.disabled ? null : this.href, download: this.download, rel: this.rel, target: this.target, class: classes, accessKey: this.linkAccesskey, tabindex: this.a11yTabindex, "aria-label": this.a11yLabel, "aria-describedby": this.a11yDescribedby, "aria-disabled": typeof this.a11yDisabled !== "undefined"
+      index.h("a", { ref: (el) => (this.link = el), href: this.disabled ? null : this.href, download: this.download, rel: this.rel, target: this.target, class: classes, accessKey: this.linkAccesskey, tabindex: this.a11yTabindex, "aria-label": this.a11yLabel || null, "aria-describedby": this.a11yDescribedby || null, "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, onFocus: this.onFocus, onBlur: this.onBlur }, this.renderInner(iconUsed))
+          ? (this.a11yExpanded ? "true" : "false") : null, "aria-controls": this.a11yControls || null, onFocus: this.onFocus, onBlur: this.onBlur }, this.renderInner(iconUsed))
       :
-        index.h("button", { ref: (el) => (this.link = el), class: classes, type: this.type, disabled: this.disabled, accessKey: this.linkAccesskey, tabindex: this.a11yTabindex, "aria-label": this.a11yLabel, "aria-describedby": this.a11yDescribedby, "aria-disabled": typeof this.a11yDisabled !== "undefined"
+        index.h("button", { ref: (el) => (this.link = el), class: classes, type: this.type, disabled: this.disabled, accessKey: this.linkAccesskey, tabindex: this.a11yTabindex, "aria-label": this.a11yLabel || null, "aria-describedby": this.a11yDescribedby || null, "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, onFocus: this.onFocus, onBlur: this.onBlur }, this.renderInner(iconUsed))));
+            ? (this.a11yExpanded ? "true" : "false") : null, "aria-controls": this.a11yControls || null, onFocus: this.onFocus, onBlur: this.onBlur }, this.renderInner(iconUsed))));
   }
   get element() { return index.getElement(this); }
 };

package/dist/cjs/stzh-link.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"stzh-link.entry.cjs.js","mappings":"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","names":["h","Fragment","fetchTranslations","hasSlot","Host"],"sources":["./src/components/stzh-link/stzh-link.scss?tag=stzh-link&encapsulation=scoped","./src/components/stzh-link/stzh-link.tsx"],"sourcesContent":[":host {\n --color: #{$linkColor};\n --text-decoration-line: underline;\n --icon-size: #{iconSize('medium')};\n --icon-wrapper-height: #{$linkIconWrapperHeight};\n\n --hover-color: #{$linkHoverColor};\n --hover-text-decoration-line: underline;\n\n color: var(--color);\n display: inline-block;\n\n ::slotted(stzh-text) {\n --color: initial;\n }\n\n &[fullwidth]:not([fullwidth=\"false\"]) {\n width: 100%;\n display: block;\n }\n\n &[size=\"small\"] {\n --icon-size: #{iconSize('small')};\n }\n\n &[variant=\"secondary\"] {\n --color: #{$baseColor};\n }\n\n &[active]:not([active=\"false\"]) {\n --color: var(--hover-color);\n }\n\n &[disabled]:not([disabled=\"false\"]) {\n --color: #{$colorGrey25};\n --hover-color: #{$colorGrey25};\n }\n}\n\n:host ::slotted(stzh-icon),\n.stzh-link__icon {\n --size: var(--icon-size);\n}\n\n.stzh-link {\n @include fontCurve('p1');\n font-family: inherit;\n position: relative;\n display: flex;\n align-items: center;\n justify-content: stretch;\n appearance: none;\n border: none;\n color: var(--color);\n transition: color $baseTransitionAnimationSpeed;\n cursor: pointer;\n width: 100%;\n text-decoration-line: none;\n background-color: transparent;\n padding: 0;\n border-radius: $buttonBorderRadius;\n text-align: left;\n\n &:hover {\n color: var(--hover-color);\n }\n\n &:hover &__text {\n text-decoration-line: var(--hover-text-decoration-line);\n }\n\n &__vhidden {\n @include visuallyhidden;\n }\n\n &__inner {\n display: flex;\n align-items: center;\n justify-content: center;\n flex-grow: 1;\n }\n\n &__icon-wrapper {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n width: auto;\n height: var(--icon-wrapper-height);\n }\n\n &__text {\n text-decoration-line: var(--text-decoration-line);\n }\n\n &__icon-wrapper:not(:empty) + &__text:not(:empty),\n &__text:not(:empty) + &__icon-wrapper:not(:empty) {\n margin-left: space('xxsmall');\n }\n\n &__badge {\n position: absolute;\n z-index: 1;\n top: 0;\n right: 0;\n }\n\n /* Variant if link only has icon /\n\n &--has-icon-only &__text {\n @include visuallyhidden;\n }\n\n / Badge positioning variants /\n\n &--badge-position-link &__icon-wrapper {\n position: static;\n }\n\n &__badge,\n &--badge-position-link &__badge {\n top: calc(#{space('xxsmall')} -1);\n right: calc(#{space('large')} * -1);\n }\n\n &--badge-position-icon#{&}--has-icon &__icon-wrapper {\n position: relative;\n }\n\n &--badge-position-icon#{&}--has-icon &__badge {\n top: calc(#{space('xsmall')} * -1);\n right: calc(#{space('small')} * -1);;\n }\n\n &--badge-position-icon#{&}--has-icon#{&}--has-badge &__icon-wrapper + &__text:not(:empty) {\n margin-left: space('small');\n }\n\n /* Size variants /\n\n &--size-small {\n @include fontSize('micro');\n }\n\n &--size-inherit {\n font-size: inherit;\n line-height: inherit;\n letter-spacing: inherit;\n }\n\n / Alignment variants /\n\n &--align-left &__inner {\n justify-content: flex-start;\n }\n\n &--align-right &__inner {\n justify-content: flex-end;\n }\n\n &--align-center &__inner {\n justify-content: center;\n }\n\n &--align-space-between &__inner {\n justify-content: space-between;\n }\n\n / Disabled variant /\n\n &--is-disabled {\n cursor: not-allowed;\n }\n}\n","import {\n Component,\n Host,\n Fragment,\n Element,\n h,\n Prop,\n Method,\n Event,\n EventEmitter\n} from \"@stencil/core\";\n\nimport {\n StzhLinkFocusEvent,\n StzhLinkBlurEvent\n} from \"../../index\";\n\nimport { hasSlot } from \"../../utils/utils\";\nimport { fetchTranslations, StzhLocaleComponent } from \"../../utils/translation-utils\";\n\n/\n @slot - Slot for text content\n * @slot icon - Slot for icon element\n /\n@Component({\n tag: \"stzh-link\",\n styleUrl: \"stzh-link.scss\",\n scoped: true\n})\nexport class StzhLink {\n /* Translation strings /\n @Prop() localization: StzhLocaleComponent;\n\n /* Icon (use instead of icon slot) /\n @Prop() icon: string = \"\";\n\n /* Icon Position /\n @Prop({ reflect: true }) iconPosition: \"left\" \| \"right\" = \"left\";\n\n /* Size variant /\n @Prop({ reflect: true }) size: \"default\" \| \"small\" \| \"inherit\" = \"default\";\n\n /* href attribute of the link /\n @Prop() href: string = \"\";\n\n /* Rel (if href is used) /\n @Prop() rel: string;\n\n /* target if the button is used as link (if href used) /\n @Prop() target: string = \"\";\n\n /* Download attribute of link (if `href` used) /\n @Prop() download: string;\n\n /* type of the button, if used as button (if no href used) /\n @Prop() type: \"button\" \| \"submit\" \| \"reset\" = \"button\";\n\n /* Variant style /\n @Prop({ reflect: true }) variant: \"default\" \| \"secondary\" = \"default\";\n\n /* Whether the link is full width /\n @Prop({ reflect: true }) fullwidth: boolean = false;\n\n /* Text alignment /\n @Prop({ reflect: true }) textAlign: \"left\" \| \"center\" \| \"right\" \| \"space-between\" \| \"default\" = \"default\";\n\n /* Badge text /\n @Prop() badge: string = \"\";\n\n /* Badge type /\n @Prop({ reflect: true }) badgeType: \"default\" \| \"success\" \| \"warning\" \| \"error\" \| \"info\" = \"default\";\n\n /* Whether badge should be displayed empty /\n @Prop({ reflect: true }) badgeEmpty: boolean = false;\n\n /* Badge position /\n @Prop({ reflect: true }) badgePosition: \"icon\" \| \"link\" = \"icon\";\n\n /* Disabled status /\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /* Active status /\n @Prop({ reflect: true }) active: boolean = false;\n\n /* Whether only an icon is used inside the link /\n @Prop({ reflect: true }) iconOnly: boolean = false;\n\n /* Label /\n @Prop() label: string = \"\";\n\n /* Access key of link (usually a number e.g. 1) /\n @Prop() linkAccesskey: string;\n\n /* Accessible label for screen readers to replace visible text /\n @Prop({ attribute: \"a11y-label\" }) a11yLabel: string;\n\n /* Id for element which describes the button (this will be overwritten if description prop or slot is used, used by stzh-radiogroup) /\n @Prop({ attribute: \"a11y-describedby\" }) a11yDescribedby: string = \"\";\n\n /* Aria expanded of link/button /\n @Prop({ reflect: true, attribute: \"a11y-expanded\" }) a11yExpanded: boolean;\n\n /* Aria disabled of link/button /\n @Prop({ reflect: true, attribute: \"a11y-disabled\" }) a11yDisabled: boolean;\n\n /* Aria controls of link/button /\n @Prop({ attribute: \"a11y-controls\" }) a11yControls: string;\n\n /* Tabindex of link/button /\n @Prop({ attribute: \"a11y-tabindex\" }) a11yTabindex: string;\n\n /\n For Adobe Analytics.\n * Will be rendered as value of `s-object-id` attribute to the link/button element.\n * Default value will be taken from `label` prop or default slot.\n /\n @Prop() analyticsId: string;\n\n @Element() element: HTMLStzhLinkElement;\n\n /* Focus link /\n @Method()\n async setFocus() {\n this.link.focus();\n }\n\n /* Focus event /\n @Event() stzhFocus: EventEmitter<StzhLinkFocusEvent>;\n\n /* Input blur event */\n @Event() stzhBlur: EventEmitter<StzhLinkBlurEvent>;\n\n private link: HTMLButtonElement \| HTMLAnchorElement;\n private text: HTMLDivElement;\n private focusedByInput: boolean = false;\n\n private onRootFocus = () => {\n if (!this.focusedByInput) {\n this.setFocus();\n }\n\n this.focusedByInput = false;\n }\n\n private onFocus = (event: FocusEvent) => {\n this.focusedByInput = true;\n\n const focusEvent = new FocusEvent(\"focus\", {\n view: window,\n bubbles: false,\n cancelable: false\n });\n\n this.element.dispatchEvent(focusEvent);\n this.stzhFocus.emit({\n component: \"stzh-link\",\n originalEvent: event\n });\n }\n\n private onBlur = (event: FocusEvent) => {\n const blurEvent = new FocusEvent(\"blur\", {\n view: window,\n bubbles: false,\n cancelable: false\n });\n\n this.element.dispatchEvent(blurEvent);\n this.stzhBlur.emit({\n component: \"stzh-link\",\n originalEvent: event\n });\n }\n\n private renderIcon(): HTMLInputElement {\n return (\n <div class=\"stzh-link__icon-wrapper\">\n {this.icon ?\n <stzh-icon class=\"stzh-link__icon\" name={this.icon}></stzh-icon>\n :\n <slot name=\"icon\"></slot>\n }\n {(this.badge \|\| this.badgeEmpty) &&\n <stzh-badge class=\"stzh-link__badge\" label={this.badge} type={this.badgeType}></stzh-badge>\n }\n </div>\n );\n }\n\n private renderContent(): HTMLDivElement {\n return (\n <div class=\"stzh-link__text\">\n {this.rel && this.rel.includes('external') && <div class=\"stzh-link__vhidden\">{this.localization.$globals.externalLinkLabel}</div>}\n {this.download && <div class=\"stzh-link__vhidden\">{this.localization.$globals.downloadLinkLabel}</div>}\n <div ref={(el) => (this.text = el as HTMLDivElement)}>{this.label ? this.label : <slot></slot>}</div>\n </div>\n );\n }\n\n private renderInner(iconUsed: boolean): DocumentFragment {\n return (\n <Fragment>\n <div class=\"stzh-link__inner\">\n {this.iconPosition === \"left\" && this.renderIcon()}\n {this.renderContent()}\n {this.iconPosition === \"right\" && this.renderIcon()}\n </div>\n {(this.badge \|\| this.badgeEmpty) && !iconUsed &&\n <stzh-badge class=\"stzh-link__badge\" label={this.badge} type={this.badgeType}></stzh-badge>\n }\n </Fragment>\n );\n }\n\n async componentWillLoad() {\n if (!this.localization) {\n this.localization = await fetchTranslations(this.element, \"link\");\n }\n }\n\n componentDidRender() {\n requestAnimationFrame(() => {\n this.link.setAttribute(\"s-object-id\", this.analyticsId \|\| this.text.innerText);\n });\n }\n\n render() {\n const iconUsed = hasSlot(this.element, \"icon\") \|\| !!this.icon;\n const classes = {\n \"stzh-link\": true,\n \"stzh-link--has-icon\": iconUsed,\n \"stzh-link--has-icon-only\": this.iconOnly,\n \"stzh-link--has-badge\": !!this.badge,\n \"stzh-link--is-fullwidth\": this.fullwidth,\n \"stzh-link--is-disabled\": this.disabled,\n \"stzh-link--is-active\": this.active,\n [`stzh-link--badge-position-${this.badgePosition}`]: !!this.badgePosition,\n [`stzh-link--align-${this.textAlign}`]: !!this.textAlign,\n [`stzh-link--size-${this.size}`]: !!this.size,\n [`stzh-link--${this.variant}`]: !!this.variant,\n };\n\n return (\n <Host tabindex={this.disabled ? null : \"-1\"} onFocus={this.onRootFocus}>\n {this.href ?\n <a\n ref={(el) => (this.link = el as HTMLAnchorElement)}\n href={this.disabled ? null : this.href}\n download={this.download}\n rel={this.rel}\n target={this.target}\n class={classes}\n accessKey={this.linkAccesskey}\n tabindex={this.a11yTabindex}\n aria-label={this.a11yLabel}\n aria-describedby={this.a11yDescribedby}\n aria-disabled={typeof this.a11yDisabled !== \"undefined\"\n ? (this.a11yDisabled ? \"true\" : \"false\") : null}\n aria-expanded={typeof this.a11yExpanded !== \"undefined\"\n ? (this.a11yExpanded ? \"true\" : \"false\") : null}\n aria-controls={this.a11yControls}\n onFocus={this.onFocus}\n onBlur={this.onBlur}\n >\n {this.renderInner(iconUsed)}\n </a>\n :\n <button\n ref={(el) => (this.link = el as HTMLButtonElement)}\n class={classes}\n type={this.type}\n disabled={this.disabled}\n accessKey={this.linkAccesskey}\n tabindex={this.a11yTabindex}\n aria-label={this.a11yLabel}\n aria-describedby={this.a11yDescribedby}\n aria-disabled={typeof this.a11yDisabled !== \"undefined\"\n ? (this.a11yDisabled ? \"true\" : \"false\") : null}\n aria-expanded={typeof this.a11yExpanded !== \"undefined\"\n ? (this.a11yExpanded ? \"true\" : \"false\") : null}\n aria-controls={this.a11yControls}\n onFocus={this.onFocus}\n onBlur={this.onBlur}\n >\n {this.renderInner(iconUsed)}\n </button>\n }\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"stzh-link.entry.cjs.js","mappings":"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","names":["h","Fragment","fetchTranslations","hasSlot","Host"],"sources":["./src/components/stzh-link/stzh-link.scss?tag=stzh-link&encapsulation=scoped","./src/components/stzh-link/stzh-link.tsx"],"sourcesContent":[":host {\n --color: #{$linkColor};\n --text-decoration-line: underline;\n --icon-size: #{iconSize('medium')};\n --icon-wrapper-height: #{$linkIconWrapperHeight};\n\n --hover-color: #{$linkHoverColor};\n --hover-text-decoration-line: underline;\n\n color: var(--color);\n display: inline-block;\n\n ::slotted(stzh-text) {\n --color: initial;\n }\n\n &[fullwidth]:not([fullwidth=\"false\"]) {\n width: 100%;\n display: block;\n }\n\n &[size=\"small\"] {\n --icon-size: #{iconSize('small')};\n }\n\n &[variant=\"secondary\"] {\n --color: #{$baseColor};\n }\n\n &[active]:not([active=\"false\"]) {\n --color: var(--hover-color);\n }\n\n &[disabled]:not([disabled=\"false\"]) {\n --color: #{$colorGrey25};\n --hover-color: #{$colorGrey25};\n }\n}\n\n:host ::slotted(stzh-icon),\n.stzh-link__icon {\n --size: var(--icon-size);\n}\n\n.stzh-link {\n @include fontCurve('p1');\n font-family: inherit;\n position: relative;\n display: flex;\n align-items: center;\n justify-content: stretch;\n appearance: none;\n border: none;\n color: var(--color);\n transition: color $baseTransitionAnimationSpeed;\n cursor: pointer;\n width: 100%;\n text-decoration-line: none;\n background-color: transparent;\n padding: 0;\n border-radius: $buttonBorderRadius;\n text-align: left;\n\n &:hover {\n color: var(--hover-color);\n }\n\n &:hover &__text {\n text-decoration-line: var(--hover-text-decoration-line);\n }\n\n &__vhidden {\n @include visuallyhidden;\n }\n\n &__inner {\n display: flex;\n align-items: center;\n justify-content: center;\n flex-grow: 1;\n }\n\n &__icon-wrapper {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n width: auto;\n height: var(--icon-wrapper-height);\n }\n\n &__text {\n text-decoration-line: var(--text-decoration-line);\n }\n\n &__icon-wrapper:not(:empty) + &__text:not(:empty),\n &__text:not(:empty) + &__icon-wrapper:not(:empty) {\n margin-left: space('xxsmall');\n }\n\n &__badge {\n position: absolute;\n z-index: 1;\n top: 0;\n right: 0;\n }\n\n /* Variant if link only has icon /\n\n &--has-icon-only &__text {\n @include visuallyhidden;\n }\n\n / Badge positioning variants /\n\n &--badge-position-link &__icon-wrapper {\n position: static;\n }\n\n &__badge,\n &--badge-position-link &__badge {\n top: calc(#{space('xxsmall')} -1);\n right: calc(#{space('large')} * -1);\n }\n\n &--badge-position-icon#{&}--has-icon &__icon-wrapper {\n position: relative;\n }\n\n &--badge-position-icon#{&}--has-icon &__badge {\n top: calc(#{space('xsmall')} * -1);\n right: calc(#{space('small')} * -1);;\n }\n\n &--badge-position-icon#{&}--has-icon#{&}--has-badge &__icon-wrapper + &__text:not(:empty) {\n margin-left: space('small');\n }\n\n /* Size variants /\n\n &--size-small {\n @include fontSize('micro');\n }\n\n &--size-inherit {\n font-size: inherit;\n line-height: inherit;\n letter-spacing: inherit;\n }\n\n / Alignment variants /\n\n &--align-left &__inner {\n justify-content: flex-start;\n }\n\n &--align-right &__inner {\n justify-content: flex-end;\n }\n\n &--align-center &__inner {\n justify-content: center;\n }\n\n &--align-space-between &__inner {\n justify-content: space-between;\n }\n\n / Disabled variant /\n\n &--is-disabled {\n cursor: not-allowed;\n }\n}\n","import {\n Component,\n Host,\n Fragment,\n Element,\n h,\n Prop,\n Method,\n Event,\n EventEmitter\n} from \"@stencil/core\";\n\nimport {\n StzhLinkFocusEvent,\n StzhLinkBlurEvent\n} from \"../../index\";\n\nimport { hasSlot } from \"../../utils/utils\";\nimport { fetchTranslations, StzhLocaleComponent } from \"../../utils/translation-utils\";\n\n/\n @slot - Slot for text content\n * @slot icon - Slot for icon element\n /\n@Component({\n tag: \"stzh-link\",\n styleUrl: \"stzh-link.scss\",\n scoped: true\n})\nexport class StzhLink {\n /* Translation strings /\n @Prop() localization: StzhLocaleComponent;\n\n /* Icon (use instead of icon slot) /\n @Prop() icon: string = \"\";\n\n /* Icon Position /\n @Prop({ reflect: true }) iconPosition: \"left\" \| \"right\" = \"left\";\n\n /* Size variant /\n @Prop({ reflect: true }) size: \"default\" \| \"small\" \| \"inherit\" = \"default\";\n\n /* href attribute of the link /\n @Prop() href: string = \"\";\n\n /* Rel (if href is used) /\n @Prop() rel: string;\n\n /* target if the button is used as link (if href used) /\n @Prop() target: string = \"\";\n\n /* Download attribute of link (if `href` used) /\n @Prop() download: string;\n\n /* type of the button, if used as button (if no href used) /\n @Prop() type: \"button\" \| \"submit\" \| \"reset\" = \"button\";\n\n /* Variant style /\n @Prop({ reflect: true }) variant: \"default\" \| \"secondary\" = \"default\";\n\n /* Whether the link is full width /\n @Prop({ reflect: true }) fullwidth: boolean = false;\n\n /* Text alignment /\n @Prop({ reflect: true }) textAlign: \"left\" \| \"center\" \| \"right\" \| \"space-between\" \| \"default\" = \"default\";\n\n /* Badge text /\n @Prop() badge: string = \"\";\n\n /* Badge type /\n @Prop({ reflect: true }) badgeType: \"default\" \| \"success\" \| \"warning\" \| \"error\" \| \"info\" = \"default\";\n\n /* Whether badge should be displayed empty /\n @Prop({ reflect: true }) badgeEmpty: boolean = false;\n\n /* Badge position /\n @Prop({ reflect: true }) badgePosition: \"icon\" \| \"link\" = \"icon\";\n\n /* Disabled status /\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /* Active status /\n @Prop({ reflect: true }) active: boolean = false;\n\n /* Whether only an icon is used inside the link /\n @Prop({ reflect: true }) iconOnly: boolean = false;\n\n /* Label /\n @Prop() label: string = \"\";\n\n /* Access key of link (usually a number e.g. 1) /\n @Prop() linkAccesskey: string;\n\n /* Accessible label for screen readers to replace visible text /\n @Prop({ attribute: \"a11y-label\" }) a11yLabel: string;\n\n /* Id for element which describes the button (this will be overwritten if description prop or slot is used, used by stzh-radiogroup) /\n @Prop({ attribute: \"a11y-describedby\" }) a11yDescribedby: string = \"\";\n\n /* Aria expanded of link/button /\n @Prop({ reflect: true, attribute: \"a11y-expanded\" }) a11yExpanded: boolean;\n\n /* Aria disabled of link/button /\n @Prop({ reflect: true, attribute: \"a11y-disabled\" }) a11yDisabled: boolean;\n\n /* Aria controls of link/button /\n @Prop({ attribute: \"a11y-controls\" }) a11yControls: string;\n\n /* Tabindex of link/button /\n @Prop({ attribute: \"a11y-tabindex\" }) a11yTabindex: string;\n\n /\n For Adobe Analytics.\n * Will be rendered as value of `s-object-id` attribute to the link/button element.\n * Default value will be taken from `label` prop or default slot.\n /\n @Prop() analyticsId: string;\n\n @Element() element: HTMLStzhLinkElement;\n\n /* Focus link /\n @Method()\n async setFocus() {\n this.link.focus();\n }\n\n /* Focus event /\n @Event() stzhFocus: EventEmitter<StzhLinkFocusEvent>;\n\n /* Input blur event */\n @Event() stzhBlur: EventEmitter<StzhLinkBlurEvent>;\n\n private link: HTMLButtonElement \| HTMLAnchorElement;\n private text: HTMLDivElement;\n private focusedByInput: boolean = false;\n\n private onRootFocus = () => {\n if (!this.focusedByInput) {\n this.setFocus();\n }\n\n this.focusedByInput = false;\n }\n\n private onFocus = (event: FocusEvent) => {\n this.focusedByInput = true;\n\n const focusEvent = new FocusEvent(\"focus\", {\n view: window,\n bubbles: false,\n cancelable: false\n });\n\n this.element.dispatchEvent(focusEvent);\n this.stzhFocus.emit({\n component: \"stzh-link\",\n originalEvent: event\n });\n }\n\n private onBlur = (event: FocusEvent) => {\n const blurEvent = new FocusEvent(\"blur\", {\n view: window,\n bubbles: false,\n cancelable: false\n });\n\n this.element.dispatchEvent(blurEvent);\n this.stzhBlur.emit({\n component: \"stzh-link\",\n originalEvent: event\n });\n }\n\n private renderIcon(): HTMLInputElement {\n return (\n <div class=\"stzh-link__icon-wrapper\">\n {this.icon ?\n <stzh-icon class=\"stzh-link__icon\" name={this.icon}></stzh-icon>\n :\n <slot name=\"icon\"></slot>\n }\n {(this.badge \|\| this.badgeEmpty) &&\n <stzh-badge class=\"stzh-link__badge\" label={this.badge} type={this.badgeType}></stzh-badge>\n }\n </div>\n );\n }\n\n private renderContent(): HTMLDivElement {\n return (\n <div class=\"stzh-link__text\">\n {this.rel && this.rel.includes('external') && <div class=\"stzh-link__vhidden\">{this.localization.$globals.externalLinkLabel}</div>}\n {this.download && <div class=\"stzh-link__vhidden\">{this.localization.$globals.downloadLinkLabel}</div>}\n <div ref={(el) => (this.text = el as HTMLDivElement)}>{this.label ? this.label : <slot></slot>}</div>\n </div>\n );\n }\n\n private renderInner(iconUsed: boolean): DocumentFragment {\n return (\n <Fragment>\n <div class=\"stzh-link__inner\">\n {this.iconPosition === \"left\" && this.renderIcon()}\n {this.renderContent()}\n {this.iconPosition === \"right\" && this.renderIcon()}\n </div>\n {(this.badge \|\| this.badgeEmpty) && !iconUsed &&\n <stzh-badge class=\"stzh-link__badge\" label={this.badge} type={this.badgeType}></stzh-badge>\n }\n </Fragment>\n );\n }\n\n async componentWillLoad() {\n if (!this.localization) {\n this.localization = await fetchTranslations(this.element, \"link\");\n }\n }\n\n componentDidRender() {\n requestAnimationFrame(() => {\n this.link.setAttribute(\"s-object-id\", this.analyticsId \|\| this.text.innerText);\n });\n }\n\n render() {\n const iconUsed = hasSlot(this.element, \"icon\") \|\| !!this.icon;\n const classes = {\n \"stzh-link\": true,\n \"stzh-link--has-icon\": iconUsed,\n \"stzh-link--has-icon-only\": this.iconOnly,\n \"stzh-link--has-badge\": !!this.badge,\n \"stzh-link--is-fullwidth\": this.fullwidth,\n \"stzh-link--is-disabled\": this.disabled,\n \"stzh-link--is-active\": this.active,\n [`stzh-link--badge-position-${this.badgePosition}`]: !!this.badgePosition,\n [`stzh-link--align-${this.textAlign}`]: !!this.textAlign,\n [`stzh-link--size-${this.size}`]: !!this.size,\n [`stzh-link--${this.variant}`]: !!this.variant,\n };\n\n return (\n <Host tabindex={this.disabled ? null : \"-1\"} onFocus={this.onRootFocus}>\n {this.href ?\n <a\n ref={(el) => (this.link = el as HTMLAnchorElement)}\n href={this.disabled ? null : this.href}\n download={this.download}\n rel={this.rel}\n target={this.target}\n class={classes}\n accessKey={this.linkAccesskey}\n tabindex={this.a11yTabindex}\n aria-label={this.a11yLabel \|\| null}\n aria-describedby={this.a11yDescribedby \|\| null}\n aria-disabled={typeof this.a11yDisabled !== \"undefined\"\n ? (this.a11yDisabled ? \"true\" : \"false\") : null}\n aria-expanded={typeof this.a11yExpanded !== \"undefined\"\n ? (this.a11yExpanded ? \"true\" : \"false\") : null}\n aria-controls={this.a11yControls \|\| null}\n onFocus={this.onFocus}\n onBlur={this.onBlur}\n >\n {this.renderInner(iconUsed)}\n </a>\n :\n <button\n ref={(el) => (this.link = el as HTMLButtonElement)}\n class={classes}\n type={this.type}\n disabled={this.disabled}\n accessKey={this.linkAccesskey}\n tabindex={this.a11yTabindex}\n aria-label={this.a11yLabel \|\| null}\n aria-describedby={this.a11yDescribedby \|\| null}\n aria-disabled={typeof this.a11yDisabled !== \"undefined\"\n ? (this.a11yDisabled ? \"true\" : \"false\") : null}\n aria-expanded={typeof this.a11yExpanded !== \"undefined\"\n ? (this.a11yExpanded ? \"true\" : \"false\") : null}\n aria-controls={this.a11yControls \|\| null}\n onFocus={this.onFocus}\n onBlur={this.onBlur}\n >\n {this.renderInner(iconUsed)}\n </button>\n }\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/stzh-menu_2.cjs.entry.js CHANGED Viewed

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-bf651831.js');
-const utils = require('./utils-a2ff9f84.js');
+const utils = require('./utils-916583be.js');
 const stzhMenuCss = ".sc-stzh-menu-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-menu-h{display:none}.sc-stzh-menu-h *.sc-stzh-menu,.sc-stzh-menu-h *.sc-stzh-menu::before,.sc-stzh-menu-h *.sc-stzh-menu::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-menu-h .sc-stzh-menu-s>stzh-hr{margin-top:var(--stzh-space-xsmall);margin-bottom:var(--stzh-space-xsmall)}.stzh-menu.sc-stzh-menu{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}";
@@ -95,9 +95,9 @@ const StzhMenuItem = class {
       "stzh-menu-item--is-active": this.active
     };
     return (index.h(index.Host, { role: "menuitem", tabindex: this.disabled ? null : "-1", onFocus: this.onRootFocus }, this.href ?
-      index.h("a", { ref: (el) => (this.menuItem = el), href: this.disabled ? null : this.href, target: this.target, class: classes, "aria-label": this.a11yLabel, onFocus: this.onFocus, onBlur: this.onBlur }, this.renderInner(iconUsed))
+      index.h("a", { ref: (el) => (this.menuItem = el), href: this.disabled ? null : this.href, target: this.target, class: classes, "aria-label": this.a11yLabel || null, onFocus: this.onFocus, onBlur: this.onBlur }, this.renderInner(iconUsed))
       :
-        index.h("button", { ref: (el) => (this.menuItem = el), class: classes, type: "button", disabled: this.disabled, "aria-label": this.a11yLabel, onFocus: this.onFocus, onBlur: this.onBlur }, this.renderInner(iconUsed))));
+        index.h("button", { ref: (el) => (this.menuItem = el), class: classes, type: "button", disabled: this.disabled, "aria-label": this.a11yLabel || null, onFocus: this.onFocus, onBlur: this.onBlur }, this.renderInner(iconUsed))));
   }
   get element() { return index.getElement(this); }
 };

package/dist/cjs/stzh-menu_2.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"stzh-menu.stzh-menu-item.entry.cjs.js","mappings":"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","names":["h","Host","Fragment","hasSlot"],"sources":["./src/components/stzh-menu/stzh-menu.scss?tag=stzh-menu&encapsulation=scoped","./src/components/stzh-menu/stzh-menu.tsx","./src/components/stzh-menu-item/stzh-menu-item.scss?tag=stzh-menu-item&encapsulation=scoped","./src/components/stzh-menu-item/stzh-menu-item.tsx"],"sourcesContent":[":host {\n ::slotted(stzh-hr) {\n margin-top: space('xsmall');\n margin-bottom: space('xsmall');\n }\n}\n\n.stzh-menu {\n display: flex;\n flex-direction: column;\n}\n","import {\n Component,\n Host,\n h,\n} from \"@stencil/core\";\n\n/*\n @slot - Slot for `stzh-menu-item` elements\n /\n@Component({\n tag: \"stzh-menu\",\n styleUrl: \"stzh-menu.scss\",\n scoped: true\n})\nexport class StzhMenu {\n render() {\n return (\n <Host role=\"menu\">\n <div class=\"stzh-menu\">\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n",":host {\n --height: #{$menuItemHeight};\n --color: #{$colorGrey70};\n --background-color: transparent;\n --icon-size: #{iconSize('small')};\n\n --hover-color: #{$colorGrey70};\n --hover-background-color: #{$colorGrey5};\n\n &[active]:not([active=\"false\"]) {\n --color: #{$colorPrimary};\n --hover-color: #{$colorPrimaryHover};\n --hover-background-color: #{$colorPrimary8};\n }\n\n &[disabled]:not([disabled=\"false\"]) {\n --color: #{$colorWhite};\n --background-color: #{$colorGrey13};\n\n --hover-color: #{$colorWhite};\n --hover-background-color: #{$colorGrey13};\n }\n}\n\n:host ::slotted(stzh-icon),\n.stzh-menu-item__icon {\n --size: var(--icon-size);\n}\n\n.stzh-menu-item {\n @include fontSize('micro');\n font-family: inherit;\n display: flex;\n align-items: center;\n justify-content: stretch;\n appearance: none;\n text-decoration-line: none;\n border: none;\n padding: space('xsmall') space('medium');\n padding-left: space('large');\n color: var(--color);\n background-color: var(--background-color);\n width: 100%;\n height: var(--height);\n line-height: var(--height);\n transition-duration: $baseTransitionAnimationSpeed;\n transition-property: color, background-color, border-color;\n cursor: pointer;\n\n &:hover {\n color: var(--hover-color);\n background-color: var(--hover-background-color);\n }\n\n &__icon-wrapper {\n position: relative;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n width: auto;\n height: 1em;\n }\n\n &__badge {\n position: absolute;\n z-index: 1;\n top: calc(#{space('xsmall')} -1);\n right: calc(#{space('xsmall')} * -1);\n }\n\n &__icon-wrapper + &__text:not(:empty) {\n margin-left: space('xsmall');\n }\n\n &__text {\n @include truncate;\n }\n\n /* Disabled variant /\n\n &--is-disabled {\n cursor: not-allowed;\n }\n}\n","import {\n Component,\n Host,\n h,\n Prop,\n Method,\n Element,\n Fragment,\n Event,\n EventEmitter\n} from \"@stencil/core\";\n\nimport {\n StzhMenuItemFocusEvent,\n StzhMenuItemBlurEvent\n} from \"../../index\";\n\nimport { hasSlot } from \"../../utils/utils\";\n\n/\n @slot - Slot for any content\n * @slot icon - Slot for `stzh-icon` element\n /\n@Component({\n tag: \"stzh-menu-item\",\n styleUrl: \"stzh-menu-item.scss\",\n scoped: true\n})\nexport class StzhMenuItem {\n /* Badge (only displayed if `icon` property or icon slot is used) /\n @Prop() badge: string = \"\";\n\n /* Badge type /\n @Prop({ reflect: true }) badgeType: \"default\" \| \"success\" \| \"warning\" \| \"error\" \| \"info\" = \"default\";\n\n /* Whether badge should be displayed empty /\n @Prop({ reflect: true }) badgeEmpty: boolean = false;\n\n /* Whether the button is disabled /\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /* Whether the button is active /\n @Prop({ reflect: true }) active: boolean = false;\n\n /* Icon (use instead of icon slot) /\n @Prop() icon: string = \"\";\n\n /* Label /\n @Prop() label: string = \"\";\n\n /* `href` if the button should be used as link /\n @Prop() href: string = \"\";\n\n /* Target if the button is used as link (if `href` used) /\n @Prop() target: string = \"\";\n\n /* Accessible label for screen readers to replace visible text /\n @Prop({ attribute: \"a11y-label\" }) a11yLabel: string;\n\n /\n For Adobe Analytics.\n * Will be rendered as value of `s-object-id` attribute to the link/button element.\n * Default value will be taken from `label` prop or default slot.\n /\n @Prop() analyticsId: string;\n\n @Element() element: HTMLStzhMenuItemElement;\n\n /* Focus menu item /\n @Method()\n async setFocus() {\n this.menuItem.focus();\n }\n\n /* Focus event /\n @Event() stzhFocus: EventEmitter<StzhMenuItemFocusEvent>;\n\n /* Input blur event */\n @Event() stzhBlur: EventEmitter<StzhMenuItemBlurEvent>;\n\n private menuItem: HTMLButtonElement \| HTMLAnchorElement;\n private text: HTMLDivElement;\n\n private focusedByInput: boolean = false;\n\n private onRootFocus = () => {\n if (!this.focusedByInput) {\n this.setFocus();\n }\n\n this.focusedByInput = false;\n }\n\n private onFocus = (event: FocusEvent) => {\n this.focusedByInput = true;\n\n const focusEvent = new FocusEvent(\"focus\", {\n view: window,\n bubbles: false,\n cancelable: false\n });\n\n this.element.dispatchEvent(focusEvent);\n this.stzhFocus.emit({\n component: \"stzh-menu-item\",\n originalEvent: event\n });\n }\n\n private onBlur = (event: FocusEvent) => {\n const blurEvent = new FocusEvent(\"blur\", {\n view: window,\n bubbles: false,\n cancelable: false\n });\n\n this.element.dispatchEvent(blurEvent);\n this.stzhBlur.emit({\n component: \"stzh-menu-item\",\n originalEvent: event\n });\n }\n\n componentDidRender() {\n requestAnimationFrame(() => {\n this.menuItem.setAttribute(\"s-object-id\", this.analyticsId \|\| this.text.innerText);\n });\n }\n\n private renderInner(iconUsed: boolean): DocumentFragment {\n return (\n <Fragment>\n {iconUsed &&\n <div class=\"stzh-menu-item__icon-wrapper\">\n {this.icon ?\n <stzh-icon class=\"stzh-menu-item__icon\" name={this.icon}></stzh-icon>\n :\n <slot name=\"icon\"></slot>\n }\n {(this.badge \|\| this.badgeEmpty) &&\n <stzh-badge class=\"stzh-menu-item__badge\" label={this.badge} type={this.badgeType}></stzh-badge>\n }\n </div>\n }\n <div\n ref={(el) => (this.text = el as HTMLDivElement)}\n class=\"stzh-menu-item__text\"\n >\n {this.label ? this.label : <slot></slot>}\n </div>\n </Fragment>\n );\n }\n\n render() {\n const iconUsed: boolean = hasSlot(this.element, \"icon\") \|\| !!this.icon;\n const classes = {\n \"stzh-menu-item\": true,\n \"stzh-menu-item--has-icon\": iconUsed,\n \"stzh-menu-item--has-badge\": !!this.badge,\n \"stzh-menu-item--is-disabled\": this.disabled,\n \"stzh-menu-item--is-active\": this.active\n };\n\n return (\n <Host role=\"menuitem\" tabindex={this.disabled ? null : \"-1\"} onFocus={this.onRootFocus}>\n {this.href ?\n <a\n ref={(el) => (this.menuItem = el as HTMLAnchorElement)}\n href={this.disabled ? null : this.href}\n target={this.target}\n class={classes}\n aria-label={this.a11yLabel}\n onFocus={this.onFocus}\n onBlur={this.onBlur}\n >\n {this.renderInner(iconUsed)}\n </a>\n :\n <button\n ref={(el) => (this.menuItem = el as HTMLButtonElement)}\n class={classes}\n type=\"button\"\n disabled={this.disabled}\n aria-label={this.a11yLabel}\n onFocus={this.onFocus}\n onBlur={this.onBlur}\n >\n {this.renderInner(iconUsed)}\n </button>\n }\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"stzh-menu.stzh-menu-item.entry.cjs.js","mappings":"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","names":["h","Host","Fragment","hasSlot"],"sources":["./src/components/stzh-menu/stzh-menu.scss?tag=stzh-menu&encapsulation=scoped","./src/components/stzh-menu/stzh-menu.tsx","./src/components/stzh-menu-item/stzh-menu-item.scss?tag=stzh-menu-item&encapsulation=scoped","./src/components/stzh-menu-item/stzh-menu-item.tsx"],"sourcesContent":[":host {\n ::slotted(stzh-hr) {\n margin-top: space('xsmall');\n margin-bottom: space('xsmall');\n }\n}\n\n.stzh-menu {\n display: flex;\n flex-direction: column;\n}\n","import {\n Component,\n Host,\n h,\n} from \"@stencil/core\";\n\n/*\n @slot - Slot for `stzh-menu-item` elements\n /\n@Component({\n tag: \"stzh-menu\",\n styleUrl: \"stzh-menu.scss\",\n scoped: true\n})\nexport class StzhMenu {\n render() {\n return (\n <Host role=\"menu\">\n <div class=\"stzh-menu\">\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n",":host {\n --height: #{$menuItemHeight};\n --color: #{$colorGrey70};\n --background-color: transparent;\n --icon-size: #{iconSize('small')};\n\n --hover-color: #{$colorGrey70};\n --hover-background-color: #{$colorGrey5};\n\n &[active]:not([active=\"false\"]) {\n --color: #{$colorPrimary};\n --hover-color: #{$colorPrimaryHover};\n --hover-background-color: #{$colorPrimary8};\n }\n\n &[disabled]:not([disabled=\"false\"]) {\n --color: #{$colorWhite};\n --background-color: #{$colorGrey13};\n\n --hover-color: #{$colorWhite};\n --hover-background-color: #{$colorGrey13};\n }\n}\n\n:host ::slotted(stzh-icon),\n.stzh-menu-item__icon {\n --size: var(--icon-size);\n}\n\n.stzh-menu-item {\n @include fontSize('micro');\n font-family: inherit;\n display: flex;\n align-items: center;\n justify-content: stretch;\n appearance: none;\n text-decoration-line: none;\n border: none;\n padding: space('xsmall') space('medium');\n padding-left: space('large');\n color: var(--color);\n background-color: var(--background-color);\n width: 100%;\n height: var(--height);\n line-height: var(--height);\n transition-duration: $baseTransitionAnimationSpeed;\n transition-property: color, background-color, border-color;\n cursor: pointer;\n\n &:hover {\n color: var(--hover-color);\n background-color: var(--hover-background-color);\n }\n\n &__icon-wrapper {\n position: relative;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n width: auto;\n height: 1em;\n }\n\n &__badge {\n position: absolute;\n z-index: 1;\n top: calc(#{space('xsmall')} -1);\n right: calc(#{space('xsmall')} * -1);\n }\n\n &__icon-wrapper + &__text:not(:empty) {\n margin-left: space('xsmall');\n }\n\n &__text {\n @include truncate;\n }\n\n /* Disabled variant /\n\n &--is-disabled {\n cursor: not-allowed;\n }\n}\n","import {\n Component,\n Host,\n h,\n Prop,\n Method,\n Element,\n Fragment,\n Event,\n EventEmitter\n} from \"@stencil/core\";\n\nimport {\n StzhMenuItemFocusEvent,\n StzhMenuItemBlurEvent\n} from \"../../index\";\n\nimport { hasSlot } from \"../../utils/utils\";\n\n/\n @slot - Slot for any content\n * @slot icon - Slot for `stzh-icon` element\n /\n@Component({\n tag: \"stzh-menu-item\",\n styleUrl: \"stzh-menu-item.scss\",\n scoped: true\n})\nexport class StzhMenuItem {\n /* Badge (only displayed if `icon` property or icon slot is used) /\n @Prop() badge: string = \"\";\n\n /* Badge type /\n @Prop({ reflect: true }) badgeType: \"default\" \| \"success\" \| \"warning\" \| \"error\" \| \"info\" = \"default\";\n\n /* Whether badge should be displayed empty /\n @Prop({ reflect: true }) badgeEmpty: boolean = false;\n\n /* Whether the button is disabled /\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /* Whether the button is active /\n @Prop({ reflect: true }) active: boolean = false;\n\n /* Icon (use instead of icon slot) /\n @Prop() icon: string = \"\";\n\n /* Label /\n @Prop() label: string = \"\";\n\n /* `href` if the button should be used as link /\n @Prop() href: string = \"\";\n\n /* Target if the button is used as link (if `href` used) /\n @Prop() target: string = \"\";\n\n /* Accessible label for screen readers to replace visible text /\n @Prop({ attribute: \"a11y-label\" }) a11yLabel: string;\n\n /\n For Adobe Analytics.\n * Will be rendered as value of `s-object-id` attribute to the link/button element.\n * Default value will be taken from `label` prop or default slot.\n /\n @Prop() analyticsId: string;\n\n @Element() element: HTMLStzhMenuItemElement;\n\n /* Focus menu item /\n @Method()\n async setFocus() {\n this.menuItem.focus();\n }\n\n /* Focus event /\n @Event() stzhFocus: EventEmitter<StzhMenuItemFocusEvent>;\n\n /* Input blur event */\n @Event() stzhBlur: EventEmitter<StzhMenuItemBlurEvent>;\n\n private menuItem: HTMLButtonElement \| HTMLAnchorElement;\n private text: HTMLDivElement;\n\n private focusedByInput: boolean = false;\n\n private onRootFocus = () => {\n if (!this.focusedByInput) {\n this.setFocus();\n }\n\n this.focusedByInput = false;\n }\n\n private onFocus = (event: FocusEvent) => {\n this.focusedByInput = true;\n\n const focusEvent = new FocusEvent(\"focus\", {\n view: window,\n bubbles: false,\n cancelable: false\n });\n\n this.element.dispatchEvent(focusEvent);\n this.stzhFocus.emit({\n component: \"stzh-menu-item\",\n originalEvent: event\n });\n }\n\n private onBlur = (event: FocusEvent) => {\n const blurEvent = new FocusEvent(\"blur\", {\n view: window,\n bubbles: false,\n cancelable: false\n });\n\n this.element.dispatchEvent(blurEvent);\n this.stzhBlur.emit({\n component: \"stzh-menu-item\",\n originalEvent: event\n });\n }\n\n componentDidRender() {\n requestAnimationFrame(() => {\n this.menuItem.setAttribute(\"s-object-id\", this.analyticsId \|\| this.text.innerText);\n });\n }\n\n private renderInner(iconUsed: boolean): DocumentFragment {\n return (\n <Fragment>\n {iconUsed &&\n <div class=\"stzh-menu-item__icon-wrapper\">\n {this.icon ?\n <stzh-icon class=\"stzh-menu-item__icon\" name={this.icon}></stzh-icon>\n :\n <slot name=\"icon\"></slot>\n }\n {(this.badge \|\| this.badgeEmpty) &&\n <stzh-badge class=\"stzh-menu-item__badge\" label={this.badge} type={this.badgeType}></stzh-badge>\n }\n </div>\n }\n <div\n ref={(el) => (this.text = el as HTMLDivElement)}\n class=\"stzh-menu-item__text\"\n >\n {this.label ? this.label : <slot></slot>}\n </div>\n </Fragment>\n );\n }\n\n render() {\n const iconUsed: boolean = hasSlot(this.element, \"icon\") \|\| !!this.icon;\n const classes = {\n \"stzh-menu-item\": true,\n \"stzh-menu-item--has-icon\": iconUsed,\n \"stzh-menu-item--has-badge\": !!this.badge,\n \"stzh-menu-item--is-disabled\": this.disabled,\n \"stzh-menu-item--is-active\": this.active\n };\n\n return (\n <Host role=\"menuitem\" tabindex={this.disabled ? null : \"-1\"} onFocus={this.onRootFocus}>\n {this.href ?\n <a\n ref={(el) => (this.menuItem = el as HTMLAnchorElement)}\n href={this.disabled ? null : this.href}\n target={this.target}\n class={classes}\n aria-label={this.a11yLabel \|\| null}\n onFocus={this.onFocus}\n onBlur={this.onBlur}\n >\n {this.renderInner(iconUsed)}\n </a>\n :\n <button\n ref={(el) => (this.menuItem = el as HTMLButtonElement)}\n class={classes}\n type=\"button\"\n disabled={this.disabled}\n aria-label={this.a11yLabel \|\| null}\n onFocus={this.onFocus}\n onBlur={this.onBlur}\n >\n {this.renderInner(iconUsed)}\n </button>\n }\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/stzh-overlay.cjs.entry.js CHANGED Viewed

@@ -86,7 +86,7 @@ const StzhOverlay = class {
       "stzh-overlay": true,
       "stzh-overlay--is-open": this.open
     };
-    return (index.h(index.Host, null, index.h("div", { class: classes }, index.h("div", { class: "stzh-overlay__backdrop" }), index.h("div", { class: "stzh-overlay__content" }, index.h("div", { class: "stzh-overlay__content-inner", ref: (el) => (this.dialogElement = el), tabindex: "-1", role: "dialog", "aria-label": this.a11yLabel, "aria-hidden": this.open ? "false" : "true" }, index.h("slot", null))))));
+    return (index.h(index.Host, null, index.h("div", { class: classes }, index.h("div", { class: "stzh-overlay__backdrop" }), index.h("div", { class: "stzh-overlay__content" }, index.h("div", { class: "stzh-overlay__content-inner", ref: (el) => (this.dialogElement = el), tabindex: "-1", role: "dialog", "aria-label": this.a11yLabel || null, "aria-hidden": this.open ? "false" : "true" }, index.h("slot", null))))));
   }
   get element() { return index.getElement(this); }
 };

package/dist/cjs/stzh-overlay.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"stzh-overlay.entry.cjs.js","mappings":"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~~iBACb~~,IAAI,CAAC,IAAI,GAAG,OAAO,GAAG,MAAM,IAEzCA,qBAAa,CACT,CACF,CACF,CACD,EACP;GACH;;;;;;;","names":["createFocusTrap","createBaseFocusTrapOptions","h","Host"],"sources":["./src/components/stzh-overlay/stzh-overlay.scss?tag=stzh-overlay&encapsulation=scoped","./src/components/stzh-overlay/stzh-overlay.tsx"],"sourcesContent":[":host {\n --backdrop-opacity: 0.8;\n}\n\n.stzh-overlay {\n display: none;\n z-index: $zIndexOverlay;\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n flex-direction: column;\n justify-content: stretch;\n align-items: stretch;\n\n &__backdrop {\n z-index: 1;\n background-color: $colorWhite;\n opacity: var(--backdrop-opacity);\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n }\n\n &__content {\n z-index: 2;\n display: flex;\n flex-direction: column;\n align-items: center;\n position: relative;\n flex-grow: 1;\n overflow: auto;\n }\n\n &__content-inner {\n // center content vertically\n margin-top: auto;\n margin-bottom: auto;\n outline: none;\n }\n\n &--is-open {\n display: flex;\n }\n}\n","import {\n Component,\n Host,\n h,\n Prop,\n Event,\n EventEmitter,\n Method,\n Element\n} from \"@stencil/core\";\n\nimport {\n StzhOverlayOpenEvent,\n StzhOverlayCloseEvent\n} from \"../../index\";\n\nimport { createBaseFocusTrapOptions } from \"../../utils/overlay-utils\";\n\nimport { createFocusTrap, FocusTrap } from 'focus-trap';\n\nconst CLASS_BODY_OPEN = \"stzh-overlay-open\";\n\n/*\n @slot - Slot for any content\n /\n@Component({\n tag: \"stzh-overlay\",\n styleUrl: \"stzh-overlay.scss\",\n scoped: true\n})\nexport class StzhOverlay {\n /* Whether overlay is open /\n @Prop({ mutable: true }) open: boolean = false;\n\n /* Stay in original position (true) or move to body (false) /\n @Prop() stay: boolean = true;\n\n /* Accessible label for dialog /\n @Prop({ attribute: \"a11y-label\" }) a11yLabel: string = \"\";\n\n /* Dialog open event /\n @Event() stzhOpen: EventEmitter<StzhOverlayOpenEvent>;\n\n /* Dialog close event */\n @Event() stzhClose: EventEmitter<StzhOverlayCloseEvent>;\n\n @Element() element: HTMLStzhOverlayElement;\n\n @Method()\n async show() {\n this.open = true;\n this.stzhOpen.emit({\n component: \"stzh-overlay\"\n });\n }\n\n @Method()\n async hide() {\n this.open = false;\n this.stzhClose.emit({\n component: \"stzh-overlay\"\n });\n }\n\n private trap: FocusTrap;\n private parentElement: HTMLElement;\n private dialogElement: HTMLDivElement;\n\n private getSiblings() {\n if (!this.parentElement) {\n return [];\n }\n\n return Array.from(this.parentElement.children).filter(\n (child) => child !== this.element\n );\n }\n\n private disableSiblings() {\n this.getSiblings().forEach((sibling) => {\n sibling.setAttribute(\"aria-hidden\", \"true\");\n });\n }\n\n private enableSiblings() {\n this.getSiblings().forEach((sibling) => {\n sibling.removeAttribute(\"aria-hidden\");\n });\n }\n\n private dialogShown() {\n document.body.classList.add(CLASS_BODY_OPEN);\n this.disableSiblings();\n\n if (this.trap) {\n this.trap.activate();\n }\n }\n\n private dialogHidden() {\n document.body.classList.remove(CLASS_BODY_OPEN);\n this.enableSiblings();\n\n if (this.trap) {\n this.trap.deactivate();\n }\n }\n\n connectedCallback() {\n if (!this.stay && this.element.parentElement !== document.body) {\n document.body.appendChild(this.element);\n }\n\n this.parentElement = this.element.parentElement;\n }\n\n componentDidRender() {\n this.open ? this.dialogShown() : this.dialogHidden();\n }\n\n componentDidUpdate() {\n this.trap.updateContainerElements(this.element);\n }\n\n componentDidLoad() {\n this.trap = createFocusTrap(this.element, {\n fallbackFocus: this.dialogElement,\n ...createBaseFocusTrapOptions()\n });\n\n if (this.open) {\n this.dialogShown();\n }\n }\n\n disconnectedCallback() {\n this.dialogHidden();\n }\n\n render() {\n const classes = {\n \"stzh-overlay\": true,\n \"stzh-overlay--is-open\": this.open\n };\n\n return (\n <Host>\n <div class={classes}>\n <div class=\"stzh-overlay__backdrop\"></div>\n <div class=\"stzh-overlay__content\">\n <div\n class=\"stzh-overlay__content-inner\"\n ref={(el) => (this.dialogElement = el as HTMLDivElement)}\n tabindex=\"-1\"\n role=\"dialog\"\n aria-label={this.a11yLabel}\n aria-hidden={this.open ? \"false\" : \"true\"}\n >\n <slot></slot>\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"stzh-overlay.entry.cjs.js","mappings":"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","names":["createFocusTrap","createBaseFocusTrapOptions","h","Host"],"sources":["./src/components/stzh-overlay/stzh-overlay.scss?tag=stzh-overlay&encapsulation=scoped","./src/components/stzh-overlay/stzh-overlay.tsx"],"sourcesContent":[":host {\n --backdrop-opacity: 0.8;\n}\n\n.stzh-overlay {\n display: none;\n z-index: $zIndexOverlay;\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n flex-direction: column;\n justify-content: stretch;\n align-items: stretch;\n\n &__backdrop {\n z-index: 1;\n background-color: $colorWhite;\n opacity: var(--backdrop-opacity);\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n }\n\n &__content {\n z-index: 2;\n display: flex;\n flex-direction: column;\n align-items: center;\n position: relative;\n flex-grow: 1;\n overflow: auto;\n }\n\n &__content-inner {\n // center content vertically\n margin-top: auto;\n margin-bottom: auto;\n outline: none;\n }\n\n &--is-open {\n display: flex;\n }\n}\n","import {\n Component,\n Host,\n h,\n Prop,\n Event,\n EventEmitter,\n Method,\n Element\n} from \"@stencil/core\";\n\nimport {\n StzhOverlayOpenEvent,\n StzhOverlayCloseEvent\n} from \"../../index\";\n\nimport { createBaseFocusTrapOptions } from \"../../utils/overlay-utils\";\n\nimport { createFocusTrap, FocusTrap } from 'focus-trap';\n\nconst CLASS_BODY_OPEN = \"stzh-overlay-open\";\n\n/*\n @slot - Slot for any content\n /\n@Component({\n tag: \"stzh-overlay\",\n styleUrl: \"stzh-overlay.scss\",\n scoped: true\n})\nexport class StzhOverlay {\n /* Whether overlay is open /\n @Prop({ mutable: true }) open: boolean = false;\n\n /* Stay in original position (true) or move to body (false) /\n @Prop() stay: boolean = true;\n\n /* Accessible label for dialog /\n @Prop({ attribute: \"a11y-label\" }) a11yLabel: string = \"\";\n\n /* Dialog open event /\n @Event() stzhOpen: EventEmitter<StzhOverlayOpenEvent>;\n\n /* Dialog close event */\n @Event() stzhClose: EventEmitter<StzhOverlayCloseEvent>;\n\n @Element() element: HTMLStzhOverlayElement;\n\n @Method()\n async show() {\n this.open = true;\n this.stzhOpen.emit({\n component: \"stzh-overlay\"\n });\n }\n\n @Method()\n async hide() {\n this.open = false;\n this.stzhClose.emit({\n component: \"stzh-overlay\"\n });\n }\n\n private trap: FocusTrap;\n private parentElement: HTMLElement;\n private dialogElement: HTMLDivElement;\n\n private getSiblings() {\n if (!this.parentElement) {\n return [];\n }\n\n return Array.from(this.parentElement.children).filter(\n (child) => child !== this.element\n );\n }\n\n private disableSiblings() {\n this.getSiblings().forEach((sibling) => {\n sibling.setAttribute(\"aria-hidden\", \"true\");\n });\n }\n\n private enableSiblings() {\n this.getSiblings().forEach((sibling) => {\n sibling.removeAttribute(\"aria-hidden\");\n });\n }\n\n private dialogShown() {\n document.body.classList.add(CLASS_BODY_OPEN);\n this.disableSiblings();\n\n if (this.trap) {\n this.trap.activate();\n }\n }\n\n private dialogHidden() {\n document.body.classList.remove(CLASS_BODY_OPEN);\n this.enableSiblings();\n\n if (this.trap) {\n this.trap.deactivate();\n }\n }\n\n connectedCallback() {\n if (!this.stay && this.element.parentElement !== document.body) {\n document.body.appendChild(this.element);\n }\n\n this.parentElement = this.element.parentElement;\n }\n\n componentDidRender() {\n this.open ? this.dialogShown() : this.dialogHidden();\n }\n\n componentDidUpdate() {\n this.trap.updateContainerElements(this.element);\n }\n\n componentDidLoad() {\n this.trap = createFocusTrap(this.element, {\n fallbackFocus: this.dialogElement,\n ...createBaseFocusTrapOptions()\n });\n\n if (this.open) {\n this.dialogShown();\n }\n }\n\n disconnectedCallback() {\n this.dialogHidden();\n }\n\n render() {\n const classes = {\n \"stzh-overlay\": true,\n \"stzh-overlay--is-open\": this.open\n };\n\n return (\n <Host>\n <div class={classes}>\n <div class=\"stzh-overlay__backdrop\"></div>\n <div class=\"stzh-overlay__content\">\n <div\n class=\"stzh-overlay__content-inner\"\n ref={(el) => (this.dialogElement = el as HTMLDivElement)}\n tabindex=\"-1\"\n role=\"dialog\"\n aria-label={this.a11yLabel \|\| null}\n aria-hidden={this.open ? \"false\" : \"true\"}\n >\n <slot></slot>\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/stzh-pagebottom.cjs.entry.js CHANGED Viewed

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-bf651831.js');
-const utils = require('./utils-a2ff9f84.js');
+const utils = require('./utils-916583be.js');
 const stzhPagebottomCss = ".sc-stzh-pagebottom-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-pagebottom-h{display:none}.sc-stzh-pagebottom-h *.sc-stzh-pagebottom,.sc-stzh-pagebottom-h *.sc-stzh-pagebottom::before,.sc-stzh-pagebottom-h *.sc-stzh-pagebottom::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-pagebottom-h .sc-stzh-pagebottom-s>[slot=logo]{height:2.375rem}.stzh-pagebottom.sc-stzh-pagebottom{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}@media screen and (min-width: 600px){.stzh-pagebottom.sc-stzh-pagebottom{-ms-flex-direction:row;flex-direction:row}}.stzh-pagebottom__share-title.sc-stzh-pagebottom{font-size:var(--stzh-font-curve-caption-default-font-size, var(--stzh-font-nano-font-size));line-height:var(--stzh-font-curve-caption-default-text-line-height, var(--stzh-font-nano-text-line-height));margin-bottom:var(--stzh-space-small)}@media screen and (min-width: 1024px){.stzh-pagebottom__share-title.sc-stzh-pagebottom{font-size:var(--stzh-font-curve-caption-medium-font-size, var(--stzh-font-micro-font-size));line-height:var(--stzh-font-curve-caption-medium-text-line-height, var(--stzh-font-micro-text-line-height))}}@media screen and (min-width: 600px){.stzh-pagebottom__logo.sc-stzh-pagebottom{margin-left:auto}}.stzh-pagebottom__logo-link.sc-stzh-pagebottom:not(:empty){display:block;margin-top:var(--stzh-space-xlarge)}@media screen and (min-width: 600px){.stzh-pagebottom__logo-link.sc-stzh-pagebottom:not(:empty){margin-top:0;margin-left:var(--stzh-space-xlarge)}}.stzh-pagebottom--has-border.sc-stzh-pagebottom{padding-top:var(--stzh-space-xlarge);border-top:0.0625rem solid var(--stzh-base-border-color)}@media screen and (min-width: 1024px){.stzh-pagebottom--has-border.sc-stzh-pagebottom{padding-top:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){.stzh-pagebottom--has-border.sc-stzh-pagebottom{padding-top:var(--stzh-space-xxxlarge)}}";

package/dist/cjs/stzh-pagetitle-hero.cjs.entry.js CHANGED Viewed

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-bf651831.js');
-const utils = require('./utils-a2ff9f84.js');
+const utils = require('./utils-916583be.js');
 const mediaUtils = require('./media-utils-8cfc8591.js');
 /**

package/dist/cjs/stzh-pagetitle.cjs.entry.js CHANGED Viewed

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-bf651831.js');
-const utils = require('./utils-a2ff9f84.js');
+const utils = require('./utils-916583be.js');
 const stzhPagetitleCss = ".sc-stzh-pagetitle-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-pagetitle-h{display:none}.sc-stzh-pagetitle-h *.sc-stzh-pagetitle,.sc-stzh-pagetitle-h *.sc-stzh-pagetitle::before,.sc-stzh-pagetitle-h *.sc-stzh-pagetitle::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-pagetitle-h .sc-stzh-pagetitle-s>[slot=heading]{margin-bottom:var(--stzh-space-xlarge)}@media screen and (min-width: 1024px){.sc-stzh-pagetitle-h .sc-stzh-pagetitle-s>[slot=heading]{margin-bottom:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){.sc-stzh-pagetitle-h .sc-stzh-pagetitle-s>[slot=heading]{margin-bottom:var(--stzh-space-xxxlarge)}}.sc-stzh-pagetitle-h .sc-stzh-pagetitle-s>[slot=image]{margin-top:var(--stzh-space-medium)}@media screen and (min-width: 1024px){.sc-stzh-pagetitle-h .sc-stzh-pagetitle-s>[slot=image]{margin-top:var(--stzh-space-large)}}@media screen and (min-width: 1260px){.sc-stzh-pagetitle-h .sc-stzh-pagetitle-s>[slot=image]{margin-top:var(--stzh-space-xlarge)}}.sc-stzh-pagetitle-h .sc-stzh-pagetitle-s>[slot=lead]{margin-top:var(--stzh-space-xlarge)}@media screen and (min-width: 1024px){.sc-stzh-pagetitle-h .sc-stzh-pagetitle-s>[slot=lead]{margin-top:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){.sc-stzh-pagetitle-h .sc-stzh-pagetitle-s>[slot=lead]{margin-top:var(--stzh-space-xxxlarge)}}.stzh-pagetitle__actions.sc-stzh-pagetitle{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}.stzh-pagetitle__actions.sc-stzh-pagetitle:empty{display:none}";

package/dist/cjs/stzh-pagination.cjs.entry.js ADDED Viewed

@@ -0,0 +1,86 @@
+'use strict';
+Object.defineProperty(exports, '__esModule', { value: true });
+const index = require('./index-bf651831.js');
+const translationUtils = require('./translation-utils-73073e44.js');
+const stzhPaginationCss = ".sc-stzh-pagination-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-pagination-h{display:none}.sc-stzh-pagination-h *.sc-stzh-pagination,.sc-stzh-pagination-h *.sc-stzh-pagination::before,.sc-stzh-pagination-h *.sc-stzh-pagination::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-pagination.sc-stzh-pagination{position:relative;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;gap:var(--stzh-space-medium);padding-left:calc(var(--stzh-form-input-height) + var(--stzh-space-medium))}.stzh-pagination__input.sc-stzh-pagination{--text-align:center;--input-width:var(--stzh-form-input-height);--padding:0px;width:auto;position:absolute;top:0;left:0}.stzh-pagination__total.sc-stzh-pagination{font-size:var(--stzh-font-nano-font-size);line-height:var(--stzh-font-nano-text-line-height)}.stzh-pagination--size-small.sc-stzh-pagination{padding-left:calc(var(--stzh-form-input-small-height) + var(--stzh-space-medium))}.stzh-pagination--size-small.sc-stzh-pagination .stzh-pagination__input.sc-stzh-pagination{--input-width:var(--stzh-form-input-small-height)}";
+const StzhPagination = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.stzhChange = index.createEvent(this, "stzhChange", 7);
+    this.gotoPage = (newPage) => {
+      const previous = this.value;
+      if (newPage >= 1 && newPage <= this.total) {
+        this.value = newPage;
+      }
+      else if (newPage > this.total) {
+        this.value = this.total;
+      }
+      else {
+        this.value = 1;
+      }
+      if (previous !== this.value) {
+        this.stzhChange.emit({
+          component: "stzh-pagination",
+          page: Number(this.value)
+        });
+      }
+    };
+    this.onRootFocus = () => {
+      if (this.input) {
+        this.input.setFocus();
+      }
+    };
+    this.onInputChange = (event) => {
+      const newPage = Number(event.detail.value) || 1;
+      this.gotoPage(newPage);
+    };
+    this.total = 1;
+    this.name = "";
+    this.value = 1;
+    this.label = "";
+    this.labelHidden = false;
+    this.readonly = false;
+    this.disabled = false;
+    this.description = undefined;
+    this.descriptionLong = undefined;
+    this.error = undefined;
+    this.invalid = false;
+    this.required = false;
+    this.showMarker = false;
+    this.size = "default";
+    this.a11yDescribedby = '';
+    this.localization = undefined;
+  }
+  /** Set current page to previous */
+  async prev() {
+    this.gotoPage(this.value - 1);
+  }
+  /** Set current page to next */
+  async next() {
+    this.gotoPage(this.value + 1);
+  }
+  async componentWillLoad() {
+    if (!this.localization) {
+      this.localization = await translationUtils.fetchTranslations(this.element, "pagination");
+    }
+  }
+  render() {
+    var _a;
+    const classes = {
+      "stzh-pagination": true,
+      [`stzh-pagination--size-${this.size}`]: !!this.size,
+    };
+    return (index.h(index.Host, { tabindex: this.disabled ? null : "-1", onFocus: this.onRootFocus }, index.h("div", { class: classes }, index.h("stzh-input", { class: "stzh-pagination__input", type: "number", min: 1, max: this.total, label: this.label || this.localization.label, labelHidden: true, ref: (el) => (this.input = el), onStzhChange: this.onInputChange, value: ((_a = this.value) === null || _a === void 0 ? void 0 : _a.toString()) || '', required: this.required, disabled: this.disabled, description: this.description, descriptionLong: this.descriptionLong, error: this.error, a11yDescribedby: this.a11yDescribedby, name: this.name, size: this.size, invalid: this.invalid, showMarker: this.showMarker, noAutocomplete: true }), index.h("div", { class: "stzh-pagination__total" }, this.localization.totalLabel
+      .replace(/\{total\}/gi, this.total.toString())), index.h("stzh-buttongroup", null, index.h("stzh-button", { variant: "secondary", icon: "angle-left", "icon-only": true, size: this.size, a11yDisabled: this.value <= 1, a11yDescribedby: this.a11yDescribedby, a11yLabel: `${this.label || this.localization.label}, ${this.localization.prevLabel}, ${this.localization.selectedPageLabel} ${this.value}`, disabled: this.disabled, onClick: () => this.prev() }), index.h("stzh-button", { variant: "secondary", icon: "angle-right", "icon-only": true, size: this.size, a11yDisabled: this.value >= this.total, a11yDescribedby: this.a11yDescribedby, a11yLabel: `${this.label || this.localization.label}, ${this.localization.nextLabel}, ${this.localization.selectedPageLabel} ${this.value}`, disabled: this.disabled, onClick: () => this.next() })))));
+  }
+  get element() { return index.getElement(this); }
+};
+StzhPagination.style = stzhPaginationCss;
+exports.stzh_pagination = StzhPagination;
+//# sourceMappingURL=stzh-pagination.cjs.entry.js.map

package/dist/cjs/stzh-pagination.cjs.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"stzh-pagination.entry.cjs.js","mappings":"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","names":["fetchTranslations","h","Host"],"sources":["./src/components/stzh-pagination/stzh-pagination.scss?tag=stzh-pagination&encapsulation=scoped","./src/components/stzh-pagination/stzh-pagination.tsx"],"sourcesContent":[":host {\n}\n\n.stzh-pagination {\n position: relative;\n display: flex;\n align-items: center;\n gap: space('medium');\n padding-left: calc(#{$formInputHeight} + #{space('medium')});\n\n &__input {\n --text-align: center;\n --input-width: #{$formInputHeight};\n --padding: 0px;\n\n width: auto;\n position: absolute;\n top: 0;\n left: 0;\n }\n\n &__total {\n @include fontSize('nano');\n }\n\n &--size-small {\n padding-left: calc(#{$formInputHeightSmall} + #{space('medium')});\n }\n\n &--size-small &__input {\n --input-width: #{$formInputHeightSmall};\n }\n}\n","import {\n Component,\n Prop,\n Host,\n Element,\n h,\n Event,\n EventEmitter,\n Method,\n} from \"@stencil/core\";\n\nimport {\n StzhInputChangeEvent,\n StzhPaginationChangeEvent\n} from \"../../index\";\n\nimport { fetchTranslations } from \"../../utils/translation-utils\";\nimport { StzhPaginationLocalizedText } from \"./stzh-pagination.localization\";\n\n/**\n */\n@Component({\n tag: \"stzh-pagination\",\n styleUrl: \"stzh-pagination.scss\",\n scoped: true\n})\nexport class StzhPagination {\n /** Total pages available. */\n @Prop() total: number = 1;\n\n /** Name of the hidden date picker input. */\n @Prop({ reflect: true }) name: string = \"\";\n\n /** Current page. */\n @Prop({ mutable: true }) value: number = 1;\n\n /** Label for dropdown */\n @Prop() label: string = \"\";\n\n /** Whether label is hidden. */\n @Prop() labelHidden: boolean = false;\n\n /** Whether the element is readonly or not */\n @Prop({ reflect: true }) readonly: boolean = false;\n\n /** Whether the element is disabled or not */\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /** Description message (use description slot as alternative) */\n @Prop() description: string;\n\n /** Long description message appearing in a popover (use description-long slot as alternative) */\n @Prop() descriptionLong: string;\n\n /** One or multiple error message (use error slot as alternative) */\n @Prop() error: string | string[];\n\n /** Invalid status */\n @Prop({ reflect: true }) invalid: boolean = false;\n\n /** Required status */\n @Prop({ reflect: true }) required: boolean = false;\n\n /** Append text to label depending if field is optional/required. true -> show \"(optional)\", false -> show nothing */\n @Prop({ reflect: true }) showMarker: boolean = false;\n\n /** Size variant */\n @Prop({ reflect: true }) size: \"default\" | \"small\" = \"default\";\n\n /** Id of the element which describes the input */\n @Prop({ attribute: \"a11y-describedby\" }) a11yDescribedby: string = '';\n\n /** Translation strings. */\n @Prop() localization: StzhPaginationLocalizedText;\n\n /** Pagination change event */\n @Event() stzhChange: EventEmitter<StzhPaginationChangeEvent>;\n\n @Element() element: HTMLStzhPaginationElement;\n\n /** Set current page to previous */\n @Method()\n async prev() {\n this.gotoPage(this.value - 1);\n }\n\n /** Set current page to next */\n @Method()\n async next() {\n this.gotoPage(this.value + 1);\n }\n\n private input: HTMLStzhInputElement;\n\n private gotoPage = (newPage: number) => {\n const previous = this.value;\n\n if (newPage >= 1 && newPage <= this.total) {\n this.value = newPage;\n } else if (newPage > this.total) {\n this.value = this.total;\n } else {\n this.value = 1;\n }\n\n if (previous !== this.value) {\n this.stzhChange.emit({\n component: \"stzh-pagination\",\n page: Number(this.value)\n });\n }\n }\n\n private onRootFocus = () => {\n if (this.input) {\n this.input.setFocus();\n }\n }\n\n private onInputChange = (event: CustomEvent<StzhInputChangeEvent>) => {\n const newPage = Number(event.detail.value) || 1;\n this.gotoPage(newPage);\n }\n\n async componentWillLoad() {\n if (!this.localization) {\n this.localization = await fetchTranslations(this.element, \"pagination\");\n }\n }\n\n render() {\n const classes = {\n \"stzh-pagination\": true,\n [`stzh-pagination--size-${this.size}`]: !!this.size,\n };\n\n return (\n <Host tabindex={this.disabled ? null : \"-1\"} onFocus={this.onRootFocus}>\n <div class={classes}>\n <stzh-input\n class=\"stzh-pagination__input\"\n type=\"number\"\n min={1}\n max={this.total}\n label={this.label || this.localization.label}\n labelHidden={true}\n ref={(el) => (this.input = el as HTMLStzhInputElement)}\n onStzhChange={this.onInputChange}\n value={this.value?.toString() || ''}\n required={this.required}\n disabled={this.disabled}\n description={this.description}\n descriptionLong={this.descriptionLong}\n error={this.error}\n a11yDescribedby={this.a11yDescribedby}\n name={this.name}\n size={this.size}\n invalid={this.invalid}\n showMarker={this.showMarker}\n noAutocomplete={true}\n ></stzh-input>\n <div class=\"stzh-pagination__total\">\n {this.localization.totalLabel\n .replace(/\\{total\\}/gi, this.total.toString())}\n </div>\n <stzh-buttongroup>\n <stzh-button\n variant=\"secondary\"\n icon=\"angle-left\"\n icon-only\n size={this.size}\n a11yDisabled={this.value <= 1}\n a11yDescribedby={this.a11yDescribedby}\n a11yLabel={`${this.label || this.localization.label}, ${this.localization.prevLabel}, ${this.localization.selectedPageLabel} ${this.value}`}\n disabled={this.disabled}\n onClick={() => this.prev()}\n ></stzh-button>\n <stzh-button\n variant=\"secondary\"\n icon=\"angle-right\"\n icon-only\n size={this.size}\n a11yDisabled={this.value >= this.total}\n a11yDescribedby={this.a11yDescribedby}\n a11yLabel={`${this.label || this.localization.label}, ${this.localization.nextLabel}, ${this.localization.selectedPageLabel} ${this.value}`}\n disabled={this.disabled}\n onClick={() => this.next()}\n ></stzh-button>\n </stzh-buttongroup>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/stzh-popover.cjs.entry.js CHANGED Viewed

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-bf651831.js');
 const arrow = require('./arrow-6f168e06.js');
 const focusTrap_esm = require('./focus-trap.esm-5377d3a5.js');
-const utils = require('./utils-a2ff9f84.js');
+const utils = require('./utils-916583be.js');
 const translationUtils = require('./translation-utils-73073e44.js');
 const mediaUtils = require('./media-utils-8cfc8591.js');
 const eventUtils = require('./event-utils-9b64c792.js');

package/dist/cjs/stzh-readspeaker.cjs.entry.js CHANGED Viewed

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-bf651831.js');
-const utils = require('./utils-a2ff9f84.js');
+const utils = require('./utils-916583be.js');
 const stzhReadspeakerCss = ":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-readspeaker{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}.stzh-readspeaker[hidden]{display:none}.stzh-readspeaker *,.stzh-readspeaker *::before,.stzh-readspeaker *::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-readspeaker .rsbtn_play{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-readspeaker .rsbtn_classic.rsexpanded .rsbtn_exp.rsimg{float:left;padding-bottom:0;-webkit-box-shadow:var(--stzh-box-shadow-popover);box-shadow:var(--stzh-box-shadow-popover)}.rsbtn_classic.rsexpanded{position:absolute;max-width:100%;z-index:var(--stzh-z-index-sticky)}.rsbtn_classic.rsexpanded,.rsbtn_classic.rsexpanded *,.rsbtn_classic.rsexpanded *::after,.rsbtn_classic.rsexpanded *::before{-webkit-box-sizing:initial;box-sizing:initial}.rsbtn_classic.rsexpanded .rsbtn_playerarea{padding:0.625rem;border:none}.rsbtn_classic.rsexpanded .rsbtn_closer.rsimg{right:0.625rem;top:0.625rem}.rsbtn_classic.rsexpanded .rsbtn_settings .rsbtn_btnlabel.rsimg,.rsbtn_classic.rsexpanded .rsbtn_dl .rsbtn_btnlabel,.rsbtn_classic.rsexpanded .rsbtn_powered .rsbtn_btnlabel{font-family:var(--stzh-font-family-regular);font-weight:var(--stzh-font-weight-regular);font-style:normal;font-size:var(--stzh-font-nano-font-size);line-height:var(--stzh-font-nano-text-line-height);height:auto}.rsbtn_classic.rsexpanded .rsbtn_bottomlinks{margin-top:0.3125rem}.rsbtn_classic.rsexpanded .rsbtn_topbar>*,.rsbtn_classic.rsexpanded .rsbtn_exp.rsimg .rsbtn_icon,.rsbtn_classic.rsexpanded .rsbtn_exp.rsimg .rsbtn_stop,.rsbtn_classic.rsexpanded .rsbtn_exp.rsimg .rsbtn_pause,.rsbtn_classic.rsexpanded .rsbtn_exp.rsimg .rsbtn_volume,.rsbtn_classic.rsexpanded .rsbtn_closer,.rsbtn_classic.rsexpanded .rsbtn_progress_container.rsimg{border:0.375rem solid var(--stzh-color-grey13);border-radius:0.3125rem}.rsbtn_classic.rsexpanded .rsbtn_exp.rsimg .rsbtn_icon{border:0.3125rem solid var(--stzh-color-grey13)}.rsbtn_classic.rsexpanded .rsbtn_progress_container.rsimg{border:0.4375rem solid var(--stzh-color-grey13)}.rsbtn_classic.rsexpanded .rsbtn_topbar{margin-right:2.5rem}.rsbtn_classic.rspopup.rscompact{z-index:var(--stzh-z-index-sticky);-webkit-box-shadow:var(--stzh-box-shadow-popover);box-shadow:var(--stzh-box-shadow-popover);border:none;padding:0.625rem}.rsbtn_classic.rspopup.rscompact .rsbtn_play{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;width:1.25rem;height:1.25rem}.rsbtn_classic.rspopup.rscompact .rsbtn_play .rsbtn_left,.rsbtn_classic.rspopup.rscompact .rsbtn_play .rsbtn_right{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}.rsbtn_classic.rspopup.rscompact .rsbtn_exp .rsbtn_separator{height:0.0625rem}";

package/dist/cjs/stzh-richtext_2.cjs.entry.js ADDED Viewed

@@ -0,0 +1,86 @@
+'use strict';
+Object.defineProperty(exports, '__esModule', { value: true });
+const index = require('./index-bf651831.js');
+const translationUtils = require('./translation-utils-73073e44.js');
+const stzhRichtextCss = "@charset \"UTF-8\";.sc-stzh-richtext-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-richtext-h{display:none}.sc-stzh-richtext-h *.sc-stzh-richtext,.sc-stzh-richtext-h *.sc-stzh-richtext::before,.sc-stzh-richtext-h *.sc-stzh-richtext::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-richtext-h{--color:var(--stzh-base-color);--richtext-blockquote-color:var(--stzh-richtext-blockquote-color);--richtext-blockquote-line-color:var(--stzh-richtext-blockquote-line-color);--richtext-blockquote-footer-color:var(--stzh-richtext-blockquote-footer-color);color:var(--color)}.sc-stzh-richtext-h .sc-stzh-richtext-s h1,.sc-stzh-richtext-h .sc-stzh-richtext-s h2,.sc-stzh-richtext-h .sc-stzh-richtext-s h3,.sc-stzh-richtext-h .sc-stzh-richtext-s h4{font-family:var(--stzh-font-family-title);font-weight:var(--stzh-font-weight-title);margin:0}.sc-stzh-richtext-h .sc-stzh-richtext-s b,.sc-stzh-richtext-h .sc-stzh-richtext-s strong{font-family:var(--stzh-font-family-heavy);font-weight:var(--stzh-font-weight-heavy);font-style:normal}.sc-stzh-richtext-h .sc-stzh-richtext-s i,.sc-stzh-richtext-h .sc-stzh-richtext-s em{font-family:var(--stzh-font-family-regular);font-weight:var(--stzh-font-weight-regular);font-style:normal}.sc-stzh-richtext-h .sc-stzh-richtext-s h1,.sc-stzh-richtext-h .sc-stzh-richtext-s h2,.sc-stzh-richtext-h .sc-stzh-richtext-s h3{color:var(--stzh-heading-color)}.sc-stzh-richtext-h .sc-stzh-richtext-s>*,.sc-stzh-richtext-h .sc-stzh-richtext-s p,.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text{font-size:var(--stzh-font-curve-p1-default-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-p1-default-text-line-height, var(--stzh-font-milli-text-line-height));letter-spacing:var(--stzh-font-curve-p1-default-text-letter-spacing)}@media screen and (min-width: 1024px){.sc-stzh-richtext-h .sc-stzh-richtext-s>*,.sc-stzh-richtext-h .sc-stzh-richtext-s p,.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text{font-size:var(--stzh-font-curve-p1-medium-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-p1-medium-text-line-height, var(--stzh-font-centi-text-line-height));letter-spacing:var(--stzh-font-curve-p1-medium-text-letter-spacing)}}.sc-stzh-richtext-h .sc-stzh-richtext-s h1{font-size:var(--stzh-font-curve-h1-default-font-size, var(--stzh-font-deca-font-size));line-height:var(--stzh-font-curve-h1-default-heading-line-height, var(--stzh-font-deca-text-line-height));letter-spacing:var(--stzh-font-curve-h1-default-heading-letter-spacing, var(--stzh-font-deca-text-letter-spacing))}@media screen and (min-width: 600px){.sc-stzh-richtext-h .sc-stzh-richtext-s h1{font-size:var(--stzh-font-curve-h1-small-font-size, var(--stzh-font-kilo-font-size));line-height:var(--stzh-font-curve-h1-small-heading-line-height, var(--stzh-font-kilo-text-line-height));letter-spacing:var(--stzh-font-curve-h1-small-heading-letter-spacing, var(--stzh-font-kilo-text-letter-spacing))}}@media screen and (min-width: 1024px){.sc-stzh-richtext-h .sc-stzh-richtext-s h1{font-size:var(--stzh-font-curve-h1-medium-font-size, var(--stzh-font-mega-font-size));line-height:var(--stzh-font-curve-h1-medium-heading-line-height, var(--stzh-font-mega-text-line-height));letter-spacing:var(--stzh-font-curve-h1-medium-heading-letter-spacing, var(--stzh-font-mega-text-letter-spacing))}}@media screen and (min-width: 1440px){.sc-stzh-richtext-h .sc-stzh-richtext-s h1{font-size:var(--stzh-font-curve-h1-ultra-font-size, var(--stzh-font-giga-font-size));line-height:var(--stzh-font-curve-h1-ultra-heading-line-height, var(--stzh-font-giga-text-line-height));letter-spacing:var(--stzh-font-curve-h1-ultra-heading-letter-spacing, var(--stzh-font-giga-text-letter-spacing))}}.sc-stzh-richtext-h .sc-stzh-richtext-s h2{font-size:var(--stzh-font-curve-h2-default-font-size, var(--stzh-font-deci-font-size));line-height:var(--stzh-font-curve-h2-default-heading-line-height, var(--stzh-font-deci-heading-line-height));letter-spacing:var(--stzh-font-curve-h2-default-heading-letter-spacing)}@media screen and (min-width: 600px){.sc-stzh-richtext-h .sc-stzh-richtext-s h2{font-size:var(--stzh-font-curve-h2-small-font-size, var(--stzh-font-deca-font-size));line-height:var(--stzh-font-curve-h2-small-heading-line-height, var(--stzh-font-deca-text-line-height));letter-spacing:var(--stzh-font-curve-h2-small-heading-letter-spacing, var(--stzh-font-deca-text-letter-spacing))}}@media screen and (min-width: 1024px){.sc-stzh-richtext-h .sc-stzh-richtext-s h2{font-size:var(--stzh-font-curve-h2-medium-font-size, var(--stzh-font-hecto-font-size));line-height:var(--stzh-font-curve-h2-medium-heading-line-height, var(--stzh-font-hecto-text-line-height));letter-spacing:var(--stzh-font-curve-h2-medium-heading-letter-spacing, var(--stzh-font-hecto-text-letter-spacing))}}@media screen and (min-width: 1440px){.sc-stzh-richtext-h .sc-stzh-richtext-s h2{font-size:var(--stzh-font-curve-h2-ultra-font-size, var(--stzh-font-kilo-font-size));line-height:var(--stzh-font-curve-h2-ultra-heading-line-height, var(--stzh-font-kilo-text-line-height));letter-spacing:var(--stzh-font-curve-h2-ultra-heading-letter-spacing, var(--stzh-font-kilo-text-letter-spacing))}}.sc-stzh-richtext-h .sc-stzh-richtext-s h3{font-size:var(--stzh-font-curve-h3-default-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-h3-default-heading-line-height, var(--stzh-font-centi-heading-line-height));letter-spacing:var(--stzh-font-curve-h3-default-heading-letter-spacing)}@media screen and (min-width: 600px){.sc-stzh-richtext-h .sc-stzh-richtext-s h3{font-size:var(--stzh-font-curve-h3-small-font-size, var(--stzh-font-deci-font-size));line-height:var(--stzh-font-curve-h3-small-heading-line-height, var(--stzh-font-deci-heading-line-height));letter-spacing:var(--stzh-font-curve-h3-small-heading-letter-spacing)}}@media screen and (min-width: 1024px){.sc-stzh-richtext-h .sc-stzh-richtext-s h3{font-size:var(--stzh-font-curve-h3-medium-font-size, var(--stzh-font-regular-font-size));line-height:var(--stzh-font-curve-h3-medium-heading-line-height, var(--stzh-font-regular-heading-line-height));letter-spacing:var(--stzh-font-curve-h3-medium-heading-letter-spacing)}}.sc-stzh-richtext-h .sc-stzh-richtext-s h4{font-size:var(--stzh-font-curve-h4-default-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-h4-default-heading-line-height, var(--stzh-font-milli-heading-line-height));letter-spacing:var(--stzh-font-curve-h4-default-heading-letter-spacing)}@media screen and (min-width: 1024px){.sc-stzh-richtext-h .sc-stzh-richtext-s h4{font-size:var(--stzh-font-curve-h4-medium-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-h4-medium-heading-line-height, var(--stzh-font-centi-heading-line-height));letter-spacing:var(--stzh-font-curve-h4-medium-heading-letter-spacing)}}.sc-stzh-richtext-h .sc-stzh-richtext-s h1,.sc-stzh-richtext-h .sc-stzh-richtext-s h2,.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[level=\"1\"],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[level=\"2\"]{margin-bottom:var(--stzh-space-xlarge)}@media screen and (min-width: 1024px){.sc-stzh-richtext-h .sc-stzh-richtext-s h1,.sc-stzh-richtext-h .sc-stzh-richtext-s h2,.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[level=\"1\"],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[level=\"2\"]{margin-bottom:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){.sc-stzh-richtext-h .sc-stzh-richtext-s h1,.sc-stzh-richtext-h .sc-stzh-richtext-s h2,.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[level=\"1\"],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[level=\"2\"]{margin-bottom:var(--stzh-space-xxxlarge)}}.sc-stzh-richtext-h .sc-stzh-richtext-s h1,.sc-stzh-richtext-h .sc-stzh-richtext-s h2{padding-bottom:var(--stzh-space-xsmall);border-bottom:0.0625rem solid var(--stzh-base-border-color)}@media screen and (min-width: 1024px){.sc-stzh-richtext-h .sc-stzh-richtext-s h1,.sc-stzh-richtext-h .sc-stzh-richtext-s h2{padding-bottom:var(--stzh-space-small)}}@media screen and (min-width: 1260px){.sc-stzh-richtext-h .sc-stzh-richtext-s h1,.sc-stzh-richtext-h .sc-stzh-richtext-s h2{padding-bottom:var(--stzh-space-medium)}}.sc-stzh-richtext-h .sc-stzh-richtext-s h1,.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[level=\"1\"],.sc-stzh-richtext-h .sc-stzh-richtext-s h2,.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[level=\"2\"]{margin-top:var(--stzh-space-xxlarge)}@media screen and (min-width: 1024px){.sc-stzh-richtext-h .sc-stzh-richtext-s h1,.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[level=\"1\"],.sc-stzh-richtext-h .sc-stzh-richtext-s h2,.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[level=\"2\"]{margin-top:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){.sc-stzh-richtext-h .sc-stzh-richtext-s h1,.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[level=\"1\"],.sc-stzh-richtext-h .sc-stzh-richtext-s h2,.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[level=\"2\"]{margin-top:var(--stzh-space-xxxxlarge)}}.sc-stzh-richtext-h .sc-stzh-richtext-s h3,.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[level=\"3\"],.sc-stzh-richtext-h .sc-stzh-richtext-s h4,.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[level=\"4\"]{margin-top:var(--stzh-space-xlarge)}@media screen and (min-width: 1024px){.sc-stzh-richtext-h .sc-stzh-richtext-s h3,.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[level=\"3\"],.sc-stzh-richtext-h .sc-stzh-richtext-s h4,.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[level=\"4\"]{margin-top:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){.sc-stzh-richtext-h .sc-stzh-richtext-s h3,.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[level=\"3\"],.sc-stzh-richtext-h .sc-stzh-richtext-s h4,.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[level=\"4\"]{margin-top:var(--stzh-space-xxxlarge)}}.sc-stzh-richtext-h .sc-stzh-richtext-s p,.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text,.sc-stzh-richtext-h .sc-stzh-richtext-s ul,.sc-stzh-richtext-h .sc-stzh-richtext-s ol,.sc-stzh-richtext-h .sc-stzh-richtext-s dl,.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-list{margin-top:var(--stzh-space-small);margin-bottom:var(--stzh-space-small)}@media screen and (min-width: 1024px){.sc-stzh-richtext-h .sc-stzh-richtext-s p,.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text,.sc-stzh-richtext-h .sc-stzh-richtext-s ul,.sc-stzh-richtext-h .sc-stzh-richtext-s ol,.sc-stzh-richtext-h .sc-stzh-richtext-s dl,.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-list{margin-top:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){.sc-stzh-richtext-h .sc-stzh-richtext-s p,.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text,.sc-stzh-richtext-h .sc-stzh-richtext-s ul,.sc-stzh-richtext-h .sc-stzh-richtext-s ol,.sc-stzh-richtext-h .sc-stzh-richtext-s dl,.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-list{margin-top:var(--stzh-space-large)}}@media screen and (min-width: 1024px){.sc-stzh-richtext-h .sc-stzh-richtext-s p,.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text,.sc-stzh-richtext-h .sc-stzh-richtext-s ul,.sc-stzh-richtext-h .sc-stzh-richtext-s ol,.sc-stzh-richtext-h .sc-stzh-richtext-s dl,.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-list{margin-bottom:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){.sc-stzh-richtext-h .sc-stzh-richtext-s p,.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text,.sc-stzh-richtext-h .sc-stzh-richtext-s ul,.sc-stzh-richtext-h .sc-stzh-richtext-s ol,.sc-stzh-richtext-h .sc-stzh-richtext-s dl,.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-list{margin-bottom:var(--stzh-space-large)}}.sc-stzh-richtext-h .sc-stzh-richtext-s ul ul,.sc-stzh-richtext-h .sc-stzh-richtext-s ul ol,.sc-stzh-richtext-h .sc-stzh-richtext-s ul dl,.sc-stzh-richtext-h .sc-stzh-richtext-s ul stzh-list,.sc-stzh-richtext-h .sc-stzh-richtext-s ol ul,.sc-stzh-richtext-h .sc-stzh-richtext-s ol ol,.sc-stzh-richtext-h .sc-stzh-richtext-s ol dl,.sc-stzh-richtext-h .sc-stzh-richtext-s ol stzh-list,.sc-stzh-richtext-h .sc-stzh-richtext-s dl ul,.sc-stzh-richtext-h .sc-stzh-richtext-s dl ol,.sc-stzh-richtext-h .sc-stzh-richtext-s dl dl,.sc-stzh-richtext-h .sc-stzh-richtext-s dl stzh-list,.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-list ul,.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-list ol,.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-list dl,.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-list stzh-list{margin-top:0;margin-bottom:0}.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text[curve=hero],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[curve=hero]{margin-bottom:var(--stzh-space-xlarge)}@media screen and (min-width: 1024px){.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text[curve=hero],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[curve=hero]{margin-bottom:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text[curve=hero],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[curve=hero]{margin-bottom:var(--stzh-space-xxxlarge)}}.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text[curve=h1],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[curve=h1],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text[curve=h2],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[curve=h2]{margin-bottom:var(--stzh-space-xlarge)}@media screen and (min-width: 1024px){.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text[curve=h1],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[curve=h1],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text[curve=h2],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[curve=h2]{margin-bottom:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text[curve=h1],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[curve=h1],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text[curve=h2],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[curve=h2]{margin-bottom:var(--stzh-space-xxxlarge)}}.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text[curve=h1],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[curve=h1]{margin-top:var(--stzh-space-xxlarge)}@media screen and (min-width: 1024px){.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text[curve=h1],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[curve=h1]{margin-top:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text[curve=h1],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[curve=h1]{margin-top:var(--stzh-space-xxxxlarge)}}.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text[curve=h2],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[curve=h2]{margin-top:var(--stzh-space-xxxlarge)}@media screen and (min-width: 600px){.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text[curve=h2],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[curve=h2]{margin-top:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 1024px){.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text[curve=h2],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[curve=h2]{margin-top:var(--stzh-space-big)}}@media screen and (min-width: 1260px){.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text[curve=h2],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[curve=h2]{margin-top:var(--stzh-space-xbig)}}.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text[curve=h3],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[curve=h3]{margin-top:var(--stzh-space-xlarge)}@media screen and (min-width: 1024px){.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text[curve=h3],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[curve=h3]{margin-top:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text[curve=h3],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[curve=h3]{margin-top:var(--stzh-space-xxxlarge)}}.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text[curve=h4],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[curve=h4]{margin-top:var(--stzh-space-xlarge)}@media screen and (min-width: 1024px){.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text[curve=h4],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[curve=h4]{margin-top:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text[curve=h4],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[curve=h4]{margin-top:var(--stzh-space-xxxlarge)}}.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text[curve=p1],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text[curve=p2],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[curve=p1],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[curve=p2]{margin-top:var(--stzh-space-small);margin-bottom:var(--stzh-space-small)}@media screen and (min-width: 1024px){.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text[curve=p1],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text[curve=p2],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[curve=p1],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[curve=p2]{margin-top:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text[curve=p1],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text[curve=p2],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[curve=p1],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[curve=p2]{margin-top:var(--stzh-space-large)}}@media screen and (min-width: 1024px){.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text[curve=p1],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text[curve=p2],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[curve=p1],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[curve=p2]{margin-bottom:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text[curve=p1],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-text[curve=p2],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[curve=p1],.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-heading[curve=p2]{margin-bottom:var(--stzh-space-large)}}.sc-stzh-richtext-h .sc-stzh-richtext-s ul,.sc-stzh-richtext-h .sc-stzh-richtext-s ol,.sc-stzh-richtext-h .sc-stzh-richtext-s dl{list-style:none;padding-left:0;overflow:hidden}.sc-stzh-richtext-h .sc-stzh-richtext-s ol{counter-reset:li-counter}.sc-stzh-richtext-h .sc-stzh-richtext-s ul li,.sc-stzh-richtext-h .sc-stzh-richtext-s ol li{position:relative}.sc-stzh-richtext-h .sc-stzh-richtext-s ul li::before,.sc-stzh-richtext-h .sc-stzh-richtext-s ol li::before{display:inline-block;position:absolute;left:0;top:0}.sc-stzh-richtext-h .sc-stzh-richtext-s ul li{padding-left:calc(var(--stzh-space-xsmall) + var(--stzh-space-small))}.sc-stzh-richtext-h .sc-stzh-richtext-s ul li::before{content:\"–\"}.sc-stzh-richtext-h .sc-stzh-richtext-s ol li{counter-increment:li-counter;padding-left:calc(var(--stzh-space-large) + var(--stzh-space-small))}.sc-stzh-richtext-h .sc-stzh-richtext-s ol li::before{content:counter(li-counter) \". \"}.sc-stzh-richtext-h .sc-stzh-richtext-s stzh-figure{margin-top:var(--stzh-space-xxlarge);margin-bottom:var(--stzh-space-xxlarge)}.sc-stzh-richtext-h .sc-stzh-richtext-s blockquote{font-family:var(--stzh-font-family-heavy);font-weight:var(--stzh-font-weight-heavy);font-style:normal;font-size:var(--stzh-font-curve-h3-default-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-h3-default-text-line-height, var(--stzh-font-centi-text-line-height));letter-spacing:var(--stzh-font-curve-h3-default-text-letter-spacing);padding-left:var(--stzh-space-medium);padding-right:var(--stzh-space-medium);margin:var(--stzh-space-xxlarge);color:var(--richtext-blockquote-color);position:relative;overflow:hidden}@media screen and (min-width: 600px){.sc-stzh-richtext-h .sc-stzh-richtext-s blockquote{font-size:var(--stzh-font-curve-h3-small-font-size, var(--stzh-font-deci-font-size));line-height:var(--stzh-font-curve-h3-small-text-line-height, var(--stzh-font-deci-text-line-height));letter-spacing:var(--stzh-font-curve-h3-small-text-letter-spacing)}}@media screen and (min-width: 1024px){.sc-stzh-richtext-h .sc-stzh-richtext-s blockquote{font-size:var(--stzh-font-curve-h3-medium-font-size, var(--stzh-font-regular-font-size));line-height:var(--stzh-font-curve-h3-medium-text-line-height, var(--stzh-font-regular-text-line-height));letter-spacing:var(--stzh-font-curve-h3-medium-text-letter-spacing)}}@media screen and (min-width: 1024px){.sc-stzh-richtext-h .sc-stzh-richtext-s blockquote{padding-left:var(--stzh-space-large)}}@media screen and (min-width: 1260px){.sc-stzh-richtext-h .sc-stzh-richtext-s blockquote{padding-left:var(--stzh-space-xlarge)}}@media screen and (min-width: 1024px){.sc-stzh-richtext-h .sc-stzh-richtext-s blockquote{padding-right:var(--stzh-space-large)}}@media screen and (min-width: 1260px){.sc-stzh-richtext-h .sc-stzh-richtext-s blockquote{padding-right:var(--stzh-space-xlarge)}}@media screen and (min-width: 1024px){.sc-stzh-richtext-h .sc-stzh-richtext-s blockquote{margin:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){.sc-stzh-richtext-h .sc-stzh-richtext-s blockquote{margin:var(--stzh-space-xxxxlarge)}}.sc-stzh-richtext-h .sc-stzh-richtext-s blockquote:before{background:var(--richtext-blockquote-line-color);height:calc(100% - var(--stzh-space-xsmall) * 2);width:0.1875rem;content:\" \";display:block;position:absolute;left:0;top:var(--stzh-space-xsmall)}.sc-stzh-richtext-h .sc-stzh-richtext-s blockquote p{margin-top:0;margin-bottom:var(--stzh-space-small)}@media screen and (min-width: 1024px){.sc-stzh-richtext-h .sc-stzh-richtext-s blockquote p{margin-bottom:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){.sc-stzh-richtext-h .sc-stzh-richtext-s blockquote p{margin-bottom:var(--stzh-space-large)}}.sc-stzh-richtext-h .sc-stzh-richtext-s blockquote p::before,.sc-stzh-richtext-h .sc-stzh-richtext-s blockquote p::after{display:inline-block}.sc-stzh-richtext-h .sc-stzh-richtext-s blockquote p::before{content:\"«\"}.sc-stzh-richtext-h .sc-stzh-richtext-s blockquote p::after{content:\"»\"}.sc-stzh-richtext-h .sc-stzh-richtext-s blockquote footer{font-size:var(--stzh-font-curve-p2-default-font-size, var(--stzh-font-micro-font-size));line-height:var(--stzh-font-curve-p2-default-text-line-height, var(--stzh-font-micro-text-line-height));color:var(--richtext-blockquote-footer-color)}@media screen and (min-width: 1024px){.sc-stzh-richtext-h .sc-stzh-richtext-s blockquote footer{font-size:var(--stzh-font-curve-p2-medium-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-p2-medium-text-line-height, var(--stzh-font-milli-text-line-height));letter-spacing:var(--stzh-font-curve-p2-medium-text-letter-spacing)}}.sc-stzh-richtext-h .sc-stzh-richtext-s blockquote footer::before{content:\"–\";display:inline-block;margin-right:var(--stzh-space-xxxsmall)}.sc-stzh-richtext-h .sc-stzh-richtext-s table{--min-width:none;--cell-padding:var(--stzh-table-cell-padding);width:100%;border-spacing:0;min-width:var(--min-width)}.sc-stzh-richtext-h .sc-stzh-richtext-s thead{position:-webkit-sticky;position:sticky;top:0;z-index:3}.sc-stzh-richtext-h .sc-stzh-richtext-s tr:hover td,.sc-stzh-richtext-h .sc-stzh-richtext-s tr:hover th{background-color:var(--stzh-color-grey5)}.sc-stzh-richtext-h .sc-stzh-richtext-s td,.sc-stzh-richtext-h .sc-stzh-richtext-s th{font-size:var(--stzh-font-milli-font-size);line-height:var(--stzh-font-milli-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing);text-align:left;border:none;vertical-align:top;border:none;border-bottom:0.0625rem solid var(--stzh-base-border-color);background-color:var(--stzh-color-white);-webkit-transition:background-color var(--stzh-base-transition-animation-speed);transition:background-color var(--stzh-base-transition-animation-speed);padding:var(--cell-padding)}.sc-stzh-richtext-h .sc-stzh-richtext-s td a,.sc-stzh-richtext-h .sc-stzh-richtext-s th a{color:var(--stzh-link-color);-webkit-transition:color var(--stzh-base-transition-animation-speed);transition:color var(--stzh-base-transition-animation-speed);border-radius:var(--stzh-button-border-radius)}.sc-stzh-richtext-h .sc-stzh-richtext-s td a:hover,.sc-stzh-richtext-h .sc-stzh-richtext-s td a:focus,.sc-stzh-richtext-h .sc-stzh-richtext-s th a:hover,.sc-stzh-richtext-h .sc-stzh-richtext-s th a:focus{color:var(--stzh-link-hover-color)}.sc-stzh-richtext-h .sc-stzh-richtext-s td b,.sc-stzh-richtext-h .sc-stzh-richtext-s td strong,.sc-stzh-richtext-h .sc-stzh-richtext-s th b,.sc-stzh-richtext-h .sc-stzh-richtext-s th strong{font-family:var(--stzh-font-family-heavy);font-weight:var(--stzh-font-weight-heavy);font-style:normal}.sc-stzh-richtext-h .sc-stzh-richtext-s td i,.sc-stzh-richtext-h .sc-stzh-richtext-s td em,.sc-stzh-richtext-h .sc-stzh-richtext-s th i,.sc-stzh-richtext-h .sc-stzh-richtext-s th em{font-family:var(--stzh-font-family-regular);font-weight:var(--stzh-font-weight-regular);font-style:normal}.sc-stzh-richtext-h .sc-stzh-richtext-s td.align-left,.sc-stzh-richtext-h .sc-stzh-richtext-s th.align-left{text-align:left}.sc-stzh-richtext-h .sc-stzh-richtext-s td.align-right,.sc-stzh-richtext-h .sc-stzh-richtext-s th.align-right{text-align:right}.sc-stzh-richtext-h .sc-stzh-richtext-s td.align-center,.sc-stzh-richtext-h .sc-stzh-richtext-s th.align-center{text-align:center}.sc-stzh-richtext-h .sc-stzh-richtext-s td.valign-auto,.sc-stzh-richtext-h .sc-stzh-richtext-s th.valign-auto{vertical-align:auto}.sc-stzh-richtext-h .sc-stzh-richtext-s td.valign-middle,.sc-stzh-richtext-h .sc-stzh-richtext-s th.valign-middle{vertical-align:middle}.sc-stzh-richtext-h .sc-stzh-richtext-s td.valign-bottom,.sc-stzh-richtext-h .sc-stzh-richtext-s th.valign-bottom{vertical-align:bottom}.sc-stzh-richtext-h .sc-stzh-richtext-s td.nowrap,.sc-stzh-richtext-h .sc-stzh-richtext-s th.nowrap{white-space:nowrap}.sc-stzh-richtext-h .sc-stzh-richtext-s td.is-sticky-left,.sc-stzh-richtext-h .sc-stzh-richtext-s td.is-sticky-right,.sc-stzh-richtext-h .sc-stzh-richtext-s th.is-sticky-left,.sc-stzh-richtext-h .sc-stzh-richtext-s th.is-sticky-right{position:-webkit-sticky;position:sticky;z-index:1}.sc-stzh-richtext-h .sc-stzh-richtext-s td.has-sticked,.sc-stzh-richtext-h .sc-stzh-richtext-s th.has-sticked{z-index:2}.sc-stzh-richtext-h .sc-stzh-richtext-s td.is-sticky-left,.sc-stzh-richtext-h .sc-stzh-richtext-s th.is-sticky-left{left:0}.sc-stzh-richtext-h .sc-stzh-richtext-s td.is-sticky-right,.sc-stzh-richtext-h .sc-stzh-richtext-s th.is-sticky-right{right:0}.sc-stzh-richtext-h .sc-stzh-richtext-s td.is-sticky-left::after,.sc-stzh-richtext-h .sc-stzh-richtext-s td.is-sticky-right::after,.sc-stzh-richtext-h .sc-stzh-richtext-s th.is-sticky-left::after,.sc-stzh-richtext-h .sc-stzh-richtext-s th.is-sticky-right::after{background:-webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.16)), to(rgba(0, 0, 0, 0)));background:linear-gradient(90deg, rgba(0, 0, 0, 0.16) 0%, rgba(0, 0, 0, 0) 100%);content:\"\";pointer-events:none;position:absolute;top:0;height:100%;width:0.375rem;-webkit-transform:translate(100%);transform:translate(100%);opacity:0;-webkit-transition:opacity var(--stzh-base-transition-animation-speed);transition:opacity var(--stzh-base-transition-animation-speed)}.sc-stzh-richtext-h .sc-stzh-richtext-s td.is-sticky-left::after,.sc-stzh-richtext-h .sc-stzh-richtext-s th.is-sticky-left::after{right:0}.sc-stzh-richtext-h .sc-stzh-richtext-s td.is-sticky-right::after,.sc-stzh-richtext-h .sc-stzh-richtext-s th.is-sticky-right::after{left:0;-webkit-transform:rotate(-180deg) translate(100%);transform:rotate(-180deg) translate(100%)}.sc-stzh-richtext-h .sc-stzh-richtext-s td.has-sticked.is-sticky-left::after,.sc-stzh-richtext-h .sc-stzh-richtext-s td.has-sticked.is-sticky-right::after,.sc-stzh-richtext-h .sc-stzh-richtext-s th.has-sticked.is-sticky-left::after,.sc-stzh-richtext-h .sc-stzh-richtext-s th.has-sticked.is-sticky-right::after{opacity:1}.sc-stzh-richtext-h .sc-stzh-richtext-s th{font-family:var(--stzh-font-family-heavy);font-weight:var(--stzh-font-weight-heavy);font-style:normal;color:var(--stzh-color-primary, var(--stzh-color-zueriblue))}.sc-stzh-richtext-h .sc-stzh-richtext-s th.is-sortable{padding:0}.sc-stzh-richtext-h .sc-stzh-richtext-s a{color:var(--stzh-link-color);-webkit-transition:color var(--stzh-base-transition-animation-speed);transition:color var(--stzh-base-transition-animation-speed);border-radius:var(--stzh-button-border-radius);text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness)}.sc-stzh-richtext-h .sc-stzh-richtext-s a:hover{color:var(--stzh-link-hover-color)}.sc-stzh-richtext-h .sc-stzh-richtext-s .stzh-richtext__external-link{position:relative}.sc-stzh-richtext-h .sc-stzh-richtext-s .stzh-richtext__external-vhidden{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}.sc-stzh-richtext-h .sc-stzh-richtext-s .stzh-richtext__external-icon-wrapper{position:relative;display:inline-block;width:var(--stzh-icon-size-default);height:var(--stzh-link-icon-wrapper-height);margin-left:var(--stzh-space-xxsmall)}.sc-stzh-richtext-h .sc-stzh-richtext-s .stzh-richtext__external-icon{--icon:var(--stzh-icon-size-default);position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);margin-top:0.0625rem;width:var(--stzh-icon-size-default);height:var(--stzh-icon-size-default)}.sc-stzh-richtext-h[remove-first-margin]:not([remove-first-margin=false]) .sc-stzh-richtext-s>*:first-child{margin-top:0 !important}.sc-stzh-richtext-h[remove-last-margin]:not([remove-last-margin=false]) .sc-stzh-richtext-s>*:last-child{margin-bottom:0 !important}";
+const CLASS_EXTERNAL_LINK = 'stzh-richtext__external-link';
+const CLASS_EXTERNAL_ICON_WRAPPER = 'stzh-richtext__external-icon-wrapper';
+const CLASS_EXTERNAL_ICON = 'stzh-richtext__external-icon';
+const CLASS_EXTERNAL_VHIDDEN = 'stzh-richtext__external-vhidden';
+const StzhRichtext = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.localization = undefined;
+    this.removeFirstMargin = true;
+    this.removeLastMargin = true;
+    this.externalLinkSelector = 'a[rel*="external"], a.external, a.extern';
+    this.externalLinkIcon = 'external-link';
+  }
+  addExternalLinkIcons() {
+    this.externalLinks.forEach(externalLink => {
+      externalLink.classList.add(CLASS_EXTERNAL_LINK);
+      const screenreaderText = document.createElement('span');
+      screenreaderText.classList.add(CLASS_EXTERNAL_VHIDDEN);
+      screenreaderText.innerText = this.localization.$globals.externalLinkLabel;
+      const iconWrapper = document.createElement('span');
+      iconWrapper.classList.add(CLASS_EXTERNAL_ICON_WRAPPER);
+      const icon = document.createElement('stzh-icon');
+      icon.classList.add(CLASS_EXTERNAL_ICON);
+      icon.name = this.externalLinkIcon;
+      iconWrapper.appendChild(icon);
+      externalLink.prepend(screenreaderText);
+      externalLink.appendChild(iconWrapper);
+    });
+  }
+  async componentWillLoad() {
+    if (!this.localization) {
+      this.localization = await translationUtils.fetchTranslations(this.element, "richtext");
+    }
+  }
+  componentDidRender() {
+    this.externalLinks = Array.from(this.element.querySelectorAll(this.externalLinkSelector));
+    this.addExternalLinkIcons();
+  }
+  render() {
+    const classes = {
+      "stzh-richtext": true
+    };
+    return (index.h(index.Host, null, index.h("div", { class: classes }, index.h("slot", null))));
+  }
+  get element() { return index.getElement(this); }
+};
+StzhRichtext.style = stzhRichtextCss;
+const stzhStatusCss = ".sc-stzh-status-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-status-h{display:none}.sc-stzh-status-h *.sc-stzh-status,.sc-stzh-status-h *.sc-stzh-status::before,.sc-stzh-status-h *.sc-stzh-status::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-status-h{--color:var(--stzh-base-color);--min-width:none}[with-loadingbar].sc-stzh-status-h:not([with-loadingbar=false]){--min-width:10rem}[type=success].sc-stzh-status-h{--color:var(--stzh-color-truegreen)}[type=warning].sc-stzh-status-h{--color:var(--stzh-color-warning)}[type=error].sc-stzh-status-h{--color:var(--stzh-color-error)}[type=info].sc-stzh-status-h{--color:var(--stzh-color-zueriblue)}.stzh-status.sc-stzh-status{min-width:var(--min-width);color:var(--color)}.stzh-status__dot.sc-stzh-status{border-radius:50%;width:0.75rem;height:0.75rem;background-color:currentColor;margin-right:var(--stzh-space-xxsmall)}.stzh-status__bar.sc-stzh-status{display:block;height:0.25rem;border-radius:0.75rem;background-color:var(--stzh-color-grey13);margin-top:var(--stzh-space-xxsmall)}.stzh-status__bar-inner.sc-stzh-status{display:block;height:100%;width:0;border-radius:0.75rem;background:currentColor}.stzh-status__text.sc-stzh-status{font-size:var(--stzh-font-micro-font-size);line-height:var(--stzh-font-micro-text-line-height);display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}";
+const StzhStatus = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.percent = 0;
+    this.withLoadingbar = false;
+    this.label = "";
+    this.type = "default";
+  }
+  render() {
+    const classes = {
+      "stzh-status": true,
+      [`stzh-status--type-${this.type}`]: !!this.type
+    };
+    return (index.h(index.Host, null, index.h("div", { class: classes }, index.h("div", { class: "stzh-status__text" }, index.h("div", { class: "stzh-status__dot" }), this.label &&
+      index.h("div", { class: "stzh-status__label" }, this.label)), this.withLoadingbar &&
+      index.h("div", { class: "stzh-status__bar" }, index.h("div", { class: "stzh-status__bar-inner", style: {
+          width: `${this.percent}%`
+        } })))));
+  }
+  get element() { return index.getElement(this); }
+};
+StzhStatus.style = stzhStatusCss;
+exports.stzh_richtext = StzhRichtext;
+exports.stzh_status = StzhStatus;
+//# sourceMappingURL=stzh-richtext_2.cjs.entry.js.map