@siemens/ix 0.0.0-pr-1318-20240627080522 → 0.0.0-pr-1373-20240705054533

package/dist/collection/components/time-picker/time-picker.js

@@ -109,7 +109,7 @@ export class TimePicker {
             },
         ];
         timepickerInformation = timepickerInformation.filter((item) => !item.hidden);
-        return (h(Host, { key: '052caa67744d0fa735d2bf420b6ee8b36c589593' }, h("ix-date-time-card", { key: '5d0e76c403f03b292b75ae83ea2c931f57dc512d', standaloneAppearance: this.standaloneAppearance, corners: this.corners }, h("div", { key: '2d56ae54a7dc9ea16c1a2c78ffafcd9b01076075', class: "header", slot: "header" }, h("ix-typography", { key: 'fd875137c44524b3b9d3e256ba1d574d9bd9c0e8', variant: "default-title" }, this.textTime || 'Time')), h("div", { key: '96306a898cef41ad37446abacecb00bc9fb3c3e8', class: "clock" }, timepickerInformation.map((descriptor, index) => (h("div", { class: "flex" }, h("div", { class: { columns: true, hidden: descriptor.hidden } }, h("ix-icon-button", { size: "16", onClick: () => (this._time = this._time.plus({
+        return (h(Host, { key: '406efcc8a6f13b2d14a29cc274087cdd0c163ae3' }, h("ix-date-time-card", { key: 'c412795818b4f9ff9529091efebbd90e4e02ac26', standaloneAppearance: this.standaloneAppearance, corners: this.corners }, h("div", { key: '3a4f02bf5d419d0cc8fe5d70043eddbdf03e3232', class: "header", slot: "header" }, h("ix-typography", { key: '2db318fff112ad225395288703c6962923c616e1', variant: "default-title" }, this.textTime || 'Time')), h("div", { key: 'b32d03ca5a29b81c48efc0ca00588013a3c0f927', class: "clock" }, timepickerInformation.map((descriptor, index) => (h("div", { class: "flex" }, h("div", { class: { columns: true, hidden: descriptor.hidden } }, h("ix-icon-button", { size: "16", onClick: () => (this._time = this._time.plus({
                 [descriptor.unit]: 1,
             })), ghost: true, icon: "chevron-up", variant: "primary", class: "arrows" }), h("input", { class: "form-control", name: descriptor.unit, type: "number", placeholder: descriptor.placeholder, value: this._formattedTime
                 ? this._formattedTime[descriptor.unit]
@@ -129,11 +129,11 @@ export class TimePicker {
             })), ghost: true, icon: "chevron-down", variant: "primary", class: "arrows" })), index !== timepickerInformation.length - 1 && (h("div", { class: {
                 'column-seperator': true,
                 hidden: descriptor.hidden,
-            } }, ":"))))), h("div", { key: 'e8edf6d77d7d6680f168555d9d893b58035dc94f', class: {
+            } }, ":"))))), h("div", { key: '9645b4495494b7d1624e4aa258285e33bc8e44c0', class: {
                 columns: true,
                 'default-space': true,
                 hidden: this._timeRef === undefined,
-            } }, h("ix-icon-button", { key: 'e77e0c724e814bad7077aaace11558a01e8247e3', size: "16", onClick: () => this.changeTimeReference(), ghost: true, icon: "chevron-up", variant: "primary", class: "arrows" }), h("div", { key: 'eff1b1d2b8af04033eb17d8148d6a8e16cc5f247', class: "time-reference" }, this._timeRef), h("ix-icon-button", { key: '4aa17f826e2c381ad13f4f13ea0773d5a703837a', size: "16", onClick: () => this.changeTimeReference(), ghost: true, icon: "chevron-down", variant: "primary", class: "arrows" }))), h("div", { key: '260a32b5259c25e16aaca379c0ad4797e21f9108', class: { button: true, hidden: !this.standaloneAppearance } }, h("ix-button", { key: '2568b6206b87a3661b3955141f59cfb2242edb71', onClick: () => {
+            } }, h("ix-icon-button", { key: 'dd5b9d9c3bbda4b376175518966991a13aa9c1d7', size: "16", onClick: () => this.changeTimeReference(), ghost: true, icon: "chevron-up", variant: "primary", class: "arrows" }), h("div", { key: 'ac27351872bc8cfdf41f14c86a49b2478e6cd120', class: "time-reference" }, this._timeRef), h("ix-icon-button", { key: 'e0d6654abbaa5330a9d6839523e0203c7dd7f38b', size: "16", onClick: () => this.changeTimeReference(), ghost: true, icon: "chevron-down", variant: "primary", class: "arrows" }))), h("div", { key: '294335c73b4e006724519cb05be7a9199b478dcb', class: { button: true, hidden: !this.standaloneAppearance } }, h("ix-button", { key: '120892208969407ff86e721eb1a2d886bbd83c89', onClick: () => {
                 this.timeSelect.emit(this._time.toFormat(this.format));
                 this.done.emit(this._time.toFormat(this.format));
             } }, this.textSelectTime)))));

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

@@ -77,10 +77,10 @@ export class ToastContainer {
         };
     }
     render() {
-        return (h(Host, { key: '7ed12499736b25361b54781a914704624361f413', class: {
+        return (h(Host, { key: '4c3986ebc5843f0d1846527f602851d82bd525d7', class: {
                 'toast-container--bottom-right': this.position === 'bottom-right',
                 'toast-container--top-right': this.position === 'top-right',
-            } }, h("slot", { key: '48a789d536cb007c2dc31d15615600cd0b51111d' })));
+            } }, h("slot", { key: '6d9c87e3bfddb1b1bf0fbebdd06efad5347b5390' })));
     }
     static get is() { return "ix-toast-container"; }
     static get encapsulation() { return "shadow"; }

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

@@ -51,11 +51,11 @@ export class Toast {
             animationPlayState: this.touched ? 'paused' : 'running',
         };
         progressBarClass.push('toast-progress-bar--animated');
-        return (h(Host, { key: 'ca58e7b2c0e4ee3d77bb0ee9be2a7ff86759f52a', class: "animate__animated animate__fadeIn" }, h("div", { key: '0d37ab4e3103087f5cb6d8b55c7afe843b2359c3', class: "toast-body", onPointerLeave: () => {
+        return (h(Host, { key: '165e8ce47907c08afaef29ec7741efaddaf59d0f', class: "animate__animated animate__fadeIn" }, h("div", { key: 'fff7c4afb35bf57eead0fa4b484e0843dcf6c163', class: "toast-body", onPointerLeave: () => {
                 this.touched = false;
             }, onPointerEnter: () => {
                 this.touched = true;
-            } }, this.type || this.icon ? (h("div", { class: "toast-icon" }, this.getIcon())) : null, h("div", { key: '83e897aa8388de4205c5348f7db698da94f83a19', class: "toast-content" }, this.toastTitle ? (h("div", { class: "toast-title" }, this.toastTitle)) : null, h("div", { key: '306f6cb5055ba4b60823d692bf7154c8364ab0f5', class: "toast-message" }, h("slot", { key: 'fcea3e5a631e27e9045167fde508e610c964063a' }))), h("div", { key: '706771eeb884647bd84a3895da2e42409971ab2e', class: "toast-close" }, h("ix-icon-button", { key: '7e27ce2f29d8d010d216bf6ef3d69feb9ebe51c8', icon: 'close', size: "24", ghost: true, onClick: () => this.closeToast.emit() }))), this.autoClose ? (h("div", { class: progressBarClass.join(' '), style: progressBarStyle, onAnimationEnd: () => {
+            } }, this.type || this.icon ? (h("div", { class: "toast-icon" }, this.getIcon())) : null, h("div", { key: 'cd9db0e7591fc8cc069608cff6c3824b4063b1df', class: "toast-content" }, this.toastTitle ? (h("div", { class: "toast-title" }, this.toastTitle)) : null, h("div", { key: '5c850aab1090ec83bfbb2ed4be68d665efaa403f', class: "toast-message" }, h("slot", { key: '0f857c156d576f8bc62cca7f2ab50df00fe3e794' }))), h("div", { key: '47db8f9094de72a16be06466bd694923d86492ff', class: "toast-close" }, h("ix-icon-button", { key: 'db141553999f04175cb135c9b89b7655a5eae216', icon: 'close', size: "24", ghost: true, onClick: () => this.closeToast.emit() }))), this.autoClose ? (h("div", { class: progressBarClass.join(' '), style: progressBarStyle, onAnimationEnd: () => {
                 this.close();
             }, onTransitionEnd: () => {
                 if (this.progress === 0) {

package/dist/collection/components/toggle/test/toggle.ct.js

@@ -15,7 +15,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 import { expect } from "@playwright/test";
-import { getFormValue, preventFormSubmission, test } from "../../../tests/utils/test/index";
+import { test } from "../../../tests/utils/test/index";
 test('renders', async ({ mount, page }) => {
     await mount(`<ix-toggle></ix-toggle>`);
     const drawer = page.locator('ix-toggle');
@@ -49,27 +49,4 @@ test('should be toggled ON after indeterminate', async ({ mount, page }) => {
     await toggle.click();
     await expect(input).toBeChecked();
 });
-test(`form-ready`, async ({ mount, page }) => {
-    await mount(`<form><ix-toggle name="my-field-name"></ix-toggle></form>`);
-    const formElement = page.locator('form');
-    preventFormSubmission(formElement);
-    await page.locator('ix-toggle').click();
-    const formData = await getFormValue(formElement, 'my-field-name');
-    expect(formData).toBe('on');
-});
-test(`form-ready with value`, async ({ mount, page }) => {
-    await mount(`<form><ix-toggle name="my-field-name" value="custom-value"></ix-toggle></form>`);
-    const formElement = page.locator('form');
-    preventFormSubmission(formElement);
-    await page.locator('ix-toggle').click();
-    const formData = await getFormValue(formElement, 'my-field-name');
-    expect(formData).toBe('custom-value');
-});
-test(`form-ready default active`, async ({ mount, page }) => {
-    await mount(`<form><ix-toggle name="my-field-name" checked></ix-toggle></form>`);
-    const formElement = page.locator('form');
-    preventFormSubmission(formElement);
-    const formData = await getFormValue(formElement, 'my-field-name');
-    expect(formData).toBe('on');
-});
 //# sourceMappingURL=toggle.ct.js.map

package/dist/collection/components/toggle/test/toggle.ct.js.map

@@ -1 +1 @@
-{"version":3,"file":"toggle.ct.js","sourceRoot":"","sources":["../../../../src/components/toggle/test/toggle.ct.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\nimport { expect } from '@playwright/test';\nimport { getFormValue, preventFormSubmission, test } from '@utils/test';\n\ntest('renders', async ({ mount, page }) => {\n  await mount(`<ix-toggle></ix-toggle>`);\n  const drawer = page.locator('ix-toggle');\n  await expect(drawer).toHaveClass(/hydrated/);\n  await expect(drawer).toBeVisible();\n});\n\ntest('should toggle', async ({ mount, page }) => {\n  await mount(`<ix-toggle></ix-toggle>`);\n  const toggle = page.locator('ix-toggle');\n  await expect(toggle).toHaveClass(/hydrated/);\n  await toggle.click();\n\n  const input = toggle.locator('input');\n  await expect(input).toBeChecked();\n});\n\ntest('should not toggle if disabled', async ({ mount, page }) => {\n  await mount(`<ix-toggle disabled></ix-toggle>`);\n  const toggle = page.locator('ix-toggle');\n  await expect(toggle).toHaveClass(/hydrated/);\n  await toggle.click({\n    force: true,\n  });\n\n  const input = toggle.locator('input');\n  await expect(input).not.toBeChecked();\n});\n\ntest('should be toggled ON after indeterminate', async ({ mount, page }) => {\n  await mount(`<ix-toggle indeterminate></ix-toggle>`);\n  const toggle = page.locator('ix-toggle');\n  await expect(toggle).toHaveClass(/hydrated/);\n  const input = toggle.locator('input');\n  await expect(input).not.toBeChecked();\n\n  await toggle.click();\n\n  await expect(input).toBeChecked();\n});\n\ntest(`form-ready`, async ({ mount, page }) => {\n  await mount(`<form><ix-toggle name=\"my-field-name\"></ix-toggle></form>`);\n\n  const formElement = page.locator('form');\n  preventFormSubmission(formElement);\n  await page.locator('ix-toggle').click();\n\n  const formData = await getFormValue(formElement, 'my-field-name');\n  expect(formData).toBe('on');\n});\n\ntest(`form-ready with value`, async ({ mount, page }) => {\n  await mount(\n    `<form><ix-toggle name=\"my-field-name\" value=\"custom-value\"></ix-toggle></form>`\n  );\n\n  const formElement = page.locator('form');\n  preventFormSubmission(formElement);\n  await page.locator('ix-toggle').click();\n\n  const formData = await getFormValue(formElement, 'my-field-name');\n  expect(formData).toBe('custom-value');\n});\n\ntest(`form-ready default active`, async ({ mount, page }) => {\n  await mount(\n    `<form><ix-toggle name=\"my-field-name\" checked></ix-toggle></form>`\n  );\n\n  const formElement = page.locator('form');\n  preventFormSubmission(formElement);\n  const formData = await getFormValue(formElement, 'my-field-name');\n  expect(formData).toBe('on');\n});\n"]}
+{"version":3,"file":"toggle.ct.js","sourceRoot":"","sources":["../../../../src/components/toggle/test/toggle.ct.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AACH;;;;;;;GAOG;AACH,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,OAAO,EAAE,IAAI,EAAE,MAAM,aAAa,CAAC;AAEnC,IAAI,CAAC,SAAS,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,EAAE;IACxC,MAAM,KAAK,CAAC,yBAAyB,CAAC,CAAC;IACvC,MAAM,MAAM,GAAG,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC;IACzC,MAAM,MAAM,CAAC,MAAM,CAAC,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;IAC7C,MAAM,MAAM,CAAC,MAAM,CAAC,CAAC,WAAW,EAAE,CAAC;AACrC,CAAC,CAAC,CAAC;AAEH,IAAI,CAAC,eAAe,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,EAAE;IAC9C,MAAM,KAAK,CAAC,yBAAyB,CAAC,CAAC;IACvC,MAAM,MAAM,GAAG,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC;IACzC,MAAM,MAAM,CAAC,MAAM,CAAC,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;IAC7C,MAAM,MAAM,CAAC,KAAK,EAAE,CAAC;IAErB,MAAM,KAAK,GAAG,MAAM,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;IACtC,MAAM,MAAM,CAAC,KAAK,CAAC,CAAC,WAAW,EAAE,CAAC;AACpC,CAAC,CAAC,CAAC;AAEH,IAAI,CAAC,+BAA+B,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,EAAE;IAC9D,MAAM,KAAK,CAAC,kCAAkC,CAAC,CAAC;IAChD,MAAM,MAAM,GAAG,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC;IACzC,MAAM,MAAM,CAAC,MAAM,CAAC,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;IAC7C,MAAM,MAAM,CAAC,KAAK,CAAC;QACjB,KAAK,EAAE,IAAI;KACZ,CAAC,CAAC;IAEH,MAAM,KAAK,GAAG,MAAM,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;IACtC,MAAM,MAAM,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,WAAW,EAAE,CAAC;AACxC,CAAC,CAAC,CAAC;AAEH,IAAI,CAAC,0CAA0C,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,EAAE;IACzE,MAAM,KAAK,CAAC,uCAAuC,CAAC,CAAC;IACrD,MAAM,MAAM,GAAG,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC;IACzC,MAAM,MAAM,CAAC,MAAM,CAAC,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;IAC7C,MAAM,KAAK,GAAG,MAAM,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;IACtC,MAAM,MAAM,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,WAAW,EAAE,CAAC;IAEtC,MAAM,MAAM,CAAC,KAAK,EAAE,CAAC;IAErB,MAAM,MAAM,CAAC,KAAK,CAAC,CAAC,WAAW,EAAE,CAAC;AACpC,CAAC,CAAC,CAAC","sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\nimport { expect } from '@playwright/test';\nimport { test } from '@utils/test';\n\ntest('renders', async ({ mount, page }) => {\n  await mount(`<ix-toggle></ix-toggle>`);\n  const drawer = page.locator('ix-toggle');\n  await expect(drawer).toHaveClass(/hydrated/);\n  await expect(drawer).toBeVisible();\n});\n\ntest('should toggle', async ({ mount, page }) => {\n  await mount(`<ix-toggle></ix-toggle>`);\n  const toggle = page.locator('ix-toggle');\n  await expect(toggle).toHaveClass(/hydrated/);\n  await toggle.click();\n\n  const input = toggle.locator('input');\n  await expect(input).toBeChecked();\n});\n\ntest('should not toggle if disabled', async ({ mount, page }) => {\n  await mount(`<ix-toggle disabled></ix-toggle>`);\n  const toggle = page.locator('ix-toggle');\n  await expect(toggle).toHaveClass(/hydrated/);\n  await toggle.click({\n    force: true,\n  });\n\n  const input = toggle.locator('input');\n  await expect(input).not.toBeChecked();\n});\n\ntest('should be toggled ON after indeterminate', async ({ mount, page }) => {\n  await mount(`<ix-toggle indeterminate></ix-toggle>`);\n  const toggle = page.locator('ix-toggle');\n  await expect(toggle).toHaveClass(/hydrated/);\n  const input = toggle.locator('input');\n  await expect(input).not.toBeChecked();\n\n  await toggle.click();\n\n  await expect(input).toBeChecked();\n});\n"]}

package/dist/collection/components/toggle/toggle.css

@@ -102,7 +102,6 @@
   background-color: var(--theme-switch-off--background);
   transition: var(--theme-default-time);
   border-radius: 1.5rem;
-  border: 1px solid transparent;
 }
 :host .slider:before {
   position: absolute;
@@ -110,7 +109,7 @@
   height: 1.125rem;
   width: 1.125rem;
   left: 4px;
-  bottom: 2px;
+  bottom: 3px;
   background-color: var(--theme-switch-thumb-off--background);
   transition: var(--theme-default-time);
   border-radius: 50%;
@@ -136,36 +135,26 @@
   background-color: var(--theme-switch-thumb-on--background);
   transform: translateX(1.35rem);
 }
-:host input + .switch > .slider {
-  border-color: var(--theme-switch-off--border-color);
-}
 :host input + .switch:hover > .slider {
   background-color: var(--theme-switch-off--background--hover);
-  border-color: var(--theme-switch-off--border-color--hover);
 }
 :host input + .switch:hover > .slider:before {
   background-color: var(--theme-switch-thumb-off--background--hover);
 }
 :host input + .switch:active > .slider {
   background-color: var(--theme-switch-off--background--active);
-  border-color: var(--theme-switch-off--border-color--active);
 }
 :host input + .switch:active > .slider:before {
   background-color: var(--theme-switch-thumb-off--background--active);
 }
-:host input:checked + .switch > .slider {
-  border-color: var(--theme-switch-on--border-color);
-}
 :host input:checked + .switch:hover > .slider {
   background-color: var(--theme-switch-on--background--hover);
-  border-color: var(--theme-switch-on--border-color--hover);
 }
 :host input:checked + .switch:hover > .slider:before {
   background-color: var(--theme-switch-thumb-on--background--hover);
 }
 :host input:checked + .switch:active > .slider {
   background-color: var(--theme-switch-on--background--active);
-  border-color: var(--theme-switch-on--border-color--active);
 }
 :host input:checked + .switch:active > .slider:before {
   background-color: var(--theme-switch-thumb-on--background--active);
@@ -199,124 +188,4 @@
 }
 :host(.disabled) .toggle-text {
   color: var(--theme-color-weak-text);
-}
-
-:host(.ix-info:not(.disabled)) .slider {
-  --theme-switch-off--background: var(--theme-switch-off--background--info);
-  --theme-switch-off--background--hover: var(--theme-switch-off--background--info--hover);
-  --theme-switch-off--background--active: var(--theme-switch-off--background--info--active);
-  --theme-switch-thumb-off--background: var(--theme-switch-thumb-off--background--info);
-  --theme-switch-thumb-off--background--hover: var(--theme-switch-thumb-off--background--info--hover);
-  --theme-switch-thumb-off--background--active: var(--theme-switch-thumb-off--background--info--active);
-  --theme-switch-off--border-color: var(--theme-switch-off--border-color--info);
-  --theme-switch-off--border-color--hover: var(--theme-switch-off--border-color--info--hover);
-  --theme-switch-off--border-color--active: var(--theme-switch-off--border-color--info--active);
-  --theme-switch-on--background: var(--theme-switch-on--background--info);
-  --theme-switch-on--background--hover: var(--theme-switch-on--background--info--hover);
-  --theme-switch-on--background--active: var(--theme-switch-on--background--info--active);
-  --theme-switch-thumb-on--background: var(--theme-switch-thumb-on--background--info);
-  --theme-switch-thumb-on--background--hover: var(--theme-switch-thumb-on--background--info--hover);
-  --theme-switch-thumb-on--background--active: var(--theme-switch-thumb-on--background--info--active);
-  --theme-switch-on--border-color: var(--theme-switch-on--border-color--info);
-  --theme-switch-on--border-color--hover: var(--theme-switch-on--border-color--info--hover);
-  --theme-switch-on--border-color--active: var(--theme-switch-on--border-color--info--active);
-  --theme-switch-mixed--background: var(--theme-switch-mixed--background--info);
-  --theme-switch-mixed--background--hover: var(--theme-switch-mixed--background--info--hover);
-  --theme-switch-mixed--background--active: var(--theme-switch-mixed--background--info--active);
-  --theme-switch-thumb-mixed--background: var(--theme-switch-thumb-mixed--background--info);
-  --theme-switch-thumb-mixed--background--hover: var(--theme-switch-thumb-mixed--background--info--hover);
-  --theme-switch-thumb-mixed--background--active: var(--theme-switch-thumb-mixed--background--info--active);
-  --theme-switch-mixed--border-color: var(--theme-switch-mixed--border-color--info);
-  --theme-switch-mixed--border-color--hover: var(--theme-switch-mixed--border-color--info--hover);
-  --theme-switch-mixed--border-color--active: var(--theme-switch-mixed--border-color--info--active);
-}
-
-:host(.ix-warning:not(.disabled)) .slider {
-  --theme-switch-off--background: var(--theme-switch-off--background--warning);
-  --theme-switch-off--background--hover: var(--theme-switch-off--background--warning--hover);
-  --theme-switch-off--background--active: var(--theme-switch-off--background--warning--active);
-  --theme-switch-thumb-off--background: var(--theme-switch-thumb-off--background--warning);
-  --theme-switch-thumb-off--background--hover: var(--theme-switch-thumb-off--background--warning--hover);
-  --theme-switch-thumb-off--background--active: var(--theme-switch-thumb-off--background--warning--active);
-  --theme-switch-off--border-color: var(--theme-switch-off--border-color--warning);
-  --theme-switch-off--border-color--hover: var(--theme-switch-off--border-color--warning--hover);
-  --theme-switch-off--border-color--active: var(--theme-switch-off--border-color--warning--active);
-  --theme-switch-on--background: var(--theme-switch-on--background--warning);
-  --theme-switch-on--background--hover: var(--theme-switch-on--background--warning--hover);
-  --theme-switch-on--background--active: var(--theme-switch-on--background--warning--active);
-  --theme-switch-thumb-on--background: var(--theme-switch-thumb-on--background--warning);
-  --theme-switch-thumb-on--background--hover: var(--theme-switch-thumb-on--background--warning--hover);
-  --theme-switch-thumb-on--background--active: var(--theme-switch-thumb-on--background--warning--active);
-  --theme-switch-on--border-color: var(--theme-switch-on--border-color--warning);
-  --theme-switch-on--border-color--hover: var(--theme-switch-on--border-color--warning--hover);
-  --theme-switch-on--border-color--active: var(--theme-switch-on--border-color--warning--active);
-  --theme-switch-mixed--background: var(--theme-switch-mixed--background--warning);
-  --theme-switch-mixed--background--hover: var(--theme-switch-mixed--background--warning--hover);
-  --theme-switch-mixed--background--active: var(--theme-switch-mixed--background--warning--active);
-  --theme-switch-thumb-mixed--background: var(--theme-switch-thumb-mixed--background--warning);
-  --theme-switch-thumb-mixed--background--hover: var(--theme-switch-thumb-mixed--background--warning--hover);
-  --theme-switch-thumb-mixed--background--active: var(--theme-switch-thumb-mixed--background--warning--active);
-  --theme-switch-mixed--border-color: var(--theme-switch-mixed--border-color--warning);
-  --theme-switch-mixed--border-color--hover: var(--theme-switch-mixed--border-color--warning--hover);
-  --theme-switch-mixed--border-color--active: var(--theme-switch-mixed--border-color--warning--active);
-}
-
-:host(.ix-invalid--required:not(.disabled)) .slider {
-  --theme-switch-off--background: var(--theme-switch-off--background--invalid);
-  --theme-switch-off--background--hover: var(--theme-switch-off--background--invalid--hover);
-  --theme-switch-off--background--active: var(--theme-switch-off--background--invalid--active);
-  --theme-switch-thumb-off--background: var(--theme-switch-thumb-off--background--invalid);
-  --theme-switch-thumb-off--background--hover: var(--theme-switch-thumb-off--background--invalid--hover);
-  --theme-switch-thumb-off--background--active: var(--theme-switch-thumb-off--background--invalid--active);
-  --theme-switch-off--border-color: var(--theme-switch-off--border-color--invalid);
-  --theme-switch-off--border-color--hover: var(--theme-switch-off--border-color--invalid--hover);
-  --theme-switch-off--border-color--active: var(--theme-switch-off--border-color--invalid--active);
-  --theme-switch-on--background: var(--theme-switch-on--background--invalid);
-  --theme-switch-on--background--hover: var(--theme-switch-on--background--invalid--hover);
-  --theme-switch-on--background--active: var(--theme-switch-on--background--invalid--active);
-  --theme-switch-thumb-on--background: var(--theme-switch-thumb-on--background--invalid);
-  --theme-switch-thumb-on--background--hover: var(--theme-switch-thumb-on--background--invalid--hover);
-  --theme-switch-thumb-on--background--active: var(--theme-switch-thumb-on--background--invalid--active);
-  --theme-switch-on--border-color: var(--theme-switch-on--border-color--invalid);
-  --theme-switch-on--border-color--hover: var(--theme-switch-on--border-color--invalid--hover);
-  --theme-switch-on--border-color--active: var(--theme-switch-on--border-color--invalid--active);
-  --theme-switch-mixed--background: var(--theme-switch-mixed--background--invalid);
-  --theme-switch-mixed--background--hover: var(--theme-switch-mixed--background--invalid--hover);
-  --theme-switch-mixed--background--active: var(--theme-switch-mixed--background--invalid--active);
-  --theme-switch-thumb-mixed--background: var(--theme-switch-thumb-mixed--background--invalid);
-  --theme-switch-thumb-mixed--background--hover: var(--theme-switch-thumb-mixed--background--invalid--hover);
-  --theme-switch-thumb-mixed--background--active: var(--theme-switch-thumb-mixed--background--invalid--active);
-  --theme-switch-mixed--border-color: var(--theme-switch-mixed--border-color--invalid);
-  --theme-switch-mixed--border-color--hover: var(--theme-switch-mixed--border-color--invalid--hover);
-  --theme-switch-mixed--border-color--active: var(--theme-switch-mixed--border-color--invalid--active);
-}
-
-:host(.ix-invalid:not(.disabled)) .slider {
-  --theme-switch-off--background: var(--theme-switch-off--background--invalid);
-  --theme-switch-off--background--hover: var(--theme-switch-off--background--invalid--hover);
-  --theme-switch-off--background--active: var(--theme-switch-off--background--invalid--active);
-  --theme-switch-thumb-off--background: var(--theme-switch-thumb-off--background--invalid);
-  --theme-switch-thumb-off--background--hover: var(--theme-switch-thumb-off--background--invalid--hover);
-  --theme-switch-thumb-off--background--active: var(--theme-switch-thumb-off--background--invalid--active);
-  --theme-switch-off--border-color: var(--theme-switch-off--border-color--invalid);
-  --theme-switch-off--border-color--hover: var(--theme-switch-off--border-color--invalid--hover);
-  --theme-switch-off--border-color--active: var(--theme-switch-off--border-color--invalid--active);
-  --theme-switch-on--background: var(--theme-switch-on--background--invalid);
-  --theme-switch-on--background--hover: var(--theme-switch-on--background--invalid--hover);
-  --theme-switch-on--background--active: var(--theme-switch-on--background--invalid--active);
-  --theme-switch-thumb-on--background: var(--theme-switch-thumb-on--background--invalid);
-  --theme-switch-thumb-on--background--hover: var(--theme-switch-thumb-on--background--invalid--hover);
-  --theme-switch-thumb-on--background--active: var(--theme-switch-thumb-on--background--invalid--active);
-  --theme-switch-on--border-color: var(--theme-switch-on--border-color--invalid);
-  --theme-switch-on--border-color--hover: var(--theme-switch-on--border-color--invalid--hover);
-  --theme-switch-on--border-color--active: var(--theme-switch-on--border-color--invalid--active);
-  --theme-switch-mixed--background: var(--theme-switch-mixed--background--invalid);
-  --theme-switch-mixed--background--hover: var(--theme-switch-mixed--background--invalid--hover);
-  --theme-switch-mixed--background--active: var(--theme-switch-mixed--background--invalid--active);
-  --theme-switch-thumb-mixed--background: var(--theme-switch-thumb-mixed--background--invalid);
-  --theme-switch-thumb-mixed--background--hover: var(--theme-switch-thumb-mixed--background--invalid--hover);
-  --theme-switch-thumb-mixed--background--active: var(--theme-switch-thumb-mixed--background--invalid--active);
-  --theme-switch-mixed--border-color: var(--theme-switch-mixed--border-color--invalid);
-  --theme-switch-mixed--border-color--hover: var(--theme-switch-mixed--border-color--invalid--hover);
-  --theme-switch-mixed--border-color--active: var(--theme-switch-mixed--border-color--invalid--active);
 }

package/dist/collection/components/toggle/toggle.js

@@ -8,13 +8,8 @@
  */
 import { Fragment, h, Host, } from "@stencil/core";
 import { a11yBoolean } from "../utils/a11y";
-/**
- * @form-ready 2.4.0
- * */
 export class Toggle {
     constructor() {
-        this.name = undefined;
-        this.value = 'on';
         this.checked = false;
         this.disabled = false;
         this.indeterminate = false;
@@ -22,7 +17,6 @@ export class Toggle {
         this.textOff = 'Off';
         this.textIndeterminate = 'Mixed';
         this.hideText = false;
-        this.required = false;
     }
     onCheckedChange(newChecked) {
         if (this.indeterminate) {
@@ -31,36 +25,13 @@ export class Toggle {
         this.checked = newChecked;
         this.checkedChange.emit(this.checked);
     }
-    componentWillLoad() {
-        this.updateFormInternalValue();
-    }
-    updateFormInternalValue() {
-        if (this.checked) {
-            this.formInternals.setFormValue(this.value);
-        }
-        else {
-            this.formInternals.setFormValue(null);
-        }
-    }
-    watchCheckedChange() {
-        this.updateFormInternalValue();
-    }
-    /** @internal */
-    hasValidValue() {
-        return Promise.resolve(this.checked);
-    }
-    /** @internal */
-    getAssociatedFormElement() {
-        return Promise.resolve(this.formInternals.form);
-    }
     render() {
-        return (h(Host, { key: '0afa08e1803352f2bb3360c11fcda2745531e20d', class: {
+        return (h(Host, { key: '46cf23f4ae6803763da9344dfd9374aa2e307e14', class: {
                 disabled: this.disabled,
-            }, onClick: () => this.onCheckedChange(!this.checked) }, h("input", { key: '37ba0cf086ed01c01e61ff0bb24367759b537cd7', disabled: this.disabled, indeterminate: this.indeterminate, checked: this.checked, role: "switch", tabindex: 0, type: "checkbox", "aria-checked": a11yBoolean(this.checked), onChange: (event) => this.onCheckedChange(event.target.checked) }), h("label", { key: '83d6712432de4b45396b11f7f21cf7072fd19fcd', class: "switch", tabIndex: -1 }, h("span", { key: 'f3f91c36a2043f039813b43bbc6285d67239d050', class: "slider" })), !this.hideText ? (h(Fragment, null, !this.indeterminate ? (h("span", { class: 'toggle-text', "aria-hidden": a11yBoolean(true) }, this.checked ? this.textOn : this.textOff)) : (h("span", { class: 'toggle-text', "aria-hidden": a11yBoolean(true) }, this.textIndeterminate)))) : null));
+            }, onClick: () => this.onCheckedChange(!this.checked) }, h("input", { key: '3e85c5ebee51ea769bce59bf215a050e8196cc02', disabled: this.disabled, indeterminate: this.indeterminate, checked: this.checked, role: "switch", tabindex: 0, type: "checkbox", "aria-checked": a11yBoolean(this.checked), onChange: (event) => this.onCheckedChange(event.target.checked) }), h("label", { key: 'd09e1342cbb63f4e5b0f18d2071260b47405eaa4', class: "switch", tabIndex: -1 }, h("span", { key: '94d1afb922bd8da6aa62dec9aa94bf350d507bc7', class: "slider" })), !this.hideText ? (h(Fragment, null, !this.indeterminate ? (h("span", { class: 'toggle-text', "aria-hidden": a11yBoolean(true) }, this.checked ? this.textOn : this.textOff)) : (h("span", { class: 'toggle-text', "aria-hidden": a11yBoolean(true) }, this.textIndeterminate)))) : null));
     }
     static get is() { return "ix-toggle"; }
     static get encapsulation() { return "shadow"; }
-    static get formAssociated() { return true; }
     static get originalStyleUrls() {
         return {
             "$": ["toggle.scss"]
@@ -73,41 +44,6 @@ export class Toggle {
     }
     static get properties() {
         return {
-            "name": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Name of the checkbox component"
-                },
-                "attribute": "name",
-                "reflect": true
-            },
-            "value": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Value of the checkbox component"
-                },
-                "attribute": "value",
-                "reflect": true,
-                "defaultValue": "'on'"
-            },
             "checked": {
                 "type": "boolean",
                 "mutable": true,
@@ -233,24 +169,6 @@ export class Toggle {
                 "attribute": "hide-text",
                 "reflect": false,
                 "defaultValue": "false"
-            },
-            "required": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Required state of the checkbox component.\n\nIf true, checkbox needs to be checked to be valid"
-                },
-                "attribute": "required",
-                "reflect": true,
-                "defaultValue": "false"
             }
         };
     }
@@ -270,81 +188,8 @@ export class Toggle {
                     "resolved": "boolean",
                     "references": {}
                 }
-            }, {
-                "method": "valueChange",
-                "name": "valueChange",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [{
-                            "name": "internal",
-                            "text": undefined
-                        }],
-                    "text": ""
-                },
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                }
             }];
     }
-    static get methods() {
-        return {
-            "hasValidValue": {
-                "complexType": {
-                    "signature": "() => Promise<boolean>",
-                    "parameters": [],
-                    "references": {
-                        "Promise": {
-                            "location": "global",
-                            "id": "global::Promise"
-                        }
-                    },
-                    "return": "Promise<boolean>"
-                },
-                "docs": {
-                    "text": "",
-                    "tags": [{
-                            "name": "internal",
-                            "text": undefined
-                        }]
-                }
-            },
-            "getAssociatedFormElement": {
-                "complexType": {
-                    "signature": "() => Promise<HTMLFormElement | null>",
-                    "parameters": [],
-                    "references": {
-                        "Promise": {
-                            "location": "global",
-                            "id": "global::Promise"
-                        },
-                        "HTMLFormElement": {
-                            "location": "global",
-                            "id": "global::HTMLFormElement"
-                        }
-                    },
-                    "return": "Promise<HTMLFormElement>"
-                },
-                "docs": {
-                    "text": "",
-                    "tags": [{
-                            "name": "internal",
-                            "text": undefined
-                        }]
-                }
-            }
-        };
-    }
     static get elementRef() { return "hostElement"; }
-    static get watchers() {
-        return [{
-                "propName": "checked",
-                "methodName": "watchCheckedChange"
-            }];
-    }
-    static get attachInternalsMemberName() { return "formInternals"; }
 }
 //# sourceMappingURL=toggle.js.map

package/dist/collection/components/toggle/toggle.js.map

@@ -1 +1 @@
-{"version":3,"file":"toggle.js","sourceRoot":"","sources":["../../../src/components/toggle/toggle.tsx"],"names":[],"mappings":"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","sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  AttachInternals,\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Fragment,\n  h,\n  Host,\n  Method,\n  Prop,\n  Watch,\n} from '@stencil/core';\nimport { a11yBoolean } from '../utils/a11y';\nimport { IxFormComponent } from '../utils/field';\n\n/**\n * @form-ready 2.4.0\n * */\n@Component({\n  tag: 'ix-toggle',\n  styleUrl: 'toggle.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class Toggle implements IxFormComponent<string> {\n  @AttachInternals() formInternals!: ElementInternals;\n\n  @Element() hostElement!: HTMLIxToggleElement;\n\n  /**\n   * Name of the checkbox component\n   */\n  @Prop({ reflect: true }) name?: string;\n\n  /**\n   * Value of the checkbox component\n   */\n  @Prop({ reflect: true }) value: string = 'on';\n\n  /**\n   * Whether the slide-toggle element is checked or not.\n   */\n  @Prop({ mutable: true, reflect: true }) checked = false;\n\n  /**\n   * Whether the slide-toggle element is disabled or not.\n   */\n  @Prop() disabled = false;\n\n  /**\n   * If true the control is in indeterminate state\n   */\n  @Prop({ mutable: true, reflect: true }) indeterminate = false;\n\n  /**\n   * Text for on state\n   */\n  @Prop() textOn = 'On';\n\n  /**\n   * Text for off state\n   */\n  @Prop() textOff = 'Off';\n\n  /**\n   * Text for indeterminate state\n   */\n  @Prop() textIndeterminate = 'Mixed';\n\n  /**\n   * Hide `on` and `off` text\n   */\n  @Prop() hideText = false;\n\n  /**\n   * Required state of the checkbox component.\n   *\n   * If true, checkbox needs to be checked to be valid\n   */\n  @Prop({ reflect: true }) required = false;\n\n  /**\n   * An event will be dispatched each time the slide-toggle changes its value.\n   */\n  @Event() checkedChange!: EventEmitter<boolean>;\n\n  /** @internal */\n  @Event() valueChange!: EventEmitter<string>;\n\n  onCheckedChange(newChecked: boolean) {\n    if (this.indeterminate) {\n      this.indeterminate = false;\n    }\n    this.checked = newChecked;\n    this.checkedChange.emit(this.checked);\n  }\n\n  componentWillLoad() {\n    this.updateFormInternalValue();\n  }\n\n  updateFormInternalValue(): void {\n    if (this.checked) {\n      this.formInternals.setFormValue(this.value);\n    } else {\n      this.formInternals.setFormValue(null);\n    }\n  }\n\n  @Watch('checked')\n  watchCheckedChange() {\n    this.updateFormInternalValue();\n  }\n\n  /** @internal */\n  @Method()\n  hasValidValue(): Promise<boolean> {\n    return Promise.resolve(this.checked);\n  }\n\n  /** @internal */\n  @Method()\n  getAssociatedFormElement(): Promise<HTMLFormElement | null> {\n    return Promise.resolve(this.formInternals.form);\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          disabled: this.disabled,\n        }}\n        onClick={() => this.onCheckedChange(!this.checked)}\n      >\n        <input\n          disabled={this.disabled}\n          indeterminate={this.indeterminate}\n          checked={this.checked}\n          role=\"switch\"\n          tabindex={0}\n          type=\"checkbox\"\n          aria-checked={a11yBoolean(this.checked)}\n          onChange={(event) =>\n            this.onCheckedChange((event.target as HTMLInputElement).checked)\n          }\n        ></input>\n        <label class=\"switch\" tabIndex={-1}>\n          <span class=\"slider\"></span>\n        </label>\n        {!this.hideText ? (\n          <Fragment>\n            {!this.indeterminate ? (\n              <span class={'toggle-text'} aria-hidden={a11yBoolean(true)}>\n                {this.checked ? this.textOn : this.textOff}\n              </span>\n            ) : (\n              <span class={'toggle-text'} aria-hidden={a11yBoolean(true)}>\n                {this.textIndeterminate}\n              </span>\n            )}\n          </Fragment>\n        ) : null}\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"toggle.js","sourceRoot":"","sources":["../../../src/components/toggle/toggle.tsx"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EACL,SAAS,EACT,OAAO,EACP,KAAK,EAEL,QAAQ,EACR,CAAC,EACD,IAAI,EACJ,IAAI,GACL,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAO5C,MAAM,OAAO,MAAM;;uBAMiC,KAAK;wBAKpC,KAAK;6BAKgC,KAAK;sBAK5C,IAAI;uBAKH,KAAK;iCAKK,OAAO;wBAKhB,KAAK;;IAOxB,eAAe,CAAC,UAAmB;QACjC,IAAI,IAAI,CAAC,aAAa,EAAE,CAAC;YACvB,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC;QAC7B,CAAC;QACD,IAAI,CAAC,OAAO,GAAG,UAAU,CAAC;QAC1B,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACxC,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDACH,KAAK,EAAE;gBACL,QAAQ,EAAE,IAAI,CAAC,QAAQ;aACxB,EACD,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC;YAElD,8DACE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,aAAa,EAAE,IAAI,CAAC,aAAa,EACjC,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,CAAC,EACX,IAAI,EAAC,UAAU,kBACD,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,EACvC,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE,CAClB,IAAI,CAAC,eAAe,CAAE,KAAK,CAAC,MAAc,CAAC,OAAO,CAAC,GAE9C;YACT,8DAAO,KAAK,EAAC,QAAQ,EAAC,QAAQ,EAAE,CAAC,CAAC;gBAChC,6DAAM,KAAK,EAAC,QAAQ,GAAQ,CACtB;YACP,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAChB,EAAC,QAAQ,QACN,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,CACrB,YAAM,KAAK,EAAE,aAAa,iBAAe,WAAW,CAAC,IAAI,CAAC,IACvD,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CACrC,CACR,CAAC,CAAC,CAAC,CACF,YAAM,KAAK,EAAE,aAAa,iBAAe,WAAW,CAAC,IAAI,CAAC,IACvD,IAAI,CAAC,iBAAiB,CAClB,CACR,CACQ,CACZ,CAAC,CAAC,CAAC,IAAI,CACH,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Fragment,\n  h,\n  Host,\n  Prop,\n} from '@stencil/core';\nimport { a11yBoolean } from '../utils/a11y';\n\n@Component({\n  tag: 'ix-toggle',\n  styleUrl: 'toggle.scss',\n  shadow: true,\n})\nexport class Toggle {\n  @Element() hostElement!: HTMLIxToggleElement;\n\n  /**\n   * Whether the slide-toggle element is checked or not.\n   */\n  @Prop({ mutable: true, reflect: true }) checked = false;\n\n  /**\n   * Whether the slide-toggle element is disabled or not.\n   */\n  @Prop() disabled = false;\n\n  /**\n   * If true the control is in indeterminate state\n   */\n  @Prop({ mutable: true, reflect: true }) indeterminate = false;\n\n  /**\n   * Text for on state\n   */\n  @Prop() textOn = 'On';\n\n  /**\n   * Text for off state\n   */\n  @Prop() textOff = 'Off';\n\n  /**\n   * Text for indeterminate state\n   */\n  @Prop() textIndeterminate = 'Mixed';\n\n  /**\n   * Hide `on` and `off` text\n   */\n  @Prop() hideText = false;\n\n  /**\n   * An event will be dispatched each time the slide-toggle changes its value.\n   */\n  @Event() checkedChange: EventEmitter<boolean>;\n\n  onCheckedChange(newChecked: boolean) {\n    if (this.indeterminate) {\n      this.indeterminate = false;\n    }\n    this.checked = newChecked;\n    this.checkedChange.emit(this.checked);\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          disabled: this.disabled,\n        }}\n        onClick={() => this.onCheckedChange(!this.checked)}\n      >\n        <input\n          disabled={this.disabled}\n          indeterminate={this.indeterminate}\n          checked={this.checked}\n          role=\"switch\"\n          tabindex={0}\n          type=\"checkbox\"\n          aria-checked={a11yBoolean(this.checked)}\n          onChange={(event) =>\n            this.onCheckedChange((event.target as any).checked)\n          }\n        ></input>\n        <label class=\"switch\" tabIndex={-1}>\n          <span class=\"slider\"></span>\n        </label>\n        {!this.hideText ? (\n          <Fragment>\n            {!this.indeterminate ? (\n              <span class={'toggle-text'} aria-hidden={a11yBoolean(true)}>\n                {this.checked ? this.textOn : this.textOff}\n              </span>\n            ) : (\n              <span class={'toggle-text'} aria-hidden={a11yBoolean(true)}>\n                {this.textIndeterminate}\n              </span>\n            )}\n          </Fragment>\n        ) : null}\n      </Host>\n    );\n  }\n}\n"]}

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

@@ -62,9 +62,9 @@ export class ToggleButton {
                 'aria-pressed': a11yBoolean(this.pressed),
             },
         };
-        return (h(Host, { key: '03308c568a28a0c4410fe3872b1a770995627183', class: {
+        return (h(Host, { key: 'bec8a150fd761e11ed81ae3803a8e62d6a250ec7', class: {
                 disabled: this.disabled || this.loading,
-            } }, h(BaseButton, Object.assign({ key: '849c02e51091538631c0a8019fdea2b9091861b6' }, baseButtonProps), h("slot", { key: '1f4c89e2ee5e540dc3f7caae1641853d466b61b4' }))));
+            } }, h(BaseButton, Object.assign({ key: 'b0e6ee7a113ea8d9b417b8de62cf816fb78b49ca' }, baseButtonProps), h("slot", { key: 'ce9fd3a28d4c7048d14618bd7813f4c84a4ac255' }))));
     }
     static get is() { return "ix-toggle-button"; }
     static get encapsulation() { return "shadow"; }

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

@@ -243,9 +243,9 @@ export class Tooltip {
         this.visible = false;
     }
     render() {
-        return (h(Host, { key: 'b7883bd4b3b91669a26ec141c0958d639a5fc365', class: {
+        return (h(Host, { key: '990726c5c0bfdbdb0d5d1678ec54b5902d41d1cd', class: {
                 visible: this.visible,
-            }, role: "tooltip" }, h("div", { key: '7fb4389e060ea8d471bf3e7527dd746ca3f3db76', class: 'tooltip-title' }, h("slot", { key: '7662951c4c88e1568fbc36b5b37a62d06e17a769', name: "title-icon" }), h("ix-typography", { key: '966e285db23cc9afe422ed13119568f538b8c82e', variant: "default-title" }, this.titleContent, h("slot", { key: 'e2a2b625877b2315f798f1b18a61d52f017c11a8', name: "title-content" }))), h("div", { key: '56c0c6a0b7cbc9f00e2b49c5ec3c49de1bda1de3', class: 'tooltip-content' }, h("slot", { key: 'be10f8350596f0420c530329ab30336bb99c654b' })), h("div", { key: '1abda75258f0c5d3a3c6c577a9f919e6a980b250', class: "arrow" })));
+            }, role: "tooltip" }, h("div", { key: 'ecab668bf3f4010329c611b3d44a8103080d185e', class: 'tooltip-title' }, h("slot", { key: '016c833df9a38916cbd805756c48098d491f5846', name: "title-icon" }), h("ix-typography", { key: 'fe0a3fe4e2c9735207e22befc6006700859df2fc', variant: "default-title" }, this.titleContent, h("slot", { key: '6fcb3c9a2534922477aeb8b833f4e806d4010b84', name: "title-content" }))), h("div", { key: 'fcc689886a4d9651b0f7f23fb71e7d738558fde7', class: 'tooltip-content' }, h("slot", { key: '610c6bc179044892c550fbfa71313a1d27ee917a' })), h("div", { key: 'faf7c2a5d6b6347bd5c4ce9de377680c1ad4f06c', class: "arrow" })));
     }
     static get is() { return "ix-tooltip"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/tree/tree.js

@@ -183,7 +183,7 @@ export class Tree {
         this.hyperlist = new Hyperlist(this.hostElement, config);
     }
     render() {
-        return (h(Host, { key: 'a64e17e0c6466065fe8de80715cbac794a6e7a95' }, h("slot", { key: 'a348c8357097c31e323d95033546d841f1986680' })));
+        return (h(Host, { key: 'c663df76252b24029b33792151c943519a7c3be1' }, h("slot", { key: 'cfd96717be68c7c4e4c0b9e344ecd4c48481e1e0' })));
     }
     static get is() { return "ix-tree"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/tree-item/tree-item.js

@@ -15,16 +15,16 @@ export class TreeItem {
     }
     render() {
         var _a, _b, _c;
-        return (h(Host, { key: '4facce4de72cf050f1ca5160c23d513a51619182', class: {
+        return (h(Host, { key: '5f5481c56072db6ae30c67a9c9ed8a709679d55b', class: {
                 selected: (_a = this.context) === null || _a === void 0 ? void 0 : _a.isSelected,
-            } }, h("div", { key: '6a5a090480876f134e2900b9ee04d529029b623b', class: "icon-toggle-container", onClick: (e) => {
+            } }, h("div", { key: '1d36c65d8c44ce04347888c1a43532717b9f7e54', class: "icon-toggle-container", onClick: (e) => {
                 e.preventDefault();
                 this.toggle.emit();
             } }, this.hasChildren ? (h("ix-icon", { name: 'chevron-right', size: "16", class: {
                 ['icon-toggle-down']: (_b = this.context) === null || _b === void 0 ? void 0 : _b.isExpanded,
-            }, color: `color-${((_c = this.context) === null || _c === void 0 ? void 0 : _c.isExpanded) ? 'primary' : 'std-text'}` })) : null), h("div", { key: 'b46d172c5cb6685270e9259b7a5d9d27a4fab5aa', class: "tree-node-container", onClick: () => {
+            }, color: `color-${((_c = this.context) === null || _c === void 0 ? void 0 : _c.isExpanded) ? 'primary' : 'std-text'}` })) : null), h("div", { key: '43f5718e1c18f5a755f01580692349195dbe2e7e', class: "tree-node-container", onClick: () => {
                 this.itemClick.emit();
-            } }, this.text, h("slot", { key: 'a766a38ebb4913509fe9dceb9e2079653eca9423' }))));
+            } }, this.text, h("slot", { key: '4f0556708349c484f97f3f687ab1f0974c4ef35e' }))));
     }
     static get is() { return "ix-tree-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/upload/upload.js

@@ -87,7 +87,7 @@ export class Upload {
         this.filesToUpload = obj;
     }
     render() {
-        return (h(Host, { key: '6578e437c8322cf20dbaa01ad7cce0085f840e37' }, h("div", { key: 'b45e0c890ab3a2d8eb3fe8e6c380d456414881d5', class: {
+        return (h(Host, { key: '65168929ba323f1a3eea30d4812d4da20f120fa4' }, h("div", { key: '9b6d1e303b8a117a329ce55fa54a05f7ecd59359', class: {
                 'file-upload-area': true,
                 'file-over': this.state !== UploadFileState.LOADING && this.isFileOver,
                 checking: this.state === UploadFileState.LOADING,
@@ -97,9 +97,9 @@ export class Upload {
                 if (this.state !== UploadFileState.LOADING) {
                     this.fileDropped(e);
                 }
-            }, onDragOver: (e) => this.fileOver(e), onDragLeave: () => this.fileLeave(), draggable: !this.disabled }, this.renderUploadState(), h("div", { key: '5104dd9de609f5c726444f1c60c69973e01d5202' }, h("input", { key: 'da71d0df9e3c11ef25d7826e0e266b37b21db5e9', multiple: this.multiple, type: "file", class: "upload-browser", id: "upload-browser", onChange: (e) => {
+            }, onDragOver: (e) => this.fileOver(e), onDragLeave: () => this.fileLeave(), draggable: !this.disabled }, this.renderUploadState(), h("div", { key: '069112fd233fb12c6cd6512ad7283015952caf0b' }, h("input", { key: '64bfed06cda8cae2f20ab441f4b3f0fe373de90f', multiple: this.multiple, type: "file", class: "upload-browser", id: "upload-browser", onChange: (e) => {
                 this.fileChangeEvent(e);
-            }, accept: this.accept }), h("ix-button", { key: '4ee1da0f8ce7066c8d36338327fc63a0d0c6eaa4', tabindex: "-1", outline: true, onClick: () => this.inputElement.click(), disabled: this.disabled || this.state === UploadFileState.LOADING }, this.i18nUploadFile)))));
+            }, accept: this.accept }), h("ix-button", { key: '99f054605ac4d39ad7a6e1258e0cc50302305157', tabindex: "-1", outline: true, onClick: () => this.inputElement.click(), disabled: this.disabled || this.state === UploadFileState.LOADING }, this.i18nUploadFile)))));
     }
     static get is() { return "ix-upload"; }
     static get encapsulation() { return "shadow"; }