@ukic/web-components 3.24.0 → 3.26.0

package/dist/collection/components/ic-switch/ic-switch.js

@@ -89,18 +89,16 @@ export class Switch {
     }
     render() {
         const { label, checkedState, size, disabled, name, value, hideLabel, helperText, inputId, theme, } = this;
-        const isSmall = size === "small";
         renderHiddenInput(this.el, checkedState ? value : "", name, disabled);
-        return (h(Host, { key: '88d2bde84ec11e0b5e23de8b291684eae49ba48f', class: {
+        return (h(Host, { key: '5c000ca3e49cd14427153c3621794df417e8cf20', class: {
                 [`ic-theme-${theme}`]: theme !== "inherit",
-            } }, h("label", { key: '46de14be85f760c6267141eb1fe36bc710a9e251', class: {
+            } }, h("label", { key: '8460399d045a653d8c5e3c93f87d2759b99d4095', class: {
                 "ic-switch-container": true,
                 "ic-switch-disabled": !!disabled,
-                "ic-switch-small": isSmall,
-            }, htmlFor: inputId }, !hideLabel && (h("ic-input-label", { key: 'c361f411bf189a5aae8c90e331bc5a07535c3b64', for: inputId, label: label, helperText: helperText, readonly: false, disabled: disabled, class: {
+                [`ic-switch-${size}`]: true,
+            }, htmlFor: inputId }, !hideLabel && (h("ic-input-label", { key: '5bd95a31f589a3569373427072b91153b9af825d', for: inputId, label: label, helperText: helperText, readonly: false, disabled: disabled, class: {
                 "ic-switch-label": true,
-                "ic-switch-label-small": isSmall,
-            } }, h("slot", { key: 'd0ec1f628328f0e3938964248ac38c576ee602ce', name: "helper-text", slot: "helper-text" }))), !hideLabel && h("span", { key: '60474539357c0bd43823042d06e0292f1769a879', class: "ic-switch-line-break" }), h("input", { key: 'e9f17d56e514e1a545fae25631c835a714515461', checked: checkedState, disabled: disabled, "aria-label": label, "aria-checked": checkedState ? "true" : "false", "aria-describedby": getInputDescribedByText(this.el, inputId, helperText !== "", false), role: "switch", class: "ic-switch-input", type: "checkbox", name: "toggle", id: inputId, onFocus: this.onFocus, onBlur: this.onBlur, onChange: this.handleChange }), h("span", { key: 'ec6530e9f6d0a9248d6104068a8dc08c98142d44', class: "ic-switch-toggle" }, h("svg", { key: '9dbe1ccb311d5d3cf836b1db84f783f3f4aa1b1c', class: "ic-switch-icon", "aria-hidden": "true", focusable: "false", viewBox: "0 0 10 10", xmlns: "http://www.w3.org/2000/svg" }, h("line", { key: '019b9a398510349b9fbb41784aa01f77af2c482f', class: "ic-switch-icon-line", x1: "9", y1: isSmall ? "2" : "1", x2: "9", y2: isSmall ? "8" : "9" })), h("svg", { key: '36806f4ca85eb87212f155f42293cffc9d7b2f2e', class: "ic-switch-icon", "aria-hidden": "true", focusable: "false", viewBox: "0 0 10 10", xmlns: "http://www.w3.org/2000/svg" }, h("circle", { key: '5d34317d431ea7b8e10d6a379b02148b4fc69b4e', class: "ic-switch-icon-circle", fill: "none", cx: "5", cy: "5", r: isSmall ? "3.335" : "4.445" }))), h("slot", { key: 'bfb4599c8cfad3efa9466eefe7dc84b580a2a3d2', name: "right-adornment" }))));
+            } }, h("slot", { key: 'a89047529ee17453676191651624842e5b1643ff', name: "helper-text", slot: "helper-text" }))), !hideLabel && h("span", { key: 'ef6b29d8bfa4ad565aca3fdadc61f9d7e9c8a51c', class: "ic-switch-line-break" }), h("input", { key: '0299a7208ea94969af14ded8f92a3c602e4d9260', checked: checkedState, disabled: disabled, "aria-label": label, "aria-checked": checkedState ? "true" : "false", "aria-describedby": getInputDescribedByText(this.el, inputId, helperText !== "", false), role: "switch", class: "ic-switch-input", type: "checkbox", name: "toggle", id: inputId, onFocus: this.onFocus, onBlur: this.onBlur, onChange: this.handleChange }), h("span", { key: '5576c0aff81d9a5825111f62a00dfc69516ff52d', class: "ic-switch-toggle" }, h("span", { key: '3bd162d8cd5b5d08b1a71625edaa7905d837414b', class: "ic-switch-icon-line", "aria-hidden": "true" }), h("svg", { key: '592dd6027032283ed67502269b80fd6a5ca922ae', class: "ic-switch-icon", "aria-hidden": "true", focusable: "false", viewBox: "0 0 8 8", xmlns: "http://www.w3.org/2000/svg", fill: "none" }, h("circle", { key: '6479b349e98272f1578e84b7213949ed064e84f7', class: "ic-switch-icon-circle", fill: "none", cx: "4", cy: "4", r: "3.5", "vector-effect": "non-scaling-stroke" }))), h("slot", { key: '66d14ab0f462f8f050ffb425a154bde647821377', name: "right-adornment" }))));
     }
     static get is() { return "ic-switch"; }
     static get encapsulation() { return "shadow"; }
@@ -240,13 +238,13 @@ export class Switch {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "IcSizesNoLarge",
-                    "resolved": "\"medium\" | \"small\" | undefined",
+                    "original": "IcSizes",
+                    "resolved": "\"large\" | \"medium\" | \"small\" | undefined",
                     "references": {
-                        "IcSizesNoLarge": {
+                        "IcSizes": {
                             "location": "import",
                             "path": "../../utils/types",
-                            "id": "src/utils/types.ts::IcSizesNoLarge"
+                            "id": "src/utils/types.ts::IcSizes"
                         }
                     }
                 },

package/dist/collection/components/ic-switch/ic-switch.js.map

@@ -1 +1 @@
-{"version":3,"file":"ic-switch.js","sourceRoot":"","sources":["../../../src/components/ic-switch/ic-switch.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  Host,\n  h,\n  Prop,\n  State,\n  Element,\n  Event,\n  EventEmitter,\n  Method,\n  Watch,\n} from \"@stencil/core\";\nimport {\n  getInputDescribedByText,\n  onComponentRequiredPropUndefined,\n  renderHiddenInput,\n  addFormResetListener,\n  removeFormResetListener,\n  removeDisabledFalse,\n} from \"../../utils/helpers\";\nimport { IcSwitchChangeEventDetail } from \"./ic-switch.types\";\nimport { IcSizesNoLarge, IcThemeMode } from \"../../utils/types\";\n\nlet inputIds = 0;\n\n/**\n * @slot helper-text - Content is set as the helper text for the switch.\n * @slot right-adornment - Content is placed to the right of switch.\n */\n@Component({\n  tag: \"ic-switch\",\n  styleUrl: \"ic-switch.css\",\n  shadow: {\n    delegatesFocus: true,\n  },\n})\nexport class Switch {\n  private inputId = `ic-switch-input-${inputIds++}`;\n\n  @Element() el: HTMLIcSwitchElement;\n\n  @State() checkedState: boolean = false;\n  @State() initiallyChecked = this.checked;\n\n  /**\n   * If `true`, the switch will display as checked.\n   */\n  @Prop() checked?: boolean = false;\n\n  @Watch(\"checked\")\n  checkedChangeHandler(): void {\n    this.checkedState = !!this.checked;\n  }\n\n  /**\n   * If `true`, the disabled state will be set.\n   */\n  @Prop() disabled?: boolean = false;\n  @Watch(\"disabled\")\n  watchDisabledHandler(): void {\n    removeDisabledFalse(this.disabled, this.el);\n  }\n\n  /**\n   * The helper text that will be displayed for additional field guidance.\n   */\n  @Prop() helperText?: 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?: boolean = false;\n\n  /**\n   * The aria-label applied to the switch when no visual 'name' is provided.\n   */\n  @Prop() label!: string;\n\n  /**\n   * The name of the control, which is submitted with the form data.\n   */\n  @Prop() name?: string = this.inputId;\n\n  /**\n   * The size of the switch component.\n   */\n  @Prop() size?: IcSizesNoLarge = \"medium\";\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 of the toggle does not mean if it's checked or not, use the `checked`\n   * property for that.\n   *\n   * The value of a toggle is analogous to the value of a `<input type=\"checkbox\">`,\n   * it's only used when the toggle participates in a native `<form>`.\n   */\n  @Prop() value?: string | null = \"on\";\n\n  /**\n   * Emitted when the toggle loses focus.\n   */\n  @Event() icBlur!: EventEmitter<void>;\n\n  /**\n   * Emitted when the value property has changed.\n   */\n  @Event() icChange!: EventEmitter<IcSwitchChangeEventDetail>;\n\n  /**\n   * Emitted when the toggle has focus.\n   */\n  @Event() icFocus!: EventEmitter<void>;\n\n  disconnectedCallback(): void {\n    removeFormResetListener(this.el, this.handleFormReset);\n  }\n\n  componentWillLoad(): void {\n    this.checkedState = this.checked!;\n    addFormResetListener(this.el, this.handleFormReset);\n    removeDisabledFalse(this.disabled, this.el);\n  }\n\n  componentDidLoad(): void {\n    onComponentRequiredPropUndefined(\n      [{ prop: this.label, propName: \"label\" }],\n      \"Switch\"\n    );\n  }\n\n  /**\n   * Sets focus on the switch.\n   */\n  @Method()\n  async setFocus(): Promise<void> {\n    this.el.shadowRoot?.querySelector(\"input\")?.focus();\n  }\n\n  private handleChange = () => {\n    this.checkedState = !this.checkedState;\n    this.icChange.emit({\n      checked: this.checkedState,\n      value: this.value!,\n    });\n  };\n\n  private onFocus = () => {\n    this.icFocus.emit();\n  };\n\n  private onBlur = () => {\n    this.icBlur.emit();\n  };\n\n  private handleFormReset = (): void => {\n    this.checkedState = this.initiallyChecked!;\n  };\n\n  render() {\n    const {\n      label,\n      checkedState,\n      size,\n      disabled,\n      name,\n      value,\n      hideLabel,\n      helperText,\n      inputId,\n      theme,\n    } = this;\n\n    const isSmall = size === \"small\";\n\n    renderHiddenInput(this.el, checkedState ? value : \"\", name, disabled);\n\n    return (\n      <Host\n        class={{\n          [`ic-theme-${theme}`]: theme !== \"inherit\",\n        }}\n      >\n        <label\n          class={{\n            \"ic-switch-container\": true,\n            \"ic-switch-disabled\": !!disabled,\n            \"ic-switch-small\": isSmall,\n          }}\n          htmlFor={inputId}\n        >\n          {!hideLabel && (\n            <ic-input-label\n              for={inputId}\n              label={label}\n              helperText={helperText}\n              readonly={false}\n              disabled={disabled}\n              class={{\n                \"ic-switch-label\": true,\n                \"ic-switch-label-small\": isSmall,\n              }}\n            >\n              <slot name=\"helper-text\" slot=\"helper-text\"></slot>\n            </ic-input-label>\n          )}\n          {!hideLabel && <span class=\"ic-switch-line-break\"></span>}\n          <input\n            checked={checkedState}\n            disabled={disabled}\n            aria-label={label}\n            aria-checked={checkedState ? \"true\" : \"false\"}\n            aria-describedby={getInputDescribedByText(\n              this.el,\n              inputId,\n              helperText !== \"\",\n              false\n            )}\n            role=\"switch\"\n            class=\"ic-switch-input\"\n            type=\"checkbox\"\n            name=\"toggle\"\n            id={inputId}\n            onFocus={this.onFocus}\n            onBlur={this.onBlur}\n            onChange={this.handleChange}\n          />\n          <span class=\"ic-switch-toggle\">\n            <svg\n              class=\"ic-switch-icon\"\n              aria-hidden=\"true\"\n              focusable=\"false\"\n              viewBox=\"0 0 10 10\"\n              xmlns=\"http://www.w3.org/2000/svg\"\n            >\n              <line\n                class=\"ic-switch-icon-line\"\n                x1=\"9\"\n                y1={isSmall ? \"2\" : \"1\"}\n                x2=\"9\"\n                y2={isSmall ? \"8\" : \"9\"}\n              />\n            </svg>\n            <svg\n              class=\"ic-switch-icon\"\n              aria-hidden=\"true\"\n              focusable=\"false\"\n              viewBox=\"0 0 10 10\"\n              xmlns=\"http://www.w3.org/2000/svg\"\n            >\n              <circle\n                class=\"ic-switch-icon-circle\"\n                fill=\"none\"\n                cx=\"5\"\n                cy=\"5\"\n                r={isSmall ? \"3.335\" : \"4.445\"}\n              />\n            </svg>\n          </span>\n          <slot name=\"right-adornment\"></slot>\n        </label>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"ic-switch.js","sourceRoot":"","sources":["../../../src/components/ic-switch/ic-switch.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  Host,\n  h,\n  Prop,\n  State,\n  Element,\n  Event,\n  EventEmitter,\n  Method,\n  Watch,\n} from \"@stencil/core\";\nimport {\n  getInputDescribedByText,\n  onComponentRequiredPropUndefined,\n  renderHiddenInput,\n  addFormResetListener,\n  removeFormResetListener,\n  removeDisabledFalse,\n} from \"../../utils/helpers\";\nimport { IcSwitchChangeEventDetail } from \"./ic-switch.types\";\nimport { IcSizes, IcThemeMode } from \"../../utils/types\";\n\nlet inputIds = 0;\n\n/**\n * @slot helper-text - Content is set as the helper text for the switch.\n * @slot right-adornment - Content is placed to the right of switch.\n */\n@Component({\n  tag: \"ic-switch\",\n  styleUrl: \"ic-switch.css\",\n  shadow: {\n    delegatesFocus: true,\n  },\n})\nexport class Switch {\n  private inputId = `ic-switch-input-${inputIds++}`;\n\n  @Element() el: HTMLIcSwitchElement;\n\n  @State() checkedState: boolean = false;\n  @State() initiallyChecked = this.checked;\n\n  /**\n   * If `true`, the switch will display as checked.\n   */\n  @Prop() checked?: boolean = false;\n\n  @Watch(\"checked\")\n  checkedChangeHandler(): void {\n    this.checkedState = !!this.checked;\n  }\n\n  /**\n   * If `true`, the disabled state will be set.\n   */\n  @Prop() disabled?: boolean = false;\n  @Watch(\"disabled\")\n  watchDisabledHandler(): void {\n    removeDisabledFalse(this.disabled, this.el);\n  }\n\n  /**\n   * The helper text that will be displayed for additional field guidance.\n   */\n  @Prop() helperText?: 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?: boolean = false;\n\n  /**\n   * The aria-label applied to the switch when no visual 'name' is provided.\n   */\n  @Prop() label!: string;\n\n  /**\n   * The name of the control, which is submitted with the form data.\n   */\n  @Prop() name?: string = this.inputId;\n\n  /**\n   * The size of the switch component.\n   */\n  @Prop() size?: IcSizes = \"medium\";\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 of the toggle does not mean if it's checked or not, use the `checked`\n   * property for that.\n   *\n   * The value of a toggle is analogous to the value of a `<input type=\"checkbox\">`,\n   * it's only used when the toggle participates in a native `<form>`.\n   */\n  @Prop() value?: string | null = \"on\";\n\n  /**\n   * Emitted when the toggle loses focus.\n   */\n  @Event() icBlur!: EventEmitter<void>;\n\n  /**\n   * Emitted when the value property has changed.\n   */\n  @Event() icChange!: EventEmitter<IcSwitchChangeEventDetail>;\n\n  /**\n   * Emitted when the toggle has focus.\n   */\n  @Event() icFocus!: EventEmitter<void>;\n\n  disconnectedCallback(): void {\n    removeFormResetListener(this.el, this.handleFormReset);\n  }\n\n  componentWillLoad(): void {\n    this.checkedState = this.checked!;\n    addFormResetListener(this.el, this.handleFormReset);\n    removeDisabledFalse(this.disabled, this.el);\n  }\n\n  componentDidLoad(): void {\n    onComponentRequiredPropUndefined(\n      [{ prop: this.label, propName: \"label\" }],\n      \"Switch\"\n    );\n  }\n\n  /**\n   * Sets focus on the switch.\n   */\n  @Method()\n  async setFocus(): Promise<void> {\n    this.el.shadowRoot?.querySelector(\"input\")?.focus();\n  }\n\n  private handleChange = () => {\n    this.checkedState = !this.checkedState;\n    this.icChange.emit({\n      checked: this.checkedState,\n      value: this.value!,\n    });\n  };\n\n  private onFocus = () => {\n    this.icFocus.emit();\n  };\n\n  private onBlur = () => {\n    this.icBlur.emit();\n  };\n\n  private handleFormReset = (): void => {\n    this.checkedState = this.initiallyChecked!;\n  };\n\n  render() {\n    const {\n      label,\n      checkedState,\n      size,\n      disabled,\n      name,\n      value,\n      hideLabel,\n      helperText,\n      inputId,\n      theme,\n    } = this;\n\n    renderHiddenInput(this.el, checkedState ? value : \"\", name, disabled);\n\n    return (\n      <Host\n        class={{\n          [`ic-theme-${theme}`]: theme !== \"inherit\",\n        }}\n      >\n        <label\n          class={{\n            \"ic-switch-container\": true,\n            \"ic-switch-disabled\": !!disabled,\n            [`ic-switch-${size}`]: true,\n          }}\n          htmlFor={inputId}\n        >\n          {!hideLabel && (\n            <ic-input-label\n              for={inputId}\n              label={label}\n              helperText={helperText}\n              readonly={false}\n              disabled={disabled}\n              class={{\n                \"ic-switch-label\": true,\n              }}\n            >\n              <slot name=\"helper-text\" slot=\"helper-text\"></slot>\n            </ic-input-label>\n          )}\n          {!hideLabel && <span class=\"ic-switch-line-break\"></span>}\n          <input\n            checked={checkedState}\n            disabled={disabled}\n            aria-label={label}\n            aria-checked={checkedState ? \"true\" : \"false\"}\n            aria-describedby={getInputDescribedByText(\n              this.el,\n              inputId,\n              helperText !== \"\",\n              false\n            )}\n            role=\"switch\"\n            class=\"ic-switch-input\"\n            type=\"checkbox\"\n            name=\"toggle\"\n            id={inputId}\n            onFocus={this.onFocus}\n            onBlur={this.onBlur}\n            onChange={this.handleChange}\n          />\n          <span class=\"ic-switch-toggle\">\n            <span class=\"ic-switch-icon-line\" aria-hidden=\"true\"></span>\n            <svg\n              class=\"ic-switch-icon\"\n              aria-hidden=\"true\"\n              focusable=\"false\"\n              viewBox=\"0 0 8 8\"\n              xmlns=\"http://www.w3.org/2000/svg\"\n              fill=\"none\"\n            >\n              <circle\n                class=\"ic-switch-icon-circle\"\n                fill=\"none\"\n                cx=\"4\"\n                cy=\"4\"\n                r=\"3.5\"\n                vector-effect=\"non-scaling-stroke\"\n              />\n            </svg>\n          </span>\n          <slot name=\"right-adornment\"></slot>\n        </label>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/ic-switch/ic-switch.stories.js

@@ -30,9 +30,13 @@ export const Checked = {
   name: "Checked",
 };
 
-export const Small = {
-  render: () => html` <ic-switch size="small" label="Label"></ic-switch> `,
-  name: "Small",
+export const Sizes = {
+  render: () => html`
+    <ic-switch size="small" label="Label"></ic-switch>
+    <ic-switch label="Label"></ic-switch>
+    <ic-switch size="large" label="Label"></ic-switch>
+  `,
+  name: "Sizes",
 };
 
 export const Disabled = {
@@ -136,7 +140,7 @@ export const Playground = {
 
   argTypes: {
     size: {
-      options: ["medium", "small"],
+      options: ["small", "medium", "large"],
 
       control: {
         type: "inline-radio",

package/dist/collection/components/ic-tab-context/ic-tab-context.js

@@ -227,7 +227,7 @@ export class TabContext {
         }
     }
     render() {
-        return h("slot", { key: '6a473d128002201d91b16855f088cb013b3e6b09' });
+        return h("slot", { key: '717530e623d11f274e79fe3be4bcbd0ff9e71033' });
     }
     static get is() { return "ic-tab-context"; }
     static get properties() {

package/dist/collection/components/ic-tab-group/ic-tab-group.js

@@ -16,11 +16,11 @@ export class TabGroup {
     }
     render() {
         const { inline, theme, label, monochrome } = this;
-        return (h(Host, { key: '1e0f683aa804fe2dde78bce4c8d9b60c5d6a4396', role: "tablist", "aria-label": label, class: {
+        return (h(Host, { key: '1681c117c989b999a55a9646350f26efe3dac55c', role: "tablist", "aria-label": label, class: {
                 ["ic-tab-group-inline"]: !!inline,
                 [`ic-theme-${theme}`]: theme !== "inherit",
                 ["ic-tab-group-monochrome"]: !!monochrome,
-            } }, h("ic-horizontal-scroll", { key: 'fdca176d28c2e6619d787f3d141a78c3cf06176a', theme: theme, "focus-trigger": "tabFocus", monochrome: monochrome }, h("div", { key: 'f3255d04eebecdd81e5badd671fee33b885df3c5', class: "tabs-container" }, h("slot", { key: '9499e87ed5fd26e3936fcc7c9af353d7acd2fb36' })))));
+            } }, h("ic-horizontal-scroll", { key: '86003202cd06e1bbd9f99124c10ceebe9414049d', theme: theme, "focus-trigger": "tabFocus", monochrome: monochrome }, h("div", { key: '4e1b79906c19817adf8a4d01332f8066e8d5e1c4', class: "tabs-container" }, h("slot", { key: '697f2ce044588082937aff666d1f04976b310785' })))));
     }
     static get is() { return "ic-tab-group"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/ic-tab-panel/ic-tab-panel.js

@@ -17,10 +17,10 @@ export class TabPanel {
     }
     render() {
         const { active, theme } = this;
-        return (h(Host, { key: '7daba74123d072e8ebdac9f217451b67a734dbc4', class: {
+        return (h(Host, { key: 'c00d3917329516768eb37409203d897251b75d76', class: {
                 [`ic-theme-${theme}`]: theme !== "inherit",
                 "ic-tab-panel-hidden": !active,
-            }, role: "tabpanel", "aria-hidden": `${!active}` }, h("div", { key: '552b91bfa6a9570da568982b693d13f5ce8911e7' }, h("slot", { key: '3f2f5d3de12ab65d949bccfdc9aa5ea09a6dfa8d' }))));
+            }, role: "tabpanel", "aria-hidden": `${!active}` }, h("div", { key: 'f5cc419286a31c1b6da62a34926dcf8060c12dfd' }, h("slot", { key: '05c9bfb071d304e758c0bb8dd780bf000b3d8bf1' }))));
     }
     static get is() { return "ic-tab-panel"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/ic-text-field/ic-text-field.js

@@ -387,14 +387,14 @@ export class TextField {
         hiddenInput
             ? renderHiddenInput(this.el, value, name, disabledMode)
             : removeHiddenInput(this.el);
-        return (h(Host, { key: '6300558c65d21c3cf9fcb2af66774cbdf274cf89', class: {
+        return (h(Host, { key: '4eb073ddbce5dc93c167bbaa66b94daf51c4a828', class: {
                 "ic-text-field-full-width": fullWidth,
                 "ic-text-field-disabled": disabledMode,
                 [`ic-theme-${theme}`]: theme !== "inherit",
-            } }, h("ic-input-container", { key: '6f0d1a6cf4ed01bd98c3b69d37f6ffb473e1201e', readonly: readonly, disabled: disabledMode }, !hideLabel && (h("ic-input-label", { key: '71cc64b0733fbe16b21f389000c8a6813ad9f07f', for: inputId, label: label, helperText: helperText, required: required, disabled: disabledText, readonly: readonly }, h("slot", { key: '985b82195b09acc991bbed6c0be5210cba70f59e', name: "helper-text", slot: "helper-text" }))), h("ic-input-component-container", { key: '95df2f453e06c5dec6788e98db94e5e4ce129d04', size: size, validationStatus: currentStatus, multiLine: multiline, disabled: disabledMode, readonly: readonly, validationInline: validationInline, fullWidth: fullWidth }, showLeftIcon && (h("span", { key: '62a052203a6b9e35858e7103f505bdf38eda7349', class: {
+            } }, h("ic-input-container", { key: '07a171c8cbd55588387145b3d8469e6930ab4a7c', readonly: readonly, disabled: disabledMode }, !hideLabel && (h("ic-input-label", { key: 'b5f6b3b831c08cd4958458188c8d6be3219f1479', for: inputId, label: label, helperText: helperText, required: required, disabled: disabledText, readonly: readonly }, h("slot", { key: '1c33ec889c6a730f4b7e1075978e13f05a21f53a', name: "helper-text", slot: "helper-text" }))), h("ic-input-component-container", { key: '786f1d5b65b4b66838aba7320cd5b479cd8305e4', size: size, validationStatus: currentStatus, multiLine: multiline, disabled: disabledMode, readonly: readonly, validationInline: validationInline, fullWidth: fullWidth }, showLeftIcon && (h("span", { key: 'ed91ef841c132afd05cdee83e735413ad1d9e5a3', class: {
                 readonly,
                 "has-value": this.getNumberOfCharacters(value) > 0,
-            }, slot: "left-icon" }, h("slot", { key: '12ee0976840d954f7f855740db4098983ccf73a5', name: "icon" }))), !multiline ? (h("input", Object.assign({ id: inputId, name: name, ref: (el) => (this.inputEl = el), type: type, min: min, max: max, value: value, class: {
+            }, slot: "left-icon" }, h("slot", { key: 'ee52a8fc57ce814d713d1a0807d8dc040ced4d41', name: "icon" }))), !multiline ? (h("input", Object.assign({ id: inputId, name: name, ref: (el) => (this.inputEl = el), type: type, min: min, max: max, value: value, class: {
                 "no-left-pad": !showLeftIcon && readonly,
                 readonly,
                 "truncate-value": truncateValue,
@@ -402,12 +402,12 @@ export class TextField {
                 "no-resize": resize === false || !!readonly,
                 "no-left-pad": !showLeftIcon && !!readonly,
                 readonly: !!readonly,
-            }, name: name, ref: (el) => (this.inputEl = el), value: value, rows: rows, required: required, disabled: disabledMode, placeholder: placeholder, readonly: readonly, onInput: this.onInput, onBlur: this.onBlur, onFocus: this.onFocus, onScroll: this.onTextAreaScroll, "aria-label": label, "aria-describedby": describedBy, "aria-invalid": invalid, autocomplete: autocomplete, autocapitalize: autocapitalize, spellcheck: spellcheck, inputmode: inputmode, maxlength: maxCharactersReached ? maxCharacters : undefined, minlength: minCharactersUnattained ? minCharacters : undefined }, inheritedAttributes))), isSlotUsed(el, "clear-button") && (h("slot", { key: '4bd5b1b44a9fded9be98c35d3e49f357b99adf26', name: "clear-button" })), isSlotUsed(el, "search-submit-button") && (h("slot", { key: 'fccd3ae4e454d661540f45b748440aa8c9c28baf', name: "search-submit-button" }))), isSlotUsed(el, "menu") && h("slot", { key: 'aca9fabb2b029547a713e75be81c179e3c1e3b52', name: "menu" }), h("ic-input-validation", { key: '1d2443ab140751bd21f247f5136254498ffc8004', class: { "show-validation": this.showValidationMargin() }, status: this.hasStatus(currentStatus) === false ||
+            }, name: name, ref: (el) => (this.inputEl = el), value: value, rows: rows, required: required, disabled: disabledMode, placeholder: placeholder, readonly: readonly, onInput: this.onInput, onBlur: this.onBlur, onFocus: this.onFocus, onScroll: this.onTextAreaScroll, "aria-label": label, "aria-describedby": describedBy, "aria-invalid": invalid, autocomplete: autocomplete, autocapitalize: autocapitalize, spellcheck: spellcheck, inputmode: inputmode, maxlength: maxCharactersReached ? maxCharacters : undefined, minlength: minCharactersUnattained ? minCharacters : undefined }, inheritedAttributes))), isSlotUsed(el, "clear-button") && (h("slot", { key: '06f74409f7256055715e982be8e68780df1126b5', name: "clear-button" })), isSlotUsed(el, "search-submit-button") && (h("slot", { key: '7ed8058fb83dfa713539348de0c37929a0225129', name: "search-submit-button" }))), isSlotUsed(el, "menu") && h("slot", { key: 'e56ca28bcb4154d65bb46f1b3625e29c0038e9b7', name: "menu" }), h("ic-input-validation", { key: '3c64d8598155035ebde2419e407e89c35053c64a', class: { "show-validation": this.showValidationMargin() }, status: this.hasStatus(currentStatus) === false ||
                 (currentStatus === IcInformationStatus.Success &&
                     validationInline) ||
                 validationInlineInternal
                 ? ""
-                : currentStatus, message: showStatusText ? currentValidationText : "", ariaLiveMode: messageAriaLive, for: inputId, fullWidth: fullWidth }, isSlotUsed(el, "validation-text") && (h("slot", { key: 'e8f5abdc72b047998c5164ec7bef70eab2d7af81', name: "validation-text", slot: "validation-message" })), !readonly && maxNumChars > 0 && (h("div", { key: '9458320139c6c17b4db3f40ef91ed8f35667e612', slot: "validation-message-adornment" }, !hideCharCount && (h("ic-typography", { key: '26663bbc0dbc1e5183cfb4af5b2f9a244fa303c5', variant: "caption", class: "char-count-text" }, h("span", { key: '84a9de3338f2fee09b3712fcc56dd509bbc672e2', class: "char-count" }, numChars, "/", maxNumChars))), h("span", { key: 'cb1d19f9755ea5b393e03ab19da262c67ce6e19e', class: "remaining-char-count-desc", "aria-live": "polite", hidden: !isFocussed, id: remainingCharCountDescId }, remainingCharCountDesc), h("span", { key: '87cfdac09956c5e749ff4c06bb58228d2d40feb5', hidden: true, id: hiddenCharCountDescId }, "Field can contain a maximum of ", maxNumChars, " characters.")))))));
+                : currentStatus, message: showStatusText ? currentValidationText : "", ariaLiveMode: messageAriaLive, for: inputId, fullWidth: fullWidth }, isSlotUsed(el, "validation-text") && (h("slot", { key: 'd40417b8b52597518c4b1e804ede9ae59364c0c9', name: "validation-text", slot: "validation-message" })), !readonly && maxNumChars > 0 && (h("div", { key: 'e4dc991f18d280cf05f3ead492e17eb37b15cbb1', slot: "validation-message-adornment" }, !hideCharCount && (h("ic-typography", { key: 'e668b2a73a860bd7a53300440a019239363f2350', variant: "caption", class: "char-count-text" }, h("span", { key: '835dea67f0e27e0c86e0236f48ecd7a5265719a3', class: "char-count" }, numChars, "/", maxNumChars))), h("span", { key: '0a4d3628c4ecfe1102b015c3bf4a345eb2a18674', class: "remaining-char-count-desc", "aria-live": "polite", hidden: !isFocussed, id: remainingCharCountDescId }, remainingCharCountDesc), h("span", { key: '365c77cbed1ca017f3f19f13be9b76561ec5cf57', hidden: true, id: hiddenCharCountDescId }, "Field can contain a maximum of ", maxNumChars, " characters.")))))));
     }
     static get is() { return "ic-text-field"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/ic-theme/ic-theme.js

@@ -65,7 +65,7 @@ export class Theme {
     }
     render() {
         const { themeClass } = this;
-        return (h(Host, { key: '29325dda558601bd748d1712aa146bfd5c2d1240', class: themeClass }, h("slot", { key: 'c352dc6c92ee972a7542c01f8fefa62c38575034' })));
+        return (h(Host, { key: '63d492e3dd31089565a15df543420f375dbad1b6', class: themeClass }, h("slot", { key: '479a3cbc49286aa2e3853956721f26a5ee37e9ef' })));
     }
     static get is() { return "ic-theme"; }
     static get properties() {

package/dist/collection/components/ic-toast/ic-toast.js

@@ -207,20 +207,20 @@ export class Toast {
     }
     render() {
         const { variant, heading, message, visible, isManual, dismissButtonAriaLabel, theme, } = this;
-        return (h(Host, { key: 'ff2cb4fa83ec20e9226dac7e6d65692877f6ba18', class: {
+        return (h(Host, { key: '57c068f4c9a9e3017733432a596f78e2bcbffae6', class: {
                 [`ic-theme-${theme}`]: theme !== "inherit",
                 ["ic-toast-hidden"]: !visible,
                 [`ic-toast-variant-${variant}`]: variant !== undefined,
-            }, tabindex: "0", onFocus: this.onFocus, onBlur: this.onBlur, role: isManual ? "dialog" : "alert", "aria-live": isManual ? null : "polite" }, h("div", { key: '96a06262e46b6fd4eefe8e3eb84c3b67c5a85335', class: {
+            }, tabindex: "0", onFocus: this.onFocus, onBlur: this.onBlur, role: isManual ? "dialog" : "alert", "aria-live": isManual ? null : "polite" }, h("div", { key: 'e24bd72e435cc443c375eee309ae98fc9e030c0b', class: {
                 ["container"]: true,
                 [`container-${variant}`]: variant !== undefined,
-            } }, variant && visible && (h("div", { key: '30eec9ac65d800405983859cada0514bce740b6a', class: "toast-icon-container" }, h("div", { key: '741228b2fa872bc5f6c4a2e57d76b2ce1ae313da', class: {
+            } }, variant && visible && (h("div", { key: 'bdabfabb04efcd93ab88ecb691b3baa73fc9da0a', class: "toast-icon-container" }, h("div", { key: 'bede66dcf6189ac321e9bee90dc144e9d38a09dc', class: {
                 ["divider"]: true,
                 [`divider-${variant}`]: true,
-            } }), variant === "neutral" ? (h("slot", { name: "neutral-icon" })) : (h("span", { class: "toast-icon", innerHTML: VARIANT_ICONS[variant].icon })))), h("div", { key: '5068418007424fb1e8074a51c3d48b44d3d4960d', class: {
+            } }), variant === "neutral" ? (h("slot", { name: "neutral-icon" })) : (h("span", { class: "toast-icon", innerHTML: VARIANT_ICONS[variant].icon })))), h("div", { key: '57480804dc55695e555a16dd818c5febcaffbe00', class: {
                 ["toast-content"]: true,
                 ["no-icon"]: variant === "neutral" && !isSlotUsed(this.el, "neutral-icon"),
-            } }, h("div", { key: '99bb37a24570386689e6712e1b5e55cfce64fba9', class: "toast-text" }, h("ic-typography", { key: '017c9e715e6f60aeb95ee28d67130541b6df4888', variant: "subtitle-large", class: "toast-heading" }, visible && (isManual ? h("h5", null, heading) : h("p", null, heading))), message && (h("ic-typography", { key: '30d276906aec46c8ac41ef3275dc3b7b5c96177b', variant: "body", class: "toast-message" }, visible && h("p", { key: 'f1648dc19f63770974cc92ef9da333e000677bb9' }, message)))), isSlotUsed(this.el, "action") && (h("div", { key: 'a8e396c4263d937de7c76c15aa68cf499ad5df78', class: "toast-action-container" }, h("slot", { key: '22d5e4ef0f50a3b65067c27d305ade75eab441a0', name: "action" })))), !isManual ? (h("ic-loading-indicator", { class: "toast-dismiss-timer", theme: "dark", monochrome: true, size: "icon", progress: this.timerProgress, description: "Dismiss timer" })) : (h("ic-button", { id: "dismiss-button", innerHTML: closeIcon, onClick: this.dismissAction, variant: "icon-tertiary", "aria-label": dismissButtonAriaLabel })))));
+            } }, h("div", { key: '8540288f9f34f0b72c86fa3039d579c93be1277f', class: "toast-text" }, h("ic-typography", { key: 'c5e8f2d0a2fe026b430dddf7a81e825845f5ce72', variant: "subtitle-large", class: "toast-heading" }, visible && (isManual ? h("h5", null, heading) : h("p", null, heading))), message && (h("ic-typography", { key: '89fe3df8f98581ef66c1ea74930d9042a579a359', variant: "body", class: "toast-message" }, visible && h("p", { key: 'd805d260febad5f8d58aeffe2dfef9f84d6d0911' }, message)))), isSlotUsed(this.el, "action") && (h("div", { key: 'c9cfd3cd4bf5f77cea072bb15f8629ab4a368ad0', class: "toast-action-container" }, h("slot", { key: '26b2fb447b937f327719edfe531e5b1260fa7c6c', name: "action" })))), !isManual ? (h("ic-loading-indicator", { class: "toast-dismiss-timer", theme: "dark", monochrome: true, size: "icon", progress: this.timerProgress, description: "Dismiss timer" })) : (h("ic-button", { id: "dismiss-button", innerHTML: closeIcon, onClick: this.dismissAction, variant: "icon-tertiary", "aria-label": dismissButtonAriaLabel })))));
     }
     static get is() { return "ic-toast"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/ic-toast-region/ic-toast-region.js

@@ -40,7 +40,7 @@ export class ToastRegion {
         }
     }
     render() {
-        return h("slot", { key: 'a8f7702ec7c396139a9fa455dd6900e4d3232f73' });
+        return h("slot", { key: '28f5e26c6dbfb2de076cff231b72722f1ff403c7' });
     }
     static get is() { return "ic-toast-region"; }
     static get properties() {

package/dist/collection/components/ic-toggle-button/ic-toggle-button.js

@@ -150,7 +150,7 @@ export class ToggleButton {
     render() {
         const { accessibleLabel, checked, disabled, fullWidth, iconPlacement, monochrome, label, loading, outline, size, theme, tooltipPlacement, variant, } = this;
         const iconVariant = variant === "icon";
-        return (h(Host, { key: '40cd81ec38848d6b7b68707348ae0a2b7ee5a976', class: {
+        return (h(Host, { key: 'a90e2a846a52531dc542d039724dc8516a00ae14', class: {
                 "ic-toggle-button-checked": checked,
                 "ic-toggle-button-disabled": disabled,
                 "ic-toggle-button-icon": iconVariant,
@@ -160,7 +160,7 @@ export class ToggleButton {
                 "ic-toggle-button-hide-outline": !outline,
                 [`ic-toggle-button-${size}`]: true,
                 [`ic-theme-${theme}`]: theme !== "inherit",
-            }, onFocus: this.handleFocus }, h("ic-button", { key: 'ba600a5f546ef45e668800e9f26226f6f7e4985a', "aria-pressed": `${checked}`, variant: iconVariant ? "icon-tertiary" : "secondary", onClick: this.handleClick, title: accessibleLabel, "aria-label": `${accessibleLabel ? accessibleLabel : label}, ${checked ? "ticked" : "unticked"}`, disabled: disabled, size: size, fullWidth: fullWidth, loading: loading, tooltipPlacement: tooltipPlacement }, !iconVariant && label, h("slot", { key: '881f7a3d2789ee1d5ba98851380c7dd8527a5ae2' }), isSlotUsed(this.el, "icon") && (h("slot", { key: '2ef62044db8f5c13f280b74cfcadcf6dcec7859e', name: "icon", slot: `${iconPlacement}-icon` })), isSlotUsed(this.el, "badge") && (h("slot", { key: '6fcb625790392bc0602cd58a2ce669aa55073e57', name: "badge", slot: "badge" })))));
+            }, onFocus: this.handleFocus }, h("ic-button", { key: '6f15f0c63675bd099d370ce02e2b02eeac4e913a', "aria-pressed": `${checked}`, variant: iconVariant ? "icon-tertiary" : "secondary", onClick: this.handleClick, title: accessibleLabel, "aria-label": `${accessibleLabel ? accessibleLabel : label}, ${checked ? "ticked" : "unticked"}`, disabled: disabled, size: size, fullWidth: fullWidth, loading: loading, tooltipPlacement: tooltipPlacement }, !iconVariant && label, h("slot", { key: '2503823bad70fa984db6c71d16cc863daaede0e3' }), isSlotUsed(this.el, "icon") && (h("slot", { key: '53969441b6446ec012b538c2f3d468ea0e793547', name: "icon", slot: `${iconPlacement}-icon` })), isSlotUsed(this.el, "badge") && (h("slot", { key: '2619be7d1528115db996708b102aadd611fd1b4b', name: "badge", slot: "badge" })))));
     }
     static get is() { return "ic-toggle-button"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/ic-toggle-button-group/ic-toggle-button-group.js

@@ -245,14 +245,14 @@ export class ToggleButtonGroup {
     }
     render() {
         const { accessibleLabel, disabled, fullWidth, loading, monochrome, outline, theme, } = this;
-        return (h(Host, { key: '1238ec0b93b309a3945791eff6f847fb10b0abf5', role: "group", "aria-label": accessibleLabel, tabindex: disabled ? -1 : 0, class: {
+        return (h(Host, { key: 'b312b6cae074758bad82c66446709925e19cf5ce', role: "group", "aria-label": accessibleLabel, tabindex: disabled ? -1 : 0, class: {
                 "ic-toggle-button-group-disabled": disabled,
                 "ic-toggle-button-group-full-width": fullWidth,
                 "ic-toggle-button-group-loading": loading,
                 "ic-toggle-button-group-monochrome": monochrome,
                 "ic-toggle-button-group-hide-outline": !outline,
                 [`ic-theme-${theme}`]: theme !== "inherit",
-            }, onFocus: this.handleHostFocus }, h("slot", { key: '6dfd004b9e0c386362d8172334dfca2f1e6274fc' })));
+            }, onFocus: this.handleHostFocus }, h("slot", { key: '8b09d946e7a8983b66f8bef384901899f88a54af' })));
     }
     static get is() { return "ic-toggle-button-group"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/ic-tooltip/ic-tooltip.css

@@ -577,6 +577,27 @@ video {
   display: inline-block;
 }
 
+:host(.ic-tooltip.ic-tooltip-with-icon) .ic-tooltip-content {
+  display: flex;
+  align-items: flex-start;
+  justify-content: flex-start;
+  gap: var(--ic-space-xxs);
+  text-align: left;
+}
+
+:host(.ic-tooltip.ic-tooltip-with-icon) .ic-icon-container {
+  width: var(--ic-space-md);
+  height: var(--ic-space-md);
+  color: var(--ic-tooltip-text);
+}
+
+:host(.ic-tooltip.ic-tooltip-with-icon) ::slotted([slot="icon"]) {
+  width: var(--ic-space-md);
+  height: var(--ic-space-md);
+  display: inline-block;
+  margin-top: var(--ic-space-1px);
+}
+
 @media screen and (max-width: 576px) {
   :host(.ic-tooltip) .ic-tooltip-container {
     max-width: 18.875rem;

package/dist/collection/components/ic-tooltip/ic-tooltip.js

@@ -1,6 +1,9 @@
 import { Host, h, } from "@stencil/core";
 import { createPopper } from "@popperjs/core";
-import { isSafari, onComponentRequiredPropUndefined, } from "../../utils/helpers";
+import { isSafari, onComponentRequiredPropUndefined, isSlotUsed, renderDynamicChildSlots, } from "../../utils/helpers";
+/**
+ * @slot icon - Icon will be rendered to the left of the tooltip text.
+ */
 export class Tooltip {
     constructor() {
         this.delayedHideEvents = ["mouseleave"];
@@ -189,6 +192,10 @@ export class Tooltip {
         }
         this.containerContentArea =
             (_b = (_a = container === null || container === void 0 ? void 0 : container.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector(".content-area")) !== null && _b !== void 0 ? _b : null;
+        this.hostMutationObserver = new MutationObserver((mutationList) => renderDynamicChildSlots(mutationList, "icon", this));
+        this.hostMutationObserver.observe(this.el, {
+            childList: true,
+        });
         onComponentRequiredPropUndefined([{ prop: this.label, propName: "label" }], "Tooltip");
     }
     componentDidRender() {
@@ -197,6 +204,9 @@ export class Tooltip {
         this.maxLines &&
             this.maxLines > 0 &&
             (typographyEl === null || typographyEl === void 0 ? void 0 : typographyEl.setAttribute("style", `--truncation-max-lines: ${this.maxLines}`));
+        if (this.iconAltText && !isSlotUsed(this.el, "icon")) {
+            console.warn(`Prop 'iconAltText' is provided without an icon slotted in the 'icon' slot. Please provide an icon or remove the 'iconAltText' prop.`);
+        }
     }
     /**
      * Method to programmatically show/hide the tooltip without needing to interact with an anchor element
@@ -215,10 +225,11 @@ export class Tooltip {
     }
     render() {
         const { label, maxLines, silent, theme } = this;
-        return (h(Host, { key: '61c01b4710b1fb71a42044c7e4b7675497952575', class: {
+        return (h(Host, { key: 'f9990c54172e8fda3d24a9f613ff5328018b9c6c', class: {
                 "ic-tooltip": true,
                 [`ic-theme-${theme}`]: theme !== "inherit",
-            }, "aria-label": isSafari && label }, h("div", { key: '5b7e00e8164b7a95ca17523d11b4bd02bc4eefbb', ref: (el) => (this.toolTip = el), role: "tooltip", class: "ic-tooltip-container", "aria-hidden": `${silent}` }, h("ic-typography", { key: 'a118c99c30c776f39ed25c630a4231cb637fdcd2', maxLines: maxLines, variant: "caption" }, label), h("div", { key: '2ee6065bc691893170591e43aba77973e6387141', ref: (el) => (this.arrow = el), class: "ic-tooltip-arrow" })), h("slot", { key: 'd76275c08c93ee6d4b39b0ab6be9093a8d5e6de1' })));
+                "ic-tooltip-with-icon": isSlotUsed(this.el, "icon"),
+            }, "aria-label": isSafari && label }, h("div", { key: '1b09f90e4da36ec2470bef240be537dc3642c922', ref: (el) => (this.toolTip = el), role: "tooltip", class: "ic-tooltip-container", "aria-hidden": `${silent}` }, h("div", { key: '1cbfb4ce2ba7fce474330e70aab9f6820845b80d', class: "ic-tooltip-content" }, isSlotUsed(this.el, "icon") && (h("div", { key: '3b82f426322ae769893569dc7c649f0ada256ad2', class: "ic-icon-container", "aria-hidden": `${!this.iconAltText}`, "aria-label": this.iconAltText, role: "img" }, h("slot", { key: '7dd357c6339e36a9d830d74e042f2772b6d1fb4e', name: "icon", "aria-hidden": "true" }))), h("ic-typography", { key: '959297e6c8134160c67aaea1f09b06b30bdc6bbb', maxLines: maxLines, variant: "caption" }, label)), h("div", { key: '8be3a57f5e5c7dcb1b16544ab18aa2fbf9f76ad6', ref: (el) => (this.arrow = el), class: "ic-tooltip-arrow" })), h("slot", { key: 'cb9ede12f1da7cf478cff4ae6914693e0ec3f560' })));
     }
     static get is() { return "ic-tooltip"; }
     static get encapsulation() { return "shadow"; }
@@ -294,6 +305,25 @@ export class Tooltip {
                 "reflect": false,
                 "defaultValue": "false"
             },
+            "iconAltText": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "The alt text to be used alongside a slotted icon."
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "icon-alt-text",
+                "reflect": false
+            },
             "maxLines": {
                 "type": "number",
                 "mutable": false,

package/dist/collection/components/ic-tooltip/ic-tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"ic-tooltip.js","sourceRoot":"","sources":["../../../src/components/ic-tooltip/ic-tooltip.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Host,\n  Prop,\n  h,\n  Method,\n  State,\n  Watch,\n} from \"@stencil/core\";\nimport { Instance, Options, createPopper } from \"@popperjs/core\";\nimport { IcTooltipPlacements } from \"./ic-tooltip.types\";\nimport {\n  isSafari,\n  onComponentRequiredPropUndefined,\n} from \"../../utils/helpers\";\nimport { IcThemeMode } from \"../../utils/types\";\n\n@Component({\n  tag: \"ic-tooltip\",\n  styleUrl: \"ic-tooltip.css\",\n  shadow: true,\n})\nexport class Tooltip {\n  private arrow: HTMLDivElement;\n  private delayedHideEvents = [\"mouseleave\"];\n  private containerContentArea: HTMLDivElement | null;\n  private instantHideEvents = [\"focusout\"];\n  private mouseOverTool: boolean = false;\n  private persistTooltip = false;\n  private popperInstance: Instance;\n  private showEvents = [\n    !this.disableHover && \"mouseenter\",\n    !this.disableHover && \"focusin\",\n    !this.disableClick && \"click\",\n  ];\n  private toolTip: HTMLDivElement;\n\n  @Element() el: HTMLIcTooltipElement;\n\n  /**\n   * If `true`, the tooltip will not be displayed on click, it will require hover or using the display method.\n   */\n  @Prop() disableClick?: boolean = false;\n\n  @Watch(\"disableClick\")\n  watchDisableClickHandler(): void {\n    if (this.disableClick) {\n      this.hide();\n    }\n    this.updateTooltipEvents();\n  }\n\n  /**\n   * If `true`, the tooltip will not be displayed on hover, it will require a click.\n   */\n  @Prop() disableHover?: boolean = false;\n\n  @Watch(\"disableHover\")\n  watchDisableHoverHandler(): void {\n    if (this.disableHover) {\n      this.hide();\n    }\n    this.updateTooltipEvents();\n  }\n\n  /**\n   * Setting to `true` can help in situations where tooltip content is clipped by a parent element.\n   */\n  @Prop() fixedPositioning: boolean = false;\n\n  /**\n   * The number of lines to display before truncating the text.\n   */\n  @Prop() maxLines?: number;\n\n  /**\n   * The position of the tooltip in relation to the parent element.\n   */\n  @Prop() placement?: IcTooltipPlacements = \"bottom\";\n\n  /**\n   * @internal Sets the tooltip to aria-hidden, when used as part of components that are already announced.\n   */\n  @Prop() silent?: boolean = false;\n\n  /**\n   * The ID of the element the tooltip is describing - for when aria-labelledby or aria-describedby is used.\n   */\n  @Prop({ reflect: true }) target?: string;\n\n  /**\n   * Sets the tooltip to the dark or light theme colors. \"inherit\" will set the color based on the system settings or ic-theme component.\n   */\n  @Prop() theme?: IcThemeMode = \"inherit\";\n\n  /**\n   * The text to display on the tooltip.\n   */\n  @Prop() label!: string;\n  @Watch(\"label\")\n  watchLabelHandler(): void {\n    if (this.toolTip?.hasAttribute(\"data-show\") && this.popperInstance) {\n      this.popperInstance.update();\n    }\n  }\n\n  @State() popperProps: Partial<Options> = {};\n\n  /**\n   * Emitted when the tooltip becomes visible.\n   */\n  @Event() icTooltipShow: EventEmitter<void>;\n\n  /**\n   * @internal This method allows props to be added to the PopperJS createPopper instance outside of tooltip\n   * @param props object - createPopper props set externally\n   */\n  @Method()\n  async setExternalPopperProps<T extends Partial<Options>>(props: T) {\n    this.popperProps = props;\n  }\n\n  disconnectedCallback(): void {\n    this.manageEventListeners(\"remove\");\n    if (this.popperInstance !== undefined) {\n      this.popperInstance.destroy();\n    }\n  }\n\n  componentDidLoad(): void {\n    this.manageEventListeners(\"add\");\n\n    // Display tooltips correctly within drawer and dialog components\n    let container: HTMLElement | null;\n\n    if ((this.el.getRootNode() as ShadowRoot).host) {\n      container = (this.el.getRootNode() as ShadowRoot).host.closest(\n        \"ic-dialog, ic-drawer\"\n      );\n    } else {\n      container = this.el.closest(\"ic-dialog, ic-drawer\");\n    }\n    this.containerContentArea =\n      container?.shadowRoot?.querySelector(\".content-area\") ?? null;\n\n    onComponentRequiredPropUndefined(\n      [{ prop: this.label, propName: \"label\" }],\n      \"Tooltip\"\n    );\n  }\n\n  componentDidRender(): void {\n    const typographyEl = this.el.shadowRoot?.querySelector(\n      \".ic-tooltip-container > ic-typography\"\n    );\n    this.maxLines &&\n      this.maxLines > 0 &&\n      typographyEl?.setAttribute(\n        \"style\",\n        `--truncation-max-lines: ${this.maxLines}`\n      );\n  }\n  /**\n   * Method to programmatically show/hide the tooltip without needing to interact with an anchor element\n   * @param show Whether to show or hide the tooltip\n   * @param persistTooltip Whether the tooltip should stay on the screen when actions are performed that would previously dismiss the tooltip, such as on hover\n   */\n  @Method()\n  async displayTooltip(show: boolean, persistTooltip?: boolean): Promise<void> {\n    this.persistTooltip = !!persistTooltip;\n    show ? this.show() : this.hide();\n  }\n\n  /**\n   * @internal Method to return if tooltip is currently visible.\n   */\n  @Method()\n  async isTooltipVisible(): Promise<boolean> {\n    return Promise.resolve(this.toolTip.hasAttribute(\"data-show\"));\n  }\n\n  private show = () => {\n    if (this.label) {\n      this.toolTip.setAttribute(\"data-show\", \"\");\n\n      if (this.containerContentArea) {\n        this.el.classList.add(\"ic-tooltip-in-container\");\n      }\n\n      this.popperInstance = createPopper(this.el, this.toolTip, {\n        strategy: this.fixedPositioning ? \"fixed\" : \"absolute\",\n        placement: this.placement,\n        modifiers: [\n          {\n            name: \"offset\",\n            options: {\n              offset: [0, 10],\n            },\n          },\n          {\n            name: \"arrow\",\n            options: {\n              element: this.arrow,\n            },\n          },\n          {\n            name: \"eventListeners\",\n            options: { scroll: false, resize: false },\n          },\n          ...(this.containerContentArea\n            ? [\n                {\n                  name: \"preventOverflow\",\n                  options: {\n                    boundary: this.containerContentArea,\n                    padding: 8,\n                  },\n                },\n                {\n                  name: \"flip\",\n                  options: {\n                    boundary: this.containerContentArea,\n                  },\n                },\n              ]\n            : []),\n        ],\n        ...this.popperProps,\n      });\n      this.icTooltipShow.emit();\n    } else {\n      console.warn(`Tooltip can't display without prop 'label' set`);\n    }\n  };\n\n  private hide = () => {\n    if (this.toolTip !== undefined) {\n      this.toolTip.removeAttribute(\"data-show\");\n      this.persistTooltip = false;\n    }\n    if (this.popperInstance !== undefined) {\n      this.popperInstance.destroy();\n    }\n  };\n\n  private checkCloseTooltip = () => {\n    setTimeout(() => {\n      if (!this.mouseOverTool && !this.persistTooltip) {\n        this.hide();\n      }\n    }, 100);\n  };\n\n  private mouseEnterTooltip = () => {\n    this.mouseOverTool = true;\n  };\n\n  private mouseLeaveTooltip = () => {\n    this.mouseOverTool = false;\n    this.checkCloseTooltip();\n  };\n\n  private handleKeyDown = (event: KeyboardEvent) => {\n    if (event.key === \"Escape\" && !this.persistTooltip) {\n      this.hide();\n    }\n  };\n\n  private manageEventListeners = (action: \"add\" | \"remove\") => {\n    const method =\n      action === \"add\" ? \"addEventListener\" : \"removeEventListener\";\n\n    this.showEvents.forEach((event) => {\n      if (event) {\n        this.el[method](event, this.show);\n        if (this.toolTip !== undefined) {\n          this.toolTip[method](event, this.mouseEnterTooltip);\n        }\n      }\n    });\n\n    if (!this.persistTooltip) {\n      this.instantHideEvents.forEach((event) => {\n        this.el[method](event, this.hide);\n      });\n    }\n\n    this.delayedHideEvents.forEach((event) => {\n      this.el[method](event, this.checkCloseTooltip);\n      if (this.toolTip !== undefined) {\n        this.toolTip[method](event, this.mouseLeaveTooltip);\n      }\n    });\n\n    document[method](\"keydown\", this.handleKeyDown as EventListener);\n  };\n\n  private updateTooltipEvents = () => {\n    this.manageEventListeners(\"remove\");\n    this.showEvents = [\n      !this.disableHover && \"mouseenter\",\n      !this.disableHover && \"focusin\",\n      !this.disableClick && \"click\",\n    ];\n    this.manageEventListeners(\"add\");\n  };\n\n  render() {\n    const { label, maxLines, silent, theme } = this;\n    return (\n      <Host\n        class={{\n          \"ic-tooltip\": true,\n          [`ic-theme-${theme}`]: theme !== \"inherit\",\n        }}\n        aria-label={isSafari && label} // accessible name needs to be in light dom to be announced by VoiceOver. Replace in v4 as aria-label on element with no role is not well-supported\n      >\n        <div\n          ref={(el) => (this.toolTip = el as HTMLDivElement)}\n          role=\"tooltip\"\n          class=\"ic-tooltip-container\"\n          aria-hidden={`${silent}`}\n        >\n          <ic-typography maxLines={maxLines} variant=\"caption\">\n            {label}\n          </ic-typography>\n          <div\n            ref={(el) => (this.arrow = el as HTMLDivElement)}\n            class=\"ic-tooltip-arrow\"\n          ></div>\n        </div>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"ic-tooltip.js","sourceRoot":"","sources":["../../../src/components/ic-tooltip/ic-tooltip.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Host,\n  Prop,\n  h,\n  Method,\n  State,\n  Watch,\n} from \"@stencil/core\";\nimport { Instance, Options, createPopper } from \"@popperjs/core\";\nimport { IcTooltipPlacements } from \"./ic-tooltip.types\";\nimport {\n  isSafari,\n  onComponentRequiredPropUndefined,\n  isSlotUsed,\n  renderDynamicChildSlots,\n} from \"../../utils/helpers\";\nimport { IcThemeMode } from \"../../utils/types\";\n\n/**\n * @slot icon - Icon will be rendered to the left of the tooltip text.\n */\n\n@Component({\n  tag: \"ic-tooltip\",\n  styleUrl: \"ic-tooltip.css\",\n  shadow: true,\n})\nexport class Tooltip {\n  private arrow: HTMLDivElement;\n  private delayedHideEvents = [\"mouseleave\"];\n  private containerContentArea: HTMLDivElement | null;\n  private instantHideEvents = [\"focusout\"];\n  private mouseOverTool: boolean = false;\n  private persistTooltip = false;\n  private popperInstance: Instance;\n  private showEvents = [\n    !this.disableHover && \"mouseenter\",\n    !this.disableHover && \"focusin\",\n    !this.disableClick && \"click\",\n  ];\n  private toolTip: HTMLDivElement;\n  private hostMutationObserver?: MutationObserver;\n\n  @Element() el: HTMLIcTooltipElement;\n\n  /**\n   * If `true`, the tooltip will not be displayed on click, it will require hover or using the display method.\n   */\n  @Prop() disableClick?: boolean = false;\n\n  @Watch(\"disableClick\")\n  watchDisableClickHandler(): void {\n    if (this.disableClick) {\n      this.hide();\n    }\n    this.updateTooltipEvents();\n  }\n\n  /**\n   * If `true`, the tooltip will not be displayed on hover, it will require a click.\n   */\n  @Prop() disableHover?: boolean = false;\n\n  @Watch(\"disableHover\")\n  watchDisableHoverHandler(): void {\n    if (this.disableHover) {\n      this.hide();\n    }\n    this.updateTooltipEvents();\n  }\n\n  /**\n   * Setting to `true` can help in situations where tooltip content is clipped by a parent element.\n   */\n  @Prop() fixedPositioning: boolean = false;\n\n  /**\n   * The alt text to be used alongside a slotted icon.\n   */\n  @Prop() iconAltText?: string;\n\n  /**\n   * The number of lines to display before truncating the text.\n   */\n  @Prop() maxLines?: number;\n\n  /**\n   * The position of the tooltip in relation to the parent element.\n   */\n  @Prop() placement?: IcTooltipPlacements = \"bottom\";\n\n  /**\n   * @internal Sets the tooltip to aria-hidden, when used as part of components that are already announced.\n   */\n  @Prop() silent?: boolean = false;\n\n  /**\n   * The ID of the element the tooltip is describing - for when aria-labelledby or aria-describedby is used.\n   */\n  @Prop({ reflect: true }) target?: string;\n\n  /**\n   * Sets the tooltip to the dark or light theme colors. \"inherit\" will set the color based on the system settings or ic-theme component.\n   */\n  @Prop() theme?: IcThemeMode = \"inherit\";\n\n  /**\n   * The text to display on the tooltip.\n   */\n  @Prop() label!: string;\n  @Watch(\"label\")\n  watchLabelHandler(): void {\n    if (this.toolTip?.hasAttribute(\"data-show\") && this.popperInstance) {\n      this.popperInstance.update();\n    }\n  }\n\n  @State() popperProps: Partial<Options> = {};\n\n  /**\n   * Emitted when the tooltip becomes visible.\n   */\n  @Event() icTooltipShow: EventEmitter<void>;\n\n  /**\n   * @internal This method allows props to be added to the PopperJS createPopper instance outside of tooltip\n   * @param props object - createPopper props set externally\n   */\n  @Method()\n  async setExternalPopperProps<T extends Partial<Options>>(props: T) {\n    this.popperProps = props;\n  }\n\n  disconnectedCallback(): void {\n    this.manageEventListeners(\"remove\");\n    if (this.popperInstance !== undefined) {\n      this.popperInstance.destroy();\n    }\n  }\n\n  componentDidLoad(): void {\n    this.manageEventListeners(\"add\");\n\n    // Display tooltips correctly within drawer and dialog components\n    let container: HTMLElement | null;\n\n    if ((this.el.getRootNode() as ShadowRoot).host) {\n      container = (this.el.getRootNode() as ShadowRoot).host.closest(\n        \"ic-dialog, ic-drawer\"\n      );\n    } else {\n      container = this.el.closest(\"ic-dialog, ic-drawer\");\n    }\n    this.containerContentArea =\n      container?.shadowRoot?.querySelector(\".content-area\") ?? null;\n    this.hostMutationObserver = new MutationObserver((mutationList) =>\n      renderDynamicChildSlots(mutationList, \"icon\", this)\n    );\n    this.hostMutationObserver.observe(this.el, {\n      childList: true,\n    });\n    onComponentRequiredPropUndefined(\n      [{ prop: this.label, propName: \"label\" }],\n      \"Tooltip\"\n    );\n  }\n\n  componentDidRender(): void {\n    const typographyEl = this.el.shadowRoot?.querySelector(\n      \".ic-tooltip-container > ic-typography\"\n    );\n    this.maxLines &&\n      this.maxLines > 0 &&\n      typographyEl?.setAttribute(\n        \"style\",\n        `--truncation-max-lines: ${this.maxLines}`\n      );\n\n    if (this.iconAltText && !isSlotUsed(this.el, \"icon\")) {\n      console.warn(\n        `Prop 'iconAltText' is provided without an icon slotted in the 'icon' slot. Please provide an icon or remove the 'iconAltText' prop.`\n      );\n    }\n  }\n\n  /**\n   * Method to programmatically show/hide the tooltip without needing to interact with an anchor element\n   * @param show Whether to show or hide the tooltip\n   * @param persistTooltip Whether the tooltip should stay on the screen when actions are performed that would previously dismiss the tooltip, such as on hover\n   */\n  @Method()\n  async displayTooltip(show: boolean, persistTooltip?: boolean): Promise<void> {\n    this.persistTooltip = !!persistTooltip;\n    show ? this.show() : this.hide();\n  }\n\n  /**\n   * @internal Method to return if tooltip is currently visible.\n   */\n  @Method()\n  async isTooltipVisible(): Promise<boolean> {\n    return Promise.resolve(this.toolTip.hasAttribute(\"data-show\"));\n  }\n\n  private show = () => {\n    if (this.label) {\n      this.toolTip.setAttribute(\"data-show\", \"\");\n\n      if (this.containerContentArea) {\n        this.el.classList.add(\"ic-tooltip-in-container\");\n      }\n\n      this.popperInstance = createPopper(this.el, this.toolTip, {\n        strategy: this.fixedPositioning ? \"fixed\" : \"absolute\",\n        placement: this.placement,\n        modifiers: [\n          {\n            name: \"offset\",\n            options: {\n              offset: [0, 10],\n            },\n          },\n          {\n            name: \"arrow\",\n            options: {\n              element: this.arrow,\n            },\n          },\n          {\n            name: \"eventListeners\",\n            options: { scroll: false, resize: false },\n          },\n          ...(this.containerContentArea\n            ? [\n                {\n                  name: \"preventOverflow\",\n                  options: {\n                    boundary: this.containerContentArea,\n                    padding: 8,\n                  },\n                },\n                {\n                  name: \"flip\",\n                  options: {\n                    boundary: this.containerContentArea,\n                  },\n                },\n              ]\n            : []),\n        ],\n        ...this.popperProps,\n      });\n      this.icTooltipShow.emit();\n    } else {\n      console.warn(`Tooltip can't display without prop 'label' set`);\n    }\n  };\n\n  private hide = () => {\n    if (this.toolTip !== undefined) {\n      this.toolTip.removeAttribute(\"data-show\");\n      this.persistTooltip = false;\n    }\n    if (this.popperInstance !== undefined) {\n      this.popperInstance.destroy();\n    }\n  };\n\n  private checkCloseTooltip = () => {\n    setTimeout(() => {\n      if (!this.mouseOverTool && !this.persistTooltip) {\n        this.hide();\n      }\n    }, 100);\n  };\n\n  private mouseEnterTooltip = () => {\n    this.mouseOverTool = true;\n  };\n\n  private mouseLeaveTooltip = () => {\n    this.mouseOverTool = false;\n    this.checkCloseTooltip();\n  };\n\n  private handleKeyDown = (event: KeyboardEvent) => {\n    if (event.key === \"Escape\" && !this.persistTooltip) {\n      this.hide();\n    }\n  };\n\n  private manageEventListeners = (action: \"add\" | \"remove\") => {\n    const method =\n      action === \"add\" ? \"addEventListener\" : \"removeEventListener\";\n\n    this.showEvents.forEach((event) => {\n      if (event) {\n        this.el[method](event, this.show);\n        if (this.toolTip !== undefined) {\n          this.toolTip[method](event, this.mouseEnterTooltip);\n        }\n      }\n    });\n\n    if (!this.persistTooltip) {\n      this.instantHideEvents.forEach((event) => {\n        this.el[method](event, this.hide);\n      });\n    }\n\n    this.delayedHideEvents.forEach((event) => {\n      this.el[method](event, this.checkCloseTooltip);\n      if (this.toolTip !== undefined) {\n        this.toolTip[method](event, this.mouseLeaveTooltip);\n      }\n    });\n\n    document[method](\"keydown\", this.handleKeyDown as EventListener);\n  };\n\n  private updateTooltipEvents = () => {\n    this.manageEventListeners(\"remove\");\n    this.showEvents = [\n      !this.disableHover && \"mouseenter\",\n      !this.disableHover && \"focusin\",\n      !this.disableClick && \"click\",\n    ];\n    this.manageEventListeners(\"add\");\n  };\n\n  render() {\n    const { label, maxLines, silent, theme } = this;\n    return (\n      <Host\n        class={{\n          \"ic-tooltip\": true,\n          [`ic-theme-${theme}`]: theme !== \"inherit\",\n          \"ic-tooltip-with-icon\": isSlotUsed(this.el, \"icon\"),\n        }}\n        aria-label={isSafari && label} // accessible name needs to be in light dom to be announced by VoiceOver. Replace in v4 as aria-label on element with no role is not well-supported\n      >\n        <div\n          ref={(el) => (this.toolTip = el as HTMLDivElement)}\n          role=\"tooltip\"\n          class=\"ic-tooltip-container\"\n          aria-hidden={`${silent}`}\n        >\n          <div class=\"ic-tooltip-content\">\n            {isSlotUsed(this.el, \"icon\") && (\n              <div\n                class=\"ic-icon-container\"\n                aria-hidden={`${!this.iconAltText}`}\n                aria-label={this.iconAltText}\n                role=\"img\"\n              >\n                <slot name=\"icon\" aria-hidden=\"true\"></slot>\n              </div>\n            )}\n            <ic-typography maxLines={maxLines} variant=\"caption\">\n              {label}\n            </ic-typography>\n          </div>\n          <div\n            ref={(el) => (this.arrow = el as HTMLDivElement)}\n            class=\"ic-tooltip-arrow\"\n          ></div>\n        </div>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"]}