npm - @siemens/ix - Versions diffs - 0.0.0-pr-2238-20251103105018 → 0.0.0-pr-2297-20251204163058 - Mend

@siemens/ix 0.0.0-pr-2238-20251103105018 → 0.0.0-pr-2297-20251204163058

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

Files changed (1009) hide show

package/dist/cjs/ix-toast.cjs.entry.js CHANGED Viewed

@@ -77,11 +77,11 @@ const Toast = class {
             animationPlayState: this.touched || this.paused ? 'paused' : 'running',
         };
         progressBarClass.push('toast-progress-bar--animated');
-        return (index.h(index.Host, { key: '899292380d8565664e1c7675d76327a11490d830', class: "animate__animated animate__fadeIn" }, index.h("div", { key: '5cd4377bdf58c1a2c0071ab31b28ad9655e44d0f', class: "toast-body", onPointerLeave: () => {
+        return (index.h(index.Host, { key: 'b006843e5552e82ed437b10ab31c5cdff7ec90a6', class: "animate__animated animate__fadeIn" }, index.h("div", { key: '8d4c07604138e38235b3a2f042ce8550966df392', class: "toast-body", onPointerLeave: () => {
                 this.touched = false;
             }, onPointerEnter: () => {
                 this.touched = true;
-            } }, this.type || this.icon ? (index.h("div", { class: "toast-icon" }, this.getIcon())) : null, index.h("div", { key: 'ef1403cbfb00f11515feae45dabfc5d4e0c13311', class: "toast-content" }, this.toastTitle ? (index.h("ix-typography", { class: "toast-title", format: "h5" }, this.toastTitle)) : null, index.h("div", { key: 'eb5d5bb4bab866b73a4b5607cd3e7b0b7c3e3da2', class: "toast-message" }, index.h("slot", { key: 'e03b7355c7dae971d87eba8fbc49495fa5876891' })), index.h("div", { key: '962de017d86b2a86919b41226dc2f5f37342488e', class: "toast-action" }, index.h("slot", { key: '172e62ff0d27ea9e3ab191e153e51eb35f442073', name: "action" }))), index.h("div", { key: 'cf14cce27542dab60676fb9d41ab60c061898c76', class: "toast-close" }, index.h("ix-icon-button", { key: 'b4212ca84b1564510360e6f160d57d03d41b2bfe', icon: index$1.iconClose, iconColor: "color-soft-text", size: "24", variant: "tertiary", onClick: () => this.closeToast.emit(), "aria-label": this.ariaLabelCloseIconButton }))), !this.preventAutoClose && (index.h("div", { key: '2b33706bda283c118e918b58fb7cb50720d0f1fb', class: progressBarClass.join(' '), style: progressBarStyle, onAnimationEnd: () => {
+            } }, this.type || this.icon ? (index.h("div", { class: "toast-icon" }, this.getIcon())) : null, index.h("div", { key: 'b5235db039ca12fa5a3823861f41e86fbf312661', class: "toast-content" }, this.toastTitle ? (index.h("ix-typography", { class: "toast-title", format: "h5" }, this.toastTitle)) : null, index.h("div", { key: '6577c06f5530655aafc974684aedbac7d48da649', class: "toast-message" }, index.h("slot", { key: '16675e05c803fe4ef8e246463f30c194e76a8428' })), index.h("div", { key: '84eeb321fc81b49d14468e7d517dd8cfc8769c8d', class: "toast-action" }, index.h("slot", { key: 'f55d9f57a23bf58006e1f3bc1d3e7fab85440dab', name: "action" }))), index.h("div", { key: 'd409d2622bce56496f6081cf55ab9ad1137dc222', class: "toast-close" }, index.h("ix-icon-button", { key: '873c0a73f6c5a9ae47cd39d63ff9c68dde219cbd', icon: index$1.iconClose, iconColor: "color-soft-text", size: "24", variant: "tertiary", onClick: () => this.closeToast.emit(), "aria-label": this.ariaLabelCloseIconButton }))), !this.preventAutoClose && (index.h("div", { key: '15a6b8556e7d22e9c9061a27e31b3138cb86380b', class: progressBarClass.join(' '), style: progressBarStyle, onAnimationEnd: () => {
                 this.close();
             }, onTransitionEnd: () => {
                 if (this.progress === 0) {

package/dist/cjs/ix-toggle.cjs.entry.js CHANGED Viewed

@@ -2,7 +2,7 @@
 var index = require('./index-C8Xo8L1k.js');
 var a11y = require('./a11y-B_6chCvu.js');
-var validation = require('./validation-CfL71_0d.js');
+var validation = require('./validation-DTmSqO2d.js');
 const toggleCss = ":host{display:inline-flex;flex-direction:row;position:relative;min-height:1.5rem;max-height:calc(100% - 0.5rem);margin-block-start:0.25rem;margin-block-end:0.25rem}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host{}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host{}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host{}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host{}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host input[type=checkbox]{display:none}:host .wrapper{display:flex;align-items:flex-start;width:100%;max-height:100%}:host .label{word-break:break-word;display:block;white-space:normal;overflow:hidden;margin-block-start:0.125rem;margin-inline-start:0.5rem;min-height:1rem}:host .switch{all:unset;position:relative;display:inline-block;width:3rem;min-width:3rem;max-width:3rem;height:1.5rem}:host .slider{position:absolute;top:0;left:0;right:0;bottom:0;background-color:var(--theme-switch-off--background);transition:var(--theme-default-time);border-radius:1.5rem;border:0.0625rem solid transparent}:host .slider:before{position:absolute;content:\"\";height:1.125rem;width:1.125rem;left:0.125rem;bottom:0.125rem;background-color:var(--theme-switch-thumb-off--background);transition:var(--theme-default-time);border-radius:50%;border:1px solid var(--theme-switch-thumb-off--border-color)}:host .switch.checked>.slider::before{background-color:var(--theme-switch-thumb-on--background);transform:translateX(1.5rem)}:host .switch>.slider{border-color:var(--theme-switch-off--border-color)}:host .switch:hover>.slider{background-color:var(--theme-switch-off--background--hover);border-color:var(--theme-switch-off--border-color--hover)}:host .switch:hover>.slider:before{background-color:var(--theme-switch-thumb-off--background--hover);border:1px solid var(--theme-switch-thumb-off--border-color--hover)}:host .switch:active>.slider{background-color:var(--theme-switch-off--background--active);border-color:var(--theme-switch-off--border-color--active)}:host .switch:active>.slider:before{background-color:var(--theme-switch-thumb-off--background--active);border:1px solid var(--theme-switch-thumb-off--border-color--active)}:host .switch.checked>.slider{background-color:var(--theme-switch-on--background);border-color:var(--theme-switch-on--border-color)}:host .switch.checked>.slider:before{border:1px solid var(--theme-switch-thumb-on--border-color)}:host .switch.checked:hover>.slider{background-color:var(--theme-switch-on--background--hover);border-color:var(--theme-switch-on--border-color--hover)}:host .switch.checked:hover>.slider:before{background-color:var(--theme-switch-thumb-on--background--hover);border:1px solid var(--theme-switch-thumb-on--border-color--hover)}:host .switch.checked:active>.slider{background-color:var(--theme-switch-on--background--active);border-color:var(--theme-switch-on--border-color--active)}:host .switch.checked:active>.slider:before{background-color:var(--theme-switch-thumb-on--background--active);border:1px solid var(--theme-switch-thumb-on--border-color--active)}:host .switch.indeterminate>.slider::before{transform:translateX(0.75rem)}:host(:not(.disabled)) .wrapper{cursor:pointer}:host(:not(.disabled)) .switch:focus-visible>.slider{outline:0.0625rem solid var(--theme-color-focus-bdr);outline-offset:0.0625rem}:host(.disabled){pointer-events:none}:host(.disabled) .switch{opacity:0.5}:host(.disabled) .switch>.slider{background-color:var(--theme-switch-off--background--disabled)}:host(.disabled) .switch>.slider:before{background-color:var(--theme-switch-thumb-off--background--disabled)}:host(.disabled) .switch.checked>.slider{background-color:var(--theme-switch-on--background--disabled)}:host(.disabled) .switch.checked>.slider:before{background-color:var(--theme-switch-thumb-on--background--disabled)}:host(.disabled) .label{color:var(--theme-color-weak-text)}:host(.ix-valid:not(.disabled)) .slider{--theme-switch-off--background:var(\n    --theme-switch-off--background--valid\n  );--theme-switch-off--background--hover:var(\n    --theme-switch-off--background--valid--hover\n  );--theme-switch-off--background--active:var(\n    --theme-switch-off--background--valid--active\n  );--theme-switch-thumb-off--border-color:var(\n    --theme-switch-thumb-off--border-color--valid\n  );--theme-switch-thumb-off--border-color--hover:var(\n    --theme-switch-thumb-off--border-color--valid--hover\n  );--theme-switch-thumb-off--border-color--active:var(\n    --theme-switch-thumb-off--border-color--valid--active\n  );--theme-switch-thumb-off--background:var(\n    --theme-switch-thumb-off--background--valid\n  );--theme-switch-thumb-off--background--hover:var(\n    --theme-switch-thumb-off--background--valid--hover\n  );--theme-switch-thumb-off--background--active:var(\n    --theme-switch-thumb-off--background--valid--active\n  );--theme-switch-off--border-color:var(\n    --theme-switch-off--border-color--valid\n  );--theme-switch-off--border-color--hover:var(\n    --theme-switch-off--border-color--valid--hover\n  );--theme-switch-off--border-color--active:var(\n    --theme-switch-off--border-color--valid--active\n  );--theme-switch-on--background:var(\n    --theme-switch-on--background--valid\n  );--theme-switch-on--background--hover:var(\n    --theme-switch-on--background--valid--hover\n  );--theme-switch-on--background--active:var(\n    --theme-switch-on--background--valid--active\n  );--theme-switch-thumb-on--border-color:var(\n    --theme-switch-thumb-on--border-color--valid\n  );--theme-switch-thumb-on--border-color--hover:var(\n    --theme-switch-thumb-on--border-color--valid--hover\n  );--theme-switch-thumb-on--border-color--active:var(\n    --theme-switch-thumb-on--border-color--valid--active\n  );--theme-switch-thumb-on--background:var(\n    --theme-switch-thumb-on--background--valid\n  );--theme-switch-thumb-on--background--hover:var(\n    --theme-switch-thumb-on--background--valid--hover\n  );--theme-switch-thumb-on--background--active:var(\n    --theme-switch-thumb-on--background--valid--active\n  );--theme-switch-on--border-color:var(\n    --theme-switch-on--border-color--valid\n  );--theme-switch-on--border-color--hover:var(\n    --theme-switch-on--border-color--valid--hover\n  );--theme-switch-on--border-color--active:var(\n    --theme-switch-on--border-color--valid--active\n  );--theme-switch-mixed--background:var(\n    --theme-switch-mixed--background--valid\n  );--theme-switch-mixed--background--hover:var(\n    --theme-switch-mixed--background--valid--hover\n  );--theme-switch-mixed--background--active:var(\n    --theme-switch-mixed--background--valid--active\n  );--theme-switch-thumb-mixed--border-color:var(\n    --theme-switch-thumb-mixed--border-color--valid\n  );--theme-switch-thumb-mixed--border-color--hover:var(\n    --theme-switch-thumb-mixed--border-color--valid--hover\n  );--theme-switch-thumb-mixed--border-color--active:var(\n    --theme-switch-thumb-mixed--border-color--valid--active\n  );--theme-switch-thumb-mixed--background:var(\n    --theme-switch-thumb-mixed--background--valid\n  );--theme-switch-thumb-mixed--background--hover:var(\n    --theme-switch-thumb-mixed--background--valid--hover\n  );--theme-switch-thumb-mixed--background--active:var(\n    --theme-switch-thumb-mixed--background--valid--active\n  );--theme-switch-mixed--border-color:var(\n    --theme-switch-mixed--border-color--valid\n  );--theme-switch-mixed--border-color--hover:var(\n    --theme-switch-mixed--border-color--valid--hover\n  );--theme-switch-mixed--border-color--active:var(\n    --theme-switch-mixed--border-color--valid--active\n  )}:host(.ix-info:not(.disabled)) .slider{--theme-switch-off--background:var(\n    --theme-switch-off--background--info\n  );--theme-switch-off--background--hover:var(\n    --theme-switch-off--background--info--hover\n  );--theme-switch-off--background--active:var(\n    --theme-switch-off--background--info--active\n  );--theme-switch-thumb-off--border-color:var(\n    --theme-switch-thumb-off--border-color--info\n  );--theme-switch-thumb-off--border-color--hover:var(\n    --theme-switch-thumb-off--border-color--info--hover\n  );--theme-switch-thumb-off--border-color--active:var(\n    --theme-switch-thumb-off--border-color--info--active\n  );--theme-switch-thumb-off--background:var(\n    --theme-switch-thumb-off--background--info\n  );--theme-switch-thumb-off--background--hover:var(\n    --theme-switch-thumb-off--background--info--hover\n  );--theme-switch-thumb-off--background--active:var(\n    --theme-switch-thumb-off--background--info--active\n  );--theme-switch-off--border-color:var(\n    --theme-switch-off--border-color--info\n  );--theme-switch-off--border-color--hover:var(\n    --theme-switch-off--border-color--info--hover\n  );--theme-switch-off--border-color--active:var(\n    --theme-switch-off--border-color--info--active\n  );--theme-switch-on--background:var(\n    --theme-switch-on--background--info\n  );--theme-switch-on--background--hover:var(\n    --theme-switch-on--background--info--hover\n  );--theme-switch-on--background--active:var(\n    --theme-switch-on--background--info--active\n  );--theme-switch-thumb-on--border-color:var(\n    --theme-switch-thumb-on--border-color--info\n  );--theme-switch-thumb-on--border-color--hover:var(\n    --theme-switch-thumb-on--border-color--info--hover\n  );--theme-switch-thumb-on--border-color--active:var(\n    --theme-switch-thumb-on--border-color--info--active\n  );--theme-switch-thumb-on--background:var(\n    --theme-switch-thumb-on--background--info\n  );--theme-switch-thumb-on--background--hover:var(\n    --theme-switch-thumb-on--background--info--hover\n  );--theme-switch-thumb-on--background--active:var(\n    --theme-switch-thumb-on--background--info--active\n  );--theme-switch-on--border-color:var(\n    --theme-switch-on--border-color--info\n  );--theme-switch-on--border-color--hover:var(\n    --theme-switch-on--border-color--info--hover\n  );--theme-switch-on--border-color--active:var(\n    --theme-switch-on--border-color--info--active\n  );--theme-switch-mixed--background:var(\n    --theme-switch-mixed--background--info\n  );--theme-switch-mixed--background--hover:var(\n    --theme-switch-mixed--background--info--hover\n  );--theme-switch-mixed--background--active:var(\n    --theme-switch-mixed--background--info--active\n  );--theme-switch-thumb-mixed--border-color:var(\n    --theme-switch-thumb-mixed--border-color--info\n  );--theme-switch-thumb-mixed--border-color--hover:var(\n    --theme-switch-thumb-mixed--border-color--info--hover\n  );--theme-switch-thumb-mixed--border-color--active:var(\n    --theme-switch-thumb-mixed--border-color--info--active\n  );--theme-switch-thumb-mixed--background:var(\n    --theme-switch-thumb-mixed--background--info\n  );--theme-switch-thumb-mixed--background--hover:var(\n    --theme-switch-thumb-mixed--background--info--hover\n  );--theme-switch-thumb-mixed--background--active:var(\n    --theme-switch-thumb-mixed--background--info--active\n  );--theme-switch-mixed--border-color:var(\n    --theme-switch-mixed--border-color--info\n  );--theme-switch-mixed--border-color--hover:var(\n    --theme-switch-mixed--border-color--info--hover\n  );--theme-switch-mixed--border-color--active:var(\n    --theme-switch-mixed--border-color--info--active\n  )}:host(.ix-warning:not(.disabled)) .slider{--theme-switch-off--background:var(\n    --theme-switch-off--background--warning\n  );--theme-switch-off--background--hover:var(\n    --theme-switch-off--background--warning--hover\n  );--theme-switch-off--background--active:var(\n    --theme-switch-off--background--warning--active\n  );--theme-switch-thumb-off--border-color:var(\n    --theme-switch-thumb-off--border-color--warning\n  );--theme-switch-thumb-off--border-color--hover:var(\n    --theme-switch-thumb-off--border-color--warning--hover\n  );--theme-switch-thumb-off--border-color--active:var(\n    --theme-switch-thumb-off--border-color--warning--active\n  );--theme-switch-thumb-off--background:var(\n    --theme-switch-thumb-off--background--warning\n  );--theme-switch-thumb-off--background--hover:var(\n    --theme-switch-thumb-off--background--warning--hover\n  );--theme-switch-thumb-off--background--active:var(\n    --theme-switch-thumb-off--background--warning--active\n  );--theme-switch-off--border-color:var(\n    --theme-switch-off--border-color--warning\n  );--theme-switch-off--border-color--hover:var(\n    --theme-switch-off--border-color--warning--hover\n  );--theme-switch-off--border-color--active:var(\n    --theme-switch-off--border-color--warning--active\n  );--theme-switch-on--background:var(\n    --theme-switch-on--background--warning\n  );--theme-switch-on--background--hover:var(\n    --theme-switch-on--background--warning--hover\n  );--theme-switch-on--background--active:var(\n    --theme-switch-on--background--warning--active\n  );--theme-switch-thumb-on--border-color:var(\n    --theme-switch-thumb-on--border-color--warning\n  );--theme-switch-thumb-on--border-color--hover:var(\n    --theme-switch-thumb-on--border-color--warning--hover\n  );--theme-switch-thumb-on--border-color--active:var(\n    --theme-switch-thumb-on--border-color--warning--active\n  );--theme-switch-thumb-on--background:var(\n    --theme-switch-thumb-on--background--warning\n  );--theme-switch-thumb-on--background--hover:var(\n    --theme-switch-thumb-on--background--warning--hover\n  );--theme-switch-thumb-on--background--active:var(\n    --theme-switch-thumb-on--background--warning--active\n  );--theme-switch-on--border-color:var(\n    --theme-switch-on--border-color--warning\n  );--theme-switch-on--border-color--hover:var(\n    --theme-switch-on--border-color--warning--hover\n  );--theme-switch-on--border-color--active:var(\n    --theme-switch-on--border-color--warning--active\n  );--theme-switch-mixed--background:var(\n    --theme-switch-mixed--background--warning\n  );--theme-switch-mixed--background--hover:var(\n    --theme-switch-mixed--background--warning--hover\n  );--theme-switch-mixed--background--active:var(\n    --theme-switch-mixed--background--warning--active\n  );--theme-switch-thumb-mixed--border-color:var(\n    --theme-switch-thumb-mixed--border-color--warning\n  );--theme-switch-thumb-mixed--border-color--hover:var(\n    --theme-switch-thumb-mixed--border-color--warning--hover\n  );--theme-switch-thumb-mixed--border-color--active:var(\n    --theme-switch-thumb-mixed--border-color--warning--active\n  );--theme-switch-thumb-mixed--background:var(\n    --theme-switch-thumb-mixed--background--warning\n  );--theme-switch-thumb-mixed--background--hover:var(\n    --theme-switch-thumb-mixed--background--warning--hover\n  );--theme-switch-thumb-mixed--background--active:var(\n    --theme-switch-thumb-mixed--background--warning--active\n  );--theme-switch-mixed--border-color:var(\n    --theme-switch-mixed--border-color--warning\n  );--theme-switch-mixed--border-color--hover:var(\n    --theme-switch-mixed--border-color--warning--hover\n  );--theme-switch-mixed--border-color--active:var(\n    --theme-switch-mixed--border-color--warning--active\n  )}:host(.ix-invalid--required:not(.disabled)) .slider{--theme-switch-off--background:var(\n    --theme-switch-off--background--invalid\n  );--theme-switch-off--background--hover:var(\n    --theme-switch-off--background--invalid--hover\n  );--theme-switch-off--background--active:var(\n    --theme-switch-off--background--invalid--active\n  );--theme-switch-thumb-off--border-color:var(\n    --theme-switch-thumb-off--border-color--invalid\n  );--theme-switch-thumb-off--border-color--hover:var(\n    --theme-switch-thumb-off--border-color--invalid--hover\n  );--theme-switch-thumb-off--border-color--active:var(\n    --theme-switch-thumb-off--border-color--invalid--active\n  );--theme-switch-thumb-off--background:var(\n    --theme-switch-thumb-off--background--invalid\n  );--theme-switch-thumb-off--background--hover:var(\n    --theme-switch-thumb-off--background--invalid--hover\n  );--theme-switch-thumb-off--background--active:var(\n    --theme-switch-thumb-off--background--invalid--active\n  );--theme-switch-off--border-color:var(\n    --theme-switch-off--border-color--invalid\n  );--theme-switch-off--border-color--hover:var(\n    --theme-switch-off--border-color--invalid--hover\n  );--theme-switch-off--border-color--active:var(\n    --theme-switch-off--border-color--invalid--active\n  );--theme-switch-on--background:var(\n    --theme-switch-on--background--invalid\n  );--theme-switch-on--background--hover:var(\n    --theme-switch-on--background--invalid--hover\n  );--theme-switch-on--background--active:var(\n    --theme-switch-on--background--invalid--active\n  );--theme-switch-thumb-on--border-color:var(\n    --theme-switch-thumb-on--border-color--invalid\n  );--theme-switch-thumb-on--border-color--hover:var(\n    --theme-switch-thumb-on--border-color--invalid--hover\n  );--theme-switch-thumb-on--border-color--active:var(\n    --theme-switch-thumb-on--border-color--invalid--active\n  );--theme-switch-thumb-on--background:var(\n    --theme-switch-thumb-on--background--invalid\n  );--theme-switch-thumb-on--background--hover:var(\n    --theme-switch-thumb-on--background--invalid--hover\n  );--theme-switch-thumb-on--background--active:var(\n    --theme-switch-thumb-on--background--invalid--active\n  );--theme-switch-on--border-color:var(\n    --theme-switch-on--border-color--invalid\n  );--theme-switch-on--border-color--hover:var(\n    --theme-switch-on--border-color--invalid--hover\n  );--theme-switch-on--border-color--active:var(\n    --theme-switch-on--border-color--invalid--active\n  );--theme-switch-mixed--background:var(\n    --theme-switch-mixed--background--invalid\n  );--theme-switch-mixed--background--hover:var(\n    --theme-switch-mixed--background--invalid--hover\n  );--theme-switch-mixed--background--active:var(\n    --theme-switch-mixed--background--invalid--active\n  );--theme-switch-thumb-mixed--border-color:var(\n    --theme-switch-thumb-mixed--border-color--invalid\n  );--theme-switch-thumb-mixed--border-color--hover:var(\n    --theme-switch-thumb-mixed--border-color--invalid--hover\n  );--theme-switch-thumb-mixed--border-color--active:var(\n    --theme-switch-thumb-mixed--border-color--invalid--active\n  );--theme-switch-thumb-mixed--background:var(\n    --theme-switch-thumb-mixed--background--invalid\n  );--theme-switch-thumb-mixed--background--hover:var(\n    --theme-switch-thumb-mixed--background--invalid--hover\n  );--theme-switch-thumb-mixed--background--active:var(\n    --theme-switch-thumb-mixed--background--invalid--active\n  );--theme-switch-mixed--border-color:var(\n    --theme-switch-mixed--border-color--invalid\n  );--theme-switch-mixed--border-color--hover:var(\n    --theme-switch-mixed--border-color--invalid--hover\n  );--theme-switch-mixed--border-color--active:var(\n    --theme-switch-mixed--border-color--invalid--active\n  )}:host(.ix-invalid:not(.disabled)) .slider{--theme-switch-off--background:var(\n    --theme-switch-off--background--invalid\n  );--theme-switch-off--background--hover:var(\n    --theme-switch-off--background--invalid--hover\n  );--theme-switch-off--background--active:var(\n    --theme-switch-off--background--invalid--active\n  );--theme-switch-thumb-off--border-color:var(\n    --theme-switch-thumb-off--border-color--invalid\n  );--theme-switch-thumb-off--border-color--hover:var(\n    --theme-switch-thumb-off--border-color--invalid--hover\n  );--theme-switch-thumb-off--border-color--active:var(\n    --theme-switch-thumb-off--border-color--invalid--active\n  );--theme-switch-thumb-off--background:var(\n    --theme-switch-thumb-off--background--invalid\n  );--theme-switch-thumb-off--background--hover:var(\n    --theme-switch-thumb-off--background--invalid--hover\n  );--theme-switch-thumb-off--background--active:var(\n    --theme-switch-thumb-off--background--invalid--active\n  );--theme-switch-off--border-color:var(\n    --theme-switch-off--border-color--invalid\n  );--theme-switch-off--border-color--hover:var(\n    --theme-switch-off--border-color--invalid--hover\n  );--theme-switch-off--border-color--active:var(\n    --theme-switch-off--border-color--invalid--active\n  );--theme-switch-on--background:var(\n    --theme-switch-on--background--invalid\n  );--theme-switch-on--background--hover:var(\n    --theme-switch-on--background--invalid--hover\n  );--theme-switch-on--background--active:var(\n    --theme-switch-on--background--invalid--active\n  );--theme-switch-thumb-on--border-color:var(\n    --theme-switch-thumb-on--border-color--invalid\n  );--theme-switch-thumb-on--border-color--hover:var(\n    --theme-switch-thumb-on--border-color--invalid--hover\n  );--theme-switch-thumb-on--border-color--active:var(\n    --theme-switch-thumb-on--border-color--invalid--active\n  );--theme-switch-thumb-on--background:var(\n    --theme-switch-thumb-on--background--invalid\n  );--theme-switch-thumb-on--background--hover:var(\n    --theme-switch-thumb-on--background--invalid--hover\n  );--theme-switch-thumb-on--background--active:var(\n    --theme-switch-thumb-on--background--invalid--active\n  );--theme-switch-on--border-color:var(\n    --theme-switch-on--border-color--invalid\n  );--theme-switch-on--border-color--hover:var(\n    --theme-switch-on--border-color--invalid--hover\n  );--theme-switch-on--border-color--active:var(\n    --theme-switch-on--border-color--invalid--active\n  );--theme-switch-mixed--background:var(\n    --theme-switch-mixed--background--invalid\n  );--theme-switch-mixed--background--hover:var(\n    --theme-switch-mixed--background--invalid--hover\n  );--theme-switch-mixed--background--active:var(\n    --theme-switch-mixed--background--invalid--active\n  );--theme-switch-thumb-mixed--border-color:var(\n    --theme-switch-thumb-mixed--border-color--invalid\n  );--theme-switch-thumb-mixed--border-color--hover:var(\n    --theme-switch-thumb-mixed--border-color--invalid--hover\n  );--theme-switch-thumb-mixed--border-color--active:var(\n    --theme-switch-thumb-mixed--border-color--invalid--active\n  );--theme-switch-thumb-mixed--background:var(\n    --theme-switch-thumb-mixed--background--invalid\n  );--theme-switch-thumb-mixed--background--hover:var(\n    --theme-switch-thumb-mixed--background--invalid--hover\n  );--theme-switch-thumb-mixed--background--active:var(\n    --theme-switch-thumb-mixed--background--invalid--active\n  );--theme-switch-mixed--border-color:var(\n    --theme-switch-mixed--border-color--invalid\n  );--theme-switch-mixed--border-color--hover:var(\n    --theme-switch-mixed--border-color--invalid--hover\n  );--theme-switch-mixed--border-color--active:var(\n    --theme-switch-mixed--border-color--invalid--active\n  )}";
@@ -131,13 +131,13 @@ const Toggle = class {
         if (this.indeterminate) {
             toggleText = this.textIndeterminate;
         }
-        return (index.h(index.Host, { key: 'cbc551d0aaaf8b93abf00eae8447b7ba910ee15c', class: {
+        return (index.h(index.Host, { key: '990e3533b6e155d261dcdcf3dd7e06e0dceb8072', role: "switch", "aria-checked": a11y.a11yBoolean(this.checked), "aria-disabled": a11y.a11yBoolean(this.disabled), class: {
                 disabled: this.disabled,
-            }, onBlur: () => this.ixBlur.emit(), onFocus: () => (this.touched = true) }, index.h("label", { key: '9f07f9606f6f81abdd87d2198d32eec1dbc87fb1', class: "wrapper" }, index.h("button", { key: 'b2826894662f716e132cc86e5daaf15816c319e4', role: "switch", "aria-checked": a11y.a11yBoolean(this.checked), class: {
+            }, onBlur: () => this.ixBlur.emit(), onFocus: () => (this.touched = true) }, index.h("label", { key: '568b91b6c2ad362dc753518f97ca98b2c45a4130', class: "wrapper" }, index.h("button", { key: 'dcbe522c2ccc95354cb982892eff554db86b4e8f', class: {
                 switch: true,
                 checked: this.checked,
                 indeterminate: this.indeterminate,
-            }, onClick: () => this.onCheckedChange(!this.checked) }, index.h("div", { key: '8cc16350102428ae1f2b8937eda731d5a8e48c4c', class: "slider" })), index.h("input", { key: '7c20a5235eca12a03a84082735249bf1e649adae', type: "checkbox", disabled: this.disabled, indeterminate: this.indeterminate, checked: this.checked, tabindex: 0, "aria-hidden": a11y.a11yBoolean(true), "aria-checked": a11y.a11yBoolean(this.checked), onChange: (event) => this.onCheckedChange(event.target.checked) }), !this.hideText && (index.h("ix-typography", { key: '701732f68894cef4ff6a340be21a841862e321b4', class: "label" }, toggleText)))));
+            }, onClick: () => this.onCheckedChange(!this.checked), tabindex: -1, "aria-hidden": "true" }, index.h("div", { key: 'd281b839212a95e47b977bc46f052f7e6ca927c9', class: "slider" })), index.h("input", { key: '8169a27e13433034a97c97ca99507237332abb30', type: "checkbox", disabled: this.disabled, indeterminate: this.indeterminate, checked: this.checked, tabindex: 0, "aria-hidden": a11y.a11yBoolean(true), "aria-checked": a11y.a11yBoolean(this.checked), onChange: (event) => this.onCheckedChange(event.target.checked) }), !this.hideText && (index.h("ix-typography", { key: '7bc9b1f72447ff21057cdef3eb77a4ebd7a45ae7', class: "label" }, toggleText)))));
     }
     static get formAssociated() { return true; }
     get hostElement() { return index.getElement(this); }

package/dist/cjs/ix-toggle.entry.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ix-toggle.entry.cjs.js","sources":["src/components/toggle/toggle.scss?tag=ix-toggle&encapsulation=shadow","src/components/toggle/toggle.tsx"],"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@use 'mixins/hover';\n@use 'mixins/shadow-dom/component';\n\n:host {\n display: inline-flex;\n flex-direction: row;\n position: relative;\n min-height: 1.5rem;\n max-height: calc(100% - 0.5rem);\n margin-block-start: 0.25rem;\n margin-block-end: 0.25rem;\n\n @include component.ix-component;\n\n input[type='checkbox'] {\n display: none;\n }\n\n .wrapper {\n display: flex;\n align-items: flex-start;\n width: 100%;\n max-height: 100%;\n }\n\n .label {\n word-break: break-word;\n display: block;\n white-space: normal;\n overflow: hidden;\n margin-block-start: 0.125rem;\n margin-inline-start: 0.5rem;\n min-height: 1rem;\n }\n\n .switch {\n all: unset;\n position: relative;\n display: inline-block;\n width: 3rem;\n min-width: 3rem;\n max-width: 3rem;\n height: 1.5rem;\n }\n\n .slider {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background-color: var(--theme-switch-off--background);\n transition: var(--theme-default-time);\n border-radius: 1.5rem;\n border: 0.0625rem solid transparent;\n }\n\n .slider:before {\n position: absolute;\n content: '';\n height: 1.125rem;\n width: 1.125rem;\n left: 0.125rem;\n bottom: 0.125rem;\n background-color: var(--theme-switch-thumb-off--background);\n transition: var(--theme-default-time);\n border-radius: 50%;\n border: 1px solid var(--theme-switch-thumb-off--border-color);\n }\n\n .switch.checked > .slider::before {\n background-color: var(--theme-switch-thumb-on--background);\n transform: translateX(1.5rem);\n }\n\n .switch > .slider {\n border-color: var(--theme-switch-off--border-color);\n }\n\n .switch:hover > .slider {\n background-color: var(--theme-switch-off--background--hover);\n border-color: var(--theme-switch-off--border-color--hover);\n }\n\n .switch:hover > .slider:before {\n background-color: var(--theme-switch-thumb-off--background--hover);\n border: 1px solid var(--theme-switch-thumb-off--border-color--hover);\n }\n\n .switch:active > .slider {\n background-color: var(--theme-switch-off--background--active);\n border-color: var(--theme-switch-off--border-color--active);\n }\n\n .switch:active > .slider:before {\n background-color: var(--theme-switch-thumb-off--background--active);\n border: 1px solid var(--theme-switch-thumb-off--border-color--active);\n }\n\n .switch.checked > .slider {\n background-color: var(--theme-switch-on--background);\n border-color: var(--theme-switch-on--border-color);\n }\n\n .switch.checked > .slider:before {\n border: 1px solid var(--theme-switch-thumb-on--border-color);\n }\n\n .switch.checked:hover > .slider {\n background-color: var(--theme-switch-on--background--hover);\n border-color: var(--theme-switch-on--border-color--hover);\n }\n\n .switch.checked:hover > .slider:before {\n background-color: var(--theme-switch-thumb-on--background--hover);\n border: 1px solid var(--theme-switch-thumb-on--border-color--hover);\n }\n\n .switch.checked:active > .slider {\n background-color: var(--theme-switch-on--background--active);\n border-color: var(--theme-switch-on--border-color--active);\n }\n\n .switch.checked:active > .slider:before {\n background-color: var(--theme-switch-thumb-on--background--active);\n border: 1px solid var(--theme-switch-thumb-on--border-color--active);\n }\n\n .switch.indeterminate > .slider::before {\n transform: translateX(0.75rem);\n }\n}\n\n:host(:not(.disabled)) {\n .wrapper {\n cursor: pointer;\n }\n\n .switch:focus-visible > .slider {\n outline: 0.0625rem solid var(--theme-color-focus-bdr);\n outline-offset: 0.0625rem;\n }\n}\n\n:host(.disabled) {\n pointer-events: none;\n\n .switch {\n opacity: 0.5;\n }\n\n .switch > .slider {\n background-color: var(--theme-switch-off--background--disabled);\n }\n\n .switch > .slider:before {\n background-color: var(--theme-switch-thumb-off--background--disabled);\n }\n\n .switch.checked > .slider {\n background-color: var(--theme-switch-on--background--disabled);\n }\n\n .switch.checked > .slider:before {\n background-color: var(--theme-switch-thumb-on--background--disabled);\n }\n\n .label {\n color: var(--theme-color-weak-text);\n }\n}\n\n@mixin toggle-variant($selector) {\n :host(#{$selector}:not(.disabled)) {\n .slider {\n @content;\n }\n }\n}\n\n@mixin define-toggle-vars($state, $type) {\n --theme-switch-#{$state}--background: var(\n --theme-switch-#{$state}--background--#{$type}\n );\n --theme-switch-#{$state}--background--hover: var(\n --theme-switch-#{$state}--background--#{$type}--hover\n );\n --theme-switch-#{$state}--background--active: var(\n --theme-switch-#{$state}--background--#{$type}--active\n );\n\n --theme-switch-thumb-#{$state}--border-color: var(\n --theme-switch-thumb-#{$state}--border-color--#{$type}\n );\n --theme-switch-thumb-#{$state}--border-color--hover: var(\n --theme-switch-thumb-#{$state}--border-color--#{$type}--hover\n );\n --theme-switch-thumb-#{$state}--border-color--active: var(\n --theme-switch-thumb-#{$state}--border-color--#{$type}--active\n );\n\n --theme-switch-thumb-#{$state}--background: var(\n --theme-switch-thumb-#{$state}--background--#{$type}\n );\n --theme-switch-thumb-#{$state}--background--hover: var(\n --theme-switch-thumb-#{$state}--background--#{$type}--hover\n );\n --theme-switch-thumb-#{$state}--background--active: var(\n --theme-switch-thumb-#{$state}--background--#{$type}--active\n );\n\n --theme-switch-#{$state}--border-color: var(\n --theme-switch-#{$state}--border-color--#{$type}\n );\n --theme-switch-#{$state}--border-color--hover: var(\n --theme-switch-#{$state}--border-color--#{$type}--hover\n );\n --theme-switch-#{$state}--border-color--active: var(\n --theme-switch-#{$state}--border-color--#{$type}--active\n );\n}\n\n@include toggle-variant($selector: '.ix-valid') {\n @include define-toggle-vars('off', 'valid');\n @include define-toggle-vars('on', 'valid');\n @include define-toggle-vars('mixed', 'valid');\n}\n\n@include toggle-variant($selector: '.ix-info') {\n @include define-toggle-vars('off', 'info');\n @include define-toggle-vars('on', 'info');\n @include define-toggle-vars('mixed', 'info');\n}\n\n@include toggle-variant($selector: '.ix-warning') {\n @include define-toggle-vars('off', 'warning');\n @include define-toggle-vars('on', 'warning');\n @include define-toggle-vars('mixed', 'warning');\n}\n\n@include toggle-variant($selector: '.ix-invalid--required') {\n @include define-toggle-vars('off', 'invalid');\n @include define-toggle-vars('on', 'invalid');\n @include define-toggle-vars('mixed', 'invalid');\n}\n\n@include toggle-variant($selector: '.ix-invalid') {\n @include define-toggle-vars('off', 'invalid');\n @include define-toggle-vars('on', 'invalid');\n @include define-toggle-vars('mixed', 'invalid');\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 /\n\nimport {\n AttachInternals,\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Method,\n Prop,\n Watch,\n} from '@stencil/core';\nimport { a11yBoolean } from '../utils/a11y';\nimport { IxFormComponent, HookValidationLifecycle } from '../utils/input';\n\n/\n @form-ready\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 /\n An event will be dispatched each time the toggle is blurred.\n /\n @Event() ixBlur!: EventEmitter<void>;\n\n private touched = false;\n\n onCheckedChange(newChecked: boolean) {\n if (this.disabled) {\n return;\n }\n\n const wasIndeterminate = this.indeterminate;\n const oldChecked = this.checked;\n\n if (this.indeterminate) {\n this.indeterminate = false;\n }\n\n this.checked = newChecked;\n\n const { defaultPrevented } = this.checkedChange.emit(this.checked);\n\n if (defaultPrevented) {\n this.indeterminate = wasIndeterminate;\n this.checked = oldChecked;\n }\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.touched = true;\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 /* @internal /\n @Method()\n isTouched(): Promise<boolean> {\n return Promise.resolve(this.touched);\n }\n\n @HookValidationLifecycle()\n updateClassMappings() {\n /* This function is intentionally empty */\n }\n\n render() {\n let toggleText = this.textOff;\n\n if (this.checked) {\n toggleText = this.textOn;\n }\n\n if (this.indeterminate) {\n toggleText = this.textIndeterminate;\n }\n return (\n <Host\n class={{\n disabled: this.disabled,\n }}\n onBlur={() => this.ixBlur.emit()}\n onFocus={() => (this.touched = true)}\n >\n <label class=\"wrapper\">\n <button\n role=\"switch\"\n aria-checked={a11yBoolean(this.checked)}\n class={{\n switch: true,\n checked: this.checked,\n indeterminate: this.indeterminate,\n }}\n onClick={() => this.onCheckedChange(!this.checked)}\n >\n <div class=\"slider\"></div>\n </button>\n <input\n type=\"checkbox\"\n disabled={this.disabled}\n indeterminate={this.indeterminate}\n checked={this.checked}\n tabindex={0}\n aria-hidden={a11yBoolean(true)}\n aria-checked={a11yBoolean(this.checked)}\n onChange={(event) =>\n this.onCheckedChange((event.target as HTMLInputElement).checked)\n }\n />\n {!this.hideText && (\n <ix-typography class=\"label\">{toggleText}</ix-typography>\n )}\n </label>\n </Host>\n );\n }\n}\n"],"names":["h","Host","a11yBoolean","HookValidationLifecycle"],"mappings":"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"}
1	+ {"version":3,"file":"ix-toggle.entry.cjs.js","sources":["src/components/toggle/toggle.scss?tag=ix-toggle&encapsulation=shadow","src/components/toggle/toggle.tsx"],"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@use 'mixins/hover';\n@use 'mixins/shadow-dom/component';\n\n:host {\n display: inline-flex;\n flex-direction: row;\n position: relative;\n min-height: 1.5rem;\n max-height: calc(100% - 0.5rem);\n margin-block-start: 0.25rem;\n margin-block-end: 0.25rem;\n\n @include component.ix-component;\n\n input[type='checkbox'] {\n display: none;\n }\n\n .wrapper {\n display: flex;\n align-items: flex-start;\n width: 100%;\n max-height: 100%;\n }\n\n .label {\n word-break: break-word;\n display: block;\n white-space: normal;\n overflow: hidden;\n margin-block-start: 0.125rem;\n margin-inline-start: 0.5rem;\n min-height: 1rem;\n }\n\n .switch {\n all: unset;\n position: relative;\n display: inline-block;\n width: 3rem;\n min-width: 3rem;\n max-width: 3rem;\n height: 1.5rem;\n }\n\n .slider {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background-color: var(--theme-switch-off--background);\n transition: var(--theme-default-time);\n border-radius: 1.5rem;\n border: 0.0625rem solid transparent;\n }\n\n .slider:before {\n position: absolute;\n content: '';\n height: 1.125rem;\n width: 1.125rem;\n left: 0.125rem;\n bottom: 0.125rem;\n background-color: var(--theme-switch-thumb-off--background);\n transition: var(--theme-default-time);\n border-radius: 50%;\n border: 1px solid var(--theme-switch-thumb-off--border-color);\n }\n\n .switch.checked > .slider::before {\n background-color: var(--theme-switch-thumb-on--background);\n transform: translateX(1.5rem);\n }\n\n .switch > .slider {\n border-color: var(--theme-switch-off--border-color);\n }\n\n .switch:hover > .slider {\n background-color: var(--theme-switch-off--background--hover);\n border-color: var(--theme-switch-off--border-color--hover);\n }\n\n .switch:hover > .slider:before {\n background-color: var(--theme-switch-thumb-off--background--hover);\n border: 1px solid var(--theme-switch-thumb-off--border-color--hover);\n }\n\n .switch:active > .slider {\n background-color: var(--theme-switch-off--background--active);\n border-color: var(--theme-switch-off--border-color--active);\n }\n\n .switch:active > .slider:before {\n background-color: var(--theme-switch-thumb-off--background--active);\n border: 1px solid var(--theme-switch-thumb-off--border-color--active);\n }\n\n .switch.checked > .slider {\n background-color: var(--theme-switch-on--background);\n border-color: var(--theme-switch-on--border-color);\n }\n\n .switch.checked > .slider:before {\n border: 1px solid var(--theme-switch-thumb-on--border-color);\n }\n\n .switch.checked:hover > .slider {\n background-color: var(--theme-switch-on--background--hover);\n border-color: var(--theme-switch-on--border-color--hover);\n }\n\n .switch.checked:hover > .slider:before {\n background-color: var(--theme-switch-thumb-on--background--hover);\n border: 1px solid var(--theme-switch-thumb-on--border-color--hover);\n }\n\n .switch.checked:active > .slider {\n background-color: var(--theme-switch-on--background--active);\n border-color: var(--theme-switch-on--border-color--active);\n }\n\n .switch.checked:active > .slider:before {\n background-color: var(--theme-switch-thumb-on--background--active);\n border: 1px solid var(--theme-switch-thumb-on--border-color--active);\n }\n\n .switch.indeterminate > .slider::before {\n transform: translateX(0.75rem);\n }\n}\n\n:host(:not(.disabled)) {\n .wrapper {\n cursor: pointer;\n }\n\n .switch:focus-visible > .slider {\n outline: 0.0625rem solid var(--theme-color-focus-bdr);\n outline-offset: 0.0625rem;\n }\n}\n\n:host(.disabled) {\n pointer-events: none;\n\n .switch {\n opacity: 0.5;\n }\n\n .switch > .slider {\n background-color: var(--theme-switch-off--background--disabled);\n }\n\n .switch > .slider:before {\n background-color: var(--theme-switch-thumb-off--background--disabled);\n }\n\n .switch.checked > .slider {\n background-color: var(--theme-switch-on--background--disabled);\n }\n\n .switch.checked > .slider:before {\n background-color: var(--theme-switch-thumb-on--background--disabled);\n }\n\n .label {\n color: var(--theme-color-weak-text);\n }\n}\n\n@mixin toggle-variant($selector) {\n :host(#{$selector}:not(.disabled)) {\n .slider {\n @content;\n }\n }\n}\n\n@mixin define-toggle-vars($state, $type) {\n --theme-switch-#{$state}--background: var(\n --theme-switch-#{$state}--background--#{$type}\n );\n --theme-switch-#{$state}--background--hover: var(\n --theme-switch-#{$state}--background--#{$type}--hover\n );\n --theme-switch-#{$state}--background--active: var(\n --theme-switch-#{$state}--background--#{$type}--active\n );\n\n --theme-switch-thumb-#{$state}--border-color: var(\n --theme-switch-thumb-#{$state}--border-color--#{$type}\n );\n --theme-switch-thumb-#{$state}--border-color--hover: var(\n --theme-switch-thumb-#{$state}--border-color--#{$type}--hover\n );\n --theme-switch-thumb-#{$state}--border-color--active: var(\n --theme-switch-thumb-#{$state}--border-color--#{$type}--active\n );\n\n --theme-switch-thumb-#{$state}--background: var(\n --theme-switch-thumb-#{$state}--background--#{$type}\n );\n --theme-switch-thumb-#{$state}--background--hover: var(\n --theme-switch-thumb-#{$state}--background--#{$type}--hover\n );\n --theme-switch-thumb-#{$state}--background--active: var(\n --theme-switch-thumb-#{$state}--background--#{$type}--active\n );\n\n --theme-switch-#{$state}--border-color: var(\n --theme-switch-#{$state}--border-color--#{$type}\n );\n --theme-switch-#{$state}--border-color--hover: var(\n --theme-switch-#{$state}--border-color--#{$type}--hover\n );\n --theme-switch-#{$state}--border-color--active: var(\n --theme-switch-#{$state}--border-color--#{$type}--active\n );\n}\n\n@include toggle-variant($selector: '.ix-valid') {\n @include define-toggle-vars('off', 'valid');\n @include define-toggle-vars('on', 'valid');\n @include define-toggle-vars('mixed', 'valid');\n}\n\n@include toggle-variant($selector: '.ix-info') {\n @include define-toggle-vars('off', 'info');\n @include define-toggle-vars('on', 'info');\n @include define-toggle-vars('mixed', 'info');\n}\n\n@include toggle-variant($selector: '.ix-warning') {\n @include define-toggle-vars('off', 'warning');\n @include define-toggle-vars('on', 'warning');\n @include define-toggle-vars('mixed', 'warning');\n}\n\n@include toggle-variant($selector: '.ix-invalid--required') {\n @include define-toggle-vars('off', 'invalid');\n @include define-toggle-vars('on', 'invalid');\n @include define-toggle-vars('mixed', 'invalid');\n}\n\n@include toggle-variant($selector: '.ix-invalid') {\n @include define-toggle-vars('off', 'invalid');\n @include define-toggle-vars('on', 'invalid');\n @include define-toggle-vars('mixed', 'invalid');\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 /\n\nimport {\n AttachInternals,\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Method,\n Prop,\n Watch,\n} from '@stencil/core';\nimport { a11yBoolean } from '../utils/a11y';\nimport { HookValidationLifecycle, IxFormComponent } from '../utils/input';\n\n/\n @form-ready\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 /\n An event will be dispatched each time the toggle is blurred.\n /\n @Event() ixBlur!: EventEmitter<void>;\n\n private touched = false;\n\n onCheckedChange(newChecked: boolean) {\n if (this.disabled) {\n return;\n }\n\n const wasIndeterminate = this.indeterminate;\n const oldChecked = this.checked;\n\n if (this.indeterminate) {\n this.indeterminate = false;\n }\n\n this.checked = newChecked;\n\n const { defaultPrevented } = this.checkedChange.emit(this.checked);\n\n if (defaultPrevented) {\n this.indeterminate = wasIndeterminate;\n this.checked = oldChecked;\n }\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.touched = true;\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 /* @internal /\n @Method()\n isTouched(): Promise<boolean> {\n return Promise.resolve(this.touched);\n }\n\n @HookValidationLifecycle()\n updateClassMappings() {\n /* This function is intentionally empty */\n }\n\n render() {\n let toggleText = this.textOff;\n\n if (this.checked) {\n toggleText = this.textOn;\n }\n\n if (this.indeterminate) {\n toggleText = this.textIndeterminate;\n }\n return (\n <Host\n role=\"switch\"\n aria-checked={a11yBoolean(this.checked)}\n aria-disabled={a11yBoolean(this.disabled)}\n class={{\n disabled: this.disabled,\n }}\n onBlur={() => this.ixBlur.emit()}\n onFocus={() => (this.touched = true)}\n >\n <label class=\"wrapper\">\n <button\n class={{\n switch: true,\n checked: this.checked,\n indeterminate: this.indeterminate,\n }}\n onClick={() => this.onCheckedChange(!this.checked)}\n tabindex={-1}\n aria-hidden=\"true\"\n >\n <div class=\"slider\"></div>\n </button>\n <input\n type=\"checkbox\"\n disabled={this.disabled}\n indeterminate={this.indeterminate}\n checked={this.checked}\n tabindex={0}\n aria-hidden={a11yBoolean(true)}\n aria-checked={a11yBoolean(this.checked)}\n onChange={(event) =>\n this.onCheckedChange((event.target as HTMLInputElement).checked)\n }\n />\n {!this.hideText && (\n <ix-typography class=\"label\">{toggleText}</ix-typography>\n )}\n </label>\n </Host>\n );\n }\n}\n"],"names":["h","Host","a11yBoolean","HookValidationLifecycle"],"mappings":"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"}

package/dist/cjs/ix-tooltip.cjs.entry.js CHANGED Viewed

@@ -4,10 +4,12 @@ var index = require('./index-C8Xo8L1k.js');
 var floatingUi_dom = require('./floating-ui.dom-CMzYsRR7.js');
 var findElement = require('./find-element-D7yD1Ukn.js');
 var makeRef = require('./make-ref-BaH6_YJk.js');
+var shadowDom = require('./shadow-dom-DT01VwcB.js');
 var disposableEventListener = require('./disposable-event-listener-BALEIeXq.js');
-const tooltipCss = ".dialog{margin:0;padding:0;border:none;max-width:18.25rem;width:-moz-max-content;width:max-content;background-color:transparent;overflow-wrap:break-word;box-shadow:none;overflow:visible}.tooltip-container{display:block;position:relative;width:auto;height:-moz-fit-content;height:fit-content;background:var(--theme-tootlip--background);color:var(--theme-color-std-text);padding:0.375rem 0.75rem 0.375rem 0.875rem;box-shadow:var(--theme-shadow-4);border-radius:0.25rem}.content-wrapper{overflow:auto}.tooltip-title{display:flex;align-items:center}.tooltip-title ::slotted(ix-icon){margin-right:0.35rem}.arrow,.arrow::before{position:absolute;width:12px;height:12px;background:inherit}.arrow{visibility:hidden}.arrow::before{visibility:visible;content:\"\";transform:rotate(45deg);background-color:var(--theme-tootlip--background)}";
+const tooltipCss = ".dialog{margin:0;padding:0;border:none;max-width:18.25rem;width:-moz-max-content;width:max-content;background-color:transparent;overflow-wrap:break-word;box-shadow:none;overflow:visible}.tooltip-container{display:block;position:relative;width:auto;height:-moz-fit-content;height:fit-content;background:var(--theme-tootlip--background);color:var(--theme-color-std-text);padding:0.375rem 0.75rem;box-shadow:var(--theme-shadow-4);border-radius:0.25rem}.content-wrapper{overflow:auto}.tooltip-title{display:flex}.tooltip-title ::slotted(ix-icon){margin:0.125rem 0.25rem 0.125rem 0}.arrow,.arrow::before{position:absolute;width:12px;height:12px;background:inherit}.arrow{visibility:hidden}.arrow::before{visibility:visible;content:\"\";transform:rotate(45deg);background-color:var(--theme-tootlip--background)}";
+const ARROW_OFFSET = -6;
 const numberToPixel = (value) => value !== null ? `${value}px` : '';
 let tooltipInstance = 0;
 const Tooltip = class {
@@ -86,16 +88,16 @@ const Tooltip = class {
             left: 'unset',
         };
         if (placement.startsWith('top')) {
-            return Object.assign(Object.assign({}, resetPosition), { left: numberToPixel(x), top: numberToPixel(y) });
+            return Object.assign(Object.assign({}, resetPosition), { left: numberToPixel(x), bottom: numberToPixel(ARROW_OFFSET) });
         }
         if (placement.startsWith('right')) {
-            return Object.assign(Object.assign({}, resetPosition), { left: numberToPixel(-6), top: numberToPixel(y) });
+            return Object.assign(Object.assign({}, resetPosition), { left: numberToPixel(ARROW_OFFSET), top: numberToPixel(y) });
         }
         if (placement.startsWith('bottom')) {
-            return Object.assign(Object.assign({}, resetPosition), { left: numberToPixel(x), top: numberToPixel(-6) });
+            return Object.assign(Object.assign({}, resetPosition), { left: numberToPixel(x), top: numberToPixel(ARROW_OFFSET) });
         }
         if (placement.startsWith('left')) {
-            return Object.assign(Object.assign({}, resetPosition), { right: numberToPixel(-6), top: numberToPixel(y) });
+            return Object.assign(Object.assign({}, resetPosition), { right: numberToPixel(ARROW_OFFSET), top: numberToPixel(y) });
         }
     }
     async computeTooltipPosition(target, dialog) {
@@ -317,8 +319,17 @@ const Tooltip = class {
         (_c = this.disposeTooltipListener) === null || _c === void 0 ? void 0 : _c.call(this);
         (_d = this.disposeDomChangeListener) === null || _d === void 0 ? void 0 : _d.call(this);
     }
+    handleTitleIconSlotChange(e) {
+        const slot = e.target;
+        const elements = shadowDom.getSlottedElements(slot);
+        for (const element of elements) {
+            if (element.tagName.toLowerCase() === 'ix-icon') {
+                element.size = '16';
+            }
+        }
+    }
     render() {
-        return (index.h(index.Host, { key: 'eee651684c88795823f90194e2be5ed110077615', role: "tooltip", class: { visible: this.visible } }, index.h("dialog", { key: '29fa36972dc3c31122df8c1a76a88a748c59431a', ref: this.dialogRef, id: 'tooltip-' + this.instance, class: "dialog", popover: "manual", inert: !this.visible }, index.h("div", { key: '07ddb653d0218d195ab0a11ecad1fdba05e94cee', class: "tooltip-container" }, index.h("div", { key: '704252e6d76ddf26336514874bb77c9f6e13cb8d', class: "content-wrapper" }, index.h("div", { key: 'c69710b5152269a0ec33ed9941dd23426bac91ed', class: 'tooltip-title' }, index.h("slot", { key: 'f349cccad759202ac4c8f57b2124a904193d791d', name: "title-icon" }), index.h("ix-typography", { key: '6a73678531a8310e1c95da638486187df2341306', format: "h5" }, this.titleContent, index.h("slot", { key: '79fb0b5e2e62c554d419a765195529575ab7f879', name: "title-content" }))), index.h("slot", { key: '84ecbfefc9215d734d3c8e29916fa08be0762e39' }), index.h("div", { key: '417d4aaf3d5b7a52ddd35e0a17cce0b72fdb897c', class: "arrow" }))))));
+        return (index.h(index.Host, { key: '1176f8e37f2918a9708c8ccdbfc57f99508299f3', role: "tooltip", class: { visible: this.visible } }, index.h("dialog", { key: 'd4942b8d171e7e48defc505179d54ce09288c905', ref: this.dialogRef, id: 'tooltip-' + this.instance, class: "dialog", popover: "manual", inert: !this.visible }, index.h("div", { key: 'faef3b3e4b5a45ddb3872bd9d8ec1d6eb4a36221', class: "tooltip-container" }, index.h("div", { key: 'ce64bda5406c6a70ccddc41f0b4aa4010be1aca9', class: "content-wrapper" }, index.h("div", { key: '52a51ed895ea573d3e889e57a05f65193906492c', class: 'tooltip-title' }, index.h("slot", { key: 'b7965bd9963fcd789331e4c264e8d317bf7ed314', name: "title-icon", onSlotchange: (e) => this.handleTitleIconSlotChange(e) }), index.h("ix-typography", { key: 'b530dbbf13b752968decb45af3953f42e3a0c743', format: "h5" }, this.titleContent, index.h("slot", { key: 'c7152f89180904044dc26f996923cc5766ea1d0f', name: "title-content" }))), index.h("slot", { key: '3b00e9ed924a0c0d8527344c13a3c52a9afd0108' }), index.h("div", { key: '5401e6015c3a7ebf4749edc466ddca881e4f7d36', class: "arrow" }))))));
     }
     get hostElement() { return index.getElement(this); }
 };

package/dist/cjs/ix-tooltip.entry.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ix-tooltip.entry.cjs.js","sources":["src/components/tooltip/tooltip.scss?tag=ix-tooltip&encapsulation=shadow","src/components/tooltip/tooltip.tsx"],"sourcesContent":["/\n SPDX-FileCopyrightText: 2025 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.dialog {\n margin: 0;\n padding: 0;\n border: none;\n max-width: 18.25rem;\n width: max-content;\n background-color: transparent;\n overflow-wrap: break-word;\n box-shadow: none;\n overflow: visible;\n}\n\n.tooltip-container {\n display: block;\n position: relative;\n width: auto;\n height: fit-content;\n background: var(--theme-tootlip--background);\n color: var(--theme-color-std-text);\n padding: 0.375rem 0.75rem 0.375rem 0.875rem;\n\n box-shadow: var(--theme-shadow-4);\n border-radius: 0.25rem;\n}\n\n.content-wrapper {\n overflow: auto;\n}\n\n.tooltip-title {\n display: flex;\n align-items: center;\n\n ::slotted(ix-icon) {\n margin-right: 0.35rem;\n }\n}\n\n.arrow,\n.arrow::before {\n position: absolute;\n width: 12px;\n height: 12px;\n background: inherit;\n}\n\n.arrow {\n visibility: hidden;\n}\n\n.arrow::before {\n visibility: visible;\n content: '';\n transform: rotate(45deg);\n background-color: var(--theme-tootlip--background);\n}\n","/\n * SPDX-FileCopyrightText: 2025 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 arrow,\n autoUpdate,\n computePosition,\n ComputePositionReturn,\n flip,\n hide,\n offset,\n shift,\n} from '@floating-ui/dom';\nimport {\n Component,\n Element,\n h,\n Host,\n Method,\n Prop,\n State,\n} from '@stencil/core';\nimport { resolveSelector } from '../utils/find-element';\nimport { ElementReference } from 'src/components';\nimport { makeRef } from '../utils/make-ref';\nimport { addDisposableEventListenerAsArray } from '../utils/disposable-event-listener';\n\ntype ArrowPosition = {\n top?: string;\n left?: string;\n right?: string;\n};\n\nconst numberToPixel = (value?: number \| null) =>\n value !== null ? `${value}px` : '';\n\nlet tooltipInstance = 0;\n\n/\n @slot title-icon - Icon of tooltip title\n * @slot title-content - Content of tooltip title\n /\n@Component({\n tag: 'ix-tooltip',\n styleUrl: 'tooltip.scss',\n shadow: true,\n})\nexport class Tooltip {\n /\n CSS selector for hover trigger element e.g. `for=\"[data-my-custom-select]\"`\n /\n @Prop() for?: ElementReference \| ElementReference[];\n\n /\n Title of the tooltip\n /\n @Prop() titleContent?: string;\n\n /\n Define if the user can access the tooltip via mouse.\n /\n @Prop() interactive = false;\n\n /\n Initial placement of the tooltip.\n * If the selected placement doesn't have enough space, the tooltip will be repositioned to another location.\n /\n @Prop() placement: 'top' \| 'right' \| 'bottom' \| 'left' = 'top';\n\n /* @internal /\n @Prop() showDelay = 0;\n\n /* @internal /\n @Prop() hideDelay = 50;\n\n /* @internal /\n @Prop() animationFrame = false;\n\n @Element() hostElement!: HTMLIxTooltipElement;\n\n @State() private visible = false;\n\n private hideTooltipTimeout?: NodeJS.Timeout;\n private showTooltipTimeout?: NodeJS.Timeout;\n private visibleFor?: Element;\n\n private disposeAutoUpdate?: () => void;\n private disposeTriggerListener?: () => void;\n private disposeTooltipListener?: () => void;\n private disposeDomChangeListener?: () => void;\n\n private readonly instance = tooltipInstance++;\n\n private readonly dialogRef = makeRef<HTMLDialogElement>();\n\n private get arrowElement(): HTMLElement {\n return this.hostElement.shadowRoot!.querySelector('.arrow')!;\n }\n\n /* @internal /\n @Method()\n async showTooltip(anchorElement: Element) {\n this.clearTimeouts();\n\n if (this.showTooltipTimeout \|\| this.visibleFor === anchorElement) {\n return;\n }\n\n const dialog = await this.dialogRef.waitForCurrent();\n\n this.showTooltipTimeout = setTimeout(() => {\n this.setAnchorElement(anchorElement);\n dialog.showPopover();\n this.applyTooltipPosition(anchorElement, dialog);\n this.registerTooltipListener(dialog);\n }, this.showDelay);\n }\n\n /* @internal */\n @Method()\n async hideTooltip(hideDelay: number = this.hideDelay) {\n this.clearTimeouts();\n\n if (this.hideTooltipTimeout \|\| !this.visible) {\n return;\n }\n\n if (this.interactive && hideDelay === 50) {\n hideDelay = 150;\n }\n\n const dialog = await this.dialogRef.waitForCurrent();\n\n this.hideTooltipTimeout = setTimeout(() => {\n this.setAnchorElement();\n dialog.hidePopover();\n this.disposeAutoUpdate?.();\n this.disposeTooltipListener?.();\n }, hideDelay);\n }\n\n private setAnchorElement(anchorElement?: Element) {\n if (!anchorElement) {\n this.visibleFor = undefined;\n this.visible = false;\n } else {\n this.visibleFor = anchorElement;\n this.visible = true;\n }\n }\n\n private computeArrowPosition({\n placement,\n middlewareData,\n }: ComputePositionReturn): ArrowPosition \| undefined {\n let { x, y } = middlewareData.arrow!;\n const resetPosition = {\n top: 'unset',\n right: 'unset',\n bottom: 'unset',\n left: 'unset',\n };\n\n if (placement.startsWith('top')) {\n return {\n ...resetPosition,\n left: numberToPixel(x),\n top: numberToPixel(y),\n };\n }\n\n if (placement.startsWith('right')) {\n return {\n ...resetPosition,\n left: numberToPixel(-6),\n top: numberToPixel(y),\n };\n }\n\n if (placement.startsWith('bottom')) {\n return {\n ...resetPosition,\n left: numberToPixel(x),\n top: numberToPixel(-6),\n };\n }\n\n if (placement.startsWith('left')) {\n return {\n ...resetPosition,\n right: numberToPixel(-6),\n top: numberToPixel(y),\n };\n }\n }\n\n private async computeTooltipPosition(\n target: Element,\n dialog: HTMLDialogElement\n ): Promise<ComputePositionReturn> {\n return computePosition(target, dialog, {\n strategy: 'fixed',\n placement: this.placement,\n middleware: [\n shift(),\n offset(12),\n arrow({\n element: this.arrowElement,\n }),\n flip({\n fallbackStrategy: 'initialPlacement',\n fallbackAxisSideDirection: 'end',\n padding: 10,\n }),\n hide(),\n ],\n });\n }\n\n private applyTooltipArrowPosition(computeResponse: ComputePositionReturn) {\n const arrowPosition = this.computeArrowPosition(computeResponse);\n Object.assign(this.arrowElement.style, arrowPosition);\n }\n\n private async applyTooltipPosition(\n target: Element,\n dialog: HTMLDialogElement\n ): Promise<ComputePositionReturn \| undefined> {\n if (!target) {\n return;\n }\n\n return new Promise<ComputePositionReturn>((resolve) => {\n this.disposeAutoUpdate?.();\n\n this.disposeAutoUpdate = autoUpdate(\n target,\n dialog,\n async () => {\n const computeResponse = await this.computeTooltipPosition(\n target,\n dialog\n );\n\n const isHidden = computeResponse.middlewareData.hide?.referenceHidden;\n\n if (isHidden) {\n this.hideTooltip(0);\n resolve(computeResponse);\n }\n\n if (computeResponse.middlewareData.arrow) {\n this.applyTooltipArrowPosition(computeResponse);\n }\n\n const { x, y } = computeResponse;\n Object.assign(dialog.style, {\n left: numberToPixel(x),\n top: numberToPixel(y),\n });\n\n resolve(computeResponse);\n },\n {\n ancestorResize: true,\n ancestorScroll: true,\n elementResize: true,\n animationFrame: this.animationFrame,\n }\n );\n });\n }\n\n private async queryAnchorElements(): Promise<HTMLElement[] \| undefined> {\n if (this.for) {\n if (Array.isArray(this.for)) {\n return this.resolveElements(this.for);\n } else {\n return this.resolveElements([this.for]);\n }\n }\n }\n\n private async resolveElements(\n references: ElementReference[]\n ): Promise<HTMLElement[]> {\n const elements: HTMLElement[] = [];\n\n await Promise.all(\n references.map(async (reference) => {\n if (typeof reference === 'string') {\n const resolvedElements = await resolveSelector(\n reference,\n this.hostElement\n );\n\n if (resolvedElements) {\n elements.push(...resolvedElements);\n }\n } else if (reference instanceof HTMLElement) {\n elements.push(reference);\n } else if (reference instanceof Promise) {\n elements.push(await reference);\n }\n })\n );\n\n return elements;\n }\n\n private async registerTriggerListener() {\n this.disposeTriggerListener?.();\n\n const triggerElementList = await this.queryAnchorElements();\n\n if (!triggerElementList) {\n return;\n }\n\n const listeners: {\n element: Element \| Window \| Document;\n eventType: string;\n callback: EventListenerOrEventListenerObject;\n }[] = [];\n\n triggerElementList.forEach((element) => {\n listeners.push(\n ...[\n {\n element: element,\n eventType: 'mouseenter',\n callback: () => {\n this.showTooltip(element);\n },\n },\n {\n element: element,\n eventType: 'mouseleave',\n callback: () => {\n this.hideTooltip();\n },\n },\n {\n element: element,\n eventType: 'focus',\n callback: () => {\n this.showTooltip(element);\n },\n },\n {\n element: element,\n eventType: 'focusout',\n callback: () => {\n this.hideTooltip();\n },\n },\n ]\n );\n });\n\n this.disposeTriggerListener = addDisposableEventListenerAsArray(listeners);\n }\n\n private registerTooltipListener(dialog: HTMLDialogElement) {\n this.disposeTooltipListener?.();\n\n this.disposeTooltipListener = addDisposableEventListenerAsArray([\n {\n element: dialog,\n eventType: 'mouseenter',\n callback: () => {\n if (this.interactive) {\n this.clearHideTimeout();\n }\n },\n },\n {\n element: dialog,\n eventType: 'focus',\n callback: () => {\n if (this.interactive) {\n this.clearHideTimeout();\n }\n },\n },\n {\n element: dialog,\n eventType: 'mouseleave',\n callback: () => {\n this.hideTooltip();\n },\n },\n {\n element: dialog,\n eventType: 'focusout',\n callback: () => {\n this.hideTooltip();\n },\n },\n {\n element: dialog,\n eventType: 'click',\n callback: (event: Event) => {\n event.stopPropagation();\n },\n },\n {\n element: document,\n eventType: 'keydown',\n callback: (event: Event) => {\n if ((event as KeyboardEvent).key === 'Escape') {\n this.hideTooltip();\n }\n },\n },\n ]);\n }\n\n private registerDomChangeListener() {\n const observer = new MutationObserver(() => {\n this.registerTriggerListener();\n });\n\n observer.observe(document.body, {\n attributes: true,\n attributeFilter: ['data-ix-tooltip'],\n childList: true,\n subtree: true,\n });\n\n this.disposeDomChangeListener = () => {\n observer.disconnect();\n };\n }\n\n private clearHideTimeout() {\n clearTimeout(this.hideTooltipTimeout);\n this.hideTooltipTimeout = undefined;\n }\n\n private clearShowTimeout() {\n clearTimeout(this.showTooltipTimeout);\n this.showTooltipTimeout = undefined;\n }\n\n private clearTimeouts() {\n this.clearHideTimeout();\n this.clearShowTimeout();\n }\n\n componentWillLoad() {\n this.registerTriggerListener();\n }\n\n componentDidLoad() {\n this.registerDomChangeListener();\n }\n\n disconnectedCallback() {\n this.clearTimeouts();\n\n this.disposeAutoUpdate?.();\n this.disposeTriggerListener?.();\n this.disposeTooltipListener?.();\n this.disposeDomChangeListener?.();\n }\n\n render() {\n return (\n <Host role=\"tooltip\" class={{ visible: this.visible }}>\n <dialog\n ref={this.dialogRef}\n id={'tooltip-' + this.instance}\n class=\"dialog\"\n popover=\"manual\"\n inert={!this.visible}\n >\n <div class=\"tooltip-container\">\n <div class=\"content-wrapper\">\n <div class={'tooltip-title'}>\n <slot name=\"title-icon\"></slot>\n <ix-typography format=\"h5\">\n {this.titleContent}\n <slot name=\"title-content\"></slot>\n </ix-typography>\n </div>\n <slot></slot>\n <div class=\"arrow\"></div>\n </div>\n </div>\n </dialog>\n </Host>\n );\n }\n}\n"],"names":["makeRef","computePosition","shift","offset","arrow","flip","hide","autoUpdate","resolveSelector","addDisposableEventListenerAsArray","h","Host"],"mappings":"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"}
1	+ {"version":3,"file":"ix-tooltip.entry.cjs.js","sources":["src/components/tooltip/tooltip.scss?tag=ix-tooltip&encapsulation=shadow","src/components/tooltip/tooltip.tsx"],"sourcesContent":["/\n SPDX-FileCopyrightText: 2025 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.dialog {\n margin: 0;\n padding: 0;\n border: none;\n max-width: 18.25rem;\n width: max-content;\n background-color: transparent;\n overflow-wrap: break-word;\n box-shadow: none;\n overflow: visible;\n}\n\n.tooltip-container {\n display: block;\n position: relative;\n width: auto;\n height: fit-content;\n background: var(--theme-tootlip--background);\n color: var(--theme-color-std-text);\n padding: 0.375rem 0.75rem;\n\n box-shadow: var(--theme-shadow-4);\n border-radius: 0.25rem;\n}\n\n.content-wrapper {\n overflow: auto;\n}\n\n.tooltip-title {\n display: flex;\n\n ::slotted(ix-icon) {\n margin: 0.125rem 0.25rem 0.125rem 0;\n }\n}\n\n.arrow,\n.arrow::before {\n position: absolute;\n width: 12px;\n height: 12px;\n background: inherit;\n}\n\n.arrow {\n visibility: hidden;\n}\n\n.arrow::before {\n visibility: visible;\n content: '';\n transform: rotate(45deg);\n background-color: var(--theme-tootlip--background);\n}\n","/\n * SPDX-FileCopyrightText: 2025 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 arrow,\n autoUpdate,\n computePosition,\n ComputePositionReturn,\n flip,\n hide,\n offset,\n shift,\n} from '@floating-ui/dom';\nimport {\n Component,\n Element,\n h,\n Host,\n Method,\n Prop,\n State,\n} from '@stencil/core';\nimport { resolveSelector } from '../utils/find-element';\nimport { ElementReference } from 'src/components';\nimport { makeRef } from '../utils/make-ref';\nimport { getSlottedElements } from '../utils/shadow-dom';\nimport { addDisposableEventListenerAsArray } from '../utils/disposable-event-listener';\n\ntype ArrowPosition = {\n top?: string;\n left?: string;\n right?: string;\n bottom?: string;\n};\n\nconst ARROW_OFFSET = -6;\n\nconst numberToPixel = (value?: number \| null) =>\n value !== null ? `${value}px` : '';\n\nlet tooltipInstance = 0;\n\n/\n @slot title-icon - Icon displayed next to the tooltip title. The icon will be displayed as 16x16px.\n * @slot title-content - Content of tooltip title\n /\n@Component({\n tag: 'ix-tooltip',\n styleUrl: 'tooltip.scss',\n shadow: true,\n})\nexport class Tooltip {\n /\n CSS selector for hover trigger element e.g. `for=\"[data-my-custom-select]\"`\n /\n @Prop() for?: ElementReference \| ElementReference[];\n\n /\n Title of the tooltip\n /\n @Prop() titleContent?: string;\n\n /\n Define if the user can access the tooltip via mouse.\n /\n @Prop() interactive = false;\n\n /\n Initial placement of the tooltip.\n * If the selected placement doesn't have enough space, the tooltip will be repositioned to another location.\n /\n @Prop() placement: 'top' \| 'right' \| 'bottom' \| 'left' = 'top';\n\n /* @internal /\n @Prop() showDelay = 0;\n\n /* @internal /\n @Prop() hideDelay = 50;\n\n /* @internal /\n @Prop() animationFrame = false;\n\n @Element() hostElement!: HTMLIxTooltipElement;\n\n @State() private visible = false;\n\n private hideTooltipTimeout?: NodeJS.Timeout;\n private showTooltipTimeout?: NodeJS.Timeout;\n private visibleFor?: Element;\n\n private disposeAutoUpdate?: () => void;\n private disposeTriggerListener?: () => void;\n private disposeTooltipListener?: () => void;\n private disposeDomChangeListener?: () => void;\n\n private readonly instance = tooltipInstance++;\n\n private readonly dialogRef = makeRef<HTMLDialogElement>();\n\n private get arrowElement(): HTMLElement {\n return this.hostElement.shadowRoot!.querySelector('.arrow')!;\n }\n\n /* @internal /\n @Method()\n async showTooltip(anchorElement: Element) {\n this.clearTimeouts();\n\n if (this.showTooltipTimeout \|\| this.visibleFor === anchorElement) {\n return;\n }\n\n const dialog = await this.dialogRef.waitForCurrent();\n\n this.showTooltipTimeout = setTimeout(() => {\n this.setAnchorElement(anchorElement);\n dialog.showPopover();\n this.applyTooltipPosition(anchorElement, dialog);\n this.registerTooltipListener(dialog);\n }, this.showDelay);\n }\n\n /* @internal */\n @Method()\n async hideTooltip(hideDelay: number = this.hideDelay) {\n this.clearTimeouts();\n\n if (this.hideTooltipTimeout \|\| !this.visible) {\n return;\n }\n\n if (this.interactive && hideDelay === 50) {\n hideDelay = 150;\n }\n\n const dialog = await this.dialogRef.waitForCurrent();\n\n this.hideTooltipTimeout = setTimeout(() => {\n this.setAnchorElement();\n dialog.hidePopover();\n this.disposeAutoUpdate?.();\n this.disposeTooltipListener?.();\n }, hideDelay);\n }\n\n private setAnchorElement(anchorElement?: Element) {\n if (!anchorElement) {\n this.visibleFor = undefined;\n this.visible = false;\n } else {\n this.visibleFor = anchorElement;\n this.visible = true;\n }\n }\n\n private computeArrowPosition({\n placement,\n middlewareData,\n }: ComputePositionReturn): ArrowPosition \| undefined {\n let { x, y } = middlewareData.arrow!;\n const resetPosition = {\n top: 'unset',\n right: 'unset',\n bottom: 'unset',\n left: 'unset',\n };\n\n if (placement.startsWith('top')) {\n return {\n ...resetPosition,\n left: numberToPixel(x),\n bottom: numberToPixel(ARROW_OFFSET),\n };\n }\n\n if (placement.startsWith('right')) {\n return {\n ...resetPosition,\n left: numberToPixel(ARROW_OFFSET),\n top: numberToPixel(y),\n };\n }\n\n if (placement.startsWith('bottom')) {\n return {\n ...resetPosition,\n left: numberToPixel(x),\n top: numberToPixel(ARROW_OFFSET),\n };\n }\n\n if (placement.startsWith('left')) {\n return {\n ...resetPosition,\n right: numberToPixel(ARROW_OFFSET),\n top: numberToPixel(y),\n };\n }\n }\n\n private async computeTooltipPosition(\n target: Element,\n dialog: HTMLDialogElement\n ): Promise<ComputePositionReturn> {\n return computePosition(target, dialog, {\n strategy: 'fixed',\n placement: this.placement,\n middleware: [\n shift(),\n offset(12),\n arrow({\n element: this.arrowElement,\n }),\n flip({\n fallbackStrategy: 'initialPlacement',\n fallbackAxisSideDirection: 'end',\n padding: 10,\n }),\n hide(),\n ],\n });\n }\n\n private applyTooltipArrowPosition(computeResponse: ComputePositionReturn) {\n const arrowPosition = this.computeArrowPosition(computeResponse);\n Object.assign(this.arrowElement.style, arrowPosition);\n }\n\n private async applyTooltipPosition(\n target: Element,\n dialog: HTMLDialogElement\n ): Promise<ComputePositionReturn \| undefined> {\n if (!target) {\n return;\n }\n\n return new Promise<ComputePositionReturn>((resolve) => {\n this.disposeAutoUpdate?.();\n\n this.disposeAutoUpdate = autoUpdate(\n target,\n dialog,\n async () => {\n const computeResponse = await this.computeTooltipPosition(\n target,\n dialog\n );\n\n const isHidden = computeResponse.middlewareData.hide?.referenceHidden;\n\n if (isHidden) {\n this.hideTooltip(0);\n resolve(computeResponse);\n }\n\n if (computeResponse.middlewareData.arrow) {\n this.applyTooltipArrowPosition(computeResponse);\n }\n\n const { x, y } = computeResponse;\n Object.assign(dialog.style, {\n left: numberToPixel(x),\n top: numberToPixel(y),\n });\n\n resolve(computeResponse);\n },\n {\n ancestorResize: true,\n ancestorScroll: true,\n elementResize: true,\n animationFrame: this.animationFrame,\n }\n );\n });\n }\n\n private async queryAnchorElements(): Promise<HTMLElement[] \| undefined> {\n if (this.for) {\n if (Array.isArray(this.for)) {\n return this.resolveElements(this.for);\n } else {\n return this.resolveElements([this.for]);\n }\n }\n }\n\n private async resolveElements(\n references: ElementReference[]\n ): Promise<HTMLElement[]> {\n const elements: HTMLElement[] = [];\n\n await Promise.all(\n references.map(async (reference) => {\n if (typeof reference === 'string') {\n const resolvedElements = await resolveSelector(\n reference,\n this.hostElement\n );\n\n if (resolvedElements) {\n elements.push(...resolvedElements);\n }\n } else if (reference instanceof HTMLElement) {\n elements.push(reference);\n } else if (reference instanceof Promise) {\n elements.push(await reference);\n }\n })\n );\n\n return elements;\n }\n\n private async registerTriggerListener() {\n this.disposeTriggerListener?.();\n\n const triggerElementList = await this.queryAnchorElements();\n\n if (!triggerElementList) {\n return;\n }\n\n const listeners: {\n element: Element \| Window \| Document;\n eventType: string;\n callback: EventListenerOrEventListenerObject;\n }[] = [];\n\n triggerElementList.forEach((element) => {\n listeners.push(\n ...[\n {\n element: element,\n eventType: 'mouseenter',\n callback: () => {\n this.showTooltip(element);\n },\n },\n {\n element: element,\n eventType: 'mouseleave',\n callback: () => {\n this.hideTooltip();\n },\n },\n {\n element: element,\n eventType: 'focus',\n callback: () => {\n this.showTooltip(element);\n },\n },\n {\n element: element,\n eventType: 'focusout',\n callback: () => {\n this.hideTooltip();\n },\n },\n ]\n );\n });\n\n this.disposeTriggerListener = addDisposableEventListenerAsArray(listeners);\n }\n\n private registerTooltipListener(dialog: HTMLDialogElement) {\n this.disposeTooltipListener?.();\n\n this.disposeTooltipListener = addDisposableEventListenerAsArray([\n {\n element: dialog,\n eventType: 'mouseenter',\n callback: () => {\n if (this.interactive) {\n this.clearHideTimeout();\n }\n },\n },\n {\n element: dialog,\n eventType: 'focus',\n callback: () => {\n if (this.interactive) {\n this.clearHideTimeout();\n }\n },\n },\n {\n element: dialog,\n eventType: 'mouseleave',\n callback: () => {\n this.hideTooltip();\n },\n },\n {\n element: dialog,\n eventType: 'focusout',\n callback: () => {\n this.hideTooltip();\n },\n },\n {\n element: dialog,\n eventType: 'click',\n callback: (event: Event) => {\n event.stopPropagation();\n },\n },\n {\n element: document,\n eventType: 'keydown',\n callback: (event: Event) => {\n if ((event as KeyboardEvent).key === 'Escape') {\n this.hideTooltip();\n }\n },\n },\n ]);\n }\n\n private registerDomChangeListener() {\n const observer = new MutationObserver(() => {\n this.registerTriggerListener();\n });\n\n observer.observe(document.body, {\n attributes: true,\n attributeFilter: ['data-ix-tooltip'],\n childList: true,\n subtree: true,\n });\n\n this.disposeDomChangeListener = () => {\n observer.disconnect();\n };\n }\n\n private clearHideTimeout() {\n clearTimeout(this.hideTooltipTimeout);\n this.hideTooltipTimeout = undefined;\n }\n\n private clearShowTimeout() {\n clearTimeout(this.showTooltipTimeout);\n this.showTooltipTimeout = undefined;\n }\n\n private clearTimeouts() {\n this.clearHideTimeout();\n this.clearShowTimeout();\n }\n\n componentWillLoad() {\n this.registerTriggerListener();\n }\n\n componentDidLoad() {\n this.registerDomChangeListener();\n }\n\n disconnectedCallback() {\n this.clearTimeouts();\n\n this.disposeAutoUpdate?.();\n this.disposeTriggerListener?.();\n this.disposeTooltipListener?.();\n this.disposeDomChangeListener?.();\n }\n private handleTitleIconSlotChange(e: Event) {\n const slot = e.target as HTMLSlotElement;\n const elements = getSlottedElements<HTMLElement>(slot);\n\n for (const element of elements) {\n if (element.tagName.toLowerCase() === 'ix-icon') {\n (element as HTMLIxIconElement).size = '16';\n }\n }\n }\n\n render() {\n return (\n <Host role=\"tooltip\" class={{ visible: this.visible }}>\n <dialog\n ref={this.dialogRef}\n id={'tooltip-' + this.instance}\n class=\"dialog\"\n popover=\"manual\"\n inert={!this.visible}\n >\n <div class=\"tooltip-container\">\n <div class=\"content-wrapper\">\n <div class={'tooltip-title'}>\n <slot\n name=\"title-icon\"\n onSlotchange={(e) => this.handleTitleIconSlotChange(e)}\n ></slot>\n <ix-typography format=\"h5\">\n {this.titleContent}\n <slot name=\"title-content\"></slot>\n </ix-typography>\n </div>\n <slot></slot>\n <div class=\"arrow\"></div>\n </div>\n </div>\n </dialog>\n </Host>\n );\n }\n}\n"],"names":["makeRef","computePosition","shift","offset","arrow","flip","hide","autoUpdate","resolveSelector","addDisposableEventListenerAsArray","getSlottedElements","h","Host"],"mappings":"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"}

package/dist/cjs/ix-tree-item.cjs.entry.js CHANGED Viewed

@@ -17,17 +17,17 @@ const TreeItem = class {
     }
     render() {
         var _a, _b;
-        return (index.h(index.Host, { key: 'f3168fba8586e37800d2ba921d890e3f8c38d263', class: {
+        return (index.h(index.Host, { key: '52817f9eed914ee6b01b67848af3f7073f21d65c', class: {
                 selected: !!((_a = this.context) === null || _a === void 0 ? void 0 : _a.isSelected),
-            } }, index.h("div", { key: '10905ce185a7dbae0921ab16c9656f4ef0569749', class: "icon-toggle-container" }, this.hasChildren ? (index.h("ix-icon", { name: index$1.iconChevronRightSmall, size: "24", class: {
+            } }, index.h("div", { key: '95b40939dac08653e875985a160e5aa45ebc353c', class: "icon-toggle-container" }, this.hasChildren ? (index.h("ix-icon", { name: index$1.iconChevronRightSmall, size: "24", class: {
                 ['icon-toggle-down']: !!((_b = this.context) === null || _b === void 0 ? void 0 : _b.isExpanded),
             }, color: "color-std-text", onClick: (e) => {
                 e.preventDefault();
                 e.stopPropagation();
                 this.toggle.emit();
-            }, "aria-label": this.ariaLabelChevronIcon })) : null), index.h("div", { key: 'bf8b74b9b1e67b848a6d9d9f93c3dc01221ad9b9', class: "tree-node-container", onClick: () => {
+            }, "aria-label": this.ariaLabelChevronIcon })) : null), index.h("div", { key: '656eda787f5fbf263ced33629d3ebde110c3f917', class: "tree-node-container", onClick: () => {
                 this.itemClick.emit();
-            } }, index.h("div", { key: '23449d4cc0c593f2fdb2f792eadbbf30481a225b', class: "tree-node-text" }, this.text), index.h("slot", { key: '91ba0ba1b85a0fc42a6ae0c4685c8df4717547f6' }))));
+            } }, index.h("div", { key: 'eba55e54bf655fc0c3d0aacbfc3cb7e49fcb13f6', class: "tree-node-text" }, this.text), index.h("slot", { key: '4747766e632c2bdf7865b25b8d2abf82405c57c8' }))));
     }
 };
 TreeItem.style = treeItemCss;

package/dist/cjs/ix-tree.cjs.entry.js CHANGED Viewed

@@ -591,7 +591,7 @@ const Tree = class {
         this.nodeClicked.emit(id);
     }
     render() {
-        return (index.h(index.Host, { key: '41229d69024d78162075253c32250ebf28e4bb3b', onClick: (event) => this.onTreeItemClick(event) }, index.h("slot", { key: '594c9e61448461dd39a81272f2d2c24b0e560806' })));
+        return (index.h(index.Host, { key: 'ca0d582877d3b2877a1090cc0aeb40f38617cef9', onClick: (event) => this.onTreeItemClick(event) }, index.h("slot", { key: '2d8f21165234243b6d2e2f7c99696fc7343d79f2' })));
     }
     get hostElement() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/ix-typography.cjs.entry.js CHANGED Viewed

@@ -36,7 +36,7 @@ const IxTypography = class {
                 color: IxTypography.getTextColor(this.textColor),
             };
         }
-        return (index.h(index.Host, { key: 'a8642e246a60b32a22e052b7755db3e302836fd6', class: typographyClass, style: style }, index.h("slot", { key: '6b6ae0458fe7bbfbd3fb4ecd9175b50a42e9258e' })));
+        return (index.h(index.Host, { key: 'de007c46746d98dffe4647fca37b0d8dd1967415', class: typographyClass, style: style }, index.h("slot", { key: 'a4ada9ab3f8a64839f4a6c7938b3769f6ef0d6c7' })));
     }
 };
 IxTypography.style = typographyCss;

package/dist/cjs/ix-upload.cjs.entry.js CHANGED Viewed

@@ -168,7 +168,7 @@ const Upload = class {
     render() {
         const disabled = this.disabled || this.state === uploadFileState.UploadFileState.LOADING;
         const _a = this.a11y, { 'aria-label': ariaLabel = 'Upload files' } = _a, a11y = __rest(_a, ['aria-label']);
-        return (index.h(index.Host, Object.assign({ key: 'd27377461517d95412c644cdc3c9f0b4c9edd1f9' }, a11y, { "aria-disabled": disabled }), index.h("div", { key: '983727de99c90d57e0c0e296d054ea80894cc2e3', class: {
+        return (index.h(index.Host, Object.assign({ key: '8b8c68a23b429ca57854751c8a1c9358f78cbc9f' }, a11y, { "aria-disabled": disabled }), index.h("div", { key: '1bb186087ab0d5c545a3f183ce3f6de033a837ad', class: {
                 'file-upload-area': true,
                 'file-over': this.state !== uploadFileState.UploadFileState.LOADING && this.isFileOver,
                 checking: this.state === uploadFileState.UploadFileState.LOADING,
@@ -178,9 +178,9 @@ const Upload = class {
                 if (this.state !== uploadFileState.UploadFileState.LOADING) {
                     this.fileDropped(e);
                 }
-            }, onDragOver: (e) => this.fileOver(e), onDragLeave: () => this.fileLeave(), draggable: !this.disabled }, this.renderUploadState(), index.h("div", { key: 'bd84f1781930713ca4c607a998749108a444b97c' }, index.h("input", { key: '9585965e1f26be9d3c9f918efd6333b3d216ab76', "aria-label": ariaLabel, "aria-disabled": disabled, multiple: this.multiple, type: "file", class: "upload-browser", id: "upload-browser", tabindex: "-1", onChange: (e) => {
+            }, onDragOver: (e) => this.fileOver(e), onDragLeave: () => this.fileLeave(), draggable: !this.disabled }, this.renderUploadState(), index.h("div", { key: '52209f325ad967197e48f651cc6f15365be9562f' }, index.h("input", { key: '91c11214c2f169a9dfbeaaac88a7d928ab389455', "aria-label": ariaLabel, "aria-disabled": disabled, multiple: this.multiple, type: "file", class: "upload-browser", id: "upload-browser", tabindex: "-1", onChange: (e) => {
                 this.fileChangeEvent(e);
-            }, accept: this.accept, disabled: disabled }), index.h("ix-button", { key: 'ab298c4a30538b1408648f9a02ceb7c52fb6b882', variant: "secondary", "aria-disabled": disabled, onClick: () => this.inputElement.click(), disabled: disabled }, this.i18nUploadFile)))));
+            }, accept: this.accept, disabled: disabled }), index.h("ix-button", { key: '807022699c0ba9ac3d81557e88cf1ae498a36cca', variant: "secondary", "aria-disabled": disabled, onClick: () => this.inputElement.click(), disabled: disabled }, this.i18nUploadFile)))));
     }
     get hostElement() { return index.getElement(this); }
 };

package/dist/cjs/ix-validation-tooltip.cjs.entry.js CHANGED Viewed

@@ -136,13 +136,13 @@ const ValidationTooltip = class {
     }
     render() {
         var _a, _b, _c, _d;
-        return (index.h(index.Host, { key: 'af01b12284c6abad7b98a4e8c29e30c24abe206d' }, index.h("slot", { key: 'a55080d265f74185eaa34a6998457343e41f248b' }), index.h("div", { key: '2487996e1b6bd31f8136129cf046cc7c55f09b24', role: "tooltip", style: {
+        return (index.h(index.Host, { key: '63087bd1548b2c8242a70367e9721dabe608b81b' }, index.h("slot", { key: '9b3e52767724c1b6583e2137333bd2055a947de5' }), index.h("div", { key: '37c0ff9d22dea19f3455ae33b2fdc7930f6577d0', role: "tooltip", style: {
                 display: 'none',
                 position: 'fixed',
                 top: '0',
                 left: '0',
                 transform: `translate(${Math.round((_b = (_a = this.tooltipPosition) === null || _a === void 0 ? void 0 : _a.x) !== null && _b !== void 0 ? _b : 0)}px,${Math.round((_d = (_c = this.tooltipPosition) === null || _c === void 0 ? void 0 : _c.y) !== null && _d !== void 0 ? _d : 0)}px)`,
-            }, class: "validation-tooltip text-default" }, this.message, index.h("slot", { key: '9639797207877d1e8107af82ccefec30db7e2f82', name: "tooltip-message" }), index.h("div", { key: '34248d812f34bfa9cd734eab28b3c91af879aecd', id: "arrow" }))));
+            }, class: "validation-tooltip text-default" }, this.message, index.h("slot", { key: 'be776406798e859b60593bdb35ebc8e443c6e94c', name: "tooltip-message" }), index.h("div", { key: '447ebc834dc096b3b60549092b0960d64b294a27', id: "arrow" }))));
     }
     get hostElement() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/ix-workflow-step.cjs.entry.js CHANGED Viewed

@@ -108,18 +108,18 @@ const WorkflowStep = class {
     }
     render() {
         const icons = !this.customIconSlot ? (index.h(index.Fragment, null, index.h("ix-icon", { color: "color-1", name: this.status === 'warning' ? index$1.iconTriangleFilled : index$1.iconCircleFilled, class: "absolute", size: "24" }), index.h("ix-icon", { color: this.iconColor, name: this.iconName, class: "absolute", size: "24", "aria-label": this.getIconAriaLabel() }))) : null;
-        return (index.h(index.Host, { key: '3a93acf2907c533c0a0ddb040278e118c355bc32', class: { 'host-vertical': this.vertical }, onClick: () => this.onStepClick() }, index.h("div", { key: 'e85b6a3859d59afb71fe1cb2718e44712fba509f', tabIndex: 0, class: {
+        return (index.h(index.Host, { key: '69060f0b0d9724d1a7e5d88d723454354a0ae179', class: { 'host-vertical': this.vertical }, onClick: () => this.onStepClick() }, index.h("div", { key: 'e271713f7b57462155e967d2fd74bb911640c6b1', tabIndex: 0, class: {
                 step: true,
                 selected: this.selected,
                 vertical: this.vertical,
                 disabled: this.disabled,
                 clickable: this.clickable && !this.disabled,
-            } }, index.h("div", { key: '2712cbb97cfa21042c0cb4bea1d02f9e61199e55', class: "wrapper" }, index.h("div", { key: '00e2e7a6daf986819d1e420d3b8379cab01abc47', class: {
+            } }, index.h("div", { key: '28fb3c2e870564f3cfa62a402ba75b62ef84d68f', class: "wrapper" }, index.h("div", { key: '7178b44d0f6e20202c62e83af8e983392cf00ecd', class: {
                 line: true,
                 selected: this.selected,
                 [this.status]: true,
                 [this.position]: true,
-            } }), index.h("div", { key: '7a46fa4306b9924ca7df0272f32592a458355774', class: "iconWrapper" }, icons, index.h("slot", { key: '5b750aa1483f64625905a2b39fdce5f067ba853f', name: "custom-icon" }))), index.h("div", { key: '9c2fa968aa7903f90a98e24e845de414844361ee', class: "text" }, index.h("slot", { key: 'dc660f37779d7dde23a131158ae910b46732d896' })))));
+            } }), index.h("div", { key: '8f10884a92e4f0685f20a10cb12cd19b39a7a2f9', class: "iconWrapper" }, icons, index.h("slot", { key: '6e3d96ae17ce0b3b217edef59b1e3999a1d028d5', name: "custom-icon" }))), index.h("div", { key: '80b1b2adc4f110d505e5fcb4263781b11b58ff49', class: "text" }, index.h("slot", { key: '07f9b88ce66abffd1190940968ed20ae6cd5ec09' })))));
     }
     get hostElement() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/ix-workflow-steps.cjs.entry.js CHANGED Viewed

@@ -80,7 +80,7 @@ const WorkflowSteps = class {
         this.updateSteps();
     }
     render() {
-        return (index.h(index.Host, { key: 'fcfd2b61769e31adab006ed935a9776ecdfb8bfe' }, index.h("div", { key: 'd0a264a599b4db3cb289549f608f1e749c91f180', class: { steps: true, vertical: this.vertical } }, index.h("slot", { key: '8b275ef2551f7ad258eef17e9caffd8ca8c558b0' }))));
+        return (index.h(index.Host, { key: '05f04dea227019aa7f0e0a3b24cecb45ed80c452' }, index.h("div", { key: '6423cddc50bc1928ae2f1f78d6b22c12dda49c9d', class: { steps: true, vertical: this.vertical } }, index.h("slot", { key: '44ee3bca297914083a92a66ae3c496e05bd52b94' }))));
     }
     get hostElement() { return index.getElement(this); }
 };