npm - @oiz/stzh-components - Versions diffs - 4.6.0-beta3 → 4.6.0 - Mend

@oiz/stzh-components 4.6.0-beta3 → 4.6.0

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

package/dist/components/{p-10d1bf15.js.map → p-2d80d228.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-10d1bf15.js","mappings":"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","names":[],"sources":["src/components/stzh-link/stzh-link.scss?tag=stzh-link&encapsulation=scoped","src/components/stzh-link/stzh-link.tsx"],"sourcesContent":["/*\n @prop --color: Color of link\n * @prop --hover-color: Hover color of link\n * @prop --text-decoration-line: Text decoration of link\n * @prop --hover-text-decoration-line: Hover text decoration of link\n * @prop --icon-size: Size of icon next to link\n * @prop --min-height: Min height of link\n \n @prop --stzh-link-color: Global: Color of link\n * @prop --stzh-link-hover-color: Global: Hover color of link\n * @prop --stzh-link-text-decoration-line: Global: Text decoration of link\n * @prop --stzh-link-hover-text-decoration-line: Global: Text decoration of link\n * @prop --stzh-link-icon-size: Global: Size of icon next to link\n * @prop --stzh-link-text-decoration-thickness: Global: Text decoration thickness\n * @prop --stzh-link-text-decoration-skip-ink: Global: Whether to skip ink in text decoration\n * @prop --stzh-link-text-underline-offset: Global: Text underline offset\n /\n\n@mixin link--size-default() {\n --font-size: var(--stzh-font-milli-font-size);\n --line-height: var(--stzh-font-milli-text-line-height);\n --letter-spacing: normal;\n\n @include mq($from: medium) {\n --font-size: var(--stzh-font-centi-font-size);\n --line-height: var(--stzh-font-centi-text-line-height);\n --letter-spacing: normal;\n }\n}\n\n@mixin link--size-small() {\n --font-size: var(--stzh-font-micro-font-size);\n --line-height: var(--stzh-font-micro-text-line-height);\n --letter-spacing: normal;\n}\n\n@mixin link--size-inherit() {\n --font-size: inherit;\n --line-height: inherit;\n --letter-spacing: inherit;\n}\n\n:host {\n @include link--size-default;\n --color: #{$linkColor};\n --text-decoration-line: #{$linkTextDecorationLine};\n --icon-wrapper-height: #{$linkIconWrapperHeight};\n --icon-size: #{$linkIconSize};\n --height: var(--stzh-link-height, 40px);\n\n --hover-color: #{$linkHoverColor};\n --hover-text-decoration-line: #{$linkHoverTextDecorationLine};\n\n @include mq($from: medium) {\n --height: var(--stzh-link-height, auto);\n }\n\n color: var(--color);\n display: inline-grid;\n width: auto;\n min-height: var(--height);\n pointer-events: var(--stzh-link-pointer-events, auto);\n\n &[height=\"auto\"] {\n --height: var(--stzh-link-auto-height, auto);\n }\n\n &[fullwidth]:not([fullwidth=\"false\"]) {\n width: 100%;\n display: grid;\n }\n\n &[variant=\"secondary\"] {\n --color: #{$linkSecondaryColor};\n --hover-color: #{$linkSecondaryHoverColor};\n }\n\n &[variant=\"back\"] {\n --text-decoration-line: none;\n --hover-color: var(--color);\n }\n\n &[active]:not([active=\"false\"]) {\n --color: var(--hover-color);\n }\n\n &[disabled]:not([disabled=\"false\"]) {\n --color: #{$colorGrey60};\n --hover-color: #{$colorGrey60};\n }\n}\n\n:host(:where([size=\"small\"])) {\n @include link--size-small;\n}\n\n:host(:where([size=\"inherit\"])) {\n @include link--size-inherit;\n}\n\n//@each $breakpoint, $size in $breakpoints {\n// @include mq($from: $breakpoint) {\n// :host(:where([size-#{$breakpoint}=\"default\"])) {\n// @include link--size-default;\n// }\n//\n// :host(:where([size-#{$breakpoint}=\"small\"])) {\n// @include link--size-small;\n// }\n//\n// :host(:where([size-#{$breakpoint}=\"inherit\"])) {\n// @include link--size-inherit;\n// }\n// }\n//}\n\n.stzh-link {\n font-size: var(--font-size);\n line-height: var(--line-height);\n letter-spacing: var(--letter-spacing);\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 @media (hover: none) {\n color: inherit;\n }\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 --stzh-icon-size: var(--icon-size);\n\n display: none;\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 --stzh-base-color: initial;\n\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 &--has-icon &__icon-wrapper {\n display: inline-flex;\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\n &__icon-wrapper\n + &__text:not(:empty) {\n margin-left: space(\"small\");\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 { Component, Host, Fragment, Element, h, Prop, Event, EventEmitter } from \"@stencil/core\";\n\nimport { StzhLinkFocusEvent, StzhLinkBlurEvent, StzhLinkSize, StzhBadgeType, StzhLinkClickEvent } from \"../../index\";\n\nimport { StzhLinkLocalizedText } from \"./stzh-link.localization\";\nimport { hasSlot, addWordBreakToLinks } from \"../../utils/utils\";\n\n/\n @slot icon - Slot for icon element\n * @slot - Slot for label/text content\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: StzhLinkLocalizedText;\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 /* Height variant (none prevent setting min-height for mikro and small breakpoint) /\n @Prop({ reflect: true }) height: \"default\" \| \"auto\" = \"default\";\n\n /* Size variant /\n @Prop({ reflect: true }) size: StzhLinkSize = \"default\";\n\n /* Size variant (above small breakpoint) /\n @Prop({ reflect: true }) sizeSmall: StzhLinkSize;\n\n /* Size variant (above medium breakpoint) /\n @Prop({ reflect: true }) sizeMedium: StzhLinkSize;\n\n /* Size variant (above large breakpoint) /\n @Prop({ reflect: true }) sizeLarge: StzhLinkSize;\n\n /* Size variant (above ultra breakpoint) /\n @Prop({ reflect: true }) sizeUltra: StzhLinkSize;\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\" \| \"back\" = \"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: StzhBadgeType = \"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 /* ID of link element /\n @Prop() linkId: 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 /* Aria current of link/button /\n @Prop({ attribute: \"a11y-current\" }) a11yCurrent: 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 /* Click event /\n @Event() stzhClick: EventEmitter<StzhLinkClickEvent>;\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 async componentWillLoad() {\n if (!this.localization) {\n this.localization = await window.stzhComponents.utils.fetchTranslations(this.element, \"link\");\n }\n }\n\n private onRootFocus = () => {\n if (!this.focusedByInput) {\n this.link.focus();\n }\n\n this.focusedByInput = false;\n };\n\n private onFocus = (event: FocusEvent) => {\n this.focusedByInput = true;\n\n const focusEvent = new FocusEvent(\"focus\", {\n view: window,\n bubbles: false,\n cancelable: false,\n });\n\n this.element.dispatchEvent(focusEvent);\n this.stzhFocus.emit({\n component: \"stzh-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 onClick = (event: MouseEvent) => {\n this.stzhClick.emit({\n component: \"stzh-link\",\n originalEvent: event,\n href: this.href,\n });\n };\n\n private addWordBreakToLinks() {\n const links = Array.from(this.element?.getElementsByClassName(\"stzh-link\") \|\| []);\n addWordBreakToLinks(links as HTMLElement[]);\n }\n\n private renderIcon(): HTMLInputElement {\n return (\n <div class=\"stzh-link__icon-wrapper\">\n {this.icon ? <stzh-icon class=\"stzh-link__icon\" name={this.icon}></stzh-icon> : <slot name=\"icon\"></slot>}\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\") && (\n <div class=\"stzh-link__vhidden\">{this.localization.$globals.externalLinkLabel}</div>\n )}\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 componentDidLoad() {\n this.addWordBreakToLinks();\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--${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 id={this.linkId}\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\" ? (this.a11yDisabled ? \"true\" : \"false\") : null}\n aria-expanded={typeof this.a11yExpanded !== \"undefined\" ? (this.a11yExpanded ? \"true\" : \"false\") : null}\n aria-controls={this.a11yControls \|\| null}\n aria-current={this.a11yCurrent \|\| null}\n onClick={this.onClick}\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 id={this.linkId}\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\" ? (this.a11yDisabled ? \"true\" : \"false\") : null}\n aria-expanded={typeof this.a11yExpanded !== \"undefined\" ? (this.a11yExpanded ? \"true\" : \"false\") : null}\n aria-controls={this.a11yControls \|\| null}\n aria-current={this.a11yCurrent \|\| null}\n onClick={this.onClick}\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":"p-2d80d228.js","mappings":"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","names":[],"sources":["src/components/stzh-link/stzh-link.scss?tag=stzh-link&encapsulation=scoped","src/components/stzh-link/stzh-link.tsx"],"sourcesContent":["/*\n @prop --color: Color of link\n * @prop --hover-color: Hover color of link\n * @prop --text-decoration-line: Text decoration of link\n * @prop --hover-text-decoration-line: Hover text decoration of link\n * @prop --icon-size: Size of icon next to link\n * @prop --min-height: Min height of link\n \n @prop --stzh-link-color: Global: Color of link\n * @prop --stzh-link-hover-color: Global: Hover color of link\n * @prop --stzh-link-text-decoration-line: Global: Text decoration of link\n * @prop --stzh-link-hover-text-decoration-line: Global: Text decoration of link\n * @prop --stzh-link-icon-size: Global: Size of icon next to link\n * @prop --stzh-link-text-decoration-thickness: Global: Text decoration thickness\n * @prop --stzh-link-text-decoration-skip-ink: Global: Whether to skip ink in text decoration\n * @prop --stzh-link-text-underline-offset: Global: Text underline offset\n /\n\n@mixin link--size-default() {\n --font-size: var(--stzh-font-milli-font-size);\n --line-height: var(--stzh-font-milli-text-line-height);\n --letter-spacing: normal;\n\n @include mq($from: medium) {\n --font-size: var(--stzh-font-centi-font-size);\n --line-height: var(--stzh-font-centi-text-line-height);\n --letter-spacing: normal;\n }\n}\n\n@mixin link--size-small() {\n --font-size: var(--stzh-font-micro-font-size);\n --line-height: var(--stzh-font-micro-text-line-height);\n --letter-spacing: normal;\n}\n\n@mixin link--size-inherit() {\n --font-size: inherit;\n --line-height: inherit;\n --letter-spacing: inherit;\n}\n\n:host {\n @include link--size-default;\n --color: #{$linkColor};\n --text-decoration-line: #{$linkTextDecorationLine};\n --icon-wrapper-height: #{$linkIconWrapperHeight};\n --icon-size: #{$linkIconSize};\n --height: var(--stzh-link-height, 40px);\n\n --hover-color: #{$linkHoverColor};\n --hover-text-decoration-line: #{$linkHoverTextDecorationLine};\n\n @include mq($from: medium) {\n --height: var(--stzh-link-height, auto);\n }\n\n color: var(--color);\n display: inline-grid;\n width: auto;\n min-height: var(--height);\n pointer-events: var(--stzh-link-pointer-events, auto);\n\n &[height=\"auto\"] {\n --height: var(--stzh-link-auto-height, auto);\n }\n\n &[fullwidth]:not([fullwidth=\"false\"]) {\n width: 100%;\n display: grid;\n }\n\n &[variant=\"secondary\"] {\n --color: #{$linkSecondaryColor};\n --hover-color: #{$linkSecondaryHoverColor};\n }\n\n &[variant=\"back\"] {\n --text-decoration-line: none;\n --hover-color: var(--color);\n }\n\n &[active]:not([active=\"false\"]) {\n --color: var(--hover-color);\n }\n\n &[disabled]:not([disabled=\"false\"]) {\n --color: #{$colorGrey60};\n --hover-color: #{$colorGrey60};\n }\n}\n\n:host(:where([size=\"small\"])) {\n @include link--size-small;\n}\n\n:host(:where([size=\"inherit\"])) {\n @include link--size-inherit;\n}\n\n//@each $breakpoint, $size in $breakpoints {\n// @include mq($from: $breakpoint) {\n// :host(:where([size-#{$breakpoint}=\"default\"])) {\n// @include link--size-default;\n// }\n//\n// :host(:where([size-#{$breakpoint}=\"small\"])) {\n// @include link--size-small;\n// }\n//\n// :host(:where([size-#{$breakpoint}=\"inherit\"])) {\n// @include link--size-inherit;\n// }\n// }\n//}\n\n.stzh-link {\n font-size: var(--font-size);\n line-height: var(--line-height);\n letter-spacing: var(--letter-spacing);\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 @media (hover: none) {\n color: inherit;\n }\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 --stzh-icon-size: var(--icon-size);\n\n display: none;\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 --stzh-base-color: initial;\n\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 &--has-icon &__icon-wrapper {\n display: inline-flex;\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\n &__icon-wrapper\n + &__text:not(:empty) {\n margin-left: space(\"small\");\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 { Component, Host, Fragment, Element, h, Prop, Event, EventEmitter } from \"@stencil/core\";\n\nimport { StzhLinkFocusEvent, StzhLinkBlurEvent, StzhLinkSize, StzhBadgeType, StzhLinkClickEvent } from \"../../index\";\n\nimport { StzhLinkLocalizedText } from \"./stzh-link.localization\";\nimport { hasSlot, addWordBreakToLinks } from \"../../utils/utils\";\n\n/\n @slot icon - Slot for icon element\n * @slot - Slot for label/text content\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: StzhLinkLocalizedText;\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 /* Height variant (none prevent setting min-height for mikro and small breakpoint) /\n @Prop({ reflect: true }) height: \"default\" \| \"auto\" = \"default\";\n\n /* Size variant /\n @Prop({ reflect: true }) size: StzhLinkSize = \"default\";\n\n /* Size variant (above small breakpoint) /\n @Prop({ reflect: true }) sizeSmall: StzhLinkSize;\n\n /* Size variant (above medium breakpoint) /\n @Prop({ reflect: true }) sizeMedium: StzhLinkSize;\n\n /* Size variant (above large breakpoint) /\n @Prop({ reflect: true }) sizeLarge: StzhLinkSize;\n\n /* Size variant (above ultra breakpoint) /\n @Prop({ reflect: true }) sizeUltra: StzhLinkSize;\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\" \| \"back\" = \"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: StzhBadgeType = \"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 /* ID of link element /\n @Prop() linkId: 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 /* Aria current of link/button /\n @Prop({ attribute: \"a11y-current\" }) a11yCurrent: 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 /* Click event /\n @Event() stzhClick: EventEmitter<StzhLinkClickEvent>;\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 async componentWillLoad() {\n if (!this.localization) {\n this.localization = await window.stzhComponents.utils.fetchTranslations(this.element, \"link\");\n }\n }\n\n private onRootFocus = () => {\n if (!this.focusedByInput) {\n this.link.focus();\n }\n\n this.focusedByInput = false;\n };\n\n private onFocus = (event: FocusEvent) => {\n this.focusedByInput = true;\n\n const focusEvent = new FocusEvent(\"focus\", {\n view: window,\n bubbles: false,\n cancelable: false,\n });\n\n this.element.dispatchEvent(focusEvent);\n this.stzhFocus.emit({\n component: \"stzh-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 onClick = (event: MouseEvent) => {\n this.stzhClick.emit({\n component: \"stzh-link\",\n originalEvent: event,\n href: this.href,\n });\n };\n\n private addWordBreakToLinks() {\n const links = Array.from(this.element?.getElementsByClassName(\"stzh-link\") \|\| []);\n addWordBreakToLinks(links as HTMLElement[]);\n }\n\n private renderIcon(): HTMLInputElement {\n return (\n <div class=\"stzh-link__icon-wrapper\">\n {this.icon ? <stzh-icon class=\"stzh-link__icon\" name={this.icon}></stzh-icon> : <slot name=\"icon\"></slot>}\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\") && (\n <div class=\"stzh-link__vhidden\">{this.localization.$globals.externalLinkLabel}</div>\n )}\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 componentDidLoad() {\n this.addWordBreakToLinks();\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--${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 id={this.linkId}\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\" ? (this.a11yDisabled ? \"true\" : \"false\") : null}\n aria-expanded={typeof this.a11yExpanded !== \"undefined\" ? (this.a11yExpanded ? \"true\" : \"false\") : null}\n aria-controls={this.a11yControls \|\| null}\n aria-current={this.a11yCurrent \|\| null}\n onClick={this.onClick}\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 id={this.linkId}\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\" ? (this.a11yDisabled ? \"true\" : \"false\") : null}\n aria-expanded={typeof this.a11yExpanded !== \"undefined\" ? (this.a11yExpanded ? \"true\" : \"false\") : null}\n aria-controls={this.a11yControls \|\| null}\n aria-current={this.a11yCurrent \|\| null}\n onClick={this.onClick}\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/components/{p-c2d36658.js → p-31a89409.js} RENAMED Viewed

@@ -1,14 +1,14 @@
 import { p as proxyCustomElement, H, c as createEvent, f as forceUpdate, h, F as Fragment, d as Host } from './p-8f01554b.js';
 import { s as setPropsIfNull, h as hasSlot } from './p-289f5de2.js';
-import { d as defineCustomElement$9 } from './p-f1e6bceb.js';
-import { d as defineCustomElement$8 } from './p-42e86bbd.js';
-import { d as defineCustomElement$7 } from './p-b84d0233.js';
-import { d as defineCustomElement$6 } from './p-a2659715.js';
-import { d as defineCustomElement$5 } from './p-4c4a22d3.js';
-import { d as defineCustomElement$4 } from './p-b35195c8.js';
-import { d as defineCustomElement$3 } from './p-7121e1bf.js';
-import { d as defineCustomElement$2 } from './p-8faab692.js';
-import { d as defineCustomElement$1 } from './p-905447b5.js';
+import { d as defineCustomElement$9 } from './p-2c27e000.js';
+import { d as defineCustomElement$8 } from './p-b8fda153.js';
+import { d as defineCustomElement$7 } from './p-ec5e2f2a.js';
+import { d as defineCustomElement$6 } from './p-60d4ef07.js';
+import { d as defineCustomElement$5 } from './p-5519805a.js';
+import { d as defineCustomElement$4 } from './p-5c7c4130.js';
+import { d as defineCustomElement$3 } from './p-472ab25f.js';
+import { d as defineCustomElement$2 } from './p-519479b8.js';
+import { d as defineCustomElement$1 } from './p-ef7cf99a.js';
 const stzhCardCss = ".sc-stzh-card-h{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);color:var(--stzh-base-color);box-sizing:border-box;display:block}[hidden].sc-stzh-card-h,[stzh-hidden].sc-stzh-card-h{display:none}.sc-stzh-card-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-card-h *.sc-stzh-card,.sc-stzh-card-h *.sc-stzh-card::before,.sc-stzh-card-h *.sc-stzh-card::after{box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness);-webkit-text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink);text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink)}.sc-stzh-card-h .has-focus.sc-stzh-card{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-card-h .stzh-fylingfocus-focused.sc-stzh-card{outline-style:none !important}.sc-stzh-card-h .stzh-fylingfocus-focused.sc-stzh-card::-moz-focus-inner{border:0 !important}.sc-stzh-card-h{--border-radius:0px;--content-min-height:7.5rem;--dnd-visibility:hidden;--dnd-opacity:0;display:flex;flex-direction:column;position:relative;border-radius:var(--border-radius)}@media print{.sc-stzh-card-h{page-break-inside:avoid;break-inside:avoid}}[collapsed].sc-stzh-card-h:not([collapsed=false]){--content-min-height:none}[checked].sc-stzh-card-h:not([checked=false]){outline:0.1875rem solid var(--stzh-color-primary)}.is-ghost.sc-stzh-card-h::after,.is-ghost .sc-stzh-card-h::after{border-radius:var(--border-radius)}.is-ghost.sc-stzh-card-h,.is-ghost .sc-stzh-card-h{overflow:hidden}.is-drag.sc-stzh-card-h,.is-chosen.sc-stzh-card-h,.is-ghost.sc-stzh-card-h,.is-selected.sc-stzh-card-h,.is-drag .sc-stzh-card-h,.is-chosen .sc-stzh-card-h,.is-ghost .sc-stzh-card-h,.is-selected .sc-stzh-card-h,[is-sortable].sc-stzh-card-h:hover{--dnd-visibility:visible;--dnd-opacity:1}.sc-stzh-card-h.sc-stzh-card-s>[slot=image],.sc-stzh-card-h .sc-stzh-card-s>[slot=image]{width:100%;max-width:100%}.sc-stzh-card-h.sc-stzh-card-s>img[slot=image],.sc-stzh-card-h .sc-stzh-card-s>img[slot=image]{display:block}.sc-stzh-card-h.sc-stzh-card-s>table,.sc-stzh-card-h .sc-stzh-card-s>table{border:0;border-spacing:0}.sc-stzh-card-h.sc-stzh-card-s>table,.sc-stzh-card-h.sc-stzh-card-s>table th,.sc-stzh-card-h .sc-stzh-card-s>table th{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium)}.sc-stzh-card-h.sc-stzh-card-s>table,.sc-stzh-card-h.sc-stzh-card-s>table td,.sc-stzh-card-h .sc-stzh-card-s>table td,.sc-stzh-card-h.sc-stzh-card-s>table th,.sc-stzh-card-h .sc-stzh-card-s>table th{padding:0}.sc-stzh-card-h.sc-stzh-card-s>table,.sc-stzh-card-h.sc-stzh-card-s>table td,.sc-stzh-card-h .sc-stzh-card-s>table td{color:var(--stzh-color-black);padding-left:var(--stzh-space-xsmall)}.stzh-card.sc-stzh-card{flex-grow:1;display:flex;flex-direction:column;background-color:var(--stzh-color-grey10);border-radius:var(--border-radius)}.stzh-card--background-grey.sc-stzh-card{background-color:var(--stzh-color-grey10)}.stzh-card--background-white.sc-stzh-card{background-color:var(--stzh-color-white)}.stzh-card--background-grey.sc-stzh-card .stzh-card__card-action-popover.sc-stzh-card{--stzh-popover-background:var(--stzh-color-grey20);--stzh-popover-item-hover-bg:var(--stzh-color-grey30)}.stzh-card__content-wrapper.sc-stzh-card{position:relative;flex-grow:1;display:flex;flex-direction:column;min-height:var(--content-min-height)}.stzh-card__dnd.sc-stzh-card{--size:var(--stzh-icon-size-xsmall);position:absolute;left:0.1875rem;top:1.4375rem;display:flex;visibility:var(--dnd-visibility);opacity:var(--dnd-opacity);transition:all var(--stzh-base-transition-animation-speed);display:none}@media screen and (min-width: 900px){.stzh-card__dnd.sc-stzh-card{display:block}}@media screen and (min-width: 1260px){.stzh-card__dnd.sc-stzh-card{left:0.25rem;top:1.6875rem}}.stzh-card__header-top.sc-stzh-card{display:flex;justify-content:space-between;align-items:flex-start}.stzh-card__header-meta.sc-stzh-card:not(:empty){display:inline-flex;margin-top:var(--stzh-space-xsmall);gap:var(--stzh-space-xsmall)}.stzh-card__header-left.sc-stzh-card,.stzh-card__header-right.sc-stzh-card{display:flex}.stzh-card__header-right.sc-stzh-card{padding-left:var(--stzh-space-xxsmall)}@media screen and (min-width: 900px){.stzh-card__header-right.sc-stzh-card{padding-left:var(--stzh-space-xsmall)}}@media screen and (min-width: 1260px){.stzh-card__header-right.sc-stzh-card{padding-left:var(--stzh-space-small)}}.stzh-card__left.sc-stzh-card{align-self:center}.stzh-card__title-area.sc-stzh-card{overflow-wrap:break-word;word-wrap:break-word;word-break:break-word;hyphens:auto;overflow:hidden}.stzh-card__title.sc-stzh-card,.stzh-card__subtitle.sc-stzh-card{margin:0}.stzh-card__title-link.sc-stzh-card{color:inherit;-webkit-text-decoration-line:none;text-decoration-line:none}.stzh-card__title.sc-stzh-card{font-family:var(--stzh-font-family-title);font-weight:var(--stzh-font-weight-title);font-style:var(--stzh-font-style-title);font-size:var(--stzh-font-milli-font-size);line-height:var(--stzh-font-milli-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}.stzh-card__image-link.sc-stzh-card{display:block}.stzh-card__subtitle.sc-stzh-card{font-size:var(--stzh-font-milli-font-size);line-height:var(--stzh-font-milli-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing);display:flex;align-items:center;flex-wrap:wrap;-webkit-text-decoration-line:none;text-decoration-line:none;margin-left:-0.5625em}.stzh-card__subtitle-text.sc-stzh-card{position:relative;display:inline-flex;padding-left:0.5625em}.stzh-card__subtitle-text.sc-stzh-card::after{content:\",\";position:absolute;left:0}.stzh-card__content.sc-stzh-card{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);flex-grow:1}.stzh-card__card-actions.sc-stzh-card{display:inline-flex;white-space:nowrap}@media screen and (max-width: 899px){.stzh-card__card-action.sc-stzh-card{--icon-text-margin:0px;--badge-icon-text-margin:0px}}.stzh-card__card-action[variant=tertiary].sc-stzh-card{--color:var(--stzh-base-color)}.stzh-card__card-action.is-button.sc-stzh-card{--icon-size:var(--stzh-icon-size-small)}.stzh-card__card-action.is-placeholder.sc-stzh-card{width:var(--stzh-space-xxlarge);height:var(--stzh-space-xxlarge)}.stzh-card__card-action-popover.sc-stzh-card{--width:auto}.stzh-card--service.sc-stzh-card .stzh-card__subtitle.sc-stzh-card{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: 900px){.stzh-card--service.sc-stzh-card .stzh-card__subtitle.sc-stzh-card{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-card--service.sc-stzh-card .stzh-card__subtitle.sc-stzh-card{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: 900px){.stzh-card--service.sc-stzh-card .stzh-card__subtitle.sc-stzh-card{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-card--service.sc-stzh-card .stzh-card__title.sc-stzh-card{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){.stzh-card--service.sc-stzh-card .stzh-card__title.sc-stzh-card{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: 900px){.stzh-card--service.sc-stzh-card .stzh-card__title.sc-stzh-card{font-size:var(--stzh-font-curve-h3-medium-font-size, var(--stzh-font-deca-font-size));line-height:var(--stzh-font-curve-h3-medium-heading-line-height, var(--stzh-font-deca-text-line-height));letter-spacing:var(--stzh-font-curve-h3-medium-heading-letter-spacing, var(--stzh-font-deca-text-letter-spacing))}}@media screen and (min-width: 1600px){.stzh-card--service.sc-stzh-card .stzh-card__title.sc-stzh-card{font-size:var(--stzh-font-curve-h3-ultra-font-size, var(--stzh-font-hecto-font-size));line-height:var(--stzh-font-curve-h3-ultra-heading-line-height, var(--stzh-font-hecto-text-line-height));letter-spacing:var(--stzh-font-curve-h3-ultra-heading-letter-spacing, var(--stzh-font-hecto-text-letter-spacing))}}.stzh-card--has-content.sc-stzh-card .stzh-card__content.sc-stzh-card{padding-bottom:var(--stzh-space-xxlarge);padding-top:var(--stzh-space-xlarge);padding-left:var(--stzh-space-xlarge);padding-right:var(--stzh-space-medium)}@media screen and (min-width: 900px){.stzh-card--has-content.sc-stzh-card .stzh-card__content.sc-stzh-card{padding-bottom:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){.stzh-card--has-content.sc-stzh-card .stzh-card__content.sc-stzh-card{padding-bottom:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 900px){.stzh-card--has-content.sc-stzh-card .stzh-card__content.sc-stzh-card{padding-bottom:var(--stzh-space-large)}}@media screen and (min-width: 900px) and (min-width: 600px){.stzh-card--has-content.sc-stzh-card .stzh-card__content.sc-stzh-card{padding-bottom:var(--stzh-space-xlarge)}}@media screen and (min-width: 900px) and (min-width: 900px){.stzh-card--has-content.sc-stzh-card .stzh-card__content.sc-stzh-card{padding-bottom:var(--stzh-space-xxlarge)}}@media screen and (min-width: 900px) and (min-width: 1260px){.stzh-card--has-content.sc-stzh-card .stzh-card__content.sc-stzh-card{padding-bottom:var(--stzh-space-xxxlarge)}}.stzh-card--has-content.stzh-card--service.sc-stzh-card .stzh-card__content.sc-stzh-card{padding:var(--stzh-space-medium)}@media screen and (min-width: 600px){.stzh-card--has-content.stzh-card--service.sc-stzh-card .stzh-card__content.sc-stzh-card{padding:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-card--has-content.stzh-card--service.sc-stzh-card .stzh-card__content.sc-stzh-card{padding:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-card--has-content.stzh-card--service.sc-stzh-card .stzh-card__content.sc-stzh-card{padding:var(--stzh-space-xxlarge)}}.stzh-card--has-header.sc-stzh-card .stzh-card__header.sc-stzh-card{padding-top:var(--stzh-space-xlarge);padding-left:var(--stzh-space-xlarge);padding-right:var(--stzh-space-medium)}.stzh-card--has-header.stzh-card--has-content.sc-stzh-card .stzh-card__content.sc-stzh-card{padding-top:var(--stzh-space-xsmall)}.stzh-card--has-header.stzh-card--service.sc-stzh-card .stzh-card__header.sc-stzh-card{padding-top:var(--stzh-space-medium);padding-left:var(--stzh-space-medium);padding-right:var(--stzh-space-medium)}@media screen and (min-width: 600px){.stzh-card--has-header.stzh-card--service.sc-stzh-card .stzh-card__header.sc-stzh-card{padding-top:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-card--has-header.stzh-card--service.sc-stzh-card .stzh-card__header.sc-stzh-card{padding-top:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-card--has-header.stzh-card--service.sc-stzh-card .stzh-card__header.sc-stzh-card{padding-top:var(--stzh-space-xxlarge)}}@media screen and (min-width: 600px){.stzh-card--has-header.stzh-card--service.sc-stzh-card .stzh-card__header.sc-stzh-card{padding-left:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-card--has-header.stzh-card--service.sc-stzh-card .stzh-card__header.sc-stzh-card{padding-left:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-card--has-header.stzh-card--service.sc-stzh-card .stzh-card__header.sc-stzh-card{padding-left:var(--stzh-space-xxlarge)}}@media screen and (min-width: 600px){.stzh-card--has-header.stzh-card--service.sc-stzh-card .stzh-card__header.sc-stzh-card{padding-right:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-card--has-header.stzh-card--service.sc-stzh-card .stzh-card__header.sc-stzh-card{padding-right:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-card--has-header.stzh-card--service.sc-stzh-card .stzh-card__header.sc-stzh-card{padding-right:var(--stzh-space-xxlarge)}}.stzh-card--has-header.stzh-card--has-content.stzh-card--service.sc-stzh-card .stzh-card__content.sc-stzh-card{padding-top:var(--stzh-space-medium)}@media screen and (min-width: 600px){.stzh-card--has-header.stzh-card--has-content.stzh-card--service.sc-stzh-card .stzh-card__content.sc-stzh-card{padding-top:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-card--has-header.stzh-card--has-content.stzh-card--service.sc-stzh-card .stzh-card__content.sc-stzh-card{padding-top:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-card--has-header.stzh-card--has-content.stzh-card--service.sc-stzh-card .stzh-card__content.sc-stzh-card{padding-top:var(--stzh-space-xxlarge)}}.stzh-card--has-footer.sc-stzh-card .stzh-card__footer.sc-stzh-card{padding-bottom:var(--stzh-space-large);padding-left:var(--stzh-space-xlarge);padding-right:var(--stzh-space-medium)}@media screen and (min-width: 600px){.stzh-card--has-footer.sc-stzh-card .stzh-card__footer.sc-stzh-card{padding-bottom:var(--stzh-space-xlarge)}}@media screen and (min-width: 900px){.stzh-card--has-footer.sc-stzh-card .stzh-card__footer.sc-stzh-card{padding-bottom:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){.stzh-card--has-footer.sc-stzh-card .stzh-card__footer.sc-stzh-card{padding-bottom:var(--stzh-space-xxxlarge)}}.stzh-card--has-footer.stzh-card--has-content.sc-stzh-card .stzh-card__content.sc-stzh-card{padding-bottom:var(--stzh-space-medium)}.stzh-card--has-footer.stzh-card--service.sc-stzh-card .stzh-card__footer.sc-stzh-card{padding-bottom:var(--stzh-space-medium);padding-left:var(--stzh-space-medium);padding-right:var(--stzh-space-medium)}@media screen and (min-width: 600px){.stzh-card--has-footer.stzh-card--service.sc-stzh-card .stzh-card__footer.sc-stzh-card{padding-bottom:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-card--has-footer.stzh-card--service.sc-stzh-card .stzh-card__footer.sc-stzh-card{padding-bottom:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-card--has-footer.stzh-card--service.sc-stzh-card .stzh-card__footer.sc-stzh-card{padding-bottom:var(--stzh-space-xxlarge)}}@media screen and (min-width: 600px){.stzh-card--has-footer.stzh-card--service.sc-stzh-card .stzh-card__footer.sc-stzh-card{padding-left:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-card--has-footer.stzh-card--service.sc-stzh-card .stzh-card__footer.sc-stzh-card{padding-left:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-card--has-footer.stzh-card--service.sc-stzh-card .stzh-card__footer.sc-stzh-card{padding-left:var(--stzh-space-xxlarge)}}@media screen and (min-width: 600px){.stzh-card--has-footer.stzh-card--service.sc-stzh-card .stzh-card__footer.sc-stzh-card{padding-right:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-card--has-footer.stzh-card--service.sc-stzh-card .stzh-card__footer.sc-stzh-card{padding-right:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-card--has-footer.stzh-card--service.sc-stzh-card .stzh-card__footer.sc-stzh-card{padding-right:var(--stzh-space-xxlarge)}}.stzh-card--has-footer.stzh-card--has-content.stzh-card--service.sc-stzh-card .stzh-card__content.sc-stzh-card{padding-bottom:var(--stzh-space-medium)}@media screen and (min-width: 600px){.stzh-card--has-footer.stzh-card--has-content.stzh-card--service.sc-stzh-card .stzh-card__content.sc-stzh-card{padding-bottom:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-card--has-footer.stzh-card--has-content.stzh-card--service.sc-stzh-card .stzh-card__content.sc-stzh-card{padding-bottom:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-card--has-footer.stzh-card--has-content.stzh-card--service.sc-stzh-card .stzh-card__content.sc-stzh-card{padding-bottom:var(--stzh-space-xxlarge)}}.stzh-card--has-tag.stzh-card--has-header.sc-stzh-card .stzh-card__header.sc-stzh-card{padding-top:var(--stzh-space-xxxlarge)}.stzh-card--has-link.sc-stzh-card .stzh-card__title-link.sc-stzh-card,.stzh-card--has-link.sc-stzh-card .stzh-card__content.sc-stzh-card{transition:color var(--stzh-base-transition-animation-speed)}.stzh-card--has-link.sc-stzh-card .stzh-card__title-link.sc-stzh-card{color:var(--stzh-color-primary);-webkit-text-decoration-line:none;text-decoration-line:none;border-radius:var(--stzh-button-border-radius);cursor:pointer}.stzh-card--has-link.sc-stzh-card .stzh-card__title-link.sc-stzh-card::before,.stzh-card--has-link.sc-stzh-card .stzh-card__title-link.sc-stzh-card::after{content:\"\";display:block;position:absolute;top:0;left:0;width:100%;height:100%}.stzh-card--has-link.sc-stzh-card .stzh-card__header-meta.sc-stzh-card,.stzh-card--has-link.sc-stzh-card .stzh-card__footer-actionset.sc-stzh-card,.stzh-card--has-link.sc-stzh-card .stzh-card__footer-select-button.sc-stzh-card{position:relative;z-index:2}.stzh-card--has-link.sc-stzh-card:has(.stzh-card__image-link:hover) .stzh-card__title-link.sc-stzh-card,.stzh-card--has-link.sc-stzh-card:has(.stzh-card__image-link:hover) .stzh-card__content.sc-stzh-card,.stzh-card--has-link.sc-stzh-card:has(.stzh-card__title-link:hover) .stzh-card__title-link.sc-stzh-card,.stzh-card--has-link.sc-stzh-card:has(.stzh-card__title-link:hover) .stzh-card__content.sc-stzh-card{color:var(--stzh-color-secondary60)}.stzh-card--has-subtitle-interactive.sc-stzh-card .stzh-card__subtitle.sc-stzh-card{cursor:pointer;font-family:inherit;padding:0;appearance:none;background:none;border:none;transition:color var(--stzh-base-transition-animation-speed);color:var(--stzh-color-primary)}.stzh-card--has-subtitle-interactive.sc-stzh-card .stzh-card__subtitle.sc-stzh-card:hover,.stzh-card--has-subtitle-interactive.sc-stzh-card .stzh-card__subtitle.sc-stzh-card:focus{color:var(--stzh-color-primary-hover)}.stzh-card--is-collapsible.sc-stzh-card .stzh-card__header.sc-stzh-card{cursor:pointer}.stzh-card--is-collapsed.sc-stzh-card .hide-when-collapsed.sc-stzh-card,.stzh-card--has-collapsed-header.sc-stzh-card .stzh-card__header.sc-stzh-card .hide-when-collapsed.sc-stzh-card{display:none}.stzh-card--is-collapsed.sc-stzh-card .stzh-card__header.sc-stzh-card{padding-bottom:var(--stzh-space-xlarge)}.stzh-card--is-collapsed.stzh-card--service.sc-stzh-card .stzh-card__header.sc-stzh-card{padding-bottom:var(--stzh-space-medium)}@media screen and (min-width: 600px){.stzh-card--is-collapsed.stzh-card--service.sc-stzh-card .stzh-card__header.sc-stzh-card{padding-bottom:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-card--is-collapsed.stzh-card--service.sc-stzh-card .stzh-card__header.sc-stzh-card{padding-bottom:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-card--is-collapsed.stzh-card--service.sc-stzh-card .stzh-card__header.sc-stzh-card{padding-bottom:var(--stzh-space-xxlarge)}}.stzh-card--is-collapsed.sc-stzh-card .stzh-card__card-action.sc-stzh-card,.stzh-card--has-collapsed-header.sc-stzh-card .stzh-card__card-action.sc-stzh-card{--icon-text-margin:0px;--badge-icon-text-margin:0px}.stzh-card--is-starred.sc-stzh-card .stzh-card__card-action.is-star.sc-stzh-card{color:var(--stzh-color-primary)}.stzh-card--is-starred.sc-stzh-card .stzh-card__card-action.is-star.sc-stzh-card:hover,.stzh-card--is-starred.sc-stzh-card .stzh-card__card-action.is-star.sc-stzh-card:focus{color:var(--stzh-color-primary-hover)}.stzh-card--hyphens.sc-stzh-card .stzh-card__heading.sc-stzh-card,.stzh-card--hyphens.sc-stzh-card .stzh-card__title.sc-stzh-card{hyphens:auto}.stzh-card__header.sc-stzh-card{position:relative}.stzh-card__badge.sc-stzh-card{position:absolute;left:-0.3125rem;top:-0.3125rem;z-index:1}";
 const StzhCardStyle0 = stzhCardCss;
@@ -301,14 +301,14 @@ const StzhCard = /*@__PURE__*/ proxyCustomElement(class StzhCard extends H {
             [`stzh-card--${this.variant}`]: !!this.variant,
             "stzh-card--hyphens": this.hyphensEnabled,
         };
-        return (h(Host, { key: '1572888deff0cdc23ed21421458869592e83b242', role: "listitem", "aria-label": this.heading, "is-sortable": sortableEnabled }, h("article", { key: '41d64741a737f6440ef4f14ba1563458c64a9f89',
+        return (h(Host, { key: '32f19a2b9b0a59d404915e98b3eb5dc2d5a7effd', role: "listitem", "aria-label": this.heading, "is-sortable": sortableEnabled }, h("article", { key: '7fca998a2cdf67444916543d7596d3816f49dadd',
             // ref={(el) => (this.mainElement = el as HTMLElement)}
-            class: classes, onClick: !this.href ? this.handleCardClick : null }, h("a", { key: '58227bb0b3bb1ccc1e62d69693ee5181ee7e4710', ref: el => (this.imageLinkElement = el), "aria-hidden": "true", tabindex: "-1", class: "stzh-card__image-link", href: (_d = this.href) !== null && _d !== void 0 ? _d : null, target: this.target, onClick: this.href ? this.handleCardClick : null }, h("slot", { key: 'fb029dd333198d02a7912c00cbeb541697894f45', name: "image" })), h("div", { key: '0bf91b735f3300eab9d93ae8708ca4ba570b67ef', class: "stzh-card__content-wrapper" }, h("stzh-icon", { key: '4631088bf33ddcbd2916de4e96b91804c23e366c', class: "stzh-card__dnd", name: "drag" }), h("header", { key: '21cb5bcd361e9a23507ebf5fd1629449537b520d', class: "stzh-card__header", onClick: this.headerClick }, (this.badge || this.badgeEmpty) && (h("stzh-badge", { key: '0bf345168d1dae51b8926fc4ae48cfd3567f0e57', class: "stzh-card__badge", label: this.badge, type: this.badgeType })), h("div", { key: '515e44f8f74694951012d1e588ed52c7d608e66a', class: "stzh-card__header-top" }, h("div", { key: '09639aea50aed0d878e6797831170ef4c274a5b2', class: "stzh-card__header-left" }, h("div", { key: 'efecb89c56301b80e4d02acda3ce66ad06f52d10', class: "stzh-card__title-area" }, hasHeading && (h(Heading, { key: 'e069ccc41979c531c88ed20cab9a298878cc179c', class: "stzh-card__title" }, h("a", { key: '686849f9bb3dc2ea6a276cc3bdbbf2c54366b4b7', ref: el => (this.titleLinkElement = el), class: "stzh-card__title-link", href: (_e = this.href) !== null && _e !== void 0 ? _e : null, target: this.target, onClick: this.href ? this.handleCardClick : null, "aria-describedby": descriptionId }, h("div", { key: '42791028e739b4b8b7004433ab242fc246dae8f3', ref: el => (this.headingTextElement = el) }, this.heading ? this.heading : h("slot", { name: "heading" }))))), h("span", { key: 'b120533300ed723ec033dda8cca857ef3c4d7882', id: descriptionId, hidden: true }, (_f = this.localization) === null || _f === void 0 ? void 0 : _f.clickTitle), this._subtitles.length > 0 && (h(Subtitle, { key: 'd4bee0ad4238b833511a65f00a1f0439acfd7425', class: "stzh-card__subtitle", onClick: this.subtitleClick }, this._subtitles.map(subtitle => (h("span", { class: "stzh-card__subtitle-text" }, subtitle))))))), h("div", { key: '7d8ebcdb9ee82bbe33dbd65d69f090a01cf5c74c', class: "stzh-card__header-right" }, h("div", { key: '40e77cd5a4aa99875c313fa787e3a637582f31bb', class: "stzh-card__card-actions", onClick: e => e.stopPropagation() }, this.starrable && (h("stzh-tooltip", { key: '892240acd426e95dfd674b9a67367b05a0c6ef07' }, h("stzh-button", { key: '8efe0701f02ad6474b5e26ef6ba44ee2c9ae5aa7', class: "stzh-card__card-action is-star", icon: this.starred ? "star-filled" : "star", variant: "tertiary", size: "tiny", iconOnly: true, onClick: this.starToggleClick }), h("div", { key: '61fdbc6110ddad0931e35a10ca79b373284bd1af', slot: "content" }, this.starred ? this.localization.actionRemove : this.localization.actionAdd))), (this._headerActions.length > 0 || this.starrable || sortableActionsEnabled) && (h("stzh-popover", { key: '5a76648a820109e067cdad0ed9a0b197762a9b63', label: this.localization.actionsPopoverLabel, placement: "bottom-end", class: {
+            class: classes, onClick: !this.href ? this.handleCardClick : null }, h("a", { key: 'ad660ab04610f2406794862fd4b2e2cef2f5c5dd', ref: el => (this.imageLinkElement = el), "aria-hidden": "true", tabindex: "-1", class: "stzh-card__image-link", href: (_d = this.href) !== null && _d !== void 0 ? _d : null, target: this.target, onClick: this.href ? this.handleCardClick : null }, h("slot", { key: 'd265dd56a89f9c7d541a220bd8ac6ffbf884547c', name: "image" })), h("div", { key: '7b7d1287e8058dde4680f08c4be1a3a41320d68a', class: "stzh-card__content-wrapper" }, h("stzh-icon", { key: 'a5f90c68a12adea2e9a7b4e8ae3e8517973afc31', class: "stzh-card__dnd", name: "drag" }), h("header", { key: 'f826000ddee9b0dacc7bf3e95052a52dbdbb7776', class: "stzh-card__header", onClick: this.headerClick }, (this.badge || this.badgeEmpty) && (h("stzh-badge", { key: '8205375dde066a4d0d5e520edb3f79f065f96183', class: "stzh-card__badge", label: this.badge, type: this.badgeType })), h("div", { key: '91dee9bdcc4e13e9e49e9252ec9159ffa5b364e6', class: "stzh-card__header-top" }, h("div", { key: '42730ab46b412ed48ae5cb117f65847d83f9ebc8', class: "stzh-card__header-left" }, h("div", { key: 'a03ed1544104f8b53b676aeb5bc90406343bf02c', class: "stzh-card__title-area" }, hasHeading && (h(Heading, { key: 'b25cf4c1d0c3cf32696bcb4869239b580c3ea42a', class: "stzh-card__title" }, h("a", { key: '382c8e68cb57eade1945e50768419a33873e32b7', ref: el => (this.titleLinkElement = el), class: "stzh-card__title-link", href: (_e = this.href) !== null && _e !== void 0 ? _e : null, target: this.target, onClick: this.href ? this.handleCardClick : null, "aria-describedby": descriptionId }, h("div", { key: '3e2f6d1a1ccd0fbeab0ed3da69075aeeb719b92c', ref: el => (this.headingTextElement = el) }, this.heading ? this.heading : h("slot", { name: "heading" }))))), h("span", { key: '5fc0ca3507e67f9f5316130e46c8cb85b7b071b3', id: descriptionId, hidden: true }, (_f = this.localization) === null || _f === void 0 ? void 0 : _f.clickTitle), this._subtitles.length > 0 && (h(Subtitle, { key: '423da1e03bd4f01ec1e927c085a080374ea38f66', class: "stzh-card__subtitle", onClick: this.subtitleClick }, this._subtitles.map(subtitle => (h("span", { class: "stzh-card__subtitle-text" }, subtitle))))))), h("div", { key: '25c3f2f4a920786d3d0645c7d5537660ad2cb308', class: "stzh-card__header-right" }, h("div", { key: 'f4b6571aafc3e0dec662646c801b8ec61fc536f2', class: "stzh-card__card-actions", onClick: e => e.stopPropagation() }, this.starrable && (h("stzh-tooltip", { key: 'e78dfb668bd5938ce15c8a50a2642b77f1204830' }, h("stzh-button", { key: '9055272fcca5f79be01ae484e104831f61443346', class: "stzh-card__card-action is-star", icon: this.starred ? "star-filled" : "star", variant: "tertiary", size: "tiny", iconOnly: true, onClick: this.starToggleClick }), h("div", { key: 'a0ce8435e47c67982bf332e7094ed55b9c2dd257', slot: "content" }, this.starred ? this.localization.actionRemove : this.localization.actionAdd))), (this._headerActions.length > 0 || this.starrable || sortableActionsEnabled) && (h("stzh-popover", { key: '5db6605c91be265a48a1a5b1ce2a3e3b27010899', label: this.localization.actionsPopoverLabel, placement: "bottom-end", class: {
                 "stzh-card__card-action-popover": true,
                 // "hide-medium show-when-collapsed": !this.starrable && !sortableActionsEnabled
-            } }, h("stzh-button", { key: '79a6cf054d07ab7ed8b152da7e30e560fd0dee66', class: "stzh-card__card-action is-further", variant: "tertiary", size: "tiny", icon: "more-vertical", iconOnly: true, badge: this.headerActionsBadge, badgeEmpty: headerActionsWithBadge.length > 0, badgePosition: "icon", badgeType: this.headerActionsBadgeType || ((_g = headerActionsWithBadge[0]) === null || _g === void 0 ? void 0 : _g.badgeType) || "default" }), h("stzh-menu", { key: '502b61374688bc119032a8790ef0cd7cb8c12e57', slot: "content" }, this._headerActions.map(action => (h("stzh-menu-item", { icon: action.icon, badge: action.badge, badgeEmpty: action.badgeEmpty, badgeType: action.badgeType, onClick: (e) => {
+            } }, h("stzh-button", { key: 'da7ab4eb33c8e717ea2e64f0b7d390f4c0c1052b', class: "stzh-card__card-action is-further", variant: "tertiary", size: "tiny", icon: "more-vertical", iconOnly: true, badge: this.headerActionsBadge, badgeEmpty: headerActionsWithBadge.length > 0, badgePosition: "icon", badgeType: this.headerActionsBadgeType || ((_g = headerActionsWithBadge[0]) === null || _g === void 0 ? void 0 : _g.badgeType) || "default" }), h("stzh-menu", { key: '905257e77cebe6763289b268b20372297db3ab35', slot: "content" }, this._headerActions.map(action => (h("stzh-menu-item", { icon: action.icon, badge: action.badge, badgeEmpty: action.badgeEmpty, badgeType: action.badgeType, onClick: (e) => {
                 this.actionClick(e, action);
-            } }, action.label))), sortableActionsEnabled && (h(Fragment, { key: '74dad17d1443dbb00ed137da9b7fe71a18b500fa' }, !isFirstItemInSortable && (h("stzh-menu-item", { key: '0f300c16fa1701b8ec74de55d9640c236e0514ed', icon: "arrow-up", onClick: this.arrowUpClick }, this.localization.actionMoveUp)), !isLastItemInSortable && (h("stzh-menu-item", { key: '1a3c869b187e2f984ebc17cd82ad1efd55841c12', icon: "arrow-down", onClick: this.arrowDownClick }, this.localization.actionMoveDown)))), this.starrable && (h("stzh-menu-item", { key: 'cdbb0c9dde1eac63703a12c3a462a4a02f4a93cc', icon: this.starred ? "star-filled" : "star", onClick: this.starToggleClick }, this.starred ? this.localization.actionRemove : this.localization.actionAdd)))))))), h("div", { key: 'cba6a93e0d933efd81f73071fa884643c4322c67', class: "stzh-card__header-meta" }, h("slot", { key: 'd14fd3456d04e0db8353a87388c0d7a052dc0cc8', name: "meta" }))), h("div", { key: '099c16541db316ab56e01e4f12b2000499836272', class: "stzh-card__content hide-when-collapsed" }, h("slot", { key: '49e90957a96df696cc900f70a7047431bac9e3b5', name: "content" })), h("div", { key: '735acedd93518779ec5072d9c742d7797086ce90', class: "stzh-card__footer hide-when-collapsed" }, h("slot", { key: 'bcf888acf08e0aac57d574f0615ad5b00212558b', name: "footer" }, this._footerActions.length > 0 && (h("stzh-actionset", { key: 'e2b1371966f3bed178ae947dd535347a107b1ed1', class: "stzh-card__footer-actionset", actions: this._footerActions })), this.selectable && (h("stzh-button", { key: '07c75ae6ea0f21c5e6982e1c099c86101ecf5276', class: "stzh-card__footer-select-button", fullwidth: true, type: "radio", variant: "secondary", name: this.name, value: this.value, checked: this.checked, disabled: this.disabled, label: this.localization.select, onStzhChange: this.handleSelectionChange }))))))));
+            } }, action.label))), sortableActionsEnabled && (h(Fragment, { key: '8ef2cae74e377f211ef38e14a47d80a81d28490e' }, !isFirstItemInSortable && (h("stzh-menu-item", { key: 'f6ca25106dd5bc6917d1ee8d03547d502d51708e', icon: "arrow-up", onClick: this.arrowUpClick }, this.localization.actionMoveUp)), !isLastItemInSortable && (h("stzh-menu-item", { key: '99d072f9e427e766a450b44b9dbcc24604ac2bc9', icon: "arrow-down", onClick: this.arrowDownClick }, this.localization.actionMoveDown)))), this.starrable && (h("stzh-menu-item", { key: '6fddcbad714a174a8021a7c3c58ce98eefeb151b', icon: this.starred ? "star-filled" : "star", onClick: this.starToggleClick }, this.starred ? this.localization.actionRemove : this.localization.actionAdd)))))))), h("div", { key: '28564b7c0c1ce48cc517dddf37a5971d447a82d4', class: "stzh-card__header-meta" }, h("slot", { key: '529c9a0bbf832d5db209364372984c38f660554f', name: "meta" }))), h("div", { key: '346bf22c0949d103ea39703e9d41d72a60606e98', class: "stzh-card__content hide-when-collapsed" }, h("slot", { key: '216017c223ec04bb5356efff4a7931f9d4e6f304', name: "content" })), h("div", { key: '781e5a126a1ce00f4233cc07948b0a678a232c3e', class: "stzh-card__footer hide-when-collapsed" }, h("slot", { key: 'bb3d67eeab7d148d224efb705b232f60a59b0497', name: "footer" }, this._footerActions.length > 0 && (h("stzh-actionset", { key: '793543f023b0cfd1c65095377b49d7bf3da5a834', class: "stzh-card__footer-actionset", actions: this._footerActions })), this.selectable && (h("stzh-button", { key: '699e0d125e2b5673b97ce489285032e8a117268f', class: "stzh-card__footer-select-button", fullwidth: true, type: "radio", variant: "secondary", name: this.name, value: this.value, checked: this.checked, disabled: this.disabled, label: this.localization.select, onStzhChange: this.handleSelectionChange }))))))));
     }
     get element() { return this; }
     static get watchers() { return {
@@ -413,4 +413,4 @@ function defineCustomElement() {
 export { StzhCard as S, defineCustomElement as d };
-//# sourceMappingURL=p-c2d36658.js.map
+//# sourceMappingURL=p-31a89409.js.map

package/dist/components/{p-c2d36658.js.map → p-31a89409.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-c2d36658.js","mappings":"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","names":[],"sources":["src/components/stzh-card/stzh-card.scss?tag=stzh-card&encapsulation=scoped","src/components/stzh-card/stzh-card.tsx"],"sourcesContent":["/*\n @prop --content-min-height: Min height of content\n /\n\n:host {\n // --box-shadow: none;\n --border-radius: 0px;\n\n --content-min-height: 120px;\n\n --dnd-visibility: hidden;\n --dnd-opacity: 0;\n\n display: flex;\n flex-direction: column;\n position: relative;\n border-radius: var(--border-radius);\n\n @media print {\n page-break-inside: avoid;\n break-inside: avoid;\n }\n\n &[collapsed]:not([collapsed=\"false\"]) {\n --content-min-height: none;\n }\n\n &[checked]:not([checked=\"false\"]) {\n outline: 3px solid $colorPrimary;\n }\n\n &.is-ghost::after,\n .is-ghost &::after {\n border-radius: var(--border-radius);\n }\n\n &[href]:hover,\n &[href]:focus-within,\n &.is-selected,\n &.is-chosen,\n .is-selected &,\n .is-chosen & {\n // --box-shadow: #{$boxShadowOverlay};\n }\n\n &.is-ghost,\n .is-ghost & {\n // --box-shadow: none;\n overflow: hidden;\n }\n\n &.is-drag,\n &.is-chosen,\n &.is-ghost,\n &.is-selected,\n .is-drag &,\n .is-chosen &,\n .is-ghost &,\n .is-selected &,\n &[is-sortable]:hover {\n --dnd-visibility: visible;\n --dnd-opacity: 1;\n }\n\n ::slotted([slot=\"image\"]) {\n width: 100%;\n max-width: 100%;\n }\n\n ::slotted(img[slot=\"image\"]) {\n display: block;\n }\n\n ::slotted(table) {\n border: 0;\n border-spacing: 0;\n\n th {\n @include font;\n }\n\n td,\n th {\n padding: 0;\n }\n\n td {\n color: $colorBlack;\n padding-left: space(\"xsmall\");\n }\n }\n}\n\n.stzh-card {\n flex-grow: 1;\n display: flex;\n flex-direction: column;\n background-color: $colorGrey10;\n border-radius: var(--border-radius);\n // box-shadow: var(--box-shadow);\n // transition: box-shadow $baseTransitionAnimationSpeed;\n\n // .vshow-medium {\n // @include mq($to: medium) {\n // @include visuallyhidden;\n // }\n // }\n\n // .show-medium {\n // @include mq($to: medium) {\n // display: none;\n // }\n // }\n\n // .hide-medium {\n // @include mq($from: medium) {\n // display: none;\n // }\n // }\n\n &--background-grey {\n background-color: $colorGrey10;\n }\n\n &--background-white {\n background-color: $colorWhite;\n }\n\n &--background-grey &__card-action-popover {\n --stzh-popover-background: #{$colorGrey20};\n --stzh-popover-item-hover-bg: #{$colorGrey30};\n }\n\n &__content-wrapper {\n position: relative;\n flex-grow: 1;\n display: flex;\n flex-direction: column;\n min-height: var(--content-min-height);\n }\n\n &__dnd {\n --size: #{iconSize(\"xsmall\")};\n position: absolute;\n // INFO: we don't use space() values here, because we want this element to align with the heading\n left: 3px;\n top: 23px;\n display: flex;\n visibility: var(--dnd-visibility);\n opacity: var(--dnd-opacity);\n transition: all $baseTransitionAnimationSpeed;\n display: none;\n\n @include mq($from: medium) {\n display: block;\n }\n\n @include mq($from: large) {\n // INFO: we don't use space() values here, because we want this element to align with the heading\n left: 4px;\n top: 27px;\n }\n }\n\n &__header-top {\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n }\n\n &__header-meta {\n &:not(:empty) {\n display: inline-flex;\n margin-top: space(\"xsmall\");\n gap: space(\"xsmall\");\n }\n }\n\n &__header-left,\n &__header-right {\n display: flex;\n }\n\n &__header-right {\n @include spaceCurve(\"padding-left\", \"tiny\");\n }\n\n &__left {\n align-self: center;\n }\n\n &__title-area {\n @include wordWrap;\n overflow: hidden;\n }\n\n &__title,\n &__subtitle {\n margin: 0;\n }\n\n &__title-link {\n color: inherit;\n text-decoration-line: none;\n }\n\n &__title {\n @include font(\"title\");\n @include fontSize(\"milli\");\n }\n\n &__image-link {\n display: block;\n }\n\n &__subtitle {\n @include fontSize(\"milli\");\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n text-decoration-line: none;\n // INFO: we don't use space() values here, since we try to mimic the width of a whitespace here\n margin-left: -0.5625em;\n }\n\n &__subtitle-text {\n position: relative;\n display: inline-flex;\n // INFO: we don't use space() values here, since we try to mimic the width of a whitespace here\n padding-left: 0.5625em;\n\n &::after {\n content: \",\";\n position: absolute;\n left: 0;\n }\n }\n\n &__content {\n @include fontSize(\"milli\");\n flex-grow: 1;\n }\n\n // &__footer-meta {\n // @include fontSize('micro');\n // display: flex;\n // flex-wrap: wrap;\n // gap: space('xsmall');\n // color: $colorGrey80;\n // }\n\n // &__footer-meta-separator {\n // width: 1px;\n // background-color: currentColor;\n // flex-shrink: 0;\n // }\n\n &__card-actions {\n display: inline-flex;\n white-space: nowrap;\n }\n\n &__card-action {\n @include mq($to: medium) {\n --icon-text-margin: 0px;\n --badge-icon-text-margin: 0px;\n }\n\n &[variant=\"tertiary\"] {\n --color: #{$baseColor};\n }\n\n &.is-button {\n --icon-size: #{iconSize(\"small\")};\n }\n\n &.is-placeholder {\n width: space(\"xxlarge\");\n height: space(\"xxlarge\");\n }\n\n &.is-star {\n }\n }\n\n &__card-action-popover {\n --width: auto;\n }\n\n / Service /\n\n &--service &__subtitle {\n @include fontCurve(\"p1\");\n }\n\n &--service &__subtitle {\n @include fontCurve(\"p1\");\n }\n\n &--service &__title {\n @include fontCurve(\"h3\", \"heading\");\n }\n\n / Has content /\n\n &--has-content &__content {\n @include spaceCurve(\"padding-bottom\", \"large\");\n padding-top: space(\"xlarge\");\n padding-left: space(\"xlarge\");\n padding-right: space(\"medium\");\n\n @include mq($from: medium) {\n @include spaceCurve(\"padding-bottom\", \"medium\");\n }\n }\n\n &--has-content#{&}--service &__content {\n @include spaceCurve(\"padding\", \"regular\");\n }\n\n / Has header /\n\n &--has-header &__header {\n padding-top: space(\"xlarge\");\n padding-left: space(\"xlarge\");\n padding-right: space(\"medium\");\n }\n\n &--has-header#{&}--has-content &__content {\n padding-top: space(\"xsmall\");\n }\n\n &--has-header#{&}--service &__header {\n @include spaceCurve(\"padding-top\", \"regular\");\n @include spaceCurve(\"padding-left\", \"regular\");\n @include spaceCurve(\"padding-right\", \"regular\");\n }\n\n &--has-header#{&}--has-content#{&}--service &__content {\n @include spaceCurve(\"padding-top\", \"regular\");\n }\n\n / Has footer /\n\n &--has-footer &__footer {\n @include spaceCurve(\"padding-bottom\", \"medium\");\n padding-left: space(\"xlarge\");\n padding-right: space(\"medium\");\n }\n\n &--has-footer#{&}--has-content &__content {\n padding-bottom: space(\"medium\");\n }\n\n &--has-footer#{&}--service &__footer {\n @include spaceCurve(\"padding-bottom\", \"regular\");\n @include spaceCurve(\"padding-left\", \"regular\");\n @include spaceCurve(\"padding-right\", \"regular\");\n }\n\n &--has-footer#{&}--has-content#{&}--service &__content {\n @include spaceCurve(\"padding-bottom\", \"regular\");\n }\n\n / Has tag /\n\n &--has-tag#{&}--has-header &__header {\n padding-top: space(\"xxxlarge\");\n }\n\n / Has Link /\n\n &--has-link &__title-link,\n &--has-link &__content {\n transition: color $baseTransitionAnimationSpeed;\n }\n\n &--has-link &__title-link {\n color: $colorPrimary;\n text-decoration-line: none;\n border-radius: $buttonBorderRadius;\n cursor: pointer;\n\n &::before,\n &::after {\n content: \"\";\n display: block;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n }\n\n // &::before {\n // transition: all $baseTransitionAnimationSpeed;\n // }\n }\n\n &--has-link &__header-meta,\n &--has-link &__footer-actionset,\n &--has-link &__footer-select-button {\n position: relative;\n z-index: 2;\n }\n\n &--has-link:has(#{&}__image-link:hover) &__title-link,\n &--has-link:has(#{&}__image-link:hover) &__content,\n &--has-link:has(#{&}__title-link:hover) &__title-link,\n &--has-link:has(#{&}__title-link:hover) &__content {\n color: $colorSecondary60;\n\n // &::before,\n // &::before {\n // background-color: $colorPrimary20;\n // }\n }\n\n // &__footer-arrow {\n // color: $colorPrimary;\n // }\n\n // &--has-link:hover &__footer-arrow {\n // color: $colorSecondary60;\n // }\n\n / Interactive Subtitle /\n\n &--has-subtitle-interactive &__subtitle {\n cursor: pointer;\n font-family: inherit;\n padding: 0;\n appearance: none;\n background: none;\n border: none;\n transition: color $baseTransitionAnimationSpeed;\n color: $colorPrimary;\n\n &:hover,\n &:focus {\n color: $colorPrimaryHover;\n }\n }\n\n / Is collapsible /\n\n &--is-collapsible &__header {\n cursor: pointer;\n }\n\n / Collapsed (Header) /\n\n &--is-collapsed,\n &--has-collapsed-header &__header {\n // .vhide-when-collapsed {\n // @include visuallyhidden;\n // }\n\n .hide-when-collapsed {\n display: none;\n }\n\n // .show-when-collapsed {\n // display: block;\n // }\n }\n\n &--is-collapsed &__header {\n // border-bottom: none;\n padding-bottom: space(\"xlarge\");\n }\n\n &--is-collapsed#{&}--service &__header {\n // border-bottom: none;\n @include spaceCurve(\"padding-bottom\", \"regular\");\n }\n\n &--is-collapsed &__card-action,\n &--has-collapsed-header &__card-action {\n --icon-text-margin: 0px;\n --badge-icon-text-margin: 0px;\n }\n\n / Starred /\n\n &--is-starred &__card-action.is-star {\n color: $colorPrimary;\n\n &:hover,\n &:focus {\n color: $colorPrimaryHover;\n }\n }\n\n / Hyphens /\n &--hyphens &__heading,\n &--hyphens &__title {\n hyphens: auto;\n }\n}\n\n.stzh-card__header {\n position: relative;\n}\n\n.stzh-card__badge {\n position: absolute;\n left: -5px;\n top: -5px;\n z-index: 1;\n}\n","import { Component, Element, Event, EventEmitter, forceUpdate, Fragment, h, Host, Prop, Watch } from \"@stencil/core\";\n\nimport {\n StzhActionsetItem,\n StzhButtonChangeEvent,\n StzhCardClickEvent,\n StzhCardCollapseEvent,\n StzhCardHeaderAction,\n StzhCardHeaderActionClickEvent,\n StzhCardStarClickEvent,\n StzhCardSubtitleClickEvent,\n StzhBadgeType,\n} from \"../../index\";\n\nimport { hasSlot, setPropsIfNull } from \"../../utils/utils\";\nimport { StzhCardLocalizedText } from \"./stzh-card.localization\";\n\n/\n @slot heading - Slot for heading\n * @slot image - Slot for optional image element\n * @slot content - Slot for content for any elements\n * @slot meta - Slot for meta elements (status or chip)\n * @slot footer - Slot to replace footer content (`footerActions` and `selectable` button are not shown anymore)\n /\n@Component({\n tag: \"stzh-card\",\n styleUrl: \"stzh-card.scss\",\n scoped: true,\n})\nexport class StzhCard {\n /* Translation strings /\n @Prop() localization: StzhCardLocalizedText;\n\n /* Whether background should be grey (default) or white /\n @Prop({ reflect: true }) backgroundColor: \"grey\" \| \"white\" = \"grey\";\n\n /* Variant /\n @Prop({ reflect: true }) variant: \"default\" \| \"service\" = \"default\";\n\n /* Whether card is collapsed or not /\n @Prop({ reflect: true, mutable: true }) collapsed: boolean = false;\n\n /* Whether card was starred /\n @Prop({ reflect: true, mutable: true }) starred: boolean = false;\n\n /\n Whether card star is displayed (with tooltip and menu-item in mobile popover).\n * The tooltip / menu-item text can be adjusted in the translations file (`actionAdd` & `actionRemove`).\n /\n @Prop({ reflect: true }) starrable: boolean = false;\n\n /* Whether card is selectable /\n @Prop({ reflect: true }) selectable: boolean = false;\n\n /* Whether card is checked (if card is selectable) /\n @Prop({ reflect: true }) checked: boolean = false;\n\n /* The name of the input element (if card is selectable) /\n @Prop({ reflect: true }) name: string = \"\";\n\n /* Href of card /\n @Prop({ reflect: true }) href: string;\n\n /* target if the button is used as link (if href used) /\n @Prop() target: string;\n\n /* The value of the input element (if card is selectable) /\n @Prop({ mutable: true }) value: string = \"\";\n\n /* Whether the element is disabled or not (if card is selectable) /\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /* Automatic Hyphens /\n @Prop({ reflect: true }) hyphensEnabled: boolean = false;\n\n /* Heading (or use heading slot instead) /\n @Prop() heading: string = \"\";\n\n /* Heading level /\n @Prop({ reflect: true }) headingLevel: \"1\" \| \"2\" \| \"3\" \| \"4\" = \"3\";\n\n /* Subtitle /\n @Prop() subtitle: string \| string[] = \"\";\n private _subtitles = [];\n\n /* Card header actions /\n @Prop() headerActions: string \| StzhCardHeaderAction[] = [];\n private _headerActions: StzhCardHeaderAction[];\n\n /\n Set a badge text if header action badge exists (see headerActionsBadgeType for more info).\n /\n @Prop() headerActionsBadge: string;\n\n /\n If a header action with a badge exists inside `headerActions`, the more actions popover will automatically have a empty badge.\n * By default, it takes the badge type from the first one. With this property you can overwrite it.\n /\n @Prop() headerActionsBadgeType: \"default\" \| \"success\" \| \"warning\" \| \"error\" \| \"info\";\n\n /\n Card footer actions.\n * The [`stzh-actionset`](?path=/story/components-actionset) component is used internally.\n * You can listen to clicks with the `stzhActionClick` event.\n /\n @Prop() footerActions: string \| StzhActionsetItem[] = [];\n private _footerActions: StzhActionsetItem[];\n\n /* Whether subtitle should be rendered as button and event `stzhSubtitleClick` executed on click /\n @Prop() subtitleInteractive: boolean = false;\n\n /\n Whether sorting should be disabled.\n * Has no effect if card is not inside a `cardlist` element, which has `sortableEnabled` property set to true.\n /\n @Prop({ reflect: true }) sortableDisabled: boolean = false;\n\n /* Whether card is collapsible (only effective if href is not set) /\n @Prop({ reflect: true }) collapsible: boolean = false;\n\n /\n Whether movement menu items should be shown.\n * Has no effect if card is not inside a `cardlist` element, which has `sortableEnabled` property set to true.\n /\n @Prop() hideMovementActions: boolean = false;\n\n /\n For Adobe Analytics.\n * Will be rendered as value of `s-object-id` attribute to the link elements.\n * Default value will be taken from `heading` prop/slot.\n /\n @Prop() analyticsId: string;\n\n /* Badge /\n @Prop() badge: string = \"\";\n \n /* Whether badge should be displayed empty /\n @Prop({ reflect: true }) badgeEmpty: boolean = false;\n \n /* Badge type /\n @Prop({ reflect: true }) badgeType: StzhBadgeType = \"default\";\n\n @Element() element: HTMLStzhCardElement;\n\n /* Click event /\n @Event() stzhClick: EventEmitter<StzhCardClickEvent>;\n\n /* Collapse event /\n @Event() stzhCollapse: EventEmitter<StzhCardCollapseEvent>;\n\n /* Subtitle click event /\n @Event() stzhSubtitleClick: EventEmitter<StzhCardSubtitleClickEvent>;\n\n /* Star click event /\n @Event() stzhStarClick: EventEmitter<StzhCardStarClickEvent>;\n\n /* Header action click event */\n @Event() stzhHeaderActionClick: EventEmitter<StzhCardHeaderActionClickEvent>;\n\n @Watch(\"subtitle\")\n subtitleWatcher(newValue: string[] \| string) {\n if (typeof newValue === \"string\") {\n if (newValue === \"\") {\n this._subtitles = [];\n } else {\n try {\n this._subtitles = JSON.parse(newValue);\n } catch (err) {\n this._subtitles = [newValue];\n }\n }\n } else {\n this._subtitles = newValue;\n }\n }\n\n @Watch(\"headerActions\")\n headerActionsWatcher(newValue: StzhCardHeaderAction[] \| string) {\n if (typeof newValue === \"string\") {\n this._headerActions = JSON.parse(newValue);\n } else {\n this._headerActions = newValue;\n }\n }\n\n @Watch(\"footerActions\")\n footerActionsWatcher(newValue: StzhActionsetItem[] \| string) {\n if (typeof newValue === \"string\") {\n this._footerActions = JSON.parse(newValue);\n } else {\n this._footerActions = newValue;\n }\n }\n\n private observer: MutationObserver;\n\n private nodeChange = entries => {\n let changeInSlot = false;\n\n entries.forEach(entry => {\n if (entry.target.closest(\"[slot]\") \|\| entry.target.hasAttribute(\"slot\")) {\n changeInSlot = true;\n }\n });\n\n if (changeInSlot) {\n forceUpdate(this.element);\n }\n };\n\n private imageLinkElement: HTMLAnchorElement;\n private titleLinkElement: HTMLAnchorElement;\n private headingTextElement: HTMLDivElement;\n private sortable: HTMLStzhSortableElement;\n\n private headerClick = (event: MouseEvent) => {\n if (!this.collapsible) {\n return;\n }\n\n const filterTags = [\n \"stzh-popover\",\n \"stzh-tooltip\",\n \"button\",\n \"stzh-badge\",\n \"a\",\n \"input\",\n \"select\",\n \"textarea\",\n \"iframe\",\n \"details\",\n \"label\",\n \"area\",\n ];\n const composedPathTags = event.composedPath().map(element => (element as HTMLElement).tagName?.toLowerCase());\n const found = composedPathTags.some(r => filterTags.includes(r));\n\n if (!found) {\n this.collapsed = !this.collapsed;\n\n this.stzhCollapse.emit({\n component: \"stzh-card\",\n collapsed: this.collapsed,\n });\n }\n };\n\n private subtitleClick = (event: MouseEvent) => {\n if (this.subtitleInteractive) {\n this.stzhSubtitleClick.emit({\n component: \"stzh-card\",\n originalEvent: event,\n });\n }\n };\n\n private starToggleClick = (event: MouseEvent) => {\n this.starred = !this.starred;\n this.stzhStarClick.emit({\n component: \"stzh-card\",\n starred: this.starred,\n originalEvent: event,\n });\n };\n\n private actionClick = (event: MouseEvent, action: StzhCardHeaderAction) => {\n this.stzhHeaderActionClick.emit({\n component: \"stzh-card\",\n action,\n originalEvent: event,\n });\n };\n\n private arrowUpClick = () => {\n const sortable = this.element.closest(\"stzh-sortable\");\n\n if (sortable) {\n const element = this.findSortableChildElement();\n sortable.moveItem(element, \"up\");\n }\n };\n\n private arrowDownClick = () => {\n const sortable = this.element.closest(\"stzh-sortable\");\n\n if (sortable) {\n const element = this.findSortableChildElement();\n sortable.moveItem(element, \"down\");\n }\n };\n\n private updateElementInsideSortable = () => {\n const currentSortable = this.element.closest(\"stzh-sortable\");\n\n // check if element is still inside sortable\n if (!currentSortable) {\n this.sortable.removeEventListener(\"stzhUpdate\", this.updateElementInsideSortable);\n this.sortable.removeEventListener(\"stzhDisable\", this.updateElementInsideSortable);\n return;\n }\n\n if (this.element) {\n forceUpdate(this.element);\n }\n };\n\n private init = () => {\n const chips = this.element.querySelectorAll('stzh-chip[slot=\"meta\"], [slot=\"meta\"] stzh-chip');\n\n const texts = this.element.querySelectorAll('stzh-text[slot=\"content\"], [slot=\"meta\"] stzh-text');\n\n chips.forEach(chip => {\n setPropsIfNull(chip, {\n size: \"small\",\n } as HTMLStzhChipElement);\n });\n\n texts.forEach(text => {\n setPropsIfNull(text, {\n size: \"inherit\",\n } as HTMLStzhTextElement);\n });\n };\n\n private handleMutation = entries => {\n this.init();\n this.nodeChange(entries);\n };\n\n private handleSelectionChange = (event: CustomEvent<StzhButtonChangeEvent>) => {\n this.checked = event.detail.checked;\n };\n\n private handleCardClick = (originalEvent: MouseEvent) => {\n this.stzhClick.emit({\n component: \"stzh-card\",\n originalEvent,\n ...(this.href ? { href: this.href } : {}),\n });\n };\n\n private findSortableChildElement(): HTMLElement \| undefined {\n const sortable = this.element.closest(\"stzh-sortable\");\n\n if (sortable) {\n let element: HTMLElement = this.element;\n let sortableContainer = null;\n\n if (typeof sortable.container === \"function\") {\n sortableContainer = sortable.container();\n } else {\n sortableContainer = sortable.container;\n }\n\n while (element.parentElement && element.parentElement !== sortableContainer) {\n element = element.parentElement;\n }\n\n return element;\n }\n }\n\n async componentWillLoad() {\n this.subtitleWatcher(this.subtitle);\n this.headerActionsWatcher(this.headerActions);\n this.footerActionsWatcher(this.footerActions);\n\n if (!this.localization) {\n this.localization = await window.stzhComponents.utils.fetchTranslations(this.element, \"card\");\n }\n }\n\n componentDidLoad() {\n this.sortable = this.element.closest(\"stzh-sortable\");\n\n if (this.sortable) {\n this.sortable.addEventListener(\"stzhUpdate\", this.updateElementInsideSortable);\n this.sortable.addEventListener(\"stzhDisable\", this.updateElementInsideSortable);\n }\n }\n\n componentDidRender() {\n requestAnimationFrame(() => {\n const objectId = this.analyticsId \|\| this.headingTextElement?.innerText;\n\n if (objectId) {\n this.imageLinkElement?.setAttribute(\"s-object-id\", objectId);\n this.titleLinkElement?.setAttribute(\"s-object-id\", objectId);\n }\n });\n }\n\n connectedCallback() {\n this.init();\n\n this.observer = new MutationObserver(this.handleMutation);\n this.observer.observe(this.element, {\n childList: true,\n subtree: true,\n });\n }\n\n disconnectedCallback() {\n if (this.observer) {\n this.observer.disconnect();\n }\n }\n\n render() {\n const imageUsed: boolean = hasSlot(this.element, \"image\");\n const headingUsed: boolean = hasSlot(this.element, \"heading\");\n const footerUsed: boolean = hasSlot(this.element, \"footer\");\n const contentUsed: boolean = hasSlot(this.element, \"content\");\n\n const Heading = `h${this.headingLevel}`;\n const Subtitle = `${this.subtitleInteractive ? \"button\" : \"span\"}`;\n\n const sortableChildElement = this.findSortableChildElement();\n\n const isFirstItemInSortable =\n sortableChildElement?.parentElement &&\n Array.from(sortableChildElement?.parentElement?.children).indexOf(sortableChildElement) === 0;\n\n const isLastItemInSortable =\n sortableChildElement?.parentElement &&\n Array.from(sortableChildElement?.parentElement?.children).indexOf(sortableChildElement) ===\n sortableChildElement?.parentElement?.children.length - 1;\n\n const sortableEnabled = !this.sortableDisabled && this.sortable && !this.sortable.disabled;\n const sortableActionsEnabled = sortableEnabled && !this.hideMovementActions;\n\n const hasHeading = !!this.heading \|\| headingUsed;\n\n const hasHeader =\n hasHeading \|\|\n this._subtitles.length > 0 \|\|\n this._headerActions.length > 0 \|\|\n this.starrable \|\|\n sortableActionsEnabled \|\|\n !!this.badge \|\| \n this.badgeEmpty;\n\n const hasFooter = footerUsed \|\| this._footerActions.length > 0 \|\| this.selectable;\n\n const headerActionsWithBadge = this._headerActions.filter(action => !!action.badge \|\| action.badgeEmpty);\n\n const uniqueId = `--is-described-${Math.random().toString(36).slice(2, 9)}`;\n const descriptionId = `stzh-card${uniqueId}`;\n\n const classes = {\n \"stzh-card\": true,\n \"stzh-card--background-grey\": this.backgroundColor === \"grey\",\n \"stzh-card--background-white\": this.backgroundColor === \"white\",\n \"stzh-card--has-link\": !!this.href,\n \"stzh-card--has-image\": imageUsed,\n \"stzh-card--has-content\": contentUsed,\n \"stzh-card--has-subtitle\": !!this.subtitle,\n \"stzh-card--has-subtitle-interactive\": !!this.subtitle && this.subtitleInteractive,\n \"stzh-card--has-header\": hasHeader,\n \"stzh-card--has-footer\": hasFooter,\n \"stzh-card--is-collapsible\": this.collapsible,\n \"stzh-card--is-collapsed\": this.collapsed,\n \"stzh-card--is-starred\": this.starred,\n \"stzh-card--is-checked\": this.checked,\n \"stzh-card--is-sortable\": sortableEnabled,\n [`stzh-card--${this.variant}`]: !!this.variant,\n \"stzh-card--hyphens\": this.hyphensEnabled,\n };\n\n return (\n <Host role=\"listitem\" aria-label={this.heading} is-sortable={sortableEnabled}>\n <article\n // ref={(el) => (this.mainElement = el as HTMLElement)}\n class={classes}\n onClick={!this.href ? this.handleCardClick : null}\n >\n <a\n ref={el => (this.imageLinkElement = el as HTMLAnchorElement)}\n aria-hidden=\"true\"\n tabindex=\"-1\"\n class=\"stzh-card__image-link\"\n href={this.href ?? null}\n target={this.target}\n onClick={this.href ? this.handleCardClick : null}\n >\n <slot name=\"image\"></slot>\n </a>\n <div class=\"stzh-card__content-wrapper\">\n <stzh-icon class=\"stzh-card__dnd\" name=\"drag\"></stzh-icon>\n <header class=\"stzh-card__header\" onClick={this.headerClick}>\n {(this.badge \|\| this.badgeEmpty) && (\n <stzh-badge\n class=\"stzh-card__badge\"\n label={this.badge}\n type={this.badgeType}\n ></stzh-badge>\n )}\n <div class=\"stzh-card__header-top\">\n <div class=\"stzh-card__header-left\">\n <div class=\"stzh-card__title-area\">\n {hasHeading && (\n <Heading class=\"stzh-card__title\">\n <a\n ref={el => (this.titleLinkElement = el as HTMLAnchorElement)}\n class=\"stzh-card__title-link\"\n href={this.href ?? null}\n target={this.target}\n onClick={this.href ? this.handleCardClick : null}\n aria-describedby={descriptionId}\n >\n <div ref={el => (this.headingTextElement = el as HTMLDivElement)}>\n {this.heading ? this.heading : <slot name=\"heading\"></slot>}\n </div>\n </a>\n </Heading>\n )}\n <span id={descriptionId} hidden>\n {this.localization?.clickTitle}\n </span>\n {this._subtitles.length > 0 && (\n <Subtitle class=\"stzh-card__subtitle\" onClick={this.subtitleClick}>\n {this._subtitles.map(subtitle => (\n <span class=\"stzh-card__subtitle-text\">{subtitle}</span>\n ))}\n </Subtitle>\n )}\n </div>\n </div>\n <div class=\"stzh-card__header-right\">\n <div class=\"stzh-card__card-actions\" onClick={e => e.stopPropagation()}>\n {this.starrable && (\n <stzh-tooltip>\n <stzh-button\n class=\"stzh-card__card-action is-star\"\n icon={this.starred ? \"star-filled\" : \"star\"}\n variant=\"tertiary\"\n size=\"tiny\"\n iconOnly={true}\n onClick={this.starToggleClick}\n ></stzh-button>\n <div slot=\"content\">\n {this.starred ? this.localization.actionRemove : this.localization.actionAdd}\n </div>\n </stzh-tooltip>\n )}\n\n {(this._headerActions.length > 0 \|\| this.starrable \|\| sortableActionsEnabled) && (\n <stzh-popover\n label={this.localization.actionsPopoverLabel}\n placement=\"bottom-end\"\n class={{\n \"stzh-card__card-action-popover\": true,\n // \"hide-medium show-when-collapsed\": !this.starrable && !sortableActionsEnabled\n }}\n >\n <stzh-button\n class=\"stzh-card__card-action is-further\"\n variant=\"tertiary\"\n size=\"tiny\"\n icon=\"more-vertical\"\n iconOnly={true}\n badge={this.headerActionsBadge}\n badgeEmpty={headerActionsWithBadge.length > 0}\n badgePosition=\"icon\"\n badgeType={this.headerActionsBadgeType \|\| headerActionsWithBadge[0]?.badgeType \|\| \"default\"}\n ></stzh-button>\n <stzh-menu slot=\"content\">\n {this._headerActions.map(action => (\n <stzh-menu-item\n icon={action.icon}\n badge={action.badge}\n badgeEmpty={action.badgeEmpty}\n badgeType={action.badgeType}\n onClick={(e: MouseEvent) => {\n this.actionClick(e, action);\n }}\n >\n {action.label}\n </stzh-menu-item>\n ))}\n\n {sortableActionsEnabled && (\n <Fragment>\n {!isFirstItemInSortable && (\n <stzh-menu-item icon=\"arrow-up\" onClick={this.arrowUpClick}>\n {this.localization.actionMoveUp}\n </stzh-menu-item>\n )}\n {!isLastItemInSortable && (\n <stzh-menu-item icon=\"arrow-down\" onClick={this.arrowDownClick}>\n {this.localization.actionMoveDown}\n </stzh-menu-item>\n )}\n </Fragment>\n )}\n\n {this.starrable && (\n <stzh-menu-item icon={this.starred ? \"star-filled\" : \"star\"} onClick={this.starToggleClick}>\n {this.starred ? this.localization.actionRemove : this.localization.actionAdd}\n </stzh-menu-item>\n )}\n </stzh-menu>\n </stzh-popover>\n )}\n </div>\n </div>\n </div>\n\n <div class=\"stzh-card__header-meta\">\n <slot name=\"meta\"></slot>\n </div>\n </header>\n\n <div class=\"stzh-card__content hide-when-collapsed\">\n <slot name=\"content\"></slot>\n </div>\n\n <div class=\"stzh-card__footer hide-when-collapsed\">\n <slot name=\"footer\">\n {this._footerActions.length > 0 && (\n <stzh-actionset class=\"stzh-card__footer-actionset\" actions={this._footerActions}></stzh-actionset>\n )}\n\n {this.selectable && (\n <stzh-button\n class=\"stzh-card__footer-select-button\"\n fullwidth\n type=\"radio\"\n variant=\"secondary\"\n name={this.name}\n value={this.value}\n checked={this.checked}\n disabled={this.disabled}\n label={this.localization.select}\n onStzhChange={this.handleSelectionChange}\n ></stzh-button>\n )}\n </slot>\n </div>\n </div>\n </article>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"p-31a89409.js","mappings":"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","names":[],"sources":["src/components/stzh-card/stzh-card.scss?tag=stzh-card&encapsulation=scoped","src/components/stzh-card/stzh-card.tsx"],"sourcesContent":["/*\n @prop --content-min-height: Min height of content\n /\n\n:host {\n // --box-shadow: none;\n --border-radius: 0px;\n\n --content-min-height: 120px;\n\n --dnd-visibility: hidden;\n --dnd-opacity: 0;\n\n display: flex;\n flex-direction: column;\n position: relative;\n border-radius: var(--border-radius);\n\n @media print {\n page-break-inside: avoid;\n break-inside: avoid;\n }\n\n &[collapsed]:not([collapsed=\"false\"]) {\n --content-min-height: none;\n }\n\n &[checked]:not([checked=\"false\"]) {\n outline: 3px solid $colorPrimary;\n }\n\n &.is-ghost::after,\n .is-ghost &::after {\n border-radius: var(--border-radius);\n }\n\n &[href]:hover,\n &[href]:focus-within,\n &.is-selected,\n &.is-chosen,\n .is-selected &,\n .is-chosen & {\n // --box-shadow: #{$boxShadowOverlay};\n }\n\n &.is-ghost,\n .is-ghost & {\n // --box-shadow: none;\n overflow: hidden;\n }\n\n &.is-drag,\n &.is-chosen,\n &.is-ghost,\n &.is-selected,\n .is-drag &,\n .is-chosen &,\n .is-ghost &,\n .is-selected &,\n &[is-sortable]:hover {\n --dnd-visibility: visible;\n --dnd-opacity: 1;\n }\n\n ::slotted([slot=\"image\"]) {\n width: 100%;\n max-width: 100%;\n }\n\n ::slotted(img[slot=\"image\"]) {\n display: block;\n }\n\n ::slotted(table) {\n border: 0;\n border-spacing: 0;\n\n th {\n @include font;\n }\n\n td,\n th {\n padding: 0;\n }\n\n td {\n color: $colorBlack;\n padding-left: space(\"xsmall\");\n }\n }\n}\n\n.stzh-card {\n flex-grow: 1;\n display: flex;\n flex-direction: column;\n background-color: $colorGrey10;\n border-radius: var(--border-radius);\n // box-shadow: var(--box-shadow);\n // transition: box-shadow $baseTransitionAnimationSpeed;\n\n // .vshow-medium {\n // @include mq($to: medium) {\n // @include visuallyhidden;\n // }\n // }\n\n // .show-medium {\n // @include mq($to: medium) {\n // display: none;\n // }\n // }\n\n // .hide-medium {\n // @include mq($from: medium) {\n // display: none;\n // }\n // }\n\n &--background-grey {\n background-color: $colorGrey10;\n }\n\n &--background-white {\n background-color: $colorWhite;\n }\n\n &--background-grey &__card-action-popover {\n --stzh-popover-background: #{$colorGrey20};\n --stzh-popover-item-hover-bg: #{$colorGrey30};\n }\n\n &__content-wrapper {\n position: relative;\n flex-grow: 1;\n display: flex;\n flex-direction: column;\n min-height: var(--content-min-height);\n }\n\n &__dnd {\n --size: #{iconSize(\"xsmall\")};\n position: absolute;\n // INFO: we don't use space() values here, because we want this element to align with the heading\n left: 3px;\n top: 23px;\n display: flex;\n visibility: var(--dnd-visibility);\n opacity: var(--dnd-opacity);\n transition: all $baseTransitionAnimationSpeed;\n display: none;\n\n @include mq($from: medium) {\n display: block;\n }\n\n @include mq($from: large) {\n // INFO: we don't use space() values here, because we want this element to align with the heading\n left: 4px;\n top: 27px;\n }\n }\n\n &__header-top {\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n }\n\n &__header-meta {\n &:not(:empty) {\n display: inline-flex;\n margin-top: space(\"xsmall\");\n gap: space(\"xsmall\");\n }\n }\n\n &__header-left,\n &__header-right {\n display: flex;\n }\n\n &__header-right {\n @include spaceCurve(\"padding-left\", \"tiny\");\n }\n\n &__left {\n align-self: center;\n }\n\n &__title-area {\n @include wordWrap;\n overflow: hidden;\n }\n\n &__title,\n &__subtitle {\n margin: 0;\n }\n\n &__title-link {\n color: inherit;\n text-decoration-line: none;\n }\n\n &__title {\n @include font(\"title\");\n @include fontSize(\"milli\");\n }\n\n &__image-link {\n display: block;\n }\n\n &__subtitle {\n @include fontSize(\"milli\");\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n text-decoration-line: none;\n // INFO: we don't use space() values here, since we try to mimic the width of a whitespace here\n margin-left: -0.5625em;\n }\n\n &__subtitle-text {\n position: relative;\n display: inline-flex;\n // INFO: we don't use space() values here, since we try to mimic the width of a whitespace here\n padding-left: 0.5625em;\n\n &::after {\n content: \",\";\n position: absolute;\n left: 0;\n }\n }\n\n &__content {\n @include fontSize(\"milli\");\n flex-grow: 1;\n }\n\n // &__footer-meta {\n // @include fontSize('micro');\n // display: flex;\n // flex-wrap: wrap;\n // gap: space('xsmall');\n // color: $colorGrey80;\n // }\n\n // &__footer-meta-separator {\n // width: 1px;\n // background-color: currentColor;\n // flex-shrink: 0;\n // }\n\n &__card-actions {\n display: inline-flex;\n white-space: nowrap;\n }\n\n &__card-action {\n @include mq($to: medium) {\n --icon-text-margin: 0px;\n --badge-icon-text-margin: 0px;\n }\n\n &[variant=\"tertiary\"] {\n --color: #{$baseColor};\n }\n\n &.is-button {\n --icon-size: #{iconSize(\"small\")};\n }\n\n &.is-placeholder {\n width: space(\"xxlarge\");\n height: space(\"xxlarge\");\n }\n\n &.is-star {\n }\n }\n\n &__card-action-popover {\n --width: auto;\n }\n\n / Service /\n\n &--service &__subtitle {\n @include fontCurve(\"p1\");\n }\n\n &--service &__subtitle {\n @include fontCurve(\"p1\");\n }\n\n &--service &__title {\n @include fontCurve(\"h3\", \"heading\");\n }\n\n / Has content /\n\n &--has-content &__content {\n @include spaceCurve(\"padding-bottom\", \"large\");\n padding-top: space(\"xlarge\");\n padding-left: space(\"xlarge\");\n padding-right: space(\"medium\");\n\n @include mq($from: medium) {\n @include spaceCurve(\"padding-bottom\", \"medium\");\n }\n }\n\n &--has-content#{&}--service &__content {\n @include spaceCurve(\"padding\", \"regular\");\n }\n\n / Has header /\n\n &--has-header &__header {\n padding-top: space(\"xlarge\");\n padding-left: space(\"xlarge\");\n padding-right: space(\"medium\");\n }\n\n &--has-header#{&}--has-content &__content {\n padding-top: space(\"xsmall\");\n }\n\n &--has-header#{&}--service &__header {\n @include spaceCurve(\"padding-top\", \"regular\");\n @include spaceCurve(\"padding-left\", \"regular\");\n @include spaceCurve(\"padding-right\", \"regular\");\n }\n\n &--has-header#{&}--has-content#{&}--service &__content {\n @include spaceCurve(\"padding-top\", \"regular\");\n }\n\n / Has footer /\n\n &--has-footer &__footer {\n @include spaceCurve(\"padding-bottom\", \"medium\");\n padding-left: space(\"xlarge\");\n padding-right: space(\"medium\");\n }\n\n &--has-footer#{&}--has-content &__content {\n padding-bottom: space(\"medium\");\n }\n\n &--has-footer#{&}--service &__footer {\n @include spaceCurve(\"padding-bottom\", \"regular\");\n @include spaceCurve(\"padding-left\", \"regular\");\n @include spaceCurve(\"padding-right\", \"regular\");\n }\n\n &--has-footer#{&}--has-content#{&}--service &__content {\n @include spaceCurve(\"padding-bottom\", \"regular\");\n }\n\n / Has tag /\n\n &--has-tag#{&}--has-header &__header {\n padding-top: space(\"xxxlarge\");\n }\n\n / Has Link /\n\n &--has-link &__title-link,\n &--has-link &__content {\n transition: color $baseTransitionAnimationSpeed;\n }\n\n &--has-link &__title-link {\n color: $colorPrimary;\n text-decoration-line: none;\n border-radius: $buttonBorderRadius;\n cursor: pointer;\n\n &::before,\n &::after {\n content: \"\";\n display: block;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n }\n\n // &::before {\n // transition: all $baseTransitionAnimationSpeed;\n // }\n }\n\n &--has-link &__header-meta,\n &--has-link &__footer-actionset,\n &--has-link &__footer-select-button {\n position: relative;\n z-index: 2;\n }\n\n &--has-link:has(#{&}__image-link:hover) &__title-link,\n &--has-link:has(#{&}__image-link:hover) &__content,\n &--has-link:has(#{&}__title-link:hover) &__title-link,\n &--has-link:has(#{&}__title-link:hover) &__content {\n color: $colorSecondary60;\n\n // &::before,\n // &::before {\n // background-color: $colorPrimary20;\n // }\n }\n\n // &__footer-arrow {\n // color: $colorPrimary;\n // }\n\n // &--has-link:hover &__footer-arrow {\n // color: $colorSecondary60;\n // }\n\n / Interactive Subtitle /\n\n &--has-subtitle-interactive &__subtitle {\n cursor: pointer;\n font-family: inherit;\n padding: 0;\n appearance: none;\n background: none;\n border: none;\n transition: color $baseTransitionAnimationSpeed;\n color: $colorPrimary;\n\n &:hover,\n &:focus {\n color: $colorPrimaryHover;\n }\n }\n\n / Is collapsible /\n\n &--is-collapsible &__header {\n cursor: pointer;\n }\n\n / Collapsed (Header) /\n\n &--is-collapsed,\n &--has-collapsed-header &__header {\n // .vhide-when-collapsed {\n // @include visuallyhidden;\n // }\n\n .hide-when-collapsed {\n display: none;\n }\n\n // .show-when-collapsed {\n // display: block;\n // }\n }\n\n &--is-collapsed &__header {\n // border-bottom: none;\n padding-bottom: space(\"xlarge\");\n }\n\n &--is-collapsed#{&}--service &__header {\n // border-bottom: none;\n @include spaceCurve(\"padding-bottom\", \"regular\");\n }\n\n &--is-collapsed &__card-action,\n &--has-collapsed-header &__card-action {\n --icon-text-margin: 0px;\n --badge-icon-text-margin: 0px;\n }\n\n / Starred /\n\n &--is-starred &__card-action.is-star {\n color: $colorPrimary;\n\n &:hover,\n &:focus {\n color: $colorPrimaryHover;\n }\n }\n\n / Hyphens /\n &--hyphens &__heading,\n &--hyphens &__title {\n hyphens: auto;\n }\n}\n\n.stzh-card__header {\n position: relative;\n}\n\n.stzh-card__badge {\n position: absolute;\n left: -5px;\n top: -5px;\n z-index: 1;\n}\n","import { Component, Element, Event, EventEmitter, forceUpdate, Fragment, h, Host, Prop, Watch } from \"@stencil/core\";\n\nimport {\n StzhActionsetItem,\n StzhButtonChangeEvent,\n StzhCardClickEvent,\n StzhCardCollapseEvent,\n StzhCardHeaderAction,\n StzhCardHeaderActionClickEvent,\n StzhCardStarClickEvent,\n StzhCardSubtitleClickEvent,\n StzhBadgeType,\n} from \"../../index\";\n\nimport { hasSlot, setPropsIfNull } from \"../../utils/utils\";\nimport { StzhCardLocalizedText } from \"./stzh-card.localization\";\n\n/\n @slot heading - Slot for heading\n * @slot image - Slot for optional image element\n * @slot content - Slot for content for any elements\n * @slot meta - Slot for meta elements (status or chip)\n * @slot footer - Slot to replace footer content (`footerActions` and `selectable` button are not shown anymore)\n /\n@Component({\n tag: \"stzh-card\",\n styleUrl: \"stzh-card.scss\",\n scoped: true,\n})\nexport class StzhCard {\n /* Translation strings /\n @Prop() localization: StzhCardLocalizedText;\n\n /* Whether background should be grey (default) or white /\n @Prop({ reflect: true }) backgroundColor: \"grey\" \| \"white\" = \"grey\";\n\n /* Variant /\n @Prop({ reflect: true }) variant: \"default\" \| \"service\" = \"default\";\n\n /* Whether card is collapsed or not /\n @Prop({ reflect: true, mutable: true }) collapsed: boolean = false;\n\n /* Whether card was starred /\n @Prop({ reflect: true, mutable: true }) starred: boolean = false;\n\n /\n Whether card star is displayed (with tooltip and menu-item in mobile popover).\n * The tooltip / menu-item text can be adjusted in the translations file (`actionAdd` & `actionRemove`).\n /\n @Prop({ reflect: true }) starrable: boolean = false;\n\n /* Whether card is selectable /\n @Prop({ reflect: true }) selectable: boolean = false;\n\n /* Whether card is checked (if card is selectable) /\n @Prop({ reflect: true }) checked: boolean = false;\n\n /* The name of the input element (if card is selectable) /\n @Prop({ reflect: true }) name: string = \"\";\n\n /* Href of card /\n @Prop({ reflect: true }) href: string;\n\n /* target if the button is used as link (if href used) /\n @Prop() target: string;\n\n /* The value of the input element (if card is selectable) /\n @Prop({ mutable: true }) value: string = \"\";\n\n /* Whether the element is disabled or not (if card is selectable) /\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /* Automatic Hyphens /\n @Prop({ reflect: true }) hyphensEnabled: boolean = false;\n\n /* Heading (or use heading slot instead) /\n @Prop() heading: string = \"\";\n\n /* Heading level /\n @Prop({ reflect: true }) headingLevel: \"1\" \| \"2\" \| \"3\" \| \"4\" = \"3\";\n\n /* Subtitle /\n @Prop() subtitle: string \| string[] = \"\";\n private _subtitles = [];\n\n /* Card header actions /\n @Prop() headerActions: string \| StzhCardHeaderAction[] = [];\n private _headerActions: StzhCardHeaderAction[];\n\n /\n Set a badge text if header action badge exists (see headerActionsBadgeType for more info).\n /\n @Prop() headerActionsBadge: string;\n\n /\n If a header action with a badge exists inside `headerActions`, the more actions popover will automatically have a empty badge.\n * By default, it takes the badge type from the first one. With this property you can overwrite it.\n /\n @Prop() headerActionsBadgeType: \"default\" \| \"success\" \| \"warning\" \| \"error\" \| \"info\";\n\n /\n Card footer actions.\n * The [`stzh-actionset`](?path=/story/components-actionset) component is used internally.\n * You can listen to clicks with the `stzhActionClick` event.\n /\n @Prop() footerActions: string \| StzhActionsetItem[] = [];\n private _footerActions: StzhActionsetItem[];\n\n /* Whether subtitle should be rendered as button and event `stzhSubtitleClick` executed on click /\n @Prop() subtitleInteractive: boolean = false;\n\n /\n Whether sorting should be disabled.\n * Has no effect if card is not inside a `cardlist` element, which has `sortableEnabled` property set to true.\n /\n @Prop({ reflect: true }) sortableDisabled: boolean = false;\n\n /* Whether card is collapsible (only effective if href is not set) /\n @Prop({ reflect: true }) collapsible: boolean = false;\n\n /\n Whether movement menu items should be shown.\n * Has no effect if card is not inside a `cardlist` element, which has `sortableEnabled` property set to true.\n /\n @Prop() hideMovementActions: boolean = false;\n\n /\n For Adobe Analytics.\n * Will be rendered as value of `s-object-id` attribute to the link elements.\n * Default value will be taken from `heading` prop/slot.\n /\n @Prop() analyticsId: string;\n\n /* Badge /\n @Prop() badge: string = \"\";\n \n /* Whether badge should be displayed empty /\n @Prop({ reflect: true }) badgeEmpty: boolean = false;\n \n /* Badge type /\n @Prop({ reflect: true }) badgeType: StzhBadgeType = \"default\";\n\n @Element() element: HTMLStzhCardElement;\n\n /* Click event /\n @Event() stzhClick: EventEmitter<StzhCardClickEvent>;\n\n /* Collapse event /\n @Event() stzhCollapse: EventEmitter<StzhCardCollapseEvent>;\n\n /* Subtitle click event /\n @Event() stzhSubtitleClick: EventEmitter<StzhCardSubtitleClickEvent>;\n\n /* Star click event /\n @Event() stzhStarClick: EventEmitter<StzhCardStarClickEvent>;\n\n /* Header action click event */\n @Event() stzhHeaderActionClick: EventEmitter<StzhCardHeaderActionClickEvent>;\n\n @Watch(\"subtitle\")\n subtitleWatcher(newValue: string[] \| string) {\n if (typeof newValue === \"string\") {\n if (newValue === \"\") {\n this._subtitles = [];\n } else {\n try {\n this._subtitles = JSON.parse(newValue);\n } catch (err) {\n this._subtitles = [newValue];\n }\n }\n } else {\n this._subtitles = newValue;\n }\n }\n\n @Watch(\"headerActions\")\n headerActionsWatcher(newValue: StzhCardHeaderAction[] \| string) {\n if (typeof newValue === \"string\") {\n this._headerActions = JSON.parse(newValue);\n } else {\n this._headerActions = newValue;\n }\n }\n\n @Watch(\"footerActions\")\n footerActionsWatcher(newValue: StzhActionsetItem[] \| string) {\n if (typeof newValue === \"string\") {\n this._footerActions = JSON.parse(newValue);\n } else {\n this._footerActions = newValue;\n }\n }\n\n private observer: MutationObserver;\n\n private nodeChange = entries => {\n let changeInSlot = false;\n\n entries.forEach(entry => {\n if (entry.target.closest(\"[slot]\") \|\| entry.target.hasAttribute(\"slot\")) {\n changeInSlot = true;\n }\n });\n\n if (changeInSlot) {\n forceUpdate(this.element);\n }\n };\n\n private imageLinkElement: HTMLAnchorElement;\n private titleLinkElement: HTMLAnchorElement;\n private headingTextElement: HTMLDivElement;\n private sortable: HTMLStzhSortableElement;\n\n private headerClick = (event: MouseEvent) => {\n if (!this.collapsible) {\n return;\n }\n\n const filterTags = [\n \"stzh-popover\",\n \"stzh-tooltip\",\n \"button\",\n \"stzh-badge\",\n \"a\",\n \"input\",\n \"select\",\n \"textarea\",\n \"iframe\",\n \"details\",\n \"label\",\n \"area\",\n ];\n const composedPathTags = event.composedPath().map(element => (element as HTMLElement).tagName?.toLowerCase());\n const found = composedPathTags.some(r => filterTags.includes(r));\n\n if (!found) {\n this.collapsed = !this.collapsed;\n\n this.stzhCollapse.emit({\n component: \"stzh-card\",\n collapsed: this.collapsed,\n });\n }\n };\n\n private subtitleClick = (event: MouseEvent) => {\n if (this.subtitleInteractive) {\n this.stzhSubtitleClick.emit({\n component: \"stzh-card\",\n originalEvent: event,\n });\n }\n };\n\n private starToggleClick = (event: MouseEvent) => {\n this.starred = !this.starred;\n this.stzhStarClick.emit({\n component: \"stzh-card\",\n starred: this.starred,\n originalEvent: event,\n });\n };\n\n private actionClick = (event: MouseEvent, action: StzhCardHeaderAction) => {\n this.stzhHeaderActionClick.emit({\n component: \"stzh-card\",\n action,\n originalEvent: event,\n });\n };\n\n private arrowUpClick = () => {\n const sortable = this.element.closest(\"stzh-sortable\");\n\n if (sortable) {\n const element = this.findSortableChildElement();\n sortable.moveItem(element, \"up\");\n }\n };\n\n private arrowDownClick = () => {\n const sortable = this.element.closest(\"stzh-sortable\");\n\n if (sortable) {\n const element = this.findSortableChildElement();\n sortable.moveItem(element, \"down\");\n }\n };\n\n private updateElementInsideSortable = () => {\n const currentSortable = this.element.closest(\"stzh-sortable\");\n\n // check if element is still inside sortable\n if (!currentSortable) {\n this.sortable.removeEventListener(\"stzhUpdate\", this.updateElementInsideSortable);\n this.sortable.removeEventListener(\"stzhDisable\", this.updateElementInsideSortable);\n return;\n }\n\n if (this.element) {\n forceUpdate(this.element);\n }\n };\n\n private init = () => {\n const chips = this.element.querySelectorAll('stzh-chip[slot=\"meta\"], [slot=\"meta\"] stzh-chip');\n\n const texts = this.element.querySelectorAll('stzh-text[slot=\"content\"], [slot=\"meta\"] stzh-text');\n\n chips.forEach(chip => {\n setPropsIfNull(chip, {\n size: \"small\",\n } as HTMLStzhChipElement);\n });\n\n texts.forEach(text => {\n setPropsIfNull(text, {\n size: \"inherit\",\n } as HTMLStzhTextElement);\n });\n };\n\n private handleMutation = entries => {\n this.init();\n this.nodeChange(entries);\n };\n\n private handleSelectionChange = (event: CustomEvent<StzhButtonChangeEvent>) => {\n this.checked = event.detail.checked;\n };\n\n private handleCardClick = (originalEvent: MouseEvent) => {\n this.stzhClick.emit({\n component: \"stzh-card\",\n originalEvent,\n ...(this.href ? { href: this.href } : {}),\n });\n };\n\n private findSortableChildElement(): HTMLElement \| undefined {\n const sortable = this.element.closest(\"stzh-sortable\");\n\n if (sortable) {\n let element: HTMLElement = this.element;\n let sortableContainer = null;\n\n if (typeof sortable.container === \"function\") {\n sortableContainer = sortable.container();\n } else {\n sortableContainer = sortable.container;\n }\n\n while (element.parentElement && element.parentElement !== sortableContainer) {\n element = element.parentElement;\n }\n\n return element;\n }\n }\n\n async componentWillLoad() {\n this.subtitleWatcher(this.subtitle);\n this.headerActionsWatcher(this.headerActions);\n this.footerActionsWatcher(this.footerActions);\n\n if (!this.localization) {\n this.localization = await window.stzhComponents.utils.fetchTranslations(this.element, \"card\");\n }\n }\n\n componentDidLoad() {\n this.sortable = this.element.closest(\"stzh-sortable\");\n\n if (this.sortable) {\n this.sortable.addEventListener(\"stzhUpdate\", this.updateElementInsideSortable);\n this.sortable.addEventListener(\"stzhDisable\", this.updateElementInsideSortable);\n }\n }\n\n componentDidRender() {\n requestAnimationFrame(() => {\n const objectId = this.analyticsId \|\| this.headingTextElement?.innerText;\n\n if (objectId) {\n this.imageLinkElement?.setAttribute(\"s-object-id\", objectId);\n this.titleLinkElement?.setAttribute(\"s-object-id\", objectId);\n }\n });\n }\n\n connectedCallback() {\n this.init();\n\n this.observer = new MutationObserver(this.handleMutation);\n this.observer.observe(this.element, {\n childList: true,\n subtree: true,\n });\n }\n\n disconnectedCallback() {\n if (this.observer) {\n this.observer.disconnect();\n }\n }\n\n render() {\n const imageUsed: boolean = hasSlot(this.element, \"image\");\n const headingUsed: boolean = hasSlot(this.element, \"heading\");\n const footerUsed: boolean = hasSlot(this.element, \"footer\");\n const contentUsed: boolean = hasSlot(this.element, \"content\");\n\n const Heading = `h${this.headingLevel}`;\n const Subtitle = `${this.subtitleInteractive ? \"button\" : \"span\"}`;\n\n const sortableChildElement = this.findSortableChildElement();\n\n const isFirstItemInSortable =\n sortableChildElement?.parentElement &&\n Array.from(sortableChildElement?.parentElement?.children).indexOf(sortableChildElement) === 0;\n\n const isLastItemInSortable =\n sortableChildElement?.parentElement &&\n Array.from(sortableChildElement?.parentElement?.children).indexOf(sortableChildElement) ===\n sortableChildElement?.parentElement?.children.length - 1;\n\n const sortableEnabled = !this.sortableDisabled && this.sortable && !this.sortable.disabled;\n const sortableActionsEnabled = sortableEnabled && !this.hideMovementActions;\n\n const hasHeading = !!this.heading \|\| headingUsed;\n\n const hasHeader =\n hasHeading \|\|\n this._subtitles.length > 0 \|\|\n this._headerActions.length > 0 \|\|\n this.starrable \|\|\n sortableActionsEnabled \|\|\n !!this.badge \|\| \n this.badgeEmpty;\n\n const hasFooter = footerUsed \|\| this._footerActions.length > 0 \|\| this.selectable;\n\n const headerActionsWithBadge = this._headerActions.filter(action => !!action.badge \|\| action.badgeEmpty);\n\n const uniqueId = `--is-described-${Math.random().toString(36).slice(2, 9)}`;\n const descriptionId = `stzh-card${uniqueId}`;\n\n const classes = {\n \"stzh-card\": true,\n \"stzh-card--background-grey\": this.backgroundColor === \"grey\",\n \"stzh-card--background-white\": this.backgroundColor === \"white\",\n \"stzh-card--has-link\": !!this.href,\n \"stzh-card--has-image\": imageUsed,\n \"stzh-card--has-content\": contentUsed,\n \"stzh-card--has-subtitle\": !!this.subtitle,\n \"stzh-card--has-subtitle-interactive\": !!this.subtitle && this.subtitleInteractive,\n \"stzh-card--has-header\": hasHeader,\n \"stzh-card--has-footer\": hasFooter,\n \"stzh-card--is-collapsible\": this.collapsible,\n \"stzh-card--is-collapsed\": this.collapsed,\n \"stzh-card--is-starred\": this.starred,\n \"stzh-card--is-checked\": this.checked,\n \"stzh-card--is-sortable\": sortableEnabled,\n [`stzh-card--${this.variant}`]: !!this.variant,\n \"stzh-card--hyphens\": this.hyphensEnabled,\n };\n\n return (\n <Host role=\"listitem\" aria-label={this.heading} is-sortable={sortableEnabled}>\n <article\n // ref={(el) => (this.mainElement = el as HTMLElement)}\n class={classes}\n onClick={!this.href ? this.handleCardClick : null}\n >\n <a\n ref={el => (this.imageLinkElement = el as HTMLAnchorElement)}\n aria-hidden=\"true\"\n tabindex=\"-1\"\n class=\"stzh-card__image-link\"\n href={this.href ?? null}\n target={this.target}\n onClick={this.href ? this.handleCardClick : null}\n >\n <slot name=\"image\"></slot>\n </a>\n <div class=\"stzh-card__content-wrapper\">\n <stzh-icon class=\"stzh-card__dnd\" name=\"drag\"></stzh-icon>\n <header class=\"stzh-card__header\" onClick={this.headerClick}>\n {(this.badge \|\| this.badgeEmpty) && (\n <stzh-badge\n class=\"stzh-card__badge\"\n label={this.badge}\n type={this.badgeType}\n ></stzh-badge>\n )}\n <div class=\"stzh-card__header-top\">\n <div class=\"stzh-card__header-left\">\n <div class=\"stzh-card__title-area\">\n {hasHeading && (\n <Heading class=\"stzh-card__title\">\n <a\n ref={el => (this.titleLinkElement = el as HTMLAnchorElement)}\n class=\"stzh-card__title-link\"\n href={this.href ?? null}\n target={this.target}\n onClick={this.href ? this.handleCardClick : null}\n aria-describedby={descriptionId}\n >\n <div ref={el => (this.headingTextElement = el as HTMLDivElement)}>\n {this.heading ? this.heading : <slot name=\"heading\"></slot>}\n </div>\n </a>\n </Heading>\n )}\n <span id={descriptionId} hidden>\n {this.localization?.clickTitle}\n </span>\n {this._subtitles.length > 0 && (\n <Subtitle class=\"stzh-card__subtitle\" onClick={this.subtitleClick}>\n {this._subtitles.map(subtitle => (\n <span class=\"stzh-card__subtitle-text\">{subtitle}</span>\n ))}\n </Subtitle>\n )}\n </div>\n </div>\n <div class=\"stzh-card__header-right\">\n <div class=\"stzh-card__card-actions\" onClick={e => e.stopPropagation()}>\n {this.starrable && (\n <stzh-tooltip>\n <stzh-button\n class=\"stzh-card__card-action is-star\"\n icon={this.starred ? \"star-filled\" : \"star\"}\n variant=\"tertiary\"\n size=\"tiny\"\n iconOnly={true}\n onClick={this.starToggleClick}\n ></stzh-button>\n <div slot=\"content\">\n {this.starred ? this.localization.actionRemove : this.localization.actionAdd}\n </div>\n </stzh-tooltip>\n )}\n\n {(this._headerActions.length > 0 \|\| this.starrable \|\| sortableActionsEnabled) && (\n <stzh-popover\n label={this.localization.actionsPopoverLabel}\n placement=\"bottom-end\"\n class={{\n \"stzh-card__card-action-popover\": true,\n // \"hide-medium show-when-collapsed\": !this.starrable && !sortableActionsEnabled\n }}\n >\n <stzh-button\n class=\"stzh-card__card-action is-further\"\n variant=\"tertiary\"\n size=\"tiny\"\n icon=\"more-vertical\"\n iconOnly={true}\n badge={this.headerActionsBadge}\n badgeEmpty={headerActionsWithBadge.length > 0}\n badgePosition=\"icon\"\n badgeType={this.headerActionsBadgeType \|\| headerActionsWithBadge[0]?.badgeType \|\| \"default\"}\n ></stzh-button>\n <stzh-menu slot=\"content\">\n {this._headerActions.map(action => (\n <stzh-menu-item\n icon={action.icon}\n badge={action.badge}\n badgeEmpty={action.badgeEmpty}\n badgeType={action.badgeType}\n onClick={(e: MouseEvent) => {\n this.actionClick(e, action);\n }}\n >\n {action.label}\n </stzh-menu-item>\n ))}\n\n {sortableActionsEnabled && (\n <Fragment>\n {!isFirstItemInSortable && (\n <stzh-menu-item icon=\"arrow-up\" onClick={this.arrowUpClick}>\n {this.localization.actionMoveUp}\n </stzh-menu-item>\n )}\n {!isLastItemInSortable && (\n <stzh-menu-item icon=\"arrow-down\" onClick={this.arrowDownClick}>\n {this.localization.actionMoveDown}\n </stzh-menu-item>\n )}\n </Fragment>\n )}\n\n {this.starrable && (\n <stzh-menu-item icon={this.starred ? \"star-filled\" : \"star\"} onClick={this.starToggleClick}>\n {this.starred ? this.localization.actionRemove : this.localization.actionAdd}\n </stzh-menu-item>\n )}\n </stzh-menu>\n </stzh-popover>\n )}\n </div>\n </div>\n </div>\n\n <div class=\"stzh-card__header-meta\">\n <slot name=\"meta\"></slot>\n </div>\n </header>\n\n <div class=\"stzh-card__content hide-when-collapsed\">\n <slot name=\"content\"></slot>\n </div>\n\n <div class=\"stzh-card__footer hide-when-collapsed\">\n <slot name=\"footer\">\n {this._footerActions.length > 0 && (\n <stzh-actionset class=\"stzh-card__footer-actionset\" actions={this._footerActions}></stzh-actionset>\n )}\n\n {this.selectable && (\n <stzh-button\n class=\"stzh-card__footer-select-button\"\n fullwidth\n type=\"radio\"\n variant=\"secondary\"\n name={this.name}\n value={this.value}\n checked={this.checked}\n disabled={this.disabled}\n label={this.localization.select}\n onStzhChange={this.handleSelectionChange}\n ></stzh-button>\n )}\n </slot>\n </div>\n </div>\n </article>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/{p-f5779736.js → p-37c9ec06.js} RENAMED Viewed

@@ -16,7 +16,7 @@ function tc(translation, count) {
     if (parts.length === 2 && count !== 1) {
         part = parts[1].trim();
     }
-    return part.replace(/\{n\}/ig, (count === null || count === void 0 ? void 0 : count.toString()) || "");
+    return part.replace(/\{n\}/gi, (count === null || count === void 0 ? void 0 : count.toString()) || "");
 }
 /* Socialmedia Stream */
 var StzhSocialmediastreamItemActionVariant;
@@ -40,4 +40,4 @@ var VBZ;
 export { StzhSocialmediastreamItemActionVariant as S, VBZ as V, tc as t };
-//# sourceMappingURL=p-f5779736.js.map
+//# sourceMappingURL=p-37c9ec06.js.map