npm - @ukic/web-components - Versions diffs - 3.4.0 → 3.6.0 - Mend

@ukic/web-components 3.4.0 → 3.6.0

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

Files changed (542) hide show

package/dist/components/ic-checkbox.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ic-checkbox.js","mappings":"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","names":[],"sources":["src/components/ic-checkbox/ic-checkbox.css?tag=ic-checkbox&encapsulation=shadow","src/components/ic-checkbox/ic-checkbox.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host(.ic-checkbox-disabled) {\n pointer-events: none;\n}\n\n.container {\n display: flex;\n width: fit-content;\n padding: var(--ic-space-xxs) 0 var(--ic-space-xxs) var(--ic-space-xxs);\n margin-bottom: var(--ic-space-xxs);\n align-items: center;\n}\n\n:host(.ic-data-table-checkbox) .container {\n padding: 0;\n margin-bottom: 0;\n}\n\n:host(.ic-checkbox-small) .container {\n margin-bottom: var(--ic-space-xxxs);\n}\n\n.checkbox {\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n display: block;\n position: relative;\n top: 0;\n left: 0;\n height: var(--ic-space-lg);\n width: var(--ic-space-lg);\n background-color: var(--ic-checkbox-background-unselected);\n border: var(--ic-border-width) solid var(--ic-checkbox-border-unselected);\n border-radius: var(--ic-border-radius);\n outline: none;\n cursor: pointer;\n transition: var(--ic-easing-transition-fast);\n flex-shrink: 0;\n}\n\n:host .container svg {\n width: var(--ic-space-lg);\n height: var(--ic-space-lg);\n}\n\n:host(.ic-checkbox-small) .checkbox,\n:host(.ic-checkbox-small) .container svg {\n width: var(--ic-space-md);\n height: var(--ic-space-md);\n}\n\n:host(.ic-checkbox-large) .checkbox,\n:host(.ic-checkbox-large) .container svg {\n width: var(--ic-space-xl);\n height: var(--ic-space-xl);\n}\n\n.checkbox:checked {\n background-color: var(--ic-checkbox-background-selected);\n border: var(--ic-border-width) solid var(--ic-checkbox-background-selected);\n transition: var(--ic-easing-transition-slow);\n}\n\n.checkbox:checked:disabled {\n background-color: var(--ic-checkbox-background-selected-disabled);\n border: var(--ic-border-width) solid\n var(--ic-checkbox-background-selected-disabled);\n}\n\n.checkbox:indeterminate,\n.checkbox.indeterminate:checked {\n background-color: var(--ic-checkbox-background-indeterminate);\n border: 0.125rem solid var(--ic-checkbox-background-indeterminate);\n}\n\n.checkbox:indeterminate:disabled,\n.checkbox.indeterminate:checked:disabled {\n background-color: var(--ic-checkbox-background-indeterminate-disabled);\n border: 0.125rem solid var(--ic-checkbox-background-indeterminate-disabled);\n}\n\n.checkbox:checked:hover {\n background-color: var(--ic-checkbox-background-selected-hover);\n}\n\n.checkbox:indeterminate:hover,\n.checkbox.indeterminate:checked:hover {\n background-color: var(--ic-checkbox-background-indeterminate-hover);\n border: 0.125rem solid var(--ic-checkbox-background-indeterminate-hover);\n}\n\n.checkbox:checked:active {\n background-color: var(--ic-checkbox-background-selected-pressed);\n}\n\n.checkbox:indeterminate:active,\n.checkbox.indeterminate:checked:active {\n background-color: var(--ic-checkbox-background-indeterminate-pressed);\n border: 0.125rem solid var(--ic-checkbox-background-indeterminate-pressed);\n}\n\n.checkbox:hover {\n box-shadow: 0 0 0 0.25rem var(--ic-checkbox-action-background-hover);\n border: var(--ic-border-width) solid\n var(--ic-checkbox-border-unselected-hover);\n}\n\n.checkbox:active {\n box-shadow: 0 0 0 0.25rem var(--ic-checkbox-action-background-pressed);\n border: var(--ic-border-width) solid\n var(--ic-checkbox-border-unselected-pressed);\n}\n\n.checkbox:focus {\n box-shadow: var(--ic-border-focus);\n}\n\n.checkbox:disabled {\n border: var(--ic-border-width) dashed\n var(--ic-checkbox-border-unselected-disabled);\n}\n\n.checkbox-label {\n padding-left: var(--ic-space-sm);\n color: var(--ic-checkbox-text);\n\n --ic-typography-color: var(--ic-checkbox-text);\n}\n\n:host(.ic-checkbox-disabled) .checkbox-label {\n color: var(--ic-checkbox-text-disabled);\n\n --ic-typography-color: var(--ic-checkbox-text-disabled);\n}\n\n.checkbox-label:hover {\n cursor: pointer;\n}\n\n.checkmark {\n position: relative;\n right: calc(-1 * var(--ic-space-lg));\n margin-left: calc(-1 * var(--ic-space-lg));\n fill: var(--ic-checkbox-icon-pressed);\n z-index: 1;\n background-color: transparent;\n pointer-events: none;\n flex-shrink: 0;\n}\n\n:host(.ic-checkbox-small) .checkmark {\n margin-left: calc(-1 * var(--ic-space-md));\n right: calc(-1 * var(--ic-space-md));\n}\n\n:host(.ic-checkbox-large) .checkmark {\n margin-left: calc(-1 * var(--ic-space-xl));\n right: calc(-1 * var(--ic-space-xl));\n}\n\n.indeterminate-symbol {\n position: relative;\n width: 0.875rem;\n height: var(--ic-space-xxxs);\n right: -1.188rem;\n margin-left: -0.875rem;\n z-index: 1;\n background-color: var(--ic-checkbox-icon-indeterminate);\n pointer-events: none;\n flex-shrink: 0;\n}\n\n:host(.ic-checkbox-small) .indeterminate-symbol {\n width: 0.6rem;\n right: -0.8rem;\n margin-left: -0.6rem;\n}\n\n:host(.ic-checkbox-large) .indeterminate-symbol {\n width: 1.25rem;\n right: -1.625rem;\n margin-left: -1.25rem;\n}\n\n.additional-field-wrapper {\n margin-left: calc(var(--ic-space-md) + var(--ic-space-lg));\n margin-top: calc(var(--ic-space-sm) / 2);\n}\n\n.branch-corner {\n height: var(--ic-space-md);\n width: var(--ic-space-xl);\n border-radius: 0 0 0 0.188rem;\n border-bottom: 0.125rem solid var(--ic-checkbox-required-bar);\n border-left: 0.125rem solid var(--ic-checkbox-required-bar);\n}\n\n.dynamic-container {\n display: flex;\n position: relative;\n margin: var(--ic-space-xxxs) 0 var(--ic-space-xxs) var(--ic-space-md);\n gap: var(--ic-space-xs);\n}\n\n.dynamic-text {\n color: var(--ic-checkbox-required-text);\n\n --ic-typography-color: var(--ic-checkbox-required-text);\n\n margin-top: calc(var(--ic-space-sm) / 2);\n margin-bottom: var(--ic-space-xs);\n border-radius: 2%;\n}\n\n.dynamic-field-container {\n flex: 100%;\n}\n\n@media (max-width: 576px) {\n ::slotted() {\n --input-width: 100%;\n }\n\n .dynamic-field-container {\n flex: initial;\n }\n}\n\n@media (forced-colors: active) {\n / Styles here only apply to Forced Colors Mode /\n .checkbox {\n appearance: revert;\n transition: none;\n }\n\n .checkbox:checked {\n transition: none;\n }\n\n .checkbox:focus-visible {\n outline: 0.125rem solid highlight;\n }\n\n .checkbox:disabled:not(:checked) {\n appearance: none;\n border-color: GrayText;\n }\n\n .checkmark {\n fill: none;\n }\n\n .indeterminate-symbol {\n display: none;\n }\n}\n\n/ Right to left /\n.checkmark:dir(rtl) {\n right: 0;\n}\n\n.checkbox-label:dir(rtl) {\n padding-right: var(--ic-space-sm);\n padding-left: 0;\n}\n\n.indeterminate-symbol:dir(rtl) {\n right: 0.288rem;\n}\n\n.branch-corner:dir(rtl) {\n border-radius: 0 0 0.188rem;\n border-right: 0.125rem solid var(--ic-action-default);\n border-left: none;\n}\n\n.dynamic-container:dir(rtl) {\n margin: var(--ic-space-xxxs) var(--ic-space-sm) var(--ic-space-xxs) 0;\n}\n","import {\n Component,\n Host,\n h,\n Prop,\n Element,\n Event,\n EventEmitter,\n State,\n Method,\n Watch,\n} from \"@stencil/core\";\nimport {\n IcAdditionalFieldTypes,\n IcSizes,\n IcThemeMode,\n} from \"../../utils/types\";\nimport {\n isSlotUsed,\n onComponentRequiredPropUndefined,\n renderHiddenInput,\n removeHiddenInput,\n addFormResetListener,\n removeFormResetListener,\n removeDisabledFalse,\n} from \"../../utils/helpers\";\n\n/\n @slot additional-field - Content to be displayed alongside a checkbox.\n /\n@Component({\n tag: \"ic-checkbox\",\n styleUrl: \"ic-checkbox.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nexport class Checkbox {\n private additionalFieldContainer?: HTMLDivElement;\n private checkboxEl?: HTMLInputElement;\n\n @Element() el: HTMLIcCheckboxElement;\n\n /\n The style of additionalField that will be displayed if used.\n /\n @Prop({ reflect: true }) additionalFieldDisplay: IcAdditionalFieldTypes =\n \"static\";\n\n /\n If `true`, the checkbox will be set to the checked state. This is only the initial state and will be updated to unchecked if the checkbox is clicked.\n /\n @Prop({ reflect: true, mutable: true }) checked = false;\n @State() initiallyChecked = this.checked;\n\n /\n If `true`, the checkbox will be set to the disabled state.\n /\n @Prop() disabled = false;\n @Watch(\"disabled\")\n watchDisabledHandler(): void {\n removeDisabledFalse(this.disabled, this.el);\n }\n\n /\n The text to be displayed when dynamic.\n /\n\n @Prop() dynamicText = \"This selection requires additional answers\";\n\n /\n The <form> element to associate the checkbox with.\n /\n @Prop() form?: string;\n\n /\n The group label for the checkbox.\n /\n @Prop({ mutable: true }) groupLabel?: string;\n\n /\n If `true`, the label will be hidden and the required label value will be applied as an aria-label.\n /\n @Prop() hideLabel = false;\n\n /\n If `true`, the indeterminate state will be displayed when checked.\n /\n @Prop() indeterminate = false;\n @State() displayIndeterminate = this.indeterminate;\n\n @Watch(\"indeterminate\")\n watchIndeterminateHandler(): void {\n this.displayIndeterminate =\n this.indeterminate && (this.nativeIndeterminateBehaviour \|\| this.checked);\n }\n\n /\n The label for the checkbox.\n /\n @Prop() label!: string;\n\n /\n The name for the checkbox. If not set when used in a checkbox group, the name will be based on the group name.\n /\n @Prop({ mutable: true }) name?: string;\n\n /\n If `true`, the checkbox will behave like a native checkbox where the `indeterminate` prop sets the indeterminate visual styling, independent of the `checked` state.\n /\n @Prop() nativeIndeterminateBehaviour = false;\n\n /\n The size of the checkbox to be displayed. This does not affect the font size of the label. If a checkbox is contained in a checkbox group, this will override the size set on checkbox group.\n /\n @Prop({ mutable: true }) size?: IcSizes;\n\n /\n Sets the theme color to the dark or light theme color. \"inherit\" will set the color based on the system settings or ic-theme component.\n /\n @Prop() theme: IcThemeMode = \"inherit\";\n\n /\n The value for the checkbox.\n /\n @Prop() value = \"\";\n\n /\n Emitted when a checkbox has been checked.\n /\n @Event() icCheck: EventEmitter<void>;\n\n componentWillLoad(): void {\n removeDisabledFalse(this.disabled, this.el);\n\n addFormResetListener(this.el, this.handleFormReset);\n\n const { parentElement } = this.el;\n if (parentElement?.tagName === \"IC-CHECKBOX-GROUP\") {\n const { name, label, size } = parentElement as HTMLIcCheckboxGroupElement;\n\n if (!this.name) this.name = name;\n if (!this.size) this.size = size;\n this.groupLabel = label;\n }\n }\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [{ prop: this.label, propName: \"label\" }],\n \"Checkbox\"\n );\n }\n\n componentDidRender(): void {\n if (this.additionalFieldDisplay === \"static\") {\n const textfieldElements = this.el.querySelectorAll(\"ic-text-field\");\n textfieldElements.forEach((textfield) =>\n textfield.setAttribute(\"disabled\", this.checked ? \"false\" : \"true\")\n );\n } else if (this.additionalFieldContainer) {\n this.additionalFieldContainer.style.display = !this.checked\n ? \"none\"\n : \"flex\";\n }\n }\n\n disconnectedCallback(): void {\n removeFormResetListener(this.el, this.handleFormReset);\n }\n\n /\n Sets focus on the checkbox.\n */\n @Method()\n async setFocus(): Promise<void> {\n this.checkboxEl?.focus();\n }\n\n private handleClick = () => {\n this.checked = !this.checked;\n this.displayIndeterminate =\n !this.nativeIndeterminateBehaviour && this.indeterminate && this.checked;\n this.icCheck.emit();\n };\n\n private handleFormReset = (): void => {\n this.checked = this.initiallyChecked;\n };\n\n render() {\n const {\n additionalFieldDisplay,\n checked,\n disabled,\n displayIndeterminate,\n dynamicText,\n el,\n form,\n groupLabel,\n handleClick,\n hideLabel,\n label,\n name,\n size,\n theme,\n value,\n } = this;\n\n const id = `ic-checkbox-${label}-${groupLabel}`.replace(/ /g, \"-\");\n\n const isDynamicAdditionalField = additionalFieldDisplay === \"dynamic\";\n\n checked\n ? renderHiddenInput(el, value, name, disabled)\n : removeHiddenInput(el);\n\n return (\n <Host\n class={{\n \"ic-checkbox-disabled\": disabled,\n [`ic-checkbox-${size}`]: !!size,\n [`ic-theme-${theme}`]: theme !== \"inherit\",\n }}\n >\n <div class=\"container\">\n {displayIndeterminate ? (\n <div class=\"indeterminate-symbol\" />\n ) : (\n checked && (\n <svg\n class=\"checkmark\"\n viewBox=\"0 0 24 24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n >\n <title>checkmark icon</title>\n <path d=\"M21 6.285l-11.16 12.733-6.84-6.018 1.319-1.49 5.341 4.686 9.865-11.196 1.475 1.285z\" />\n </svg>\n )\n )}\n <input\n role=\"checkbox\"\n class={{\n checkbox: true,\n checked,\n indeterminate: displayIndeterminate,\n }}\n ref={(el) => (this.checkboxEl = el)}\n type=\"checkbox\"\n name={name}\n id={id}\n value={value}\n disabled={disabled}\n checked={checked}\n indeterminate={displayIndeterminate}\n onClick={handleClick}\n form={form}\n aria-label={hideLabel ? label : undefined}\n ></input>\n {!hideLabel && (\n <ic-typography class=\"checkbox-label\" variant=\"body\">\n <label htmlFor={id}>{label}</label>\n </ic-typography>\n )}\n </div>\n {isSlotUsed(el, \"additional-field\") && (\n <div\n class=\"dynamic-container\"\n ref={(el) => (this.additionalFieldContainer = el)}\n >\n {isDynamicAdditionalField && <div class=\"branch-corner\"></div>}\n <div class=\"dynamic-field-container\">\n {isDynamicAdditionalField && (\n <ic-typography variant=\"caption\">\n <p class=\"dynamic-text\" aria-live=\"polite\">\n {dynamicText}\n </p>\n </ic-typography>\n )}\n <div\n class={{\n \"additional-field-wrapper\": !isDynamicAdditionalField,\n }}\n >\n <slot name=\"additional-field\"></slot>\n </div>\n </div>\n </div>\n )}\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ic-checkbox.js","mappings":"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","names":[],"sources":["src/components/ic-checkbox/ic-checkbox.css?tag=ic-checkbox&encapsulation=shadow","src/components/ic-checkbox/ic-checkbox.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host(.ic-checkbox-disabled) {\n pointer-events: none;\n}\n\n.container {\n display: flex;\n width: fit-content;\n padding: var(--ic-space-xxs) 0 var(--ic-space-xxs) var(--ic-space-xxs);\n margin-bottom: var(--ic-space-xxs);\n align-items: center;\n}\n\n:host(.ic-data-table-checkbox) .container {\n padding: 0;\n margin-bottom: 0;\n}\n\n:host(.ic-checkbox-small) .container {\n margin-bottom: var(--ic-space-xxxs);\n}\n\n.checkbox {\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n display: block;\n position: relative;\n top: 0;\n left: 0;\n height: var(--ic-space-lg);\n width: var(--ic-space-lg);\n background-color: var(--ic-checkbox-background-unselected);\n border: var(--ic-border-width) solid var(--ic-checkbox-border-unselected);\n border-radius: var(--ic-border-radius);\n outline: none;\n cursor: pointer;\n transition: var(--ic-easing-transition-fast);\n flex-shrink: 0;\n}\n\n:host .container svg {\n width: var(--ic-space-lg);\n height: var(--ic-space-lg);\n}\n\n:host(.ic-checkbox-small) .checkbox,\n:host(.ic-checkbox-small) .container svg {\n width: var(--ic-space-md);\n height: var(--ic-space-md);\n}\n\n:host(.ic-checkbox-large) .checkbox,\n:host(.ic-checkbox-large) .container svg {\n width: var(--ic-space-xl);\n height: var(--ic-space-xl);\n}\n\n.checkbox:checked {\n background-color: var(--ic-checkbox-background-selected);\n border: var(--ic-border-width) solid var(--ic-checkbox-background-selected);\n transition: var(--ic-easing-transition-slow);\n}\n\n.checkbox:checked:disabled {\n background-color: var(--ic-checkbox-background-selected-disabled);\n border: var(--ic-border-width) solid\n var(--ic-checkbox-background-selected-disabled);\n}\n\n.checkbox:indeterminate,\n.checkbox.indeterminate:checked {\n background-color: var(--ic-checkbox-background-indeterminate);\n border: 0.125rem solid var(--ic-checkbox-background-indeterminate);\n}\n\n.checkbox:indeterminate:disabled,\n.checkbox.indeterminate:checked:disabled {\n background-color: var(--ic-checkbox-background-indeterminate-disabled);\n border: 0.125rem solid var(--ic-checkbox-background-indeterminate-disabled);\n}\n\n.checkbox:checked:hover {\n background-color: var(--ic-checkbox-background-selected-hover);\n}\n\n.checkbox:indeterminate:hover,\n.checkbox.indeterminate:checked:hover {\n background-color: var(--ic-checkbox-background-indeterminate-hover);\n border: 0.125rem solid var(--ic-checkbox-background-indeterminate-hover);\n}\n\n.checkbox:checked:active {\n background-color: var(--ic-checkbox-background-selected-pressed);\n}\n\n.checkbox:indeterminate:active,\n.checkbox.indeterminate:checked:active {\n background-color: var(--ic-checkbox-background-indeterminate-pressed);\n border: 0.125rem solid var(--ic-checkbox-background-indeterminate-pressed);\n}\n\n.checkbox:hover {\n box-shadow: 0 0 0 0.25rem var(--ic-checkbox-action-background-hover);\n border: var(--ic-border-width) solid\n var(--ic-checkbox-border-unselected-hover);\n}\n\n.checkbox:active {\n box-shadow: 0 0 0 0.25rem var(--ic-checkbox-action-background-pressed);\n border: var(--ic-border-width) solid\n var(--ic-checkbox-border-unselected-pressed);\n}\n\n.checkbox:focus {\n box-shadow: var(--ic-border-focus);\n}\n\n.checkbox:disabled {\n border: var(--ic-border-width) dashed\n var(--ic-checkbox-border-unselected-disabled);\n}\n\n.checkbox-label {\n color: var(--ic-checkbox-text);\n\n --ic-typography-color: var(--ic-checkbox-text);\n}\n\n.checkbox-label > label {\n padding-left: var(--ic-space-sm);\n}\n\n:host(.ic-checkbox-disabled) .checkbox-label {\n color: var(--ic-checkbox-text-disabled);\n\n --ic-typography-color: var(--ic-checkbox-text-disabled);\n}\n\n.checkbox-label:hover {\n cursor: pointer;\n}\n\n.checkmark {\n position: relative;\n right: calc(-1 * var(--ic-space-lg));\n margin-left: calc(-1 * var(--ic-space-lg));\n fill: var(--ic-checkbox-icon-pressed);\n z-index: 1;\n background-color: transparent;\n pointer-events: none;\n flex-shrink: 0;\n}\n\n:host(.ic-checkbox-small) .checkmark {\n margin-left: calc(-1 * var(--ic-space-md));\n right: calc(-1 * var(--ic-space-md));\n}\n\n:host(.ic-checkbox-large) .checkmark {\n margin-left: calc(-1 * var(--ic-space-xl));\n right: calc(-1 * var(--ic-space-xl));\n}\n\n.indeterminate-symbol {\n position: relative;\n width: 0.875rem;\n height: var(--ic-space-xxxs);\n right: -1.188rem;\n margin-left: -0.875rem;\n z-index: 1;\n background-color: var(--ic-checkbox-icon-indeterminate);\n pointer-events: none;\n flex-shrink: 0;\n}\n\n:host(.ic-checkbox-small) .indeterminate-symbol {\n width: 0.6rem;\n right: -0.8rem;\n margin-left: -0.6rem;\n}\n\n:host(.ic-checkbox-large) .indeterminate-symbol {\n width: 1.25rem;\n right: -1.625rem;\n margin-left: -1.25rem;\n}\n\n.additional-field-wrapper {\n margin-left: calc(var(--ic-space-md) + var(--ic-space-lg));\n margin-top: calc(var(--ic-space-sm) / 2);\n}\n\n.branch-corner {\n height: var(--ic-space-md);\n width: var(--ic-space-xl);\n border-radius: 0 0 0 0.188rem;\n border-bottom: 0.125rem solid var(--ic-checkbox-required-bar);\n border-left: 0.125rem solid var(--ic-checkbox-required-bar);\n}\n\n.dynamic-container {\n display: flex;\n position: relative;\n margin: var(--ic-space-xxxs) 0 var(--ic-space-xxs) var(--ic-space-md);\n gap: var(--ic-space-xs);\n}\n\n.dynamic-text {\n color: var(--ic-checkbox-required-text);\n\n --ic-typography-color: var(--ic-checkbox-required-text);\n\n margin-top: calc(var(--ic-space-sm) / 2);\n margin-bottom: var(--ic-space-xs);\n border-radius: 2%;\n}\n\n.dynamic-field-container {\n flex: 100%;\n}\n\n@media (max-width: 576px) {\n ::slotted() {\n --input-width: 100%;\n }\n\n .dynamic-field-container {\n flex: initial;\n }\n}\n\n@media (forced-colors: active) {\n / Styles here only apply to Forced Colors Mode /\n .checkbox {\n appearance: revert;\n transition: none;\n }\n\n .checkbox:checked {\n transition: none;\n }\n\n .checkbox:focus-visible {\n outline: 0.125rem solid highlight;\n }\n\n .checkbox:disabled:not(:checked) {\n appearance: none;\n border-color: GrayText;\n }\n\n .checkmark {\n fill: none;\n }\n\n .indeterminate-symbol {\n display: none;\n }\n}\n\n/ Right to left /\n.checkmark:dir(rtl) {\n right: 0;\n}\n\n.checkbox-label:dir(rtl) {\n padding-right: var(--ic-space-sm);\n padding-left: 0;\n}\n\n.indeterminate-symbol:dir(rtl) {\n right: 0.288rem;\n}\n\n.branch-corner:dir(rtl) {\n border-radius: 0 0 0.188rem;\n border-right: 0.125rem solid var(--ic-action-default);\n border-left: none;\n}\n\n.dynamic-container:dir(rtl) {\n margin: var(--ic-space-xxxs) var(--ic-space-sm) var(--ic-space-xxs) 0;\n}\n","import {\n Component,\n Host,\n h,\n Prop,\n Element,\n Event,\n EventEmitter,\n State,\n Method,\n Watch,\n} from \"@stencil/core\";\nimport {\n IcAdditionalFieldTypes,\n IcSizes,\n IcThemeMode,\n} from \"../../utils/types\";\nimport {\n isSlotUsed,\n onComponentRequiredPropUndefined,\n renderHiddenInput,\n removeHiddenInput,\n addFormResetListener,\n removeFormResetListener,\n removeDisabledFalse,\n} from \"../../utils/helpers\";\n\n/\n @slot additional-field - Content to be displayed alongside a checkbox.\n /\n@Component({\n tag: \"ic-checkbox\",\n styleUrl: \"ic-checkbox.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nexport class Checkbox {\n private additionalFieldContainer?: HTMLDivElement;\n private checkboxEl?: HTMLInputElement;\n\n @Element() el: HTMLIcCheckboxElement;\n\n /\n The style of additionalField that will be displayed if used.\n /\n @Prop({ reflect: true }) additionalFieldDisplay: IcAdditionalFieldTypes =\n \"static\";\n\n /\n If `true`, the checkbox will be set to the checked state. This is only the initial state and will be updated to unchecked if the checkbox is clicked.\n /\n @Prop({ reflect: true, mutable: true }) checked = false;\n @State() initiallyChecked = this.checked;\n\n /\n If `true`, the checkbox will be set to the disabled state.\n /\n @Prop() disabled = false;\n @Watch(\"disabled\")\n watchDisabledHandler(): void {\n removeDisabledFalse(this.disabled, this.el);\n }\n\n /\n The text to be displayed when dynamic.\n /\n\n @Prop() dynamicText = \"This selection requires additional answers\";\n\n /\n The <form> element to associate the checkbox with.\n /\n @Prop() form?: string;\n\n /\n The group label for the checkbox.\n /\n @Prop({ mutable: true }) groupLabel?: string;\n\n /\n If `true`, the label will be hidden and the required label value will be applied as an aria-label.\n /\n @Prop() hideLabel = false;\n\n /\n If `true`, the indeterminate state will be displayed when checked.\n /\n @Prop() indeterminate = false;\n @State() displayIndeterminate = this.indeterminate;\n @Watch(\"indeterminate\")\n watchIndeterminateHandler(): void {\n this.displayIndeterminate =\n this.indeterminate && (this.nativeIndeterminateBehaviour \|\| this.checked);\n }\n\n /\n The label for the checkbox.\n /\n @Prop() label!: string;\n\n /\n The name for the checkbox. If not set when used in a checkbox group, the name will be based on the group name.\n /\n @Prop({ mutable: true }) name?: string;\n\n /\n If `true`, the checkbox will behave like a native checkbox where the `indeterminate` prop sets the indeterminate visual styling, independent of the `checked` state.\n /\n @Prop() nativeIndeterminateBehaviour = false;\n\n /\n The size of the checkbox to be displayed. This does not affect the font size of the label. If a checkbox is contained in a checkbox group, this will override the size set on checkbox group.\n /\n @Prop({ mutable: true }) size?: IcSizes;\n\n /\n Sets the theme color to the dark or light theme color. \"inherit\" will set the color based on the system settings or ic-theme component.\n /\n @Prop() theme: IcThemeMode = \"inherit\";\n\n /\n The value for the checkbox.\n /\n @Prop() value = \"\";\n\n /\n Emitted when a checkbox has been checked.\n /\n @Event() icCheck: EventEmitter<void>;\n\n componentWillLoad(): void {\n removeDisabledFalse(this.disabled, this.el);\n\n addFormResetListener(this.el, this.handleFormReset);\n\n const { parentElement } = this.el;\n if (parentElement?.tagName === \"IC-CHECKBOX-GROUP\") {\n const { name, label, size } = parentElement as HTMLIcCheckboxGroupElement;\n\n if (!this.name) this.name = name;\n if (!this.size) this.size = size;\n this.groupLabel = label;\n }\n }\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [{ prop: this.label, propName: \"label\" }],\n \"Checkbox\"\n );\n }\n\n componentDidRender(): void {\n if (this.additionalFieldDisplay === \"static\") {\n this.el\n .querySelectorAll(\"ic-text-field\")\n .forEach((textfield) =>\n textfield.setAttribute(\"disabled\", `${!this.checked}`)\n );\n } else if (this.additionalFieldContainer) {\n this.additionalFieldContainer.style.display = !this.checked\n ? \"none\"\n : \"flex\";\n }\n }\n\n disconnectedCallback(): void {\n removeFormResetListener(this.el, this.handleFormReset);\n }\n\n /\n Sets focus on the checkbox.\n */\n @Method()\n async setFocus(): Promise<void> {\n this.checkboxEl?.focus();\n }\n\n private handleClick = () => {\n this.checked = !this.checked;\n this.displayIndeterminate =\n !this.nativeIndeterminateBehaviour && this.indeterminate && this.checked;\n this.icCheck.emit();\n };\n\n private handleFormReset = (): void => {\n this.checked = this.initiallyChecked;\n };\n\n render() {\n const {\n additionalFieldDisplay,\n checked,\n disabled,\n displayIndeterminate,\n dynamicText,\n el,\n form,\n groupLabel,\n handleClick,\n hideLabel,\n label,\n name,\n size,\n theme,\n value,\n } = this;\n\n const id = `ic-checkbox-${label}-${groupLabel}`.replace(/ /g, \"-\");\n\n const isDynamicAdditionalField = additionalFieldDisplay === \"dynamic\";\n\n checked\n ? renderHiddenInput(el, value, name, disabled)\n : removeHiddenInput(el);\n\n return (\n <Host\n class={{\n \"ic-checkbox-disabled\": disabled,\n [`ic-checkbox-${size}`]: !!size,\n [`ic-theme-${theme}`]: theme !== \"inherit\",\n }}\n >\n <div class=\"container\">\n {displayIndeterminate ? (\n <div class=\"indeterminate-symbol\" />\n ) : (\n checked && (\n <svg\n class=\"checkmark\"\n viewBox=\"0 0 24 24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n >\n <title>checkmark icon</title>\n <path d=\"M21 6.285l-11.16 12.733-6.84-6.018 1.319-1.49 5.341 4.686 9.865-11.196 1.475 1.285z\" />\n </svg>\n )\n )}\n <input\n role=\"checkbox\"\n class={{\n checkbox: true,\n checked,\n indeterminate: displayIndeterminate,\n }}\n ref={(el) => (this.checkboxEl = el)}\n type=\"checkbox\"\n name={name}\n id={id}\n value={value}\n disabled={disabled}\n checked={checked}\n indeterminate={displayIndeterminate}\n onClick={handleClick}\n form={form}\n aria-label={hideLabel ? label : undefined}\n ></input>\n {!hideLabel && (\n <ic-typography class=\"checkbox-label\" variant=\"body\">\n <label htmlFor={id}>{label}</label>\n </ic-typography>\n )}\n </div>\n {isSlotUsed(el, \"additional-field\") && (\n <div\n class=\"dynamic-container\"\n ref={(el) => (this.additionalFieldContainer = el)}\n >\n {isDynamicAdditionalField && <div class=\"branch-corner\"></div>}\n <div class=\"dynamic-field-container\">\n {isDynamicAdditionalField && (\n <ic-typography variant=\"caption\">\n <p class=\"dynamic-text\" aria-live=\"polite\">\n {dynamicText}\n </p>\n </ic-typography>\n )}\n <div\n class={{\n \"additional-field-wrapper\": !isDynamicAdditionalField,\n }}\n >\n <slot name=\"additional-field\"></slot>\n </div>\n </div>\n </div>\n )}\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/ic-data-list.js CHANGED Viewed

@@ -23,10 +23,10 @@ const DataList = /*@__PURE__*/ proxyCustomElement(class DataList extends HTMLEle
         if (size === "small") {
             Array.from(el.children).forEach((child) => child.setAttribute("size", "small"));
         }
-        return (h(Host, { key: '57187729e8c442e305a364a8bb870af10d7c789a', class: {
+        return (h(Host, { key: 'a10decea9f6872dd3a86cb4e8d989f1628ddd8dd', class: {
                 "ic-data-list-small": size === "small",
                 [`ic-theme-${theme}`]: theme !== "inherit",
-            } }, h("div", { key: 'd208727c390375a5c9a137793dc4e49870d1fc5c', class: "heading", id: "data-list-heading" }, h("slot", { key: 'cbaef30591b61e5cb08cd22defe9bfff47f442c3', name: "heading" }, h("ic-typography", { key: '4dcdac2796af8a867123a49df76acf2f056de9cb', variant: "h3" }, heading))), h("div", { key: '32168bcd286cdb0ed55fa824406e13dea9c97b03', class: "divider" }), h("ul", { key: 'e8e98e25dd09803f4771d48ac20956ea518c8a12', "aria-labelledby": "data-list-heading", class: "rows" }, h("slot", { key: '09dc75e0a80760d56e370ad0b52231f4143549e8' }))));
+            } }, h("div", { key: '5e818e459c2dd23b6e021d82012150757b7520e9', class: "heading", id: "data-list-heading" }, h("slot", { key: '2d68d50a52c8fc3882aa9138ce427c23ccdbc394', name: "heading" }, h("ic-typography", { key: '275d859a1075fd96294913acf1a3b2b9bb1777c2', variant: "h3" }, heading))), h("div", { key: '06e942c78939bf9526ef3bcebba1c76db3c3f608', class: "divider" }), h("ul", { key: '9e7218ee17444774d184680d27e3e11424953bfc', "aria-labelledby": "data-list-heading", class: "rows" }, h("slot", { key: 'a75aec759140988dc2d673385d7eef1fc0e7dba5' }))));
     }
     get el() { return this; }
     static get style() { return IcDataListStyle0; }

package/dist/components/ic-data-row.js CHANGED Viewed

@@ -71,12 +71,12 @@ const DataRow = /*@__PURE__*/ proxyCustomElement(class DataRow extends HTMLEleme
     }
     render() {
         const { el, listSize, hasEndComponent, label, renderCellContent, size, theme, value, } = this;
-        return (h(Host, { key: '34f5970795bba243994fce6f2006d699c786cc51', class: {
+        return (h(Host, { key: '2faf353c648f521406dc1318be100192dece1aab', class: {
                 ["ic-data-row-small"]: size === "small",
                 ["breakpoint-medium"]: listSize === "m",
                 ["breakpoint-xs"]: listSize === "xs",
                 [`ic-theme-${theme}`]: theme !== "inherit",
-            }, role: "listitem" }, h("div", { key: 'f855811376a3e1db1d4a8bab563715d028c07341', class: "data" }, h("div", { key: '2395506f64696056aadfce34d46ffc99ab6db356', class: "text-cells" }, (isSlotUsed(el, "label") || label) && renderCellContent("label"), (isSlotUsed(el, "value") || value) && renderCellContent("value")), hasEndComponent && (h("div", { key: '87993084bf9673f61edc6f0c04c937f20cd5a10d', class: "end-component" }, h("slot", { key: 'f051b30c5f67e8ea324656391356699a5eeef818', name: "end-component" })))), h("div", { key: 'bf023260ea85682f165370fb1295bd6facf8c45e', class: "divider" })));
+            }, role: "listitem" }, h("div", { key: '3d8e82d44292400dc5cf92230967eb3c9cc57cd0', class: "data" }, h("div", { key: '1e1edf0e3cefbe7cf2bb7e6ab973e55eeab1c0e3', class: "text-cells" }, (isSlotUsed(el, "label") || label) && renderCellContent("label"), (isSlotUsed(el, "value") || value) && renderCellContent("value")), hasEndComponent && (h("div", { key: '0b60b67c17cce484293060ec5ba89619f527e5c9', class: "end-component" }, h("slot", { key: '403f6290fd00ef44fa02baaeed36932caf6f9902', name: "end-component" })))), h("div", { key: '653123df7e4243474aa5254d948b1666c9b50722', class: "divider" })));
     }
     get el() { return this; }
     static get style() { return IcDataRowStyle0; }

package/dist/components/ic-dialog.js CHANGED Viewed

@@ -205,7 +205,7 @@ const Dialog = /*@__PURE__*/ proxyCustomElement(class Dialog extends HTMLElement
             return (isHidden ||
                 (element.getAttribute("type") === "radio" &&
                     !!radioEl &&
-                    !radioEl.hasAttribute("selected")));
+                    !(radioEl.hasAttribute("selected") || element.tabIndex === 0)));
         };
         this.focusElement = (element, shiftKey = false) => {
             let nextFocusEl = element;
@@ -343,7 +343,7 @@ const Dialog = /*@__PURE__*/ proxyCustomElement(class Dialog extends HTMLElement
     }
     render() {
         const { dialogRendered, disableHeightConstraint, fadeIn, theme } = this;
-        return (h(Host, { key: '87a6c4970c26fdc12f1aed7bc3bd95b4e2f21810', class: {
+        return (h(Host, { key: 'f970a5b8d2c69eae29f0877f078a9a4c0ead56ba', class: {
                 "ic-dialog-hidden": !dialogRendered,
                 "ic-dialog-fade-in": fadeIn,
                 "disable-height-constraint": !!disableHeightConstraint,

package/dist/components/ic-dialog.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ic-dialog.js","mappings":"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","names":[],"sources":["src/components/ic-dialog/ic-dialog.css?tag=ic-dialog&encapsulation=shadow","src/components/ic-dialog/ic-dialog.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n/*\n @prop --ic-z-index-dialog: z-index of dialog \n /\n\n:host {\n position: fixed;\n inset: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: 100% !important;\n background: rgb(0 0 0 / 60%);\n z-index: var(--ic-z-index-dialog);\n opacity: 0;\n}\n\n:host(.ic-dialog-fade-in) {\n opacity: 1;\n}\n\n:host(.disable-height-constraint) {\n background: none;\n justify-content: unset;\n align-items: unset;\n}\n\n.dialog.disable-height-constraint {\n max-height: none;\n position: relative;\n}\n\n.dialog.disable-height-constraint .content-area {\n overflow-y: visible;\n}\n\n@media (prefers-reduced-motion: no-preference) {\n :host {\n transition: opacity var(--ic-easing-transition-slow);\n }\n\n .dialog {\n transform: translateY(-3rem);\n transition: transform 1000s;\n }\n\n :host(.ic-dialog-fade-in) .dialog {\n transform: translateY(0);\n transition: transform var(--ic-easing-transition-slow);\n }\n}\n\n:host(.ic-dialog-hidden) {\n display: none;\n}\n\n.dialog {\n background-color: var(--ic-dialog-background);\n color: var(--ic-dialog-text-primary);\n\n --ic-typography-color: var(--ic-dialog-text-primary);\n\n border: var(--ic-space-1px) solid var(--ic-dialog-border);\n border-radius: var(--ic-border-radius);\n padding: var(--ic-space-xs) 0 var(--ic-space-md);\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n overflow-x: visible;\n}\n\n.small {\n width: 50%;\n max-width: 25rem;\n min-height: 11rem;\n max-height: 70vh;\n}\n\n.medium {\n width: 70vw;\n max-width: 44rem;\n min-height: 12.5rem;\n max-height: 70vh;\n}\n\n.large {\n width: 90vw;\n max-width: 62.5rem;\n min-height: 12.5rem;\n max-height: 90vh;\n}\n\n.heading-area {\n display: flex;\n margin-bottom: var(--ic-space-xs);\n padding: 0 var(--ic-space-md);\n}\n\n.heading {\n overflow-wrap: break-word;\n}\n\n.close-icon {\n margin-left: auto;\n}\n\n.close-icon > svg {\n color: var(--ic-dialog-clear-button);\n}\n\n.content-area {\n padding: 0 var(--ic-space-md);\n margin: 0;\n overflow-y: auto;\n}\n\n#dialog-content {\n margin-bottom: var(--ic-space-sm);\n}\n\n#dialog-content ::slotted(ic-typography) {\n overflow-wrap: break-word;\n}\n\n#dialog-content ::slotted() {\n position: relative;\n}\n\n.dialog-controls {\n margin-top: auto;\n padding: var(--ic-space-xs) var(--ic-space-md) 0;\n display: flex;\n justify-content: flex-end;\n gap: var(--ic-space-md);\n}\n\n.dialog-control-button {\n width: fit-content;\n}\n\n.backdrop {\n overflow-y: auto;\n position: fixed;\n inset: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n background: rgb(0 0 0 / 60%);\n z-index: var(--ic-z-index-dialog);\n padding-top: 16px;\n padding-bottom: 16px;\n}\n\n.heading ic-typography {\n --ic-typography-color: var(--ic-dialog-text-primary);\n}\n\n.label ic-typography {\n --ic-typography-color: var(--ic-dialog-label);\n}\n\n@media (min-width: 800px) {\n :host([size=\"large\"]) .dialog:not(.disable-width-constraint) > .content-area {\n width: 75%;\n }\n}\n\n@media (max-width: 576px) {\n .dialog {\n width: 100vw;\n height: 100vh;\n max-width: none;\n max-height: none;\n box-sizing: border-box;\n }\n\n .backdrop {\n padding: 0;\n }\n\n .dialog.disable-height-constraint {\n height: auto;\n min-height: 100vh;\n }\n}\n\n@media (max-width: 364px) {\n .dialog-control-button {\n width: unset;\n }\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n Host,\n Prop,\n State,\n Method,\n Listen,\n Watch,\n h,\n Fragment,\n} from \"@stencil/core\";\nimport closeIcon from \"../../assets/close-icon.svg\";\nimport {\n isSlotUsed,\n checkResizeObserver,\n onComponentRequiredPropUndefined,\n getSlotElements,\n} from \"../../utils/helpers\";\nimport { IcFocusableComponents, IcThemeMode } from \"../../utils/types\";\n\n/*\n @slot dialog-controls - Content will be place at the bottom of the dialog.\n * @slot heading - Content will be placed at the top of the dialog.\n * @slot label - Content will be placed above the dialog heading.\n * @slot alert - Content will be placed at the top of the content area of the dialog.\n /\n@Component({\n tag: \"ic-dialog\",\n styleUrl: \"ic-dialog.css\",\n shadow: true,\n})\nexport class Dialog {\n private backdropEl?: HTMLDivElement;\n private contentArea: HTMLSlotElement \| null;\n private contentAreaMutationObserver: MutationObserver \| null = null;\n private DATA_GETS_FOCUS: string = \"data-gets-focus\";\n private DIALOG_CONTROLS: string = \"dialog-controls\";\n private dialogEl?: HTMLDialogElement;\n private dialogHeight: number = 0;\n private focusedElementIndex = 0;\n private IC_TEXT_FIELD: string = \"IC-TEXT-FIELD\";\n private IC_ACCORDION: string = \"IC-ACCORDION\";\n private IC_ACCORDION_GROUP: string = \"IC-ACCORDION-GROUP\";\n private IC_CHECKBOX = \"IC-CHECKBOX\";\n private IC_SEARCH_BAR: string = \"IC-SEARCH-BAR\";\n private interactiveElementList: HTMLElement[];\n private resizeObserver: ResizeObserver \| null = null;\n private resizeTimeout: number;\n private sourceElement: HTMLElement;\n\n @Element() el: HTMLIcDialogElement;\n\n @State() dialogRendered: boolean = false;\n @State() fadeIn: boolean = false;\n\n /\n If set to `false`, the dialog will not close when the backdrop is clicked.\n /\n @Prop() closeOnBackdropClick?: boolean = true;\n\n /\n If 'true', sets the 'primary' or rightmost button to the destructive variant. Stops initial focus being set on the 'primary' or rightmost default or slotted button.\n /\n @Prop() destructive?: boolean = false;\n\n /\n Sets the dismiss label tooltip and aria label.\n /\n @Prop() dismissLabel?: string = \"Dismiss\";\n\n /\n If set to `true`, the content area max height and overflow properties are removed allowing the dialog to stretch below the fold.\n * This prop also prevents popover elements from being cut off within the content area.\n /\n @Prop() disableHeightConstraint?: boolean = false;\n\n /\n If set to `true`, the content area width property is removed, allowing content to take the full width of the dialog when using the large variant.\n /\n @Prop() disableWidthConstraint?: boolean = false;\n\n /\n If `true`, the close button will not be displayed.\n /\n @Prop() hideCloseButton?: boolean = false;\n\n /\n If set to `true`, default button controls will not be shown, but slotted dialog controls will still be displayed.\n /\n @Prop() hideDefaultControls: boolean = false;\n\n /\n Sets the heading for the dialog.\n /\n @Prop() heading?: string;\n\n /\n Sets the optional label for the dialog which appears above the heading.\n /\n @Prop() label?: string;\n\n /\n If `true`, the dialog will be displayed.\n /\n @Prop({ reflect: true, mutable: true }) open?: boolean = false;\n\n @Watch(\"open\")\n watchOpenHandler(): void {\n if (this.open) {\n this.dialogOpened();\n } else {\n this.fadeIn = false;\n if (this.resizeObserver !== null) {\n this.resizeObserver.disconnect();\n }\n setTimeout(() => {\n this.dialogRendered = false;\n this.dialogEl?.close();\n this.sourceElement?.focus();\n this.dialogHeight = 0;\n this.icDialogClosed.emit();\n }, 80);\n }\n }\n\n /\n Sets the maximum and minimum height and width for the dialog.\n /\n @Prop() size?: \"small\" \| \"medium\" \| \"large\" = \"small\";\n\n /\n Sets the theme color to the dark or light theme color. \"inherit\" will set the color based on the system settings or ic-theme component.\n /\n @Prop() theme?: IcThemeMode = \"inherit\";\n\n /\n Cancelation event emitted when default 'Cancel' button clicked or 'cancelDialog' method is called.\n /\n @Event() icDialogCancelled: EventEmitter<void>;\n\n /\n Emitted when dialog has closed.\n /\n @Event() icDialogClosed: EventEmitter<void>;\n\n /\n Confirmation event emitted when default 'Confirm' primary button clicked or 'confirmDialog' method is called.\n /\n @Event() icDialogConfirmed: EventEmitter<void>;\n\n /\n Emitted when dialog has opened.\n /\n @Event() icDialogOpened: EventEmitter<void>;\n\n disconnectedCallback(): void {\n this.removeSlotChangeListener();\n }\n\n componentDidLoad(): void {\n this.getInteractiveElements();\n\n this.refreshInteractiveElementsOnSlotChange();\n\n if (this.open) {\n this.dialogOpened();\n }\n\n !isSlotUsed(this.el, \"heading\") &&\n onComponentRequiredPropUndefined(\n [{ prop: this.heading, propName: \"heading\" }],\n \"Dialog\"\n );\n }\n\n componentDidRender(): void {\n document.body.style.overflow =\n getComputedStyle(this.el).display !== \"none\" &&\n this.disableHeightConstraint\n ? \"hidden\"\n : \"auto\";\n }\n\n @Listen(\"keydown\", { target: \"document\" })\n handleKeyboard(ev: KeyboardEvent): void {\n if (this.dialogRendered) {\n switch (ev.key) {\n case \"Tab\":\n if (this.onTabKeyPress(ev.shiftKey)) {\n ev.preventDefault();\n }\n break;\n case \"Escape\":\n if (!ev.repeat) {\n this.open = false;\n }\n ev.stopImmediatePropagation();\n break;\n }\n }\n }\n\n @Listen(\"click\", {})\n handleClick(ev: MouseEvent): void {\n if (\n this.dialogEl &&\n this.closeOnBackdropClick &&\n ev.composedPath().indexOf(this.dialogEl) <= 0\n ) {\n const { top, height, left, width } =\n this.dialogEl.getBoundingClientRect();\n const isInDialog =\n top <= ev.clientY &&\n ev.clientY <= top + height &&\n left <= ev.clientX &&\n ev.clientX <= left + width;\n if (!isInDialog) {\n this.open = false;\n }\n }\n }\n\n /\n Cancels the dialog. Used by the default 'Cancel' button or can be called manually to trigger cancelling of dialog.\n /\n @Method()\n async cancelDialog(): Promise<void> {\n this.icDialogCancelled.emit();\n this.open = false;\n }\n\n /\n Confirms the dialog. Used by the default 'Confirm' button or can be called manually to trigger confirming of dialog.\n /\n @Method()\n async confirmDialog(): Promise<void> {\n this.icDialogConfirmed.emit();\n }\n\n private dialogOpened = () => {\n this.dialogRendered = true;\n\n if (this.disableHeightConstraint) {\n this.dialogEl?.show();\n } else {\n this.dialogEl?.showModal();\n }\n\n setTimeout(() => {\n this.fadeIn = true;\n\n /\n This is required to set scroll back to top if:\n * - dialog content goes below the fold\n * - is closed using cancel or confirm and reopened.\n \n Without this, the scroll bar will start from the dialog's last scroll-x coordinate.\n */\n if (\n this.backdropEl &&\n this.disableHeightConstraint &&\n this.backdropEl.scrollTop !== 0\n ) {\n this.backdropEl.scrollTop = 0;\n }\n }, 10);\n\n setTimeout(() => {\n this.setInitialFocus();\n checkResizeObserver(this.runResizeObserver);\n }, 75);\n\n setTimeout(() => {\n this.icDialogOpened.emit();\n }, 80);\n };\n\n private runResizeObserver = () => {\n if (this.dialogEl) {\n this.resizeObserver = new ResizeObserver(() => {\n clearTimeout(this.resizeTimeout);\n this.resizeTimeout = window.setTimeout(this.resizeObserverCallback, 80);\n });\n this.resizeObserver.observe(this.dialogEl);\n }\n };\n\n private resizeObserverCallback = () => {\n if (this.dialogEl && this.dialogEl.clientHeight !== this.dialogHeight) {\n this.dialogHeight = this.dialogEl.clientHeight;\n }\n };\n\n private refreshInteractiveElementsOnSlotChange = () => {\n const contentWrapper = this.el.shadowRoot?.querySelector(\"#dialog-content\");\n\n if (contentWrapper) {\n this.contentArea = contentWrapper.querySelector(\"slot\");\n\n // Detect changes to slotted elements\n this.contentArea?.addEventListener(\n \"slotchange\",\n this.getInteractiveElements\n );\n\n this.contentAreaMutationObserver = new MutationObserver(() => {\n this.getInteractiveElements();\n });\n\n // Detect changes to children of slotted elements\n getSlotElements(contentWrapper)?.forEach((el) => {\n this.contentAreaMutationObserver?.observe(el, {\n childList: true,\n subtree: true,\n });\n });\n }\n };\n\n private removeSlotChangeListener = () => {\n if (this.contentArea) {\n this.contentArea.removeEventListener(\n \"slotchange\",\n this.getInteractiveElements\n );\n\n this.contentAreaMutationObserver?.disconnect();\n }\n };\n\n private setInitialFocus = () => {\n this.sourceElement = document.activeElement as HTMLElement;\n this.focusedElementIndex = this.interactiveElementList\n ? this.interactiveElementList.findIndex((element) =>\n element.hasAttribute(this.DATA_GETS_FOCUS)\n )\n : 0;\n this.focusElement(this.interactiveElementList[this.focusedElementIndex]);\n };\n\n private getFocusedElementIndex = () => {\n for (let i = 0; i < this.interactiveElementList.length; i++) {\n if (\n (this.interactiveElementList[i] as HTMLElement) ===\n (this.el.shadowRoot?.activeElement \|\| document.activeElement)\n ) {\n this.focusedElementIndex = i;\n }\n }\n };\n\n private closeIconClick = () => {\n this.open = false;\n };\n\n private getInteractiveElements = () => {\n this.interactiveElementList = Array.from(\n this.el.shadowRoot?.querySelectorAll(\"ic-button\") \|\| []\n );\n const slottedInteractiveElements = Array.from(\n this.el.querySelectorAll(\n `a[href], button, input:not(.ic-input), textarea, select, details, [tabindex]:not([tabindex=\"-1\"]),\n ic-button, ic-checkbox, ic-select, ic-search-bar, ic-tab-group, \n ic-back-to-top, ic-breadcrumb, ic-chip[dismissible=\"true\"], ic-footer-link, ic-link, ic-navigation-button,\n ic-navigation-item, ic-switch, ic-text-field, ic-accordion-group, ic-accordion, ic-date-input, ic-date-picker`\n )\n );\n if (slottedInteractiveElements.length > 0) {\n if (slottedInteractiveElements[0].slot !== this.DIALOG_CONTROLS) {\n slottedInteractiveElements[0].setAttribute(this.DATA_GETS_FOCUS, \"\");\n } else if (!this.destructive) {\n slottedInteractiveElements[\n slottedInteractiveElements.length - 1\n ].setAttribute(this.DATA_GETS_FOCUS, \"\");\n }\n }\n for (let i = 0; i < slottedInteractiveElements.length; i++) {\n this.interactiveElementList.splice(\n 1 + i,\n 0,\n slottedInteractiveElements[i] as HTMLElement\n );\n }\n };\n\n private getNextFocusEl = (focusedElementIndex: number) =>\n this.interactiveElementList[focusedElementIndex];\n\n private onTabKeyPress = (shiftKey: boolean): boolean => {\n this.getFocusedElementIndex();\n\n if (\n this.interactiveElementList[this.focusedElementIndex].tagName ===\n this.IC_SEARCH_BAR\n ) {\n return false;\n }\n\n this.setFocusIndexBasedOnShiftKey(shiftKey);\n this.loopNextFocusIndexIfLastElement();\n\n this.focusElement(this.getNextFocusEl(this.focusedElementIndex), shiftKey);\n return true;\n };\n\n private shouldSkipElement = (element: HTMLElement): boolean => {\n const isHidden =\n getComputedStyle(element).visibility === \"hidden\" \|\|\n element.offsetHeight === 0 \|\|\n element.hasAttribute(\"disabled\") \|\|\n (element.tagName === this.IC_ACCORDION_GROUP &&\n element.hasAttribute(\"single-expansion\"));\n\n const radioEl = element.closest(\"ic-radio-option\");\n\n return (\n isHidden \|\|\n (element.getAttribute(\"type\") === \"radio\" &&\n !!radioEl &&\n !radioEl.hasAttribute(\"selected\"))\n );\n };\n\n private focusElement = (element: HTMLElement, shiftKey = false) => {\n let nextFocusEl = element;\n\n if (this.shouldSkipElement(element)) {\n this.setFocusIndexBasedOnShiftKey(shiftKey);\n this.loopNextFocusIndexIfLastElement();\n\n nextFocusEl = this.getNextFocusEl(this.focusedElementIndex);\n this.focusElement(nextFocusEl, shiftKey);\n } else {\n switch (element.tagName) {\n case this.IC_ACCORDION_GROUP:\n case this.IC_ACCORDION:\n case this.IC_SEARCH_BAR:\n case this.IC_TEXT_FIELD:\n case this.IC_CHECKBOX:\n (element as IcFocusableComponents).setFocus();\n break;\n default:\n (element as HTMLElement).focus();\n }\n }\n };\n\n private loopNextFocusIndexIfLastElement() {\n if (this.focusedElementIndex > this.interactiveElementList.length - 1)\n this.focusedElementIndex = 0;\n else if (this.focusedElementIndex < 0) {\n this.focusedElementIndex = this.interactiveElementList.length - 1;\n }\n }\n\n private setFocusIndexBasedOnShiftKey(shiftKey: boolean) {\n if (shiftKey) {\n this.focusedElementIndex -= 1;\n } else {\n this.focusedElementIndex += 1;\n }\n }\n\n private renderDialog = () => {\n const {\n hideDefaultControls,\n size,\n heading,\n label,\n destructive,\n dismissLabel,\n hideCloseButton,\n disableHeightConstraint,\n disableWidthConstraint,\n closeIconClick,\n DIALOG_CONTROLS,\n } = this;\n\n const controlsSlotUsed = isSlotUsed(this.el, DIALOG_CONTROLS);\n\n return (\n <dialog\n class={{\n dialog: true,\n [`${size}`]: true,\n \"disable-height-constraint\": !!disableHeightConstraint,\n \"disable-width-constraint\": !!disableWidthConstraint,\n }}\n aria-labelledby=\"dialog-label dialog-heading\"\n aria-describedby=\"dialog-alert dialog-content\"\n ref={(el) => (this.dialogEl = el)}\n >\n <div class=\"heading-area\">\n <div class=\"heading-content\">\n <div class=\"label\">\n <slot name=\"label\">\n <ic-typography variant=\"label\" id=\"dialog-label\">\n {label}\n </ic-typography>\n </slot>\n </div>\n <div class=\"heading\">\n <slot name=\"heading\">\n <ic-typography variant=\"h4\" id=\"dialog-heading\">\n {heading}\n </ic-typography>\n </slot>\n </div>\n </div>\n {!hideCloseButton && (\n <ic-button\n class=\"close-icon\"\n variant=\"icon\"\n innerHTML={closeIcon}\n aria-label={dismissLabel}\n onClick={closeIconClick}\n data-gets-focus={\n destructive \|\| (hideDefaultControls && !controlsSlotUsed)\n ? \"\"\n : null\n }\n ></ic-button>\n )}\n </div>\n <div class=\"content-area\">\n {isSlotUsed(this.el, \"alert\") && <slot name=\"alert\" />}\n <div id=\"dialog-content\">\n <slot />\n </div>\n </div>\n {(controlsSlotUsed \|\| !hideDefaultControls) && (\n <div\n class={{\n [DIALOG_CONTROLS]: true,\n }}\n >\n {controlsSlotUsed ? (\n <slot name={DIALOG_CONTROLS} />\n ) : (\n <Fragment>\n <ic-button\n variant=\"tertiary\"\n onClick={() => this.cancelDialog()}\n class=\"dialog-control-button\"\n data-gets-focus={null}\n >\n Cancel\n </ic-button>\n <ic-button\n variant={destructive ? \"destructive\" : \"primary\"}\n onClick={() => this.confirmDialog()}\n class=\"dialog-control-button\"\n data-gets-focus=\"\"\n >\n Confirm\n </ic-button>\n </Fragment>\n )}\n </div>\n )}\n </dialog>\n );\n };\n\n render() {\n const { dialogRendered, disableHeightConstraint, fadeIn, theme } = this;\n\n return (\n <Host\n class={{\n \"ic-dialog-hidden\": !dialogRendered,\n \"ic-dialog-fade-in\": fadeIn,\n \"disable-height-constraint\": !!disableHeightConstraint,\n [`ic-theme-${theme}`]: theme !== \"inherit\",\n }}\n >\n {disableHeightConstraint ? (\n <div class=\"backdrop\" ref={(el) => (this.backdropEl = el)}>\n {this.renderDialog()}\n </div>\n ) : (\n this.renderDialog()\n )}\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ic-dialog.js","mappings":"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","names":[],"sources":["src/components/ic-dialog/ic-dialog.css?tag=ic-dialog&encapsulation=shadow","src/components/ic-dialog/ic-dialog.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n/*\n @prop --ic-z-index-dialog: z-index of dialog \n /\n\n:host {\n position: fixed;\n inset: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: 100% !important;\n background: rgb(0 0 0 / 60%);\n z-index: var(--ic-z-index-dialog);\n opacity: 0;\n}\n\n:host(.ic-dialog-fade-in) {\n opacity: 1;\n}\n\n:host(.disable-height-constraint) {\n background: none;\n justify-content: unset;\n align-items: unset;\n}\n\n.dialog.disable-height-constraint {\n max-height: none;\n position: relative;\n}\n\n.dialog.disable-height-constraint .content-area {\n overflow-y: visible;\n}\n\n@media (prefers-reduced-motion: no-preference) {\n :host {\n transition: opacity var(--ic-easing-transition-slow);\n }\n\n .dialog {\n transform: translateY(-3rem);\n transition: transform 1000s;\n }\n\n :host(.ic-dialog-fade-in) .dialog {\n transform: translateY(0);\n transition: transform var(--ic-easing-transition-slow);\n }\n}\n\n:host(.ic-dialog-hidden) {\n display: none;\n}\n\n.dialog {\n background-color: var(--ic-dialog-background);\n color: var(--ic-dialog-text-primary);\n\n --ic-typography-color: var(--ic-dialog-text-primary);\n\n border: var(--ic-space-1px) solid var(--ic-dialog-border);\n border-radius: var(--ic-border-radius);\n padding: var(--ic-space-xs) 0 var(--ic-space-md);\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n overflow-x: visible;\n}\n\n.small {\n width: 50%;\n max-width: 25rem;\n min-height: 11rem;\n max-height: 70vh;\n}\n\n.medium {\n width: 70vw;\n max-width: 44rem;\n min-height: 12.5rem;\n max-height: 70vh;\n}\n\n.large {\n width: 90vw;\n max-width: 62.5rem;\n min-height: 12.5rem;\n max-height: 90vh;\n}\n\n.heading-area {\n display: flex;\n margin-bottom: var(--ic-space-xs);\n padding: 0 var(--ic-space-md);\n}\n\n.heading {\n overflow-wrap: break-word;\n}\n\n.close-icon {\n margin-left: auto;\n}\n\n.close-icon > svg {\n color: var(--ic-dialog-clear-button);\n}\n\n.content-area {\n padding: 0 var(--ic-space-md);\n margin: 0;\n overflow-y: auto;\n}\n\n#dialog-content {\n margin-bottom: var(--ic-space-sm);\n}\n\n#dialog-content ::slotted(ic-typography) {\n overflow-wrap: break-word;\n}\n\n#dialog-content ::slotted() {\n position: relative;\n}\n\n.dialog-controls {\n margin-top: auto;\n padding: var(--ic-space-xs) var(--ic-space-md) 0;\n display: flex;\n justify-content: flex-end;\n gap: var(--ic-space-md);\n}\n\n.dialog-control-button {\n width: fit-content;\n}\n\n.backdrop {\n overflow-y: auto;\n position: fixed;\n inset: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n background: rgb(0 0 0 / 60%);\n z-index: var(--ic-z-index-dialog);\n padding-top: 16px;\n padding-bottom: 16px;\n}\n\n.heading ic-typography {\n --ic-typography-color: var(--ic-dialog-text-primary);\n}\n\n.label ic-typography {\n --ic-typography-color: var(--ic-dialog-label);\n}\n\n@media (min-width: 800px) {\n :host([size=\"large\"]) .dialog:not(.disable-width-constraint) > .content-area {\n width: 75%;\n }\n}\n\n@media (max-width: 576px) {\n .dialog {\n width: 100vw;\n height: 100vh;\n max-width: none;\n max-height: none;\n box-sizing: border-box;\n }\n\n .backdrop {\n padding: 0;\n }\n\n .dialog.disable-height-constraint {\n height: auto;\n min-height: 100vh;\n }\n}\n\n@media (max-width: 364px) {\n .dialog-control-button {\n width: unset;\n }\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n Host,\n Prop,\n State,\n Method,\n Listen,\n Watch,\n h,\n Fragment,\n} from \"@stencil/core\";\nimport closeIcon from \"../../assets/close-icon.svg\";\nimport {\n isSlotUsed,\n checkResizeObserver,\n onComponentRequiredPropUndefined,\n getSlotElements,\n} from \"../../utils/helpers\";\nimport { IcFocusableComponents, IcThemeMode } from \"../../utils/types\";\n\n/*\n @slot dialog-controls - Content will be place at the bottom of the dialog.\n * @slot heading - Content will be placed at the top of the dialog.\n * @slot label - Content will be placed above the dialog heading.\n * @slot alert - Content will be placed at the top of the content area of the dialog.\n /\n@Component({\n tag: \"ic-dialog\",\n styleUrl: \"ic-dialog.css\",\n shadow: true,\n})\nexport class Dialog {\n private backdropEl?: HTMLDivElement;\n private contentArea: HTMLSlotElement \| null;\n private contentAreaMutationObserver: MutationObserver \| null = null;\n private DATA_GETS_FOCUS: string = \"data-gets-focus\";\n private DIALOG_CONTROLS: string = \"dialog-controls\";\n private dialogEl?: HTMLDialogElement;\n private dialogHeight: number = 0;\n private focusedElementIndex = 0;\n private IC_TEXT_FIELD: string = \"IC-TEXT-FIELD\";\n private IC_ACCORDION: string = \"IC-ACCORDION\";\n private IC_ACCORDION_GROUP: string = \"IC-ACCORDION-GROUP\";\n private IC_CHECKBOX = \"IC-CHECKBOX\";\n private IC_SEARCH_BAR: string = \"IC-SEARCH-BAR\";\n private interactiveElementList: HTMLElement[];\n private resizeObserver: ResizeObserver \| null = null;\n private resizeTimeout: number;\n private sourceElement: HTMLElement;\n\n @Element() el: HTMLIcDialogElement;\n\n @State() dialogRendered: boolean = false;\n @State() fadeIn: boolean = false;\n\n /\n If set to `false`, the dialog will not close when the backdrop is clicked.\n /\n @Prop() closeOnBackdropClick?: boolean = true;\n\n /\n If 'true', sets the 'primary' or rightmost button to the destructive variant. Stops initial focus being set on the 'primary' or rightmost default or slotted button.\n /\n @Prop() destructive?: boolean = false;\n\n /\n Sets the dismiss label tooltip and aria label.\n /\n @Prop() dismissLabel?: string = \"Dismiss\";\n\n /\n If set to `true`, the content area max height and overflow properties are removed allowing the dialog to stretch below the fold.\n * This prop also prevents popover elements from being cut off within the content area.\n /\n @Prop() disableHeightConstraint?: boolean = false;\n\n /\n If set to `true`, the content area width property is removed, allowing content to take the full width of the dialog when using the large variant.\n /\n @Prop() disableWidthConstraint?: boolean = false;\n\n /\n If `true`, the close button will not be displayed.\n /\n @Prop() hideCloseButton?: boolean = false;\n\n /\n If set to `true`, default button controls will not be shown, but slotted dialog controls will still be displayed.\n /\n @Prop() hideDefaultControls: boolean = false;\n\n /\n Sets the heading for the dialog.\n /\n @Prop() heading?: string;\n\n /\n Sets the optional label for the dialog which appears above the heading.\n /\n @Prop() label?: string;\n\n /\n If `true`, the dialog will be displayed.\n /\n @Prop({ reflect: true, mutable: true }) open?: boolean = false;\n\n @Watch(\"open\")\n watchOpenHandler(): void {\n if (this.open) {\n this.dialogOpened();\n } else {\n this.fadeIn = false;\n if (this.resizeObserver !== null) {\n this.resizeObserver.disconnect();\n }\n setTimeout(() => {\n this.dialogRendered = false;\n this.dialogEl?.close();\n this.sourceElement?.focus();\n this.dialogHeight = 0;\n this.icDialogClosed.emit();\n }, 80);\n }\n }\n\n /\n Sets the maximum and minimum height and width for the dialog.\n /\n @Prop() size?: \"small\" \| \"medium\" \| \"large\" = \"small\";\n\n /\n Sets the theme color to the dark or light theme color. \"inherit\" will set the color based on the system settings or ic-theme component.\n /\n @Prop() theme?: IcThemeMode = \"inherit\";\n\n /\n Cancelation event emitted when default 'Cancel' button clicked or 'cancelDialog' method is called.\n /\n @Event() icDialogCancelled: EventEmitter<void>;\n\n /\n Emitted when dialog has closed.\n /\n @Event() icDialogClosed: EventEmitter<void>;\n\n /\n Confirmation event emitted when default 'Confirm' primary button clicked or 'confirmDialog' method is called.\n /\n @Event() icDialogConfirmed: EventEmitter<void>;\n\n /\n Emitted when dialog has opened.\n /\n @Event() icDialogOpened: EventEmitter<void>;\n\n disconnectedCallback(): void {\n this.removeSlotChangeListener();\n }\n\n componentDidLoad(): void {\n this.getInteractiveElements();\n\n this.refreshInteractiveElementsOnSlotChange();\n\n if (this.open) {\n this.dialogOpened();\n }\n\n !isSlotUsed(this.el, \"heading\") &&\n onComponentRequiredPropUndefined(\n [{ prop: this.heading, propName: \"heading\" }],\n \"Dialog\"\n );\n }\n\n componentDidRender(): void {\n document.body.style.overflow =\n getComputedStyle(this.el).display !== \"none\" &&\n this.disableHeightConstraint\n ? \"hidden\"\n : \"auto\";\n }\n\n @Listen(\"keydown\", { target: \"document\" })\n handleKeyboard(ev: KeyboardEvent): void {\n if (this.dialogRendered) {\n switch (ev.key) {\n case \"Tab\":\n if (this.onTabKeyPress(ev.shiftKey)) {\n ev.preventDefault();\n }\n break;\n case \"Escape\":\n if (!ev.repeat) {\n this.open = false;\n }\n ev.stopImmediatePropagation();\n break;\n }\n }\n }\n\n @Listen(\"click\", {})\n handleClick(ev: MouseEvent): void {\n if (\n this.dialogEl &&\n this.closeOnBackdropClick &&\n ev.composedPath().indexOf(this.dialogEl) <= 0\n ) {\n const { top, height, left, width } =\n this.dialogEl.getBoundingClientRect();\n const isInDialog =\n top <= ev.clientY &&\n ev.clientY <= top + height &&\n left <= ev.clientX &&\n ev.clientX <= left + width;\n if (!isInDialog) {\n this.open = false;\n }\n }\n }\n\n /\n Cancels the dialog. Used by the default 'Cancel' button or can be called manually to trigger cancelling of dialog.\n /\n @Method()\n async cancelDialog(): Promise<void> {\n this.icDialogCancelled.emit();\n this.open = false;\n }\n\n /\n Confirms the dialog. Used by the default 'Confirm' button or can be called manually to trigger confirming of dialog.\n /\n @Method()\n async confirmDialog(): Promise<void> {\n this.icDialogConfirmed.emit();\n }\n\n private dialogOpened = () => {\n this.dialogRendered = true;\n\n if (this.disableHeightConstraint) {\n this.dialogEl?.show();\n } else {\n this.dialogEl?.showModal();\n }\n\n setTimeout(() => {\n this.fadeIn = true;\n\n /\n This is required to set scroll back to top if:\n * - dialog content goes below the fold\n * - is closed using cancel or confirm and reopened.\n \n Without this, the scroll bar will start from the dialog's last scroll-x coordinate.\n */\n if (\n this.backdropEl &&\n this.disableHeightConstraint &&\n this.backdropEl.scrollTop !== 0\n ) {\n this.backdropEl.scrollTop = 0;\n }\n }, 10);\n\n setTimeout(() => {\n this.setInitialFocus();\n checkResizeObserver(this.runResizeObserver);\n }, 75);\n\n setTimeout(() => {\n this.icDialogOpened.emit();\n }, 80);\n };\n\n private runResizeObserver = () => {\n if (this.dialogEl) {\n this.resizeObserver = new ResizeObserver(() => {\n clearTimeout(this.resizeTimeout);\n this.resizeTimeout = window.setTimeout(this.resizeObserverCallback, 80);\n });\n this.resizeObserver.observe(this.dialogEl);\n }\n };\n\n private resizeObserverCallback = () => {\n if (this.dialogEl && this.dialogEl.clientHeight !== this.dialogHeight) {\n this.dialogHeight = this.dialogEl.clientHeight;\n }\n };\n\n private refreshInteractiveElementsOnSlotChange = () => {\n const contentWrapper = this.el.shadowRoot?.querySelector(\"#dialog-content\");\n\n if (contentWrapper) {\n this.contentArea = contentWrapper.querySelector(\"slot\");\n\n // Detect changes to slotted elements\n this.contentArea?.addEventListener(\n \"slotchange\",\n this.getInteractiveElements\n );\n\n this.contentAreaMutationObserver = new MutationObserver(() => {\n this.getInteractiveElements();\n });\n\n // Detect changes to children of slotted elements\n getSlotElements(contentWrapper)?.forEach((el) => {\n this.contentAreaMutationObserver?.observe(el, {\n childList: true,\n subtree: true,\n });\n });\n }\n };\n\n private removeSlotChangeListener = () => {\n if (this.contentArea) {\n this.contentArea.removeEventListener(\n \"slotchange\",\n this.getInteractiveElements\n );\n\n this.contentAreaMutationObserver?.disconnect();\n }\n };\n\n private setInitialFocus = () => {\n this.sourceElement = document.activeElement as HTMLElement;\n this.focusedElementIndex = this.interactiveElementList\n ? this.interactiveElementList.findIndex((element) =>\n element.hasAttribute(this.DATA_GETS_FOCUS)\n )\n : 0;\n this.focusElement(this.interactiveElementList[this.focusedElementIndex]);\n };\n\n private getFocusedElementIndex = () => {\n for (let i = 0; i < this.interactiveElementList.length; i++) {\n if (\n (this.interactiveElementList[i] as HTMLElement) ===\n (this.el.shadowRoot?.activeElement \|\| document.activeElement)\n ) {\n this.focusedElementIndex = i;\n }\n }\n };\n\n private closeIconClick = () => {\n this.open = false;\n };\n\n private getInteractiveElements = () => {\n this.interactiveElementList = Array.from(\n this.el.shadowRoot?.querySelectorAll(\"ic-button\") \|\| []\n );\n const slottedInteractiveElements = Array.from(\n this.el.querySelectorAll(\n `a[href], button, input:not(.ic-input), textarea, select, details, [tabindex]:not([tabindex=\"-1\"]),\n ic-button, ic-checkbox, ic-select, ic-search-bar, ic-tab-group, \n ic-back-to-top, ic-breadcrumb, ic-chip[dismissible=\"true\"], ic-footer-link, ic-link, ic-navigation-button,\n ic-navigation-item, ic-switch, ic-text-field, ic-accordion-group, ic-accordion, ic-date-input, ic-date-picker`\n )\n );\n if (slottedInteractiveElements.length > 0) {\n if (slottedInteractiveElements[0].slot !== this.DIALOG_CONTROLS) {\n slottedInteractiveElements[0].setAttribute(this.DATA_GETS_FOCUS, \"\");\n } else if (!this.destructive) {\n slottedInteractiveElements[\n slottedInteractiveElements.length - 1\n ].setAttribute(this.DATA_GETS_FOCUS, \"\");\n }\n }\n for (let i = 0; i < slottedInteractiveElements.length; i++) {\n this.interactiveElementList.splice(\n 1 + i,\n 0,\n slottedInteractiveElements[i] as HTMLElement\n );\n }\n };\n\n private getNextFocusEl = (focusedElementIndex: number) =>\n this.interactiveElementList[focusedElementIndex];\n\n private onTabKeyPress = (shiftKey: boolean): boolean => {\n this.getFocusedElementIndex();\n\n if (\n this.interactiveElementList[this.focusedElementIndex].tagName ===\n this.IC_SEARCH_BAR\n ) {\n return false;\n }\n\n this.setFocusIndexBasedOnShiftKey(shiftKey);\n this.loopNextFocusIndexIfLastElement();\n\n this.focusElement(this.getNextFocusEl(this.focusedElementIndex), shiftKey);\n return true;\n };\n\n private shouldSkipElement = (element: HTMLElement): boolean => {\n const isHidden =\n getComputedStyle(element).visibility === \"hidden\" \|\|\n element.offsetHeight === 0 \|\|\n element.hasAttribute(\"disabled\") \|\|\n (element.tagName === this.IC_ACCORDION_GROUP &&\n element.hasAttribute(\"single-expansion\"));\n\n const radioEl = element.closest(\"ic-radio-option\");\n\n return (\n isHidden \|\|\n (element.getAttribute(\"type\") === \"radio\" &&\n !!radioEl &&\n !(radioEl.hasAttribute(\"selected\") \|\| element.tabIndex === 0))\n );\n };\n\n private focusElement = (element: HTMLElement, shiftKey = false) => {\n let nextFocusEl = element;\n\n if (this.shouldSkipElement(element)) {\n this.setFocusIndexBasedOnShiftKey(shiftKey);\n this.loopNextFocusIndexIfLastElement();\n\n nextFocusEl = this.getNextFocusEl(this.focusedElementIndex);\n this.focusElement(nextFocusEl, shiftKey);\n } else {\n switch (element.tagName) {\n case this.IC_ACCORDION_GROUP:\n case this.IC_ACCORDION:\n case this.IC_SEARCH_BAR:\n case this.IC_TEXT_FIELD:\n case this.IC_CHECKBOX:\n (element as IcFocusableComponents).setFocus();\n break;\n default:\n (element as HTMLElement).focus();\n }\n }\n };\n\n private loopNextFocusIndexIfLastElement() {\n if (this.focusedElementIndex > this.interactiveElementList.length - 1)\n this.focusedElementIndex = 0;\n else if (this.focusedElementIndex < 0) {\n this.focusedElementIndex = this.interactiveElementList.length - 1;\n }\n }\n\n private setFocusIndexBasedOnShiftKey(shiftKey: boolean) {\n if (shiftKey) {\n this.focusedElementIndex -= 1;\n } else {\n this.focusedElementIndex += 1;\n }\n }\n\n private renderDialog = () => {\n const {\n hideDefaultControls,\n size,\n heading,\n label,\n destructive,\n dismissLabel,\n hideCloseButton,\n disableHeightConstraint,\n disableWidthConstraint,\n closeIconClick,\n DIALOG_CONTROLS,\n } = this;\n\n const controlsSlotUsed = isSlotUsed(this.el, DIALOG_CONTROLS);\n\n return (\n <dialog\n class={{\n dialog: true,\n [`${size}`]: true,\n \"disable-height-constraint\": !!disableHeightConstraint,\n \"disable-width-constraint\": !!disableWidthConstraint,\n }}\n aria-labelledby=\"dialog-label dialog-heading\"\n aria-describedby=\"dialog-alert dialog-content\"\n ref={(el) => (this.dialogEl = el)}\n >\n <div class=\"heading-area\">\n <div class=\"heading-content\">\n <div class=\"label\">\n <slot name=\"label\">\n <ic-typography variant=\"label\" id=\"dialog-label\">\n {label}\n </ic-typography>\n </slot>\n </div>\n <div class=\"heading\">\n <slot name=\"heading\">\n <ic-typography variant=\"h4\" id=\"dialog-heading\">\n {heading}\n </ic-typography>\n </slot>\n </div>\n </div>\n {!hideCloseButton && (\n <ic-button\n class=\"close-icon\"\n variant=\"icon\"\n innerHTML={closeIcon}\n aria-label={dismissLabel}\n onClick={closeIconClick}\n data-gets-focus={\n destructive \|\| (hideDefaultControls && !controlsSlotUsed)\n ? \"\"\n : null\n }\n ></ic-button>\n )}\n </div>\n <div class=\"content-area\">\n {isSlotUsed(this.el, \"alert\") && <slot name=\"alert\" />}\n <div id=\"dialog-content\">\n <slot />\n </div>\n </div>\n {(controlsSlotUsed \|\| !hideDefaultControls) && (\n <div\n class={{\n [DIALOG_CONTROLS]: true,\n }}\n >\n {controlsSlotUsed ? (\n <slot name={DIALOG_CONTROLS} />\n ) : (\n <Fragment>\n <ic-button\n variant=\"tertiary\"\n onClick={() => this.cancelDialog()}\n class=\"dialog-control-button\"\n data-gets-focus={null}\n >\n Cancel\n </ic-button>\n <ic-button\n variant={destructive ? \"destructive\" : \"primary\"}\n onClick={() => this.confirmDialog()}\n class=\"dialog-control-button\"\n data-gets-focus=\"\"\n >\n Confirm\n </ic-button>\n </Fragment>\n )}\n </div>\n )}\n </dialog>\n );\n };\n\n render() {\n const { dialogRendered, disableHeightConstraint, fadeIn, theme } = this;\n\n return (\n <Host\n class={{\n \"ic-dialog-hidden\": !dialogRendered,\n \"ic-dialog-fade-in\": fadeIn,\n \"disable-height-constraint\": !!disableHeightConstraint,\n [`ic-theme-${theme}`]: theme !== \"inherit\",\n }}\n >\n {disableHeightConstraint ? (\n <div class=\"backdrop\" ref={(el) => (this.backdropEl = el)}>\n {this.renderDialog()}\n </div>\n ) : (\n this.renderDialog()\n )}\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/ic-empty-state.js CHANGED Viewed

@@ -38,11 +38,11 @@ const EmptyState = /*@__PURE__*/ proxyCustomElement(class EmptyState extends HTM
     }
     render() {
         const { aligned, body, maxLines, heading, imageSize, subheading, theme } = this;
-        return (h(Host, { key: '995486bbd0f1f633fec42b3b01b13c4d8df5ea70', class: {
+        return (h(Host, { key: '1742fa428f2c887fd9b0a200fa5f4040c3ceedf3', class: {
                 [`ic-empty-state-${aligned}`]: true,
                 [`image-${imageSize}`]: isSlotUsed(this.el, "image"),
                 [`ic-theme-${theme}`]: theme !== "inherit",
-            } }, isSlotUsed(this.el, "image") && h("slot", { key: 'd8fc4fccad70f8c76f3d2f3684d941369c005418', name: "image" }), h("div", { key: '29923eb7b5f47ba5d6bfac9864f69c3a0b233fc9' }, h("slot", { key: '89ec9f7dde4c6e726840ba32e3b93374d28ad1d1', name: "heading" }, h("ic-typography", { key: 'a7bd4e5f9c7ad89032039b41c72a8a3ac44ee0c4', variant: "h4", class: "empty-state-heading" }, heading)), h("slot", { key: 'b23c53436c1ca4c5c5c4e38c59bd2112f17496fe', name: "subheading" }, h("ic-typography", { key: 'da22a6520f4a9de48708f82ea3a9bde7e978e06a', variant: "subtitle-small", class: "empty-state-subheading" }, subheading)), h("slot", { key: 'f86fc11ab34c45122ff6a24ad13a57f8ed925865', name: "body" }, h("ic-typography", { key: 'd978a50aa34e841b0d7726fa8b0d808734e00ffc', maxLines: maxLines, class: "empty-state-body" }, body))), isSlotUsed(this.el, "actions") && (h("div", { key: 'bb3d3484cbe367efea17a3809a50a3089a135251', class: "action-area" }, h("slot", { key: 'edb8ba0fc8813c0dd21f993e43fa788a9eb8074e', name: "actions" })))));
+            } }, isSlotUsed(this.el, "image") && h("slot", { key: '781c3afcd34547dba24bdc777fed7b704d2d27ad', name: "image" }), h("div", { key: 'a8eb38fb47f8e03d3654cc3f26d12ff1369a52ff' }, h("slot", { key: '4375bf33214131da721591bfbea44d03514b9836', name: "heading" }, h("ic-typography", { key: 'd83b8868e417e55a574716e380be3e99ea2f3aa3', variant: "h4", class: "empty-state-heading" }, heading)), h("slot", { key: '79d4fe82562ba2d44ffa5a693a3e9d5743984bbd', name: "subheading" }, h("ic-typography", { key: 'ffd4e8d460b03c3b90b477c0d2f420492a337165', variant: "subtitle-small", class: "empty-state-subheading" }, subheading)), h("slot", { key: '166e1b63631dc5f6a5ada15867fae52442c18e14', name: "body" }, h("ic-typography", { key: 'f63a9ec68fe53dadddd3cb26ffe6478164caf3af', maxLines: maxLines, class: "empty-state-body" }, body))), isSlotUsed(this.el, "actions") && (h("div", { key: 'ccf0fe966f7a2c6f5225005d5bd4266523bf5267', class: "action-area" }, h("slot", { key: 'f9f8f74c450aed47b1e8f0467e290714237251b0', name: "actions" })))));
     }
     get el() { return this; }
     static get style() { return IcEmptyStateStyle0; }

package/dist/components/ic-footer-link.js CHANGED Viewed

@@ -2,7 +2,7 @@ import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal
 import { D as DEVICE_SIZES, k as getBrandForegroundAppearance } from './helpers.js';
 import { d as defineCustomElement$2 } from './ic-link2.js';
-const icFooterLinkCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host(.footer-link-ungrouped-sparse){--footer-link-margin-left:0;--footer-link-margin-right:2.5rem;--footer-link-margin-bottom:0}:host(.footer-link-ungrouped-small){--footer-link-margin-left:0;--footer-link-margin-right:0;--footer-link-margin-bottom:var(--ic-space-md)}:host(.footer-link-grouped-sparse){--footer-link-margin-left:0;--footer-link-margin-right:0;--footer-link-margin-bottom:var(--ic-space-md)}:host(.footer-link-grouped-small){--footer-link-margin-left:var(--ic-space-md);--footer-link-margin-right:0;--footer-link-margin-bottom:var(--ic-space-md)}:host(.footer-link){margin-left:var(--footer-link-margin-left);margin-right:var(--footer-link-margin-right);margin-bottom:var(--footer-link-margin-bottom)}.ic-link-open-in-new-icon{vertical-align:middle;margin-left:var(--ic-space-xxs)}.ic-link>.ic-link-open-in-new-icon{fill:var(--ic-color-hyperlink-default)}.ic-link-open-in-new-icon>svg{width:var(--ic-space-md);height:var(--ic-space-md);fill:currentcolor}.ic-link:visited>.ic-link-open-in-new-icon{fill:var(--ic-color-hyperlink-visited)}.ic-link.light:visited>.ic-link-open-in-new-icon{fill:var(--ic-color-hyperlink-contrast-visited)}:host(.breadcrumb-link) .ic-link{display:var(--breadcrumb-link-display);align-items:var(--breadcrumb-link-align-items);gap:var(--breadcrumb-link-gap)}:host(.breadcrumb-link) .ic-link ::slotted(.back-icon){height:var(--ic-space-lg);width:var(--ic-space-lg)}:host(.breadcrumb-link.current-page) a,:host(.breadcrumb-link.current-page) ::slotted(a){font-weight:normal;color:inherit;text-decoration:none;display:flex;align-items:center}:host(.breadcrumb-link.current-page) .ic-link,:host(.breadcrumb-link.current-page) ::slotted(a:focus){outline:var(--ic-hc-focus-outline);text-decoration:none}:host(.breadcrumb-link.current-page) .ic-link:visited{color:var(--ic-color-text-primary)}:host(.footer-link-light) ::part(link),:host(.footer-link-dark) ::part(link){color:var(--ic-footer-link)}:host(.footer-link-light) ::slotted(svg),:host(.footer-link-dark) ::slotted(svg){fill:var(--ic-footer-icon)}:host(.footer-logo-link){transition:var(--ic-easing-transition-fast)}:host(.footer-logo-link:hover){background-color:var(--ic-footer-hover)}:host(.footer-logo-link:active){background-color:var(--ic-footer-pressed)}:host(.footer-logo-link:focus){box-shadow:var(--ic-border-focus);border-radius:var(--ic-border-radius);outline:var(--ic-hc-focus-outline)}@media (forced-colors: active){:host(.footer-link-light) ::slotted(svg),:host(.footer-link-dark) ::slotted(svg){fill:currentcolor}}";
+const icFooterLinkCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host(.footer-link-ungrouped-sparse){--footer-link-margin-left:0;--footer-link-margin-right:2.5rem;--footer-link-margin-bottom:0}:host(.footer-link-ungrouped-small){--footer-link-margin-left:0;--footer-link-margin-right:0;--footer-link-margin-bottom:var(--ic-space-md)}:host(.footer-link-grouped-sparse){--footer-link-margin-left:0;--footer-link-margin-right:0;--footer-link-margin-bottom:var(--ic-space-md)}:host(.footer-link-grouped-small){--footer-link-margin-left:var(--ic-space-md);--footer-link-margin-right:0;--footer-link-margin-bottom:var(--ic-space-md)}:host(.footer-link){margin-left:var(--footer-link-margin-left);margin-right:var(--footer-link-margin-right);margin-bottom:var(--footer-link-margin-bottom)}.ic-link-open-in-new-icon{vertical-align:middle;margin-left:var(--ic-space-xxs)}.ic-link>.ic-link-open-in-new-icon{fill:var(--ic-color-hyperlink-default)}.ic-link-open-in-new-icon>svg{width:var(--ic-space-md);height:var(--ic-space-md);fill:currentcolor}.ic-link:visited>.ic-link-open-in-new-icon{fill:var(--ic-color-hyperlink-visited)}.ic-link.light:visited>.ic-link-open-in-new-icon{fill:var(--ic-color-hyperlink-contrast-visited)}:host(.breadcrumb-link) .ic-link{display:var(--breadcrumb-link-display);align-items:var(--breadcrumb-link-align-items);gap:var(--breadcrumb-link-gap)}:host(.breadcrumb-link) .ic-link ::slotted(.back-icon){height:var(--ic-space-lg);width:var(--ic-space-lg)}:host(.breadcrumb-link.current-page) a,:host(.breadcrumb-link.current-page) ::slotted(a){font-weight:normal;color:inherit;text-decoration:none;display:flex;align-items:center}:host(.breadcrumb-link.current-page) .ic-link,:host(.breadcrumb-link.current-page) ::slotted(a:focus){outline:var(--ic-hc-focus-outline);text-decoration:none}:host(.breadcrumb-link.current-page) .ic-link:visited{color:var(--ic-color-text-primary)}:host(.footer-link-light) ::part(link),:host(.footer-link-dark) ::part(link){color:var(--ic-footer-link)}:host(.footer-link-light) ::slotted(svg),:host(.footer-link-dark) ::slotted(svg){fill:var(--ic-footer-logo)}:host(.footer-logo-link){transition:var(--ic-easing-transition-fast)}:host(.footer-logo-link:hover){background-color:var(--ic-footer-hover)}:host(.footer-logo-link:active){background-color:var(--ic-footer-pressed)}:host(.footer-logo-link:focus){box-shadow:var(--ic-border-focus);border-radius:var(--ic-border-radius);outline:var(--ic-hc-focus-outline)}@media (forced-colors: active){:host(.footer-link-light) ::slotted(svg),:host(.footer-link-dark) ::slotted(svg){fill:currentcolor}}";
 const IcFooterLinkStyle0 = icFooterLinkCss;
 const FooterLink = /*@__PURE__*/ proxyCustomElement(class FooterLink extends HTMLElement {
@@ -47,12 +47,12 @@ const FooterLink = /*@__PURE__*/ proxyCustomElement(class FooterLink extends HTM
         const { footerConfig, href, hreflang, referrerpolicy, rel, target, download, } = this;
         const { small, grouped } = footerConfig;
         const isLogoLink = !!this.el.closest("div[slot='logo']");
-        return (h(Host, { key: 'e76ea1dcfe97acba7db979b8ac64101c1701dbca', class: {
+        return (h(Host, { key: 'da292a4ecbb670fb85eddac93d4e8743a7f7a5a3', class: {
                 "footer-link": true,
                 [`footer-link-${grouped ? "grouped" : "ungrouped"}-${small ? "small" : "sparse"}`]: true,
                 [`footer-link-${this.foregroundColor}`]: true,
                 "footer-logo-link": isLogoLink,
-            }, role: "listitem" }, h("ic-link", { key: '251207e62b8812870a36eb4e7b7aa9307c78668c', class: "footer-link", href: href, hreflang: hreflang, referrerpolicy: referrerpolicy, rel: rel, download: download !== false ? download : undefined, target: target }, h("slot", { key: '3a073f12607a730a032665e55088da56cccf8c42' }))));
+            }, role: "listitem" }, h("ic-link", { key: 'ba008bce21d6a1a062d69515578c158908c4f413', class: "footer-link", href: href, hreflang: hreflang, referrerpolicy: referrerpolicy, rel: rel, download: download !== false ? download : undefined, target: target }, h("slot", { key: '45d18d8d1009b438338c2153a2b59c88d6f3c320' }))));
     }
     static get delegatesFocus() { return true; }
     get el() { return this; }

package/dist/components/ic-footer-link.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ic-footer-link.js","mappings":";;;;AAAA,MAAM,eAAe,GAAG,61JAA61J,CAAC;AACt3J,2BAAe,eAAe;;MCuBjB,UAAU;IAPvB;;;;QAUW,eAAU,GAAW,YAAY,CAAC,EAAE,CAAC;QACrC,iBAAY,GAAiB,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;QAC9D,oBAAe,GAAsB,4BAA4B,EAAE,CAAC;;;;QAKrE,aAAQ,GAAsB,KAAK,CAAC;KAgG7C;IArEC,iBAAiB;QACf,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;KAC/C;IAGD,mBAAmB;QACjB,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;KAC/C;IAGD,wBAAwB,CAAC,EAAwB;QAC/C,IAAI,CAAC,eAAe,GAAG,EAAE,CAAC,MAAM,CAAC,IAAI,CAAC;KACvC;IAEO,WAAW,CAAC,CAAc;QAChC,IAAI,CAAC,CAAC,aAAa,KAAK,IAAI,EAAE;YAC5B,IAAI,CAAC,CAAC,aAAa,CAAC,SAAS,CAAC,QAAQ,CAAC,WAAW,CAAC,EAAE;gBACnD,OAAO;oBACL,KAAK,EAAE,CAAC,CAAC,aAAa,CAAC,SAAS,CAAC,QAAQ,CAAC,iBAAiB,CAAC;oBAC5D,OAAO,EAAE,CAAC,CAAC,aAAa,CAAC,SAAS,CAAC,QAAQ,CAAC,mBAAmB,CAAC;iBACjE,CAAC;aACH;iBAAM;gBACL,OAAO,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC;aAC1C;SACF;aAAM;YACL,OAAO,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;SACzC;KACF;IAED,MAAM;QACJ,MAAM,EACJ,YAAY,EACZ,IAAI,EACJ,QAAQ,EACR,cAAc,EACd,GAAG,EACH,MAAM,EACN,QAAQ,GACT,GAAG,IAAI,CAAC;QACT,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,YAAY,CAAC;QAExC,MAAM,UAAU,GAAG,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,OAAO,CAAC,kBAAkB,CAAC,CAAC;QAEzD,QACE,EAAC,IAAI,qDACH,KAAK,EAAE;gBACL,aAAa,EAAE,IAAI;gBACnB,CAAC,eAAe,OAAO,GAAG,SAAS,GAAG,WAAW,IAC/C,KAAK,GAAG,OAAO,GAAG,QACpB,EAAE,GAAG,IAAI;gBACT,CAAC,eAAe,IAAI,CAAC,eAAe,EAAE,GAAG,IAAI;gBAC7C,kBAAkB,EAAE,UAAU;aAC/B,EACD,IAAI,EAAC,UAAU,IAEf,gEACE,KAAK,EAAC,aAAa,EACnB,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,cAAc,EAAE,cAAc,EAC9B,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,QAAQ,KAAK,KAAK,GAAG,QAAQ,GAAG,SAAS,EACnD,MAAM,EAAE,MAAM,IAEd,8DAAQ,CACA,CACL,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/ic-footer-link/ic-footer-link.css?tag=ic-footer-link&encapsulation=shadow","src/components/ic-footer-link/ic-footer-link.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host(.footer-link-ungrouped-sparse) {\n --footer-link-margin-left: 0;\n --footer-link-margin-right: 2.5rem;\n --footer-link-margin-bottom: 0;\n}\n\n:host(.footer-link-ungrouped-small) {\n --footer-link-margin-left: 0;\n --footer-link-margin-right: 0;\n --footer-link-margin-bottom: var(--ic-space-md);\n}\n\n:host(.footer-link-grouped-sparse) {\n --footer-link-margin-left: 0;\n --footer-link-margin-right: 0;\n --footer-link-margin-bottom: var(--ic-space-md);\n}\n\n:host(.footer-link-grouped-small) {\n --footer-link-margin-left: var(--ic-space-md);\n --footer-link-margin-right: 0;\n --footer-link-margin-bottom: var(--ic-space-md);\n}\n\n:host(.footer-link) {\n margin-left: var(--footer-link-margin-left);\n margin-right: var(--footer-link-margin-right);\n margin-bottom: var(--footer-link-margin-bottom);\n}\n\n.ic-link-open-in-new-icon {\n vertical-align: middle;\n margin-left: var(--ic-space-xxs);\n}\n\n.ic-link > .ic-link-open-in-new-icon {\n fill: var(--ic-color-hyperlink-default);\n}\n\n.ic-link-open-in-new-icon > svg {\n width: var(--ic-space-md);\n height: var(--ic-space-md);\n fill: currentcolor;\n}\n\n.ic-link:visited > .ic-link-open-in-new-icon {\n fill: var(--ic-color-hyperlink-visited);\n}\n\n.ic-link.light:visited > .ic-link-open-in-new-icon {\n fill: var(--ic-color-hyperlink-contrast-visited);\n}\n\n:host(.breadcrumb-link) .ic-link {\n display: var(--breadcrumb-link-display);\n align-items: var(--breadcrumb-link-align-items);\n gap: var(--breadcrumb-link-gap);\n}\n\n:host(.breadcrumb-link) .ic-link ::slotted(.back-icon) {\n height: var(--ic-space-lg);\n width: var(--ic-space-lg);\n}\n\n:host(.breadcrumb-link.current-page) a,\n:host(.breadcrumb-link.current-page) ::slotted(a) {\n font-weight: normal;\n color: inherit;\n text-decoration: none;\n display: flex;\n align-items: center;\n}\n\n:host(.breadcrumb-link.current-page) .ic-link,\n:host(.breadcrumb-link.current-page) ::slotted(a:focus) {\n outline: var(--ic-hc-focus-outline);\n text-decoration: none;\n}\n\n:host(.breadcrumb-link.current-page) .ic-link:visited {\n color: var(--ic-color-text-primary);\n}\n\n:host(.footer-link-light) ::part(link),\n:host(.footer-link-dark) ::part(link) {\n color: var(--ic-footer-link);\n}\n\n:host(.footer-link-light) ::slotted(svg),\n:host(.footer-link-dark) ::slotted(svg) {\n fill: var(--ic-footer-~~icon~~);\n}\n\n:host(.footer-logo-link) {\n transition: var(--ic-easing-transition-fast);\n}\n\n:host(.footer-logo-link:hover) {\n background-color: var(--ic-footer-hover);\n}\n\n:host(.footer-logo-link:active) {\n background-color: var(--ic-footer-pressed);\n}\n\n:host(.footer-logo-link:focus) {\n box-shadow: var(--ic-border-focus);\n border-radius: var(--ic-border-radius);\n outline: var(--ic-hc-focus-outline);\n}\n\n@media (forced-colors: active) {\n :host(.footer-link-light) ::slotted(svg),\n :host(.footer-link-dark) ::slotted(svg) {\n fill: currentcolor;\n }\n}\n","import {\n Component,\n Element,\n Host,\n Listen,\n Prop,\n h,\n State,\n} from \"@stencil/core\";\nimport {\n DEVICE_SIZES,\n getBrandForegroundAppearance,\n} from \"../../utils/helpers\";\nimport { IcBrand, IcBrandForeground } from \"../../utils/types\";\n\ntype FooterConfig = { small: boolean; grouped: boolean };\n\n@Component({\n tag: \"ic-footer-link\",\n styleUrl: \"ic-footer-link.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class FooterLink {\n @Element() el: HTMLIcFooterLinkElement;\n\n @State() deviceSize: number = DEVICE_SIZES.XL;\n @State() footerConfig: FooterConfig = { small: false, grouped: false };\n @State() foregroundColor: IcBrandForeground = getBrandForegroundAppearance();\n\n /*\n If `true`, the user can save the linked URL instead of navigating to it.\n /\n @Prop() download?: string \| boolean = false;\n\n /\n The URL that the link points to.\n /\n @Prop() href?: string;\n\n /\n The human language of the linked URL.\n /\n @Prop() hreflang?: string;\n\n /\n How much of the referrer to send when following the link.\n /\n @Prop() referrerpolicy?: ReferrerPolicy;\n\n /\n The relationship of the linked URL as space-separated link types.\n /\n @Prop() rel?: string;\n\n /\n The place to display the linked URL, as the name for a browsing context (a tab, window, or iframe).\n */\n @Prop() target?: string;\n\n componentWillLoad(): void {\n this.footerConfig = this.inferConfig(this.el);\n }\n\n @Listen(\"footerResized\", { target: \"document\" })\n footerResizeHandler(): void {\n this.footerConfig = this.inferConfig(this.el);\n }\n\n @Listen(\"brandChange\", { target: \"document\" })\n footerBrandChangeHandler(ev: CustomEvent<IcBrand>): void {\n this.foregroundColor = ev.detail.mode;\n }\n\n private inferConfig(e: HTMLElement): FooterConfig {\n if (e.parentElement !== null) {\n if (e.parentElement.classList.contains(\"ic-footer\")) {\n return {\n small: e.parentElement.classList.contains(\"ic-footer-small\"),\n grouped: e.parentElement.classList.contains(\"ic-footer-grouped\"),\n };\n } else {\n return this.inferConfig(e.parentElement);\n }\n } else {\n return { small: false, grouped: false };\n }\n }\n\n render() {\n const {\n footerConfig,\n href,\n hreflang,\n referrerpolicy,\n rel,\n target,\n download,\n } = this;\n const { small, grouped } = footerConfig;\n\n const isLogoLink = !!this.el.closest(\"div[slot='logo']\");\n\n return (\n <Host\n class={{\n \"footer-link\": true,\n [`footer-link-${grouped ? \"grouped\" : \"ungrouped\"}-${\n small ? \"small\" : \"sparse\"\n }`]: true,\n [`footer-link-${this.foregroundColor}`]: true,\n \"footer-logo-link\": isLogoLink,\n }}\n role=\"listitem\"\n >\n <ic-link\n class=\"footer-link\"\n href={href}\n hreflang={hreflang}\n referrerpolicy={referrerpolicy}\n rel={rel}\n download={download !== false ? download : undefined}\n target={target}\n >\n <slot />\n </ic-link>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ic-footer-link.js","mappings":";;;;AAAA,MAAM,eAAe,GAAG,61JAA61J,CAAC;AACt3J,2BAAe,eAAe;;MCuBjB,UAAU;IAPvB;;;;QAUW,eAAU,GAAW,YAAY,CAAC,EAAE,CAAC;QACrC,iBAAY,GAAiB,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;QAC9D,oBAAe,GAAsB,4BAA4B,EAAE,CAAC;;;;QAKrE,aAAQ,GAAsB,KAAK,CAAC;KAgG7C;IArEC,iBAAiB;QACf,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;KAC/C;IAGD,mBAAmB;QACjB,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;KAC/C;IAGD,wBAAwB,CAAC,EAAwB;QAC/C,IAAI,CAAC,eAAe,GAAG,EAAE,CAAC,MAAM,CAAC,IAAI,CAAC;KACvC;IAEO,WAAW,CAAC,CAAc;QAChC,IAAI,CAAC,CAAC,aAAa,KAAK,IAAI,EAAE;YAC5B,IAAI,CAAC,CAAC,aAAa,CAAC,SAAS,CAAC,QAAQ,CAAC,WAAW,CAAC,EAAE;gBACnD,OAAO;oBACL,KAAK,EAAE,CAAC,CAAC,aAAa,CAAC,SAAS,CAAC,QAAQ,CAAC,iBAAiB,CAAC;oBAC5D,OAAO,EAAE,CAAC,CAAC,aAAa,CAAC,SAAS,CAAC,QAAQ,CAAC,mBAAmB,CAAC;iBACjE,CAAC;aACH;iBAAM;gBACL,OAAO,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC;aAC1C;SACF;aAAM;YACL,OAAO,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;SACzC;KACF;IAED,MAAM;QACJ,MAAM,EACJ,YAAY,EACZ,IAAI,EACJ,QAAQ,EACR,cAAc,EACd,GAAG,EACH,MAAM,EACN,QAAQ,GACT,GAAG,IAAI,CAAC;QACT,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,YAAY,CAAC;QAExC,MAAM,UAAU,GAAG,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,OAAO,CAAC,kBAAkB,CAAC,CAAC;QAEzD,QACE,EAAC,IAAI,qDACH,KAAK,EAAE;gBACL,aAAa,EAAE,IAAI;gBACnB,CAAC,eAAe,OAAO,GAAG,SAAS,GAAG,WAAW,IAC/C,KAAK,GAAG,OAAO,GAAG,QACpB,EAAE,GAAG,IAAI;gBACT,CAAC,eAAe,IAAI,CAAC,eAAe,EAAE,GAAG,IAAI;gBAC7C,kBAAkB,EAAE,UAAU;aAC/B,EACD,IAAI,EAAC,UAAU,IAEf,gEACE,KAAK,EAAC,aAAa,EACnB,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,cAAc,EAAE,cAAc,EAC9B,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,QAAQ,KAAK,KAAK,GAAG,QAAQ,GAAG,SAAS,EACnD,MAAM,EAAE,MAAM,IAEd,8DAAQ,CACA,CACL,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/ic-footer-link/ic-footer-link.css?tag=ic-footer-link&encapsulation=shadow","src/components/ic-footer-link/ic-footer-link.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host(.footer-link-ungrouped-sparse) {\n --footer-link-margin-left: 0;\n --footer-link-margin-right: 2.5rem;\n --footer-link-margin-bottom: 0;\n}\n\n:host(.footer-link-ungrouped-small) {\n --footer-link-margin-left: 0;\n --footer-link-margin-right: 0;\n --footer-link-margin-bottom: var(--ic-space-md);\n}\n\n:host(.footer-link-grouped-sparse) {\n --footer-link-margin-left: 0;\n --footer-link-margin-right: 0;\n --footer-link-margin-bottom: var(--ic-space-md);\n}\n\n:host(.footer-link-grouped-small) {\n --footer-link-margin-left: var(--ic-space-md);\n --footer-link-margin-right: 0;\n --footer-link-margin-bottom: var(--ic-space-md);\n}\n\n:host(.footer-link) {\n margin-left: var(--footer-link-margin-left);\n margin-right: var(--footer-link-margin-right);\n margin-bottom: var(--footer-link-margin-bottom);\n}\n\n.ic-link-open-in-new-icon {\n vertical-align: middle;\n margin-left: var(--ic-space-xxs);\n}\n\n.ic-link > .ic-link-open-in-new-icon {\n fill: var(--ic-color-hyperlink-default);\n}\n\n.ic-link-open-in-new-icon > svg {\n width: var(--ic-space-md);\n height: var(--ic-space-md);\n fill: currentcolor;\n}\n\n.ic-link:visited > .ic-link-open-in-new-icon {\n fill: var(--ic-color-hyperlink-visited);\n}\n\n.ic-link.light:visited > .ic-link-open-in-new-icon {\n fill: var(--ic-color-hyperlink-contrast-visited);\n}\n\n:host(.breadcrumb-link) .ic-link {\n display: var(--breadcrumb-link-display);\n align-items: var(--breadcrumb-link-align-items);\n gap: var(--breadcrumb-link-gap);\n}\n\n:host(.breadcrumb-link) .ic-link ::slotted(.back-icon) {\n height: var(--ic-space-lg);\n width: var(--ic-space-lg);\n}\n\n:host(.breadcrumb-link.current-page) a,\n:host(.breadcrumb-link.current-page) ::slotted(a) {\n font-weight: normal;\n color: inherit;\n text-decoration: none;\n display: flex;\n align-items: center;\n}\n\n:host(.breadcrumb-link.current-page) .ic-link,\n:host(.breadcrumb-link.current-page) ::slotted(a:focus) {\n outline: var(--ic-hc-focus-outline);\n text-decoration: none;\n}\n\n:host(.breadcrumb-link.current-page) .ic-link:visited {\n color: var(--ic-color-text-primary);\n}\n\n:host(.footer-link-light) ::part(link),\n:host(.footer-link-dark) ::part(link) {\n color: var(--ic-footer-link);\n}\n\n:host(.footer-link-light) ::slotted(svg),\n:host(.footer-link-dark) ::slotted(svg) {\n fill: var(--ic-footer-logo);\n}\n\n:host(.footer-logo-link) {\n transition: var(--ic-easing-transition-fast);\n}\n\n:host(.footer-logo-link:hover) {\n background-color: var(--ic-footer-hover);\n}\n\n:host(.footer-logo-link:active) {\n background-color: var(--ic-footer-pressed);\n}\n\n:host(.footer-logo-link:focus) {\n box-shadow: var(--ic-border-focus);\n border-radius: var(--ic-border-radius);\n outline: var(--ic-hc-focus-outline);\n}\n\n@media (forced-colors: active) {\n :host(.footer-link-light) ::slotted(svg),\n :host(.footer-link-dark) ::slotted(svg) {\n fill: currentcolor;\n }\n}\n","import {\n Component,\n Element,\n Host,\n Listen,\n Prop,\n h,\n State,\n} from \"@stencil/core\";\nimport {\n DEVICE_SIZES,\n getBrandForegroundAppearance,\n} from \"../../utils/helpers\";\nimport { IcBrand, IcBrandForeground } from \"../../utils/types\";\n\ntype FooterConfig = { small: boolean; grouped: boolean };\n\n@Component({\n tag: \"ic-footer-link\",\n styleUrl: \"ic-footer-link.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class FooterLink {\n @Element() el: HTMLIcFooterLinkElement;\n\n @State() deviceSize: number = DEVICE_SIZES.XL;\n @State() footerConfig: FooterConfig = { small: false, grouped: false };\n @State() foregroundColor: IcBrandForeground = getBrandForegroundAppearance();\n\n /*\n If `true`, the user can save the linked URL instead of navigating to it.\n /\n @Prop() download?: string \| boolean = false;\n\n /\n The URL that the link points to.\n /\n @Prop() href?: string;\n\n /\n The human language of the linked URL.\n /\n @Prop() hreflang?: string;\n\n /\n How much of the referrer to send when following the link.\n /\n @Prop() referrerpolicy?: ReferrerPolicy;\n\n /\n The relationship of the linked URL as space-separated link types.\n /\n @Prop() rel?: string;\n\n /\n The place to display the linked URL, as the name for a browsing context (a tab, window, or iframe).\n */\n @Prop() target?: string;\n\n componentWillLoad(): void {\n this.footerConfig = this.inferConfig(this.el);\n }\n\n @Listen(\"footerResized\", { target: \"document\" })\n footerResizeHandler(): void {\n this.footerConfig = this.inferConfig(this.el);\n }\n\n @Listen(\"brandChange\", { target: \"document\" })\n footerBrandChangeHandler(ev: CustomEvent<IcBrand>): void {\n this.foregroundColor = ev.detail.mode;\n }\n\n private inferConfig(e: HTMLElement): FooterConfig {\n if (e.parentElement !== null) {\n if (e.parentElement.classList.contains(\"ic-footer\")) {\n return {\n small: e.parentElement.classList.contains(\"ic-footer-small\"),\n grouped: e.parentElement.classList.contains(\"ic-footer-grouped\"),\n };\n } else {\n return this.inferConfig(e.parentElement);\n }\n } else {\n return { small: false, grouped: false };\n }\n }\n\n render() {\n const {\n footerConfig,\n href,\n hreflang,\n referrerpolicy,\n rel,\n target,\n download,\n } = this;\n const { small, grouped } = footerConfig;\n\n const isLogoLink = !!this.el.closest(\"div[slot='logo']\");\n\n return (\n <Host\n class={{\n \"footer-link\": true,\n [`footer-link-${grouped ? \"grouped\" : \"ungrouped\"}-${\n small ? \"small\" : \"sparse\"\n }`]: true,\n [`footer-link-${this.foregroundColor}`]: true,\n \"footer-logo-link\": isLogoLink,\n }}\n role=\"listitem\"\n >\n <ic-link\n class=\"footer-link\"\n href={href}\n hreflang={hreflang}\n referrerpolicy={referrerpolicy}\n rel={rel}\n download={download !== false ? download : undefined}\n target={target}\n >\n <slot />\n </ic-link>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/ic-hero.js CHANGED Viewed

@@ -76,18 +76,18 @@ const Hero = /*@__PURE__*/ proxyCustomElement(class Hero extends HTMLElement {
                 "background-position": scrollFactor,
             };
         }
-        return (h(Host, { key: '3231afd5fd4dce03033cff51bf51071ca4fd5047', class: {
+        return (h(Host, { key: '4c88b4471d3485baff1f6c55f859639feb3166d8', class: {
                 [`ic-hero-${IcBrandForegroundEnum.Dark}`]: foregroundColor === IcBrandForegroundEnum.Dark,
                 ["has-background-image"]: backgroundImage !== undefined,
                 ["has-right-content"]: this.rightContent,
                 ["ic-hero-small"]: size === "small",
                 ["secondary-heading"]: !!secondaryHeading,
-            }, style: style }, h("ic-section-container", { key: '70ba24542ed24d67f517c35b35dc68e3cc1d0599', aligned: aligned, fullHeight: true, class: "section-container" }, h("div", { key: '24161f2fc3452af40ae1ef17122f3c2813f9dc9f', class: {
+            }, style: style }, h("ic-section-container", { key: 'b68716e353d9b2767dc16a5f701e3cdcbd32c748', aligned: aligned, fullHeight: true, class: "section-container" }, h("div", { key: '6dd6f422c0bd36725be4b41b42633aeebfa1911d', class: {
                 ["left-container"]: true,
                 ["left-container-full-width"]: this.leftContentFullWidth,
-            } }, h("div", { key: 'ee424e3053f730be7dcca29df72e28101923fa98', class: "heading" }, h("slot", { key: 'c235855cf4509ad184a250783ad26ab5b1e8b2bf', name: "heading" }, h("ic-typography", { key: '47c148b51800bb803609fc8b69698c20db1059a0', variant: size === "small" ? "h2" : "h1", class: {
+            } }, h("div", { key: '54ffef99b79eef5eedbf1571bff89270982b5671', class: "heading" }, h("slot", { key: '6b7f71caecbaa84d1a39295e100aedef32d1d522', name: "heading" }, h("ic-typography", { key: '841b429a53b8b72dd60017cb2b2404b826f5bbe8', variant: size === "small" ? "h2" : "h1", class: {
                 ["heading-bottom-spacing"]: size !== "small",
-            } }, h("h2", { key: '18daae7363614098996b603558e2c5adfdd53c51' }, heading)))), h("div", { key: 'e085d77d98ed6e62b595412544e28f00b9259daa', class: "subheading" }, h("slot", { key: '6a4642853376745f93a166a85820a4043fb58d13', name: "subheading" }, h("ic-typography", { key: '64cddae668b40585dd0285959b0b6bbd3d50a59b', variant: "body" }, subheading))), h("div", { key: '1601aeb153b5a46a9ebd767e0685976be84683ca', class: "interaction-container" }, h("slot", { key: '7585fd3d34ef5e907617795419777dd2372b5e72', name: "interaction" }))), (isPropDefined(secondaryHeading) || this.rightContent) && (h("div", { key: '2e272e20bc9cc0cae93d96a6d9f714ab7b6b263b', class: "right-container" }, h("slot", { key: '6d86d7dbb668b9f34b2a60bdb3f6d444149e52dc', name: "secondary" }, secondaryHeading && (h("div", { key: '97a5dd02c6ccbf08ba89dea069d0f67bd2272b16', class: "secondary-container" }, h("div", { key: 'cb775d9ccc188403fc934923815cd35c6dd8be38', class: "secondary-heading" }, h("ic-typography", { key: '08168a08c9c68b58a4e3cd6763a2e014ef2934da', variant: "h4" }, h("h3", { key: 'f3936a5faf6183d305354ca99cdea8a413b315eb' }, secondaryHeading))), h("div", { key: '99a4f800156a29430ac6b4b082a22e88671f91ab', class: "secondary-subheading" }, h("ic-typography", { key: '947bf3d89afc359b2d596e20cf863659e14b8528', variant: "subtitle-small" }, secondarySubheading))))))))));
+            } }, h("h2", { key: 'ee802d396bb8a5638f2ab8a62fddbf764436e20e' }, heading)))), h("div", { key: '9a051783a24c9a92fc0aeff2db50689befe4834e', class: "subheading" }, h("slot", { key: 'eb894eaeb4b4303be0caf090d85d487aa11284fb', name: "subheading" }, h("ic-typography", { key: '92b4d9af6118e2ff9bf2b9166862067c610fffee', variant: "body" }, subheading))), h("div", { key: 'cacf81a4666eba19211493914e9b1af466e61478', class: "interaction-container" }, h("slot", { key: '982fb4b528bea4c486d9c0df2cf47fb3ace19414', name: "interaction" }))), (isPropDefined(secondaryHeading) || this.rightContent) && (h("div", { key: '32cd6196da302dd5d0896c90d53d1b35c060e31c', class: "right-container" }, h("slot", { key: '655f0a9978d8402faab43e7e143987f2934255f6', name: "secondary" }, secondaryHeading && (h("div", { key: '94de7e79fd9122b4084b57bf0b5b0571d77e7adc', class: "secondary-container" }, h("div", { key: 'afd414fd37f9b1c8fb6d9f2d7957314f35a1da40', class: "secondary-heading" }, h("ic-typography", { key: 'd643e471ec716d3e6f33ec7761027323ca31bc8c', variant: "h4" }, h("h3", { key: 'f6296bbd33d2ca70beb5100151cebfa8732206d0' }, secondaryHeading))), h("div", { key: '0575ef33984c79674626d9f114ad90a3f973e63a', class: "secondary-subheading" }, h("ic-typography", { key: '8045e445231e4cbbd07ad9fa21a7b6bbf5015eff', variant: "subtitle-small" }, secondarySubheading))))))))));
     }
     get el() { return this; }
     static get style() { return IcHeroStyle0; }

package/dist/components/ic-horizontal-scroll2.js CHANGED Viewed

@@ -170,22 +170,22 @@ const HorizontalScroll = /*@__PURE__*/ proxyCustomElement(class HorizontalScroll
     }
     render() {
         const { firstItemVisible, lastItemVisible, itemOverflow } = this;
-        return (h(Host, { key: '263be65dcc0cb0a113e7dd92a8b12c440b9867ea', class: {
+        return (h(Host, { key: '3c307f5bddcc7b6c8ab7764d08504585f61e203d', class: {
                 ["ic-horizontal-scroll-visible"]: itemOverflow,
                 ["ic-horizontal-scroll-dark"]: this.appearance === IcBrandForegroundEnum.Dark,
                 ["ic-horizontal-scroll-light"]: this.appearance === IcBrandForegroundEnum.Light,
                 [`ic-theme-${this.theme}`]: this.theme !== "inherit",
-            } }, h("div", { key: '2250a0f96500b700454e012e2a918e2ace6a6f68', "aria-hidden": "true", class: {
+            } }, h("div", { key: 'f4bda7e5c0108e986191cde56ef8e255a80b604f', "aria-hidden": "true", class: {
                 ["scroll-container-left"]: true,
                 ["hidden"]: !itemOverflow,
                 ["disabled"]: firstItemVisible,
-            }, role: "tab" }, h("ic-button", { key: 'd55b6d37d7e9a9eea918def18aea64060db6c2ba', class: "scroll-arrow", variant: "icon-tertiary", "aria-label": "Scroll left", theme: this.theme === "light" || this.theme === "inherit"
+            }, role: "tab" }, h("ic-button", { key: '5eb199e69ca500c8e84e9b79cec4a3448b604c39', class: "scroll-arrow", variant: "icon-tertiary", "aria-label": "Scroll left", theme: this.theme === "light" || this.theme === "inherit"
                 ? "dark"
-                : "light", monochrome: this.monochrome, innerHTML: LeftArrow, disabled: firstItemVisible, tabindex: "-1", onClick: this.scrollLeft, onMouseDown: this.leftArrowMouseDownHandler }), h("span", { key: '14d21b70c82e36f64cf383dc8371227b3e504312', class: "scroll-splitter-left" })), h("slot", { key: 'a40cc561072ffcb5aacb27b10b815ec92f3f7ded' }), h("div", { key: '212d94aca6d135dfff9664e69ec9eab42ae7ca56', "aria-hidden": "true", class: {
+                : "light", monochrome: this.monochrome, innerHTML: LeftArrow, disabled: firstItemVisible, tabindex: "-1", onClick: this.scrollLeft, onMouseDown: this.leftArrowMouseDownHandler }), h("span", { key: 'c939c5db95cc4b61645045ef498cc9b80c4f3d69', class: "scroll-splitter-left" })), h("slot", { key: '3ded812f11a7bbdc25157d840ee32f23ed58131b' }), h("div", { key: 'e713490eb2995ff19ec70bf0a098193eaa9829a8', "aria-hidden": "true", class: {
                 ["scroll-container-right"]: true,
                 ["hidden"]: !itemOverflow,
                 ["disabled"]: lastItemVisible,
-            }, role: "tab" }, h("span", { key: 'bd5e6c2dc94e2cebe6e9459de52e615982048a27', class: "scroll-splitter-right" }), h("ic-button", { key: 'be8f57d173b04cca06d0654054bb3451a6f40c70', class: "scroll-arrow", variant: "icon-tertiary", "aria-label": "Scroll right", theme: this.theme === "light" || this.theme === "inherit"
+            }, role: "tab" }, h("span", { key: 'a2427e872d8ab79ef0022ccb216238867e49065c', class: "scroll-splitter-right" }), h("ic-button", { key: 'a58d98e7d695fe15e3c085f1bec0079045817b2d', class: "scroll-arrow", variant: "icon-tertiary", "aria-label": "Scroll right", theme: this.theme === "light" || this.theme === "inherit"
                 ? "dark"
                 : "light", monochrome: this.monochrome, innerHTML: RightArrow, disabled: lastItemVisible, tabindex: "-1", onClick: this.scrollRight, onMouseDown: this.rightArrowMouseDownHandler }))));
     }

package/dist/components/ic-input-component-container2.js CHANGED Viewed

@@ -49,15 +49,15 @@ const InputComponentContainer = /*@__PURE__*/ proxyCustomElement(class InputComp
     }
     render() {
         const { size, validationStatus, disabled, readonly, multiLine, fullWidth, validationInline, } = this;
-        return (h(Host, { key: '3349803b2fc3756e616a3e6e9f88439c3d360897', class: {
+        return (h(Host, { key: 'fc70461ae7d3922f07aa5a85209e376d42bfc451', class: {
                 [`ic-input-component-container-${size}`]: true,
                 [`ic-input-component-container-${validationStatus}`]: validationStatus !== "" && !disabled && !readonly,
                 "ic-input-component-container-disabled": !!disabled,
                 "ic-input-component-container-readonly": !!readonly,
                 "ic-input-component-container-multiline": !!multiLine,
                 "ic-input-component-container-full-width": !!fullWidth,
-            }, "aria-disabled": disabled ? "true" : null }, h("div", { key: 'bf85d48b1507e4c7d8394e067314e383e77ffb72', class: "focus-indicator" }, slotHasContent(this.el, "left-icon") && (h("div", { key: '7660d9c72526a8bf34e88488884933cc7a5a96cd', class: "icon-container" }, h("slot", { key: 'dc31f454f708ecbcf821cb94cf4d8b5b354d149f', name: "left-icon" }))), h("slot", { key: '92265e4967394e33cdf8763bd8c8b433dbe0536e' }), validationInline &&
-            validationStatus === IcInformationStatus.Success && (h("span", { key: 'ecefbb2eaf920a2300bb9a30e20c18a86754fba0', class: "inline-success", innerHTML: successIcon })))));
+            }, "aria-disabled": disabled ? "true" : null }, h("div", { key: '20934b81740e6c907bff86cc706d3aafe3a790df', class: "focus-indicator" }, slotHasContent(this.el, "left-icon") && (h("div", { key: '3577416fc719a575372188c43a78ac945b1b1526', class: "icon-container" }, h("slot", { key: '36ee3e5c85ec77c69f88c2b74d272bdb6ee42ca1', name: "left-icon" }))), h("slot", { key: 'e0a79f50c8ba34c0d989e2402df8b00587c5878f' }), validationInline &&
+            validationStatus === IcInformationStatus.Success && (h("span", { key: 'b156fb5bb6fcfec8c6dec6febdeea6d2adc7e009', class: "inline-success", innerHTML: successIcon })))));
     }
     get el() { return this; }
     static get watchers() { return {

package/dist/components/ic-input-container2.js CHANGED Viewed

@@ -17,11 +17,11 @@ const InputContainer = /*@__PURE__*/ proxyCustomElement(class InputContainer ext
         this.readonly = false;
     }
     render() {
-        return (h(Host, { key: 'b990f9f26644a727f8d0f086c88dfbb18528ca1a' }, h("div", { key: '32d9cce26c3e720e2d3343dc03fc64cc9436621a', class: {
+        return (h(Host, { key: '49cd31d8dca09cc4b2f49e0b2e7829bb1771a5d6' }, h("div", { key: 'bb0e3a80161a86b40e0dc424264e71cf6c95c88a', class: {
                 ["component-container"]: true,
                 ["disabled"]: !!this.disabled,
                 ["readonly"]: !!this.readonly,
-            } }, h("slot", { key: '65cfdbd533ceef8f6cfbdfa8df68789ae5f39804' }))));
+            } }, h("slot", { key: '4916ff0aebd6632d6e6f5daaa3c318e1e696ff2f' }))));
     }
     static get style() { return IcInputContainerStyle0; }
 }, [4, "ic-input-container", {