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

@oiz/stzh-components 2.8.0-alpha → 2.8.0-beta

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

Files changed (132) hide show

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

	@@ -1 +1 @@
1	- {"file":"stzh-chip.stzh-clamp.entry.cjs.js","mappings":"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","names":["h","Fragment","Host","fetchTranslations"],"sources":["./src/components/stzh-chip/stzh-chip.scss?tag=stzh-chip&encapsulation=scoped","./src/components/stzh-chip/stzh-chip.tsx","./src/components/stzh-clamp/stzh-clamp.scss?tag=stzh-clamp","./src/components/stzh-clamp/stzh-clamp.tsx"],"sourcesContent":[":host {\n --color: #{$colorPrimary};\n --height: 32px;\n --padding: 0 #{space('medium')};\n --border-color: #{$colorGrey13};\n --border-radius: 16px;\n --remove-color: #{$baseLeadColor};\n --remove-border-radius: 24px;\n --background-color: #{$colorWhite};\n --icon-size: #{iconSize('small')};\n --icon-color: #{$colorPrimary};\n --icon-gap: #{space('xsmall')};\n --counter-color: #{$colorPrimary60op};\n --counter-gap: #{space('xsmall')};\n\n --hover-color: #{$colorPrimaryHover};\n --hover-border-color: var(--border-color);\n --hover-background-color: #{$colorPrimary8};\n --hover-remove-color: var(--hover-color);\n --hover-remove-background-color: var(--hover-background-color);\n --hover-icon-color: #{$colorPrimaryHover};\n --hover-counter-color: #{$colorPrimaryHover};\n\n display: inline-flex;\n\n @include highContrast() {\n --hover-color: Highlight;\n --hover-border: 1px solid Highlight;\n --hover-background-color: Canvas;\n --hover-remove-color: Highlight;\n --hover-remove-background-color: Canvas;\n --hover-icon-color: Highlight;\n --hover-counter-color: Highlight;\n }\n\n &[size=\"large\"] {\n --height: 40px;\n --border-radius: 20px;\n --padding: 0 #{space('xlarge')};\n }\n\n &[size=\"small\"] {\n --height: 24px;\n --icon-size: #{iconSize('xsmall')};\n --counter-gap: #{space('xxsmall')};\n }\n\n &[variant=\"input\"] {\n --border-color: transparent;\n --background-color: #{$colorGrey5};\n\n --hover-border-color: transparent;\n }\n\n &[variant=\"tag\"] {\n --color: #{$baseColor};\n --icon-color: #{$baseColor};\n --counter-color: #{$baseColor};\n --border-color: transparent;\n --background-color: #{$colorBlack8};\n\n --hover-color: #{$baseColor};\n --hover-border-color: transparent;\n --hover-background-color: #{$colorBlack8};\n --hover-icon-color: #{$baseColor};\n --hover-counter-color: #{$baseColor};\n }\n\n &[variant=\"input\"][size=\"small\"] {\n --padding: 0 #{space('small')};\n --icon-gap: #{space('xxsmall')};\n }\n\n &[variant=\"tag\"][size=\"small\"] {\n --padding: 0 #{space('xsmall')};\n --icon-gap: #{space('xxsmall')};\n }\n\n &[type=\"secondary\"] {\n --color: #{$baseLeadColor};\n --counter-color: #{$colorGrey40};\n }\n\n &[type=\"important\"] {\n --color: #{$colorError};\n --icon-color: #{$colorError};\n --counter-color: #{$colorError};\n\n --hover-color: #{$colorError};\n --hover-icon-color: #{$colorError};\n --hover-counter-color: #{$colorError};\n\n @include highContrast() {\n --hover-color: Highlight;\n --hover-icon-color: Highlight;\n --hover-counter-color: Highlight;\n }\n }\n\n &[active]:not([active=\"false\"]) {\n --color: #{$colorWhite};\n --border-color: transparent;\n --remove-color: #{$colorWhite};\n --background-color: #{$colorPrimary};\n --icon-color: #{$colorWhite};\n --counter-color: #{$colorWhite56};\n\n --hover-color: #{$colorWhite};\n --hover-border-color: transparent;\n --hover-background-color: #{$colorPrimaryHover};\n --hover-remove-color: #{$colorWhite};\n --hover-remove-background-color: #{$colorPrimaryHover};\n --hover-icon-color: #{$colorWhite};\n --hover-counter-color: #{$colorWhite56};\n\n @include highContrast() {\n --color: SelectedItem;\n --border-color: SelectedItem;\n --remove-color: SelectedItem;\n --background-color: Canvas;\n --icon-color: SelectedItem;\n --counter-color: SelectedItem;\n\n --hover-color: Highlight;\n --hover-border-color: Highlight;\n --hover-background-color: Canvas;\n --hover-remove-color: Highlight;\n --hover-remove-background-color: Canvas;\n --hover-icon-color: Highlight;\n --hover-counter-color: Highlight;\n }\n }\n\n &[non-interactive]:not([non-interactive=\"false\"]) {\n --hover-color: var(--color);\n --hover-border: var(--border-color);\n --hover-background-color: var(--background-color);\n --hover-icon-color: var(--icon-color);\n --hover-counter-color: var(--counter-color);\n }\n\n &[disabled]:not([disabled=\"false\"]) {\n --color: #{$colorGrey25};\n --border-color: #{$baseBorderColor};\n --remove-color: #{$colorGrey13};\n --background-color: #{$colorWhite};\n --icon-color: #{$colorGrey25};\n --counter-color: #{$colorGrey25};\n\n --hover-color: #{$colorGrey25};\n --hover-border-color: #{$baseBorderColor};\n --hover-background-color: #{$colorWhite};\n --hover-remove-color: #{$colorGrey13};\n --hover-remove-background-color: transparent;\n --hover-icon-color: #{$colorGrey25};\n --hover-counter-color: #{$colorGrey25};\n }\n}\n\n:host ::slotted(stzh-icon),\n.stzh-chip__icon {\n --size: var(--icon-size);\n}\n\n.stzh-chip {\n position: relative;\n\n &__vhidden {\n @include visuallyhidden;\n }\n\n &__button {\n @include fontSize('micro');\n font-family: inherit;\n height: var(--height);\n display: flex;\n flex-direction: row;\n align-items: center;\n border-radius: var(--border-radius);\n padding: var(--padding);\n color: var(--color);\n appearance: none;\n border-width: 1px;\n border-style: solid;\n border-color: var(--border-color);\n background-color: var(--background-color);\n transition-duration: $baseTransitionAnimationSpeed;\n transition-property: color, background-color, border-color;\n text-decoration-line: none;\n\n &.is-button,\n &.is-link {\n cursor: pointer;\n }\n }\n\n &__label {\n text-align: left;\n }\n\n &__icon-wrapper {\n display: flex;\n color: var(--icon-color);\n transition: color $baseTransitionAnimationSpeed;\n flex-shrink: 0;\n\n &:not(:empty) {\n margin-right: var(--icon-gap);\n }\n }\n\n &__counter {\n display: flex;\n font-variant-numeric: tabular-nums;\n margin-left: var(--counter-gap);\n color: var(--counter-color);\n transition: color $baseTransitionAnimationSpeed;\n }\n\n &__remove {\n position: absolute;\n top: 0;\n right: 0;\n appearance: none;\n font-family: inherit;\n border: none;\n background: none;\n padding: 0;\n width: var(--height);\n height: var(--height);\n border-radius: var(--remove-border-radius);\n display: flex;\n justify-content: center;\n align-items: center;\n margin-left: space('xxsmall');\n color: var(--remove-color);\n transition-duration: $baseTransitionAnimationSpeed;\n transition-property: color, background-color, border-color;\n cursor: pointer;\n\n &:hover {\n color: var(--hover-remove-color);\n background-color: var(--hover-remove-background-color);\n }\n }\n\n &__remove-icon {\n --size: #{iconSize('xxsmall')};\n }\n\n &__button:hover,\n &__remove:hover + &__button {\n color: var(--hover-color);\n background-color: var(--hover-background-color);\n border-color: var(--hover-border-color);\n }\n\n &__button:hover &__counter,\n &__remove:hover + &__button &__counter {\n color: var(--hover-counter-color);\n }\n\n &__button:hover &__icon-wrapper,\n &__remove:hover + &__button &__icon-wrapper {\n color: var(--hover-icon-color);\n }\n\n /* Size /\n\n &--size-small &__button {\n @include fontSize('nano');\n }\n\n / Removeable /\n\n &--is-removable &__button {\n padding-right: calc(var(--height) + #{space('xxsmall')});\n }\n\n / Disabled /\n\n &--is-disabled &__button,\n &--is-disabled &__remove {\n cursor: not-allowed;\n }\n}\n","import {\n Component,\n Host,\n h,\n Prop,\n Event,\n EventEmitter,\n Element,\n Method,\n Fragment\n} from \"@stencil/core\";\n\nimport {\n StzhChipClickEvent,\n StzhChipRemoveEvent,\n StzhChipFocusEvent,\n StzhChipBlurEvent\n} from \"../../index\";\n\n/\n @slot - Slot for label\n * @slot icon - Slot for icon\n /\n@Component({\n tag: \"stzh-chip\",\n styleUrl: \"stzh-chip.scss\",\n scoped: true\n})\nexport class StzhChip {\n /* Label /\n @Prop() label: string = \"\";\n\n /* Icon (use instead of icon slot) /\n @Prop() icon: string = \"\";\n\n /* `href` if the chip should be used as link /\n @Prop() href: string = \"\";\n\n /* Target if the button is used as link (if `href` used) /\n @Prop() target: string = \"\";\n\n /* Whether chip is not interactive /\n @Prop({ reflect: true }) nonInteractive: boolean = false;\n\n /* Whether remove button should be shown /\n @Prop({ reflect: true }) removable: boolean = false;\n\n /* Variant /\n @Prop({ reflect: true }) variant: \"tag\" \| \"filter\" \| \"input\" = \"tag\";\n\n /* Size /\n @Prop({ reflect: true }) size: \"default\" \| \"small\" \| \"large\" = \"default\";\n\n /* Type /\n @Prop({ reflect: true }) type: \"default\" \| \"secondary\" \| \"important\" = \"default\";\n\n /* Counter /\n @Prop() counter: string = \"\";\n\n /* Label of remove button for screenreaders /\n @Prop() removeLabel: string = \"\";\n\n /* Active /\n @Prop({ reflect: true }) active: boolean = false;\n\n /* Disabled /\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /* Tabindex of link/button /\n @Prop({ attribute: \"a11y-tabindex\" }) a11yTabindex: 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 link/button /\n @Prop({ attribute: \"a11y-describedby\" }) a11yDescribedby: 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 /\n For Adobe Analytics.\n * Will be rendered as value of `s-object-id` attribute to the remove button element.\n * Default value will be taken from `removeLabel` prop.\n /\n @Prop() removeAnalyticsId: string;\n\n @Element() element: HTMLStzhChipElement;\n\n /* Focus menu item /\n @Method()\n async setFocus() {\n this.chip.focus();\n }\n\n /* Chip click event /\n @Event() stzhClick: EventEmitter<StzhChipClickEvent>;\n\n /* Chip remove event /\n @Event() stzhRemove: EventEmitter<StzhChipRemoveEvent>;\n\n /* Focus event /\n @Event() stzhFocus: EventEmitter<StzhChipFocusEvent>;\n\n /* Input blur event /\n @Event() stzhBlur: EventEmitter<StzhChipBlurEvent>;\n\n private chip: HTMLButtonElement \| HTMLAnchorElement;\n private text: HTMLElement;\n private focusedByInput: boolean = false;\n\n componentDidRender() {\n requestAnimationFrame(() => {\n this.chip.setAttribute(\"s-object-id\", this.analyticsId \|\| this.text.innerText);\n });\n }\n\n private renderInner(): DocumentFragment {\n return (\n <Fragment>\n <div class=\"stzh-chip__icon-wrapper\">\n {this.icon ?\n <stzh-icon class=\"stzh-chip__icon\" name={this.icon}></stzh-icon>\n :\n <slot name=\"icon\"></slot>\n }\n </div>\n\n <stzh-clamp\n lines={1}\n class=\"stzh-chip__label\"\n ref={(el) => (this.text = el as HTMLElement)}\n >\n {this.label ? this.label : <slot></slot>}\n {this.counter &&\n <span class=\"stzh-chip__vhidden\">\n  ({this.counter})\n </span>\n }\n </stzh-clamp>\n\n {this.counter &&\n <div class=\"stzh-chip__counter\" aria-hidden=\"true\">\n {this.counter}\n </div>\n }\n </Fragment>\n );\n }\n\n private onRootFocus = () => {\n if (!this.focusedByInput) {\n this.setFocus();\n }\n\n this.focusedByInput = false;\n }\n\n private onFocus = (event: FocusEvent) => {\n this.focusedByInput = true;\n\n const focusEvent = new FocusEvent(\"focus\", {\n view: window,\n bubbles: false,\n cancelable: false\n });\n\n this.element.dispatchEvent(focusEvent);\n this.stzhFocus.emit({\n component: \"stzh-chip\",\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-chip\",\n originalEvent: event\n });\n }\n\n private onClick = (event: MouseEvent) => {\n this.stzhClick.emit({\n component: \"stzh-chip\",\n originalEvent: event\n });\n }\n\n private onRemoveClick = (event: MouseEvent) => {\n this.stzhRemove.emit({\n component: \"stzh-chip\",\n originalEvent: event\n });\n }\n\n render() {\n const classes = {\n \"stzh-chip\": true,\n \"stzh-chip--is-active\": this.active,\n \"stzh-chip--is-disabled\": this.disabled,\n \"stzh-chip--is-removable\": this.removable,\n \"stzh-chip--has-counter\": !!this.counter,\n [`stzh-chip--type-${this.type}`]: !!this.type,\n [`stzh-chip--size-${this.size}`]: !!this.size,\n [`stzh-chip--${this.variant}`]: !!this.variant\n };\n\n const Chip = this.nonInteractive ? \"div\" :\n this.href ? \"a\" : \"button\";\n\n return (\n <Host tabindex={this.disabled ? null : \"-1\"} onFocus={this.onRootFocus}>\n <div class={classes}>\n {this.removable &&\n <button\n class=\"stzh-chip__remove\"\n onClick={this.onRemoveClick}\n disabled={this.disabled}\n aria-label={this.removeLabel}\n type=\"button\"\n s-object-id={this.removeAnalyticsId \|\| this.removeLabel}\n >\n <stzh-icon class=\"stzh-chip__remove-icon\" name=\"close\"></stzh-icon>\n </button>\n }\n\n {this.href ?\n <Chip\n ref={(el) => (this.chip = el as HTMLAnchorElement)}\n class={{\n \"stzh-chip__button\": true,\n \"is-button\": !this.nonInteractive && !this.href,\n \"is-link\": !this.nonInteractive && !!this.href\n }}\n href={this.disabled ? null : this.href}\n target={this.target}\n tabindex={this.a11yTabindex}\n aria-label={this.a11yLabel}\n aria-describedby={this.a11yDescribedby}\n onClick={this.onClick}\n onFocus={this.onFocus}\n onBlur={this.onBlur}\n >\n {this.renderInner()}\n </Chip>\n :\n <Chip\n ref={(el) => (this.chip = el as HTMLButtonElement)}\n class={{\n \"stzh-chip__button\": true,\n \"is-button\": !this.nonInteractive && !this.href,\n \"is-link\": !this.nonInteractive && !!this.href\n }}\n disabled={this.disabled}\n type=\"button\"\n tabindex={this.a11yTabindex}\n aria-label={this.a11yLabel}\n aria-describedby={this.a11yDescribedby}\n onClick={this.onClick}\n onFocus={this.onFocus}\n onBlur={this.onBlur}\n >\n {this.renderInner()}\n </Chip>\n }\n </div>\n </Host>\n );\n }\n}\n","stzh-clamp {\n @include host;\n --current-lines: var(--lines, 0);\n\n @include mq($from: small) {\n --current-lines: var(--lines-small, var(--lines, 0));\n }\n\n @include mq($from: medium) {\n --current-lines: var(--lines-medium, var(--lines-small, var(--lines, 0)));\n }\n\n @include mq($from: large) {\n --current-lines: var(--lines-large, var(--lines-medium, var(--lines-small, var(--lines, 0))));\n }\n\n @include mq($from: ultra) {\n --current-lines: var(--lines-ultra, var(--lines-large, var(--lines-medium, var(--lines-small, var(--lines, 0)))));\n }\n\n width: 100%;\n color: inherit;\n font-family: inherit;\n font-weight: inherit;\n font-style: inherit;\n font-size: inherit;\n line-height: inherit;\n}\n\n.stzh-clamp {\n position: relative;\n\n &__text {\n @include wordWrap;\n display: -webkit-box;\n -webkit-box-orient: vertical;\n overflow: hidden;\n\n & > :first-child {\n margin-top: 0 !important;\n }\n\n & > :last-child {\n margin-bottom: 0 !important;\n }\n\n &.is-clone {\n position: absolute;\n visibility: hidden;\n opacity: 0;\n top: 0;\n left: 0;\n width: 100%;\n }\n }\n\n &__trigger {\n margin-top: space('xxsmall');\n }\n\n &--is-not-expanded &__text,\n &__text.is-clone {\n -webkit-line-clamp: var(--current-lines);\n line-clamp: var(--current-lines);\n }\n}\n","import {\n Component,\n Host,\n h,\n Prop,\n Method,\n Element,\n Event,\n EventEmitter\n} from \"@stencil/core\";\n\nimport {\n StzhClampClampEvent,\n StzhClampExpandEvent\n} from \"../../index\";\n\nimport { fetchTranslations } from \"../../utils/translation-utils\";\nimport { StzhClampLocalizedText } from \"./stzh-clamp.localization\";\n\n/\n \n /\n@Component({\n tag: \"stzh-clamp\",\n styleUrl: \"stzh-clamp.scss\"\n})\nexport class StzhClamp {\n /* Translation strings /\n @Prop() localization: StzhClampLocalizedText;\n\n /* Line number /\n @Prop() lines: number = 1;\n /* Line number above small breakpoint /\n @Prop() linesSmall: number = 0;\n /* Line number above medium breakpoint /\n @Prop() linesMedium: number = 0;\n /* Line number above large breakpoint /\n @Prop() linesLarge: number = 0;\n /* Line number above ultra breakpoint /\n @Prop() linesUltra: number = 0;\n\n /* Whether clamping is expanded /\n @Prop() showExpandLink: boolean = false;\n\n /* Whether clamping is expanded /\n @Prop({ mutable: true, reflect: true }) expanded: boolean = false;\n\n /* Whether the text is currently clamped (readonly) /\n @Prop({ mutable: true, reflect: true }) clamped: boolean = false;\n\n @Element() element: HTMLStzhClampElement;\n\n /* Event when clamping state changed /\n @Event() stzhClamp: EventEmitter<StzhClampClampEvent>;\n\n /* Event when expanding state changed */\n @Event() stzhExpand: EventEmitter<StzhClampExpandEvent>;\n\n @Method()\n async update() {\n this.textCloneElement.innerHTML = this.textElement.innerHTML;\n this.updateClamped();\n }\n\n private textElement: HTMLElement;\n private textCloneElement: HTMLElement;\n\n private debounceResize: number;\n private resizeObserver: ResizeObserver;\n private mutationObserver: MutationObserver;\n\n private updateClamped = () => {\n if (!this.textCloneElement) {\n return;\n }\n\n const beforeClamped = this.clamped;\n this.clamped = this.textCloneElement.scrollHeight > this.textCloneElement.clientHeight;\n\n if (beforeClamped !== this.clamped) {\n this.stzhClamp.emit({\n component: \"stzh-clamp\",\n clamped: this.clamped\n });\n }\n }\n\n private handleResize = () => {\n if (this.debounceResize) {\n window.cancelAnimationFrame(this.debounceResize);\n }\n\n this.debounceResize = requestAnimationFrame(this.updateClamped);\n }\n\n private handleMutaton = () => {\n this.update();\n }\n\n private handleExpandClick = () => {\n this.expanded = !this.expanded;\n\n this.stzhExpand.emit({\n component: \"stzh-clamp\",\n expanded: this.expanded\n });\n }\n\n async componentWillLoad() {\n if (!this.localization) {\n this.localization = await fetchTranslations(this.element, \"clamp\");\n }\n }\n\n componentDidLoad() {\n this.mutationObserver = new MutationObserver(this.handleMutaton);\n this.mutationObserver.observe(this.textElement, {\n childList: true,\n subtree: true,\n });\n }\n\n componentDidRender() {\n this.update();\n }\n\n connectedCallback() {\n this.resizeObserver = new ResizeObserver(this.handleResize);\n this.resizeObserver.observe(this.element);\n }\n\n disconnectedCallback() {\n if (this.resizeObserver) {\n this.resizeObserver.disconnect();\n }\n\n if (this.mutationObserver) {\n this.mutationObserver.disconnect();\n }\n }\n\n render() {\n const classes = {\n \"stzh-clamp\": true,\n \"stzh-clamp--is-not-expanded\": !this.expanded\n };\n\n return (\n <Host\n style={{\n '--lines': this.lines ? this.lines.toString() : null,\n '--lines-small': this.linesSmall ? this.linesSmall.toString() : null,\n '--lines-medium': this.linesMedium ? this.linesMedium.toString() : null,\n '--lines-large': this.linesLarge ? this.linesLarge.toString() : null,\n '--lines-ultra': this.linesUltra ? this.linesUltra.toString() : null,\n }}\n >\n <div class={classes}>\n <div\n ref={(el) => (this.textElement = el as HTMLDivElement)}\n class=\"stzh-clamp__text\"\n >\n <slot></slot>\n </div>\n\n <div\n ref={(el) => (this.textCloneElement = el as HTMLDivElement)}\n class=\"stzh-clamp__text is-clone\"\n aria-hidden=\"true\"\n ></div>\n\n {this.showExpandLink && this.clamped &&\n <stzh-link\n class=\"stzh-clamp__trigger\"\n a11yTabindex=\"-1\"\n aria-hidden=\"true\"\n onClick={this.handleExpandClick}\n >\n {!this.expanded ? this.localization.showMore : this.localization.showLess}\n </stzh-link>\n }\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"stzh-chip.stzh-clamp.entry.cjs.js","mappings":"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","names":["h","Fragment","Host","fetchTranslations"],"sources":["./src/components/stzh-chip/stzh-chip.scss?tag=stzh-chip&encapsulation=scoped","./src/components/stzh-chip/stzh-chip.tsx","./src/components/stzh-clamp/stzh-clamp.scss?tag=stzh-clamp","./src/components/stzh-clamp/stzh-clamp.tsx"],"sourcesContent":[":host {\n --color: #{$colorPrimary};\n --height: 32px;\n --padding: 0 #{space('medium')};\n --border-color: #{$colorGrey13};\n --border-radius: 16px;\n --remove-color: #{$baseLeadColor};\n --remove-border-radius: 24px;\n --background-color: #{$colorWhite};\n --icon-size: #{iconSize('small')};\n --icon-color: #{$colorPrimary};\n --icon-gap: #{space('xsmall')};\n --counter-color: #{$colorPrimary60op};\n --counter-gap: #{space('xsmall')};\n\n --hover-color: #{$colorPrimaryHover};\n --hover-border-color: var(--border-color);\n --hover-background-color: #{$colorPrimary8};\n --hover-remove-color: var(--hover-color);\n --hover-remove-background-color: var(--hover-background-color);\n --hover-icon-color: #{$colorPrimaryHover};\n --hover-counter-color: #{$colorPrimaryHover};\n\n display: inline-flex;\n\n @include highContrast() {\n --hover-color: Highlight;\n --hover-border: 1px solid Highlight;\n --hover-background-color: Canvas;\n --hover-remove-color: Highlight;\n --hover-remove-background-color: Canvas;\n --hover-icon-color: Highlight;\n --hover-counter-color: Highlight;\n }\n\n &[size=\"large\"] {\n --height: 40px;\n --border-radius: 20px;\n --padding: 0 #{space('xlarge')};\n }\n\n &[size=\"small\"] {\n --height: 24px;\n --icon-size: #{iconSize('xsmall')};\n --counter-gap: #{space('xxsmall')};\n }\n\n &[variant=\"input\"] {\n --border-color: transparent;\n --background-color: #{$colorGrey5};\n\n --hover-border-color: transparent;\n }\n\n &[variant=\"tag\"] {\n --color: #{$baseColor};\n --icon-color: #{$baseColor};\n --counter-color: #{$baseColor};\n --border-color: transparent;\n --background-color: #{$colorBlack8};\n\n --hover-color: #{$baseColor};\n --hover-border-color: transparent;\n --hover-background-color: #{$colorBlack8};\n --hover-icon-color: #{$baseColor};\n --hover-counter-color: #{$baseColor};\n }\n\n &[variant=\"input\"][size=\"small\"] {\n --padding: 0 #{space('small')};\n --icon-gap: #{space('xxsmall')};\n }\n\n &[variant=\"tag\"][size=\"small\"] {\n --padding: 0 #{space('xsmall')};\n --icon-gap: #{space('xxsmall')};\n }\n\n &[type=\"secondary\"] {\n --color: #{$baseLeadColor};\n --counter-color: #{$colorGrey40};\n }\n\n &[type=\"important\"] {\n --color: #{$colorError};\n --icon-color: #{$colorError};\n --counter-color: #{$colorError};\n\n --hover-color: #{$colorError};\n --hover-icon-color: #{$colorError};\n --hover-counter-color: #{$colorError};\n\n @include highContrast() {\n --hover-color: Highlight;\n --hover-icon-color: Highlight;\n --hover-counter-color: Highlight;\n }\n }\n\n &[active]:not([active=\"false\"]) {\n --color: #{$colorWhite};\n --border-color: transparent;\n --remove-color: #{$colorWhite};\n --background-color: #{$colorPrimary};\n --icon-color: #{$colorWhite};\n --counter-color: #{$colorWhite56};\n\n --hover-color: #{$colorWhite};\n --hover-border-color: transparent;\n --hover-background-color: #{$colorPrimaryHover};\n --hover-remove-color: #{$colorWhite};\n --hover-remove-background-color: #{$colorPrimaryHover};\n --hover-icon-color: #{$colorWhite};\n --hover-counter-color: #{$colorWhite56};\n\n @include highContrast() {\n --color: SelectedItem;\n --border-color: SelectedItem;\n --remove-color: SelectedItem;\n --background-color: Canvas;\n --icon-color: SelectedItem;\n --counter-color: SelectedItem;\n\n --hover-color: Highlight;\n --hover-border-color: Highlight;\n --hover-background-color: Canvas;\n --hover-remove-color: Highlight;\n --hover-remove-background-color: Canvas;\n --hover-icon-color: Highlight;\n --hover-counter-color: Highlight;\n }\n }\n\n &[non-interactive]:not([non-interactive=\"false\"]) {\n --hover-color: var(--color);\n --hover-border: var(--border-color);\n --hover-background-color: var(--background-color);\n --hover-icon-color: var(--icon-color);\n --hover-counter-color: var(--counter-color);\n }\n\n &[disabled]:not([disabled=\"false\"]) {\n --color: #{$colorGrey25};\n --border-color: #{$baseBorderColor};\n --remove-color: #{$colorGrey13};\n --background-color: #{$colorWhite};\n --icon-color: #{$colorGrey25};\n --counter-color: #{$colorGrey25};\n\n --hover-color: #{$colorGrey25};\n --hover-border-color: #{$baseBorderColor};\n --hover-background-color: #{$colorWhite};\n --hover-remove-color: #{$colorGrey13};\n --hover-remove-background-color: transparent;\n --hover-icon-color: #{$colorGrey25};\n --hover-counter-color: #{$colorGrey25};\n }\n}\n\n:host ::slotted(stzh-icon),\n.stzh-chip__icon {\n --size: var(--icon-size);\n}\n\n.stzh-chip {\n position: relative;\n\n &__vhidden {\n @include visuallyhidden;\n }\n\n &__button {\n @include fontSize('micro');\n font-family: inherit;\n height: var(--height);\n display: flex;\n flex-direction: row;\n align-items: center;\n border-radius: var(--border-radius);\n padding: var(--padding);\n color: var(--color);\n appearance: none;\n border-width: 1px;\n border-style: solid;\n border-color: var(--border-color);\n background-color: var(--background-color);\n transition-duration: $baseTransitionAnimationSpeed;\n transition-property: color, background-color, border-color;\n text-decoration-line: none;\n\n &.is-button,\n &.is-link {\n cursor: pointer;\n }\n }\n\n &__label {\n text-align: left;\n }\n\n &__icon-wrapper {\n display: flex;\n color: var(--icon-color);\n transition: color $baseTransitionAnimationSpeed;\n flex-shrink: 0;\n\n &:not(:empty) {\n margin-right: var(--icon-gap);\n }\n }\n\n &__counter {\n display: flex;\n font-variant-numeric: tabular-nums;\n margin-left: var(--counter-gap);\n color: var(--counter-color);\n transition: color $baseTransitionAnimationSpeed;\n }\n\n &__remove {\n position: absolute;\n top: 0;\n right: 0;\n appearance: none;\n font-family: inherit;\n border: none;\n background: none;\n padding: 0;\n width: var(--height);\n height: var(--height);\n border-radius: var(--remove-border-radius);\n display: flex;\n justify-content: center;\n align-items: center;\n margin-left: space('xxsmall');\n color: var(--remove-color);\n transition-duration: $baseTransitionAnimationSpeed;\n transition-property: color, background-color, border-color;\n cursor: pointer;\n\n &:hover {\n color: var(--hover-remove-color);\n background-color: var(--hover-remove-background-color);\n }\n }\n\n &__remove-icon {\n --size: #{iconSize('xxsmall')};\n }\n\n &__button:hover,\n &__remove:hover + &__button {\n color: var(--hover-color);\n background-color: var(--hover-background-color);\n border-color: var(--hover-border-color);\n }\n\n &__button:hover &__counter,\n &__remove:hover + &__button &__counter {\n color: var(--hover-counter-color);\n }\n\n &__button:hover &__icon-wrapper,\n &__remove:hover + &__button &__icon-wrapper {\n color: var(--hover-icon-color);\n }\n\n /* Size /\n\n &--size-small &__button {\n @include fontSize('nano');\n }\n\n / Removeable /\n\n &--is-removable &__button {\n padding-right: calc(var(--height) + #{space('xxsmall')});\n }\n\n / Disabled /\n\n &--is-disabled &__button,\n &--is-disabled &__remove {\n cursor: not-allowed;\n }\n}\n","import {\n Component,\n Host,\n h,\n Prop,\n Event,\n EventEmitter,\n Element,\n Method,\n Fragment\n} from \"@stencil/core\";\n\nimport {\n StzhChipClickEvent,\n StzhChipRemoveEvent,\n StzhChipFocusEvent,\n StzhChipBlurEvent\n} from \"../../index\";\n\n/\n @slot - Slot for label\n * @slot icon - Slot for icon\n /\n@Component({\n tag: \"stzh-chip\",\n styleUrl: \"stzh-chip.scss\",\n scoped: true\n})\nexport class StzhChip {\n /* Label /\n @Prop() label: string = \"\";\n\n /* Icon (use instead of icon slot) /\n @Prop() icon: string = \"\";\n\n /* `href` if the chip should be used as link /\n @Prop() href: string = \"\";\n\n /* Target if the button is used as link (if `href` used) /\n @Prop() target: string = \"\";\n\n /* Whether chip is not interactive /\n @Prop({ reflect: true }) nonInteractive: boolean = false;\n\n /* Whether remove button should be shown /\n @Prop({ reflect: true }) removable: boolean = false;\n\n /* Variant /\n @Prop({ reflect: true }) variant: \"tag\" \| \"filter\" \| \"input\" = \"tag\";\n\n /* Size /\n @Prop({ reflect: true }) size: \"default\" \| \"small\" \| \"large\" = \"default\";\n\n /* Type /\n @Prop({ reflect: true }) type: \"default\" \| \"secondary\" \| \"important\" = \"default\";\n\n /* Counter /\n @Prop() counter: string = \"\";\n\n /* Label of remove button for screenreaders /\n @Prop() removeLabel: string = \"\";\n\n /* Active /\n @Prop({ reflect: true }) active: boolean = false;\n\n /* Disabled /\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /* Tabindex of link/button /\n @Prop({ attribute: \"a11y-tabindex\" }) a11yTabindex: 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 link/button /\n @Prop({ attribute: \"a11y-describedby\" }) a11yDescribedby: 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 /\n For Adobe Analytics.\n * Will be rendered as value of `s-object-id` attribute to the remove button element.\n * Default value will be taken from `removeLabel` prop.\n /\n @Prop() removeAnalyticsId: string;\n\n @Element() element: HTMLStzhChipElement;\n\n /* Focus menu item /\n @Method()\n async setFocus() {\n this.chip.focus();\n }\n\n /* Chip click event /\n @Event() stzhClick: EventEmitter<StzhChipClickEvent>;\n\n /* Chip remove event /\n @Event() stzhRemove: EventEmitter<StzhChipRemoveEvent>;\n\n /* Focus event /\n @Event() stzhFocus: EventEmitter<StzhChipFocusEvent>;\n\n /* Input blur event /\n @Event() stzhBlur: EventEmitter<StzhChipBlurEvent>;\n\n private chip: HTMLButtonElement \| HTMLAnchorElement;\n private text: HTMLElement;\n private focusedByInput: boolean = false;\n\n componentDidRender() {\n requestAnimationFrame(() => {\n this.chip.setAttribute(\"s-object-id\", this.analyticsId \|\| this.text.innerText);\n });\n }\n\n private renderInner(): DocumentFragment {\n return (\n <Fragment>\n <div class=\"stzh-chip__icon-wrapper\">\n {this.icon ?\n <stzh-icon class=\"stzh-chip__icon\" name={this.icon}></stzh-icon>\n :\n <slot name=\"icon\"></slot>\n }\n </div>\n\n <stzh-clamp\n lines={1}\n class=\"stzh-chip__label\"\n ref={(el) => (this.text = el as HTMLElement)}\n >\n {this.label ? this.label : <slot></slot>}\n {this.counter &&\n <span class=\"stzh-chip__vhidden\">\n  ({this.counter})\n </span>\n }\n </stzh-clamp>\n\n {this.counter &&\n <div class=\"stzh-chip__counter\" aria-hidden=\"true\">\n {this.counter}\n </div>\n }\n </Fragment>\n );\n }\n\n private onRootFocus = () => {\n if (!this.focusedByInput) {\n this.setFocus();\n }\n\n this.focusedByInput = false;\n }\n\n private onFocus = (event: FocusEvent) => {\n this.focusedByInput = true;\n\n const focusEvent = new FocusEvent(\"focus\", {\n view: window,\n bubbles: false,\n cancelable: false\n });\n\n this.element.dispatchEvent(focusEvent);\n this.stzhFocus.emit({\n component: \"stzh-chip\",\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-chip\",\n originalEvent: event\n });\n }\n\n private onClick = (event: MouseEvent) => {\n this.stzhClick.emit({\n component: \"stzh-chip\",\n originalEvent: event\n });\n }\n\n private onRemoveClick = (event: MouseEvent) => {\n this.stzhRemove.emit({\n component: \"stzh-chip\",\n originalEvent: event\n });\n }\n\n render() {\n const classes = {\n \"stzh-chip\": true,\n \"stzh-chip--is-active\": this.active,\n \"stzh-chip--is-disabled\": this.disabled,\n \"stzh-chip--is-removable\": this.removable,\n \"stzh-chip--has-counter\": !!this.counter,\n [`stzh-chip--type-${this.type}`]: !!this.type,\n [`stzh-chip--size-${this.size}`]: !!this.size,\n [`stzh-chip--${this.variant}`]: !!this.variant\n };\n\n const Chip = this.nonInteractive ? \"div\" :\n this.href ? \"a\" : \"button\";\n\n return (\n <Host tabindex={this.disabled ? null : \"-1\"} onFocus={this.onRootFocus}>\n <div class={classes}>\n {this.removable &&\n <button\n class=\"stzh-chip__remove\"\n onClick={this.onRemoveClick}\n disabled={this.disabled}\n aria-label={this.removeLabel}\n type=\"button\"\n s-object-id={this.removeAnalyticsId \|\| this.removeLabel}\n >\n <stzh-icon class=\"stzh-chip__remove-icon\" name=\"close\"></stzh-icon>\n </button>\n }\n\n {this.href ?\n <Chip\n ref={(el) => (this.chip = el as HTMLAnchorElement)}\n class={{\n \"stzh-chip__button\": true,\n \"is-button\": !this.nonInteractive && !this.href,\n \"is-link\": !this.nonInteractive && !!this.href\n }}\n href={this.disabled ? null : this.href}\n target={this.target}\n tabindex={this.a11yTabindex}\n aria-label={this.a11yLabel \|\| null}\n aria-describedby={this.a11yDescribedby \|\| null}\n onClick={this.onClick}\n onFocus={this.onFocus}\n onBlur={this.onBlur}\n >\n {this.renderInner()}\n </Chip>\n :\n <Chip\n ref={(el) => (this.chip = el as HTMLButtonElement)}\n class={{\n \"stzh-chip__button\": true,\n \"is-button\": !this.nonInteractive && !this.href,\n \"is-link\": !this.nonInteractive && !!this.href\n }}\n disabled={this.disabled}\n type=\"button\"\n tabindex={this.a11yTabindex}\n aria-label={this.a11yLabel \|\| null}\n aria-describedby={this.a11yDescribedby \|\| null}\n onClick={this.onClick}\n onFocus={this.onFocus}\n onBlur={this.onBlur}\n >\n {this.renderInner()}\n </Chip>\n }\n </div>\n </Host>\n );\n }\n}\n","stzh-clamp {\n @include host;\n --current-lines: var(--lines, 0);\n\n @include mq($from: small) {\n --current-lines: var(--lines-small, var(--lines, 0));\n }\n\n @include mq($from: medium) {\n --current-lines: var(--lines-medium, var(--lines-small, var(--lines, 0)));\n }\n\n @include mq($from: large) {\n --current-lines: var(--lines-large, var(--lines-medium, var(--lines-small, var(--lines, 0))));\n }\n\n @include mq($from: ultra) {\n --current-lines: var(--lines-ultra, var(--lines-large, var(--lines-medium, var(--lines-small, var(--lines, 0)))));\n }\n\n width: 100%;\n color: inherit;\n font-family: inherit;\n font-weight: inherit;\n font-style: inherit;\n font-size: inherit;\n line-height: inherit;\n}\n\n.stzh-clamp {\n position: relative;\n\n &__text {\n @include wordWrap;\n display: -webkit-box;\n -webkit-box-orient: vertical;\n overflow: hidden;\n\n & > :first-child {\n margin-top: 0 !important;\n }\n\n & > :last-child {\n margin-bottom: 0 !important;\n }\n\n &.is-clone {\n position: absolute;\n visibility: hidden;\n opacity: 0;\n top: 0;\n left: 0;\n width: 100%;\n }\n }\n\n &__trigger {\n margin-top: space('xxsmall');\n }\n\n &--is-not-expanded &__text,\n &__text.is-clone {\n -webkit-line-clamp: var(--current-lines);\n line-clamp: var(--current-lines);\n }\n}\n","import {\n Component,\n Host,\n h,\n Prop,\n Method,\n Element,\n Event,\n EventEmitter\n} from \"@stencil/core\";\n\nimport {\n StzhClampClampEvent,\n StzhClampExpandEvent\n} from \"../../index\";\n\nimport { fetchTranslations } from \"../../utils/translation-utils\";\nimport { StzhClampLocalizedText } from \"./stzh-clamp.localization\";\n\n/\n \n /\n@Component({\n tag: \"stzh-clamp\",\n styleUrl: \"stzh-clamp.scss\"\n})\nexport class StzhClamp {\n /* Translation strings /\n @Prop() localization: StzhClampLocalizedText;\n\n /* Line number /\n @Prop() lines: number = 1;\n /* Line number above small breakpoint /\n @Prop() linesSmall: number = 0;\n /* Line number above medium breakpoint /\n @Prop() linesMedium: number = 0;\n /* Line number above large breakpoint /\n @Prop() linesLarge: number = 0;\n /* Line number above ultra breakpoint /\n @Prop() linesUltra: number = 0;\n\n /* Whether clamping is expanded /\n @Prop() showExpandLink: boolean = false;\n\n /* Whether clamping is expanded /\n @Prop({ mutable: true, reflect: true }) expanded: boolean = false;\n\n /* Whether the text is currently clamped (readonly) /\n @Prop({ mutable: true, reflect: true }) clamped: boolean = false;\n\n @Element() element: HTMLStzhClampElement;\n\n /* Event when clamping state changed /\n @Event() stzhClamp: EventEmitter<StzhClampClampEvent>;\n\n /* Event when expanding state changed */\n @Event() stzhExpand: EventEmitter<StzhClampExpandEvent>;\n\n @Method()\n async update() {\n this.textCloneElement.innerHTML = this.textElement.innerHTML;\n this.updateClamped();\n }\n\n private textElement: HTMLElement;\n private textCloneElement: HTMLElement;\n\n private debounceResize: number;\n private resizeObserver: ResizeObserver;\n private mutationObserver: MutationObserver;\n\n private updateClamped = () => {\n if (!this.textCloneElement) {\n return;\n }\n\n const beforeClamped = this.clamped;\n this.clamped = this.textCloneElement.scrollHeight > this.textCloneElement.clientHeight;\n\n if (beforeClamped !== this.clamped) {\n this.stzhClamp.emit({\n component: \"stzh-clamp\",\n clamped: this.clamped\n });\n }\n }\n\n private handleResize = () => {\n if (this.debounceResize) {\n window.cancelAnimationFrame(this.debounceResize);\n }\n\n this.debounceResize = requestAnimationFrame(this.updateClamped);\n }\n\n private handleMutaton = () => {\n this.update();\n }\n\n private handleExpandClick = () => {\n this.expanded = !this.expanded;\n\n this.stzhExpand.emit({\n component: \"stzh-clamp\",\n expanded: this.expanded\n });\n }\n\n async componentWillLoad() {\n if (!this.localization) {\n this.localization = await fetchTranslations(this.element, \"clamp\");\n }\n }\n\n componentDidLoad() {\n this.mutationObserver = new MutationObserver(this.handleMutaton);\n this.mutationObserver.observe(this.textElement, {\n childList: true,\n subtree: true,\n });\n }\n\n componentDidRender() {\n this.update();\n }\n\n connectedCallback() {\n this.resizeObserver = new ResizeObserver(this.handleResize);\n this.resizeObserver.observe(this.element);\n }\n\n disconnectedCallback() {\n if (this.resizeObserver) {\n this.resizeObserver.disconnect();\n }\n\n if (this.mutationObserver) {\n this.mutationObserver.disconnect();\n }\n }\n\n render() {\n const classes = {\n \"stzh-clamp\": true,\n \"stzh-clamp--is-not-expanded\": !this.expanded\n };\n\n return (\n <Host\n style={{\n '--lines': this.lines ? this.lines.toString() : null,\n '--lines-small': this.linesSmall ? this.linesSmall.toString() : null,\n '--lines-medium': this.linesMedium ? this.linesMedium.toString() : null,\n '--lines-large': this.linesLarge ? this.linesLarge.toString() : null,\n '--lines-ultra': this.linesUltra ? this.linesUltra.toString() : null,\n }}\n >\n <div class={classes}>\n <div\n ref={(el) => (this.textElement = el as HTMLDivElement)}\n class=\"stzh-clamp__text\"\n >\n <slot></slot>\n </div>\n\n <div\n ref={(el) => (this.textCloneElement = el as HTMLDivElement)}\n class=\"stzh-clamp__text is-clone\"\n aria-hidden=\"true\"\n ></div>\n\n {this.showExpandLink && this.clamped &&\n <stzh-link\n class=\"stzh-clamp__trigger\"\n a11yTabindex=\"-1\"\n aria-hidden=\"true\"\n onClick={this.handleExpandClick}\n >\n {!this.expanded ? this.localization.showMore : this.localization.showLess}\n </stzh-link>\n }\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/stzh-components.cjs.js CHANGED Viewed

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-bf651831.js');
-const appGlobals = require('./app-globals-7c3a8979.js');
+const appGlobals = require('./app-globals-dff738b3.js');
 /*
  Stencil Client Patch Browser v3.3.0 | MIT Licensed | https://stenciljs.com

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

@@ -150,7 +150,7 @@ const StzhDatalistItem = class {
         "stzh-datalist-item__value": true,
         "is-button": isButton,
         "is-link": !!this.href
-      }, href: this.href, rel: this.rel, target: this.target, download: this.download, "aria-labelledby": Item !== 'div' ? `${this.datalistItemId}-label ${this.datalistItemId}-value ${this.datalistItemId}-meta` : null, "aria-controls": this.a11yControls, "aria-expanded": typeof this.a11yExpanded !== "undefined"
+      }, href: this.href, rel: this.rel, target: this.target, download: this.download, "aria-labelledby": Item !== 'div' ? `${this.datalistItemId}-label ${this.datalistItemId}-value ${this.datalistItemId}-meta` : null, "aria-controls": this.a11yControls || null, "aria-expanded": typeof this.a11yExpanded !== "undefined"
         ? (this.a11yExpanded ? "true" : "false") : null }, this.external && index.h("div", { class: "stzh-datalist-item__vhidden" }, this.localization.$globals.externalLinkLabel), this.download && index.h("div", { class: "stzh-datalist-item__vhidden" }, this.localization.$globals.downloadLinkLabel), index.h("stzh-richtext", { class: "stzh-datalist-item__richtext", innerHTML: this.value }, index.h("slot", { name: "value" }))), index.h(Item, { "aria-hidden": this.statusLabel || this.meta ? null : "true", tabindex: "-1", id: `${this.datalistItemId}-meta`, class: {
         "stzh-datalist-item__meta": true,
         "is-button": isButton,

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

	@@ -1 +1 @@
1	- {"file":"stzh-datalist.stzh-datalist-item.entry.cjs.js","mappings":"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","names":["media","addMediaChangeListener","removeMediaChangeListener","h","Host","Fragment","fetchTranslations"],"sources":["./src/components/stzh-datalist/stzh-datalist.scss?tag=stzh-datalist&encapsulation=scoped","./src/components/stzh-datalist/stzh-datalist.tsx","./src/components/stzh-datalist-item/stzh-datalist-item.scss?tag=stzh-datalist-item&encapsulation=scoped","./src/components/stzh-datalist-item/stzh-datalist-item.tsx"],"sourcesContent":[":host {\n --item-label-min-width: 120px;\n\n @include mq($from: smallheader) {\n --item-label-min-width: 144px;\n }\n\n &[disable-label-min-width]:not([disable-label-min-width=\"false\"]) {\n --item-label-min-width: none;\n }\n}\n\n:host ::slotted(stzh-details),\n.stzh-datalist stzh-details {\n --content-grid-column: 1 / 6;\n --content-padding: #{space('large')} 0 #{spaceCurveValue('medium')};\n --content-border-bottom: 1px solid #{$baseBorderColor};\n\n @include mq($from: medium) {\n --content-padding: #{space('large')} 0 #{spaceCurveValue('medium', 'medium')};\n }\n\n @include mq($from: large) {\n --content-padding: #{space('large')} 0 #{spaceCurveValue('medium', 'large')};\n }\n}\n\n.stzh-datalist {\n &__list {\n width: 100%;\n }\n\n /* Has hidden border variant /\n\n &--has-hidden-border &__list {\n margin-top: calc(#{space('xsmall')} / -2);\n margin-bottom: calc(#{space('xsmall')} / -2);\n }\n\n / Vertical variant /\n\n &--direction-horizontal &__list {\n width: 100%;\n display: grid;\n border-collapse: collapse;\n grid-template-columns: auto auto minmax(auto, 1fr) auto auto;\n align-items: stretch;\n }\n}\n","import {\n Component,\n Host,\n h,\n Element,\n Watch,\n Prop,\n Event,\n EventEmitter\n} from \"@stencil/core\";\n\nimport {\n StzhDatalistItemEntry,\n StzhDatalistDirectionChangeEvent,\n StzhDatalistHideBorderChangeEvent\n} from \"../../index\";\n\nimport {\n media,\n addMediaChangeListener,\n removeMediaChangeListener\n} from '../../utils/media-utils';\n\n/\n /\n@Component({\n tag: \"stzh-datalist\",\n styleUrl: \"stzh-datalist.scss\",\n scoped: true\n})\nexport class StzhDatalist {\n /** Direction /\n @Prop({ reflect: true }) direction: \"vertical\" \| \"horizontal\" = \"vertical\";\n\n /* Direction above small breakpoint /\n @Prop({ reflect: true }) directionSmall: \"vertical\" \| \"horizontal\" \| \"inherit\" = \"horizontal\";\n\n /* Direction above medium breakpoint /\n @Prop({ reflect: true }) directionMedium: \"vertical\" \| \"horizontal\" \| \"inherit\" = \"inherit\";\n\n /* Direction above large breakpoint /\n @Prop({ reflect: true }) directionLarge: \"vertical\" \| \"horizontal\" \| \"inherit\" = \"inherit\";\n\n /* Direction above ultra breakpoint /\n @Prop({ reflect: true }) directionUltra: \"vertical\" \| \"horizontal\" \| \"inherit\" = \"inherit\";\n\n /* Hide border lines between items /\n @Prop({ reflect: true }) hideBorder: boolean = false;\n\n /\n Whether to disable min-width of datalist item label for the `horizontal` variant.\n \n If `false`, the default `min-width` is `144px` (for >= 800px) and `120px` (for < 800px).\n * If `true`, the `min-width` is `none`, so the label column, will have the width of cell with the widest content.\n \n You can also overwrite the label min-width via CSS with the custom property `--item-label-min-width`.\n /\n @Prop({ reflect: true }) disableLabelMinWidth: boolean = false;\n\n /* Current direction in use (readonly) /\n @Prop({ reflect: true }) currentDirection: \"vertical\" \| \"horizontal\";\n\n /\n Items in datalist\n * Array of objects that must at least include `value` attribute.\n * Can optionally contain `leadingIcon`, `label`, `meta`, `icon`, `iconLabel`, `iconTooltip`, `href`, `statusLabel`, `statusType` attribute and be nested to display deeper levels:\n * `[{\"value\":\"Value 1\", \"label\": \"Label 1\"}, {\"value\":\"Value 2\", \"label\": \"Label 2\", \"items\": [...]}]`\n /\n @Prop() items: StzhDatalistItemEntry[] \| string = [];\n private _items: StzhDatalistItemEntry[] = [];\n\n\n /* Direction attribute change event /\n @Event() stzhDirectionChange: EventEmitter<StzhDatalistDirectionChangeEvent>;\n\n /* Hide border change event /\n @Event() stzhHideBorderChange: EventEmitter<StzhDatalistHideBorderChangeEvent>;\n\n @Element() element: HTMLStzhDatalistElement;\n\n @Watch(\"hideBorder\")\n hideBorderWatcher(newValue: boolean) {\n this.stzhHideBorderChange.emit({\n component: \"stzh-datalist\",\n value: newValue\n });\n }\n\n @Watch(\"direction\")\n @Watch(\"directionSmall\")\n @Watch(\"directionMedium\")\n @Watch(\"directionLarge\")\n @Watch(\"directionUltra\")\n directionWatcher() {\n this.resizeHandler();\n }\n\n @Watch(\"currentDirection\")\n currentDirectionWatcher(newValue: \"vertical\" \| \"horizontal\") {\n this.stzhDirectionChange.emit({\n component: \"stzh-datalist\",\n value: newValue\n });\n }\n\n @Watch(\"items\")\n itemsWatcher(newValue: any[] \| string) {\n if (typeof newValue === \"string\") {\n this._items = JSON.parse(newValue);\n } else {\n this._items = newValue;\n }\n }\n\n resizeHandler = () => {\n if (media(\"ultra\").matches && this.directionUltra !== \"inherit\") {\n this.currentDirection = this.directionUltra;\n } else if (media(\"large\").matches && this.directionLarge !== \"inherit\") {\n this.currentDirection = this.directionLarge;\n } else if (media(\"medium\").matches && this.directionMedium !== \"inherit\") {\n this.currentDirection = this.directionMedium;\n } else if (media(\"small\").matches && this.directionSmall !== \"inherit\") {\n this.currentDirection = this.directionSmall;\n } else {\n this.currentDirection = this.direction;\n }\n }\n\n async componentWillLoad() {\n this.itemsWatcher(this.items);\n this.hideBorderWatcher(this.hideBorder);\n this.resizeHandler();\n }\n\n connectedCallback() {\n addMediaChangeListener(this.resizeHandler);\n }\n\n disconnectedCallback() {\n removeMediaChangeListener(this.resizeHandler);\n }\n\n render() {\n const classes = {\n \"stzh-datalist\": true,\n \"stzh-datalist--has-hidden-border\": this.hideBorder,\n [`stzh-datalist--direction-${this.currentDirection}`]: !!this.currentDirection\n };\n\n return (\n <Host>\n <div class={classes}>\n <div class=\"stzh-datalist__list\" role=\"list\">\n {this._items.map((item) =>\n <stzh-datalist-item {...item}>\n {item.items && item.items.length > 0 &&\n <stzh-datalist items={item.items}></stzh-datalist>\n }\n </stzh-datalist-item>\n )}\n <slot></slot>\n </div>\n </div>\n </Host>\n );\n }\n}\n",":host {\n --font-family: var(--stzh-font-family-regular);\n --font-weight: var(--stzh-font-weight-regular);\n --color: inherit;\n --action-display: flex;\n --label-min-width: var(--item-label-min-width, none);\n --leading-icon-background-color: #{$colorGrey5};\n --leading-icon-color: #{$colorGrey70};\n\n --hover-leading-icon-background-color: #{$colorPrimaryHover};\n --hover-leading-icon-color: #{$colorWhite};\n\n --horizontal-min-height: 48px;\n\n display: contents;\n\n &[href]:not([href=\"\"]),\n &[a11y-expanded],\n &[a11y-controls] {\n --color: #{$colorPrimary};\n --hover-color: #{$colorPrimaryHover};\n }\n\n ::slotted(stzh-datalist) {\n margin-left: space('large');\n }\n}\n\n.stzh-datalist-item {\n position: relative;\n text-decoration-line: none;\n\n &__vhidden {\n @include visuallyhidden;\n }\n\n &__wrapper {\n flex-grow: 1;\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n }\n\n &__leading,\n &__value,\n &__label,\n &__meta,\n &__action-list {\n color: inherit;\n display: flex;\n align-items: center;\n appearance: none;\n font-family: inherit;\n background: transparent;\n border: none;\n padding: 0;\n text-decoration-line: none;\n\n &.is-button,\n &.is-link {\n cursor: pointer;\n }\n }\n\n &__leading {\n flex-shrink: 0;\n\n &:not(:empty) {\n padding-right: space('xsmall');\n }\n }\n\n &__leading-icon-container {\n color: var(--leading-icon-color);\n background-color: var(--leading-icon-background-color);\n width: 40px;\n height: 40px;\n display: flex;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n transition-property: color, background-color;\n transition-duration: $baseTransitionAnimationSpeed;\n }\n\n &__value {\n @include fontCurve('p1');\n font-family: var(--font-family);\n font-weight: var(--font-weight);\n flex-grow: 1;\n }\n\n &__value,\n &__icon {\n color: var(--color);\n }\n\n &__label,\n &__meta {\n @include fontCurve('caption');\n }\n\n &__meta {\n justify-content: flex-end;\n }\n\n &__label {\n @include font('medium');\n color: $baseLeadColor;\n }\n\n &__action-list {\n display: var(--action-display);\n justify-content: center;\n text-align: center;\n\n &:not(:empty) {\n padding-left: space('xsmall');\n }\n }\n\n &__action {\n &.is-non-interactive {\n display: flex;\n justify-content: center;\n align-items: center;\n width: $formInputHeightTiny;\n height: $formInputHeightTiny;\n }\n\n &.is-button[variant=\"tertiary\"] {\n --color: inherit;\n }\n }\n\n &__value,\n &__icon {\n transition: color $baseTransitionAnimationSpeed;\n }\n\n &__richtext {\n color: inherit;\n font-family: inherit;\n font-weight: inherit;\n }\n\n &__interactive {\n position: absolute;\n top: 0;\n left: 0;\n }\n\n / Button variant /\n\n &--is-button &__icon.is-open {\n display: none;\n }\n\n &--is-button#{&}--is-expanded &__icon {\n &.is-closed {\n display: none;\n }\n\n &.is-open {\n display: inline-flex;\n }\n }\n\n / Interactive variant /\n\n &--is-interactive:hover &__value,\n &--is-interactive:hover &__icon {\n color: var(--hover-color);\n }\n\n &--is-interactive:hover &__value {\n text-decoration-line: underline;\n }\n\n &--is-interactive:hover &__leading-icon-container,\n &--is-interactive:focus-within &__leading-icon-container {\n color: var(--hover-leading-icon-color);\n background-color: var(--hover-leading-icon-background-color);\n }\n\n / Vertical variant /\n\n &--direction-vertical {\n display: flex;\n padding-top: space('xsmall');\n padding-bottom: space('xsmall');\n }\n\n &--direction-vertical#{&}--has-hidden-border {\n padding-top: calc(#{space('xsmall')} / 2);\n padding-bottom: calc(#{space('xsmall')} / 2);\n }\n\n &--direction-vertical:not(#{&}--has-hidden-border) {\n border-bottom: 1px solid $baseBorderColor;\n }\n\n &--direction-vertical &__leading-icon-container {\n width: 40px;\n height: 40px;\n }\n\n &--direction-vertical &__leading-icon {\n --size: #{iconSize('medium')};\n }\n\n &--direction-vertical &__meta {\n flex-direction: column;\n }\n\n / Horizontal variant /\n\n &--direction-horizontal,\n &--direction-horizontal + &__nested {\n display: contents;\n }\n\n &--direction-horizontal + &__nested &__nested-inner {\n grid-column: 1 / 6;\n }\n\n &--direction-horizontal &__leading,\n &--direction-horizontal &__value,\n &--direction-horizontal &__label,\n &--direction-horizontal &__meta,\n &--direction-horizontal &__action-list {\n min-height: var(--horizontal-min-height);\n }\n\n &--direction-horizontal &__label,\n &--direction-horizontal &__value,\n &--direction-horizontal &__meta {\n padding-top: space('xsmall');\n padding-bottom: space('xsmall');\n }\n\n &--direction-horizontal#{&}--has-hidden-border &__label,\n &--direction-horizontal#{&}--has-hidden-border &__value,\n &--direction-horizontal#{&}--has-hidden-border &__meta {\n padding-top: calc(#{space('xsmall')} / 2);\n padding-bottom: calc(#{space('xsmall')} / 2);\n }\n\n // &--direction-horizontal:not(#{&}--has-hidden-border) &__leading,\n &--direction-horizontal:not(#{&}--has-hidden-border) &__label,\n &--direction-horizontal:not(#{&}--has-hidden-border) &__value,\n &--direction-horizontal:not(#{&}--has-hidden-border) &__meta,\n &--direction-horizontal:not(#{&}--has-hidden-border) &__action-list {\n border-bottom: 1px solid $baseBorderColor;\n }\n\n &--direction-horizontal &__label {\n &:not(:empty) {\n min-width: var(--label-min-width);\n padding-right: space('xsmall');\n }\n }\n\n &--direction-horizontal &__meta {\n &:not(:empty) {\n padding-left: space('xsmall');\n }\n }\n\n &--direction-horizontal &__leading-icon-container {\n width: 32px;\n height: 32px;\n }\n\n &--direction-horizontal &__meta-status + &__meta-text {\n margin-left: space('xsmall');\n }\n}\n","import {\n Component,\n Host,\n h,\n Element,\n Prop,\n Event,\n EventEmitter,\n Fragment,\n State,\n Watch\n} from \"@stencil/core\";\n\nimport {\n StzhDatalistItemActionClickEvent,\n StzhDatalistDirectionChangeEvent,\n StzhDatalistHideBorderChangeEvent\n} from \"../../index\";\n\nimport { fetchTranslations, StzhLocaleComponent } from \"../../utils/translation-utils\";\n\nlet datalistItemCounter = 0;\n\n/\n @slot - Slot for nested datalist\n * @slot value - Slot for value (or use value slot instead)\n /\n@Component({\n tag: \"stzh-datalist-item\",\n styleUrl: \"stzh-datalist-item.scss\",\n scoped: true\n})\nexport class StzhDatalistItem {\n /* Translation strings /\n @Prop() localization: StzhLocaleComponent;\n\n /* Direction /\n @Prop({ reflect: true }) direction: \"vertical\" \| \"horizontal\" = \"vertical\";\n\n /* Link /\n @Prop({ reflect: true }) href: string;\n\n /* Rel (if href is used) /\n @Prop() rel: string;\n\n /* Target (if href is used) /\n @Prop() target: string;\n\n /* Download attribute of link (if `href` used) /\n @Prop() download: string;\n\n /* Leading icon /\n @Prop() leadingIcon: string;\n\n /* Icon of action button (if href is used, will only be for presentation and default to link icon) /\n @Prop() icon: string;\n\n /* Overwrite aria-label of action button (default aria label is `label` and `value`). /\n @Prop() iconLabel: string;\n\n /* Tooltip content of action button. Overwrites aria-label (set by default or `iconLabel`) of action button. /\n @Prop() iconTooltip: string;\n\n /* Label /\n @Prop() label: string = \"\";\n\n /* Value (or use value slot instead) /\n @Prop() value: string = \"\";\n\n /* Meta /\n @Prop() meta: string = \"\";\n\n /* Status Label /\n @Prop() statusLabel: string = \"\";\n\n /* Status Type /\n @Prop() statusType: \"default\" \| \"success\" \| \"warning\" \| \"error\" \| \"info\" = \"default\";\n\n /* Hide border lines /\n @Prop({ reflect: true }) hideBorder: boolean = false;\n\n /* Aria expanded of link/button /\n @Prop({ reflect: true, attribute: \"a11y-expanded\" }) a11yExpanded: boolean;\n\n /* Aria controls of link/button /\n @Prop({ attribute: \"a11y-controls\" }) a11yControls: string;\n\n /* Whether rel contains external /\n @State() external: boolean = false;\n\n /* Item action click event */\n @Event() stzhItemActionClick: EventEmitter<StzhDatalistItemActionClickEvent>;\n\n @Element() element: HTMLStzhDatalistItemElement;\n\n @Watch(\"rel\")\n externalWatcher() {\n this.external = this.rel && this.rel.includes(\"external\");\n }\n\n private datalist: HTMLStzhDatalistElement;\n private datalistItemId: string;\n\n private actionClick = (originalEvent: MouseEvent) => {\n this.stzhItemActionClick.emit({\n component: \"stzh-datalist-item\",\n originalEvent\n });\n }\n\n private handleDirectionChange = (event: CustomEvent<StzhDatalistDirectionChangeEvent>) => {\n this.direction = event.detail.value;\n }\n\n private handleHideBorderChange = (event: CustomEvent<StzhDatalistHideBorderChangeEvent>) => {\n this.hideBorder = event.detail.value;\n }\n\n private renderInner(isButton: boolean): DocumentFragment {\n const Item = isButton ? \"button\" : (this.href ? \"a\" : \"div\");\n\n return (\n <Fragment>\n <Item\n aria-hidden={this.label ? null : \"true\"}\n tabindex=\"-1\"\n id={`${this.datalistItemId}-label`}\n class={{\n \"stzh-datalist-item__label\": true,\n \"is-button\": isButton,\n \"is-link\": !!this.href\n }}\n href={this.href}\n rel={this.rel}\n target={this.target}\n download={this.download}\n >\n {this.label}\n </Item>\n\n <Item\n id={`${this.datalistItemId}-value`}\n class={{\n \"stzh-datalist-item__value\": true,\n \"is-button\": isButton,\n \"is-link\": !!this.href\n }}\n href={this.href}\n rel={this.rel}\n target={this.target}\n download={this.download}\n aria-labelledby={Item !== 'div' ? `${this.datalistItemId}-label ${this.datalistItemId}-value ${this.datalistItemId}-meta` : null}\n aria-controls={this.a11yControls}\n aria-expanded={typeof this.a11yExpanded !== \"undefined\"\n ? (this.a11yExpanded ? \"true\" : \"false\") : null}\n >\n {this.external && <div class=\"stzh-datalist-item__vhidden\">{this.localization.$globals.externalLinkLabel}</div>}\n {this.download && <div class=\"stzh-datalist-item__vhidden\">{this.localization.$globals.downloadLinkLabel}</div>}\n <stzh-richtext class=\"stzh-datalist-item__richtext\" innerHTML={this.value}>\n <slot name=\"value\"></slot>\n </stzh-richtext>\n </Item>\n\n <Item\n aria-hidden={this.statusLabel \|\| this.meta ? null : \"true\"}\n tabindex=\"-1\"\n id={`${this.datalistItemId}-meta`}\n class={{\n \"stzh-datalist-item__meta\": true,\n \"is-button\": isButton,\n \"is-link\": !!this.href\n }}\n href={this.href}\n rel={this.rel}\n target={this.target}\n download={this.download}\n >\n {this.statusLabel &&\n <stzh-status\n class=\"stzh-datalist-item__meta-status\"\n label={this.statusLabel}\n type={this.statusType}\n ></stzh-status>\n }\n {this.meta && <span class=\"stzh-datalist-item__meta-text\">{this.meta}</span>}\n </Item>\n </Fragment>\n )\n }\n\n private renderLeadingIcon(isButton: boolean): HTMLElement {\n const Item = isButton ? \"button\" : (this.href ? \"a\" : \"div\");\n\n return (\n <Item\n role=\"presentation\"\n aria-hidden=\"true\"\n tabindex=\"-1\"\n class={{\n \"stzh-datalist-item__leading\": true,\n \"is-button\": isButton,\n \"is-link\": !!this.href\n }}\n href={this.href}\n rel={this.rel}\n target={this.target}\n download={this.download}\n >\n {this.leadingIcon &&\n <div class=\"stzh-datalist-item__leading-icon-container\">\n <stzh-icon class=\"stzh-datalist-item__leading-icon\" name={this.leadingIcon}></stzh-icon>\n </div>\n }\n </Item>\n );\n }\n\n async connectedCallback() {\n this.datalist = this.element.closest(\"stzh-datalist\");\n\n if (this.datalist) {\n this.direction = this.datalist.currentDirection;\n this.hideBorder = this.datalist.hideBorder;\n\n this.datalist.addEventListener(\"stzhDirectionChange\", this.handleDirectionChange);\n this.datalist.addEventListener(\"stzhHideBorderChange\", this.handleHideBorderChange);\n }\n }\n\n disconnectedCallback() {\n if (this.datalist) {\n this.datalist.removeEventListener(\"stzhDirectionChange\", this.handleDirectionChange);\n this.datalist.removeEventListener(\"stzhHideBorderChange\", this.handleHideBorderChange);\n this.datalist = null;\n }\n }\n\n async componentWillLoad() {\n this.datalistItemId = `stzh-datalist-item-${datalistItemCounter++}`;\n this.externalWatcher();\n\n if (!this.localization) {\n this.localization = await fetchTranslations(this.element, \"datalist-item\");\n }\n }\n\n render() {\n const isButton = typeof this.a11yExpanded !== \"undefined\"\n \|\| typeof this.a11yControls !== \"undefined\";\n\n const hasActionButton = !this.href && this.icon;\n\n const classes = {\n \"stzh-datalist-item\": true,\n \"stzh-datalist-item--is-interactive\": !!this.href \|\| isButton,\n \"stzh-datalist-item--is-link\": !!this.href,\n \"stzh-datalist-item--is-button\": isButton,\n \"stzh-datalist-item--is-expanded\": this.a11yExpanded,\n \"stzh-datalist-item--has-hidden-border\": this.hideBorder,\n [`stzh-datalist-item--direction-${this.direction}`]: !!this.direction\n };\n\n const Item = isButton ? \"button\" : (this.href ? \"a\" : \"div\");\n\n const ActionButton = () => {\n return (\n <stzh-button\n class={{\n \"stzh-datalist-item__action\": true,\n \"is-button\": true\n }}\n variant=\"tertiary\"\n size=\"tiny\"\n aria-label={this.iconLabel \|\| (`${this.label} ${this.value}`)}\n iconOnly={true}\n icon={this.icon}\n onClick={this.actionClick}\n ></stzh-button>\n );\n }\n\n return (\n <Host role=\"listitem\">\n <div class={classes}>\n {this.direction === \"horizontal\" ?\n <Fragment>\n {this.renderLeadingIcon(isButton)}\n {this.renderInner(isButton)}\n </Fragment>\n :\n <Fragment>\n {this.renderLeadingIcon(isButton)}\n <div class=\"stzh-datalist-item__wrapper\">\n {this.renderInner(isButton)}\n </div>\n </Fragment>\n }\n <Item\n role={hasActionButton ? null : \"presentation\"}\n aria-hidden={hasActionButton ? null : \"true\"}\n tabindex=\"-1\"\n class={{\n \"stzh-datalist-item__action-list\": true,\n \"is-button\": isButton,\n \"is-link\": !!this.href\n }}\n href={this.href}\n rel={this.rel}\n target={this.target}\n download={this.download}\n >\n {this.href &&\n (this.download ?\n <div class=\"stzh-datalist-item__action is-non-interactive\">\n <stzh-icon class=\"stzh-datalist-item__icon\" name={this.icon ? this.icon : \"download\"}></stzh-icon>\n </div>\n :\n <div class=\"stzh-datalist-item__action is-non-interactive\">\n <stzh-icon class=\"stzh-datalist-item__icon\" name={this.icon ? this.icon : (this.external ? \"external-link\" : \"arrow-right\")}></stzh-icon>\n </div>\n )\n }\n\n {isButton &&\n <div class=\"stzh-datalist-item__action is-non-interactive\">\n <stzh-icon class=\"stzh-datalist-item__icon is-closed\" name={this.icon ? this.icon : \"plus\"}></stzh-icon>\n <stzh-icon class=\"stzh-datalist-item__icon is-open\" name={this.icon ? this.icon : \"minus\"}></stzh-icon>\n </div>\n }\n\n {hasActionButton &&\n (this.iconTooltip ?\n <stzh-tooltip content={this.iconTooltip}>\n {ActionButton()}\n </stzh-tooltip>\n :\n ActionButton())\n }\n </Item>\n </div>\n\n <div class=\"stzh-datalist-item__nested\">\n <div class=\"stzh-datalist-item__nested-inner\">\n <slot></slot>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"stzh-datalist.stzh-datalist-item.entry.cjs.js","mappings":"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","names":["media","addMediaChangeListener","removeMediaChangeListener","h","Host","Fragment","fetchTranslations"],"sources":["./src/components/stzh-datalist/stzh-datalist.scss?tag=stzh-datalist&encapsulation=scoped","./src/components/stzh-datalist/stzh-datalist.tsx","./src/components/stzh-datalist-item/stzh-datalist-item.scss?tag=stzh-datalist-item&encapsulation=scoped","./src/components/stzh-datalist-item/stzh-datalist-item.tsx"],"sourcesContent":[":host {\n --item-label-min-width: 120px;\n\n @include mq($from: smallheader) {\n --item-label-min-width: 144px;\n }\n\n &[disable-label-min-width]:not([disable-label-min-width=\"false\"]) {\n --item-label-min-width: none;\n }\n}\n\n:host ::slotted(stzh-details),\n.stzh-datalist stzh-details {\n --content-grid-column: 1 / 6;\n --content-padding: #{space('large')} 0 #{spaceCurveValue('medium')};\n --content-border-bottom: 1px solid #{$baseBorderColor};\n\n @include mq($from: medium) {\n --content-padding: #{space('large')} 0 #{spaceCurveValue('medium', 'medium')};\n }\n\n @include mq($from: large) {\n --content-padding: #{space('large')} 0 #{spaceCurveValue('medium', 'large')};\n }\n}\n\n.stzh-datalist {\n &__list {\n width: 100%;\n }\n\n /* Has hidden border variant /\n\n &--has-hidden-border &__list {\n margin-top: calc(#{space('xsmall')} / -2);\n margin-bottom: calc(#{space('xsmall')} / -2);\n }\n\n / Vertical variant /\n\n &--direction-horizontal &__list {\n width: 100%;\n display: grid;\n border-collapse: collapse;\n grid-template-columns: auto auto minmax(auto, 1fr) auto auto;\n align-items: stretch;\n }\n}\n","import {\n Component,\n Host,\n h,\n Element,\n Watch,\n Prop,\n Event,\n EventEmitter\n} from \"@stencil/core\";\n\nimport {\n StzhDatalistItemEntry,\n StzhDatalistDirectionChangeEvent,\n StzhDatalistHideBorderChangeEvent\n} from \"../../index\";\n\nimport {\n media,\n addMediaChangeListener,\n removeMediaChangeListener\n} from '../../utils/media-utils';\n\n/\n /\n@Component({\n tag: \"stzh-datalist\",\n styleUrl: \"stzh-datalist.scss\",\n scoped: true\n})\nexport class StzhDatalist {\n /** Direction /\n @Prop({ reflect: true }) direction: \"vertical\" \| \"horizontal\" = \"vertical\";\n\n /* Direction above small breakpoint /\n @Prop({ reflect: true }) directionSmall: \"vertical\" \| \"horizontal\" \| \"inherit\" = \"horizontal\";\n\n /* Direction above medium breakpoint /\n @Prop({ reflect: true }) directionMedium: \"vertical\" \| \"horizontal\" \| \"inherit\" = \"inherit\";\n\n /* Direction above large breakpoint /\n @Prop({ reflect: true }) directionLarge: \"vertical\" \| \"horizontal\" \| \"inherit\" = \"inherit\";\n\n /* Direction above ultra breakpoint /\n @Prop({ reflect: true }) directionUltra: \"vertical\" \| \"horizontal\" \| \"inherit\" = \"inherit\";\n\n /* Hide border lines between items /\n @Prop({ reflect: true }) hideBorder: boolean = false;\n\n /\n Whether to disable min-width of datalist item label for the `horizontal` variant.\n \n If `false`, the default `min-width` is `144px` (for >= 800px) and `120px` (for < 800px).\n * If `true`, the `min-width` is `none`, so the label column, will have the width of cell with the widest content.\n \n You can also overwrite the label min-width via CSS with the custom property `--item-label-min-width`.\n /\n @Prop({ reflect: true }) disableLabelMinWidth: boolean = false;\n\n /* Current direction in use (readonly) /\n @Prop({ reflect: true }) currentDirection: \"vertical\" \| \"horizontal\";\n\n /\n Items in datalist\n * Array of objects that must at least include `value` attribute.\n * Can optionally contain `leadingIcon`, `label`, `meta`, `icon`, `iconLabel`, `iconTooltip`, `href`, `statusLabel`, `statusType` attribute and be nested to display deeper levels:\n * `[{\"value\":\"Value 1\", \"label\": \"Label 1\"}, {\"value\":\"Value 2\", \"label\": \"Label 2\", \"items\": [...]}]`\n /\n @Prop() items: StzhDatalistItemEntry[] \| string = [];\n private _items: StzhDatalistItemEntry[] = [];\n\n\n /* Direction attribute change event /\n @Event() stzhDirectionChange: EventEmitter<StzhDatalistDirectionChangeEvent>;\n\n /* Hide border change event /\n @Event() stzhHideBorderChange: EventEmitter<StzhDatalistHideBorderChangeEvent>;\n\n @Element() element: HTMLStzhDatalistElement;\n\n @Watch(\"hideBorder\")\n hideBorderWatcher(newValue: boolean) {\n this.stzhHideBorderChange.emit({\n component: \"stzh-datalist\",\n value: newValue\n });\n }\n\n @Watch(\"direction\")\n @Watch(\"directionSmall\")\n @Watch(\"directionMedium\")\n @Watch(\"directionLarge\")\n @Watch(\"directionUltra\")\n directionWatcher() {\n this.resizeHandler();\n }\n\n @Watch(\"currentDirection\")\n currentDirectionWatcher(newValue: \"vertical\" \| \"horizontal\") {\n this.stzhDirectionChange.emit({\n component: \"stzh-datalist\",\n value: newValue\n });\n }\n\n @Watch(\"items\")\n itemsWatcher(newValue: any[] \| string) {\n if (typeof newValue === \"string\") {\n this._items = JSON.parse(newValue);\n } else {\n this._items = newValue;\n }\n }\n\n resizeHandler = () => {\n if (media(\"ultra\").matches && this.directionUltra !== \"inherit\") {\n this.currentDirection = this.directionUltra;\n } else if (media(\"large\").matches && this.directionLarge !== \"inherit\") {\n this.currentDirection = this.directionLarge;\n } else if (media(\"medium\").matches && this.directionMedium !== \"inherit\") {\n this.currentDirection = this.directionMedium;\n } else if (media(\"small\").matches && this.directionSmall !== \"inherit\") {\n this.currentDirection = this.directionSmall;\n } else {\n this.currentDirection = this.direction;\n }\n }\n\n async componentWillLoad() {\n this.itemsWatcher(this.items);\n this.hideBorderWatcher(this.hideBorder);\n this.resizeHandler();\n }\n\n connectedCallback() {\n addMediaChangeListener(this.resizeHandler);\n }\n\n disconnectedCallback() {\n removeMediaChangeListener(this.resizeHandler);\n }\n\n render() {\n const classes = {\n \"stzh-datalist\": true,\n \"stzh-datalist--has-hidden-border\": this.hideBorder,\n [`stzh-datalist--direction-${this.currentDirection}`]: !!this.currentDirection\n };\n\n return (\n <Host>\n <div class={classes}>\n <div class=\"stzh-datalist__list\" role=\"list\">\n {this._items.map((item) =>\n <stzh-datalist-item {...item}>\n {item.items && item.items.length > 0 &&\n <stzh-datalist items={item.items}></stzh-datalist>\n }\n </stzh-datalist-item>\n )}\n <slot></slot>\n </div>\n </div>\n </Host>\n );\n }\n}\n",":host {\n --font-family: var(--stzh-font-family-regular);\n --font-weight: var(--stzh-font-weight-regular);\n --color: inherit;\n --action-display: flex;\n --label-min-width: var(--item-label-min-width, none);\n --leading-icon-background-color: #{$colorGrey5};\n --leading-icon-color: #{$colorGrey70};\n\n --hover-leading-icon-background-color: #{$colorPrimaryHover};\n --hover-leading-icon-color: #{$colorWhite};\n\n --horizontal-min-height: 48px;\n\n display: contents;\n\n &[href]:not([href=\"\"]),\n &[a11y-expanded],\n &[a11y-controls] {\n --color: #{$colorPrimary};\n --hover-color: #{$colorPrimaryHover};\n }\n\n ::slotted(stzh-datalist) {\n margin-left: space('large');\n }\n}\n\n.stzh-datalist-item {\n position: relative;\n text-decoration-line: none;\n\n &__vhidden {\n @include visuallyhidden;\n }\n\n &__wrapper {\n flex-grow: 1;\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n }\n\n &__leading,\n &__value,\n &__label,\n &__meta,\n &__action-list {\n color: inherit;\n display: flex;\n align-items: center;\n appearance: none;\n font-family: inherit;\n background: transparent;\n border: none;\n padding: 0;\n text-decoration-line: none;\n\n &.is-button,\n &.is-link {\n cursor: pointer;\n }\n }\n\n &__leading {\n flex-shrink: 0;\n\n &:not(:empty) {\n padding-right: space('xsmall');\n }\n }\n\n &__leading-icon-container {\n color: var(--leading-icon-color);\n background-color: var(--leading-icon-background-color);\n width: 40px;\n height: 40px;\n display: flex;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n transition-property: color, background-color;\n transition-duration: $baseTransitionAnimationSpeed;\n }\n\n &__value {\n @include fontCurve('p1');\n font-family: var(--font-family);\n font-weight: var(--font-weight);\n flex-grow: 1;\n }\n\n &__value,\n &__icon {\n color: var(--color);\n }\n\n &__label,\n &__meta {\n @include fontCurve('caption');\n }\n\n &__meta {\n justify-content: flex-end;\n }\n\n &__label {\n @include font('medium');\n color: $baseLeadColor;\n }\n\n &__action-list {\n display: var(--action-display);\n justify-content: center;\n text-align: center;\n\n &:not(:empty) {\n padding-left: space('xsmall');\n }\n }\n\n &__action {\n &.is-non-interactive {\n display: flex;\n justify-content: center;\n align-items: center;\n width: $formInputHeightTiny;\n height: $formInputHeightTiny;\n }\n\n &.is-button[variant=\"tertiary\"] {\n --color: inherit;\n }\n }\n\n &__value,\n &__icon {\n transition: color $baseTransitionAnimationSpeed;\n }\n\n &__richtext {\n color: inherit;\n font-family: inherit;\n font-weight: inherit;\n }\n\n &__interactive {\n position: absolute;\n top: 0;\n left: 0;\n }\n\n / Button variant /\n\n &--is-button &__icon.is-open {\n display: none;\n }\n\n &--is-button#{&}--is-expanded &__icon {\n &.is-closed {\n display: none;\n }\n\n &.is-open {\n display: inline-flex;\n }\n }\n\n / Interactive variant /\n\n &--is-interactive:hover &__value,\n &--is-interactive:hover &__icon {\n color: var(--hover-color);\n }\n\n &--is-interactive:hover &__value {\n text-decoration-line: underline;\n }\n\n &--is-interactive:hover &__leading-icon-container,\n &--is-interactive:focus-within &__leading-icon-container {\n color: var(--hover-leading-icon-color);\n background-color: var(--hover-leading-icon-background-color);\n }\n\n / Vertical variant /\n\n &--direction-vertical {\n display: flex;\n padding-top: space('xsmall');\n padding-bottom: space('xsmall');\n }\n\n &--direction-vertical#{&}--has-hidden-border {\n padding-top: calc(#{space('xsmall')} / 2);\n padding-bottom: calc(#{space('xsmall')} / 2);\n }\n\n &--direction-vertical:not(#{&}--has-hidden-border) {\n border-bottom: 1px solid $baseBorderColor;\n }\n\n &--direction-vertical &__leading-icon-container {\n width: 40px;\n height: 40px;\n }\n\n &--direction-vertical &__leading-icon {\n --size: #{iconSize('medium')};\n }\n\n &--direction-vertical &__meta {\n flex-direction: column;\n }\n\n / Horizontal variant /\n\n &--direction-horizontal,\n &--direction-horizontal + &__nested {\n display: contents;\n }\n\n &--direction-horizontal + &__nested &__nested-inner {\n grid-column: 1 / 6;\n }\n\n &--direction-horizontal &__leading,\n &--direction-horizontal &__value,\n &--direction-horizontal &__label,\n &--direction-horizontal &__meta,\n &--direction-horizontal &__action-list {\n min-height: var(--horizontal-min-height);\n }\n\n &--direction-horizontal &__label,\n &--direction-horizontal &__value,\n &--direction-horizontal &__meta {\n padding-top: space('xsmall');\n padding-bottom: space('xsmall');\n }\n\n &--direction-horizontal#{&}--has-hidden-border &__label,\n &--direction-horizontal#{&}--has-hidden-border &__value,\n &--direction-horizontal#{&}--has-hidden-border &__meta {\n padding-top: calc(#{space('xsmall')} / 2);\n padding-bottom: calc(#{space('xsmall')} / 2);\n }\n\n // &--direction-horizontal:not(#{&}--has-hidden-border) &__leading,\n &--direction-horizontal:not(#{&}--has-hidden-border) &__label,\n &--direction-horizontal:not(#{&}--has-hidden-border) &__value,\n &--direction-horizontal:not(#{&}--has-hidden-border) &__meta,\n &--direction-horizontal:not(#{&}--has-hidden-border) &__action-list {\n border-bottom: 1px solid $baseBorderColor;\n }\n\n &--direction-horizontal &__label {\n &:not(:empty) {\n min-width: var(--label-min-width);\n padding-right: space('xsmall');\n }\n }\n\n &--direction-horizontal &__meta {\n &:not(:empty) {\n padding-left: space('xsmall');\n }\n }\n\n &--direction-horizontal &__leading-icon-container {\n width: 32px;\n height: 32px;\n }\n\n &--direction-horizontal &__meta-status + &__meta-text {\n margin-left: space('xsmall');\n }\n}\n","import {\n Component,\n Host,\n h,\n Element,\n Prop,\n Event,\n EventEmitter,\n Fragment,\n State,\n Watch\n} from \"@stencil/core\";\n\nimport {\n StzhDatalistItemActionClickEvent,\n StzhDatalistDirectionChangeEvent,\n StzhDatalistHideBorderChangeEvent\n} from \"../../index\";\n\nimport { fetchTranslations, StzhLocaleComponent } from \"../../utils/translation-utils\";\n\nlet datalistItemCounter = 0;\n\n/\n @slot - Slot for nested datalist\n * @slot value - Slot for value (or use value slot instead)\n /\n@Component({\n tag: \"stzh-datalist-item\",\n styleUrl: \"stzh-datalist-item.scss\",\n scoped: true\n})\nexport class StzhDatalistItem {\n /* Translation strings /\n @Prop() localization: StzhLocaleComponent;\n\n /* Direction /\n @Prop({ reflect: true }) direction: \"vertical\" \| \"horizontal\" = \"vertical\";\n\n /* Link /\n @Prop({ reflect: true }) href: string;\n\n /* Rel (if href is used) /\n @Prop() rel: string;\n\n /* Target (if href is used) /\n @Prop() target: string;\n\n /* Download attribute of link (if `href` used) /\n @Prop() download: string;\n\n /* Leading icon /\n @Prop() leadingIcon: string;\n\n /* Icon of action button (if href is used, will only be for presentation and default to link icon) /\n @Prop() icon: string;\n\n /* Overwrite aria-label of action button (default aria label is `label` and `value`). /\n @Prop() iconLabel: string;\n\n /* Tooltip content of action button. Overwrites aria-label (set by default or `iconLabel`) of action button. /\n @Prop() iconTooltip: string;\n\n /* Label /\n @Prop() label: string = \"\";\n\n /* Value (or use value slot instead) /\n @Prop() value: string = \"\";\n\n /* Meta /\n @Prop() meta: string = \"\";\n\n /* Status Label /\n @Prop() statusLabel: string = \"\";\n\n /* Status Type /\n @Prop() statusType: \"default\" \| \"success\" \| \"warning\" \| \"error\" \| \"info\" = \"default\";\n\n /* Hide border lines /\n @Prop({ reflect: true }) hideBorder: boolean = false;\n\n /* Aria expanded of link/button /\n @Prop({ reflect: true, attribute: \"a11y-expanded\" }) a11yExpanded: boolean;\n\n /* Aria controls of link/button /\n @Prop({ attribute: \"a11y-controls\" }) a11yControls: string;\n\n /* Whether rel contains external /\n @State() external: boolean = false;\n\n /* Item action click event */\n @Event() stzhItemActionClick: EventEmitter<StzhDatalistItemActionClickEvent>;\n\n @Element() element: HTMLStzhDatalistItemElement;\n\n @Watch(\"rel\")\n externalWatcher() {\n this.external = this.rel && this.rel.includes(\"external\");\n }\n\n private datalist: HTMLStzhDatalistElement;\n private datalistItemId: string;\n\n private actionClick = (originalEvent: MouseEvent) => {\n this.stzhItemActionClick.emit({\n component: \"stzh-datalist-item\",\n originalEvent\n });\n }\n\n private handleDirectionChange = (event: CustomEvent<StzhDatalistDirectionChangeEvent>) => {\n this.direction = event.detail.value;\n }\n\n private handleHideBorderChange = (event: CustomEvent<StzhDatalistHideBorderChangeEvent>) => {\n this.hideBorder = event.detail.value;\n }\n\n private renderInner(isButton: boolean): DocumentFragment {\n const Item = isButton ? \"button\" : (this.href ? \"a\" : \"div\");\n\n return (\n <Fragment>\n <Item\n aria-hidden={this.label ? null : \"true\"}\n tabindex=\"-1\"\n id={`${this.datalistItemId}-label`}\n class={{\n \"stzh-datalist-item__label\": true,\n \"is-button\": isButton,\n \"is-link\": !!this.href\n }}\n href={this.href}\n rel={this.rel}\n target={this.target}\n download={this.download}\n >\n {this.label}\n </Item>\n\n <Item\n id={`${this.datalistItemId}-value`}\n class={{\n \"stzh-datalist-item__value\": true,\n \"is-button\": isButton,\n \"is-link\": !!this.href\n }}\n href={this.href}\n rel={this.rel}\n target={this.target}\n download={this.download}\n aria-labelledby={Item !== 'div' ? `${this.datalistItemId}-label ${this.datalistItemId}-value ${this.datalistItemId}-meta` : null}\n aria-controls={this.a11yControls \|\| null}\n aria-expanded={typeof this.a11yExpanded !== \"undefined\"\n ? (this.a11yExpanded ? \"true\" : \"false\") : null}\n >\n {this.external && <div class=\"stzh-datalist-item__vhidden\">{this.localization.$globals.externalLinkLabel}</div>}\n {this.download && <div class=\"stzh-datalist-item__vhidden\">{this.localization.$globals.downloadLinkLabel}</div>}\n <stzh-richtext class=\"stzh-datalist-item__richtext\" innerHTML={this.value}>\n <slot name=\"value\"></slot>\n </stzh-richtext>\n </Item>\n\n <Item\n aria-hidden={this.statusLabel \|\| this.meta ? null : \"true\"}\n tabindex=\"-1\"\n id={`${this.datalistItemId}-meta`}\n class={{\n \"stzh-datalist-item__meta\": true,\n \"is-button\": isButton,\n \"is-link\": !!this.href\n }}\n href={this.href}\n rel={this.rel}\n target={this.target}\n download={this.download}\n >\n {this.statusLabel &&\n <stzh-status\n class=\"stzh-datalist-item__meta-status\"\n label={this.statusLabel}\n type={this.statusType}\n ></stzh-status>\n }\n {this.meta && <span class=\"stzh-datalist-item__meta-text\">{this.meta}</span>}\n </Item>\n </Fragment>\n )\n }\n\n private renderLeadingIcon(isButton: boolean): HTMLElement {\n const Item = isButton ? \"button\" : (this.href ? \"a\" : \"div\");\n\n return (\n <Item\n role=\"presentation\"\n aria-hidden=\"true\"\n tabindex=\"-1\"\n class={{\n \"stzh-datalist-item__leading\": true,\n \"is-button\": isButton,\n \"is-link\": !!this.href\n }}\n href={this.href}\n rel={this.rel}\n target={this.target}\n download={this.download}\n >\n {this.leadingIcon &&\n <div class=\"stzh-datalist-item__leading-icon-container\">\n <stzh-icon class=\"stzh-datalist-item__leading-icon\" name={this.leadingIcon}></stzh-icon>\n </div>\n }\n </Item>\n );\n }\n\n async connectedCallback() {\n this.datalist = this.element.closest(\"stzh-datalist\");\n\n if (this.datalist) {\n this.direction = this.datalist.currentDirection;\n this.hideBorder = this.datalist.hideBorder;\n\n this.datalist.addEventListener(\"stzhDirectionChange\", this.handleDirectionChange);\n this.datalist.addEventListener(\"stzhHideBorderChange\", this.handleHideBorderChange);\n }\n }\n\n disconnectedCallback() {\n if (this.datalist) {\n this.datalist.removeEventListener(\"stzhDirectionChange\", this.handleDirectionChange);\n this.datalist.removeEventListener(\"stzhHideBorderChange\", this.handleHideBorderChange);\n this.datalist = null;\n }\n }\n\n async componentWillLoad() {\n this.datalistItemId = `stzh-datalist-item-${datalistItemCounter++}`;\n this.externalWatcher();\n\n if (!this.localization) {\n this.localization = await fetchTranslations(this.element, \"datalist-item\");\n }\n }\n\n render() {\n const isButton = typeof this.a11yExpanded !== \"undefined\"\n \|\| typeof this.a11yControls !== \"undefined\";\n\n const hasActionButton = !this.href && this.icon;\n\n const classes = {\n \"stzh-datalist-item\": true,\n \"stzh-datalist-item--is-interactive\": !!this.href \|\| isButton,\n \"stzh-datalist-item--is-link\": !!this.href,\n \"stzh-datalist-item--is-button\": isButton,\n \"stzh-datalist-item--is-expanded\": this.a11yExpanded,\n \"stzh-datalist-item--has-hidden-border\": this.hideBorder,\n [`stzh-datalist-item--direction-${this.direction}`]: !!this.direction\n };\n\n const Item = isButton ? \"button\" : (this.href ? \"a\" : \"div\");\n\n const ActionButton = () => {\n return (\n <stzh-button\n class={{\n \"stzh-datalist-item__action\": true,\n \"is-button\": true\n }}\n variant=\"tertiary\"\n size=\"tiny\"\n aria-label={this.iconLabel \|\| (`${this.label} ${this.value}`)}\n iconOnly={true}\n icon={this.icon}\n onClick={this.actionClick}\n ></stzh-button>\n );\n }\n\n return (\n <Host role=\"listitem\">\n <div class={classes}>\n {this.direction === \"horizontal\" ?\n <Fragment>\n {this.renderLeadingIcon(isButton)}\n {this.renderInner(isButton)}\n </Fragment>\n :\n <Fragment>\n {this.renderLeadingIcon(isButton)}\n <div class=\"stzh-datalist-item__wrapper\">\n {this.renderInner(isButton)}\n </div>\n </Fragment>\n }\n <Item\n role={hasActionButton ? null : \"presentation\"}\n aria-hidden={hasActionButton ? null : \"true\"}\n tabindex=\"-1\"\n class={{\n \"stzh-datalist-item__action-list\": true,\n \"is-button\": isButton,\n \"is-link\": !!this.href\n }}\n href={this.href}\n rel={this.rel}\n target={this.target}\n download={this.download}\n >\n {this.href &&\n (this.download ?\n <div class=\"stzh-datalist-item__action is-non-interactive\">\n <stzh-icon class=\"stzh-datalist-item__icon\" name={this.icon ? this.icon : \"download\"}></stzh-icon>\n </div>\n :\n <div class=\"stzh-datalist-item__action is-non-interactive\">\n <stzh-icon class=\"stzh-datalist-item__icon\" name={this.icon ? this.icon : (this.external ? \"external-link\" : \"arrow-right\")}></stzh-icon>\n </div>\n )\n }\n\n {isButton &&\n <div class=\"stzh-datalist-item__action is-non-interactive\">\n <stzh-icon class=\"stzh-datalist-item__icon is-closed\" name={this.icon ? this.icon : \"plus\"}></stzh-icon>\n <stzh-icon class=\"stzh-datalist-item__icon is-open\" name={this.icon ? this.icon : \"minus\"}></stzh-icon>\n </div>\n }\n\n {hasActionButton &&\n (this.iconTooltip ?\n <stzh-tooltip content={this.iconTooltip}>\n {ActionButton()}\n </stzh-tooltip>\n :\n ActionButton())\n }\n </Item>\n </div>\n\n <div class=\"stzh-datalist-item__nested\">\n <div class=\"stzh-datalist-item__nested-inner\">\n <slot></slot>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

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

	@@ -1 +1 @@
1	- {"file":"stzh-datepicker.stzh-radio.stzh-radiogroup.entry.cjs.js","mappings":"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","names":["printISODate","parseISODate","fetchTranslations","createGlobalAdapter","h","Host","Fragment","hasSlot","StzhInputDescription","camelCase"],"sources":["./src/components/stzh-datepicker/stzh-datepicker.scss?tag=stzh-datepicker&encapsulation=scoped","./src/components/stzh-datepicker/stzh-datepicker.tsx","./src/components/stzh-radio/stzh-radio.scss?tag=stzh-radio&encapsulation=scoped","./src/components/stzh-radio/stzh-radio.tsx","./src/components/stzh-radiogroup/stzh-radiogroup.scss?tag=stzh-radiogroup&encapsulation=scoped","./src/components/stzh-radiogroup/stzh-radiogroup.tsx"],"sourcesContent":[":host {\n width: 100%;\n}\n\n.stzh-datepicker {\n &__popover {\n --padding: #{space('medium')};\n --width: auto;\n }\n\n &__actions {\n display: flex;\n justify-content: flex-end;\n\n &:not(:empty) {\n margin-top: space('xsmall');\n }\n }\n}\n","import {\n Component,\n Prop,\n Host,\n Element,\n h,\n Event,\n EventEmitter,\n Method,\n Watch,\n Fragment,\n State\n} from \"@stencil/core\";\n\nimport {\n StzhCalendarChangeEvent,\n StzhDatepickerChangeEvent\n} from \"../../index\";\n\nimport { StzhCalendarDateDisabledPredicate } from \"../../index\";\n\nimport { fetchTranslations } from \"../../utils/translation-utils\";\nimport { printISODate, parseISODate } from \"../../utils/date-utils\"\nimport { StzhLocaleAdapter, createGlobalAdapter } from \"../../utils/date-adapter\"\n\nimport { StzhDatepickerLocalizedText } from \"./stzh-datepicker.localization\";\n\n/*\n @slot action - Slot for action below calendar (stzh-link element)\n /\n@Component({\n tag: \"stzh-datepicker\",\n styleUrl: \"stzh-datepicker.scss\",\n scoped: true\n})\nexport class StzhDatepicker {\n /\n Minimum date allowed to be picked. Must be in IS0-8601 format: YYYY-MM-DD.\n * This setting can be used alone or together with the max property.\n /\n @Prop() calendarMin: string = \"\"\n\n /\n Maximum date allowed to be picked. Must be in IS0-8601 format: YYYY-MM-DD.\n * This setting can be used alone or together with the min property.\n /\n @Prop() calendarMax: string = \"\"\n\n /\n Controls which days are disabled and therefore disallowed.\n * For example, this can be used to disallow selection of weekends.\n /\n @Prop() calendarIsDateDisabled: StzhCalendarDateDisabledPredicate = () => false\n\n /* Name of the hidden date picker input. /\n @Prop({ reflect: true }) name: string = \"\";\n\n /* Value of hidden date picker input (current selected date in ISO format). /\n @Prop({ mutable: true }) value: string = \"\";\n\n /* Label for input field and popover /\n @Prop() label: string = \"\";\n\n /* Whether label is visually hidden. /\n @Prop() labelHidden: boolean = false;\n\n /* Whether the element is readonly or not /\n @Prop({ reflect: true }) readonly: boolean = false;\n\n /* Whether the element is disabled or not /\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /* Description message (use description slot as alternative) /\n @Prop() description: string;\n\n /* Long description message appearing in a popover (use description-long slot as alternative) /\n @Prop() descriptionLong: string;\n\n /* One or multiple error message (use error slot as alternative) /\n @Prop() error: string \| string[];\n\n /* Invalid status /\n @Prop({ reflect: true }) invalid: boolean = false;\n\n /* Required status /\n @Prop({ reflect: true }) required: boolean = false;\n\n /* Append text to label depending if field is optional/required. true -> show \"(optional)\", false -> show nothing /\n @Prop({ reflect: true }) showMarker: boolean = false;\n\n /* Size variant /\n @Prop({ reflect: true }) size: \"default\" \| \"small\" = \"default\";\n\n /* Show calendar inline /\n @Prop() inline: boolean = false;\n\n /\n Date adapter, for custom parsing/formatting.\n * Must be object with a `parse` function which accepts a `string` and returns a `Date`,\n * and a `format` function which accepts a `Date` and returns a `string`.\n /\n @Prop() dateAdapter: StzhLocaleAdapter;\n\n /* Translation strings. /\n @Prop() localization: StzhDatepickerLocalizedText;\n\n @State() buttonLabel: string;\n\n @Watch(\"localization\")\n createDateFormatters() {\n if (this.localization) {\n this.dateFormatLong = new Intl.DateTimeFormat(this.localization.$locale, {\n day: \"numeric\",\n month: \"long\",\n year: \"numeric\",\n })\n }\n }\n\n /* Update calendar and input when value prop has changed /\n @Watch(\"value\")\n valueWatcher(newValue: string) {\n const date = parseISODate(newValue);\n\n if (this.calendar) {\n this.calendar.value = newValue;\n }\n\n if (this.input) {\n this.input.value = this.dateAdapter.format(date, \"inputdate\");\n }\n\n this.updateButtonAccessibleLabel();\n }\n\n /* Set value by a JS Date object /\n @Method()\n async setDate(date: Date) {\n this.value = printISODate(date);\n }\n\n /* Return internal popover element /\n @Method()\n async getPopover(): Promise<HTMLStzhPopoverElement> {\n return this.popover;\n }\n\n /* Datepicker change event /\n @Event() stzhChange: EventEmitter<StzhDatepickerChangeEvent>;\n\n @Element() element: HTMLStzhDatepickerElement;\n\n /\n To format dates exclusively for the benefit of screen readers.\n \n We prefer DateTimeFormat over date.toLocaleDateString, as the former has\n * better performance when formatting large number of dates. See:\n * https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString#Performance\n /\n private dateFormatLong: Intl.DateTimeFormat\n\n private input: HTMLStzhInputElement;\n private popover: HTMLStzhPopoverElement;\n private calendar: HTMLStzhCalendarElement;\n\n private onRootFocus = () => {\n if (this.input) {\n this.input.setFocus();\n }\n }\n\n private onInputChange = () => {\n const parsedDate = this.dateAdapter.parse(this.input.value, \"inputdate\")\n\n if (this.input.value === \"\" \|\| parsedDate) {\n const isoDate = printISODate(parsedDate);\n\n if (this.calendar) {\n this.calendar.value = isoDate;\n }\n\n this.value = isoDate;\n this.stzhChange.emit({\n component: \"stzh-datepicker\",\n value: this.value,\n valueAsDate: parsedDate,\n })\n }\n }\n\n private onCalendarChange = (event: CustomEvent<StzhCalendarChangeEvent>) => {\n this.value = event.detail.value;\n this.stzhChange.emit({\n component: \"stzh-datepicker\",\n value: this.value,\n valueAsDate: event.detail.valueAsDate,\n });\n\n if (this.input) {\n this.input.value = event.detail.valueAsDate\n && this.dateAdapter.format(event.detail.valueAsDate, \"inputdate\");\n }\n\n if (this.popover) {\n this.popover.hide();\n }\n }\n\n private updateButtonAccessibleLabel() {\n if (!this.localization) {\n return;\n }\n\n try {\n const valueAsDate = parseISODate(this.value);\n this.buttonLabel = `${this.label}, ${this.localization.buttonLabel}, ${this.localization.selectedDateMessage} ${this.dateFormatLong.format(valueAsDate)}`;\n } catch (err) {\n this.buttonLabel = `${this.label}, ${this.localization.buttonLabel}`;\n }\n }\n\n connectedCallback() {\n this.createDateFormatters();\n }\n\n async componentWillLoad() {\n if (!this.localization) {\n this.localization = await fetchTranslations(this.element, \"datepicker\");\n }\n\n if (!this.dateAdapter) {\n this.dateAdapter = createGlobalAdapter(\n this.localization.$formats,\n this.localization.$globals\n );\n }\n }\n\n componentDidLoad() {\n this.valueWatcher(this.value);\n }\n\n render() {\n const classes = {\n \"stzh-datepicker\": true,\n \"stzh-datepicker--inline\": this.inline\n };\n\n return (\n <Host tabindex={this.disabled ? null : \"-1\"} onFocus={this.onRootFocus}>\n <div class={classes}>\n <input\n type=\"hidden\"\n name={this.name}\n value={this.value}\n />\n\n {this.inline &&\n <Fragment>\n <stzh-calendar\n ref={(el) => (this.calendar = el as HTMLStzhCalendarElement)}\n isDateDisabled={this.calendarIsDateDisabled}\n min={this.calendarMin}\n max={this.calendarMax}\n onStzhChange={this.onCalendarChange}\n ></stzh-calendar>\n <div class=\"stzh-datepicker__actions\">\n <slot name=\"action\"></slot>\n </div>\n </Fragment>\n }\n\n {!this.inline &&\n <stzh-input\n label={this.label}\n labelHidden={this.labelHidden}\n ref={(el) => (this.input = el as HTMLStzhInputElement)}\n noAutocomplete\n onStzhChange={this.onInputChange}\n readonly={this.readonly}\n disabled={this.disabled}\n description={this.description}\n descriptionLong={this.descriptionLong}\n error={this.error}\n invalid={this.invalid}\n required={this.required}\n showMarker={this.showMarker}\n size={this.size}\n >\n <stzh-popover\n ref={(el) => (this.popover = el as HTMLStzhPopoverElement)}\n class=\"stzh-datepicker__popover\"\n slot=\"button-right\"\n placement=\"bottom-end\"\n label={this.label}\n >\n <stzh-button\n variant=\"input\"\n icon-only\n icon=\"calendar\"\n disabled={this.disabled}\n a11yLabel={this.buttonLabel}\n >\n </stzh-button>\n <div slot=\"content\">\n <stzh-calendar\n ref={(el) => (this.calendar = el as HTMLStzhCalendarElement)}\n isDateDisabled={this.calendarIsDateDisabled}\n min={this.calendarMin}\n max={this.calendarMax}\n onStzhChange={this.onCalendarChange}\n >\n </stzh-calendar>\n <div class=\"stzh-datepicker__actions\">\n <slot name=\"action\"></slot>\n </div>\n </div>\n </stzh-popover>\n </stzh-input>\n }\n </div>\n </Host>\n );\n }\n}\n",":host {\n display: inline-block;\n\n ::slotted(stzh-text) {\n --color: inherit;\n }\n}\n\n.stzh-radio {\n\t@include input-description;\n\n &__field-wrapper {\n @include fontSize('milli');\n position: relative;\n display: flex;\n user-select: none;\n cursor: pointer;\n }\n\n &__input {\n @include visuallyhiddenInput;\n border-radius: $formInputBorderRadius;\n }\n\n &__mark {\n @include radio__mark();\n }\n\n &__check {\n @include radio__check();\n }\n\n &__label {\n display: inline-block;\n color: $baseColor;\n transition: color $baseTransitionAnimationSpeed;\n margin-left: space('small');\n line-height: 24px;\n\n &:empty {\n display: none;\n }\n }\n\n &__marker-symbol {\n @include fontSize('micro');\n }\n\n / Hover / Focus / Checked /\n\n &:hover &__label,\n &__input:checked:hover ~ &__label,\n &__input:checked:hover ~ &__mark &__check,\n &__input:checked:focus ~ &__mark &__check {\n color: $colorPrimaryHover;\n }\n\n &__input:checked ~ &__label {\n color: $colorPrimary;\n }\n\n &:hover &__mark,\n &__input:focus:hover ~ &__mark,\n &__input:checked:hover ~ &__mark,\n &__input:checked:focus ~ &__mark {\n border-color: $colorPrimaryHover;\n }\n\n &__input:focus ~ &__mark,\n &__input:checked ~ &__mark {\n border-color: $colorPrimary;\n }\n\n &__input:checked ~ &__mark &__check {\n opacity: 1;\n }\n\n / Invalid /\n\n &--is-invalid &__input ~ &__label,\n &--is-invalid &__input ~ &__mark &__check {\n color: $colorError;\n }\n\n &--is-invalid &__input ~ &__mark {\n border-color: $colorError;\n }\n\n / Disabled /\n\n\t&--is-disabled &__field-wrapper {\n cursor: not-allowed;\n }\n\n &--is-disabled &__input ~ &__label,\n &--is-disabled &__input ~ &__mark &__check {\n color: $formDisabledColor;\n }\n\n &--is-disabled &__input ~ &__mark {\n border-color: $formDisabledBorderColor;\n }\n\n &--is-disabled &__mark {\n background-color: $formDisabledBackgroundColor;\n }\n}\n","import {\n Host,\n Component,\n Prop,\n Event,\n Element,\n EventEmitter,\n Method,\n h,\n Watch\n} from \"@stencil/core\";\n\nimport {\n StzhRadioChangeEvent,\n StzhRadioFocusEvent,\n StzhRadioBlurEvent\n} from \"../../index\";\n\nimport { hasSlot } from \"../../utils/utils\";\nimport { fetchTranslations, StzhLocaleComponent } from \"../../utils/translation-utils\";\n\nimport { StzhInputDescription } from \"../stzh-input/stzh-input-description\";\n\nlet radioCounter = 0;\n\n/\n @slot - Slot for label content\n * @slot description - Slot for description\n * @slot description-long - Slot for long description (in popover)\n * @slot error - Slot for error\n /\n@Component({\n tag: \"stzh-radio\",\n styleUrl: \"stzh-radio.scss\",\n scoped: true\n})\nexport class StzhRadio {\n /* Translation strings /\n @Prop() localization: StzhLocaleComponent;\n\n /* Whether the element is disabled or not /\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /* The name of the input element /\n @Prop({ reflect: true }) name: string = \"\";\n\n /* The value of the input element /\n @Prop({ mutable: true }) value: string = \"\";\n\n /* Invalid status /\n @Prop({ reflect: true }) invalid: boolean = false;\n\n /* Required status /\n @Prop({ reflect: true }) required: boolean = false;\n\n /* Append text to label depending if field is optional/required. true -> show \"(optional)\", false -> show nothing /\n @Prop({ reflect: true }) showMarker: boolean = false;\n\n /* Checked status /\n @Prop({ mutable: true, reflect: true }) checked: boolean = false;\n\n /* Label /\n @Prop() label: string = \"\";\n\n /* Description message (use description slot as alternative) /\n @Prop() description: string;\n\n /* Long description message appearing in a popover (use description-long slot as alternative) /\n @Prop() descriptionLong: string;\n\n /* One or multiple error message (use error slot as alternative) /\n @Prop() error: string \| string[];\n private _error: string[];\n\n /* Id for element which describes the radio button (this will be overwritten if description prop or slot is used, used by stzh-radiogroup) /\n @Prop({ attribute: \"a11y-describedby\" }) a11yDescribedby: string = \"\";\n\n /* Focus input field /\n @Method()\n async setFocus() {\n this.input.focus();\n }\n\n /* Input change event /\n @Event() stzhChange: EventEmitter<StzhRadioChangeEvent>;\n\n /* Input focus event /\n @Event() stzhFocus: EventEmitter<StzhRadioFocusEvent>;\n\n /* Input blur event /\n @Event() stzhBlur: EventEmitter<StzhRadioBlurEvent>;\n\n @Watch(\"error\")\n errorWatcher(newValue: string \| string[]) {\n if (typeof newValue === \"string\") {\n try {\n this._error = JSON.parse(newValue);\n } catch (e) {\n if (newValue) {\n this._error = [newValue];\n } else {\n this._error = [];\n }\n }\n } else if (newValue) {\n this._error = newValue;\n } else {\n this._error = [];\n }\n\n this.invalid = this._error.length > 0;\n }\n\n @Element() element: HTMLStzhRadioElement;\n\n private input: HTMLInputElement;\n private inputId: string;\n private focusedByInput: boolean = false;\n\n private onInput = (event: InputEvent) => {\n this.checked = this.input.checked;\n this.stzhChange.emit({\n component: \"stzh-radio\",\n originalEvent: event,\n value: this.value,\n checked: this.checked\n });\n }\n\n private onRootFocus = () => {\n if (!this.focusedByInput) {\n this.setFocus();\n }\n\n this.focusedByInput = false;\n }\n\n private onFocus = (event: FocusEvent) => {\n this.focusedByInput = true;\n\n const focusEvent = new FocusEvent('focus', {\n view: window,\n bubbles: false,\n cancelable: false\n });\n\n this.element.dispatchEvent(focusEvent);\n this.stzhFocus.emit({\n component: \"stzh-radio\",\n originalEvent: event\n });\n }\n\n private onBlur = (event: FocusEvent) => {\n const blurEvent = new FocusEvent('blur', {\n view: window,\n bubbles: false,\n cancelable: false\n });\n\n this.element.dispatchEvent(blurEvent);\n this.stzhBlur.emit({\n component: \"stzh-radio\",\n originalEvent: event\n });\n }\n\n async componentWillLoad() {\n this.inputId = `stzh-radio-${radioCounter++}`;\n this.errorWatcher(this.error);\n\n if (!this.localization) {\n this.localization = await fetchTranslations(this.element, 'radio');\n }\n }\n\n render() {\n const descriptionUsed = hasSlot(this.element, 'description') \|\| !!this.description;\n const descriptionLongUsed = hasSlot(this.element, 'description-long') \|\| !!this.descriptionLong;\n const errorUsed = hasSlot(this.element, 'error') \|\| !!this.error;\n\n const classes = {\n \"stzh-radio\": true,\n \"stzh-radio--has-description\": descriptionUsed,\n \"stzh-radio--has-description-long\": descriptionLongUsed,\n \"stzh-radio--has-error\": errorUsed,\n \"stzh-radio--is-required\": this.required,\n \"stzh-radio--is-invalid\": this.invalid,\n \"stzh-radio--is-disabled\": this.disabled\n };\n\n return (\n <Host tabindex={this.disabled ? null : \"-1\"} onFocus={this.onRootFocus}>\n <div class={classes}>\n <label class=\"stzh-radio__field-wrapper\">\n <input\n class=\"stzh-radio__input\"\n ref={(el) => (this.input = el as HTMLInputElement)}\n type=\"radio\"\n id={this.inputId}\n name={this.name}\n value={this.value}\n disabled={this.disabled}\n aria-describedby={`${this.inputId}-description ${this.a11yDescribedby}`}\n aria-required={this.required ? \"true\" : \"false\"}\n aria-invalid={this.invalid ? \"true\" : \"false\"}\n checked={this.checked}\n onInput={this.onInput}\n onFocus={this.onFocus}\n onBlur={this.onBlur}\n />\n <div class=\"stzh-radio__mark\">\n <div class=\"stzh-radio__check\"></div>\n </div>\n <div class=\"stzh-radio__label\">\n {this.label ? this.label : <slot></slot>}\n {this.showMarker &&\n <span class=\"stzh-radio__marker\">\n <span class=\"stzh-radio__marker-symbol\" aria-hidden=\"true\">\n {this.required\n ? this.localization.$globals.requiredFieldMarker\n : this.localization.$globals.optionalFieldMarker\n }\n </span>\n <span class=\"stzh-radio__marker-text\">\n {this.required\n ? this.localization.$globals.requiredFieldText\n : this.localization.$globals.optionalFieldText\n }\n </span>\n </span>\n }\n </div>\n </label>\n <StzhInputDescription\n classPrefix=\"stzh-radio\"\n id={`${this.inputId}-description`}\n error={this._error}\n description={this.description}\n descriptionLong={this.descriptionLong}\n descriptionLongUsed={descriptionLongUsed}\n moreInfoButtonLabel={this.localization.$globals.moreInfoButtonLabel}\n />\n </div>\n </Host>\n );\n }\n}\n",":host([direction=\"vertical\"]) {\n ::slotted(stzh-radio:not(:last-child)) {\n margin-bottom: space('medium');\n }\n}\n\n:host([direction=\"horizontal\"]) {\n ::slotted(stzh-radio:not(:last-child)) {\n margin-right: space('large');\n }\n}\n\n.stzh-radiogroup {\n @include input-description;\n margin: 0;\n padding: 0;\n border: none;\n\n &__fields {\n display: flex;\n align-items: flex-start;\n flex-direction: column;\n }\n\n &__legend {\n @include font('heavy');\n @include fontSize('nano');\n padding: 0;\n margin-bottom: space('xsmall');\n }\n\n &--hide-legend &__legend {\n @include visuallyhidden;\n }\n\n &--direction-horizontal &__fields {\n flex-direction: row;\n }\n}\n","import {\n Component,\n Prop,\n Element,\n Watch,\n h,\n Listen\n} from \"@stencil/core\";\n\nimport { StzhRadioChangeEvent } from \"../../index\";\n\nimport { hasSlot } from \"../../utils/utils\";\nimport { camelCase } from \"../../utils/string-utils\";\nimport { fetchTranslations, StzhLocaleComponent } from \"../../utils/translation-utils\";\n\nimport { StzhInputDescription } from \"../stzh-input/stzh-input-description\";\n\nconst SELECTOR_RADIO = 'stzh-radio, stzh-button[type=radio], stzh-card';\n\nlet radiogroupCounter = 0;\n\n/\n @slot - Slot for `stzh-radio`, `stzh-button[type=\"radio\"]` or `stzh-card` elements\n * @slot description - Slot for description\n * @slot description-long - Slot for long description (in popover)\n * @slot error - Slot for error\n /\n@Component({\n tag: \"stzh-radiogroup\",\n styleUrl: \"stzh-radiogroup.scss\",\n scoped: true\n})\nexport class StzhRadiogroup {\n /* Translation strings /\n @Prop() localization: StzhLocaleComponent;\n\n /* Whether the element is disabled or not /\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /* The name of the input radio elements, will define the radio group. If you have more than one radio group on a page, every group needs to have its own unique name /\n @Prop({ reflect: true }) name: string;\n\n /* The legend /\n @Prop() legend: string;\n\n /* Hide legend to show only for screenreaders /\n @Prop({ reflect: true }) hideLegend: boolean = false;\n\n /* Invalid status /\n @Prop({ reflect: true }) invalid: boolean = false;\n\n /* Required status /\n @Prop({ reflect: true }) required: boolean = false;\n\n /* Append text to label depending if field is optional/required. true -> show \"(optional)\", false -> show nothing /\n @Prop({ reflect: true }) showMarker: boolean = false;\n\n /* Select a radio by value /\n @Prop({ mutable: true }) value: string = \"\";\n\n /* Direction /\n @Prop({ reflect: true }) direction: \"vertical\" \| \"horizontal\" = \"vertical\";\n\n /* Description message (use description slot as alternative) /\n @Prop() description: string;\n\n /* Long description message appearing in a popover (use description-long slot as alternative) /\n @Prop() descriptionLong: string;\n\n /* One or multiple error message (use error slot as alternative) /\n @Prop() error: string \| string[];\n private _error: string[];\n\n /* Current checked radio element (readonly) /\n @Prop() checkedRadio: HTMLStzhRadioElement \| null = null;\n\n /* Prevent updating certain properties of radio elements (possible values inside array: disabled, invalid, required, hide-marker) /\n @Prop() preventUpdateProperties: string[] \| string = [];\n private _preventUpdateProperties: string[] = [];\n\n /* Host element /\n @Element() element: HTMLElement;\n\n @Watch(\"name\")\n watchName(newValue: string) {\n this.updateRadiosProperty(\"name\", newValue);\n }\n\n @Watch(\"disabled\")\n watchDisabled(newValue: boolean) {\n this.updateRadiosProperty(\"disabled\", newValue);\n }\n\n @Watch(\"invalid\")\n watchInvalid(newValue: boolean) {\n this.updateRadiosProperty(\"invalid\", newValue);\n }\n\n @Watch(\"required\")\n watchRequired(newValue: boolean) {\n this.updateRadiosProperty(\"required\", newValue);\n }\n\n @Watch(\"value\")\n watchValue(newValue: string) {\n this.updateCheckedRadioByValue(newValue);\n }\n\n @Watch(\"error\")\n errorWatcher(newValue: string \| string[]) {\n if (typeof newValue === \"string\") {\n try {\n this._error = JSON.parse(newValue);\n } catch (e) {\n if (newValue) {\n this._error = [newValue];\n } else {\n this._error = [];\n }\n }\n } else if (newValue) {\n this._error = newValue;\n } else {\n this._error = [];\n }\n\n this.invalid = this._error.length > 0;\n }\n\n @Watch(\"preventUpdateProperties\")\n preventUpdatePropertiesWatcher(newValue: string[] \| string) {\n if (typeof newValue === \"string\") {\n this._preventUpdateProperties = JSON.parse(newValue);\n } else {\n this._preventUpdateProperties = newValue;\n }\n }\n\n @Listen(\"stzhChange\")\n onChange(event: CustomEvent<StzhRadioChangeEvent>) {\n this.value = event.detail.value;\n }\n\n /* Radio elements */\n private radios: HTMLStzhRadioElement[];\n private radiogroupId: string;\n private observer: MutationObserver;\n\n private updateRadiosProperty(prop: string, value: any) {\n this.radios.forEach((radio: HTMLStzhRadioElement) => {\n if (prop === \"name\" \|\| (this._preventUpdateProperties.indexOf(prop) === -1)) {\n radio[camelCase(prop)] = value;\n }\n });\n }\n\n private updateCheckedRadioByValue(value: string) {\n this.checkedRadio = this.radios.find(radio => radio.value === value);\n\n if (this.checkedRadio) {\n this.checkedRadio.checked = true;\n }\n\n this.uncheckRadios();\n }\n\n private uncheckRadios() {\n // make sure that no other radios are checked than the current one or no one\n this.radios.forEach((radio: HTMLStzhRadioElement) => {\n if (!this.checkedRadio \|\| radio !== this.checkedRadio) {\n radio.checked = false;\n }\n });\n }\n\n private init = () => {\n // update radios\n this.radios = Array.from(this.element.querySelectorAll(SELECTOR_RADIO));\n\n this.updateRadiosProperty(\"show-marker\", false);\n this.updateRadiosProperty(\"a11y-describedby\", `${this.radiogroupId}-description`);\n\n this.watchValue(this.value);\n this.watchName(this.name);\n this.watchDisabled(this.disabled);\n this.watchInvalid(this.invalid);\n this.watchRequired(this.required);\n }\n\n async componentWillLoad() {\n this.radiogroupId = `stzh-radiogroup-${radiogroupCounter++}`;\n this.errorWatcher(this.error);\n this.preventUpdatePropertiesWatcher(this.preventUpdateProperties);\n\n if (!this.localization) {\n this.localization = await fetchTranslations(this.element, 'radiogroup');\n }\n }\n\n componentShouldUpdate(_newValue, _oldValue, prop: string) {\n return prop !== \"checkedRadio\";\n }\n\n componentDidRender() {\n this.init();\n }\n\n connectedCallback() {\n if (!this.value) {\n this.radios = Array.from(this.element.querySelectorAll(SELECTOR_RADIO));\n\n // try to find a checkbox that might has checked set to true\n const checkedRadio = this.radios.find(radio => radio.checked);\n\n if (checkedRadio) {\n this.value = checkedRadio.value;\n }\n }\n\n this.observer = new MutationObserver(this.init);\n this.observer.observe(this.element, {\n childList: true,\n subtree: true,\n });\n }\n\n disconnectedCallback() {\n if (this.observer) {\n this.observer.disconnect();\n }\n }\n\n render() {\n const descriptionUsed = hasSlot(this.element, 'description') \|\| !!this.description;\n const descriptionLongUsed = hasSlot(this.element, 'description-long') \|\| !!this.descriptionLong;\n const errorUsed = hasSlot(this.element, 'error') \|\| !!this.error;\n\n const classes = {\n \"stzh-radiogroup\": true,\n \"stzh-radiogroup--has-description\": descriptionUsed,\n \"stzh-radiogroup--has-description-long\": descriptionLongUsed,\n \"stzh-radiogroup--has-error\": errorUsed,\n \"stzh-radiogroup--is-required\": this.required,\n \"stzh-radiogroup--is-disabled\": this.disabled,\n \"stzh-radiogroup--is-invalid\": this.invalid,\n \"stzh-radiogroup--hide-legend\": this.hideLegend,\n [`stzh-radiogroup--direction-${this.direction}`]: !!this.direction\n };\n\n return (\n <fieldset class={classes}>\n {this.legend &&\n <legend class=\"stzh-radiogroup__legend\">\n {this.legend}\n {this.showMarker &&\n <span class=\"stzh-radiogroup__marker\">\n <span class=\"stzh-radiogroup__marker-symbol\" aria-hidden=\"true\">\n {this.required\n ? this.localization.$globals.requiredFieldMarker\n : this.localization.$globals.optionalFieldMarker\n }\n </span>\n <span class=\"stzh-radiogroup__marker-text\">\n {this.required\n ? this.localization.$globals.requiredFieldText\n : this.localization.$globals.optionalFieldText\n }\n </span>\n </span>\n }\n </legend>\n }\n <div class=\"stzh-radiogroup__fields\">\n <slot></slot>\n </div>\n <StzhInputDescription\n classPrefix=\"stzh-radiogroup\"\n id={`${this.radiogroupId}-description`}\n error={this._error}\n description={this.description}\n descriptionLong={this.descriptionLong}\n descriptionLongUsed={descriptionLongUsed}\n moreInfoButtonLabel={this.localization.$globals.moreInfoButtonLabel}\n />\n </fieldset>\n );\n }\n}\n"],"version":3}
1	+ {"file":"stzh-datepicker.stzh-radio.stzh-radiogroup.entry.cjs.js","mappings":"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","names":["printISODate","parseISODate","fetchTranslations","createGlobalAdapter","h","Host","Fragment","hasSlot","StzhInputDescription","camelCase"],"sources":["./src/components/stzh-datepicker/stzh-datepicker.scss?tag=stzh-datepicker&encapsulation=scoped","./src/components/stzh-datepicker/stzh-datepicker.tsx","./src/components/stzh-radio/stzh-radio.scss?tag=stzh-radio&encapsulation=scoped","./src/components/stzh-radio/stzh-radio.tsx","./src/components/stzh-radiogroup/stzh-radiogroup.scss?tag=stzh-radiogroup&encapsulation=scoped","./src/components/stzh-radiogroup/stzh-radiogroup.tsx"],"sourcesContent":[":host {\n width: 100%;\n}\n\n.stzh-datepicker {\n &__popover {\n --padding: #{space('medium')};\n --width: auto;\n }\n\n &__actions {\n display: flex;\n justify-content: flex-end;\n\n &:not(:empty) {\n margin-top: space('xsmall');\n }\n }\n}\n","import {\n Component,\n Prop,\n Host,\n Element,\n h,\n Event,\n EventEmitter,\n Method,\n Watch,\n Fragment,\n State\n} from \"@stencil/core\";\n\nimport {\n StzhCalendarChangeEvent,\n StzhDatepickerChangeEvent\n} from \"../../index\";\n\nimport { StzhCalendarDateDisabledPredicate } from \"../../index\";\n\nimport { fetchTranslations } from \"../../utils/translation-utils\";\nimport { printISODate, parseISODate } from \"../../utils/date-utils\"\nimport { StzhLocaleAdapter, createGlobalAdapter } from \"../../utils/date-adapter\"\n\nimport { StzhDatepickerLocalizedText } from \"./stzh-datepicker.localization\";\n\n/*\n @slot action - Slot for action below calendar (stzh-link element)\n /\n@Component({\n tag: \"stzh-datepicker\",\n styleUrl: \"stzh-datepicker.scss\",\n scoped: true\n})\nexport class StzhDatepicker {\n /\n Minimum date allowed to be picked. Must be in IS0-8601 format: YYYY-MM-DD.\n * This setting can be used alone or together with the max property.\n /\n @Prop() calendarMin: string = \"\"\n\n /\n Maximum date allowed to be picked. Must be in IS0-8601 format: YYYY-MM-DD.\n * This setting can be used alone or together with the min property.\n /\n @Prop() calendarMax: string = \"\"\n\n /\n Controls which days are disabled and therefore disallowed.\n * For example, this can be used to disallow selection of weekends.\n /\n @Prop() calendarIsDateDisabled: StzhCalendarDateDisabledPredicate = () => false\n\n /* Name of the hidden date picker input. /\n @Prop({ reflect: true }) name: string = \"\";\n\n /* Value of hidden date picker input (current selected date in ISO format). /\n @Prop({ mutable: true }) value: string = \"\";\n\n /* Label for input field and popover /\n @Prop() label: string = \"\";\n\n /* Whether label is visually hidden. /\n @Prop() labelHidden: boolean = false;\n\n /* Whether the element is readonly or not /\n @Prop({ reflect: true }) readonly: boolean = false;\n\n /* Whether the element is disabled or not /\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /* Description message (use description slot as alternative) /\n @Prop() description: string;\n\n /* Long description message appearing in a popover (use description-long slot as alternative) /\n @Prop() descriptionLong: string;\n\n /* One or multiple error message (use error slot as alternative) /\n @Prop() error: string \| string[];\n\n /* Invalid status /\n @Prop({ reflect: true }) invalid: boolean = false;\n\n /* Required status /\n @Prop({ reflect: true }) required: boolean = false;\n\n /* Append text to label depending if field is optional/required. true -> show \"(optional)\", false -> show nothing /\n @Prop({ reflect: true }) showMarker: boolean = false;\n\n /* Size variant /\n @Prop({ reflect: true }) size: \"default\" \| \"small\" = \"default\";\n\n /* Show calendar inline /\n @Prop() inline: boolean = false;\n\n /\n Date adapter, for custom parsing/formatting.\n * Must be object with a `parse` function which accepts a `string` and returns a `Date`,\n * and a `format` function which accepts a `Date` and returns a `string`.\n /\n @Prop() dateAdapter: StzhLocaleAdapter;\n\n /* Translation strings. /\n @Prop() localization: StzhDatepickerLocalizedText;\n\n @State() buttonLabel: string;\n\n @Watch(\"localization\")\n createDateFormatters() {\n if (this.localization) {\n this.dateFormatLong = new Intl.DateTimeFormat(this.localization.$locale, {\n day: \"numeric\",\n month: \"long\",\n year: \"numeric\",\n })\n }\n }\n\n /* Update calendar and input when value prop has changed /\n @Watch(\"value\")\n valueWatcher(newValue: string) {\n const date = parseISODate(newValue);\n\n if (this.calendar) {\n this.calendar.value = newValue;\n }\n\n if (this.input) {\n this.input.value = this.dateAdapter.format(date, \"inputdate\");\n }\n\n this.updateButtonAccessibleLabel();\n }\n\n /* Set value by a JS Date object /\n @Method()\n async setDate(date: Date) {\n this.value = printISODate(date);\n }\n\n /* Return internal popover element /\n @Method()\n async getPopover(): Promise<HTMLStzhPopoverElement> {\n return this.popover;\n }\n\n /* Datepicker change event /\n @Event() stzhChange: EventEmitter<StzhDatepickerChangeEvent>;\n\n @Element() element: HTMLStzhDatepickerElement;\n\n /\n To format dates exclusively for the benefit of screen readers.\n \n We prefer DateTimeFormat over date.toLocaleDateString, as the former has\n * better performance when formatting large number of dates. See:\n * https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString#Performance\n /\n private dateFormatLong: Intl.DateTimeFormat\n\n private input: HTMLStzhInputElement;\n private popover: HTMLStzhPopoverElement;\n private calendar: HTMLStzhCalendarElement;\n\n private onRootFocus = () => {\n if (this.input) {\n this.input.setFocus();\n }\n }\n\n private onInputChange = () => {\n const parsedDate = this.dateAdapter.parse(this.input.value, \"inputdate\");\n\n if (this.input.value === \"\" \|\| parsedDate) {\n const isoDate = printISODate(parsedDate);\n\n if (this.calendar) {\n this.calendar.value = isoDate;\n }\n\n this.value = isoDate;\n this.stzhChange.emit({\n component: \"stzh-datepicker\",\n value: this.value,\n valueAsDate: parsedDate,\n })\n }\n }\n\n private onCalendarChange = (event: CustomEvent<StzhCalendarChangeEvent>) => {\n this.value = event.detail.value;\n this.stzhChange.emit({\n component: \"stzh-datepicker\",\n value: this.value,\n valueAsDate: event.detail.valueAsDate,\n });\n\n if (this.input) {\n this.input.value = event.detail.valueAsDate\n && this.dateAdapter.format(event.detail.valueAsDate, \"inputdate\");\n }\n\n if (this.popover) {\n this.popover.hide();\n }\n }\n\n private updateButtonAccessibleLabel() {\n if (!this.localization) {\n return;\n }\n\n try {\n const valueAsDate = parseISODate(this.value);\n this.buttonLabel = `${this.label}, ${this.localization.buttonLabel}, ${this.localization.selectedDateMessage} ${this.dateFormatLong.format(valueAsDate)}`;\n } catch (err) {\n this.buttonLabel = `${this.label}, ${this.localization.buttonLabel}`;\n }\n }\n\n connectedCallback() {\n this.createDateFormatters();\n }\n\n async componentWillLoad() {\n if (!this.localization) {\n this.localization = await fetchTranslations(this.element, \"datepicker\");\n }\n\n if (!this.dateAdapter) {\n this.dateAdapter = createGlobalAdapter(\n this.localization.$formats,\n this.localization.$globals\n );\n }\n }\n\n componentDidLoad() {\n this.valueWatcher(this.value);\n }\n\n render() {\n const classes = {\n \"stzh-datepicker\": true,\n \"stzh-datepicker--inline\": this.inline\n };\n\n return (\n <Host tabindex={this.disabled ? null : \"-1\"} onFocus={this.onRootFocus}>\n <div class={classes}>\n <input\n type=\"hidden\"\n name={this.name}\n value={this.value}\n />\n\n {this.inline &&\n <Fragment>\n <stzh-calendar\n ref={(el) => (this.calendar = el as HTMLStzhCalendarElement)}\n isDateDisabled={this.calendarIsDateDisabled}\n min={this.calendarMin}\n max={this.calendarMax}\n onStzhChange={this.onCalendarChange}\n ></stzh-calendar>\n <div class=\"stzh-datepicker__actions\">\n <slot name=\"action\"></slot>\n </div>\n </Fragment>\n }\n\n {!this.inline &&\n <stzh-input\n label={this.label}\n labelHidden={this.labelHidden}\n ref={(el) => (this.input = el as HTMLStzhInputElement)}\n noAutocomplete\n onStzhChange={this.onInputChange}\n readonly={this.readonly}\n disabled={this.disabled}\n description={this.description}\n descriptionLong={this.descriptionLong}\n error={this.error}\n invalid={this.invalid}\n required={this.required}\n showMarker={this.showMarker}\n size={this.size}\n >\n <stzh-popover\n ref={(el) => (this.popover = el as HTMLStzhPopoverElement)}\n class=\"stzh-datepicker__popover\"\n slot=\"button-right\"\n placement=\"bottom-end\"\n label={this.label}\n >\n <stzh-button\n variant=\"input\"\n icon-only\n icon=\"calendar\"\n disabled={this.disabled}\n a11yLabel={this.buttonLabel}\n >\n </stzh-button>\n <div slot=\"content\">\n <stzh-calendar\n ref={(el) => (this.calendar = el as HTMLStzhCalendarElement)}\n isDateDisabled={this.calendarIsDateDisabled}\n min={this.calendarMin}\n max={this.calendarMax}\n onStzhChange={this.onCalendarChange}\n >\n </stzh-calendar>\n <div class=\"stzh-datepicker__actions\">\n <slot name=\"action\"></slot>\n </div>\n </div>\n </stzh-popover>\n </stzh-input>\n }\n </div>\n </Host>\n );\n }\n}\n",":host {\n display: inline-block;\n\n ::slotted(stzh-text) {\n --color: inherit;\n }\n}\n\n.stzh-radio {\n\t@include input-description;\n\n &__field-wrapper {\n @include fontSize('milli');\n position: relative;\n display: flex;\n user-select: none;\n cursor: pointer;\n }\n\n &__input {\n @include visuallyhiddenInput;\n border-radius: $formInputBorderRadius;\n }\n\n &__mark {\n @include radio__mark();\n }\n\n &__check {\n @include radio__check();\n }\n\n &__label {\n display: inline-block;\n color: $baseColor;\n transition: color $baseTransitionAnimationSpeed;\n margin-left: space('small');\n line-height: 24px;\n\n &:empty {\n display: none;\n }\n }\n\n &__marker-symbol {\n @include fontSize('micro');\n }\n\n / Hover / Focus / Checked /\n\n &:hover &__label,\n &__input:checked:hover ~ &__label,\n &__input:checked:hover ~ &__mark &__check,\n &__input:checked:focus ~ &__mark &__check {\n color: $colorPrimaryHover;\n }\n\n &__input:checked ~ &__label {\n color: $colorPrimary;\n }\n\n &:hover &__mark,\n &__input:focus:hover ~ &__mark,\n &__input:checked:hover ~ &__mark,\n &__input:checked:focus ~ &__mark {\n border-color: $colorPrimaryHover;\n }\n\n &__input:focus ~ &__mark,\n &__input:checked ~ &__mark {\n border-color: $colorPrimary;\n }\n\n &__input:checked ~ &__mark &__check {\n opacity: 1;\n }\n\n / Invalid /\n\n &--is-invalid &__input ~ &__label,\n &--is-invalid &__input ~ &__mark &__check {\n color: $colorError;\n }\n\n &--is-invalid &__input ~ &__mark {\n border-color: $colorError;\n }\n\n / Disabled /\n\n\t&--is-disabled &__field-wrapper {\n cursor: not-allowed;\n }\n\n &--is-disabled &__input ~ &__label,\n &--is-disabled &__input ~ &__mark &__check {\n color: $formDisabledColor;\n }\n\n &--is-disabled &__input ~ &__mark {\n border-color: $formDisabledBorderColor;\n }\n\n &--is-disabled &__mark {\n background-color: $formDisabledBackgroundColor;\n }\n}\n","import {\n Host,\n Component,\n Prop,\n Event,\n Element,\n EventEmitter,\n Method,\n h,\n Watch\n} from \"@stencil/core\";\n\nimport {\n StzhRadioChangeEvent,\n StzhRadioFocusEvent,\n StzhRadioBlurEvent\n} from \"../../index\";\n\nimport { hasSlot } from \"../../utils/utils\";\nimport { fetchTranslations, StzhLocaleComponent } from \"../../utils/translation-utils\";\n\nimport { StzhInputDescription } from \"../stzh-input/stzh-input-description\";\n\nlet radioCounter = 0;\n\n/\n @slot - Slot for label content\n * @slot description - Slot for description\n * @slot description-long - Slot for long description (in popover)\n * @slot error - Slot for error\n /\n@Component({\n tag: \"stzh-radio\",\n styleUrl: \"stzh-radio.scss\",\n scoped: true\n})\nexport class StzhRadio {\n /* Translation strings /\n @Prop() localization: StzhLocaleComponent;\n\n /* Whether the element is disabled or not /\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /* The name of the input element /\n @Prop({ reflect: true }) name: string = \"\";\n\n /* The value of the input element /\n @Prop({ mutable: true }) value: string = \"\";\n\n /* Invalid status /\n @Prop({ reflect: true }) invalid: boolean = false;\n\n /* Required status /\n @Prop({ reflect: true }) required: boolean = false;\n\n /* Append text to label depending if field is optional/required. true -> show \"(optional)\", false -> show nothing /\n @Prop({ reflect: true }) showMarker: boolean = false;\n\n /* Checked status /\n @Prop({ mutable: true, reflect: true }) checked: boolean = false;\n\n /* Label /\n @Prop() label: string = \"\";\n\n /* Description message (use description slot as alternative) /\n @Prop() description: string;\n\n /* Long description message appearing in a popover (use description-long slot as alternative) /\n @Prop() descriptionLong: string;\n\n /* One or multiple error message (use error slot as alternative) /\n @Prop() error: string \| string[];\n private _error: string[];\n\n /* Id for element which describes the radio button (this will be overwritten if description prop or slot is used, used by stzh-radiogroup) /\n @Prop({ attribute: \"a11y-describedby\" }) a11yDescribedby: string = \"\";\n\n /* Focus input field /\n @Method()\n async setFocus() {\n this.input.focus();\n }\n\n /* Input change event /\n @Event() stzhChange: EventEmitter<StzhRadioChangeEvent>;\n\n /* Input focus event /\n @Event() stzhFocus: EventEmitter<StzhRadioFocusEvent>;\n\n /* Input blur event /\n @Event() stzhBlur: EventEmitter<StzhRadioBlurEvent>;\n\n @Watch(\"error\")\n errorWatcher(newValue: string \| string[]) {\n if (typeof newValue === \"string\") {\n try {\n this._error = JSON.parse(newValue);\n } catch (e) {\n if (newValue) {\n this._error = [newValue];\n } else {\n this._error = [];\n }\n }\n } else if (newValue) {\n this._error = newValue;\n } else {\n this._error = [];\n }\n\n this.invalid = this._error.length > 0;\n }\n\n @Element() element: HTMLStzhRadioElement;\n\n private input: HTMLInputElement;\n private inputId: string;\n private focusedByInput: boolean = false;\n\n private onInput = (event: InputEvent) => {\n this.checked = this.input.checked;\n this.stzhChange.emit({\n component: \"stzh-radio\",\n originalEvent: event,\n value: this.value,\n checked: this.checked\n });\n }\n\n private onRootFocus = () => {\n if (!this.focusedByInput) {\n this.setFocus();\n }\n\n this.focusedByInput = false;\n }\n\n private onFocus = (event: FocusEvent) => {\n this.focusedByInput = true;\n\n const focusEvent = new FocusEvent('focus', {\n view: window,\n bubbles: false,\n cancelable: false\n });\n\n this.element.dispatchEvent(focusEvent);\n this.stzhFocus.emit({\n component: \"stzh-radio\",\n originalEvent: event\n });\n }\n\n private onBlur = (event: FocusEvent) => {\n const blurEvent = new FocusEvent('blur', {\n view: window,\n bubbles: false,\n cancelable: false\n });\n\n this.element.dispatchEvent(blurEvent);\n this.stzhBlur.emit({\n component: \"stzh-radio\",\n originalEvent: event\n });\n }\n\n async componentWillLoad() {\n this.inputId = `stzh-radio-${radioCounter++}`;\n this.errorWatcher(this.error);\n\n if (!this.localization) {\n this.localization = await fetchTranslations(this.element, 'radio');\n }\n }\n\n render() {\n const descriptionUsed = hasSlot(this.element, 'description') \|\| !!this.description;\n const descriptionLongUsed = hasSlot(this.element, 'description-long') \|\| !!this.descriptionLong;\n const errorUsed = hasSlot(this.element, 'error') \|\| !!this.error;\n\n const classes = {\n \"stzh-radio\": true,\n \"stzh-radio--has-description\": descriptionUsed,\n \"stzh-radio--has-description-long\": descriptionLongUsed,\n \"stzh-radio--has-error\": errorUsed,\n \"stzh-radio--is-required\": this.required,\n \"stzh-radio--is-invalid\": this.invalid,\n \"stzh-radio--is-disabled\": this.disabled\n };\n\n return (\n <Host tabindex={this.disabled ? null : \"-1\"} onFocus={this.onRootFocus}>\n <div class={classes}>\n <label class=\"stzh-radio__field-wrapper\">\n <input\n class=\"stzh-radio__input\"\n ref={(el) => (this.input = el as HTMLInputElement)}\n type=\"radio\"\n id={this.inputId}\n name={this.name}\n value={this.value}\n disabled={this.disabled}\n aria-describedby={`${this.inputId}-description ${this.a11yDescribedby}`}\n aria-required={this.required ? \"true\" : \"false\"}\n aria-invalid={this.invalid ? \"true\" : \"false\"}\n checked={this.checked}\n onInput={this.onInput}\n onFocus={this.onFocus}\n onBlur={this.onBlur}\n />\n <div class=\"stzh-radio__mark\">\n <div class=\"stzh-radio__check\"></div>\n </div>\n <div class=\"stzh-radio__label\">\n {this.label ? this.label : <slot></slot>}\n {this.showMarker &&\n <span class=\"stzh-radio__marker\">\n <span class=\"stzh-radio__marker-symbol\" aria-hidden=\"true\">\n {this.required\n ? this.localization.$globals.requiredFieldMarker\n : this.localization.$globals.optionalFieldMarker\n }\n </span>\n <span class=\"stzh-radio__marker-text\">\n {this.required\n ? this.localization.$globals.requiredFieldText\n : this.localization.$globals.optionalFieldText\n }\n </span>\n </span>\n }\n </div>\n </label>\n <StzhInputDescription\n classPrefix=\"stzh-radio\"\n id={`${this.inputId}-description`}\n error={this._error}\n description={this.description}\n descriptionLong={this.descriptionLong}\n descriptionLongUsed={descriptionLongUsed}\n moreInfoButtonLabel={this.localization.$globals.moreInfoButtonLabel}\n />\n </div>\n </Host>\n );\n }\n}\n",":host([direction=\"vertical\"]) {\n ::slotted(stzh-radio:not(:last-child)) {\n margin-bottom: space('medium');\n }\n}\n\n:host([direction=\"horizontal\"]) {\n ::slotted(stzh-radio:not(:last-child)) {\n margin-right: space('large');\n }\n}\n\n.stzh-radiogroup {\n @include input-description;\n margin: 0;\n padding: 0;\n border: none;\n\n &__fields {\n display: flex;\n align-items: flex-start;\n flex-direction: column;\n }\n\n &__legend {\n @include font('heavy');\n @include fontSize('nano');\n padding: 0;\n margin-bottom: space('xsmall');\n }\n\n &--hide-legend &__legend {\n @include visuallyhidden;\n }\n\n &--direction-horizontal &__fields {\n flex-direction: row;\n }\n}\n","import {\n Component,\n Prop,\n Element,\n Watch,\n h,\n Listen\n} from \"@stencil/core\";\n\nimport { StzhRadioChangeEvent } from \"../../index\";\n\nimport { hasSlot } from \"../../utils/utils\";\nimport { camelCase } from \"../../utils/string-utils\";\nimport { fetchTranslations, StzhLocaleComponent } from \"../../utils/translation-utils\";\n\nimport { StzhInputDescription } from \"../stzh-input/stzh-input-description\";\n\nconst SELECTOR_RADIO = 'stzh-radio, stzh-button[type=radio], stzh-card';\n\nlet radiogroupCounter = 0;\n\n/\n @slot - Slot for `stzh-radio`, `stzh-button[type=\"radio\"]` or `stzh-card` elements\n * @slot description - Slot for description\n * @slot description-long - Slot for long description (in popover)\n * @slot error - Slot for error\n /\n@Component({\n tag: \"stzh-radiogroup\",\n styleUrl: \"stzh-radiogroup.scss\",\n scoped: true\n})\nexport class StzhRadiogroup {\n /* Translation strings /\n @Prop() localization: StzhLocaleComponent;\n\n /* Whether the element is disabled or not /\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /* The name of the input radio elements, will define the radio group. If you have more than one radio group on a page, every group needs to have its own unique name /\n @Prop({ reflect: true }) name: string;\n\n /* The legend /\n @Prop() legend: string;\n\n /* Hide legend to show only for screenreaders /\n @Prop({ reflect: true }) hideLegend: boolean = false;\n\n /* Invalid status /\n @Prop({ reflect: true }) invalid: boolean = false;\n\n /* Required status /\n @Prop({ reflect: true }) required: boolean = false;\n\n /* Append text to label depending if field is optional/required. true -> show \"(optional)\", false -> show nothing /\n @Prop({ reflect: true }) showMarker: boolean = false;\n\n /* Select a radio by value /\n @Prop({ mutable: true }) value: string = \"\";\n\n /* Direction /\n @Prop({ reflect: true }) direction: \"vertical\" \| \"horizontal\" = \"vertical\";\n\n /* Description message (use description slot as alternative) /\n @Prop() description: string;\n\n /* Long description message appearing in a popover (use description-long slot as alternative) /\n @Prop() descriptionLong: string;\n\n /* One or multiple error message (use error slot as alternative) /\n @Prop() error: string \| string[];\n private _error: string[];\n\n /* Current checked radio element (readonly) /\n @Prop() checkedRadio: HTMLStzhRadioElement \| null = null;\n\n /* Prevent updating certain properties of radio elements (possible values inside array: disabled, invalid, required, hide-marker) /\n @Prop() preventUpdateProperties: string[] \| string = [];\n private _preventUpdateProperties: string[] = [];\n\n /* Host element /\n @Element() element: HTMLElement;\n\n @Watch(\"name\")\n watchName(newValue: string) {\n this.updateRadiosProperty(\"name\", newValue);\n }\n\n @Watch(\"disabled\")\n watchDisabled(newValue: boolean) {\n this.updateRadiosProperty(\"disabled\", newValue);\n }\n\n @Watch(\"invalid\")\n watchInvalid(newValue: boolean) {\n this.updateRadiosProperty(\"invalid\", newValue);\n }\n\n @Watch(\"required\")\n watchRequired(newValue: boolean) {\n this.updateRadiosProperty(\"required\", newValue);\n }\n\n @Watch(\"value\")\n watchValue(newValue: string) {\n this.updateCheckedRadioByValue(newValue);\n }\n\n @Watch(\"error\")\n errorWatcher(newValue: string \| string[]) {\n if (typeof newValue === \"string\") {\n try {\n this._error = JSON.parse(newValue);\n } catch (e) {\n if (newValue) {\n this._error = [newValue];\n } else {\n this._error = [];\n }\n }\n } else if (newValue) {\n this._error = newValue;\n } else {\n this._error = [];\n }\n\n this.invalid = this._error.length > 0;\n }\n\n @Watch(\"preventUpdateProperties\")\n preventUpdatePropertiesWatcher(newValue: string[] \| string) {\n if (typeof newValue === \"string\") {\n this._preventUpdateProperties = JSON.parse(newValue);\n } else {\n this._preventUpdateProperties = newValue;\n }\n }\n\n @Listen(\"stzhChange\")\n onChange(event: CustomEvent<StzhRadioChangeEvent>) {\n this.value = event.detail.value;\n }\n\n /* Radio elements */\n private radios: HTMLStzhRadioElement[];\n private radiogroupId: string;\n private observer: MutationObserver;\n\n private updateRadiosProperty(prop: string, value: any) {\n this.radios.forEach((radio: HTMLStzhRadioElement) => {\n if (prop === \"name\" \|\| (this._preventUpdateProperties.indexOf(prop) === -1)) {\n radio[camelCase(prop)] = value;\n }\n });\n }\n\n private updateCheckedRadioByValue(value: string) {\n this.checkedRadio = this.radios.find(radio => radio.value === value);\n\n if (this.checkedRadio) {\n this.checkedRadio.checked = true;\n }\n\n this.uncheckRadios();\n }\n\n private uncheckRadios() {\n // make sure that no other radios are checked than the current one or no one\n this.radios.forEach((radio: HTMLStzhRadioElement) => {\n if (!this.checkedRadio \|\| radio !== this.checkedRadio) {\n radio.checked = false;\n }\n });\n }\n\n private init = () => {\n // update radios\n this.radios = Array.from(this.element.querySelectorAll(SELECTOR_RADIO));\n\n this.updateRadiosProperty(\"show-marker\", false);\n this.updateRadiosProperty(\"a11y-describedby\", `${this.radiogroupId}-description`);\n\n this.watchValue(this.value);\n this.watchName(this.name);\n this.watchDisabled(this.disabled);\n this.watchInvalid(this.invalid);\n this.watchRequired(this.required);\n }\n\n async componentWillLoad() {\n this.radiogroupId = `stzh-radiogroup-${radiogroupCounter++}`;\n this.errorWatcher(this.error);\n this.preventUpdatePropertiesWatcher(this.preventUpdateProperties);\n\n if (!this.localization) {\n this.localization = await fetchTranslations(this.element, 'radiogroup');\n }\n }\n\n componentShouldUpdate(_newValue, _oldValue, prop: string) {\n return prop !== \"checkedRadio\";\n }\n\n componentDidRender() {\n this.init();\n }\n\n connectedCallback() {\n if (!this.value) {\n this.radios = Array.from(this.element.querySelectorAll(SELECTOR_RADIO));\n\n // try to find a checkbox that might has checked set to true\n const checkedRadio = this.radios.find(radio => radio.checked);\n\n if (checkedRadio) {\n this.value = checkedRadio.value;\n }\n }\n\n this.observer = new MutationObserver(this.init);\n this.observer.observe(this.element, {\n childList: true,\n subtree: true,\n });\n }\n\n disconnectedCallback() {\n if (this.observer) {\n this.observer.disconnect();\n }\n }\n\n render() {\n const descriptionUsed = hasSlot(this.element, 'description') \|\| !!this.description;\n const descriptionLongUsed = hasSlot(this.element, 'description-long') \|\| !!this.descriptionLong;\n const errorUsed = hasSlot(this.element, 'error') \|\| !!this.error;\n\n const classes = {\n \"stzh-radiogroup\": true,\n \"stzh-radiogroup--has-description\": descriptionUsed,\n \"stzh-radiogroup--has-description-long\": descriptionLongUsed,\n \"stzh-radiogroup--has-error\": errorUsed,\n \"stzh-radiogroup--is-required\": this.required,\n \"stzh-radiogroup--is-disabled\": this.disabled,\n \"stzh-radiogroup--is-invalid\": this.invalid,\n \"stzh-radiogroup--hide-legend\": this.hideLegend,\n [`stzh-radiogroup--direction-${this.direction}`]: !!this.direction\n };\n\n return (\n <fieldset class={classes}>\n {this.legend &&\n <legend class=\"stzh-radiogroup__legend\">\n {this.legend}\n {this.showMarker &&\n <span class=\"stzh-radiogroup__marker\">\n <span class=\"stzh-radiogroup__marker-symbol\" aria-hidden=\"true\">\n {this.required\n ? this.localization.$globals.requiredFieldMarker\n : this.localization.$globals.optionalFieldMarker\n }\n </span>\n <span class=\"stzh-radiogroup__marker-text\">\n {this.required\n ? this.localization.$globals.requiredFieldText\n : this.localization.$globals.optionalFieldText\n }\n </span>\n </span>\n }\n </legend>\n }\n <div class=\"stzh-radiogroup__fields\">\n <slot></slot>\n </div>\n <StzhInputDescription\n classPrefix=\"stzh-radiogroup\"\n id={`${this.radiogroupId}-description`}\n error={this._error}\n description={this.description}\n descriptionLong={this.descriptionLong}\n descriptionLongUsed={descriptionLongUsed}\n moreInfoButtonLabel={this.localization.$globals.moreInfoButtonLabel}\n />\n </fieldset>\n );\n }\n}\n"],"version":3}

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

@@ -174,7 +174,7 @@ const StzhDialog = class {
         "stzh-dialog--has-heading": !!this.heading,
         "stzh-dialog--has-close-hidden": this.hideClose,
         [`stzh-dialog--size-${this.size}`]: !!this.size,
-      } }, index.h("div", { class: "stzh-dialog__backdrop" }), index.h("div", { class: "stzh-dialog__content" }, index.h("div", { class: "stzh-dialog__dialog", ref: (el) => (this.dialogElement = el), tabindex: "-1", role: this.a11yRole, "aria-label": this.a11yLabel, "aria-labelledby": this.heading ? `${this.id}-heading` : null, "aria-hidden": this.open ? "false" : "true", onClick: this.handleDialogClick }, this.heading &&
+      } }, index.h("div", { class: "stzh-dialog__backdrop" }), index.h("div", { class: "stzh-dialog__content" }, index.h("div", { class: "stzh-dialog__dialog", ref: (el) => (this.dialogElement = el), tabindex: "-1", role: this.a11yRole, "aria-label": this.a11yLabel || null, "aria-labelledby": this.heading ? `${this.id}-heading` : null, "aria-hidden": this.open ? "false" : "true", onClick: this.handleDialogClick }, this.heading &&
       index.h("stzh-heading", { id: `${this.id}-heading`, class: "stzh-dialog__heading", level: "2", "with-border": true }, this.heading), index.h("div", { class: "stzh-dialog__dialog-content" }, index.h("slot", null)), index.h("div", { class: "stzh-dialog__actions" }, index.h("slot", { name: "actions" })), !this.hideClose &&
       index.h("button", { class: "stzh-dialog__close-button", onClick: this.handleCloseButtonClick, "aria-label": this.localization.close, type: "button", "s-object-id": this.closeAnalyticsId || this.localization.close }, index.h("stzh-icon", { class: "stzh-dialog__close-icon", name: "close" })))))));
   }