@siemens/ix 0.0.0-20240522073858 → 0.0.0-pr-1318-20240627080522

package/dist/siemens-ix/p-6f83793b.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c,h as o,H as r,g as h}from"./p-f86a894a.js";import{H as d}from"./p-42c66a44.js";import{m as t}from"./p-dead9c8e.js";const b=":host{--ix-checkbox-check-color:var(--theme-color-primary--contrast);display:inline-block;position:relative}: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 ::-webkit-scrollbar{width:0.5rem;height:0.5rem}: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 ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host button{all:unset}:host button{display:inline-flex;position:relative;align-items:center;justify-content:center;width:1.125rem;min-width:1.125rem;max-width:1.125rem;height:1.125rem;min-height:1.125rem;max-height:1.125rem;margin-right:0.5rem}:host button:disabled{background-color:var(--theme-checkbox-unchecked--background--disabled);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color--disabled)}:host button:focus-visible{outline:0.0625rem solid var(--theme-color-focus-bdr);outline-offset:var(--theme-checkbox--focus--outline-offset)}:host input[type=checkbox]{display:none}:host label{display:flex;justify-content:flex-start;align-items:flex-start;width:100%;height:100%}:host ix-typography{margin-top:0.125rem}:host button{background-color:var(--theme-checkbox-unchecked--background);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color)}:host(:hover) button{background-color:var(--theme-checkbox-unchecked--background--hover);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color--hover)}:host(:active) button{background-color:var(--theme-checkbox-unchecked--background--active);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color--active)}:host(.checked) button,:host([indeterminate]) button{background-color:var(--theme-checkbox-checked--background);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color)}:host(.checked:hover) button,:host([indeterminate]:hover) button{background-color:var(--theme-checkbox-checked--background--hover);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color--hover)}:host(.checked:active) button,:host([indeterminate]:active) button{background-color:var(--theme-checkbox-checked--background--active);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color--active)}:host(:disabled) button,:host(.disabled) button{background-color:var(--theme-checkbox-unchecked--background--disabled);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color--disabled)}:host(.checked:disabled) button,:host(.checked.disabled) button,:host([indeterminate]:disabled) button,:host([indeterminate].disabled) button{background-color:var(--theme-checkbox-checked--background--disabled);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color--disabled)}:host(.ix-info) button{--theme-checkbox-unchecked--background:var(--theme-checkbox-unchecked--background--info);--theme-checkbox-unchecked--background--hover:var(--theme-checkbox-unchecked--background--info--hover);--theme-checkbox-unchecked--background--active:var(--theme-checkbox-unchecked--background--info--active);--theme-checkbox-unchecked--border-color:var(--theme-checkbox-unchecked--border-color--info);--theme-checkbox-unchecked--border-color--hover:var(--theme-checkbox-unchecked--border-color--info--hover);--theme-checkbox-unchecked--border-color--active:var(--theme-checkbox-unchecked--border-color--info--active);--theme-checkbox-checked--background:var(--theme-checkbox-checked--background--info);--theme-checkbox-checked--background--hover:var(--theme-checkbox-checked--background--info--hover);--theme-checkbox-checked--background--active:var(--theme-checkbox-checked--background--info--active);--theme-checkbox-checked--border-color:var(--theme-checkbox-checked--border-color--info);--theme-checkbox-checked--border-color--hover:var(--theme-checkbox-checked--border-color--info--hover);--theme-checkbox-checked--border-color--active:var(--theme-checkbox-checked--border-color--info--active);--theme-checkbox-mixed--background:var(--theme-checkbox-mixed--background--info);--theme-checkbox-mixed--background--hover:var(--theme-checkbox-mixed--background--info--hover);--theme-checkbox-mixed--background--active:var(--theme-checkbox-mixed--background--info--active);--theme-checkbox-mixed--border-color:var(--theme-checkbox-mixed--border-color--info);--theme-checkbox-mixed--border-color--hover:var(--theme-checkbox-mixed--border-color--info--hover);--theme-checkbox-mixed--border-color--active:var(--theme-checkbox-mixed--border-color--info--active)}:host(.ix-info) button{background-color:var(--theme-checkbox-unchecked--background);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color)}:host(.ix-info:hover) button{background-color:var(--theme-checkbox-unchecked--background--hover);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color--hover)}:host(.ix-info:active) button{background-color:var(--theme-checkbox-unchecked--background--active);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color--active)}:host(.ix-info.checked) button,:host(.ix-info[indeterminate]) button{background-color:var(--theme-checkbox-checked--background);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color)}:host(.ix-info.checked:hover) button,:host(.ix-info[indeterminate]:hover) button{background-color:var(--theme-checkbox-checked--background--hover);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color--hover)}:host(.ix-info.checked:active) button,:host(.ix-info[indeterminate]:active) button{background-color:var(--theme-checkbox-checked--background--active);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color--active)}:host(.ix-info:disabled) button,:host(.ix-info.disabled) button{background-color:var(--theme-checkbox-unchecked--background--disabled);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color--disabled)}:host(.ix-info.checked:disabled) button,:host(.ix-info.checked.disabled) button,:host(.ix-info[indeterminate]:disabled) button,:host(.ix-info[indeterminate].disabled) button{background-color:var(--theme-checkbox-checked--background--disabled);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color--disabled)}:host(.ix-warning) button{--theme-checkbox-unchecked--background:var(--theme-checkbox-unchecked--background--warning);--theme-checkbox-unchecked--background--hover:var(--theme-checkbox-unchecked--background--warning--hover);--theme-checkbox-unchecked--background--active:var(--theme-checkbox-unchecked--background--warning--active);--theme-checkbox-unchecked--border-color:var(--theme-checkbox-unchecked--border-color--warning);--theme-checkbox-unchecked--border-color--hover:var(--theme-checkbox-unchecked--border-color--warning--hover);--theme-checkbox-unchecked--border-color--active:var(--theme-checkbox-unchecked--border-color--warning--active);--theme-checkbox-checked--background:var(--theme-checkbox-checked--background--warning);--theme-checkbox-checked--background--hover:var(--theme-checkbox-checked--background--warning--hover);--theme-checkbox-checked--background--active:var(--theme-checkbox-checked--background--warning--active);--theme-checkbox-checked--border-color:var(--theme-checkbox-checked--border-color--warning);--theme-checkbox-checked--border-color--hover:var(--theme-checkbox-checked--border-color--warning--hover);--theme-checkbox-checked--border-color--active:var(--theme-checkbox-checked--border-color--warning--active);--theme-checkbox-mixed--background:var(--theme-checkbox-mixed--background--warning);--theme-checkbox-mixed--background--hover:var(--theme-checkbox-mixed--background--warning--hover);--theme-checkbox-mixed--background--active:var(--theme-checkbox-mixed--background--warning--active);--theme-checkbox-mixed--border-color:var(--theme-checkbox-mixed--border-color--warning);--theme-checkbox-mixed--border-color--hover:var(--theme-checkbox-mixed--border-color--warning--hover);--theme-checkbox-mixed--border-color--active:var(--theme-checkbox-mixed--border-color--warning--active)}:host(.ix-warning) button{background-color:var(--theme-checkbox-unchecked--background);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color)}:host(.ix-warning:hover) button{background-color:var(--theme-checkbox-unchecked--background--hover);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color--hover)}:host(.ix-warning:active) button{background-color:var(--theme-checkbox-unchecked--background--active);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color--active)}:host(.ix-warning.checked) button,:host(.ix-warning[indeterminate]) button{background-color:var(--theme-checkbox-checked--background);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color)}:host(.ix-warning.checked:hover) button,:host(.ix-warning[indeterminate]:hover) button{background-color:var(--theme-checkbox-checked--background--hover);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color--hover)}:host(.ix-warning.checked:active) button,:host(.ix-warning[indeterminate]:active) button{background-color:var(--theme-checkbox-checked--background--active);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color--active)}:host(.ix-warning:disabled) button,:host(.ix-warning.disabled) button{background-color:var(--theme-checkbox-unchecked--background--disabled);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color--disabled)}:host(.ix-warning.checked:disabled) button,:host(.ix-warning.checked.disabled) button,:host(.ix-warning[indeterminate]:disabled) button,:host(.ix-warning[indeterminate].disabled) button{background-color:var(--theme-checkbox-checked--background--disabled);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color--disabled)}:host(.ix-invalid--required) button{--theme-checkbox-unchecked--background:var(--theme-checkbox-unchecked--background--invalid);--theme-checkbox-unchecked--background--hover:var(--theme-checkbox-unchecked--background--invalid--hover);--theme-checkbox-unchecked--background--active:var(--theme-checkbox-unchecked--background--invalid--active);--theme-checkbox-unchecked--border-color:var(--theme-checkbox-unchecked--border-color--invalid);--theme-checkbox-unchecked--border-color--hover:var(--theme-checkbox-unchecked--border-color--invalid--hover);--theme-checkbox-unchecked--border-color--active:var(--theme-checkbox-unchecked--border-color--invalid--active);--theme-checkbox-checked--background:var(--theme-checkbox-checked--background--invalid);--theme-checkbox-checked--background--hover:var(--theme-checkbox-checked--background--invalid--hover);--theme-checkbox-checked--background--active:var(--theme-checkbox-checked--background--invalid--active);--theme-checkbox-checked--border-color:var(--theme-checkbox-checked--border-color--invalid);--theme-checkbox-checked--border-color--hover:var(--theme-checkbox-checked--border-color--invalid--hover);--theme-checkbox-checked--border-color--active:var(--theme-checkbox-checked--border-color--invalid--active);--theme-checkbox-mixed--background:var(--theme-checkbox-mixed--background--invalid);--theme-checkbox-mixed--background--hover:var(--theme-checkbox-mixed--background--invalid--hover);--theme-checkbox-mixed--background--active:var(--theme-checkbox-mixed--background--invalid--active);--theme-checkbox-mixed--border-color:var(--theme-checkbox-mixed--border-color--invalid);--theme-checkbox-mixed--border-color--hover:var(--theme-checkbox-mixed--border-color--invalid--hover);--theme-checkbox-mixed--border-color--active:var(--theme-checkbox-mixed--border-color--invalid--active)}:host(.ix-invalid--required) button{background-color:var(--theme-checkbox-unchecked--background);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color)}:host(.ix-invalid--required:hover) button{background-color:var(--theme-checkbox-unchecked--background--hover);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color--hover)}:host(.ix-invalid--required:active) button{background-color:var(--theme-checkbox-unchecked--background--active);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color--active)}:host(.ix-invalid--required.checked) button,:host(.ix-invalid--required[indeterminate]) button{background-color:var(--theme-checkbox-checked--background);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color)}:host(.ix-invalid--required.checked:hover) button,:host(.ix-invalid--required[indeterminate]:hover) button{background-color:var(--theme-checkbox-checked--background--hover);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color--hover)}:host(.ix-invalid--required.checked:active) button,:host(.ix-invalid--required[indeterminate]:active) button{background-color:var(--theme-checkbox-checked--background--active);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color--active)}:host(.ix-invalid--required:disabled) button,:host(.ix-invalid--required.disabled) button{background-color:var(--theme-checkbox-unchecked--background--disabled);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color--disabled)}:host(.ix-invalid--required.checked:disabled) button,:host(.ix-invalid--required.checked.disabled) button,:host(.ix-invalid--required[indeterminate]:disabled) button,:host(.ix-invalid--required[indeterminate].disabled) button{background-color:var(--theme-checkbox-checked--background--disabled);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color--disabled)}:host(.ix-invalid) button{--theme-checkbox-unchecked--background:var(--theme-checkbox-unchecked--background--invalid);--theme-checkbox-unchecked--background--hover:var(--theme-checkbox-unchecked--background--invalid--hover);--theme-checkbox-unchecked--background--active:var(--theme-checkbox-unchecked--background--invalid--active);--theme-checkbox-unchecked--border-color:var(--theme-checkbox-unchecked--border-color--invalid);--theme-checkbox-unchecked--border-color--hover:var(--theme-checkbox-unchecked--border-color--invalid--hover);--theme-checkbox-unchecked--border-color--active:var(--theme-checkbox-unchecked--border-color--invalid--active);--theme-checkbox-checked--background:var(--theme-checkbox-checked--background--invalid);--theme-checkbox-checked--background--hover:var(--theme-checkbox-checked--background--invalid--hover);--theme-checkbox-checked--background--active:var(--theme-checkbox-checked--background--invalid--active);--theme-checkbox-checked--border-color:var(--theme-checkbox-checked--border-color--invalid);--theme-checkbox-checked--border-color--hover:var(--theme-checkbox-checked--border-color--invalid--hover);--theme-checkbox-checked--border-color--active:var(--theme-checkbox-checked--border-color--invalid--active);--theme-checkbox-mixed--background:var(--theme-checkbox-mixed--background--invalid);--theme-checkbox-mixed--background--hover:var(--theme-checkbox-mixed--background--invalid--hover);--theme-checkbox-mixed--background--active:var(--theme-checkbox-mixed--background--invalid--active);--theme-checkbox-mixed--border-color:var(--theme-checkbox-mixed--border-color--invalid);--theme-checkbox-mixed--border-color--hover:var(--theme-checkbox-mixed--border-color--invalid--hover);--theme-checkbox-mixed--border-color--active:var(--theme-checkbox-mixed--border-color--invalid--active)}:host(.ix-invalid) button{background-color:var(--theme-checkbox-unchecked--background);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color)}:host(.ix-invalid:hover) button{background-color:var(--theme-checkbox-unchecked--background--hover);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color--hover)}:host(.ix-invalid:active) button{background-color:var(--theme-checkbox-unchecked--background--active);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color--active)}:host(.ix-invalid.checked) button,:host(.ix-invalid[indeterminate]) button{background-color:var(--theme-checkbox-checked--background);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color)}:host(.ix-invalid.checked:hover) button,:host(.ix-invalid[indeterminate]:hover) button{background-color:var(--theme-checkbox-checked--background--hover);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color--hover)}:host(.ix-invalid.checked:active) button,:host(.ix-invalid[indeterminate]:active) button{background-color:var(--theme-checkbox-checked--background--active);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color--active)}:host(.ix-invalid:disabled) button,:host(.ix-invalid.disabled) button{background-color:var(--theme-checkbox-unchecked--background--disabled);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color--disabled)}:host(.ix-invalid.checked:disabled) button,:host(.ix-invalid.checked.disabled) button,:host(.ix-invalid[indeterminate]:disabled) button,:host(.ix-invalid[indeterminate].disabled) button{background-color:var(--theme-checkbox-checked--background--disabled);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color--disabled)}:host(:disabled),:host(.disabled){pointer-events:none}:host(:disabled) button,:host(:disabled) label,:host(:disabled) input,:host(.disabled) button,:host(.disabled) label,:host(.disabled) input{pointer-events:none}";const i=b;var a=undefined&&undefined.__decorate||function(e,c,o,r){var h=arguments.length,d=h<3?c:r===null?r=Object.getOwnPropertyDescriptor(c,o):r,t;if(typeof Reflect==="object"&&typeof Reflect.decorate==="function")d=Reflect.decorate(e,c,o,r);else for(var b=e.length-1;b>=0;b--)if(t=e[b])d=(h<3?t(d):h>3?t(c,o,d):t(c,o))||d;return h>3&&d&&Object.defineProperty(c,o,d),d};const k=class{constructor(o){e(this,o);this.checkedChange=c(this,"checkedChange",7);this.valueChange=c(this,"valueChange",7);if(o.$hostElement$["s-ei"]){this.formInternals=o.$hostElement$["s-ei"]}else{this.formInternals=o.$hostElement$.attachInternals();o.$hostElement$["s-ei"]=this.formInternals}this.inputRef=t((e=>{e.checked=this.checked}));this.name=undefined;this.value="on";this.label=undefined;this.checked=false;this.disabled=false;this.indeterminate=false;this.required=false}setCheckedState(e){this.checked=e;this.checkedChange.emit(this.checked)}onCheckedChange(){this.updateFormInternalValue()}onValueChange(){this.valueChange.emit(this.value)}componentWillLoad(){this.updateFormInternalValue()}updateFormInternalValue(){var e;if(this.checked){this.formInternals.setFormValue((e=this.value)!==null&&e!==void 0?e:"on")}else{this.formInternals.setFormValue(null)}}hasValidValue(){return Promise.resolve(this.checked)}getAssociatedFormElement(){return Promise.resolve(this.formInternals.form)}updateClassMappings(){}renderCheckmark(){if(this.checked){return o("svg",{width:"18",height:"18",viewBox:"0 0 18 18",fill:"none",xmlns:"http://www.w3.org/2000/svg"},o("path",{d:"M3.65625 8.15625L8.4375 12.9375L14.625 3.9375",stroke:"var(--ix-checkbox-check-color)","stroke-width":"2"}))}if(this.indeterminate){return o("svg",{width:"18",height:"18",viewBox:"0 0 18 18",fill:"none",xmlns:"http://www.w3.org/2000/svg"},o("rect",{width:"18",height:"18",fill:"transparent"}),o("rect",{x:"3",y:"8",width:"12",height:"2",fill:"var(--ix-checkbox-check-color)"}))}}render(){return o(r,{key:"0cc32a63622ae40829ef544d116471d5e9666d5f","aria-checked":`${this.checked}`,"aria-disabled":`${this.disabled}`,role:"checkbox",class:{disabled:this.disabled,checked:this.checked}},o("label",{key:"b21ec6c0b7937c5f998fc6edb87a77efa9a0c034"},o("input",{key:"e15124777edfa5841051be691325ea7bbdd47adf","aria-checked":`${this.checked}`,disabled:this.disabled,checked:this.checked,ref:this.inputRef,type:"checkbox",onChange:()=>this.setCheckedState(!this.checked)}),o("button",{key:"572b191b7f83581f70ab168587804e1be60e99c5",disabled:this.disabled,class:{checked:this.checked},onClick:()=>this.setCheckedState(!this.checked)},this.renderCheckmark()),o("ix-typography",{key:"0c757feb616094d959fc67969c291b8b3f280263",format:"label",textColor:this.disabled?"weak":"std"},this.label,o("slot",{key:"ed1f3922fb8d9398224d0f80d86ea87e83a63fb8"}))))}static get formAssociated(){return true}get hostElement(){return h(this)}static get watchers(){return{checked:["onCheckedChange"],value:["onValueChange"]}}};a([d()],k.prototype,"updateClassMappings",null);k.style=i;export{k as ix_checkbox};
+//# sourceMappingURL=p-6f83793b.entry.js.map

package/dist/siemens-ix/p-6f83793b.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["checkboxCss","IxCheckboxStyle0","Checkbox","this","inputRef","makeRef","checkboxRef","checked","setCheckedState","newChecked","checkedChange","emit","onCheckedChange","updateFormInternalValue","onValueChange","valueChange","value","componentWillLoad","formInternals","setFormValue","_a","hasValidValue","Promise","resolve","getAssociatedFormElement","form","updateClassMappings","renderCheckmark","h","width","height","viewBox","fill","xmlns","d","stroke","indeterminate","x","y","render","Host","key","disabled","role","class","ref","type","onChange","onClick","format","textColor","label","__decorate","HookValidationLifecycle"],"sources":["src/components/checkbox/checkbox.scss?tag=ix-checkbox&encapsulation=shadow","src/components/checkbox/checkbox.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2024 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 @import 'mixins/shadow-dom/component';\n\n:host {\n  --ix-checkbox-check-color: var(--theme-color-primary--contrast);\n\n  @include ix-component;\n  display: inline-block;\n  position: relative;\n\n  button {\n    all: unset;\n  }\n\n  button {\n    display: inline-flex;\n    position: relative;\n\n    align-items: center;\n    justify-content: center;\n\n    width: 1.125rem;\n    min-width: 1.125rem;\n    max-width: 1.125rem;\n    height: 1.125rem;\n    min-height: 1.125rem;\n    max-height: 1.125rem;\n    margin-right: 0.5rem;\n  }\n\n  button:disabled {\n    background-color: var(--theme-checkbox-unchecked--background--disabled);\n    border: var(--theme-checkbox--border-thickness) solid\n      var(--theme-checkbox-unchecked--border-color--disabled);\n  }\n\n  button:focus-visible {\n    outline: 0.0625rem solid var(--theme-color-focus-bdr);\n    outline-offset: var(--theme-checkbox--focus--outline-offset);\n  }\n\n  input[type=\"checkbox\"] {\n    display: none;\n  }\n\n  label {\n    display: flex;\n\n    justify-content: flex-start;\n    align-items: flex-start;\n\n    width: 100%;\n    height: 100%;\n  }\n\n  ix-typography {\n    margin-top: 0.125rem;\n  }\n}\n\n@mixin checkbox-base() {\n  :host {\n    button {\n      background-color: var(--theme-checkbox-unchecked--background);\n      border: var(--theme-checkbox--border-thickness) solid\n        var(--theme-checkbox-unchecked--border-color);\n    }\n  }\n\n  :host(:hover) {\n    button {\n      background-color: var(--theme-checkbox-unchecked--background--hover);\n      border: var(--theme-checkbox--border-thickness) solid\n        var(--theme-checkbox-unchecked--border-color--hover);\n    }\n  }\n\n  :host(:active) {\n    button {\n      background-color: var(--theme-checkbox-unchecked--background--active);\n      border: var(--theme-checkbox--border-thickness) solid\n        var(--theme-checkbox-unchecked--border-color--active);\n    }\n  }\n\n  :host(.checked),\n  :host([indeterminate]) {\n    button {\n      background-color: var(--theme-checkbox-checked--background);\n      border: var(--theme-checkbox--border-thickness) solid\n        var(--theme-checkbox-checked--border-color);\n    }\n  }\n\n  :host(.checked:hover),\n  :host([indeterminate]:hover) {\n    button {\n      background-color: var(--theme-checkbox-checked--background--hover);\n      border: var(--theme-checkbox--border-thickness) solid\n        var(--theme-checkbox-checked--border-color--hover);\n    }\n  }\n\n  :host(.checked:active),\n  :host([indeterminate]:active) {\n    button {\n      background-color: var(--theme-checkbox-checked--background--active);\n      border: var(--theme-checkbox--border-thickness) solid\n        var(--theme-checkbox-checked--border-color--active);\n    }\n  }\n\n  :host(:disabled),\n  :host(.disabled) {\n    button {\n      background-color: var(--theme-checkbox-unchecked--background--disabled);\n      border: var(--theme-checkbox--border-thickness) solid\n        var(--theme-checkbox-unchecked--border-color--disabled);\n    }\n  }\n\n  :host(.checked:disabled),\n  :host(.checked.disabled),\n  :host([indeterminate]:disabled),\n  :host([indeterminate].disabled) {\n    button {\n      background-color: var(--theme-checkbox-checked--background--disabled);\n      border: var(--theme-checkbox--border-thickness) solid\n        var(--theme-checkbox-checked--border-color--disabled);\n    }\n  }\n}\n\n@mixin checkbox-variant($selector) {\n  :host(#{$selector}) {\n    button {\n      @content;\n    }\n  }\n\n  :host(#{$selector}) {\n    button {\n      background-color: var(--theme-checkbox-unchecked--background);\n      border: var(--theme-checkbox--border-thickness) solid\n        var(--theme-checkbox-unchecked--border-color);\n    }\n  }\n\n  :host(#{$selector}:hover) {\n    button {\n      background-color: var(--theme-checkbox-unchecked--background--hover);\n      border: var(--theme-checkbox--border-thickness) solid\n        var(--theme-checkbox-unchecked--border-color--hover);\n    }\n  }\n\n  :host(#{$selector}:active) {\n    button {\n      background-color: var(--theme-checkbox-unchecked--background--active);\n      border: var(--theme-checkbox--border-thickness) solid\n        var(--theme-checkbox-unchecked--border-color--active);\n    }\n  }\n\n  :host(#{$selector}.checked),\n  :host(#{$selector}[indeterminate]) {\n    button {\n      background-color: var(--theme-checkbox-checked--background);\n      border: var(--theme-checkbox--border-thickness) solid\n        var(--theme-checkbox-checked--border-color);\n    }\n  }\n\n  :host(#{$selector}.checked:hover),\n  :host(#{$selector}[indeterminate]:hover) {\n    button {\n      background-color: var(--theme-checkbox-checked--background--hover);\n      border: var(--theme-checkbox--border-thickness) solid\n        var(--theme-checkbox-checked--border-color--hover);\n    }\n  }\n\n  :host(#{$selector}.checked:active),\n  :host(#{$selector}[indeterminate]:active) {\n    button {\n      background-color: var(--theme-checkbox-checked--background--active);\n      border: var(--theme-checkbox--border-thickness) solid\n        var(--theme-checkbox-checked--border-color--active);\n    }\n  }\n\n  :host(#{$selector}:disabled),\n  :host(#{$selector}.disabled) {\n    button {\n      background-color: var(--theme-checkbox-unchecked--background--disabled);\n      border: var(--theme-checkbox--border-thickness) solid\n        var(--theme-checkbox-unchecked--border-color--disabled);\n    }\n  }\n\n  :host(#{$selector}.checked:disabled),\n  :host(#{$selector}.checked.disabled),\n  :host(#{$selector}[indeterminate]:disabled),\n  :host(#{$selector}[indeterminate].disabled) {\n    button {\n      background-color: var(--theme-checkbox-checked--background--disabled);\n      border: var(--theme-checkbox--border-thickness) solid\n        var(--theme-checkbox-checked--border-color--disabled);\n    }\n  }\n}\n\n@mixin define-checkbox-vars($state, $type) {\n  --theme-checkbox-#{$state}--background: var(--theme-checkbox-#{$state}--background--#{$type});\n  --theme-checkbox-#{$state}--background--hover: var(--theme-checkbox-#{$state}--background--#{$type}--hover);\n  --theme-checkbox-#{$state}--background--active: var(--theme-checkbox-#{$state}--background--#{$type}--active);\n\n  --theme-checkbox-#{$state}--border-color: var(--theme-checkbox-#{$state}--border-color--#{$type});\n  --theme-checkbox-#{$state}--border-color--hover: var(--theme-checkbox-#{$state}--border-color--#{$type}--hover);\n  --theme-checkbox-#{$state}--border-color--active: var(--theme-checkbox-#{$state}--border-color--#{$type}--active);\n}\n\n@include checkbox-base();\n@include checkbox-variant(\n  $selector: '.ix-info',\n) {\n  @include define-checkbox-vars('unchecked', 'info');\n  @include define-checkbox-vars('checked', 'info');\n  @include define-checkbox-vars('mixed', 'info');\n}\n\n@include checkbox-variant(\n  $selector: '.ix-warning',\n) {\n  @include define-checkbox-vars('unchecked', 'warning');\n  @include define-checkbox-vars('checked', 'warning');\n  @include define-checkbox-vars('mixed', 'warning');\n}\n\n@include checkbox-variant(\n  $selector: '.ix-invalid--required',\n) {\n  @include define-checkbox-vars('unchecked', 'invalid');\n  @include define-checkbox-vars('checked', 'invalid');\n  @include define-checkbox-vars('mixed', 'invalid');\n}\n\n@include checkbox-variant(\n  $selector: '.ix-invalid',\n) {\n  @include define-checkbox-vars('unchecked', 'invalid');\n  @include define-checkbox-vars('checked', 'invalid');\n  @include define-checkbox-vars('mixed', 'invalid');\n}\n\n:host(:disabled),\n:host(.disabled) {\n  pointer-events: none;\n\n  button,\n  label,\n  input {\n    pointer-events: none;\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2024 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  Event,\n  EventEmitter,\n  Host,\n  Prop,\n  Watch,\n  h,\n  Element,\n  Method,\n} from '@stencil/core';\nimport { HookValidationLifecycle, IxFormComponent } from '../utils/field';\nimport { makeRef } from '../utils/make-ref';\n\n/**\n * @since 2.4.0\n * @form-ready 2.4.0\n */\n@Component({\n  tag: 'ix-checkbox',\n  styleUrl: 'checkbox.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class Checkbox implements IxFormComponent<string> {\n  @Element() hostElement!: HTMLIxCheckboxElement;\n\n  @AttachInternals() formInternals!: ElementInternals;\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   * Label for the checkbox component\n   */\n  @Prop() label?: string;\n\n  /**\n   * Checked state of the checkbox component\n   */\n  @Prop({ reflect: true, mutable: true }) checked: boolean = false;\n\n  /**\n   * Disabled state of the checkbox component\n   */\n  @Prop({ reflect: true }) disabled: boolean = false;\n\n  /**\n   * Indeterminate state of the checkbox component\n   */\n  @Prop({ reflect: true }) indeterminate: boolean = 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   * Event emitted when the checked state of the checkbox changes\n   */\n  @Event() checkedChange!: EventEmitter<boolean>;\n\n  /**\n   * Event emitted when the value of the checkbox changes\n   */\n  @Event() valueChange!: EventEmitter<string>;\n\n  private inputRef = makeRef<HTMLInputElement>((checkboxRef) => {\n    checkboxRef.checked = this.checked;\n  });\n\n  private setCheckedState(newChecked: boolean) {\n    this.checked = newChecked;\n    this.checkedChange.emit(this.checked);\n  }\n\n  @Watch('checked')\n  onCheckedChange() {\n    this.updateFormInternalValue();\n  }\n\n  @Watch('value')\n  onValueChange() {\n    this.valueChange.emit(this.value);\n  }\n\n  componentWillLoad() {\n    this.updateFormInternalValue();\n  }\n\n  updateFormInternalValue() {\n    if (this.checked) {\n      this.formInternals.setFormValue(this.value ?? 'on');\n    } else {\n      this.formInternals.setFormValue(null);\n    }\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  @HookValidationLifecycle()\n  updateClassMappings() {}\n\n  private renderCheckmark() {\n    if (this.checked) {\n      return (\n        <svg\n          width=\"18\"\n          height=\"18\"\n          viewBox=\"0 0 18 18\"\n          fill=\"none\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n        >\n          <path\n            d=\"M3.65625 8.15625L8.4375 12.9375L14.625 3.9375\"\n            stroke=\"var(--ix-checkbox-check-color)\"\n            stroke-width=\"2\"\n          />\n        </svg>\n      );\n    }\n\n    if (this.indeterminate) {\n      return (\n        <svg\n          width=\"18\"\n          height=\"18\"\n          viewBox=\"0 0 18 18\"\n          fill=\"none\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n        >\n          <rect width=\"18\" height=\"18\" fill=\"transparent\" />\n          <rect\n            x=\"3\"\n            y=\"8\"\n            width=\"12\"\n            height=\"2\"\n            fill=\"var(--ix-checkbox-check-color)\"\n          />\n        </svg>\n      );\n    }\n  }\n\n  render() {\n    return (\n      <Host\n        aria-checked={`${this.checked}`}\n        aria-disabled={`${this.disabled}`}\n        role=\"checkbox\"\n        class={{\n          disabled: this.disabled,\n          checked: this.checked,\n        }}\n      >\n        <label>\n          <input\n            aria-checked={`${this.checked}`}\n            disabled={this.disabled}\n            checked={this.checked}\n            ref={this.inputRef}\n            type=\"checkbox\"\n            onChange={() => this.setCheckedState(!this.checked)}\n          />\n          <button\n            disabled={this.disabled}\n            class={{\n              checked: this.checked,\n            }}\n            onClick={() => this.setCheckedState(!this.checked)}\n          >\n            {this.renderCheckmark()}\n          </button>\n          <ix-typography\n            format=\"label\"\n            textColor={this.disabled ? 'weak' : 'std'}\n          >\n            {this.label}\n            <slot></slot>\n          </ix-typography>\n        </label>\n      </Host>\n    );\n  }\n}\n"],"mappings":"mIAAA,MAAMA,EAAc,u6kBACpB,MAAAC,EAAeD,E,iXCiCFE,EAAQ,M,2RAoDXC,KAAAC,SAAWC,GAA2BC,IAC5CA,EAAYC,QAAUJ,KAAKI,OAAO,I,+BAxCK,K,kCAUkB,M,cAKd,M,mBAKK,M,cAOd,K,CAgB5B,eAAAC,CAAgBC,GACtBN,KAAKI,QAAUE,EACfN,KAAKO,cAAcC,KAAKR,KAAKI,Q,CAI/B,eAAAK,GACET,KAAKU,yB,CAIP,aAAAC,GACEX,KAAKY,YAAYJ,KAAKR,KAAKa,M,CAG7B,iBAAAC,GACEd,KAAKU,yB,CAGP,uBAAAA,G,MACE,GAAIV,KAAKI,QAAS,CAChBJ,KAAKe,cAAcC,cAAaC,EAAAjB,KAAKa,SAAK,MAAAI,SAAA,EAAAA,EAAI,K,KACzC,CACLjB,KAAKe,cAAcC,aAAa,K,EAMpC,aAAAE,GACE,OAAOC,QAAQC,QAAQpB,KAAKI,Q,CAK9B,wBAAAiB,GACE,OAAOF,QAAQC,QAAQpB,KAAKe,cAAcO,K,CAI5C,mBAAAC,GAAmB,CAEX,eAAAC,GACN,GAAIxB,KAAKI,QAAS,CAChB,OACEqB,EAAA,OACEC,MAAM,KACNC,OAAO,KACPC,QAAQ,YACRC,KAAK,OACLC,MAAM,8BAENL,EAAA,QACEM,EAAE,gDACFC,OAAO,iCAAgC,eAC1B,M,CAMrB,GAAIhC,KAAKiC,cAAe,CACtB,OACER,EAAA,OACEC,MAAM,KACNC,OAAO,KACPC,QAAQ,YACRC,KAAK,OACLC,MAAM,8BAENL,EAAA,QAAMC,MAAM,KAAKC,OAAO,KAAKE,KAAK,gBAClCJ,EAAA,QACES,EAAE,IACFC,EAAE,IACFT,MAAM,KACNC,OAAO,IACPE,KAAK,mC,EAOf,MAAAO,GACE,OACEX,EAACY,EAAI,CAAAC,IAAA,0DACW,GAAGtC,KAAKI,UAAS,gBAChB,GAAGJ,KAAKuC,WACvBC,KAAK,WACLC,MAAO,CACLF,SAAUvC,KAAKuC,SACfnC,QAASJ,KAAKI,UAGhBqB,EAAA,SAAAa,IAAA,4CACEb,EAAA,SAAAa,IAAA,0DACgB,GAAGtC,KAAKI,UACtBmC,SAAUvC,KAAKuC,SACfnC,QAASJ,KAAKI,QACdsC,IAAK1C,KAAKC,SACV0C,KAAK,WACLC,SAAU,IAAM5C,KAAKK,iBAAiBL,KAAKI,WAE7CqB,EAAA,UAAAa,IAAA,2CACEC,SAAUvC,KAAKuC,SACfE,MAAO,CACLrC,QAASJ,KAAKI,SAEhByC,QAAS,IAAM7C,KAAKK,iBAAiBL,KAAKI,UAEzCJ,KAAKwB,mBAERC,EAAA,iBAAAa,IAAA,2CACEQ,OAAO,QACPC,UAAW/C,KAAKuC,SAAW,OAAS,OAEnCvC,KAAKgD,MACNvB,EAAA,QAAAa,IAAA,+C,8JA7EVW,EAAA,CADCC,K"}

package/dist/siemens-ix/p-70a7bd22.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as i,h as e,H as s,g as o}from"./p-f86a894a.js";import{A as r}from"./p-c09553f3.js";import{O as h}from"./p-224ebf90.js";import{c as n}from"./p-e898862b.js";import{H as a}from"./p-42c66a44.js";import{m as l}from"./p-dead9c8e.js";import{a as d}from"./p-36c0f378.js";const c=":host{display:inline-block;position:relative;min-height:2rem;height:auto;border-radius:var(--theme-input--border-radius)}: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 ::-webkit-scrollbar{width:0.5rem;height:0.5rem}: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 ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .d-none{display:none}:host .select{position:relative;display:flex;align-items:center;width:100%;background-color:var(--theme-input--background);border:var(--theme-input--border-thickness) solid var(--theme-input--border-color);border-radius:var(--theme-input--border-radius);padding:0 0 0 0.5rem;box-shadow:var(--theme-inset-shadow-1) !important}:host .select:not(.disabled):not(:disabled){cursor:pointer}:host .select:not(.disabled):not(:disabled):hover{background-color:var(--theme-input--background--hover);border-color:var(--theme-input--border-color--hover)}:host .select:focus-within{background-color:var(--theme-input--background--focus);border-color:var(--theme-input--border-color--focus);outline:1px solid #119fff;outline-offset:var(--theme-input--focus--outline-offset)}:host .select.readonly,:host .select.disabled{box-shadow:none !important;border:none;border-radius:0;cursor:pointer}:host .select.readonly,:host .select.readonly:hover,:host .select.readonly:active,:host .select.disabled,:host .select.disabled:hover,:host .select.disabled:active{background-color:transparent !important}:host .select.readonly:focus,:host .select.readonly:focus-within,:host .select.readonly:focus-visible,:host .select.disabled:focus,:host .select.disabled:focus-within,:host .select.disabled:focus-visible{outline:none}:host .select.readonly input:focus,:host .select.readonly input:focus-visible,:host .select.disabled input:focus,:host .select.disabled input:focus-visible{outline:none}:host .select.disabled{border-bottom:var(--theme-input--border-thickness) solid var(--theme-color-weak-bdr)}:host .select.disabled input{color:var(--theme-color-weak-text)}:host .select.readonly{border-bottom:var(--theme-input--border-thickness) solid var(--theme-color-soft-bdr)}:host .select.readonly input{color:var(--theme-color-std-text)}:host .hidden{display:none !important}:host .trigger{display:flex;align-items:center;flex-grow:1;height:100%}:host .input-container{display:flex;position:relative;align-items:flex-start;width:100%;height:100%}:host .input-container .chips{position:relative;display:flex;align-items:center;flex-wrap:wrap;height:100%;max-height:3.5rem;flex-grow:1;overflow-y:auto}:host .input-container .chips>ix-filter-chip{margin:0.1rem}:host .input-container input{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text);background:transparent;height:1.75rem;width:100%}:host .input-container input,:host .input-container input:hover,:host .input-container input:focus-visible{border:none;outline:none}:host .input-container input::-moz-placeholder{color:var(--theme-input-select-icon--color)}:host .input-container input::placeholder{color:var(--theme-input-select-icon--color)}:host .input-container input.hide-placeholder::-moz-placeholder{opacity:0}:host .input-container input.hide-placeholder::placeholder{opacity:0}:host .dropdown-visible{--ix-icon-button-color:var(--theme-color-dynamic--hover)}:host .add-item{display:flex;justify-content:flex-start;align-items:center;position:relative;width:100%}:host .select-list-header{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;align-items:center;height:2rem;color:var(--theme-select-list-item-hint--color);margin:0 0.5rem 0 1rem}:host(.ix-info:not(.disabled):not(:disabled):not([disabled])) .select{border-color:var(--theme-input--border-color--info)}:host(.ix-info:not(.disabled):not(:disabled):not([disabled])) .select:hover{border-color:var(--theme-input--border-color--info--hover) !important}:host(.ix-info:not(.disabled):not(:disabled):not([disabled])) .select:active{border-color:var(--theme-input--border-color--info--active) !important}:host(.ix-warning:not(.disabled):not(:disabled):not([disabled])) .select{border-color:var(--theme-input--border-color--warning)}:host(.ix-warning:not(.disabled):not(:disabled):not([disabled])) .select:hover{border-color:var(--theme-input--border-color--warning--hover) !important}:host(.ix-warning:not(.disabled):not(:disabled):not([disabled])) .select:active{border-color:var(--theme-input--border-color--warning--active) !important}:host([class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled])) .select,:host(.ix-invalid--required:not(.disabled):not(:disabled):not([disabled])) .select{border-color:var(--theme-input--border-color--invalid);background-color:var(--theme-input--background--invalid);box-shadow:none}:host([class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled])) .select:hover,:host(.ix-invalid--required:not(.disabled):not(:disabled):not([disabled])) .select:hover{border-color:var(--theme-input--border-color--invalid--hover) !important}:host([class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled])) .select:active,:host(.ix-invalid--required:not(.disabled):not(:disabled):not([disabled])) .select:active{border-color:var(--theme-input--border-color--invalid--active) !important}";const u=c;var b=undefined&&undefined.__decorate||function(t,i,e,s){var o=arguments.length,r=o<3?i:s===null?s=Object.getOwnPropertyDescriptor(i,e):s,h;if(typeof Reflect==="object"&&typeof Reflect.decorate==="function")r=Reflect.decorate(t,i,e,s);else for(var n=t.length-1;n>=0;n--)if(h=t[n])r=(o<3?h(r):o>3?h(i,e,r):h(i,e))||r;return o>3&&r&&Object.defineProperty(i,e,r),r};const f=class{constructor(e){t(this,e);this.valueChange=i(this,"valueChange",7);this.itemSelectionChange=i(this,"itemSelectionChange",7);this.inputChange=i(this,"inputChange",7);this.addItem=i(this,"addItem",7);this.ixBlur=i(this,"ixBlur",7);if(e.$hostElement$["s-ei"]){this.formInternals=e.$hostElement$["s-ei"]}else{this.formInternals=e.$hostElement$.attachInternals();e.$hostElement$["s-ei"]=this.formInternals}this.inputRef=l();this.focusControllerCallbackBind=this.focusDropdownItem.bind(this);this.itemObserver=n((()=>{this.arrowFocusController.items=this.visibleNonShadowItems}));this.name=undefined;this.required=false;this.label=undefined;this.warningText=undefined;this.infoText=undefined;this.invalidText=undefined;this.validText=undefined;this.helperText=undefined;this.showTextAsTooltip=undefined;this.selectedIndices=undefined;this.value=[];this.allowClear=false;this.mode="single";this.editable=false;this.disabled=false;this.readonly=false;this.i18nPlaceholder="Select an option";this.i18nPlaceholderEditable="Type of select option";this.i18nSelectListHeader="Please select an option";this.i18nNoMatches="No matches";this.hideListHeader=false;this.dropdownShow=false;this.selectedLabels=undefined;this.dropdownWrapperRef=undefined;this.dropdownAnchor=undefined;this.isDropdownEmpty=false;this.navigationItem=null;this.inputFilterText=undefined;this.inputValue=null;this.isInvalid=false;this.isValid=false;this.isInfo=false;this.isWarning=false}get nonShadowItems(){return Array.from(this.hostElement.querySelectorAll("ix-select-item"))}get visibleNonShadowItems(){return this.nonShadowItems.filter((t=>!t.classList.contains("d-none")))}get shadowItems(){return Array.from(this.hostElement.shadowRoot.querySelectorAll("ix-select-item"))}get visibleShadowItems(){return this.shadowItems.filter((t=>!t.classList.contains("d-none")))}get items(){return[...this.nonShadowItems,...this.shadowItems]}get visibleItems(){return this.items.filter((t=>!t.classList.contains("d-none")))}get selectedItems(){return this.items.filter((t=>t.selected))}get addItemButton(){return this.hostElement.shadowRoot.querySelector(".add-item")}get isSingleMode(){return this.mode==="single"}get isMultipleMode(){return this.mode==="multiple"}get isEveryDropdownItemHidden(){return this.items.every((t=>t.classList.contains("d-none")))}watchSelectedIndices(t){this.value=t;this.updateSelection()}watchValue(t){this.selectedIndices=t;this.updateSelection()}watchDropdownShow(t){if(t){this.arrowFocusController=new r(this.visibleNonShadowItems,this.dropdownRef,this.focusControllerCallbackBind);this.arrowFocusController.wrap=!this.editable;this.itemObserver.observe(this.dropdownRef,{childList:true,subtree:true})}else{this.arrowFocusController.disconnect();this.itemObserver.disconnect()}}onItemClicked(t){const i=t.detail;this.itemClick(i)}async updateFormInternalValue(t){if(Array.isArray(t)){this.formInternals.setFormValue(t.join(","));return}this.formInternals.setFormValue(t)}async hasValidValue(){return this.required&&!!this.hasValue()}hasValue(){if(Array.isArray(this.value)){return!!this.value.length}return!!this.value}focusDropdownItem(t){var i,e;this.navigationItem=null;if(t<this.visibleNonShadowItems.length){const s=(e=(i=this.visibleNonShadowItems[t])===null||i===void 0?void 0:i.shadowRoot)===null||e===void 0?void 0:e.querySelector("ix-dropdown-item");requestAnimationFrame((()=>{s.shadowRoot.querySelector("button").focus()}))}}itemClick(t){this.value=this.toggleValue(t);this.updateSelection();this.emitValueChange(this.value)}emitAddItem(t){if(t===undefined||t.trim()===""){return}const i=document.createElement("ix-select-item");i.value=t;i.label=t;this.customItemsContainerRef.appendChild(i);this.clearInput();this.itemClick(t);this.addItem.emit(t)}toggleValue(t){if(!this.isMultipleMode){return t}if(!this.value){return[t]}let i=this.value;if(!Array.isArray(i)){i=[i]}if(i.includes(t)){return i.filter((i=>i!==t))}else{return[...i,t]}}updateSelection(){var t;let i=[];if(this.value){i=Array.isArray(this.value)?[...this.value]:[this.value]}this.items.forEach((t=>{t.selected=i.some((i=>{if(typeof i!==typeof t.value){return i.toString()===t.value.toString()}else{return i===t.value}}))}));this.selectedLabels=this.selectedItems.map((t=>t.label));if(this.isSingleMode&&((t=this.selectedLabels)===null||t===void 0?void 0:t.length)){this.inputValue=this.selectedLabels[0];this.input&&(this.input.value=this.inputValue);return}this.inputValue=null}emitValueChange(t){this.valueChange.emit(t);if(!t){this.itemSelectionChange.emit([])}else{this.itemSelectionChange.emit(Array.isArray(t)?t:[t])}this.updateFormInternalValue(t)}componentDidLoad(){this.input.addEventListener("input",(()=>{this.dropdownShow=true;this.inputChange.emit(this.input.value)}))}componentWillLoad(){if(this.selectedIndices&&!this.value){this.value=this.selectedIndices}this.updateSelection();this.updateFormInternalValue(this.value)}onLabelChange(t){t.preventDefault();t.stopImmediatePropagation();this.updateSelection()}disconnectedCallback(){if(this.itemMutationObserver){this.itemMutationObserver.disconnect()}}itemExists(t){return this.items.find((i=>i.label===t))}dropdownVisibilityChanged(t){this.dropdownShow=t.detail;if(t.detail){this.input.focus();this.input.select();this.removeHiddenFromItems();this.isDropdownEmpty=this.isEveryDropdownItemHidden}else{this.navigationItem=null;this.updateSelection();this.inputFilterText=""}}async onKeyDown(t){if(t.code==="ArrowDown"||t.code==="ArrowUp"){await this.onArrowNavigation(t,t.code)}if(!this.dropdownShow){return}if(t.code==="Enter"||t.code==="NumpadEnter"){await this.onEnterNavigation()}if(t.code==="Escape"){this.dropdownShow=false}}async onEnterNavigation(){var t;if(this.isMultipleMode){return}let i;if(this.editable&&!this.itemExists(this.inputFilterText)){this.emitAddItem(this.inputFilterText);i=this.items[this.items.length-1]}if(i){i.onItemClick()}await((t=this.dropdownRef)===null||t===void 0?void 0:t.updatePosition());if(this.isSingleMode&&!this.editable){this.dropdownShow=false}}async onArrowNavigation(t,i){if(t.defaultPrevented){return}t.preventDefault();t.stopPropagation();this.dropdownShow=true;if(!this.navigationItem&&document.activeElement===this.hostElement){if(this.visibleItems.length){this.applyFocusTo(this.visibleItems.shift())}else if(this.isAddItemVisible()){this.focusAddItemButton()}return}const e=i==="ArrowUp";const s=document.activeElement?this.visibleNonShadowItems.indexOf(document.activeElement):-1;if(s===0){if(!this.visibleShadowItems.length&&this.isAddItemVisible()){this.focusAddItemButton()}else{this.applyFocusTo(this.visibleShadowItems.pop())}return}else if(s!==-1&&s===this.visibleNonShadowItems.length-1){if(this.visibleShadowItems.length){this.applyFocusTo(this.visibleShadowItems.shift())}else if(this.isAddItemVisible()){this.focusAddItemButton()}return}if(!this.navigationItem){return}if(this.isAddItemVisible()&&this.addItemRef.contains(await this.navigationItem.getDropdownItemElement())){if(e){this.applyFocusTo(this.visibleItems.pop())}else{if(this.visibleItems.length){this.applyFocusTo(this.visibleItems.shift())}}return}const o=this.visibleShadowItems.indexOf(this.navigationItem);if(e){if(o===0){if(this.visibleNonShadowItems.length){this.applyFocusTo(this.visibleNonShadowItems.pop())}else if(this.isAddItemVisible()){this.focusAddItemButton()}}else{this.applyFocusTo(this.visibleShadowItems[o-1])}}else{if(o===this.visibleShadowItems.length-1){if(this.isAddItemVisible()){this.focusAddItemButton()}else{this.applyFocusTo(this.visibleItems.shift())}}else{this.applyFocusTo(this.visibleShadowItems[o+1])}}}applyFocusTo(t){if(!t){return}this.navigationItem=t;setTimeout((()=>{t.shadowRoot.querySelector("ix-dropdown-item").shadowRoot.querySelector("button").focus()}))}focusAddItemButton(){var t,i;if(this.addItemButton){(i=(t=this.addItemButton.shadowRoot)===null||t===void 0?void 0:t.querySelector("button"))===null||i===void 0?void 0:i.focus();this.navigationItem=this.addItemRef}}filterItemsWithTypeahead(){this.inputFilterText=this.input.value;if(this.isSingleMode&&this.inputFilterText===this.selectedLabels[0]){return}if(this.inputFilterText){this.items.forEach((t=>{t.classList.remove("d-none");if(!t.label.toLowerCase().includes(this.inputFilterText.toLowerCase())){t.classList.add("d-none")}}))}else{this.removeHiddenFromItems()}if(this.arrowFocusController){this.arrowFocusController.items=this.visibleNonShadowItems}this.isDropdownEmpty=this.isEveryDropdownItemHidden}removeHiddenFromItems(){this.items.forEach((t=>{t.classList.remove("d-none")}))}clearInput(){this.input.value="";this.inputFilterText=""}clear(){this.clearInput();this.selectedLabels=[];this.value=[];this.emitValueChange([]);this.dropdownShow=false}onInputBlur(t){this.ixBlur.emit();if(this.editable){return}if(this.isSingleMode){return}const i=t.target;if(!this.dropdownShow&&this.mode!=="multiple"){i.value=this.selectedLabels.toString()}}placeholderValue(){if(this.disabled){return""}if(this.readonly){return""}if(this.editable){return this.i18nPlaceholderEditable}return this.i18nPlaceholder}isAddItemVisible(){return!this.itemExists(this.inputFilterText)&&this.editable&&this.inputFilterText}onValidationChange({isInvalid:t,isInvalidByRequired:i,isValid:e,isInfo:s,isWarning:o}){this.isInvalid=t||i;this.isValid=e;this.isWarning=o;this.isInfo=s}async getAssociatedFormElement(){return this.formInternals.form}getNativeInputElement(){return Promise.resolve(this.input)}render(){var t,i,o,r;return e(s,{key:"21e0971bd52ae14711ef823e767112aa3ea8427e","aria-disabled":d(this.disabled),class:{disabled:this.disabled}},e("ix-field-wrapper",{key:"709016dc62c4268b208f5469ac94274676fb3ada",required:this.required,label:this.label,helperText:this.helperText,invalidText:this.invalidText,infoText:this.infoText,warningText:this.warningText,validText:this.validText,showTextAsTooltip:this.showTextAsTooltip,isInvalid:this.isInvalid,isValid:this.isValid,isInfo:this.isInfo,isWarning:this.isWarning,controlRef:this.inputRef},e("slot",{key:"d6b6c90ec55424683d484520c6edd3aa2148d153",name:"label",slot:"label"}),e("div",{key:"50c23c58457980fb5d38d80f89f74a0b1d7c32a1",class:{select:true,disabled:this.disabled,readonly:this.readonly},ref:t=>{this.dropdownAnchor=t;if(!this.editable)this.dropdownWrapperRef=t}},e("div",{key:"2c62a44a73929e8f337b1dbbacb4f4e90a972368",class:"input-container"},e("div",{key:"b48c59522094b785eaa673618c500ab957b84916",class:"chips"},this.isMultipleMode?(t=this.selectedItems)===null||t===void 0?void 0:t.map((t=>e("ix-filter-chip",{disabled:this.disabled||this.readonly,key:t.value,onCloseClick:i=>{i.preventDefault();i.stopPropagation();this.itemClick(t.value)}},t.label))):"",e("div",{key:"80412b3e3ff58078d9a15910c552a9fd16cc723d",class:"trigger"},e("input",{key:"8c7c72a83997d0fe82acb4fa1afd2fb1d299d8a5",autocomplete:"off","data-testid":"input",disabled:this.disabled,readOnly:this.readonly,type:"text",class:{"allow-clear":this.allowClear&&!!((i=this.selectedLabels)===null||i===void 0?void 0:i.length)},placeholder:this.placeholderValue(),value:(o=this.inputValue)!==null&&o!==void 0?o:"",ref:t=>{this.input=t;this.inputRef(t)},onBlur:t=>this.onInputBlur(t),onFocus:()=>{this.navigationItem=null},onInput:()=>this.filterItemsWithTypeahead(),onKeyDown:t=>this.onKeyDown(t)}),this.allowClear&&(((r=this.selectedLabels)===null||r===void 0?void 0:r.length)||this.inputFilterText)?e("ix-icon-button",{class:"clear",icon:"clear",ghost:true,oval:true,size:"16",onClick:t=>{t.preventDefault();t.stopPropagation();this.clear()}}):null,this.disabled||this.readonly?null:e("ix-icon-button",{"data-select-dropdown":true,class:{"dropdown-visible":this.dropdownShow},icon:"chevron-down-small",ghost:true,ref:t=>{if(this.editable)this.dropdownWrapperRef=t}})))))),e("ix-dropdown",{key:"eb80a8a205741cb2a095ee8b0bbfafec2558ccaa",ref:t=>this.dropdownRef=t,show:this.dropdownShow,closeBehavior:this.isMultipleMode?"outside":"both",class:{"d-none":this.disabled||this.readonly},anchor:this.dropdownAnchor,trigger:this.dropdownWrapperRef,onShowChanged:t=>this.dropdownVisibilityChanged(t),placement:"bottom-start",overwriteDropdownStyle:async()=>{var t,i;const e=(i=(t=this.hostElement.shadowRoot)===null||t===void 0?void 0:t.querySelector(".select"))===null||i===void 0?void 0:i.getBoundingClientRect().width;return{minWidth:`${e}px`}}},e("div",{key:"9ac7e24e0add43e1f78217adf5afbf75687ac12b",class:{"select-list-header":true,hidden:this.hideListHeader||this.isDropdownEmpty},title:this.i18nSelectListHeader,onClick:t=>t.preventDefault()},this.i18nSelectListHeader),e("slot",{key:"b4ce515c73fc2ffcbab4ce4c34b8eed01904b9e0"}),e("div",{key:"24961fabb03943f19c449f31dd1151e906923620",ref:t=>this.customItemsContainerRef=t,class:"d-contents"}),this.isAddItemVisible()?e("ix-dropdown-item",{"data-testid":"add-item",icon:"plus",class:{"add-item":true},label:this.inputFilterText,onItemClick:t=>{t.preventDefault();t.stopPropagation();this.emitAddItem(this.inputFilterText)},onFocus:()=>this.navigationItem=this.addItemRef,ref:t=>{this.addItemRef=t}}):null,this.isDropdownEmpty&&!this.editable?e("div",{class:"select-list-header"},this.i18nNoMatches):""))}static get formAssociated(){return true}get hostElement(){return o(this)}static get watchers(){return{selectedIndices:["watchSelectedIndices"],value:["watchValue"],dropdownShow:["watchDropdownShow"]}}};b([h("keydown",(t=>t.dropdownShow))],f.prototype,"onKeyDown",null);b([a()],f.prototype,"onValidationChange",null);f.style=u;export{f as ix_select};
+//# sourceMappingURL=p-70a7bd22.entry.js.map

package/dist/siemens-ix/p-70a7bd22.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["selectCss","IxSelectStyle0","Select","this","inputRef","makeRef","focusControllerCallbackBind","focusDropdownItem","bind","itemObserver","createMutationObserver","arrowFocusController","items","visibleNonShadowItems","nonShadowItems","Array","from","hostElement","querySelectorAll","filter","item","classList","contains","shadowItems","shadowRoot","visibleShadowItems","visibleItems","selectedItems","selected","addItemButton","querySelector","isSingleMode","mode","isMultipleMode","isEveryDropdownItemHidden","every","watchSelectedIndices","value","updateSelection","watchValue","selectedIndices","watchDropdownShow","show","ArrowFocusController","dropdownRef","wrap","editable","observe","childList","subtree","disconnect","onItemClicked","event","newId","detail","itemClick","updateFormInternalValue","isArray","formInternals","setFormValue","join","hasValidValue","required","hasValue","length","index","navigationItem","nestedDropdownItem","_b","_a","requestAnimationFrame","focus","toggleValue","emitValueChange","emitAddItem","undefined","trim","newItem","document","createElement","label","customItemsContainerRef","appendChild","clearInput","addItem","emit","itemValue","includes","ids","forEach","some","i","toString","selectedLabels","map","inputValue","input","valueChange","itemSelectionChange","componentDidLoad","addEventListener","dropdownShow","inputChange","componentWillLoad","onLabelChange","preventDefault","stopImmediatePropagation","disconnectedCallback","itemMutationObserver","itemExists","find","dropdownVisibilityChanged","select","removeHiddenFromItems","isDropdownEmpty","inputFilterText","onKeyDown","code","onArrowNavigation","onEnterNavigation","onItemClick","updatePosition","key","defaultPrevented","stopPropagation","activeElement","applyFocusTo","shift","isAddItemVisible","focusAddItemButton","moveUp","indexNonShadow","indexOf","pop","addItemRef","getDropdownItemElement","indexShadow","element","setTimeout","filterItemsWithTypeahead","remove","toLowerCase","add","clear","onInputBlur","ixBlur","target","placeholderValue","disabled","readonly","i18nPlaceholderEditable","i18nPlaceholder","onValidationChange","isInvalid","isInvalidByRequired","isValid","isInfo","isWarning","getAssociatedFormElement","form","getNativeInputElement","Promise","resolve","render","h","Host","a11yBoolean","class","helperText","invalidText","infoText","warningText","validText","showTextAsTooltip","controlRef","name","slot","ref","dropdownAnchor","dropdownWrapperRef","onCloseClick","e","autocomplete","readOnly","type","allowClear","placeholder","_c","onBlur","onFocus","onInput","_d","icon","ghost","oval","size","onClick","closeBehavior","anchor","trigger","onShowChanged","placement","overwriteDropdownStyle","async","minWidth","getBoundingClientRect","width","hidden","hideListHeader","title","i18nSelectListHeader","i18nNoMatches","__decorate","OnListener","self","HookValidationLifecycle"],"sources":["src/components/select/select.scss?tag=ix-select&encapsulation=shadow","src/components/select/select.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@import 'common-variables';\n@import 'legacy/mixins/fonts';\n@import 'mixins/hover';\n@import 'mixins/text-truncation';\n@import 'mixins/shadow-dom/component';\n@import 'mixins/field';\n@import 'mixins/validation/form-component';\n\n:host {\n  @include ix-component;\n\n  display: inline-block;\n  position: relative;\n  min-height: 2rem;\n  height: auto;\n  border-radius: var(--theme-input--border-radius);\n\n  .d-none {\n    display: none;\n  }\n\n  .select {\n    position: relative;\n    display: flex;\n    align-items: center;\n    width: 100%;\n    background-color: var(--theme-input--background);\n    border: var(--theme-input--border-thickness) solid\n      var(--theme-input--border-color);\n    border-radius: var(--theme-input--border-radius);\n    padding: 0 0 0 $small-space;\n    box-shadow: var(--theme-inset-shadow-1) !important;\n\n    @include hover {\n      background-color: var(--theme-input--background--hover);\n      border-color: var(--theme-input--border-color--hover);\n    }\n\n    &:focus-within {\n      background-color: var(--theme-input--background--focus);\n      border-color: var(--theme-input--border-color--focus);\n      outline: 1px solid #119fff;\n      outline-offset: var(--theme-input--focus--outline-offset);\n    }\n  }\n\n  .select.readonly,\n  .select.disabled {\n    box-shadow: none !important;\n    border: none;\n    border-radius: 0;\n    cursor: pointer;\n\n    &,\n    &:hover,\n    &:active {\n      background-color: transparent !important;\n    }\n\n    &:focus,\n    &:focus-within,\n    &:focus-visible {\n      outline: none;\n    }\n\n    input:focus,\n    input:focus-visible {\n      outline: none;\n    }\n  }\n\n  .select.disabled {\n    border-bottom: var(--theme-input--border-thickness) solid\n      var(--theme-color-weak-bdr);\n\n    input {\n      color: var(--theme-color-weak-text);\n    }\n  }\n\n  .select.readonly {\n    border-bottom: var(--theme-input--border-thickness) solid\n      var(--theme-color-soft-bdr);\n\n    input {\n      color: var(--theme-color-std-text);\n    }\n  }\n\n  .hidden {\n    display: none !important;\n  }\n\n  .trigger {\n    display: flex;\n    align-items: center;\n    flex-grow: 1;\n    height: 100%;\n  }\n\n  .input-container {\n    display: flex;\n    position: relative;\n    align-items: flex-start;\n    width: 100%;\n    height: 100%;\n\n    .chips {\n      position: relative;\n      display: flex;\n      align-items: center;\n      flex-wrap: wrap;\n      height: 100%;\n      max-height: 3.5rem;\n      flex-grow: 1;\n      overflow-y: auto;\n\n      > ix-filter-chip {\n        margin: 0.1rem;\n      }\n    }\n\n    input {\n      @include ellipsis;\n      @include text-default;\n      background: transparent;\n      height: 1.75rem;\n      width: 100%;\n\n      &,\n      &:hover,\n      &:focus-visible {\n        border: none;\n        outline: none;\n      }\n\n      &::placeholder {\n        color: var(--theme-input-select-icon--color);\n      }\n\n      &.hide-placeholder::placeholder {\n        opacity: 0;\n      }\n    }\n  }\n\n  .dropdown-visible {\n    --ix-icon-button-color: var(--theme-color-dynamic--hover);\n  }\n\n  .add-item {\n    display: flex;\n    justify-content: flex-start;\n    align-items: center;\n    position: relative;\n    width: 100%;\n  }\n\n  .select-list-header {\n    @include ellipsis;\n    display: flex;\n    align-items: center;\n    height: $default-control-height;\n    color: var(--theme-select-list-item-hint--color);\n    margin: 0 $small-space 0 1rem;\n  }\n}\n\n\n\n@include host-valid {\n}\n\n@include host-info {\n  .select {\n    border-color: var(--theme-input--border-color--info);\n  }\n\n  .select:hover {\n    border-color: var(--theme-input--border-color--info--hover) !important;\n  }\n\n  .select:active {\n    border-color: var(--theme-input--border-color--info--active) !important;\n  }\n}\n\n@include host-warning {\n  .select {\n    border-color: var(--theme-input--border-color--warning);\n  }\n\n  .select:hover {\n    border-color: var(--theme-input--border-color--warning--hover) !important;\n  }\n\n  .select:active {\n    border-color: var(--theme-input--border-color--warning--active) !important;\n  }\n}\n\n@include host-invalid {\n  .select {\n    border-color: var(--theme-input--border-color--invalid);\n    background-color: var(--theme-input--background--invalid);\n    box-shadow: none;\n  }\n\n  .select:hover {\n    border-color: var(--theme-input--border-color--invalid--hover) !important;\n  }\n\n  .select:active {\n    border-color: var(--theme-input--border-color--invalid--active) !important;\n  }\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  Listen,\n  Method,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core';\nimport { IxSelectItemLabelChangeEvent } from '../select-item/events';\nimport { ArrowFocusController } from '../utils/focus';\nimport { OnListener } from '../utils/listener';\nimport { createMutationObserver } from '../utils/mutation-observer';\nimport { DropdownItemWrapper } from '../dropdown/dropdown-controller';\nimport {\n  HookValidationLifecycle,\n  ValidationResults,\n  IxInputFieldComponent,\n} from '../utils/field';\nimport { makeRef } from '../utils/make-ref';\nimport { a11yBoolean } from '../utils/a11y';\n\n/**\n * @form-ready 2.4.0\n */\n@Component({\n  tag: 'ix-select',\n  styleUrl: 'select.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class Select implements IxInputFieldComponent<string | string[]> {\n  @Element() hostElement!: HTMLIxSelectElement;\n  @AttachInternals() formInternals!: ElementInternals;\n\n  /**\n   * A string that represents the element's name attribute,\n   * containing a name that identifies the element when submitting the form.\n   *\n   * @since 2.4.0\n   */\n  @Prop({ reflect: true }) name?: string;\n\n  /**\n   * A Boolean attribute indicating that an option with a non-empty string value must be selected\n   *\n   * @since 2.4.0\n   */\n  @Prop({ reflect: true }) required: boolean = false;\n\n  /**\n   * Label for the select component\n   *\n   *  @since 2.4.0\n   */\n  @Prop() label?: string;\n\n  /**\n   * Warning text for the select component\n   *\n   *  @since 2.4.0\n   **/\n  @Prop() warningText?: string;\n\n  /**\n   * Info text for the select component\n   *\n   *  @since 2.4.0\n   **/\n  @Prop() infoText?: string;\n\n  /**\n   * Error text for the select component\n   *\n   *  @since 2.4.0\n   **/\n  @Prop() invalidText?: string;\n\n  /**\n   * Valid text for the select component\n   *\n   *  @since 2.4.0\n   **/\n  @Prop() validText?: string;\n\n  /**\n   * Helper text for the select component\n   *\n   *  @since 2.4.0\n   **/\n  @Prop() helperText?: string;\n\n  /**\n   * Show helper, error, info, warning text as tooltip\n   *\n   *  @since 2.4.0\n   */\n  @Prop() showTextAsTooltip?: boolean;\n\n  /**\n   * Indices of selected items.\n   * This corresponds to the value property of ix-select-items and therefor not necessarily the indices of the items in the list.\n   * @deprecated since 2.0.0. Use the `value` property instead.\n   */\n  @Prop({ mutable: true }) selectedIndices?: string | string[];\n\n  /**\n   * Current selected value.\n   * This corresponds to the value property of ix-select-items\n   * @since 2.0.0\n   */\n  @Prop({ mutable: true }) value: string | string[] = [];\n\n  /**\n   * Show clear button\n   */\n  @Prop() allowClear = false;\n\n  /**\n   * Selection mode\n   */\n  @Prop() mode: 'single' | 'multiple' = 'single';\n\n  /**\n   * Select is extendable\n   */\n  @Prop() editable = false;\n\n  /**\n   * If true the select will be in disabled state\n   */\n  @Prop() disabled = false;\n\n  /**\n   * If true the select will be in readonly mode\n   */\n  @Prop() readonly = false;\n\n  /**\n   * Input field placeholder\n   */\n  @Prop() i18nPlaceholder = 'Select an option';\n\n  /**\n   * Input field placeholder for editable select\n   */\n  @Prop() i18nPlaceholderEditable = 'Type of select option';\n\n  /**\n   * Select list header\n   */\n  @Prop() i18nSelectListHeader = 'Please select an option';\n\n  /**\n   * Hint inside of dropdown if no items where found with current filter text\n   *\n   * @since 1.5.0\n   */\n  @Prop() i18nNoMatches = 'No matches';\n\n  /**\n   * Hide list header\n   *\n   * @since 1.5.0\n   */\n  @Prop() hideListHeader = false;\n\n  /**\n   * Value changed\n   * @since 2.0.0\n   */\n  @Event() valueChange!: EventEmitter<string | string[]>;\n\n  /**\n   * Item selection changed\n   * @deprecated since 2.0.0. Use `valueChange` instead.\n   */\n  @Event() itemSelectionChange!: EventEmitter<string[]>;\n\n  /**\n   * Event dispatched whenever the text input changes.\n   *\n   * @since 2.0.0\n   */\n  @Event() inputChange!: EventEmitter<string>;\n\n  /**\n   * Item added to selection\n   */\n  @Event() addItem!: EventEmitter<string>;\n\n  /**\n   * Blur input\n   */\n  @Event() ixBlur!: EventEmitter<void>;\n\n  @State() dropdownShow = false;\n  @State() selectedLabels: string[];\n  @State() dropdownWrapperRef!: HTMLElement;\n  @State() dropdownAnchor!: HTMLElement;\n  @State() isDropdownEmpty = false;\n  @State() navigationItem: DropdownItemWrapper | null = null;\n  @State() inputFilterText: string;\n  @State() inputValue: string | null = null;\n\n  @State() isInvalid = false;\n  @State() isValid = false;\n  @State() isInfo = false;\n  @State() isWarning = false;\n\n  private input!: HTMLInputElement;\n  private inputRef = makeRef<HTMLInputElement>();\n  private dropdownRef!: HTMLIxDropdownElement;\n  private customItemsContainerRef!: HTMLDivElement;\n  private addItemRef!: HTMLIxDropdownItemElement;\n\n  private itemMutationObserver: MutationObserver;\n\n  private arrowFocusController: ArrowFocusController;\n  private focusControllerCallbackBind = this.focusDropdownItem.bind(this);\n\n  private itemObserver = createMutationObserver(() => {\n    this.arrowFocusController.items = this.visibleNonShadowItems;\n  });\n\n  get nonShadowItems() {\n    return Array.from(this.hostElement.querySelectorAll('ix-select-item'));\n  }\n\n  get visibleNonShadowItems() {\n    return this.nonShadowItems.filter(\n      (item) => !item.classList.contains('d-none')\n    );\n  }\n\n  get shadowItems() {\n    return Array.from(\n      this.hostElement.shadowRoot!.querySelectorAll('ix-select-item')\n    );\n  }\n\n  get visibleShadowItems() {\n    return this.shadowItems.filter(\n      (item) => !item.classList.contains('d-none')\n    );\n  }\n\n  get items() {\n    return [...this.nonShadowItems, ...this.shadowItems];\n  }\n\n  get visibleItems() {\n    return this.items.filter((item) => !item.classList.contains('d-none'));\n  }\n\n  get selectedItems() {\n    return this.items.filter((item) => item.selected);\n  }\n\n  get addItemButton() {\n    return this.hostElement.shadowRoot!.querySelector('.add-item');\n  }\n\n  get isSingleMode() {\n    return this.mode === 'single';\n  }\n\n  get isMultipleMode() {\n    return this.mode === 'multiple';\n  }\n\n  get isEveryDropdownItemHidden() {\n    return this.items.every((item) => item.classList.contains('d-none'));\n  }\n\n  @Watch('selectedIndices')\n  watchSelectedIndices(value: string | string[]) {\n    this.value = value;\n    this.updateSelection();\n  }\n\n  @Watch('value')\n  watchValue(value: string | string[]) {\n    this.selectedIndices = value;\n    this.updateSelection();\n  }\n\n  @Watch('dropdownShow')\n  watchDropdownShow(show: boolean) {\n    if (show) {\n      this.arrowFocusController = new ArrowFocusController(\n        this.visibleNonShadowItems,\n        this.dropdownRef,\n        this.focusControllerCallbackBind\n      );\n\n      this.arrowFocusController.wrap = !this.editable;\n\n      this.itemObserver.observe(this.dropdownRef, {\n        childList: true,\n        subtree: true,\n      });\n    } else {\n      this.arrowFocusController.disconnect();\n      this.itemObserver.disconnect();\n    }\n  }\n\n  @Listen('itemClick')\n  onItemClicked(event: CustomEvent<string>) {\n    const newId = event.detail;\n    this.itemClick(newId);\n  }\n\n  async updateFormInternalValue(value: string | string[]) {\n    if (Array.isArray(value)) {\n      this.formInternals.setFormValue(value.join(','));\n      return;\n    }\n\n    this.formInternals.setFormValue(value);\n  }\n\n  /** @internal */\n  @Method()\n  async hasValidValue(): Promise<boolean> {\n    return this.required && !!this.hasValue();\n  }\n\n  private hasValue() {\n    if (Array.isArray(this.value)) {\n      return !!this.value.length;\n    }\n\n    return !!this.value;\n  }\n\n  private focusDropdownItem(index: number) {\n    this.navigationItem = null;\n\n    if (index < this.visibleNonShadowItems.length) {\n      const nestedDropdownItem =\n        this.visibleNonShadowItems[index]?.shadowRoot?.querySelector(\n          'ix-dropdown-item'\n        );\n\n      requestAnimationFrame(() => {\n        nestedDropdownItem.shadowRoot.querySelector('button').focus();\n      });\n    }\n  }\n\n  private itemClick(newId: string) {\n    this.value = this.toggleValue(newId);\n    this.updateSelection();\n    this.emitValueChange(this.value);\n  }\n\n  private emitAddItem(value: string) {\n    if (value === undefined || value.trim() === '') {\n      return;\n    }\n\n    const newItem = document.createElement('ix-select-item');\n    newItem.value = value;\n    newItem.label = value;\n\n    this.customItemsContainerRef.appendChild(newItem);\n\n    this.clearInput();\n    this.itemClick(value);\n    this.addItem.emit(value);\n  }\n\n  private toggleValue(itemValue: string) {\n    if (!this.isMultipleMode) {\n      return itemValue;\n    }\n\n    if (!this.value) {\n      return [itemValue];\n    }\n\n    let value = this.value;\n\n    if (!Array.isArray(value)) {\n      value = [value];\n    }\n\n    if (value.includes(itemValue)) {\n      return value.filter((value) => value !== itemValue);\n    } else {\n      return [...value, itemValue];\n    }\n  }\n\n  private updateSelection() {\n    let ids: string[] = [];\n\n    if (this.value) {\n      ids = Array.isArray(this.value) ? [...this.value] : [this.value];\n    }\n\n    this.items.forEach((item) => {\n      item.selected = ids.some((i) => {\n        if (typeof i !== typeof item.value) {\n          return i.toString() === item.value.toString();\n        } else {\n          return i === item.value;\n        }\n      });\n    });\n\n    this.selectedLabels = this.selectedItems.map((item) => item.label);\n\n    if (this.isSingleMode && this.selectedLabels?.length) {\n      this.inputValue = this.selectedLabels[0];\n      this.input && (this.input.value = this.inputValue);\n      return;\n    }\n\n    this.inputValue = null;\n  }\n\n  private emitValueChange(value: string | string[]) {\n    this.valueChange.emit(value);\n\n    if (!value) {\n      this.itemSelectionChange.emit([]);\n    } else {\n      this.itemSelectionChange.emit(Array.isArray(value) ? value : [value]);\n    }\n\n    this.updateFormInternalValue(value);\n  }\n\n  componentDidLoad() {\n    this.input.addEventListener('input', () => {\n      this.dropdownShow = true;\n      this.inputChange.emit(this.input.value);\n    });\n  }\n\n  componentWillLoad() {\n    if (this.selectedIndices && !this.value) {\n      this.value = this.selectedIndices;\n    }\n\n    this.updateSelection();\n    this.updateFormInternalValue(this.value);\n  }\n\n  @Listen('ix-select-item:labelChange')\n  onLabelChange(event: IxSelectItemLabelChangeEvent) {\n    event.preventDefault();\n    event.stopImmediatePropagation();\n    this.updateSelection();\n  }\n\n  disconnectedCallback() {\n    if (this.itemMutationObserver) {\n      this.itemMutationObserver.disconnect();\n    }\n  }\n\n  private itemExists(item: string) {\n    return this.items.find((i) => i.label === item);\n  }\n\n  private dropdownVisibilityChanged(event: CustomEvent<boolean>) {\n    this.dropdownShow = event.detail;\n\n    if (event.detail) {\n      this.input.focus();\n      this.input.select();\n\n      this.removeHiddenFromItems();\n      this.isDropdownEmpty = this.isEveryDropdownItemHidden;\n    } else {\n      this.navigationItem = null;\n      this.updateSelection();\n      this.inputFilterText = '';\n    }\n  }\n\n  @OnListener<Select>('keydown', (self) => self.dropdownShow)\n  async onKeyDown(event: KeyboardEvent) {\n    if (event.code === 'ArrowDown' || event.code === 'ArrowUp') {\n      await this.onArrowNavigation(event, event.code);\n    }\n\n    if (!this.dropdownShow) {\n      return;\n    }\n\n    if (event.code === 'Enter' || event.code === 'NumpadEnter') {\n      await this.onEnterNavigation();\n    }\n\n    if (event.code === 'Escape') {\n      this.dropdownShow = false;\n    }\n  }\n\n  private async onEnterNavigation() {\n    if (this.isMultipleMode) {\n      return;\n    }\n\n    let item: HTMLIxSelectItemElement | undefined;\n\n    if (this.editable && !this.itemExists(this.inputFilterText)) {\n      this.emitAddItem(this.inputFilterText);\n      item = this.items[this.items.length - 1];\n    }\n\n    if (item) {\n      item.onItemClick();\n    }\n\n    await this.dropdownRef?.updatePosition();\n\n    if (this.isSingleMode && !this.editable) {\n      this.dropdownShow = false;\n    }\n  }\n\n  private async onArrowNavigation(\n    event: KeyboardEvent,\n    key: 'ArrowDown' | 'ArrowUp'\n  ) {\n    if (event.defaultPrevented) {\n      return;\n    }\n\n    event.preventDefault();\n    event.stopPropagation();\n\n    this.dropdownShow = true;\n\n    if (!this.navigationItem && document.activeElement === this.hostElement) {\n      if (this.visibleItems.length) {\n        this.applyFocusTo(this.visibleItems.shift());\n      } else if (this.isAddItemVisible()) {\n        this.focusAddItemButton();\n      }\n      return;\n    }\n\n    const moveUp = key === 'ArrowUp';\n    const indexNonShadow = document.activeElement\n      ? this.visibleNonShadowItems.indexOf(\n          document.activeElement as HTMLIxSelectItemElement\n        )\n      : -1;\n\n    // Slotted select items\n    if (indexNonShadow === 0) {\n      if (!this.visibleShadowItems.length && this.isAddItemVisible()) {\n        this.focusAddItemButton();\n      } else {\n        this.applyFocusTo(this.visibleShadowItems.pop());\n      }\n      return;\n    } else if (\n      indexNonShadow !== -1 &&\n      indexNonShadow === this.visibleNonShadowItems.length - 1\n    ) {\n      if (this.visibleShadowItems.length) {\n        this.applyFocusTo(this.visibleShadowItems.shift());\n      } else if (this.isAddItemVisible()) {\n        this.focusAddItemButton();\n      }\n      return;\n    }\n\n    if (!this.navigationItem) {\n      return;\n    }\n\n    if (\n      this.isAddItemVisible() &&\n      this.addItemRef.contains(\n        await this.navigationItem.getDropdownItemElement()\n      )\n    ) {\n      if (moveUp) {\n        this.applyFocusTo(this.visibleItems.pop());\n      } else {\n        if (this.visibleItems.length) {\n          this.applyFocusTo(this.visibleItems.shift());\n        }\n      }\n      return;\n    }\n\n    // Custom select items\n    const indexShadow = this.visibleShadowItems.indexOf(\n      this.navigationItem as HTMLIxSelectItemElement\n    );\n\n    if (moveUp) {\n      if (indexShadow === 0) {\n        if (this.visibleNonShadowItems.length) {\n          this.applyFocusTo(this.visibleNonShadowItems.pop());\n        } else if (this.isAddItemVisible()) {\n          this.focusAddItemButton();\n        }\n      } else {\n        this.applyFocusTo(this.visibleShadowItems[indexShadow - 1]);\n      }\n    } else {\n      if (indexShadow === this.visibleShadowItems.length - 1) {\n        if (this.isAddItemVisible()) {\n          this.focusAddItemButton();\n        } else {\n          this.applyFocusTo(this.visibleItems.shift());\n        }\n      } else {\n        this.applyFocusTo(this.visibleShadowItems[indexShadow + 1]);\n      }\n    }\n  }\n\n  private applyFocusTo(element?: HTMLIxSelectItemElement) {\n    if (!element) {\n      return;\n    }\n\n    this.navigationItem = element;\n\n    setTimeout(() => {\n      element.shadowRoot\n        .querySelector('ix-dropdown-item')\n        .shadowRoot.querySelector('button')\n        .focus();\n    });\n  }\n\n  private focusAddItemButton() {\n    if (this.addItemButton) {\n      this.addItemButton.shadowRoot?.querySelector('button')?.focus();\n      this.navigationItem = this.addItemRef;\n    }\n  }\n\n  private filterItemsWithTypeahead() {\n    this.inputFilterText = this.input.value;\n\n    if (this.isSingleMode && this.inputFilterText === this.selectedLabels[0]) {\n      return;\n    }\n\n    if (this.inputFilterText) {\n      this.items.forEach((item) => {\n        item.classList.remove('d-none');\n        if (\n          !item.label.toLowerCase().includes(this.inputFilterText.toLowerCase())\n        ) {\n          item.classList.add('d-none');\n        }\n      });\n    } else {\n      this.removeHiddenFromItems();\n    }\n\n    if (this.arrowFocusController) {\n      this.arrowFocusController.items = this.visibleNonShadowItems;\n    }\n\n    this.isDropdownEmpty = this.isEveryDropdownItemHidden;\n  }\n\n  private removeHiddenFromItems() {\n    this.items.forEach((item) => {\n      item.classList.remove('d-none');\n    });\n  }\n\n  private clearInput() {\n    this.input.value = '';\n    this.inputFilterText = '';\n  }\n\n  private clear() {\n    this.clearInput();\n    this.selectedLabels = [];\n    this.value = [];\n    this.emitValueChange([]);\n    this.dropdownShow = false;\n  }\n\n  private onInputBlur(event: Event) {\n    this.ixBlur.emit();\n\n    if (this.editable) {\n      return;\n    }\n\n    if (this.isSingleMode) {\n      return;\n    }\n\n    const target = event.target as HTMLInputElement;\n\n    if (!this.dropdownShow && this.mode !== 'multiple') {\n      target.value = this.selectedLabels.toString();\n    }\n  }\n\n  private placeholderValue() {\n    if (this.disabled) {\n      return '';\n    }\n\n    if (this.readonly) {\n      return '';\n    }\n\n    if (this.editable) {\n      return this.i18nPlaceholderEditable;\n    }\n\n    return this.i18nPlaceholder;\n  }\n\n  private isAddItemVisible() {\n    return (\n      !this.itemExists(this.inputFilterText) &&\n      this.editable &&\n      this.inputFilterText\n    );\n  }\n\n  @HookValidationLifecycle()\n  onValidationChange({\n    isInvalid,\n    isInvalidByRequired,\n    isValid,\n    isInfo,\n    isWarning,\n  }: ValidationResults) {\n    this.isInvalid = isInvalid || isInvalidByRequired;\n    this.isValid = isValid;\n    this.isWarning = isWarning;\n    this.isInfo = isInfo;\n  }\n\n  /** @internal */\n  @Method()\n  async getAssociatedFormElement(): Promise<HTMLFormElement | null> {\n    return this.formInternals.form;\n  }\n\n  /**\n   * Returns the native input element used in the component.\n   */\n  @Method()\n  getNativeInputElement(): Promise<HTMLInputElement> {\n    return Promise.resolve(this.input);\n  }\n\n  render() {\n    return (\n      <Host\n        aria-disabled={a11yBoolean(this.disabled)}\n        class={{\n          disabled: this.disabled,\n        }}\n      >\n        <ix-field-wrapper\n          required={this.required}\n          label={this.label}\n          helperText={this.helperText}\n          invalidText={this.invalidText}\n          infoText={this.infoText}\n          warningText={this.warningText}\n          validText={this.validText}\n          showTextAsTooltip={this.showTextAsTooltip}\n          isInvalid={this.isInvalid}\n          isValid={this.isValid}\n          isInfo={this.isInfo}\n          isWarning={this.isWarning}\n          controlRef={this.inputRef}\n        >\n          <slot name=\"label\" slot=\"label\"></slot>\n\n          <div\n            class={{\n              select: true,\n              disabled: this.disabled,\n              readonly: this.readonly,\n            }}\n            ref={(ref) => {\n              this.dropdownAnchor = ref!;\n              if (!this.editable) this.dropdownWrapperRef = ref!;\n            }}\n          >\n            <div class=\"input-container\">\n              <div class=\"chips\">\n                {this.isMultipleMode\n                  ? this.selectedItems?.map((item) => (\n                      <ix-filter-chip\n                        disabled={this.disabled || this.readonly}\n                        key={item.value}\n                        onCloseClick={(e) => {\n                          e.preventDefault();\n                          e.stopPropagation();\n                          this.itemClick(item.value);\n                        }}\n                      >\n                        {item.label}\n                      </ix-filter-chip>\n                    ))\n                  : ''}\n                <div class=\"trigger\">\n                  <input\n                    autocomplete=\"off\"\n                    data-testid=\"input\"\n                    disabled={this.disabled}\n                    readOnly={this.readonly}\n                    type=\"text\"\n                    class={{\n                      'allow-clear':\n                        this.allowClear && !!this.selectedLabels?.length,\n                    }}\n                    placeholder={this.placeholderValue()}\n                    value={this.inputValue ?? ''}\n                    ref={(ref) => {\n                      this.input = ref!;\n                      this.inputRef(ref!);\n                    }}\n                    onBlur={(e) => this.onInputBlur(e)}\n                    onFocus={() => {\n                      this.navigationItem = null;\n                    }}\n                    onInput={() => this.filterItemsWithTypeahead()}\n                    onKeyDown={(e) => this.onKeyDown(e)}\n                  />\n                  {this.allowClear &&\n                  (this.selectedLabels?.length || this.inputFilterText) ? (\n                    <ix-icon-button\n                      class=\"clear\"\n                      icon={'clear'}\n                      ghost\n                      oval\n                      size=\"16\"\n                      onClick={(e) => {\n                        e.preventDefault();\n                        e.stopPropagation();\n                        this.clear();\n                      }}\n                    />\n                  ) : null}\n                  {this.disabled || this.readonly ? null : (\n                    <ix-icon-button\n                      data-select-dropdown\n                      class={{ 'dropdown-visible': this.dropdownShow }}\n                      icon=\"chevron-down-small\"\n                      ghost\n                      ref={(ref) => {\n                        if (this.editable) this.dropdownWrapperRef = ref!;\n                      }}\n                    ></ix-icon-button>\n                  )}\n                </div>\n              </div>\n            </div>\n          </div>\n        </ix-field-wrapper>\n        <ix-dropdown\n          ref={(ref) => (this.dropdownRef = ref!)}\n          show={this.dropdownShow}\n          closeBehavior={this.isMultipleMode ? 'outside' : 'both'}\n          class={{\n            'd-none': this.disabled || this.readonly,\n          }}\n          anchor={this.dropdownAnchor}\n          trigger={this.dropdownWrapperRef}\n          onShowChanged={(e) => this.dropdownVisibilityChanged(e)}\n          placement=\"bottom-start\"\n          overwriteDropdownStyle={async () => {\n            const minWidth = this.hostElement.shadowRoot\n              ?.querySelector('.select')\n              ?.getBoundingClientRect().width;\n\n            return {\n              minWidth: `${minWidth}px`,\n            };\n          }}\n        >\n          <div\n            class={{\n              'select-list-header': true,\n              hidden: this.hideListHeader || this.isDropdownEmpty,\n            }}\n            title={this.i18nSelectListHeader}\n            onClick={(e) => e.preventDefault()}\n          >\n            {this.i18nSelectListHeader}\n          </div>\n          <slot></slot>\n          <div\n            ref={(ref) => (this.customItemsContainerRef = ref!)}\n            class=\"d-contents\"\n          ></div>\n          {this.isAddItemVisible() ? (\n            <ix-dropdown-item\n              data-testid=\"add-item\"\n              icon={'plus'}\n              class={{\n                'add-item': true,\n              }}\n              label={this.inputFilterText}\n              onItemClick={(e) => {\n                e.preventDefault();\n                e.stopPropagation();\n                this.emitAddItem(this.inputFilterText);\n              }}\n              onFocus={() => (this.navigationItem = this.addItemRef)}\n              ref={(ref) => {\n                this.addItemRef = ref!;\n              }}\n            ></ix-dropdown-item>\n          ) : null}\n          {this.isDropdownEmpty && !this.editable ? (\n            <div class=\"select-list-header\">{this.i18nNoMatches}</div>\n          ) : (\n            ''\n          )}\n        </ix-dropdown>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/siemens-ix/p-724b98ce.entry.js

@@ -0,0 +1,2 @@
+import{r as t,h as e,H as o,g as i}from"./p-f86a894a.js";import{u as a,A as r}from"./p-7c36d3fa.js";import{a as s}from"./p-702f9349.js";import{m as n}from"./p-c146af8e.js";import"./p-c4749812.js";import"./p-68a274e7.js";const h=":host{display:flex;position:relative;width:100%;height:100%;flex-direction:column}: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 ::-webkit-scrollbar{width:0.5rem;height:0.5rem}: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 ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host ix-application-header{z-index:calc(var(--theme-z-index-sticky) + 1)}:host .logo-wrapper{display:contents}:host .content{display:flex;height:100%;width:100%;position:relative;margin-left:3.25rem;overflow:auto}:host .navigation-content{display:flex;position:relative;flex-direction:row;height:calc(100% - 2.75rem);width:100%}:host(.hide-header) .navigation-content,:host(.hide-header) .content{height:100%}:host(.breakpoint-lg) .content{margin-left:0rem}:host(.breakpoint-sm) .content{margin-left:0px;width:100%}";const c=h;const d=class{constructor(e){t(this,e);this.applicationName=undefined;this.hideHeader=false;this.forceBreakpoint=undefined;this.breakpoints=["sm","md","lg"];this.breakpoint="lg"}onHideHeaderChange(){var t;(t=this.contextProvider)===null||t===void 0?void 0:t.emit({hideHeader:this.hideHeader,host:"basic-navigation"});this.breakpoint=s.breakpoint}forceLayoutChange(t){if(!t){s.enableBreakpointDetection();return}s.disableBreakpointDetection();s.setBreakpoint(t)}onBreakpointsChange(t){s.setBreakpoints(t)}get menu(){return this.hostElement.querySelector("ix-menu")}onContentClick(){var t;if(n.isPinned){return}(t=this.menu)===null||t===void 0?void 0:t.toggleMenu(false)}componentWillLoad(){s.setBreakpoints(this.breakpoints);this.contextProvider=a(this.hostElement,r,{hideHeader:this.hideHeader,host:"basic-navigation"});this.modeDisposable=s.onChange.on((t=>{this.breakpoint=t}));this.breakpoint=s.breakpoint;if(this.forceBreakpoint){this.forceLayoutChange(this.forceBreakpoint)}}componentDidRender(){if(this.menu){this.menu.applicationName=this.applicationName}}disconnectedCallback(){var t;(t=this.modeDisposable)===null||t===void 0?void 0:t.dispose()}render(){return e(o,{key:"b7a08dd07027f01f672abd914adee7a6eb28708d","data-role":"",class:{"hide-header":this.hideHeader,[`breakpoint-${this.breakpoint}`]:true}},!this.hideHeader?e("ix-application-header",{name:this.applicationName},e("slot",{name:"logo",slot:"logo"})):null,e("div",{key:"09dd326d03dc69d3186de63723b68986c81f2008",class:"navigation-content"},e("slot",{key:"fee45f4cbc111253d01e01fe9b46d81b45e46af6",name:"menu"}),e("div",{key:"1a7d9b9ba3c12e33ef44572963daba3acc894ff3",class:"content",onClick:()=>this.onContentClick()},e("slot",{key:"29b9da8bc571e20c87cc3c8354c54e141f673ce8"}))))}get hostElement(){return i(this)}static get watchers(){return{hideHeader:["onHideHeaderChange"],breakpoints:["onBreakpointsChange"]}}};d.style=c;export{d as ix_basic_navigation};
+//# sourceMappingURL=p-724b98ce.entry.js.map

package/dist/siemens-ix/{p-b24beb48.entry.js.map → p-724b98ce.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["basicNavigationCss","IxBasicNavigationStyle0","BasicNavigation","onHideHeaderChange","_a","this","contextProvider","emit","hideHeader","host","breakpoint","applicationLayoutService","forceLayoutChange","newMode","enableBreakpointDetection","disableBreakpointDetection","setBreakpoint","onBreakpointsChange","breakpoints","setBreakpoints","menu","hostElement","querySelector","onContentClick","menuController","isPinned","toggleMenu","componentWillLoad","useContextProvider","ApplicationLayoutContext","modeDisposable","onChange","on","mode","forceBreakpoint","componentDidRender","applicationName","disconnectedCallback","dispose","render","h","Host","key","class","name","slot","onClick"],"sources":["src/components/basic-navigation/basic-navigation.scss?tag=ix-basic-navigation&encapsulation=shadow","src/components/basic-navigation/basic-navigation.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@import 'mixins/shadow-dom/component';\n\n:host {\n  @include ix-component;\n\n  display: flex;\n  position: relative;\n  width: 100%;\n  height: 100%;\n\n  flex-direction: column;\n\n  ix-application-header {\n    z-index: calc(var(--theme-z-index-sticky) + 1);\n  }\n\n  .logo-wrapper {\n    display: contents;\n  }\n\n  .content {\n    display: flex;\n    height: 100%;\n    width: 100%;\n    position: relative;\n    margin-left: 3.25rem;\n    overflow: auto;\n  }\n\n  .navigation-content {\n    display: flex;\n    position: relative;\n\n    flex-direction: row;\n\n    height: calc(100% - 2.75rem);\n    width: 100%;\n  }\n}\n\n:host(.hide-header) {\n  .navigation-content,\n  .content {\n    height: 100%;\n  }\n}\n\n:host(.breakpoint-lg) {\n  .content {\n    margin-left: 0rem;\n  }\n}\n\n:host(.breakpoint-sm) {\n  .content {\n    margin-left: 0px;\n    width: 100%;\n  }\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 { Component, Element, h, Host, Prop, State, Watch } from '@stencil/core';\nimport { ApplicationLayoutContext } from '../utils/application-layout/context';\nimport { applicationLayoutService } from '../utils/application-layout/service';\nimport { Breakpoint } from '../utils/breakpoints';\nimport { ContextProvider, useContextProvider } from '../utils/context';\nimport { menuController } from '../utils/menu-service/menu-service';\nimport { Disposable } from '../utils/typed-event';\n\n@Component({\n  tag: 'ix-basic-navigation',\n  styleUrl: 'basic-navigation.scss',\n  shadow: true,\n})\nexport class BasicNavigation {\n  @Element() hostElement: HTMLIxBasicNavigationElement;\n\n  /**\n   * Application name\n   */\n  @Prop() applicationName: string;\n\n  /**\n   * Hide application header. Will disable responsive feature of basic navigation.\n   */\n  @Prop() hideHeader = false;\n  @Watch('hideHeader')\n  onHideHeaderChange() {\n    this.contextProvider?.emit({\n      hideHeader: this.hideHeader,\n      host: 'basic-navigation',\n    });\n\n    this.breakpoint = applicationLayoutService.breakpoint;\n  }\n\n  /**\n   * Change the responsive layout of the menu structure\n   */\n  @Prop() forceBreakpoint: Breakpoint | undefined;\n  forceLayoutChange(newMode: Breakpoint | undefined) {\n    if (!newMode) {\n      applicationLayoutService.enableBreakpointDetection();\n      return;\n    }\n\n    applicationLayoutService.disableBreakpointDetection();\n    applicationLayoutService.setBreakpoint(newMode);\n  }\n\n  /**\n   * Supported layouts e.g ['sm', 'md']\n   */\n  @Prop() breakpoints: Breakpoint[] = ['sm', 'md', 'lg'];\n  @Watch('breakpoints')\n  onBreakpointsChange(breakpoints: Breakpoint[]) {\n    applicationLayoutService.setBreakpoints(breakpoints);\n  }\n\n  @State() breakpoint: Breakpoint = 'lg';\n\n  get menu(): HTMLIxMenuElement | null {\n    return this.hostElement.querySelector('ix-menu');\n  }\n\n  private modeDisposable: Disposable;\n  private contextProvider: ContextProvider<typeof ApplicationLayoutContext>;\n\n  private onContentClick() {\n    if (menuController.isPinned) {\n      return;\n    }\n    this.menu?.toggleMenu(false);\n  }\n\n  componentWillLoad() {\n    applicationLayoutService.setBreakpoints(this.breakpoints);\n\n    this.contextProvider = useContextProvider(\n      this.hostElement,\n      ApplicationLayoutContext,\n      {\n        hideHeader: this.hideHeader,\n        host: 'basic-navigation',\n      }\n    );\n\n    this.modeDisposable = applicationLayoutService.onChange.on((mode) => {\n      this.breakpoint = mode;\n    });\n    this.breakpoint = applicationLayoutService.breakpoint;\n\n    if (this.forceBreakpoint) {\n      this.forceLayoutChange(this.forceBreakpoint);\n    }\n  }\n\n  componentDidRender() {\n    if (this.menu) {\n      this.menu.applicationName = this.applicationName;\n    }\n  }\n\n  disconnectedCallback() {\n    this.modeDisposable?.dispose();\n  }\n\n  render() {\n    return (\n      <Host\n        data-role=\"\"\n        class={{\n          'hide-header': this.hideHeader,\n          [`breakpoint-${this.breakpoint}`]: true,\n        }}\n      >\n        {!this.hideHeader ? (\n          <ix-application-header name={this.applicationName}>\n            <slot name=\"logo\" slot=\"logo\"></slot>\n          </ix-application-header>\n        ) : null}\n        <div class=\"navigation-content\">\n          <slot name=\"menu\"></slot>\n          <div class=\"content\" onClick={() => this.onContentClick()}>\n            <slot></slot>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"4NAAA,MAAMA,EAAqB,qrCAC3B,MAAAC,EAAeD,E,MCqBFE,EAAe,M,wEAWL,M,gDA4Be,CAAC,KAAM,KAAM,M,gBAMf,I,CAhClC,kBAAAC,G,OACEC,EAAAC,KAAKC,mBAAe,MAAAF,SAAA,SAAAA,EAAEG,KAAK,CACzBC,WAAYH,KAAKG,WACjBC,KAAM,qBAGRJ,KAAKK,WAAaC,EAAyBD,U,CAO7C,iBAAAE,CAAkBC,GAChB,IAAKA,EAAS,CACZF,EAAyBG,4BACzB,M,CAGFH,EAAyBI,6BACzBJ,EAAyBK,cAAcH,E,CAQzC,mBAAAI,CAAoBC,GAClBP,EAAyBQ,eAAeD,E,CAK1C,QAAIE,GACF,OAAOf,KAAKgB,YAAYC,cAAc,U,CAMhC,cAAAC,G,MACN,GAAIC,EAAeC,SAAU,CAC3B,M,EAEFrB,EAAAC,KAAKe,QAAI,MAAAhB,SAAA,SAAAA,EAAEsB,WAAW,M,CAGxB,iBAAAC,GACEhB,EAAyBQ,eAAed,KAAKa,aAE7Cb,KAAKC,gBAAkBsB,EACrBvB,KAAKgB,YACLQ,EACA,CACErB,WAAYH,KAAKG,WACjBC,KAAM,qBAIVJ,KAAKyB,eAAiBnB,EAAyBoB,SAASC,IAAIC,IAC1D5B,KAAKK,WAAauB,CAAI,IAExB5B,KAAKK,WAAaC,EAAyBD,WAE3C,GAAIL,KAAK6B,gBAAiB,CACxB7B,KAAKO,kBAAkBP,KAAK6B,gB,EAIhC,kBAAAC,GACE,GAAI9B,KAAKe,KAAM,CACbf,KAAKe,KAAKgB,gBAAkB/B,KAAK+B,e,EAIrC,oBAAAC,G,OACEjC,EAAAC,KAAKyB,kBAAc,MAAA1B,SAAA,SAAAA,EAAEkC,S,CAGvB,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,uDACO,GACVC,MAAO,CACL,cAAetC,KAAKG,WACpB,CAAC,cAAcH,KAAKK,cAAe,QAGnCL,KAAKG,WACLgC,EAAA,yBAAuBI,KAAMvC,KAAK+B,iBAChCI,EAAA,QAAMI,KAAK,OAAOC,KAAK,UAEvB,KACJL,EAAA,OAAAE,IAAA,2CAAKC,MAAM,sBACTH,EAAA,QAAAE,IAAA,2CAAME,KAAK,SACXJ,EAAA,OAAAE,IAAA,2CAAKC,MAAM,UAAUG,QAAS,IAAMzC,KAAKkB,kBACvCiB,EAAA,QAAAE,IAAA,+C"}
+{"version":3,"names":["basicNavigationCss","IxBasicNavigationStyle0","BasicNavigation","onHideHeaderChange","_a","this","contextProvider","emit","hideHeader","host","breakpoint","applicationLayoutService","forceLayoutChange","newMode","enableBreakpointDetection","disableBreakpointDetection","setBreakpoint","onBreakpointsChange","breakpoints","setBreakpoints","menu","hostElement","querySelector","onContentClick","menuController","isPinned","toggleMenu","componentWillLoad","useContextProvider","ApplicationLayoutContext","modeDisposable","onChange","on","mode","forceBreakpoint","componentDidRender","applicationName","disconnectedCallback","dispose","render","h","Host","key","class","name","slot","onClick"],"sources":["src/components/basic-navigation/basic-navigation.scss?tag=ix-basic-navigation&encapsulation=shadow","src/components/basic-navigation/basic-navigation.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@import 'mixins/shadow-dom/component';\n\n:host {\n  @include ix-component;\n\n  display: flex;\n  position: relative;\n  width: 100%;\n  height: 100%;\n\n  flex-direction: column;\n\n  ix-application-header {\n    z-index: calc(var(--theme-z-index-sticky) + 1);\n  }\n\n  .logo-wrapper {\n    display: contents;\n  }\n\n  .content {\n    display: flex;\n    height: 100%;\n    width: 100%;\n    position: relative;\n    margin-left: 3.25rem;\n    overflow: auto;\n  }\n\n  .navigation-content {\n    display: flex;\n    position: relative;\n\n    flex-direction: row;\n\n    height: calc(100% - 2.75rem);\n    width: 100%;\n  }\n}\n\n:host(.hide-header) {\n  .navigation-content,\n  .content {\n    height: 100%;\n  }\n}\n\n:host(.breakpoint-lg) {\n  .content {\n    margin-left: 0rem;\n  }\n}\n\n:host(.breakpoint-sm) {\n  .content {\n    margin-left: 0px;\n    width: 100%;\n  }\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 { Component, Element, h, Host, Prop, State, Watch } from '@stencil/core';\nimport { ApplicationLayoutContext } from '../utils/application-layout/context';\nimport { applicationLayoutService } from '../utils/application-layout/service';\nimport { Breakpoint } from '../utils/breakpoints';\nimport { ContextProvider, useContextProvider } from '../utils/context';\nimport { menuController } from '../utils/menu-service/menu-service';\nimport { Disposable } from '../utils/typed-event';\n\n@Component({\n  tag: 'ix-basic-navigation',\n  styleUrl: 'basic-navigation.scss',\n  shadow: true,\n})\nexport class BasicNavigation {\n  @Element() hostElement: HTMLIxBasicNavigationElement;\n\n  /**\n   * Application name\n   */\n  @Prop() applicationName: string;\n\n  /**\n   * Hide application header. Will disable responsive feature of basic navigation.\n   */\n  @Prop() hideHeader = false;\n  @Watch('hideHeader')\n  onHideHeaderChange() {\n    this.contextProvider?.emit({\n      hideHeader: this.hideHeader,\n      host: 'basic-navigation',\n    });\n\n    this.breakpoint = applicationLayoutService.breakpoint;\n  }\n\n  /**\n   * Change the responsive layout of the menu structure\n   */\n  @Prop() forceBreakpoint: Breakpoint | undefined;\n  forceLayoutChange(newMode: Breakpoint | undefined) {\n    if (!newMode) {\n      applicationLayoutService.enableBreakpointDetection();\n      return;\n    }\n\n    applicationLayoutService.disableBreakpointDetection();\n    applicationLayoutService.setBreakpoint(newMode);\n  }\n\n  /**\n   * Supported layouts e.g ['sm', 'md']\n   */\n  @Prop() breakpoints: Breakpoint[] = ['sm', 'md', 'lg'];\n  @Watch('breakpoints')\n  onBreakpointsChange(breakpoints: Breakpoint[]) {\n    applicationLayoutService.setBreakpoints(breakpoints);\n  }\n\n  @State() breakpoint: Breakpoint = 'lg';\n\n  get menu(): HTMLIxMenuElement | null {\n    return this.hostElement.querySelector('ix-menu');\n  }\n\n  private modeDisposable: Disposable;\n  private contextProvider: ContextProvider<typeof ApplicationLayoutContext>;\n\n  private onContentClick() {\n    if (menuController.isPinned) {\n      return;\n    }\n    this.menu?.toggleMenu(false);\n  }\n\n  componentWillLoad() {\n    applicationLayoutService.setBreakpoints(this.breakpoints);\n\n    this.contextProvider = useContextProvider(\n      this.hostElement,\n      ApplicationLayoutContext,\n      {\n        hideHeader: this.hideHeader,\n        host: 'basic-navigation',\n      }\n    );\n\n    this.modeDisposable = applicationLayoutService.onChange.on((mode) => {\n      this.breakpoint = mode;\n    });\n    this.breakpoint = applicationLayoutService.breakpoint;\n\n    if (this.forceBreakpoint) {\n      this.forceLayoutChange(this.forceBreakpoint);\n    }\n  }\n\n  componentDidRender() {\n    if (this.menu) {\n      this.menu.applicationName = this.applicationName;\n    }\n  }\n\n  disconnectedCallback() {\n    this.modeDisposable?.dispose();\n  }\n\n  render() {\n    return (\n      <Host\n        data-role=\"\"\n        class={{\n          'hide-header': this.hideHeader,\n          [`breakpoint-${this.breakpoint}`]: true,\n        }}\n      >\n        {!this.hideHeader ? (\n          <ix-application-header name={this.applicationName}>\n            <slot name=\"logo\" slot=\"logo\"></slot>\n          </ix-application-header>\n        ) : null}\n        <div class=\"navigation-content\">\n          <slot name=\"menu\"></slot>\n          <div class=\"content\" onClick={() => this.onContentClick()}>\n            <slot></slot>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"4NAAA,MAAMA,EAAqB,i1CAC3B,MAAAC,EAAeD,E,MCqBFE,EAAe,M,wEAWL,M,gDA4Be,CAAC,KAAM,KAAM,M,gBAMf,I,CAhClC,kBAAAC,G,OACEC,EAAAC,KAAKC,mBAAe,MAAAF,SAAA,SAAAA,EAAEG,KAAK,CACzBC,WAAYH,KAAKG,WACjBC,KAAM,qBAGRJ,KAAKK,WAAaC,EAAyBD,U,CAO7C,iBAAAE,CAAkBC,GAChB,IAAKA,EAAS,CACZF,EAAyBG,4BACzB,M,CAGFH,EAAyBI,6BACzBJ,EAAyBK,cAAcH,E,CAQzC,mBAAAI,CAAoBC,GAClBP,EAAyBQ,eAAeD,E,CAK1C,QAAIE,GACF,OAAOf,KAAKgB,YAAYC,cAAc,U,CAMhC,cAAAC,G,MACN,GAAIC,EAAeC,SAAU,CAC3B,M,EAEFrB,EAAAC,KAAKe,QAAI,MAAAhB,SAAA,SAAAA,EAAEsB,WAAW,M,CAGxB,iBAAAC,GACEhB,EAAyBQ,eAAed,KAAKa,aAE7Cb,KAAKC,gBAAkBsB,EACrBvB,KAAKgB,YACLQ,EACA,CACErB,WAAYH,KAAKG,WACjBC,KAAM,qBAIVJ,KAAKyB,eAAiBnB,EAAyBoB,SAASC,IAAIC,IAC1D5B,KAAKK,WAAauB,CAAI,IAExB5B,KAAKK,WAAaC,EAAyBD,WAE3C,GAAIL,KAAK6B,gBAAiB,CACxB7B,KAAKO,kBAAkBP,KAAK6B,gB,EAIhC,kBAAAC,GACE,GAAI9B,KAAKe,KAAM,CACbf,KAAKe,KAAKgB,gBAAkB/B,KAAK+B,e,EAIrC,oBAAAC,G,OACEjC,EAAAC,KAAKyB,kBAAc,MAAA1B,SAAA,SAAAA,EAAEkC,S,CAGvB,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,uDACO,GACVC,MAAO,CACL,cAAetC,KAAKG,WACpB,CAAC,cAAcH,KAAKK,cAAe,QAGnCL,KAAKG,WACLgC,EAAA,yBAAuBI,KAAMvC,KAAK+B,iBAChCI,EAAA,QAAMI,KAAK,OAAOC,KAAK,UAEvB,KACJL,EAAA,OAAAE,IAAA,2CAAKC,MAAM,sBACTH,EAAA,QAAAE,IAAA,2CAAME,KAAK,SACXJ,EAAA,OAAAE,IAAA,2CAAKC,MAAM,UAAUG,QAAS,IAAMzC,KAAKkB,kBACvCiB,EAAA,QAAAE,IAAA,+C"}

package/dist/siemens-ix/p-73e0eb40.entry.js

@@ -0,0 +1,2 @@
+import{r as o,c as e,h as t,H as r,g as n}from"./p-f86a894a.js";import{B as i}from"./p-ed991838.js";import{L as a,I as d}from"./p-25ee1b62.js";const l=":host{display:inline-block;height:2rem;vertical-align:middle;cursor:pointer;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.429em;color:var(--theme-color-std-text)}: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 ::-webkit-scrollbar{width:0.5rem;height:0.5rem}: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 ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host button{all:unset;box-sizing:border-box;display:inline-flex;flex-direction:row;flex-wrap:nowrap;overflow:hidden;align-items:center;justify-content:center;width:100%;height:100%;padding:0 0.5rem}:host ix-spinner{margin-right:0.25rem}:host ix-icon{margin-right:0.25rem}:host .content{display:inline-block;position:relative;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .content-start{width:100%}:host .icon{pointer-events:none}:host(.disabled){cursor:default}:host .btn-danger{border-radius:var(--theme-btn--border-radius)}:host .btn-danger,:host .btn-danger.focus,:host .btn-danger:focus-visible{background-color:var(--theme-btn-danger--background);color:var(--theme-btn-danger--color);--ix-button-color:var(--theme-btn-danger--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-danger--border-color);border-style:solid}:host .btn-danger:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-danger.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-danger.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-danger.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-danger.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-danger.selected:not(.disabled):not(:disabled):active,:host .btn-danger.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-danger:not(.disabled):not(:disabled){cursor:pointer}:host .btn-danger:not(.disabled):not(:disabled):hover{border-color:var(--theme-btn-danger--border-color--hover);background-color:var(--theme-btn-danger--background--hover);color:var(--theme-btn-danger--color--hover)}:host .btn-danger:not(.disabled):not(:disabled){cursor:pointer}:host .btn-danger:not(.disabled):not(:disabled):active,:host .btn-danger:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-danger--border-color--active);background-color:var(--theme-btn-danger--background--active);color:var(--theme-btn-danger--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-danger.disabled,:host(.disabled) .btn-danger:disabled{pointer-events:none;border-color:var(--theme-btn-danger--border-color--disabled);background-color:var(--theme-btn-danger--background--disabled);color:var(--theme-btn-danger--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-danger--color--disabled)}:host .btn-outline-danger{border-radius:var(--theme-btn--border-radius)}:host .btn-outline-danger,:host .btn-outline-danger.focus,:host .btn-outline-danger:focus-visible{background-color:var(--theme-btn-outline-danger--background);color:var(--theme-btn-outline-danger--color);--ix-button-color:var(--theme-btn-outline-danger--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-outline-danger--border-color);border-style:solid}:host .btn-outline-danger:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-outline-danger.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-outline-danger.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-danger.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-outline-danger.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-danger.selected:not(.disabled):not(:disabled):active,:host .btn-outline-danger.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-outline-danger:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-danger:not(.disabled):not(:disabled):hover{border-color:var(--theme-btn-outline-danger--border-color--hover);background-color:var(--theme-btn-outline-danger--background--hover);color:var(--theme-btn-outline-danger--color--hover)}:host .btn-outline-danger:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-danger:not(.disabled):not(:disabled):active,:host .btn-outline-danger:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-outline-danger--border-color--active);background-color:var(--theme-btn-outline-danger--background--active);color:var(--theme-btn-outline-danger--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-outline-danger.disabled,:host(.disabled) .btn-outline-danger:disabled{pointer-events:none;border-color:var(--theme-btn-outline-danger--border-color--disabled);background-color:var(--theme-btn-outline-danger--background--disabled);color:var(--theme-btn-outline-danger--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-outline-danger--color--disabled)}:host .btn-invisible-danger{border-radius:var(--theme-btn--border-radius)}:host .btn-invisible-danger,:host .btn-invisible-danger.focus,:host .btn-invisible-danger:focus-visible{background-color:var(--theme-btn-invisible-danger--background);color:var(--theme-btn-invisible-danger--color);--ix-button-color:var(--theme-btn-invisible-danger--color);border-color:transparent}:host .btn-invisible-danger:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-invisible-danger.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-invisible-danger.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-danger.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-invisible-danger.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-danger.selected:not(.disabled):not(:disabled):active,:host .btn-invisible-danger.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-invisible-danger:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-danger:not(.disabled):not(:disabled):hover{background-color:var(--theme-btn-invisible-danger--background--hover);color:var(--theme-btn-invisible-danger--color--hover)}:host .btn-invisible-danger:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-danger:not(.disabled):not(:disabled):active,:host .btn-invisible-danger:not(.disabled):not(:disabled).active{background-color:var(--theme-btn-invisible-danger--background--active);color:var(--theme-btn-invisible-danger--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-invisible-danger.disabled,:host(.disabled) .btn-invisible-danger:disabled{pointer-events:none;background-color:var(--theme-btn-invisible-danger--background--disabled);color:var(--theme-btn-invisible-danger--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-invisible-danger--color--disabled)}:host .btn-primary{border-radius:var(--theme-btn--border-radius)}:host .btn-primary,:host .btn-primary.focus,:host .btn-primary:focus-visible{background-color:var(--theme-btn-primary--background);color:var(--theme-btn-primary--color);--ix-button-color:var(--theme-btn-primary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-primary--border-color);border-style:solid}:host .btn-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-primary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-primary.selected:not(.disabled):not(:disabled):active,:host .btn-primary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-primary:not(.disabled):not(:disabled):hover{border-color:var(--theme-btn-primary--border-color--hover);background-color:var(--theme-btn-primary--background--hover);color:var(--theme-btn-primary--color--hover)}:host .btn-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-primary:not(.disabled):not(:disabled):active,:host .btn-primary:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-primary--border-color--active);background-color:var(--theme-btn-primary--background--active);color:var(--theme-btn-primary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-primary.disabled,:host(.disabled) .btn-primary:disabled{pointer-events:none;border-color:var(--theme-btn-primary--border-color--disabled);background-color:var(--theme-btn-primary--background--disabled);color:var(--theme-btn-primary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-primary--color--disabled)}:host .btn-outline-primary{border-radius:var(--theme-btn--border-radius)}:host .btn-outline-primary,:host .btn-outline-primary.focus,:host .btn-outline-primary:focus-visible{background-color:var(--theme-btn-outline-primary--background);color:var(--theme-btn-outline-primary--color);--ix-button-color:var(--theme-btn-outline-primary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-outline-primary--border-color);border-style:solid}:host .btn-outline-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-outline-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-outline-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-primary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-outline-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-primary.selected:not(.disabled):not(:disabled):active,:host .btn-outline-primary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-outline-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-primary:not(.disabled):not(:disabled):hover{border-color:var(--theme-btn-outline-primary--border-color--hover);background-color:var(--theme-btn-outline-primary--background--hover);color:var(--theme-btn-outline-primary--color--hover)}:host .btn-outline-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-primary:not(.disabled):not(:disabled):active,:host .btn-outline-primary:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-outline-primary--border-color--active);background-color:var(--theme-btn-outline-primary--background--active);color:var(--theme-btn-outline-primary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-outline-primary.disabled,:host(.disabled) .btn-outline-primary:disabled{pointer-events:none;border-color:var(--theme-btn-outline-primary--border-color--disabled);background-color:var(--theme-btn-outline-primary--background--disabled);color:var(--theme-btn-outline-primary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-outline-primary--color--disabled)}:host .btn-invisible-primary{border-radius:var(--theme-btn--border-radius)}:host .btn-invisible-primary,:host .btn-invisible-primary.focus,:host .btn-invisible-primary:focus-visible{background-color:var(--theme-btn-invisible-primary--background);color:var(--theme-btn-invisible-primary--color);--ix-button-color:var(--theme-btn-invisible-primary--color);border-color:transparent}:host .btn-invisible-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-invisible-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-invisible-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-primary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-invisible-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-primary.selected:not(.disabled):not(:disabled):active,:host .btn-invisible-primary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-invisible-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-primary:not(.disabled):not(:disabled):hover{background-color:var(--theme-btn-invisible-primary--background--hover);color:var(--theme-btn-invisible-primary--color--hover)}:host .btn-invisible-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-primary:not(.disabled):not(:disabled):active,:host .btn-invisible-primary:not(.disabled):not(:disabled).active{background-color:var(--theme-btn-invisible-primary--background--active);color:var(--theme-btn-invisible-primary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-invisible-primary.disabled,:host(.disabled) .btn-invisible-primary:disabled{pointer-events:none;background-color:var(--theme-btn-invisible-primary--background--disabled);color:var(--theme-btn-invisible-primary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-invisible-primary--color--disabled)}:host .btn-secondary{border-radius:var(--theme-btn--border-radius)}:host .btn-secondary,:host .btn-secondary.focus,:host .btn-secondary:focus-visible{background-color:var(--theme-btn-secondary--background);color:var(--theme-btn-secondary--color);--ix-button-color:var(--theme-btn-secondary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-secondary--border-color);border-style:solid}:host .btn-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-secondary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-secondary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-secondary.selected:not(.disabled):not(:disabled):active,:host .btn-secondary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-secondary:not(.disabled):not(:disabled):hover{border-color:var(--theme-btn-secondary--border-color--hover);background-color:var(--theme-btn-secondary--background--hover);color:var(--theme-btn-secondary--color--hover)}:host .btn-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-secondary:not(.disabled):not(:disabled):active,:host .btn-secondary:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-secondary--border-color--active);background-color:var(--theme-btn-secondary--background--active);color:var(--theme-btn-secondary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-secondary.disabled,:host(.disabled) .btn-secondary:disabled{pointer-events:none;border-color:var(--theme-btn-secondary--border-color--disabled);background-color:var(--theme-btn-secondary--background--disabled);color:var(--theme-btn-secondary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-secondary--color--disabled)}:host .btn-outline-secondary{border-radius:var(--theme-btn--border-radius)}:host .btn-outline-secondary,:host .btn-outline-secondary.focus,:host .btn-outline-secondary:focus-visible{background-color:var(--theme-btn-outline-secondary--background);color:var(--theme-btn-outline-secondary--color);--ix-button-color:var(--theme-btn-outline-secondary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-outline-secondary--border-color);border-style:solid}:host .btn-outline-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-outline-secondary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-outline-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-secondary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-outline-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-secondary.selected:not(.disabled):not(:disabled):active,:host .btn-outline-secondary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-outline-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-secondary:not(.disabled):not(:disabled):hover{border-color:var(--theme-btn-outline-secondary--border-color--hover);background-color:var(--theme-btn-outline-secondary--background--hover);color:var(--theme-btn-outline-secondary--color--hover)}:host .btn-outline-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-secondary:not(.disabled):not(:disabled):active,:host .btn-outline-secondary:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-outline-secondary--border-color--active);background-color:var(--theme-btn-outline-secondary--background--active);color:var(--theme-btn-outline-secondary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-outline-secondary.disabled,:host(.disabled) .btn-outline-secondary:disabled{pointer-events:none;border-color:var(--theme-btn-outline-secondary--border-color--disabled);background-color:var(--theme-btn-outline-secondary--background--disabled);color:var(--theme-btn-outline-secondary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-outline-secondary--color--disabled)}:host .btn-invisible-secondary{border-radius:var(--theme-btn--border-radius)}:host .btn-invisible-secondary,:host .btn-invisible-secondary.focus,:host .btn-invisible-secondary:focus-visible{background-color:var(--theme-btn-invisible-secondary--background);color:var(--theme-btn-invisible-secondary--color);--ix-button-color:var(--theme-btn-invisible-secondary--color);border-color:transparent}:host .btn-invisible-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-invisible-secondary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled):active,:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-invisible-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-secondary:not(.disabled):not(:disabled):hover{background-color:var(--theme-btn-invisible-secondary--background--hover);color:var(--theme-btn-invisible-secondary--color--hover)}:host .btn-invisible-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-secondary:not(.disabled):not(:disabled):active,:host .btn-invisible-secondary:not(.disabled):not(:disabled).active{background-color:var(--theme-btn-invisible-secondary--background--active);color:var(--theme-btn-invisible-secondary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-invisible-secondary.disabled,:host(.disabled) .btn-invisible-secondary:disabled{pointer-events:none;background-color:var(--theme-btn-invisible-secondary--background--disabled);color:var(--theme-btn-invisible-secondary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-invisible-secondary--color--disabled)}:host{min-width:5rem}.dropdown-group{margin:0.687rem;display:block;position:relative;width:21.562rem;border-radius:0.25rem;background-color:#f8f9fa;border:solid 0.062rem rgba(0, 0, 0, 0.25)}.dropdown-group .dropdown-group-title{display:block;position:relative;font-size:0.875rem;text-align:left;margin:0.937rem 0 1.25rem 0.937rem}.dropdown-group .dropdown-group-content{position:relative;display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden;height:11.562rem;margin:0.937rem 0 0.937rem 0.937rem}.dropdown-group .dropdown-group-content>*{margin-bottom:1rem}.dropdown-group-submit{display:flex;justify-content:space-between;margin:0 0.687rem 0 0.687rem}.dropdown-menu{position:absolute;background-color:var(--theme-menu--background);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.143em;color:var(--theme-color-std-text);border:var(--theme-menu--border-thickness) solid var(--theme-menu--border--color);border-radius:var(--theme-menu--border-radius);max-width:100vw;padding:0.25rem 0;transition:background-color var(--theme-default-time);box-shadow:var(--theme-menu--box-shadow)}.dropdown-menu.xl>.dropdown-item{height:2.5rem;line-height:2.187rem}.dropdown-header{display:flex;align-items:center;height:2.5rem;color:var(--theme-menu-header--color);padding:0 1rem}.dropdown-buttons{display:flex;padding:0.25rem 0.5rem}.dropdown-buttons ix-icon-button+ix-icon-button{margin-inline-start:0.5rem}.dropdown-item{display:flex;height:2.5rem;position:relative;align-items:center;cursor:pointer;padding:0 2rem;border:1px solid transparent;color:var(--theme-menu-item--color);background-color:transparent}.dropdown-item:focus-visible{background-color:var(--theme-menu-item--background);color:var(--theme-menu-item--color)}.dropdown-item:focus-visible{outline:none;background-color:var(--theme-menu-item--background);border-color:#119fff;color:var(--theme-menu-item--color--focus)}.dropdown-item:not(.disabled):not(:disabled){cursor:pointer}.dropdown-item:not(.disabled):not(:disabled):hover{color:var(--theme-menu-item--color--hover);background-color:var(--theme-menu-item--background--hover)}.dropdown-item:not(.disabled):not(:disabled){cursor:pointer}.dropdown-item:not(.disabled):not(:disabled):active,.dropdown-item:not(.disabled):not(:disabled).active{color:var(--theme-menu-item--color--active);background-color:var(--theme-menu-item--background--active)}.dropdown-item.disabled,.dropdown-item:disabled{color:var(--theme-menu-item--color--disabled);background-color:var(--theme-menu-item--background--disabled)}.dropdown-item>a,.dropdown-item a:hover,.dropdown-item a:active{color:var(--theme-color-std-text)}.dropdown-item>.glyph{color:var(--theme-menu-item-icon--color);margin-inline-end:0.5rem}.dropdown-item>.glyph.disabled{color:var(--color-weak-text)}.dropdown-item>.glyph.glyph-single-check{color:var(--theme-menu-item-icon-check--color)}.dropdown-item>input[type=checkbox]+label{margin-bottom:0px}.dropdown-item>input[type=checkbox]+label::before{margin-right:1rem}.dropdown-divider{border-top:1px solid var(--theme-menu-separator--background);margin:0.25rem 0}button.dropdown-toggle{position:relative;padding-right:1.5rem}button.dropdown-toggle::after{position:absolute;top:45%;right:0.5rem}.form-control,.form-control-plaintext{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text);color:var(--theme-input--color);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--theme-input--border-radius);height:2rem;min-height:2rem;min-width:2rem;background-color:var(--theme-input--background);border:solid 1px var(--theme-input--border-color);box-shadow:var(--theme-input--box-shadow);padding-inline-start:0.5rem;padding-inline-end:0.5rem}.form-control::-moz-placeholder,.form-control-plaintext::-moz-placeholder{color:var(--theme-input-hint--color)}.form-control::placeholder,.form-control-plaintext::placeholder{color:var(--theme-input-hint--color)}.form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled),.form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled){cursor:pointer}.form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled),.form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled){cursor:pointer}.form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover,.form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover{background-color:var(--theme-input--background--hover);border-color:var(--theme-input--border-color--hover);cursor:auto}.form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover,.form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover{background-color:var(--theme-input--background--hover);border-color:var(--theme-input--border-color--hover);cursor:auto}.form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible,.form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible{background-color:var(--theme-input--background--focus);border-color:var(--theme-input--border-color--focus);outline-offset:var(--theme-input--focus--outline-offset);box-shadow:var(--theme-input--box-shadow);outline:1px solid var(--theme-color-focus-bdr)}.form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible,.form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible{background-color:var(--theme-input--background--focus);border-color:var(--theme-input--border-color--focus);outline-offset:var(--theme-input--focus--outline-offset);box-shadow:var(--theme-input--box-shadow);outline:1px solid var(--theme-color-focus-bdr)}.form-control:focus-visible{color:var(--theme-input--color)}.form-control[type=number]{text-align:right}.form-control[type=number]::-webkit-inner-spin-button{margin-right:-2px;margin-left:2px;display:none}.form-control.readonly,.form-control[readonly]{background:transparent !important;border-block-start:none !important;border-inline-start:none !important;border-inline-end:none !important;border-radius:0rem}.form-control:-moz-read-only{box-shadow:none !important;outline:none !important;border-color:var(--theme-input--border-color);cursor:default !important}.form-control:read-only,.form-control[readonly],.form-control[readOnly],.form-control.readonly{box-shadow:none !important;outline:none !important;border-color:var(--theme-input--border-color);cursor:default !important}.form-control:read-only::-moz-placeholder,.form-control[readonly]::-moz-placeholder,.form-control[readOnly]::-moz-placeholder,.form-control.readonly::-moz-placeholder{color:transparent}.form-control:-moz-read-only::placeholder{color:transparent}.form-control:read-only::placeholder,.form-control[readonly]::placeholder,.form-control[readOnly]::placeholder,.form-control.readonly::placeholder{color:transparent}.form-control:disabled,.form-control.disabled{background:transparent !important;border-block-start:none !important;border-inline-start:none !important;border-inline-end:none !important;border-radius:0rem;color:var(--theme-color-weak-text);border-color:var(--theme-input--border-color-bottom--disabled)}.form-control:disabled::-moz-placeholder,.form-control.disabled::-moz-placeholder{color:transparent}.form-control:disabled::placeholder,.form-control.disabled::placeholder{color:transparent}.form-control-plaintext{outline:0}.form-group{position:relative}.input-wrapper{display:flex;position:relative;align-items:center;flex-wrap:nowrap}.input-wrapper>.glyph{display:block;position:absolute;margin-inline-start:0.312rem;color:var(--theme-color-std-text)}.input-wrapper>input{padding-inline-start:2.2rem}select.form-control{padding:0 0.312rem}textarea.form-control{padding:0.375rem 0.5rem}input.disabled,input:disabled{color:var(--theme-input--color--disabled)}input:-moz-read-only{cursor:default}input:read-only,input.readonly{cursor:default}label{color:var(--theme-color-soft-text);padding:2px 0px}label.label-alignment-left{padding:6px 0px}input{font-feature-settings:\"clig\" off, \"liga\" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-0);line-height:var(--theme-line-height-md);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;min-height:2rem;width:100%;padding:0.25rem 0.5rem;background-color:var(--theme-input--background);color:var(--theme-input--color);-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;text-overflow:ellipsis;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color);border-radius:var(--theme-input--border-radius);box-shadow:var(--theme-input--box-shadow)}input:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}input:-webkit-autofill,input:autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}input::-moz-placeholder{color:var(--theme-input-hint--color)}input::placeholder{color:var(--theme-input-hint--color)}input:not(.readonly):not([readonly]):not([readOnly]):not(:-moz-read-only).hover,input:not(.readonly):not([readonly]):not([readOnly]):not(:-moz-read-only):hover{border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}input:not(.readonly):not([readonly]):not([readOnly]):not(:read-only).hover,input:not(.readonly):not([readonly]):not([readOnly]):not(:read-only):hover{border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}input:not(.readonly):not([readonly]):not([readOnly]):not(:-moz-read-only).focus,input:not(.readonly):not([readonly]):not([readOnly]):not(:-moz-read-only):focus{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}input:not(.readonly):not([readonly]):not([readOnly]):not(:read-only).focus,input:not(.readonly):not([readonly]):not([readOnly]):not(:read-only):focus{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}input:-moz-read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}input.read-only,input:read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}input.read-only::-moz-placeholder,input:read-only::-moz-placeholder{color:transparent}input:-moz-read-only::placeholder{color:transparent}input.read-only::placeholder,input:read-only::placeholder{color:transparent}input:disabled{box-shadow:none;background-color:transparent;outline:none;border:none;color:var(--theme-input--color--disabled);border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--disabled)}input:disabled::-moz-placeholder{color:transparent}input:disabled::placeholder{color:transparent}input[type=number]{text-align:right}input[type=number]::-webkit-inner-spin-button{margin-right:-2px;margin-left:2px;display:none}textarea{padding:0.375rem 1.25rem 0.375rem 0.5rem}textarea{font-feature-settings:\"clig\" off, \"liga\" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-0);line-height:var(--theme-line-height-md);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;min-height:2rem;width:100%;padding:0.25rem 0.5rem;background-color:var(--theme-input--background);color:var(--theme-input--color);-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;text-overflow:ellipsis;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color);border-radius:var(--theme-input--border-radius);box-shadow:var(--theme-input--box-shadow)}textarea:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}textarea:-webkit-autofill,textarea:autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}textarea::-moz-placeholder{color:var(--theme-input-hint--color)}textarea::placeholder{color:var(--theme-input-hint--color)}textarea:not(.readonly):not([readonly]):not([readOnly]):not(:-moz-read-only).hover,textarea:not(.readonly):not([readonly]):not([readOnly]):not(:-moz-read-only):hover{border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}textarea:not(.readonly):not([readonly]):not([readOnly]):not(:read-only).hover,textarea:not(.readonly):not([readonly]):not([readOnly]):not(:read-only):hover{border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}textarea:not(.readonly):not([readonly]):not([readOnly]):not(:-moz-read-only).focus,textarea:not(.readonly):not([readonly]):not([readOnly]):not(:-moz-read-only):focus{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}textarea:not(.readonly):not([readonly]):not([readOnly]):not(:read-only).focus,textarea:not(.readonly):not([readonly]):not([readOnly]):not(:read-only):focus{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}textarea:-moz-read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}textarea.read-only,textarea:read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}textarea.read-only::-moz-placeholder,textarea:read-only::-moz-placeholder{color:transparent}textarea:-moz-read-only::placeholder{color:transparent}textarea.read-only::placeholder,textarea:read-only::placeholder{color:transparent}textarea:disabled{box-shadow:none;background-color:transparent;outline:none;border:none;color:var(--theme-input--color--disabled);border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--disabled)}textarea:disabled::-moz-placeholder{color:transparent}textarea:disabled::placeholder{color:transparent}textarea~.valid-feedback,textarea~.invalid-feedback,input~.valid-feedback,input~.invalid-feedback{display:none;font-feature-settings:\"clig\" off, \"liga\" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-0);line-height:var(--theme-line-height-md);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}form textarea~.valid-feedback,form input~.valid-feedback{color:var(--theme-color-success)}form textarea~.invalid-feedback,form input~.invalid-feedback{color:var(--theme-color-alarm-text)}form:not([novalidate]) :invalid,form:not([novalidate]) .is-invalid,form.was-validated :invalid,form.was-validated .is-invalid{background-color:var(--theme-input-error--background);border-color:var(--theme-input-error--border-color);background-image:url(\"data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg width='512px' height='512px' viewBox='0 0 512 512' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3C!-- Generator: sketchtool 62 (101010) - https://sketch.com --%3E%3Ctitle%3Eerror%3C/title%3E%3Cdesc%3ECreated with sketchtool.%3C/desc%3E%3Cg id='Page-1' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd' fill-opacity='0.75'%3E%3Cg id='error' fill='%23ff2640'%3E%3Cg id='error/error'%3E%3Cpath d='M256,42.6666667 C373.626371,42.6666667 469.333333,138.373627 469.333333,256 C469.333333,373.626371 373.626371,469.333333 256,469.333333 C138.373627,469.333333 42.6666667,373.626371 42.6666667,256 C42.6666667,138.373627 138.373627,42.6666667 256,42.6666667 Z M256,85.3333333 C161.559631,85.3333333 85.3333333,161.559631 85.3333333,256 C85.3333333,350.44037 161.559631,426.666667 256,426.666667 C350.44037,426.666667 426.666667,350.44037 426.666667,256 C426.666667,161.559631 350.44037,85.3333333 256,85.3333333 Z M326.248389,155.581722 L356.418278,185.751611 L286.168667,255.999667 L356.418278,326.248389 L326.248389,356.418278 L255.999667,286.168667 L185.751611,356.418278 L155.581722,326.248389 L225.829667,255.999667 L155.581722,185.751611 L185.751611,155.581722 L255.999667,225.829667 L326.248389,155.581722 Z' id='Combined-Shape'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E\") !important;background-position:left calc(0.375em + 0.1875rem) center;padding-right:0.75rem;padding-left:calc(1.5em + 0.75rem);background-size:18px;background-repeat:no-repeat}form:not([novalidate]) :invalid~.invalid-feedback,form:not([novalidate]) .is-invalid~.invalid-feedback,form.was-validated :invalid~.invalid-feedback,form.was-validated .is-invalid~.invalid-feedback{display:block}form:not([novalidate]) :valid~.valid-feedback,form:not([novalidate]) .is-valid~.valid-feedback,form.was-validated :valid~.valid-feedback,form.was-validated .is-valid~.valid-feedback{display:block}form:not(.was-validated) .invalid-feedback,form:not(.was-validated) .valid-feedback{display:none !important}textarea.ix-info:not(.disabled):not(:disabled):not([disabled]),input.ix-info:not(.disabled):not(:disabled):not([disabled]){border-color:var(--theme-input--border-color--info)}textarea.ix-info:not(.disabled):not(:disabled):not([disabled]):hover,input.ix-info:not(.disabled):not(:disabled):not([disabled]):hover{border-color:var(--theme-input--border-color--info--hover) !important}textarea.ix-info:not(.disabled):not(:disabled):not([disabled]):active,input.ix-info:not(.disabled):not(:disabled):not([disabled]):active{border-color:var(--theme-input--border-color--info--active) !important}textarea.ix-warning:not(.disabled):not(:disabled):not([disabled]),input.ix-warning:not(.disabled):not(:disabled):not([disabled]){border-color:var(--theme-input--border-color--warning--active) !important}textarea.ix-warning:not(.disabled):not(:disabled):not([disabled]):hover,input.ix-warning:not(.disabled):not(:disabled):not([disabled]):hover{border-color:var(--theme-input--border-color--warning--active) !important}textarea.ix-warning:not(.disabled):not(:disabled):not([disabled]):active,input.ix-warning:not(.disabled):not(:disabled):not([disabled]):active{border-color:var(--theme-input--border-color--warning--active) !important}textarea[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]),input[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]){background-color:var(--theme-input--background--invalid);border-color:var(--theme-input--border-color--invalid)}textarea[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]),input[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]){border-color:var(--theme-input--border-color--invalid) !important}textarea[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]):hover,input[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]):hover{border-color:var(--theme-input--border-color--invalid--hover) !important}textarea[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]):active,input[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]):active{border-color:var(--theme-input--border-color--invalid--active) !important}:host{display:block;position:relative;height:auto}: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 ::-webkit-scrollbar{width:0.5rem;height:0.5rem}: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 ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .reset-button{position:absolute;top:0.25rem;right:0.25rem}:host .reset-button.hide-reset-button{display:none}:host .input-container{display:flex;height:auto;max-height:3.75rem;padding:1px 1.5rem 1px 1.75rem !important}:host .input-container:not(.readonly):not(.disabled){font-feature-settings:\"clig\" off, \"liga\" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-0);line-height:var(--theme-line-height-md);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;min-height:2rem;width:100%;padding:0.25rem 0.5rem;background-color:var(--theme-input--background);color:var(--theme-input--color);-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;text-overflow:ellipsis;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color);border-radius:var(--theme-input--border-radius);box-shadow:var(--theme-input--box-shadow)}:host .input-container:not(.readonly):not(.disabled):-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}:host .input-container:not(.readonly):not(.disabled):-webkit-autofill,:host .input-container:not(.readonly):not(.disabled):autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}:host .input-container:not(.readonly):not(.disabled)::-moz-placeholder{color:var(--theme-input-hint--color)}:host .input-container:not(.readonly):not(.disabled)::placeholder{color:var(--theme-input-hint--color)}:host .input-container:not(.readonly):not(.disabled):not(.readonly):not([readonly]):not([readOnly]):not(:-moz-read-only).hover,:host .input-container:not(.readonly):not(.disabled):not(.readonly):not([readonly]):not([readOnly]):not(:-moz-read-only):hover{border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}:host .input-container:not(.readonly):not(.disabled):not(.readonly):not([readonly]):not([readOnly]):not(:read-only).hover,:host .input-container:not(.readonly):not(.disabled):not(.readonly):not([readonly]):not([readOnly]):not(:read-only):hover{border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}:host .input-container:not(.readonly):not(.disabled):not(.readonly):not([readonly]):not([readOnly]):not(:-moz-read-only).focus,:host .input-container:not(.readonly):not(.disabled):not(.readonly):not([readonly]):not([readOnly]):not(:-moz-read-only):focus{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}:host .input-container:not(.readonly):not(.disabled):not(.readonly):not([readonly]):not([readOnly]):not(:read-only).focus,:host .input-container:not(.readonly):not(.disabled):not(.readonly):not([readonly]):not([readOnly]):not(:read-only):focus{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}:host .input-container:not(.readonly):not(.disabled):disabled{box-shadow:none;background-color:transparent;outline:none;border:none;color:var(--theme-input--color--disabled);border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--disabled)}:host .input-container:not(.readonly):not(.disabled):disabled::-moz-placeholder{color:transparent}:host .input-container:not(.readonly):not(.disabled):disabled::placeholder{color:transparent}:host .input-container:not(.readonly):not(.disabled):hover{border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}:host .input-container:not(.readonly):not(.disabled).focus{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}:host .input-container.disabled{color:var(--theme-input--color--disabled);border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--disabled)}:host .input-container.readonly{font-feature-settings:\"clig\" off, \"liga\" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-0);line-height:var(--theme-line-height-md);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;min-height:2rem;width:100%;padding:0.25rem 0.5rem;background-color:var(--theme-input--background);color:var(--theme-input--color);-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;text-overflow:ellipsis;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color);border-radius:var(--theme-input--border-radius);box-shadow:var(--theme-input--box-shadow)}:host .input-container.readonly:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}:host .input-container.readonly:-webkit-autofill,:host .input-container.readonly:autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}:host .input-container.readonly::-moz-placeholder{color:var(--theme-input-hint--color)}:host .input-container.readonly::placeholder{color:var(--theme-input-hint--color)}:host .input-container.readonly:not(.readonly):not([readonly]):not([readOnly]):not(:-moz-read-only).hover,:host .input-container.readonly:not(.readonly):not([readonly]):not([readOnly]):not(:-moz-read-only):hover{border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}:host .input-container.readonly:not(.readonly):not([readonly]):not([readOnly]):not(:read-only).hover,:host .input-container.readonly:not(.readonly):not([readonly]):not([readOnly]):not(:read-only):hover{border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}:host .input-container.readonly:not(.readonly):not([readonly]):not([readOnly]):not(:-moz-read-only).focus,:host .input-container.readonly:not(.readonly):not([readonly]):not([readOnly]):not(:-moz-read-only):focus{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}:host .input-container.readonly:not(.readonly):not([readonly]):not([readOnly]):not(:read-only).focus,:host .input-container.readonly:not(.readonly):not([readonly]):not([readOnly]):not(:read-only):focus{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}:host .input-container.readonly:-moz-read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}:host .input-container.readonly.read-only,:host .input-container.readonly:read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}:host .input-container.readonly.read-only::-moz-placeholder,:host .input-container.readonly:read-only::-moz-placeholder{color:transparent}:host .input-container.readonly:-moz-read-only::placeholder{color:transparent}:host .input-container.readonly.read-only::placeholder,:host .input-container.readonly:read-only::placeholder{color:transparent}:host .input-container.readonly:disabled{box-shadow:none;background-color:transparent;outline:none;border:none;color:var(--theme-input--color--disabled);border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--disabled)}:host .input-container.readonly:disabled::-moz-placeholder{color:transparent}:host .input-container.readonly:disabled::placeholder{color:transparent}:host .input-container.no-icon{padding-left:0.25rem}:host .token-container{flex-grow:1;overflow:hidden}:host .text-input{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text);width:auto;height:1.75rem;min-height:1.5rem;background:transparent;flex-grow:1;box-shadow:none}:host .text-input,:host .text-input:hover,:host .text-input:focus :host .text-input:focus-visible{border:none !important;outline:none !important}:host .text-input.hide-placeholder::-moz-placeholder{opacity:0}:host .text-input.hide-placeholder::placeholder{opacity:0}:host .list-unstyled{display:flex;flex-wrap:wrap;list-style:none;padding:0;margin:0;overflow-y:auto}:host ix-icon{position:absolute;top:0.5rem;left:0.5rem}:host ix-filter-chip{margin-right:0.25rem}:host .category-preview{display:flex;align-items:center;height:1.5rem;background-color:var(--theme-bg-3);border-top-left-radius:1rem;border-bottom-left-radius:1rem;padding:0.5rem;margin:2px 0}:host ul{height:100%}:host ul>li,:host input{padding-inline-start:0;padding-top:2px;padding-bottom:2px}:host ix-dropdown{min-width:10rem !important}:host ix-dropdown .dropdown-item-container{display:flex;flex-direction:column}:host ix-dropdown .dropdown-item-container .dropdown-item{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.143em;color:var(--theme-color-std-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;height:2.5rem;margin:0.25rem 0.5rem;padding-inline:0.5rem;border:1px solid transparent;border-radius:100rem;width:auto;justify-content:flex-start;flex-grow:1}:host ix-dropdown .dropdown-item-container .dropdown-item:not(.disabled):not(:disabled):focus-visible{border-color:var(--theme-color-focus-bdr)}:host ix-dropdown .dropdown-item-container .category-item{border-end-end-radius:0;border-start-end-radius:0}:host ix-dropdown .dropdown-item-container .category-item-value{border-start-start-radius:0;border-end-start-radius:0}:host ix-dropdown .btn-toggle-operator{width:2rem;height:2rem;margin-inline:0.5rem}:host .d-none{display:none}";const s=l;const c=class{constructor(t){o(this,t);this.categoryChanged=e(this,"categoryChanged",7);this.inputChanged=e(this,"inputChanged",7);this.filterChanged=e(this,"filterChanged",7);this.ID_CUSTOM_FILTER_VALUE="CW_CUSTOM_FILTER_VALUE";this.showDropdown=undefined;this.textInput=undefined;this.hasFocus=undefined;this.categoryLogicalOperator=a.EQUAL;this.inputValue=undefined;this.category=undefined;this.filterTokens=[];this.disabled=false;this.readonly=false;this.filterState=undefined;this.placeholder=undefined;this.categories=undefined;this.nonSelectableCategories={};this.suggestions=undefined;this.icon="search";this.hideIcon=undefined;this.staticOperator=undefined;this.repeatCategories=true;this.tmpDisableScrollIntoView=true;this.labelCategories="Categories";this.i18nPlainText="Filter by text"}get dropdown(){return this.hostElement.shadowRoot.querySelector("ix-dropdown")}watchFilterState(o){this.setFilterState(o)}componentDidLoad(){var o,e;if(this.filterState!==undefined){setTimeout((()=>this.setFilterState(this.filterState)))}(o=this.hostElement)===null||o===void 0?void 0:o.addEventListener("keydown",this.handleFormElementKeyDown.bind(this));(e=this.formElement)===null||e===void 0?void 0:e.addEventListener("submit",(o=>o.preventDefault()));if(this.textInput==null){console.warn("ix-category-filter - unable to add event listeners to native input element");return}this.textInput.addEventListener("focusin",(()=>{this.hasFocus=true}));this.textInput.addEventListener("focusout",(()=>this.hasFocus=false));this.textInput.addEventListener("input",(()=>{this.inputValue=this.textInput.value;const o=new d(this.inputValue,this.category);this.inputChanged.emit(o);if(!this.dropdown.show){this.openDropdown()}}));this.textInput.addEventListener("keydown",this.handleInputElementKeyDown.bind(this))}setFilterState(o){this.filterTokens=[];for(const e of o.tokens){this.addToken(e,this.ID_CUSTOM_FILTER_VALUE,this.categoryLogicalOperator,false)}for(const e of o.categories){this.addToken(e.value,e.id,e.operator,false)}this.emitFilterEvent()}closeDropdown(){if(this.disabled||this.readonly){return}this.dropdown.show=false}openDropdown(){if(this.disabled||this.readonly){return}this.dropdown.show=true}handleFormElementKeyDown(o){switch(o.code){case"Enter":case"NumpadEnter":if(!document.activeElement.classList.contains("dropdown-item")){return}const e=document.activeElement.getAttribute("data-id");if(this.hasCategorySelection()){if(this.category!==undefined){this.addToken(e,this.category)}else if(document.activeElement.classList.contains("category-item-id")){this.selectCategory(e)}}else{this.addToken(e)}o.preventDefault();break;case"ArrowUp":this.focusPreviousItem();o.preventDefault();break;case"ArrowDown":this.showDropdown=true;this.focusNextItem();o.preventDefault();break;case"Escape":this.closeDropdown();break}}focusPreviousItem(){const o=document.activeElement.previousSibling;if(o instanceof HTMLElement){o.focus()}}focusNextItem(){const o=document.activeElement.nextSibling;if(o instanceof HTMLElement){o.focus()}}handleInputElementKeyDown(o){var e;switch(o.code){case"ArrowDown":const t=`.category-item-${this.category!==undefined?"value":"id"}`;let r=this.hostElement.shadowRoot.querySelector(t);if(r instanceof HTMLElement){r.focus();o.stopPropagation()}else if((e=this.suggestions)===null||e===void 0?void 0:e.length){r=this.hostElement.shadowRoot.querySelector(".category-item");if(r instanceof HTMLElement){r.focus();o.stopPropagation()}}break;case"Backspace":if(this.textInput.value!==""){return}if(this.category!==undefined){this.category=undefined;return}const n=this.filterTokens.length;if(n>0){this.removeToken(n-1)}break;case"Enter":case"NumpadEnter":this.addToken(this.inputValue,this.category);o.preventDefault();break}}emitFilterEvent(){const o=this.filterTokens.filter((o=>o.id===this.ID_CUSTOM_FILTER_VALUE)).map((o=>o.value));const e=this.filterTokens.filter((o=>o.id!==this.ID_CUSTOM_FILTER_VALUE));const t={tokens:o,categories:e};this.filterChanged.emit(t)}addToken(o,e=this.ID_CUSTOM_FILTER_VALUE,t=this.categoryLogicalOperator,r=true){if(o===undefined||o===null){return}const n=o.trim();if(n===""){return}if(this.hasToken(n)){return}const i={id:e,value:n,operator:t};this.filterTokens=[...this.filterTokens,i];this.textInput.value="";this.inputValue="";this.categoryLogicalOperator=a.EQUAL;if(this.category!==undefined){this.category=undefined}this.isScrollStateDirty=true;this.textInput.focus();if(r){this.emitFilterEvent()}}removeToken(o){this.filterTokens=this.filterTokens.filter(((e,t)=>t!==o));this.emitFilterEvent()}getCategoryIds(){const o=[];for(const e in this.categories){if(Object.prototype.hasOwnProperty.call(this.categories,e)){o.push(e)}}return o}selectCategory(o){this.category=o;this.textInput.value="";this.inputValue="";this.textInput.focus();this.categoryChanged.emit(o)}resetFilter(o){o.stopPropagation();this.closeDropdown();this.filterTokens=[];this.emitFilterEvent()}filterMultiples(o){if(this.repeatCategories){return true}const e=this.filterTokens.find((e=>e.id===o));return!e}hasToken(o){return this.filterTokens.some((e=>{const t=e.value===o;if(!t){return false}if(this.category!==undefined){return this.category===e.id}if(e.id){return e.id===this.ID_CUSTOM_FILTER_VALUE}return t}))}filterDuplicateTokens(o){return!this.hasToken(o)}filterByInput(o){if(this.inputValue===undefined||this.inputValue===""){return true}return o.toLowerCase().indexOf(this.inputValue.toLowerCase())!==-1}toggleCategoryOperator(){switch(this.categoryLogicalOperator){case a.EQUAL:this.categoryLogicalOperator=a.NOT_EQUAL;break;case a.NOT_EQUAL:this.categoryLogicalOperator=a.EQUAL;break}}getFilterChipLabel(o){var e,t,r;if(o.id===this.ID_CUSTOM_FILTER_VALUE){return o.value}const n=o.operator===a.EQUAL?"=":"!=";const i=(r=(t=(e=this.categories[o.id])===null||e===void 0?void 0:e.label)!==null&&t!==void 0?t:this.nonSelectableCategories[o.id])!==null&&r!==void 0?r:o.id;return`${i} ${n} ${o.value}`}getFilteredSuggestions(){var o,e;if(!((o=this.suggestions)===null||o===void 0?void 0:o.length)){return[]}return(e=this.suggestions)===null||e===void 0?void 0:e.filter((o=>this.filterByInput(o))).filter((o=>this.filterDuplicateTokens(o)))}hasCategorySelection(){return this.categories!==undefined}renderPlainSuggestions(){return t("div",{class:"dropdown-item-container"},this.getFilteredSuggestions().map((o=>t("button",{class:"dropdown-item","data-id":o,onClick:()=>this.addToken(o),key:o,title:o},o))))}renderOperatorButton(){if(this.staticOperator){return""}const o={type:"button",variant:"secondary",outline:false,ghost:true,iconOnly:true,iconOval:false,selected:false,disabled:this.disabled||this.staticOperator!==undefined,loading:false,icon:"",onClick:o=>{o.stopPropagation();this.toggleCategoryOperator()},extraClasses:{"btn-icon-32":true,"btn-toggle-operator":true}};return t(i,Object.assign({},o),this.categoryLogicalOperator===a.NOT_EQUAL?"=":"!=")}getFilterOperatorString(){let o;if(this.staticOperator!==undefined){o=this.staticOperator}else{o=this.categoryLogicalOperator}return`${o===a.EQUAL?"=":"!="} `}renderCategoryValues(){var o,e;return t("div",{class:"dropdown-item-container"},this.renderOperatorButton(),t("div",{class:"dropdown-header"},(o=this.categories[this.category])===null||o===void 0?void 0:o.label),(e=this.categories[this.category])===null||e===void 0?void 0:e.options.filter((o=>this.filterByInput(o))).filter((o=>this.filterDuplicateTokens(o))).map((o=>t("button",{class:"dropdown-item category-item-value","data-id":o,title:o,key:o,onClick:e=>{e.preventDefault();this.addToken(o,this.category)}},`${this.getFilterOperatorString()} ${o}`))))}renderDropdownContent(){if(this.hasCategorySelection()){if(this.category!==undefined){return this.renderCategoryValues()}else{return this.renderCategorySelection()}}else return this.renderPlainSuggestions()}renderCategorySelection(){var o;return t("div",{class:"dropdown-item-container"},(o=this.getCategoryIds())===null||o===void 0?void 0:o.filter((o=>this.filterByInput(this.categories[o].label))).filter((o=>this.filterMultiples(o))).map((o=>{var e;return t("button",{class:"dropdown-item category-item category-item-id","data-id":o,title:this.categories[o].label,key:o,onClick:e=>{e.preventDefault();this.selectCategory(o)},tabindex:"0"},(e=this.categories[o])===null||e===void 0?void 0:e.label)})))}getDropdownHeader(){if(this.categories!==undefined){if(this.category!==undefined){return null}else{return this.labelCategories}}return this.i18nPlainText}componentDidRender(){if(this.isScrollStateDirty){if(!this.tmpDisableScrollIntoView){this.textInput.scrollIntoView()}this.isScrollStateDirty=false}}getResetButton(){return t("ix-icon-button",{onClick:o=>this.resetFilter(o),class:{"reset-button":true,"hide-reset-button":!this.filterTokens.length&&this.category===undefined},ghost:true,oval:true,icon:"clear",size:"16"})}getIconColor(){if(this.disabled){return"color-componentn-1"}if(this.readonly){return"color-std-txt"}return"color-primary"}render(){var o;return t(r,{key:"97bb9bcad06d6a787b844f74a4333c231761d0aa"},t("form",{key:"8f26df740ee486e72227861241373fdccaed5b83",ref:o=>this.formElement=o},t("div",{key:"0a15103e3758ef442af9e5cdcb193ccf428ab588","read-only":this.readonly,class:{"input-container":true,disabled:this.disabled,focus:this.hasFocus,readonly:this.readonly,"no-icon":this.hideIcon}},t("ix-icon",{key:"bcf843c92c0cb07f4882e154f22beb5b9d585155",color:this.getIconColor(),class:{"d-none":this.hideIcon},name:this.icon,size:"16"}),t("div",{key:"8f8873087dd4f858d8c05524fa57e60630e455fa",class:"token-container"},t("ul",{key:"ac256e8c54bee74655b96e30f7ff01867185f2b7",class:"list-unstyled"},this.filterTokens.map(((o,e)=>t("li",{key:o.toString(),class:{animate__animated:true,animate__fadein:true}},t("ix-filter-chip",{disabled:this.disabled,readonly:this.readonly,onClick:o=>o.stopPropagation(),onCloseClick:()=>this.removeToken(e)},this.getFilterChipLabel(o))))),this.categories===undefined?"":t("li",{class:{"category-preview":true,"d-none":this.category===undefined}},(o=this.categories[this.category])===null||o===void 0?void 0:o.label),t("input",{key:"58e035c5bf86c7a4f7cc01e1975a13beaa67ef45",class:{"text-input":true,"hide-placeholder":this.readonly||this.disabled||this.category!==undefined},autocomplete:"off",name:"category-filter-input",disabled:this.disabled,readonly:this.readonly,ref:o=>this.textInput=o,type:"text",placeholder:this.placeholder}))),!this.readonly&&!this.disabled&&this.getResetButton())),this.disabled||this.readonly?"":t("ix-dropdown",{show:this.showDropdown,closeBehavior:"outside",offset:{mainAxis:2},anchor:this.textInput,trigger:this.hostElement,header:this.getDropdownHeader()},this.renderDropdownContent()))}get hostElement(){return n(this)}static get watchers(){return{filterState:["watchFilterState"]}}};c.style=s;export{c as ix_category_filter};
+//# sourceMappingURL=p-73e0eb40.entry.js.map

package/dist/siemens-ix/p-73e0eb40.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["categoryFilterCss","IxCategoryFilterStyle0","CategoryFilter","this","ID_CUSTOM_FILTER_VALUE","LogicalFilterOperator","EQUAL","dropdown","hostElement","shadowRoot","querySelector","watchFilterState","newValue","setFilterState","componentDidLoad","filterState","undefined","setTimeout","_a","addEventListener","handleFormElementKeyDown","bind","_b","formElement","e","preventDefault","textInput","console","warn","hasFocus","inputValue","value","inputState","InputState","category","inputChanged","emit","show","openDropdown","handleInputElementKeyDown","state","filterTokens","token","tokens","addToken","categoryLogicalOperator","categories","id","operator","emitFilterEvent","closeDropdown","disabled","readonly","code","document","activeElement","classList","contains","getAttribute","hasCategorySelection","selectCategory","focusPreviousItem","showDropdown","focusNextItem","sibling","previousSibling","HTMLElement","focus","nextSibling","selector","item","stopPropagation","suggestions","length","tokenCount","removeToken","filter","map","filterChanged","emitEvent","newToken","trim","hasToken","pair","isScrollStateDirty","index","_","i","getCategoryIds","ids","Object","prototype","hasOwnProperty","call","push","categoryChanged","resetFilter","filterMultiples","repeatCategories","isCategoryAlreadySet","find","some","filterToken","hasSameValue","filterDuplicateTokens","filterByInput","toLowerCase","indexOf","toggleCategoryOperator","NOT_EQUAL","getFilterChipLabel","operatorString","label","_c","nonSelectableCategories","getFilteredSuggestions","renderPlainSuggestions","h","class","suggestion","onClick","key","title","renderOperatorButton","staticOperator","params","type","variant","outline","ghost","iconOnly","iconOval","selected","loading","icon","extraClasses","BaseButton","assign","getFilterOperatorString","renderCategoryValues","options","renderDropdownContent","renderCategorySelection","tabindex","getDropdownHeader","labelCategories","i18nPlainText","componentDidRender","tmpDisableScrollIntoView","scrollIntoView","getResetButton","oval","size","getIconColor","render","Host","ref","el","hideIcon","color","name","toString","animate__animated","animate__fadein","onCloseClick","autocomplete","placeholder","closeBehavior","offset","mainAxis","anchor","trigger","header"],"sources":["src/components/category-filter/category-filter.scss?tag=ix-category-filter&encapsulation=shadow","src/components/category-filter/category-filter.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@import 'common-variables';\n@import 'legacy/mixins/fonts';\n@import 'mixins/hover';\n@import 'mixins/shadows';\n@import 'mixins/shadow-dom/component';\n@import 'mixins/text-truncation';\n@import '../button/button';\n@import 'legacy/components/dropdown';\n@import 'legacy/components/forms';\n@import 'components/form/input';\n\n:host {\n  @include ix-component;\n\n  display: block;\n  position: relative;\n  height: auto;\n\n  .reset-button {\n    position: absolute;\n    top: $tiny-space;\n    right: $tiny-space;\n  }\n\n  .reset-button.hide-reset-button {\n    display: none;\n  }\n\n  .input-container {\n    &:not(.readonly):not(.disabled) {\n      @include element-input('false');\n    }\n\n    &:not(.readonly):not(.disabled):hover {\n      border-color: var(--theme-input--border-color--hover) !important;\n      background-color: var(--theme-input--background--hover);\n    }\n\n    &:not(.readonly):not(.disabled).focus {\n      outline: 1px solid var(--theme-color-focus-bdr);\n      outline-offset: var(--theme-input--focus--outline-offset);\n      border-color: var(--theme-input--border-color--focus) !important;\n    }\n\n    &.disabled {\n      color: var(--theme-input--color--disabled);\n      border-bottom: var(--theme-input--border-thickness, 1px) solid\n        var(--theme-input--border-color-bottom--disabled);\n    }\n\n    &.readonly {\n      @include element-input;\n    }\n\n    display: flex;\n    height: auto;\n    max-height: 3.75rem;\n    padding: 1px $large-space 1px 1.75rem !important;\n\n    &.no-icon {\n      padding-left: $tiny-space;\n    }\n  }\n\n  .token-container {\n    flex-grow: 1;\n    overflow: hidden;\n  }\n\n  .text-input {\n    @include ellipsis;\n    @include text-default;\n    width: auto;\n    height: 1.75rem;\n    min-height: $large-space;\n    background: transparent;\n    flex-grow: 1;\n    box-shadow: none;\n\n    &,\n    &:hover,\n    &:focus\n    &:focus-visible {\n      border: none !important;\n      outline: none !important;\n    }\n\n    &.hide-placeholder::placeholder {\n      opacity: 0;\n    }\n  }\n\n  .list-unstyled {\n    display: flex;\n    flex-wrap: wrap;\n    list-style: none;\n    padding: 0;\n    margin: 0;\n    overflow-y: auto;\n  }\n\n  ix-icon {\n    position: absolute;\n    top: $small-space;\n    left: $small-space;\n  }\n\n  ix-filter-chip {\n    margin-right: $tiny-space;\n  }\n\n  .category-preview {\n    display: flex;\n    align-items: center;\n    height: $large-space;\n    background-color: var(--theme-bg-3);\n    border-top-left-radius: $default-space;\n    border-bottom-left-radius: $default-space;\n    padding: $small-space;\n    margin: 2px 0;\n  }\n\n  ul {\n    height: 100%;\n  }\n\n  ul > li,\n  input {\n    padding-inline-start: 0;\n    padding-top: 2px;\n    padding-bottom: 2px;\n  }\n\n  ix-dropdown {\n    min-width: 10rem !important;\n\n    .dropdown-item-container {\n      display: flex;\n      flex-direction: column;\n\n      .dropdown-item {\n        @include text-default-single;\n        @include ellipsis;\n        @include focus-visible {\n          border-color: var(--theme-color-focus-bdr);\n        }\n\n        height: $large-control-height;\n        margin: $tiny-space $small-space;\n        padding-inline: $small-space;\n        border: 1px solid transparent;\n        border-radius: 100rem;\n        width: auto;\n        justify-content: flex-start;\n        flex-grow: 1;\n      }\n\n      .category-item {\n        border-end-end-radius: 0;\n        border-start-end-radius: 0;\n      }\n\n      .category-item-value {\n        border-start-start-radius: 0;\n        border-end-start-radius: 0;\n      }\n    }\n\n    .btn-toggle-operator {\n      width: 2rem;\n      height: 2rem;\n      margin-inline: $small-space;\n    }\n  }\n\n  .d-none {\n    display: none;\n  }\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  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core';\nimport { BaseButton, BaseButtonProps } from '../button/base-button';\nimport { FilterState } from './filter-state';\nimport { InputState } from './input-state';\nimport { LogicalFilterOperator } from './logical-filter-operator';\n\n@Component({\n  tag: 'ix-category-filter',\n  styleUrl: 'category-filter.scss',\n  shadow: true,\n})\nexport class CategoryFilter {\n  private readonly ID_CUSTOM_FILTER_VALUE = 'CW_CUSTOM_FILTER_VALUE';\n\n  @State() showDropdown: boolean;\n  @State() private textInput?: HTMLInputElement;\n  private formElement?: HTMLFormElement;\n  private isScrollStateDirty: boolean;\n\n  @Element() hostElement: HTMLIxCategoryFilterElement;\n\n  @State() hasFocus: boolean;\n  @State() categoryLogicalOperator = LogicalFilterOperator.EQUAL;\n  @State() inputValue: string;\n  @State() category: string;\n  @State() filterTokens: Array<{\n    id: string;\n    value: string;\n    operator: LogicalFilterOperator;\n  }> = [];\n\n  /**\n   * If true the filter will be in disabled state\n   */\n  @Prop() disabled = false;\n\n  /**\n   * If true the filter will be in readonly mode\n   */\n  @Prop() readonly = false;\n\n  /**\n   * A set of search criteria to populate the component with.\n   */\n  @Prop() filterState: FilterState;\n\n  /**\n   * Placeholder text to be displayed in an empty input field.\n   */\n  @Prop() placeholder: string;\n\n  /**\n   * Configuration object hash used to populate the dropwdown menu for typeahead and quick selection functionality.\n   * Each ID maps to an object with a label and an array of options to select from.\n   */\n  @Prop() categories: {\n    [id: string]: {\n      label: string;\n      options: string[];\n    };\n  };\n\n  /**\n   * In certain use cases some categories may not be available for selection anymore.\n   * To allow proper display of set filters with these categories this ID to label mapping can be populated.\n   *\n   * Configuration object hash used to supply labels to the filter chips in the input field.\n   * Each ID maps to a string representing the label to display.\n   */\n  @Prop() nonSelectableCategories?: {\n    [id: string]: string;\n  } = {};\n\n  /**\n   * A list of strings that will be supplied as typeahead suggestions not tied to any categories.\n   */\n  @Prop() suggestions: string[];\n\n  /**\n   * The icon next to the actual text input\n   * Defaults to 'search'\n   */\n  @Prop() icon = 'search';\n\n  /**\n   * Allows to hide the icon inside the text input.\n   * Defaults to false\n   */\n  @Prop() hideIcon: boolean;\n\n  /**\n   * If set categories will always be filtered via the respective logical operator.\n   * Toggling of the operator will not be available to the user.\n   *\n   * @since 2.2.0\n   */\n  @Prop() staticOperator?: LogicalFilterOperator;\n\n  /**\n   * If set to true allows that a single category can be set more than once.\n   * An already set category will not appear in the category dropdown if set to false.\n   *\n   * Defaults to true\n   */\n  @Prop() repeatCategories = true;\n\n  /**\n   * @internal For debugging purposes only!\n   */\n  @Prop() tmpDisableScrollIntoView = true;\n\n  /**\n   * i18n\n   */\n  @Prop() labelCategories = 'Categories';\n\n  /**\n   * i18n\n   */\n  @Prop() i18nPlainText = 'Filter by text';\n\n  /**\n   * Event dispatched whenever the a category gets selected in the dropdown\n   */\n  @Event() categoryChanged: EventEmitter<string>;\n\n  /**\n   * Event dispatched whenever the text input changes.\n   */\n  @Event() inputChanged: EventEmitter<InputState>;\n\n  /**\n   * Event dispatched whenever the filter state changes.\n   */\n  @Event() filterChanged: EventEmitter<FilterState>;\n\n  get dropdown() {\n    return this.hostElement.shadowRoot.querySelector('ix-dropdown');\n  }\n\n  @Watch('filterState')\n  watchFilterState(newValue) {\n    this.setFilterState(newValue);\n  }\n\n  componentDidLoad() {\n    if (this.filterState !== undefined) {\n      setTimeout(() => this.setFilterState(this.filterState));\n    }\n\n    this.hostElement?.addEventListener(\n      'keydown',\n      this.handleFormElementKeyDown.bind(this)\n    );\n\n    this.formElement?.addEventListener('submit', (e) => e.preventDefault());\n\n    if (this.textInput == null) {\n      console.warn(\n        'ix-category-filter - unable to add event listeners to native input element'\n      );\n      return;\n    }\n\n    this.textInput.addEventListener('focusin', () => {\n      this.hasFocus = true;\n    });\n    this.textInput.addEventListener('focusout', () => (this.hasFocus = false));\n    this.textInput.addEventListener('input', () => {\n      this.inputValue = this.textInput.value;\n      const inputState = new InputState(this.inputValue, this.category);\n      this.inputChanged.emit(inputState);\n\n      if (!this.dropdown.show) {\n        this.openDropdown();\n      }\n    });\n    this.textInput.addEventListener(\n      'keydown',\n      this.handleInputElementKeyDown.bind(this)\n    );\n  }\n\n  private setFilterState(state: FilterState) {\n    this.filterTokens = [];\n\n    for (const token of state.tokens) {\n      this.addToken(\n        token,\n        this.ID_CUSTOM_FILTER_VALUE,\n        this.categoryLogicalOperator,\n        false\n      );\n    }\n\n    for (const category of state.categories) {\n      this.addToken(category.value, category.id, category.operator, false);\n    }\n\n    this.emitFilterEvent();\n  }\n\n  private closeDropdown() {\n    if (this.disabled || this.readonly) {\n      return;\n    }\n\n    this.dropdown.show = false;\n  }\n\n  private openDropdown() {\n    if (this.disabled || this.readonly) {\n      return;\n    }\n\n    this.dropdown.show = true;\n  }\n\n  private handleFormElementKeyDown(e: KeyboardEvent) {\n    switch (e.code) {\n      case 'Enter':\n      case 'NumpadEnter':\n        if (!document.activeElement.classList.contains('dropdown-item')) {\n          return;\n        }\n\n        const token = document.activeElement.getAttribute('data-id');\n\n        if (this.hasCategorySelection()) {\n          if (this.category !== undefined) {\n            this.addToken(token, this.category);\n          } else if (\n            document.activeElement.classList.contains('category-item-id')\n          ) {\n            this.selectCategory(token);\n          }\n        } else {\n          this.addToken(token);\n        }\n\n        e.preventDefault();\n        break;\n\n      case 'ArrowUp':\n        this.focusPreviousItem();\n        e.preventDefault();\n        break;\n\n      case 'ArrowDown':\n        this.showDropdown = true;\n        this.focusNextItem();\n        e.preventDefault();\n        break;\n\n      case 'Escape':\n        this.closeDropdown();\n        break;\n    }\n  }\n\n  private focusPreviousItem() {\n    const sibling = document.activeElement.previousSibling;\n    if (sibling instanceof HTMLElement) {\n      sibling.focus();\n    }\n  }\n\n  private focusNextItem() {\n    const sibling = document.activeElement.nextSibling;\n    if (sibling instanceof HTMLElement) {\n      sibling.focus();\n    }\n  }\n\n  private handleInputElementKeyDown(e: KeyboardEvent) {\n    switch (e.code) {\n      case 'ArrowDown':\n        const selector = `.category-item-${\n          this.category !== undefined ? 'value' : 'id'\n        }`;\n        let item = this.hostElement.shadowRoot.querySelector(selector);\n\n        if (item instanceof HTMLElement) {\n          item.focus();\n          e.stopPropagation();\n        } else if (this.suggestions?.length) {\n          item = this.hostElement.shadowRoot.querySelector('.category-item');\n          if (item instanceof HTMLElement) {\n            item.focus();\n            e.stopPropagation();\n          }\n        }\n        break;\n\n      case 'Backspace':\n        if (this.textInput.value !== '') {\n          return;\n        }\n\n        if (this.category !== undefined) {\n          this.category = undefined;\n          return;\n        }\n\n        const tokenCount = this.filterTokens.length;\n        if (tokenCount > 0) {\n          this.removeToken(tokenCount - 1);\n        }\n        break;\n\n      case 'Enter':\n      case 'NumpadEnter':\n        this.addToken(this.inputValue, this.category);\n        e.preventDefault();\n        break;\n    }\n  }\n\n  private emitFilterEvent() {\n    const tokens = this.filterTokens\n      .filter((item) => item.id === this.ID_CUSTOM_FILTER_VALUE)\n      .map((item) => item.value);\n    const categories = this.filterTokens.filter(\n      (item) => item.id !== this.ID_CUSTOM_FILTER_VALUE\n    );\n    const filterState: FilterState = {\n      tokens,\n      categories,\n    };\n\n    this.filterChanged.emit(filterState);\n  }\n\n  private addToken(\n    token: string,\n    category: string = this.ID_CUSTOM_FILTER_VALUE,\n    operator = this.categoryLogicalOperator,\n    emitEvent = true\n  ) {\n    if (token === undefined || token === null) {\n      return;\n    }\n\n    const newToken = token.trim();\n\n    if (newToken === '') {\n      return;\n    }\n\n    if (this.hasToken(newToken)) {\n      return;\n    }\n\n    const pair = { id: category, value: newToken, operator };\n    this.filterTokens = [...this.filterTokens, pair];\n    this.textInput.value = '';\n    this.inputValue = '';\n    this.categoryLogicalOperator = LogicalFilterOperator.EQUAL;\n\n    if (this.category !== undefined) {\n      this.category = undefined;\n    }\n\n    this.isScrollStateDirty = true;\n\n    this.textInput.focus();\n\n    if (emitEvent) {\n      this.emitFilterEvent();\n    }\n  }\n\n  private removeToken(index: number) {\n    this.filterTokens = this.filterTokens.filter((_, i) => i !== index);\n    this.emitFilterEvent();\n  }\n\n  private getCategoryIds() {\n    const ids = [];\n    for (const id in this.categories) {\n      if (Object.prototype.hasOwnProperty.call(this.categories, id)) {\n        ids.push(id);\n      }\n    }\n\n    return ids;\n  }\n\n  private selectCategory(category: string) {\n    this.category = category;\n    this.textInput.value = '';\n    this.inputValue = '';\n    this.textInput.focus();\n    this.categoryChanged.emit(category);\n  }\n\n  private resetFilter(e: Event) {\n    e.stopPropagation();\n    this.closeDropdown();\n    this.filterTokens = [];\n    this.emitFilterEvent();\n  }\n\n  private filterMultiples(value: string) {\n    if (this.repeatCategories) {\n      return true;\n    }\n\n    const isCategoryAlreadySet = this.filterTokens.find(\n      (token) => token.id === value\n    );\n\n    return !isCategoryAlreadySet;\n  }\n\n  private hasToken(token: string) {\n    return this.filterTokens.some((filterToken) => {\n      const hasSameValue = filterToken.value === token;\n\n      if (!hasSameValue) {\n        return false;\n      }\n\n      if (this.category !== undefined) {\n        return this.category === filterToken.id;\n      }\n\n      if (filterToken.id) {\n        return filterToken.id === this.ID_CUSTOM_FILTER_VALUE;\n      }\n\n      return hasSameValue;\n    });\n  }\n\n  private filterDuplicateTokens(value: string) {\n    return !this.hasToken(value);\n  }\n\n  private filterByInput(value: string) {\n    if (this.inputValue === undefined || this.inputValue === '') {\n      return true;\n    }\n\n    return value.toLowerCase().indexOf(this.inputValue.toLowerCase()) !== -1;\n  }\n\n  private toggleCategoryOperator() {\n    switch (this.categoryLogicalOperator) {\n      case LogicalFilterOperator.EQUAL:\n        this.categoryLogicalOperator = LogicalFilterOperator.NOT_EQUAL;\n        break;\n\n      case LogicalFilterOperator.NOT_EQUAL:\n        this.categoryLogicalOperator = LogicalFilterOperator.EQUAL;\n        break;\n    }\n  }\n\n  private getFilterChipLabel(value: {\n    id: string;\n    value: string;\n    operator: LogicalFilterOperator;\n  }): string {\n    if (value.id === this.ID_CUSTOM_FILTER_VALUE) {\n      return value.value;\n    }\n\n    const operatorString =\n      value.operator === LogicalFilterOperator.EQUAL ? '=' : '!=';\n    const label =\n      this.categories[value.id]?.label ??\n      this.nonSelectableCategories[value.id] ??\n      value.id;\n\n    return `${label} ${operatorString} ${value.value}`;\n  }\n\n  private getFilteredSuggestions() {\n    if (!this.suggestions?.length) {\n      return [];\n    }\n\n    return this.suggestions\n      ?.filter((value) => this.filterByInput(value))\n      .filter((value) => this.filterDuplicateTokens(value));\n  }\n\n  private hasCategorySelection() {\n    return this.categories !== undefined;\n  }\n\n  private renderPlainSuggestions() {\n    return (\n      <div class=\"dropdown-item-container\">\n        {this.getFilteredSuggestions().map((suggestion) => (\n          <button\n            class=\"dropdown-item\"\n            data-id={suggestion}\n            onClick={() => this.addToken(suggestion)}\n            key={suggestion}\n            title={suggestion}\n          >\n            {suggestion}\n          </button>\n        ))}\n      </div>\n    );\n  }\n\n  private renderOperatorButton() {\n    if (this.staticOperator) {\n      return '';\n    }\n\n    const params: BaseButtonProps = {\n      type: 'button',\n      variant: 'secondary',\n      outline: false,\n      ghost: true,\n      iconOnly: true,\n      iconOval: false,\n      selected: false,\n      disabled: this.disabled || this.staticOperator !== undefined,\n      loading: false,\n      icon: '',\n      onClick: (e: Event) => {\n        e.stopPropagation();\n        this.toggleCategoryOperator();\n      },\n      extraClasses: {\n        'btn-icon-32': true,\n        'btn-toggle-operator': true,\n      },\n    };\n\n    return (\n      <BaseButton {...params}>\n        {this.categoryLogicalOperator === LogicalFilterOperator.NOT_EQUAL\n          ? '='\n          : '!='}\n      </BaseButton>\n    );\n  }\n\n  private getFilterOperatorString() {\n    let operator: LogicalFilterOperator;\n    if (this.staticOperator !== undefined) {\n      operator = this.staticOperator;\n    } else {\n      operator = this.categoryLogicalOperator;\n    }\n    return `${operator === LogicalFilterOperator.EQUAL ? '=' : '!='} `;\n  }\n\n  private renderCategoryValues() {\n    return (\n      <div class=\"dropdown-item-container\">\n        {this.renderOperatorButton()}\n        <div class=\"dropdown-header\">\n          {this.categories[this.category]?.label}\n        </div>\n        {this.categories[this.category]?.options\n          .filter((value) => this.filterByInput(value))\n          .filter((value) => this.filterDuplicateTokens(value))\n          .map((id) => (\n            <button\n              class=\"dropdown-item category-item-value\"\n              data-id={id}\n              title={id}\n              key={id}\n              onClick={(e) => {\n                e.preventDefault();\n                this.addToken(id, this.category);\n              }}\n            >\n              {`${this.getFilterOperatorString()} ${id}`}\n            </button>\n          ))}\n      </div>\n    );\n  }\n\n  private renderDropdownContent() {\n    if (this.hasCategorySelection()) {\n      if (this.category !== undefined) {\n        return this.renderCategoryValues();\n      } else {\n        return this.renderCategorySelection();\n      }\n    } else return this.renderPlainSuggestions();\n  }\n\n  private renderCategorySelection() {\n    return (\n      <div class=\"dropdown-item-container\">\n        {this.getCategoryIds()\n          ?.filter((id) => this.filterByInput(this.categories[id].label))\n          .filter((id) => this.filterMultiples(id))\n          .map((id) => (\n            <button\n              class=\"dropdown-item category-item category-item-id\"\n              data-id={id}\n              title={this.categories[id].label}\n              key={id}\n              onClick={(e) => {\n                e.preventDefault();\n                this.selectCategory(id);\n              }}\n              tabindex=\"0\"\n            >\n              {this.categories[id]?.label}\n            </button>\n          ))}\n      </div>\n    );\n  }\n\n  private getDropdownHeader() {\n    if (this.categories !== undefined) {\n      if (this.category !== undefined) {\n        return null;\n      } else {\n        return this.labelCategories;\n      }\n    }\n\n    return this.i18nPlainText;\n  }\n\n  componentDidRender() {\n    if (this.isScrollStateDirty) {\n      if (!this.tmpDisableScrollIntoView) {\n        this.textInput.scrollIntoView();\n      }\n      this.isScrollStateDirty = false;\n    }\n  }\n\n  private getResetButton() {\n    return (\n      <ix-icon-button\n        onClick={(e) => this.resetFilter(e)}\n        class={{\n          'reset-button': true,\n          'hide-reset-button':\n            !this.filterTokens.length && this.category === undefined,\n        }}\n        ghost\n        oval\n        icon={'clear'}\n        size=\"16\"\n      ></ix-icon-button>\n    );\n  }\n\n  private getIconColor() {\n    if (this.disabled) {\n      return 'color-componentn-1';\n    }\n\n    if (this.readonly) {\n      return 'color-std-txt';\n    }\n\n    return 'color-primary';\n  }\n\n  render() {\n    return (\n      <Host>\n        <form ref={(el) => (this.formElement = el)}>\n          <div\n            read-only={this.readonly}\n            class={{\n              'input-container': true,\n              disabled: this.disabled,\n              focus: this.hasFocus,\n              readonly: this.readonly,\n              'no-icon': this.hideIcon,\n            }}\n          >\n            <ix-icon\n              color={this.getIconColor()}\n              class={{ 'd-none': this.hideIcon }}\n              name={this.icon}\n              size=\"16\"\n            ></ix-icon>\n            <div class=\"token-container\">\n              <ul class=\"list-unstyled\">\n                {this.filterTokens.map((value, index) => (\n                  <li\n                    key={value.toString()}\n                    class={{\n                      animate__animated: true,\n                      animate__fadein: true,\n                    }}\n                  >\n                    <ix-filter-chip\n                      disabled={this.disabled}\n                      readonly={this.readonly}\n                      onClick={(e) => e.stopPropagation()}\n                      onCloseClick={() => this.removeToken(index)}\n                    >\n                      {this.getFilterChipLabel(value)}\n                    </ix-filter-chip>\n                  </li>\n                ))}\n                {this.categories === undefined ? (\n                  ''\n                ) : (\n                  <li\n                    class={{\n                      'category-preview': true,\n                      'd-none': this.category === undefined,\n                    }}\n                  >\n                    {this.categories[this.category]?.label}\n                  </li>\n                )}\n                <input\n                  class={{\n                    'text-input': true,\n                    'hide-placeholder':\n                      this.readonly ||\n                      this.disabled ||\n                      this.category !== undefined,\n                  }}\n                  autocomplete=\"off\"\n                  name=\"category-filter-input\"\n                  disabled={this.disabled}\n                  readonly={this.readonly}\n                  ref={(el) => (this.textInput = el)}\n                  type=\"text\"\n                  placeholder={this.placeholder}\n                ></input>\n              </ul>\n            </div>\n            {!this.readonly && !this.disabled && this.getResetButton()}\n          </div>\n        </form>\n\n        {this.disabled || this.readonly ? (\n          ''\n        ) : (\n          <ix-dropdown\n            show={this.showDropdown}\n            closeBehavior=\"outside\"\n            offset={{ mainAxis: 2 }}\n            anchor={this.textInput}\n            trigger={this.hostElement}\n            header={this.getDropdownHeader()}\n          >\n            {this.renderDropdownContent()}\n          </ix-dropdown>\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}