npm - @siemens/ix - Versions diffs - 1.6.2 → 2.0.0-beta.0 - Mend

@siemens/ix 1.6.2 → 2.0.0-beta.0

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

Files changed (1110) hide show

package/dist/collection/components/workflow-step/workflow-step.js CHANGED Viewed

@@ -71,14 +71,14 @@ export class WorkflowStep {
     this.selectedHandler();
     this.customIconSlot = !!this.hostElement.querySelector('[slot="custom-icon"]');
   }
-  clickFunction() {
+  onStepClick() {
     if (!this.disabled && this.clickable) {
       this.selectedChanged.emit(this.hostElement);
     }
   }
   render() {
     const icons = !this.customIconSlot ? (h(Fragment, null, h("ix-icon", { color: "color-1", name: this.iconName === 'warning' ? 'triangle-filled' : 'circle-filled', class: "absolute", size: "24" }), h("ix-icon", { color: this.iconColor, name: this.iconName, class: "absolute", size: "24" }))) : ('');
-    return (h(Host, null, h("div", { tabIndex: 0, onClick: () => this.select(), class: {
+    return (h(Host, { onClick: () => this.onStepClick() }, h("div", { tabIndex: 0, onClick: () => this.select(), class: {
         step: true,
         selected: this.selected,
         vertical: this.vertical,
@@ -91,7 +91,7 @@ export class WorkflowStep {
       } }), h("div", { class: "iconWrapper" }, icons, h("slot", { name: "custom-icon" }))), h("div", { class: "text" }, h("slot", null)))));
   }
   static get is() { return "ix-workflow-step"; }
-  static get encapsulation() { return "scoped"; }
+  static get encapsulation() { return "shadow"; }
   static get originalStyleUrls() {
     return {
       "$": ["workflow-step.scss"]
@@ -258,14 +258,5 @@ export class WorkflowStep {
         "methodName": "watchPropHandler"
       }];
   }
-  static get listeners() {
-    return [{
-        "name": "click",
-        "method": "clickFunction",
-        "target": undefined,
-        "capture": false,
-        "passive": true
-      }];
-  }
 }
 //# sourceMappingURL=workflow-step.js.map

package/dist/collection/components/workflow-step/workflow-step.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"workflow-step.js","sourceRoot":"","sources":["../../../src/components/workflow-step/workflow-step.tsx"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EACL,SAAS,EACT,OAAO,EACP,KAAK,EAEL,QAAQ,EACR,CAAC,EACD,IAAI,EACJ,~~MAAM,EACN,~~IAAI,EACJ,KAAK,EACL,KAAK,GACN,MAAM,eAAe,CAAC;AAOvB,MAAM,OAAO,YAAY;;oBAMK,KAAK;oBAKL,KAAK;kBAKmC,MAAM;qBAK7C,KAAK;oBAKW,KAAK;oBAOY,WAAW;oBAGvE,QAAQ;qBACmB,mCAAmC;;EASxD,MAAM;IACZ,IAAI,CAAC,IAAI,CAAC,SAAS;MAAE,OAAO;IAC5B,IAAI,IAAI,CAAC,QAAQ;MAAE,OAAO;IAE1B,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;IACrB,IAAI,CAAC,eAAe,EAAE,CAAC;EACzB,CAAC;EAGD,eAAe;IACb,MAAM,aAAa,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC;IAExD,IAAI,IAAI,CAAC,MAAM,KAAK,MAAM,EAAE;MAC1B,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,QAAQ,CAAC;MACxD,IAAI,CAAC,SAAS,GAAG,oCAAoC,aAAa,EAAE,CAAC;KACtE;IAED,IAAI,IAAI,CAAC,MAAM,KAAK,MAAM,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;MAC5C,IAAI,CAAC,SAAS,GAAG,iCAAiC,aAAa,EAAE,CAAC;KACnE;EACH,CAAC;EAGD,gBAAgB;IACd,QAAQ,IAAI,CAAC,MAAM,EAAE;MACnB,KAAK,MAAM;QACT,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;QACzB,IAAI,CAAC,SAAS,GAAG,mCAAmC,CAAC;QACrD,MAAM;MACR,KAAK,SAAS;QACZ,IAAI,CAAC,QAAQ,GAAG,SAAS,CAAC;QAC1B,IAAI,CAAC,SAAS,GAAG,eAAe,CAAC;QACjC,MAAM;MACR,KAAK,MAAM;QACT,IAAI,CAAC,QAAQ,GAAG,SAAS,CAAC;QAC1B,IAAI,CAAC,SAAS,GAAG,gCAAgC,CAAC;QAClD,MAAM;MACR,KAAK,SAAS;QACZ,IAAI,CAAC,QAAQ,GAAG,SAAS,CAAC;QAC1B,IAAI,CAAC,SAAS,GAAG,eAAe,CAAC;QACjC,MAAM;MACR,KAAK,OAAO;QACV,IAAI,CAAC,QAAQ,GAAG,OAAO,CAAC;QACxB,IAAI,CAAC,SAAS,GAAG,aAAa,CAAC;QAC/B,MAAM;MAER;QACE,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;QACzB,MAAM;KACT;IAED,IAAI,IAAI,CAAC,QAAQ,EAAE;MACjB,IAAI,CAAC,SAAS,GAAG,6CAA6C,CAAC;KAChE;EACH,CAAC;EAED,gBAAgB;IACd,IAAI,CAAC,gBAAgB,EAAE,CAAC;IACxB,IAAI,CAAC,eAAe,EAAE,CAAC;IAEvB,IAAI,CAAC,cAAc,GAAG,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,aAAa,CACpD,sBAAsB,CACvB,CAAC;EACJ,CAAC;~~EAGD~~,~~aAAa~~;~~IACX~~,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,SAAS,EAAE;MACpC,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;KAC7C;EACH,CAAC;EAED,MAAM;IACJ,MAAM,KAAK,GAAG,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,CACnC,EAAC,QAAQ;MACP,eACE,KAAK,EAAC,SAAS,EACf,IAAI,EACF,IAAI,CAAC,QAAQ,KAAK,SAAS,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,eAAe,EAEnE,KAAK,EAAC,UAAU,EAChB,IAAI,EAAC,IAAI,GACA;MACX,eACE,KAAK,EAAE,IAAI,CAAC,SAAS,EACrB,IAAI,EAAE,IAAI,CAAC,QAAQ,EACnB,KAAK,EAAC,UAAU,EAChB,IAAI,EAAC,IAAI,GACA,CACF,CACZ,CAAC,CAAC,CAAC,CACF,EAAE,CACH,CAAC;IAEF,OAAO,CACL,EAAC,IAAI;~~MACH~~,WACE,QAAQ,EAAE,CAAC,EACX,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,MAAM,EAAE,EAC5B,KAAK,EAAE;UACL,IAAI,EAAE,IAAI;UACV,QAAQ,EAAE,IAAI,CAAC,QAAQ;UACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ;UACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ;SACxB;QAED,WAAK,KAAK,EAAC,SAAS;UAClB,WACE,KAAK,EAAE;cACL,IAAI,EAAE,IAAI;cACV,QAAQ,EAAE,IAAI,CAAC,QAAQ;cACvB,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,IAAI;cACnB,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE,IAAI;aACtB,GACI;UACP,WAAK,KAAK,EAAC,aAAa;YACrB,KAAK;YACN,YAAM,IAAI,EAAC,aAAa,GAAQ,CAC5B,CACF;QACN,WAAK,KAAK,EAAC,MAAM;UACf,eAAa,CACT,CACF,CACD,CACR,CAAC;EACJ,CAAC~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~CACF","sourcesContent":["/\n SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n Fragment,\n h,\n Host,\n ~~Listen,\n~~ Prop,\n State,\n Watch,\n} from '@stencil/core';\n\n@Component({\n tag: 'ix-workflow-step',\n styleUrl: 'workflow-step.scss',\n ~~scoped~~: true,\n})\nexport class WorkflowStep {\n @Element() hostElement: HTMLIxWorkflowStepElement;\n\n /\n Select orientation\n /\n @Prop() vertical: boolean = false;\n\n /\n Set disabled\n /\n @Prop() disabled: boolean = false;\n\n /\n Set status\n /\n @Prop() status: 'open' \| 'success' \| 'done' \| 'warning' \| 'error' = 'open';\n\n /\n Activate navigation click\n /\n @Prop() clickable: boolean = false;\n\n /\n Set selected\n /\n @Prop({ mutable: true }) selected: boolean = false;\n\n /\n Activate navigation click\n \n @deprecated Will be changed to '@internal' in 2.0.0\n /\n @Prop() position: 'first' \| 'last' \| 'single' \| 'undefined' = 'undefined';\n\n @State() iconName: 'circle' \| 'circle-dot' \| 'success' \| 'warning' \| 'error' =\n 'circle';\n @State() iconColor: string = 'workflow-step-icon-default--color';\n\n /\n @internal\n */\n @Event() selectedChanged: EventEmitter<HTMLIxWorkflowStepElement>;\n\n private customIconSlot: boolean;\n\n private select() {\n if (!this.clickable) return;\n if (this.disabled) return;\n\n this.selected = true;\n this.selectedHandler();\n }\n\n @Watch('selected')\n selectedHandler() {\n const selectedStyle = this.selected ? '--selected' : '';\n\n if (this.status === 'open') {\n this.iconName = this.selected ? 'circle-dot' : 'circle';\n this.iconColor = `workflow-step-icon-default--color${selectedStyle}`;\n }\n\n if (this.status === 'done' && !this.disabled) {\n this.iconColor = `workflow-step-icon-done--color${selectedStyle}`;\n }\n }\n\n @Watch('status')\n watchPropHandler() {\n switch (this.status) {\n case 'open':\n this.iconName = 'circle';\n this.iconColor = 'workflow-step-icon-default--color';\n break;\n case 'success':\n this.iconName = 'success';\n this.iconColor = 'color-success';\n break;\n case 'done':\n this.iconName = 'success';\n this.iconColor = 'workflow-step-icon-done--color';\n break;\n case 'warning':\n this.iconName = 'warning';\n this.iconColor = 'color-warning';\n break;\n case 'error':\n this.iconName = 'error';\n this.iconColor = 'color-alarm';\n break;\n\n default:\n this.iconName = 'circle';\n break;\n }\n\n if (this.disabled) {\n this.iconColor = 'workflow-step-icon-success--color--disabled';\n }\n }\n\n componentDidLoad() {\n this.watchPropHandler();\n this.selectedHandler();\n\n this.customIconSlot = !!this.hostElement.querySelector(\n '[slot=\"custom-icon\"]'\n );\n }\n\n ~~@Listen~~(~~'click', { passive: true }~~)~~\n clickFunction()~~ {\n if (!this.disabled && this.clickable) {\n this.selectedChanged.emit(this.hostElement);\n }\n }\n\n render() {\n const icons = !this.customIconSlot ? (\n <Fragment>\n <ix-icon\n color=\"color-1\"\n name={\n this.iconName === 'warning' ? 'triangle-filled' : 'circle-filled'\n }\n class=\"absolute\"\n size=\"24\"\n ></ix-icon>\n <ix-icon\n color={this.iconColor}\n name={this.iconName}\n class=\"absolute\"\n size=\"24\"\n ></ix-icon>\n </Fragment>\n ) : (\n ''\n );\n\n return (\n <Host>\n <div\n tabIndex={0}\n onClick={() => this.select()}\n class={{\n step: true,\n selected: this.selected,\n vertical: this.vertical,\n disabled: this.disabled,\n }}\n >\n <div class=\"wrapper\">\n <div\n class={{\n line: true,\n selected: this.selected,\n [this.status]: true,\n [this.position]: true,\n }}\n ></div>\n <div class=\"iconWrapper\">\n {icons}\n <slot name=\"custom-icon\"></slot>\n </div>\n </div>\n <div class=\"text\">\n <slot></slot>\n </div>\n </div>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"workflow-step.js","sourceRoot":"","sources":["../../../src/components/workflow-step/workflow-step.tsx"],"names":[],"mappings":"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","sourcesContent":["/\n SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n Fragment,\n h,\n Host,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\n\n@Component({\n tag: 'ix-workflow-step',\n styleUrl: 'workflow-step.scss',\n shadow: true,\n})\nexport class WorkflowStep {\n @Element() hostElement: HTMLIxWorkflowStepElement;\n\n /\n Select orientation\n /\n @Prop() vertical: boolean = false;\n\n /\n Set disabled\n /\n @Prop() disabled: boolean = false;\n\n /\n Set status\n /\n @Prop() status: 'open' \| 'success' \| 'done' \| 'warning' \| 'error' = 'open';\n\n /\n Activate navigation click\n /\n @Prop() clickable: boolean = false;\n\n /\n Set selected\n /\n @Prop({ mutable: true }) selected: boolean = false;\n\n /\n Activate navigation click\n \n @deprecated Will be changed to '@internal' in 2.0.0\n /\n @Prop() position: 'first' \| 'last' \| 'single' \| 'undefined' = 'undefined';\n\n @State() iconName: 'circle' \| 'circle-dot' \| 'success' \| 'warning' \| 'error' =\n 'circle';\n @State() iconColor: string = 'workflow-step-icon-default--color';\n\n /\n @internal\n */\n @Event() selectedChanged: EventEmitter<HTMLIxWorkflowStepElement>;\n\n private customIconSlot: boolean;\n\n private select() {\n if (!this.clickable) return;\n if (this.disabled) return;\n\n this.selected = true;\n this.selectedHandler();\n }\n\n @Watch('selected')\n selectedHandler() {\n const selectedStyle = this.selected ? '--selected' : '';\n\n if (this.status === 'open') {\n this.iconName = this.selected ? 'circle-dot' : 'circle';\n this.iconColor = `workflow-step-icon-default--color${selectedStyle}`;\n }\n\n if (this.status === 'done' && !this.disabled) {\n this.iconColor = `workflow-step-icon-done--color${selectedStyle}`;\n }\n }\n\n @Watch('status')\n watchPropHandler() {\n switch (this.status) {\n case 'open':\n this.iconName = 'circle';\n this.iconColor = 'workflow-step-icon-default--color';\n break;\n case 'success':\n this.iconName = 'success';\n this.iconColor = 'color-success';\n break;\n case 'done':\n this.iconName = 'success';\n this.iconColor = 'workflow-step-icon-done--color';\n break;\n case 'warning':\n this.iconName = 'warning';\n this.iconColor = 'color-warning';\n break;\n case 'error':\n this.iconName = 'error';\n this.iconColor = 'color-alarm';\n break;\n\n default:\n this.iconName = 'circle';\n break;\n }\n\n if (this.disabled) {\n this.iconColor = 'workflow-step-icon-success--color--disabled';\n }\n }\n\n componentDidLoad() {\n this.watchPropHandler();\n this.selectedHandler();\n\n this.customIconSlot = !!this.hostElement.querySelector(\n '[slot=\"custom-icon\"]'\n );\n }\n\n onStepClick() {\n if (!this.disabled && this.clickable) {\n this.selectedChanged.emit(this.hostElement);\n }\n }\n\n render() {\n const icons = !this.customIconSlot ? (\n <Fragment>\n <ix-icon\n color=\"color-1\"\n name={\n this.iconName === 'warning' ? 'triangle-filled' : 'circle-filled'\n }\n class=\"absolute\"\n size=\"24\"\n ></ix-icon>\n <ix-icon\n color={this.iconColor}\n name={this.iconName}\n class=\"absolute\"\n size=\"24\"\n ></ix-icon>\n </Fragment>\n ) : (\n ''\n );\n\n return (\n <Host onClick={() => this.onStepClick()}>\n <div\n tabIndex={0}\n onClick={() => this.select()}\n class={{\n step: true,\n selected: this.selected,\n vertical: this.vertical,\n disabled: this.disabled,\n }}\n >\n <div class=\"wrapper\">\n <div\n class={{\n line: true,\n selected: this.selected,\n [this.status]: true,\n [this.position]: true,\n }}\n ></div>\n <div class=\"iconWrapper\">\n {icons}\n <slot name=\"custom-icon\"></slot>\n </div>\n </div>\n <div class=\"text\">\n <slot></slot>\n </div>\n </div>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/workflow-steps/workflow-steps.css CHANGED Viewed

@@ -18,6 +18,19 @@
 /* Font sizes */
 /* Line heights */
 /* Animation timings */
+/*
+ * SPDX-FileCopyrightText: 2023 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+:host *,
+:host *::after,
+:host *::before {
+  box-sizing: border-box;
+}
 :host .steps {
   display: flex;
 }

package/dist/collection/components/workflow-steps/workflow-steps.js CHANGED Viewed

@@ -18,9 +18,6 @@ export class WorkflowSteps {
   getSteps() {
     return Array.from(this.hostElement.querySelectorAll('ix-workflow-step'));
   }
-  get stepsContent() {
-    return this.hostElement.querySelector('.steps');
-  }
   updateSteps() {
     let steps = this.getSteps();
     steps.forEach((element, index) => {
@@ -42,16 +39,15 @@ export class WorkflowSteps {
       }
     });
   }
-  componentDidLoad() {
-    this.stepsContent.addEventListener('selectedChanged', (event) => {
-      const steps = this.getSteps();
-      steps.forEach((element) => {
-        if (element !== event.target) {
-          element.selected = false;
-        }
-      });
+  onStepSelectionChanged(event) {
+    const steps = this.getSteps();
+    steps.forEach((element) => {
+      if (element !== event.target) {
+        element.selected = false;
+      }
     });
-    const slotDiv = this.hostElement.querySelector('.steps');
+  }
+  componentDidLoad() {
     this.observer = createMutationObserver((mutations) => {
       for (let mutation of mutations) {
         if (mutation.type === 'childList') {
@@ -59,7 +55,7 @@ export class WorkflowSteps {
         }
       }
     });
-    this.observer.observe(slotDiv, { childList: true });
+    this.observer.observe(this.hostElement, { childList: true });
   }
   disconnectedCallback() {
     if (this.observer) {
@@ -73,7 +69,7 @@ export class WorkflowSteps {
     return (h(Host, null, h("div", { class: { steps: true, vertical: this.vertical } }, h("slot", null))));
   }
   static get is() { return "ix-workflow-steps"; }
-  static get encapsulation() { return "scoped"; }
+  static get encapsulation() { return "shadow"; }
   static get originalStyleUrls() {
     return {
       "$": ["workflow-steps.scss"]
@@ -182,5 +178,14 @@ export class WorkflowSteps {
       }];
   }
   static get elementRef() { return "hostElement"; }
+  static get listeners() {
+    return [{
+        "name": "selectedChanged",
+        "method": "onStepSelectionChanged",
+        "target": undefined,
+        "capture": false,
+        "passive": false
+      }];
+  }
 }
 //# sourceMappingURL=workflow-steps.js.map

package/dist/collection/components/workflow-steps/workflow-steps.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"workflow-steps.js","sourceRoot":"","sources":["../../../src/components/workflow-steps/workflow-steps.tsx"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EACL,SAAS,EACT,OAAO,EACP,KAAK,EAEL,CAAC,EACD,IAAI,EACJ,IAAI,GACL,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,sBAAsB,EAAE,MAAM,4BAA4B,CAAC;AAOpE,MAAM,OAAO,aAAa;;oBAMI,KAAK;kBAMP,KAAK;qBAKF,KAAK;yBAKF,CAAC;;EAOzB,QAAQ;IACd,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,gBAAgB,CAAC,kBAAkB,CAAC,CAAC,CAAC;EAC3E,CAAC;EAED,~~IAAI,YAAY;IACd,OAAO,IAAI,CAAC,~~WAAW~~,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC~~;~~EAClD,CAAC;EAED,WAAW;~~IACT,IAAI,KAAK,GAAG,IAAI,CAAC,QAAQ,EAAE,CAAC;IAC5B,KAAK,CAAC,OAAO,CAAC,CAAC,OAAO,EAAE,KAAK,EAAE,EAAE;MAC/B,OAAO,CAAC,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC;MACjC,OAAO,CAAC,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC;MACnC,OAAO,CAAC,QAAQ,GAAG,IAAI,CAAC,aAAa,KAAK,KAAK,CAAC;MAEhD,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,EAAE;QACtB,OAAO,CAAC,QAAQ,GAAG,QAAQ,CAAC;QAC5B,OAAO;OACR;MAED,IAAI,KAAK,KAAK,CAAC,EAAE;QACf,OAAO,CAAC,QAAQ,GAAG,OAAO,CAAC;OAC5B;WAAM,IAAI,KAAK,KAAK,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;QACrC,OAAO,CAAC,QAAQ,GAAG,MAAM,CAAC;OAC3B;WAAM;QACL,OAAO,CAAC,QAAQ,GAAG,WAAW,CAAC;OAChC;IACH,CAAC,CAAC,CAAC;EACL,CAAC;~~EAID~~,~~gBAAgB;IACd~~,~~IAAI,~~CAAC,~~YAAY,CAAC,gBAAgB,CAChC,iBAAiB,EACjB,CAAC,~~KAA6C~~,EAAE,EAAE~~;~~MAChD~~,MAAM,KAAK,GAAG,IAAI,CAAC,QAAQ,EAAE,CAAC;~~MAC9B~~,KAAK,CAAC,OAAO,CAAC,CAAC,OAAO,EAAE,EAAE;~~QACxB~~,IAAI,OAAO,KAAK,KAAK,CAAC,MAAM,EAAE;~~UAC5B~~,OAAO,CAAC,QAAQ,GAAG,KAAK,CAAC;~~SAC1B~~;~~MACH~~,CAAC,CAAC,CAAC;~~IACL~~,CAAC~~,CACF,CAAC~~;~~IAEF~~,~~MAAM,OAAO,GAAG,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC~~;~~IAEzD~~,IAAI,CAAC,QAAQ,GAAG,sBAAsB,CAAC,CAAC,SAAS,EAAE,EAAE;MACnD,KAAK,IAAI,QAAQ,IAAI,SAAS,EAAE;QAC9B,IAAI,QAAQ,CAAC,IAAI,KAAK,WAAW,EAAE;UACjC,IAAI,CAAC,WAAW,EAAE,CAAC;SACpB;OACF;IACH,CAAC,CAAC,CAAC;IAEH,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,~~OAAO~~,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,CAAC;~~EACtD~~,CAAC;EAED,oBAAoB;IAClB,IAAI,IAAI,CAAC,QAAQ,EAAE;MACjB,IAAI,CAAC,QAAQ,CAAC,UAAU,EAAE,CAAC;KAC5B;EACH,CAAC;EAED,kBAAkB;IAChB,IAAI,CAAC,WAAW,EAAE,CAAC;EACrB,CAAC;EAED,MAAM;IACJ,OAAO,CACL,EAAC,IAAI;MACH,WAAK,KAAK,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE;QAClD,eAAa,CACT,CACD,CACR,CAAC;EACJ,CAAC~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~CACF","sourcesContent":["/\n SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Prop,\n} from '@stencil/core';\nimport { createMutationObserver } from '../utils/mutation-observer';\n\n@Component({\n tag: 'ix-workflow-steps',\n styleUrl: 'workflow-steps.scss',\n ~~scoped~~: true,\n})\nexport class WorkflowSteps {\n @Element() hostElement!: HTMLIxWorkflowStepsElement;\n\n /\n Select orientation\n /\n @Prop() vertical: boolean = false;\n\n /\n Select linear mode\n * @deprecated Has no effect on component. Will get removed in 2.0.0\n /\n @Prop() linear: boolean = false;\n\n /\n Activate navigation click\n /\n @Prop() clickable: boolean = false;\n\n /\n Activate navigation click\n /\n @Prop() selectedIndex: number = 0;\n\n /\n On step selected event\n */\n @Event() stepSelected: EventEmitter<number>;\n\n private getSteps() {\n return Array.from(this.hostElement.querySelectorAll('ix-workflow-step'));\n }\n\n ~~get stepsContent() {\n return this.hostElement.querySelector('.steps');\n }\n\n~~ updateSteps() {\n let steps = this.getSteps();\n steps.forEach((element, index) => {\n element.vertical = this.vertical;\n element.clickable = this.clickable;\n element.selected = this.selectedIndex === index;\n\n if (steps.length === 1) {\n element.position = 'single';\n return;\n }\n\n if (index === 0) {\n element.position = 'first';\n } else if (index === steps.length - 1) {\n element.position = 'last';\n } else {\n element.position = 'undefined';\n }\n });\n }\n\n private observer: MutationObserver;\n\n ~~componentDidLoad~~(~~) {\n this.stepsContent.addEventListener(\n~~ 'selectedChanged',\n (event: CustomEvent<HTMLIxWorkflowStepElement>) => {\n const steps = this.getSteps();\n steps.forEach((element) => {\n if (element !== event.target) {\n element.selected = false;\n }\n });\n }\n ~~);\n~~\n ~~const slotDiv = this.hostElement.querySelector~~(~~'.steps'~~)~~;\n~~\n this.observer = createMutationObserver((mutations) => {\n for (let mutation of mutations) {\n if (mutation.type === 'childList') {\n this.updateSteps();\n }\n }\n });\n\n this.observer.observe(~~slotDiv~~, { childList: true });\n }\n\n disconnectedCallback() {\n if (this.observer) {\n this.observer.disconnect();\n }\n }\n\n componentDidRender() {\n this.updateSteps();\n }\n\n render() {\n return (\n <Host>\n <div class={{ steps: true, vertical: this.vertical }}>\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"workflow-steps.js","sourceRoot":"","sources":["../../../src/components/workflow-steps/workflow-steps.tsx"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EACL,SAAS,EACT,OAAO,EACP,KAAK,EAEL,CAAC,EACD,IAAI,EACJ,MAAM,EACN,IAAI,GACL,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,sBAAsB,EAAE,MAAM,4BAA4B,CAAC;AAOpE,MAAM,OAAO,aAAa;;oBAMI,KAAK;kBAMP,KAAK;qBAKF,KAAK;yBAKF,CAAC;;EAOzB,QAAQ;IACd,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,gBAAgB,CAAC,kBAAkB,CAAC,CAAC,CAAC;EAC3E,CAAC;EAED,WAAW;IACT,IAAI,KAAK,GAAG,IAAI,CAAC,QAAQ,EAAE,CAAC;IAC5B,KAAK,CAAC,OAAO,CAAC,CAAC,OAAO,EAAE,KAAK,EAAE,EAAE;MAC/B,OAAO,CAAC,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC;MACjC,OAAO,CAAC,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC;MACnC,OAAO,CAAC,QAAQ,GAAG,IAAI,CAAC,aAAa,KAAK,KAAK,CAAC;MAEhD,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,EAAE;QACtB,OAAO,CAAC,QAAQ,GAAG,QAAQ,CAAC;QAC5B,OAAO;OACR;MAED,IAAI,KAAK,KAAK,CAAC,EAAE;QACf,OAAO,CAAC,QAAQ,GAAG,OAAO,CAAC;OAC5B;WAAM,IAAI,KAAK,KAAK,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;QACrC,OAAO,CAAC,QAAQ,GAAG,MAAM,CAAC;OAC3B;WAAM;QACL,OAAO,CAAC,QAAQ,GAAG,WAAW,CAAC;OAChC;IACH,CAAC,CAAC,CAAC;EACL,CAAC;EAKD,sBAAsB,CAAC,KAA6C;IAClE,MAAM,KAAK,GAAG,IAAI,CAAC,QAAQ,EAAE,CAAC;IAC9B,KAAK,CAAC,OAAO,CAAC,CAAC,OAAO,EAAE,EAAE;MACxB,IAAI,OAAO,KAAK,KAAK,CAAC,MAAM,EAAE;QAC5B,OAAO,CAAC,QAAQ,GAAG,KAAK,CAAC;OAC1B;IACH,CAAC,CAAC,CAAC;EACL,CAAC;EAED,gBAAgB;IACd,IAAI,CAAC,QAAQ,GAAG,sBAAsB,CAAC,CAAC,SAAS,EAAE,EAAE;MACnD,KAAK,IAAI,QAAQ,IAAI,SAAS,EAAE;QAC9B,IAAI,QAAQ,CAAC,IAAI,KAAK,WAAW,EAAE;UACjC,IAAI,CAAC,WAAW,EAAE,CAAC;SACpB;OACF;IACH,CAAC,CAAC,CAAC;IAEH,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,WAAW,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,CAAC;EAC/D,CAAC;EAED,oBAAoB;IAClB,IAAI,IAAI,CAAC,QAAQ,EAAE;MACjB,IAAI,CAAC,QAAQ,CAAC,UAAU,EAAE,CAAC;KAC5B;EACH,CAAC;EAED,kBAAkB;IAChB,IAAI,CAAC,WAAW,EAAE,CAAC;EACrB,CAAC;EAED,MAAM;IACJ,OAAO,CACL,EAAC,IAAI;MACH,WAAK,KAAK,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE;QAClD,eAAa,CACT,CACD,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["/\n SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Prop,\n} from '@stencil/core';\nimport { createMutationObserver } from '../utils/mutation-observer';\n\n@Component({\n tag: 'ix-workflow-steps',\n styleUrl: 'workflow-steps.scss',\n shadow: true,\n})\nexport class WorkflowSteps {\n @Element() hostElement!: HTMLIxWorkflowStepsElement;\n\n /\n Select orientation\n /\n @Prop() vertical: boolean = false;\n\n /\n Select linear mode\n * @deprecated Has no effect on component. Will get removed in 2.0.0\n /\n @Prop() linear: boolean = false;\n\n /\n Activate navigation click\n /\n @Prop() clickable: boolean = false;\n\n /\n Activate navigation click\n /\n @Prop() selectedIndex: number = 0;\n\n /\n On step selected event\n */\n @Event() stepSelected: EventEmitter<number>;\n\n private getSteps() {\n return Array.from(this.hostElement.querySelectorAll('ix-workflow-step'));\n }\n\n updateSteps() {\n let steps = this.getSteps();\n steps.forEach((element, index) => {\n element.vertical = this.vertical;\n element.clickable = this.clickable;\n element.selected = this.selectedIndex === index;\n\n if (steps.length === 1) {\n element.position = 'single';\n return;\n }\n\n if (index === 0) {\n element.position = 'first';\n } else if (index === steps.length - 1) {\n element.position = 'last';\n } else {\n element.position = 'undefined';\n }\n });\n }\n\n private observer: MutationObserver;\n\n @Listen('selectedChanged')\n onStepSelectionChanged(event: CustomEvent<HTMLIxWorkflowStepElement>) {\n const steps = this.getSteps();\n steps.forEach((element) => {\n if (element !== event.target) {\n element.selected = false;\n }\n });\n }\n\n componentDidLoad() {\n this.observer = createMutationObserver((mutations) => {\n for (let mutation of mutations) {\n if (mutation.type === 'childList') {\n this.updateSteps();\n }\n }\n });\n\n this.observer.observe(this.hostElement, { childList: true });\n }\n\n disconnectedCallback() {\n if (this.observer) {\n this.observer.disconnect();\n }\n }\n\n componentDidRender() {\n this.updateSteps();\n }\n\n render() {\n return (\n <Host>\n <div class={{ steps: true, vertical: this.vertical }}>\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/index.js CHANGED Viewed

@@ -12,11 +12,12 @@ export * from './components/category-filter/filter-state';
 export * from './components/category-filter/input-state';
 export * from './components/category-filter/logical-filter-operator';
 export { FlipTileState } from './components/flip-tile/flip-tile-state';
-export * from './components/modal/modal-utils';
 export * from './components/toast/toast-utils';
 export * from './components/tree-item/default-tree-item';
 export * from './components/tree/tree-model';
 export * from './components/upload/upload-file-state';
+export * from './components/utils/delegate';
+export * from './components/utils/modal';
 export { convertToAbbreviationString, convertToRemString, } from './components/utils/rwd.util';
 export * from './components/utils/theme-switcher';
 //# sourceMappingURL=index.js.map

package/dist/collection/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AACH,OAAO,mBAAmB,CAAC;AAK3B,cAAc,cAAc,CAAC;AAC7B,cAAc,2CAA2C,CAAC;AAC1D,cAAc,0CAA0C,CAAC;AACzD,cAAc,sDAAsD,CAAC;AACrE,OAAO,EAAE,aAAa,EAAE,MAAM,wCAAwC,CAAC;AACvE,cAAc,gCAAgC,CAAC;AAC/C,cAAc,~~gCAAgC~~,CAAC;~~AAC/C~~,cAAc,~~0CAA0C~~,CAAC;~~AACzD~~,cAAc,~~8BAA8B~~,CAAC;~~AAC7C~~,cAAc,~~uCAAuC~~,CAAC;~~AAEtD~~,OAAO,EACL,2BAA2B,EAC3B,kBAAkB,GACnB,MAAM,6BAA6B,CAAC;AACrC,cAAc,mCAAmC,CAAC","sourcesContent":["/\n SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\nimport '@siemens/ix-icons';\nimport type {\n Components as IxIconsComponents,\n JSX as IxIconsJSX,\n} from '@siemens/ix-icons';\nexport from './components';\nexport * from './components/category-filter/filter-state';\nexport * from './components/category-filter/input-state';\nexport * from './components/category-filter/logical-filter-operator';\nexport { FlipTileState } from './components/flip-tile/flip-tile-state';\nexport * from './components/~~modal/modal-utils';\nexport * from './components/~~toast/toast-utils';\nexport * from './components/tree-item/default-tree-item';\nexport * from './components/tree/tree-model';\nexport * from './components/upload/upload-file-state';\nexport { NotificationColor } from './components/utils/notification-color';\nexport {\n convertToAbbreviationString,\n convertToRemString,\n} from './components/utils/rwd.util';\nexport * from './components/utils/theme-switcher';\n\ndeclare module './components' {\n export namespace Components {\n export type IxIcon = IxIconsComponents.IxIcon;\n }\n}\n\ndeclare module './components' {\n export namespace JSX {\n export type IxIcon = IxIconsJSX.IxIcon;\n }\n}\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AACH,OAAO,mBAAmB,CAAC;AAK3B,cAAc,cAAc,CAAC;AAC7B,cAAc,2CAA2C,CAAC;AAC1D,cAAc,0CAA0C,CAAC;AACzD,cAAc,sDAAsD,CAAC;AACrE,OAAO,EAAE,aAAa,EAAE,MAAM,wCAAwC,CAAC;AACvE,cAAc,gCAAgC,CAAC;AAC/C,cAAc,0CAA0C,CAAC;AACzD,cAAc,8BAA8B,CAAC;AAC7C,cAAc,uCAAuC,CAAC;AACtD,cAAc,6BAA6B,CAAC;AAC5C,cAAc,0BAA0B,CAAC;AAEzC,OAAO,EACL,2BAA2B,EAC3B,kBAAkB,GACnB,MAAM,6BAA6B,CAAC;AACrC,cAAc,mCAAmC,CAAC","sourcesContent":["/\n SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\nimport '@siemens/ix-icons';\nimport type {\n Components as IxIconsComponents,\n JSX as IxIconsJSX,\n} from '@siemens/ix-icons';\nexport from './components';\nexport * from './components/category-filter/filter-state';\nexport * from './components/category-filter/input-state';\nexport * from './components/category-filter/logical-filter-operator';\nexport { FlipTileState } from './components/flip-tile/flip-tile-state';\nexport * from './components/toast/toast-utils';\nexport * from './components/tree-item/default-tree-item';\nexport * from './components/tree/tree-model';\nexport * from './components/upload/upload-file-state';\nexport * from './components/utils/delegate';\nexport * from './components/utils/modal';\nexport { NotificationColor } from './components/utils/notification-color';\nexport {\n convertToAbbreviationString,\n convertToRemString,\n} from './components/utils/rwd.util';\nexport * from './components/utils/theme-switcher';\n\ndeclare module './components' {\n export namespace Components {\n export type IxIcon = IxIconsComponents.IxIcon;\n }\n}\n\ndeclare module './components' {\n export namespace JSX {\n export type IxIcon = IxIconsJSX.IxIcon;\n }\n}\n"]}

package/dist/collection/tests/utils/test/page.js CHANGED Viewed

@@ -6,10 +6,12 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-import { test as base } from '@playwright/test';
+import { test as testBase, } from '@playwright/test';
 async function extendPageFixture(page, testInfo) {
+  var _a, _b;
   const originalGoto = page.goto.bind(page);
-  const theme = testInfo.project.metadata.theme;
+  const originalSceenshot = page.screenshot.bind(page);
+  const theme = (_b = (_a = testInfo.project.metadata) === null || _a === void 0 ? void 0 : _a.theme) !== null && _b !== void 0 ? _b : 'theme-classic-dark';
   testInfo.annotations.push({
     type: theme,
   });
@@ -18,15 +20,19 @@ async function extendPageFixture(page, testInfo) {
     await page.waitForTimeout(1000);
     return response;
   };
+  page.screenshot = async (options) => {
+    await page.waitForTimeout(150);
+    return originalSceenshot(options);
+  };
   return page;
 }
-export const regressionTest = base.extend({
+export const regressionTest = testBase.extend({
   page: async ({ page }, use, testInfo) => {
     page = await extendPageFixture(page, testInfo);
     await use(page);
   },
 });
-export const test = base.extend({
+export const test = testBase.extend({
   createElement: async ({ page }, use) => {
     use((selector, appendTo) => page.evaluateHandle(async ({ selector, appendTo }) => {
       const elm = document.createElement(selector);
@@ -40,7 +46,8 @@ export const test = base.extend({
     }));
   },
   mount: async ({ page }, use, testInfo) => {
-    const theme = testInfo.project.metadata.theme;
+    var _a, _b;
+    const theme = (_b = (_a = testInfo.project.metadata) === null || _a === void 0 ? void 0 : _a.theme) !== null && _b !== void 0 ? _b : 'theme-classic-dark';
     testInfo.annotations.push({
       type: theme,
     });

package/dist/collection/tests/utils/test/page.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"page.js","sourceRoot":"","sources":["../../../../src/tests/utils/test/page.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AACH,OAAO,~~EAAuB~~,IAAI,IAAI,~~IAAI~~,~~EAAY~~,MAAM,kBAAkB,CAAC;~~AAE/E~~,KAAK,UAAU,iBAAiB,CAAC,IAAU,EAAE,QAAkB;EAC7D,MAAM,YAAY,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;EAC1C,MAAM,KAAK,GAAG,QAAQ,CAAC,OAAO,CAAC,QAAQ,~~CAAC~~,KAAK,CAAC;~~EAC9C~~,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC;IACxB,IAAI,EAAE,KAAK;GACZ,CAAC,CAAC;EACH,IAAI,CAAC,IAAI,GAAG,KAAK,EAAE,GAAW,EAAE,OAAO,EAAE,EAAE;IACzC,MAAM,QAAQ,GAAG,MAAM,YAAY,CACjC,mCAAmC,GAAG,UAAU,KAAK,EAAE,EACvD,OAAO,CACR,CAAC;IAEF,MAAM,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,CAAC;IAChC,OAAO,QAAQ,CAAC;EAClB,CAAC,CAAC;EAEF,OAAO,IAAI,CAAC;AACd,CAAC;AAED,MAAM,CAAC,MAAM,cAAc,GAAG,~~IAAI~~,CAAC,MAAM,CAAC;~~EACxC~~,IAAI,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,GAAG,EAAE,QAAQ,EAAE,EAAE;IACtC,IAAI,GAAG,MAAM,iBAAiB,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC;IAC/C,MAAM,GAAG,CAAC,IAAI,CAAC,CAAC;EAClB,CAAC;CACF,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,IAAI,GAAG,~~IAAI~~,CAAC,MAAM,~~CAM5B~~;EACD,aAAa,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,GAAG,EAAE,EAAE;IACrC,GAAG,CAAC,CAAC,QAAQ,EAAE,QAAQ,EAAE,EAAE,CACzB,IAAI,CAAC,cAAc,CACjB,KAAK,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,EAAE;MAC/B,MAAM,GAAG,GAAG,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;MAE7C,IAAI,QAAQ,EAAE;QACZ,QAAQ,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC;OAC3B;MAED,OAAO,GAAG,CAAC;IACb,CAAC,EACD;MACE,QAAQ;MACR,QAAQ;KACT,CACF,CACF,CAAC;EACJ,CAAC;EACD,KAAK,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,GAAG,EAAE,QAAQ,EAAE,EAAE;IACvC,MAAM,KAAK,GAAG,QAAQ,CAAC,OAAO,CAAC,QAAQ,~~CAAC~~,KAAK,CAAC;~~IAC9C~~,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC;MACxB,IAAI,EAAE,KAAK;KACZ,CAAC,CAAC;IACH,MAAM,IAAI,CAAC,IAAI,CACb,6DAA6D,KAAK,EAAE,CACrE,CAAC;IACF,GAAG,CAAC,CAAC,QAAQ,EAAE,EAAE;MACf,OAAO,IAAI,CAAC,cAAc,CACxB,KAAK,EAAE,EAAE,iBAAiB,EAAE,EAAE,EAAE;QAC9B,MAAM,MAAM,CAAC,cAAc,CAAC,WAAW,CAAC,WAAW,CAAC,CAAC;QACrD,MAAM,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;QAC/C,KAAK,CAAC,SAAS,GAAG,iBAAiB,CAAC;QACpC,OAAO,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAgB,CAAC;MAC/C,CAAC,EACD,EAAE,iBAAiB,EAAE,QAAQ,EAAE,CAChC,CAAC;IACJ,CAAC,CAAC,CAAC;EACL,CAAC;CACF,CAAC,CAAC","sourcesContent":["/\n SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\nimport { ElementHandle, Page, test as ~~base,~~ TestInfo } from '@playwright/test';\n\nasync function extendPageFixture(page: Page, testInfo: TestInfo) {\n const originalGoto = page.goto.bind(page);\n const theme = testInfo.project.metadata.theme;\n testInfo.annotations.push({\n type: theme,\n });\n page.goto = async (url: string, options) => {\n const response = await originalGoto(\n `http://127.0.0.1:8080/src/tests/${url}?theme=${theme}`,\n options\n );\n\n await page.waitForTimeout(1000);\n return response;\n };\n\n return page;\n}\n\nexport const regressionTest = ~~base~~.extend({\n page: async ({ page }, use, testInfo) => {\n page = await extendPageFixture(page, testInfo);\n await use(page);\n },\n});\n\nexport const test = ~~base~~.extend<{\n mount: (selector: string) => Promise<ElementHandle<HTMLElement>>;\n createElement: (\n selector: string,\n appendTo?: ElementHandle<Element>\n ) => Promise<ElementHandle<HTMLElement>>;\n}>({\n createElement: async ({ page }, use) => {\n use((selector, appendTo) =>\n page.evaluateHandle(\n async ({ selector, appendTo }) => {\n const elm = document.createElement(selector);\n\n if (appendTo) {\n appendTo.appendChild(elm);\n }\n\n return elm;\n },\n {\n selector,\n appendTo,\n }\n )\n );\n },\n mount: async ({ page }, use, testInfo) => {\n const theme = testInfo.project.metadata.theme;\n testInfo.annotations.push({\n type: theme,\n });\n await page.goto(\n `http://127.0.0.1:8080/src/tests/utils/ct/index.html?theme=${theme}`\n );\n use((selector) => {\n return page.evaluateHandle(\n async ({ componentSelector }) => {\n await window.customElements.whenDefined('ix-button');\n const mount = document.querySelector('#mount');\n mount.innerHTML = componentSelector;\n return mount.children.item(0) as HTMLElement;\n },\n { componentSelector: selector }\n );\n });\n },\n});\n"]}
1	+ {"version":3,"file":"page.js","sourceRoot":"","sources":["../../../../src/tests/utils/test/page.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AACH,OAAO,EAIL,IAAI,IAAI,QAAQ,GAEjB,MAAM,kBAAkB,CAAC;AAE1B,KAAK,UAAU,iBAAiB,CAAC,IAAU,EAAE,QAAkB;;EAC7D,MAAM,YAAY,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;EAC1C,MAAM,iBAAiB,GAAG,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;EACrD,MAAM,KAAK,GAAG,MAAA,MAAA,QAAQ,CAAC,OAAO,CAAC,QAAQ,0CAAE,KAAK,mCAAI,oBAAoB,CAAC;EACvE,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC;IACxB,IAAI,EAAE,KAAK;GACZ,CAAC,CAAC;EACH,IAAI,CAAC,IAAI,GAAG,KAAK,EAAE,GAAW,EAAE,OAAO,EAAE,EAAE;IACzC,MAAM,QAAQ,GAAG,MAAM,YAAY,CACjC,mCAAmC,GAAG,UAAU,KAAK,EAAE,EACvD,OAAO,CACR,CAAC;IAEF,MAAM,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,CAAC;IAChC,OAAO,QAAQ,CAAC;EAClB,CAAC,CAAC;EAEF,IAAI,CAAC,UAAU,GAAG,KAAK,EAAE,OAA+B,EAAE,EAAE;IAC1D,MAAM,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC;IAC/B,OAAO,iBAAiB,CAAC,OAAO,CAAC,CAAC;EACpC,CAAC,CAAC;EAEF,OAAO,IAAI,CAAC;AACd,CAAC;AAED,MAAM,CAAC,MAAM,cAAc,GAAG,QAAQ,CAAC,MAAM,CAAC;EAC5C,IAAI,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,GAAG,EAAE,QAAQ,EAAE,EAAE;IACtC,IAAI,GAAG,MAAM,iBAAiB,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC;IAC/C,MAAM,GAAG,CAAC,IAAI,CAAC,CAAC;EAClB,CAAC;CACF,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,IAAI,GAAG,QAAQ,CAAC,MAAM,CAMhC;EACD,aAAa,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,GAAG,EAAE,EAAE;IACrC,GAAG,CAAC,CAAC,QAAQ,EAAE,QAAQ,EAAE,EAAE,CACzB,IAAI,CAAC,cAAc,CACjB,KAAK,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,EAAE;MAC/B,MAAM,GAAG,GAAG,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;MAE7C,IAAI,QAAQ,EAAE;QACZ,QAAQ,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC;OAC3B;MAED,OAAO,GAAG,CAAC;IACb,CAAC,EACD;MACE,QAAQ;MACR,QAAQ;KACT,CACF,CACF,CAAC;EACJ,CAAC;EACD,KAAK,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,GAAG,EAAE,QAAQ,EAAE,EAAE;;IACvC,MAAM,KAAK,GAAG,MAAA,MAAA,QAAQ,CAAC,OAAO,CAAC,QAAQ,0CAAE,KAAK,mCAAI,oBAAoB,CAAC;IACvE,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC;MACxB,IAAI,EAAE,KAAK;KACZ,CAAC,CAAC;IACH,MAAM,IAAI,CAAC,IAAI,CACb,6DAA6D,KAAK,EAAE,CACrE,CAAC;IACF,GAAG,CAAC,CAAC,QAAQ,EAAE,EAAE;MACf,OAAO,IAAI,CAAC,cAAc,CACxB,KAAK,EAAE,EAAE,iBAAiB,EAAE,EAAE,EAAE;QAC9B,MAAM,MAAM,CAAC,cAAc,CAAC,WAAW,CAAC,WAAW,CAAC,CAAC;QACrD,MAAM,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;QAC/C,KAAK,CAAC,SAAS,GAAG,iBAAiB,CAAC;QACpC,OAAO,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAgB,CAAC;MAC/C,CAAC,EACD,EAAE,iBAAiB,EAAE,QAAQ,EAAE,CAChC,CAAC;IACJ,CAAC,CAAC,CAAC;EACL,CAAC;CACF,CAAC,CAAC","sourcesContent":["/\n SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\nimport {\n ElementHandle,\n Page,\n PageScreenshotOptions,\n test as testBase,\n TestInfo,\n} from '@playwright/test';\n\nasync function extendPageFixture(page: Page, testInfo: TestInfo) {\n const originalGoto = page.goto.bind(page);\n const originalSceenshot = page.screenshot.bind(page);\n const theme = testInfo.project.metadata?.theme ?? 'theme-classic-dark';\n testInfo.annotations.push({\n type: theme,\n });\n page.goto = async (url: string, options) => {\n const response = await originalGoto(\n `http://127.0.0.1:8080/src/tests/${url}?theme=${theme}`,\n options\n );\n\n await page.waitForTimeout(1000);\n return response;\n };\n\n page.screenshot = async (options?: PageScreenshotOptions) => {\n await page.waitForTimeout(150);\n return originalSceenshot(options);\n };\n\n return page;\n}\n\nexport const regressionTest = testBase.extend({\n page: async ({ page }, use, testInfo) => {\n page = await extendPageFixture(page, testInfo);\n await use(page);\n },\n});\n\nexport const test = testBase.extend<{\n mount: (selector: string) => Promise<ElementHandle<HTMLElement>>;\n createElement: (\n selector: string,\n appendTo?: ElementHandle<Element>\n ) => Promise<ElementHandle<HTMLElement>>;\n}>({\n createElement: async ({ page }, use) => {\n use((selector, appendTo) =>\n page.evaluateHandle(\n async ({ selector, appendTo }) => {\n const elm = document.createElement(selector);\n\n if (appendTo) {\n appendTo.appendChild(elm);\n }\n\n return elm;\n },\n {\n selector,\n appendTo,\n }\n )\n );\n },\n mount: async ({ page }, use, testInfo) => {\n const theme = testInfo.project.metadata?.theme ?? 'theme-classic-dark';\n testInfo.annotations.push({\n type: theme,\n });\n await page.goto(\n `http://127.0.0.1:8080/src/tests/utils/ct/index.html?theme=${theme}`\n );\n use((selector) => {\n return page.evaluateHandle(\n async ({ componentSelector }) => {\n await window.customElements.whenDefined('ix-button');\n const mount = document.querySelector('#mount');\n mount.innerHTML = componentSelector;\n return mount.children.item(0) as HTMLElement;\n },\n { componentSelector: selector }\n );\n });\n },\n});\n"]}

package/dist/components/a11y.js ADDED Viewed

@@ -0,0 +1,79 @@
+/*
+ * SPDX-FileCopyrightText: 2023 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+const a11yBoolean = (value) => (value ? 'true' : 'false');
+const a11yHostAttributes = (hostElement) => {
+  const attributeObject = {};
+  a11yAttributes.forEach((attr) => {
+    if (hostElement.hasAttribute(attr)) {
+      const value = hostElement.getAttribute(attr);
+      if (value !== null) {
+        attributeObject[attr] = hostElement.getAttribute(attr);
+      }
+      hostElement.removeAttribute(attr);
+    }
+  });
+  return attributeObject;
+};
+const a11yAttributes = [
+  'role',
+  'aria-activedescendant',
+  'aria-atomic',
+  'aria-autocomplete',
+  'aria-braillelabel',
+  'aria-brailleroledescription',
+  'aria-busy',
+  'aria-checked',
+  'aria-colcount',
+  'aria-colindex',
+  'aria-colindextext',
+  'aria-colspan',
+  'aria-controls',
+  'aria-current',
+  'aria-describedby',
+  'aria-description',
+  'aria-details',
+  'aria-disabled',
+  'aria-errormessage',
+  'aria-expanded',
+  'aria-flowto',
+  'aria-haspopup',
+  'aria-hidden',
+  'aria-invalid',
+  'aria-keyshortcuts',
+  'aria-label',
+  'aria-labelledby',
+  'aria-level',
+  'aria-live',
+  'aria-multiline',
+  'aria-multiselectable',
+  'aria-orientation',
+  'aria-owns',
+  'aria-placeholder',
+  'aria-posinset',
+  'aria-pressed',
+  'aria-readonly',
+  'aria-relevant',
+  'aria-required',
+  'aria-roledescription',
+  'aria-rowcount',
+  'aria-rowindex',
+  'aria-rowindextext',
+  'aria-rowspan',
+  'aria-selected',
+  'aria-setsize',
+  'aria-sort',
+  'aria-valuemax',
+  'aria-valuemin',
+  'aria-valuenow',
+  'aria-valuetext',
+];
+export { a11yBoolean as a, a11yHostAttributes as b };
+//# sourceMappingURL=a11y.js.map

package/dist/components/a11y.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"a11y.js","mappings":"AAAA;;;;;;;;MAQa,WAAW,GAAG,CAAC,KAAc,MAAM,KAAK,GAAG,MAAM,GAAG,OAAO,EAAE;MAE7D,kBAAkB,GAAG,CAChC,WAAwB;EAExB,MAAM,eAAe,GAAwB,EAAE,CAAC;EAChD,cAAc,CAAC,OAAO,CAAC,CAAC,IAAI;IAC1B,IAAI,WAAW,CAAC,YAAY,CAAC,IAAI,CAAC,EAAE;MAClC,MAAM,KAAK,GAAG,WAAW,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC;MAC7C,IAAI,KAAK,KAAK,IAAI,EAAE;QAClB,eAAe,CAAC,IAAI,CAAC,GAAG,WAAW,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC;OACxD;MACD,WAAW,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC;KACnC;GACF,CAAC,CAAC;EAEH,OAAO,eAAe,CAAC;AACzB,EAAE;AA4DF,MAAM,cAAc,GAAwB;EAC1C,MAAM;EACN,uBAAuB;EACvB,aAAa;EACb,mBAAmB;EACnB,mBAAmB;EACnB,6BAA6B;EAC7B,WAAW;EACX,cAAc;EACd,eAAe;EACf,eAAe;EACf,mBAAmB;EACnB,cAAc;EACd,eAAe;EACf,cAAc;EACd,kBAAkB;EAClB,kBAAkB;EAClB,cAAc;EACd,eAAe;EACf,mBAAmB;EACnB,eAAe;EACf,aAAa;EACb,eAAe;EACf,aAAa;EACb,cAAc;EACd,mBAAmB;EACnB,YAAY;EACZ,iBAAiB;EACjB,YAAY;EACZ,WAAW;EACX,gBAAgB;EAChB,sBAAsB;EACtB,kBAAkB;EAClB,WAAW;EACX,kBAAkB;EAClB,eAAe;EACf,cAAc;EACd,eAAe;EACf,eAAe;EACf,eAAe;EACf,sBAAsB;EACtB,eAAe;EACf,eAAe;EACf,mBAAmB;EACnB,cAAc;EACd,eAAe;EACf,cAAc;EACd,WAAW;EACX,eAAe;EACf,eAAe;EACf,eAAe;EACf,gBAAgB;CACjB;;;;","names":[],"sources":["./src/components/utils/a11y.ts"],"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 */\nexport const a11yBoolean = (value: boolean) => (value ? 'true' : 'false');\n\nexport const a11yHostAttributes = (\n hostElement: HTMLElement\n): Record<A11yAttributeName, any> => {\n const attributeObject: Record<string, any> = {};\n a11yAttributes.forEach((attr) => {\n if (hostElement.hasAttribute(attr)) {\n const value = hostElement.getAttribute(attr);\n if (value !== null) {\n attributeObject[attr] = hostElement.getAttribute(attr);\n }\n hostElement.removeAttribute(attr);\n }\n });\n\n return attributeObject;\n};\n\ntype PartialRecord<K extends keyof any, T> = {\n [P in K]?: T;\n};\nexport type A11yAttributes = PartialRecord<A11yAttributeName, any>;\n\nexport type A11yAttributeName =\n | 'role'\n | 'aria-activedescendant'\n | 'aria-atomic'\n | 'aria-autocomplete'\n | 'aria-braillelabel'\n | 'aria-brailleroledescription'\n | 'aria-busy'\n | 'aria-checked'\n | 'aria-colcount'\n | 'aria-colindex'\n | 'aria-colindextext'\n | 'aria-colspan'\n | 'aria-controls'\n | 'aria-current'\n | 'aria-describedby'\n | 'aria-description'\n | 'aria-details'\n | 'aria-disabled'\n | 'aria-errormessage'\n | 'aria-expanded'\n | 'aria-flowto'\n | 'aria-haspopup'\n | 'aria-hidden'\n | 'aria-invalid'\n | 'aria-keyshortcuts'\n | 'aria-label'\n | 'aria-labelledby'\n | 'aria-level'\n | 'aria-live'\n | 'aria-multiline'\n | 'aria-multiselectable'\n | 'aria-orientation'\n | 'aria-owns'\n | 'aria-placeholder'\n | 'aria-posinset'\n | 'aria-pressed'\n | 'aria-readonly'\n | 'aria-relevant'\n | 'aria-required'\n | 'aria-roledescription'\n | 'aria-rowcount'\n | 'aria-rowindex'\n | 'aria-rowindextext'\n | 'aria-rowspan'\n | 'aria-selected'\n | 'aria-setsize'\n | 'aria-sort'\n | 'aria-valuemax'\n | 'aria-valuemin'\n | 'aria-valuenow'\n | 'aria-valuetext';\n\nconst a11yAttributes: A11yAttributeName[] = [\n 'role',\n 'aria-activedescendant',\n 'aria-atomic',\n 'aria-autocomplete',\n 'aria-braillelabel',\n 'aria-brailleroledescription',\n 'aria-busy',\n 'aria-checked',\n 'aria-colcount',\n 'aria-colindex',\n 'aria-colindextext',\n 'aria-colspan',\n 'aria-controls',\n 'aria-current',\n 'aria-describedby',\n 'aria-description',\n 'aria-details',\n 'aria-disabled',\n 'aria-errormessage',\n 'aria-expanded',\n 'aria-flowto',\n 'aria-haspopup',\n 'aria-hidden',\n 'aria-invalid',\n 'aria-keyshortcuts',\n 'aria-label',\n 'aria-labelledby',\n 'aria-level',\n 'aria-live',\n 'aria-multiline',\n 'aria-multiselectable',\n 'aria-orientation',\n 'aria-owns',\n 'aria-placeholder',\n 'aria-posinset',\n 'aria-pressed',\n 'aria-readonly',\n 'aria-relevant',\n 'aria-required',\n 'aria-roledescription',\n 'aria-rowcount',\n 'aria-rowindex',\n 'aria-rowindextext',\n 'aria-rowspan',\n 'aria-selected',\n 'aria-setsize',\n 'aria-sort',\n 'aria-valuemax',\n 'aria-valuemin',\n 'aria-valuenow',\n 'aria-valuetext',\n];\n"],"version":3}

package/dist/components/application-header.js CHANGED Viewed

@@ -1,8 +1,11 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { h as hostContext, i as isBasicNavigationLayout, s as screenMode, m as menuController } from './service.js';
-import { d as defineCustomElement$1 } from './burger-menu.js';
+import { m as menuController } from './menu-service.js';
+import { d as defineCustomElement$4 } from './burger-menu.js';
+import { d as defineCustomElement$3 } from './icon.js';
+import { d as defineCustomElement$2 } from './icon-button.js';
+import { d as defineCustomElement$1 } from './spinner.js';
-const applicationHeaderCss = ":host{display:flex;align-items:center;position:relative;width:100%;height:2.75rem;padding-left:1rem;color:var(--theme-app-header--color);background-color:var(--theme-app-header--background);border-bottom:var(--theme-app-header--border-width) solid var(--theme-app-header--border-color)}:host .name{margin-left:2.5rem;margin-right:2.5rem;color:var(--theme-app-header--color)}:host .logo{display:inline-flex;align-items:center;position:relative;height:32px;overflow:hidden;line-height:0rem;color:var(--theme-app-header-logo--color)}:host(.mode-mobile){padding-left:0.5rem}:host(.mode-mobile) .logo{margin-left:0.5rem}";
+const applicationHeaderCss = ":host{display:flex;align-items:center;position:relative;width:100%;height:2.75rem;padding-left:1rem;color:var(--theme-app-header--color);background-color:var(--theme-app-header--background);border-bottom:var(--theme-app-header--border-width) solid var(--theme-app-header--border-color)}:host .name{margin-left:2.5rem;margin-right:2.5rem;color:var(--theme-app-header--color)}:host .logo{display:inline-flex;align-items:center;position:relative;height:32px;overflow:hidden;line-height:0rem;color:var(--theme-app-header-logo--color)}:host(.mode-small){padding-left:0.5rem}:host(.mode-small) .logo{margin-left:0.5rem}";
 const ApplicationHeader = /*@__PURE__*/ proxyCustomElement(class ApplicationHeader extends HTMLElement {
   constructor() {
@@ -10,18 +13,13 @@ const ApplicationHeader = /*@__PURE__*/ proxyCustomElement(class ApplicationHead
     this.__registerHost();
     this.__attachShadow();
     this.name = undefined;
-    this.mode = 'desktop';
+    this.mode = 'large';
     this.menuExpanded = false;
   }
   componentWillLoad() {
-    const layout = hostContext('ix-basic-navigation', this.host);
-    if (isBasicNavigationLayout(layout)) {
-      this.modeDisposable = screenMode.onChange.on((mode) => (this.mode = mode));
-      this.mode = screenMode.mode;
-      this.menuDisposable = menuController.expandChange.on((show) => {
-        this.menuExpanded = show;
-      });
-    }
+    this.menuDisposable = menuController.expandChange.on((show) => {
+      this.menuExpanded = show;
+    });
   }
   componentDidLoad() {
     this.attachSiemensLogoIfLoaded();
@@ -31,31 +29,40 @@ const ApplicationHeader = /*@__PURE__*/ proxyCustomElement(class ApplicationHead
     (_a = this.menuDisposable) === null || _a === void 0 ? void 0 : _a.dispose();
     (_b = this.modeDisposable) === null || _b === void 0 ? void 0 : _b.dispose();
   }
+  isLogoSlotted() {
+    const slotElement = this.hostElement.shadowRoot.querySelector('slot[name="logo"]');
+    const nodes = slotElement.assignedNodes({
+      flatten: true,
+    });
+    return nodes.length !== 0;
+  }
   async attachSiemensLogoIfLoaded() {
     await window.customElements.whenDefined('ix-siemens-logo');
     const logoElement = document.createElement('ix-siemens-logo');
-    if (!this.host.querySelector('[slot="logo"]')) {
-      this.host.shadowRoot.querySelector('.logo').appendChild(logoElement);
+    if (!this.isLogoSlotted()) {
+      this.hostElement.shadowRoot
+        .querySelector('.logo')
+        .appendChild(logoElement);
     }
   }
   async onMenuClick() {
     menuController.toggle();
   }
   render() {
-    return (h(Host, { class: { [`mode-${this.mode}`]: true } }, this.mode === 'mobile' ? (h("ix-burger-menu", { onClick: () => this.onMenuClick(), expanded: this.menuExpanded })) : null, h("div", { class: "logo" }, h("slot", { name: "logo" })), h("div", { class: "name" }, this.name), h("slot", null)));
+    return (h(Host, { class: { [`mode-${this.mode}`]: true } }, this.mode === 'small' ? (h("ix-burger-menu", { onClick: () => this.onMenuClick(), expanded: this.menuExpanded })) : null, h("div", { class: "logo" }, h("slot", { name: "logo" })), h("div", { class: "name" }, this.name), h("slot", null)));
   }
-  get host() { return this; }
+  get hostElement() { return this; }
   static get style() { return applicationHeaderCss; }
 }, [1, "ix-application-header", {
     "name": [1],
-    "mode": [32],
+    "mode": [1],
     "menuExpanded": [32]
   }]);
 function defineCustomElement() {
   if (typeof customElements === "undefined") {
     return;
   }
-  const components = ["ix-application-header", "ix-burger-menu"];
+  const components = ["ix-application-header", "ix-burger-menu", "ix-icon", "ix-icon-button", "ix-spinner"];
   components.forEach(tagName => { switch (tagName) {
     case "ix-application-header":
       if (!customElements.get(tagName)) {
@@ -63,6 +70,21 @@ function defineCustomElement() {
       }
       break;
     case "ix-burger-menu":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$4();
+      }
+      break;
+    case "ix-icon":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$3();
+      }
+      break;
+    case "ix-icon-button":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$2();
+      }
+      break;
+    case "ix-spinner":
       if (!customElements.get(tagName)) {
         defineCustomElement$1();
       }

package/dist/components/application-header.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"application-header.js","mappings":"~~;;;;~~AAAA,MAAM,oBAAoB,GAAG,~~ymBAAymB~~;;~~MCqBznB~~,iBAAiB;;;;;;~~gBAQN~~,~~SAAS~~;~~wBAEP~~,KAAK;;EAK7B,iBAAiB;IACf,~~MAAM~~,~~MAAM~~,GAAG,~~WAAW~~,CAAC,~~qBAAqB~~,~~EAAE,IAAI,~~CAAC,~~IAAI~~,CAAC,CAAC~~;IAC7D~~,IAAI~~,uBAAuB,CAAC,MAAM,CAAC,EAAE~~;~~MACnC~~,IAAI,CAAC,~~cAAc~~,GAAG,~~UAAU~~,CAAC,~~QAAQ,~~CAAC,~~EAAE,CAC1C,~~CAAC,~~IAAI~~,~~MAAM,~~IAAI,CAAC,~~IAAI~~,~~GAAG~~,~~IAAI,~~CAAC,~~CAC7B~~,~~CAAC;MACF~~,IAAI,CAAC,~~IAAI~~,~~GAAG~~,~~UAAU~~,~~CAAC~~,~~IAAI,~~CAAC;~~MAE5B~~,IAAI,CAAC,cAAc,~~GAAG~~,~~cAAc~~,~~CAAC,YAAY,CAAC,~~EAAE,CAAC,~~CAAC,IAAI~~;~~QACxD~~,~~IAAI~~,~~CAAC~~,~~YAAY,~~GAAG,IAAI,CAAC~~;OAC1B~~,CAAC,CAAC~~;KACJ;GACF;EAED~~,~~gBAAgB;IACd~~,~~IAAI~~,~~CAAC~~,~~yBAAyB~~,~~EAAE,~~CAAC;~~GAClC;EAED~~,~~oBAAoB;;IAClB~~,~~MAAA~~,~~IAAI~~,CAAC,~~cAAc~~,~~0CAAE~~,OAAO,EAAE,CAAC;~~IAC/B~~,~~MAAA~~,~~IAAI~~,CAAC,~~cAAc~~,~~0CAAE~~,~~OAAO~~,~~EAAE,~~CAAC;~~GAChC~~;EAEO,MAAM,yBAAyB;IACrC,MAAM,MAAM,CAAC,cAAc,CAAC,WAAW,CAAC,iBAAiB,CAAC,CAAC;IAC3D,MAAM,WAAW,GAAG,QAAQ,CAAC,aAAa,CAAC,iBAAiB,CAAC,CAAC;~~IAE9D~~,IAAI,CAAC,IAAI,CAAC,~~IAAI,CAAC,~~aAAa,~~CAAC~~,~~eAAe,CAAC,~~EAAE;~~MAC7C~~,IAAI,CAAC,~~IAAI~~,CAAC,UAAU,~~CAAC,~~aAAa,CAAC,OAAO,CAAC,~~CAAC,~~WAAW,CAAC,WAAW,CAAC,CAAC;~~KACtE~~;GACF;EAEO,MAAM,WAAW;IACvB,cAAc,CAAC,MAAM,EAAE,CAAC;GACzB;EAED,MAAM;IACJ,QACE,EAAC,IAAI,IAAC,KAAK,EAAE,EAAE,CAAC,QAAQ,IAAI,CAAC,IAAI,EAAE,GAAG,IAAI,EAAE,IACzC,IAAI,CAAC,IAAI,KAAK,~~QAAQ~~,~~IACrB~~,sBACE,OAAO,EAAE,MAAM,IAAI,CAAC,WAAW,EAAE,EACjC,QAAQ,EAAE,IAAI,CAAC,YAAY,GACX,IAChB,IAAI,EACR,WAAK,KAAK,EAAC,MAAM,IACf,YAAM,IAAI,EAAC,MAAM,GAAQ,CACrB,EACN,WAAK,KAAK,EAAC,MAAM,IAAE,IAAI,CAAC,IAAI,CAAO,EACnC,eAAa,CACR,EACP;GACH~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~","names":[],"sources":["./src/components/application-header/application-header.scss?tag=ix-application-header&encapsulation=shadow","./src/components/application-header/application-header.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:host {\n display: flex;\n align-items: center;\n position: relative;\n width: 100%;\n height: 2.75rem;\n padding-left: 1rem;\n\n color: var(--theme-app-header--color);\n background-color: var(--theme-app-header--background);\n\n border-bottom: var(--theme-app-header--border-width) solid\n var(--theme-app-header--border-color);\n\n .name {\n margin-left: 2.5rem;\n margin-right: 2.5rem;\n color: var(--theme-app-header--color);\n }\n\n .logo {\n display: inline-flex;\n align-items: center;\n position: relative;\n height: 32px;\n overflow: hidden;\n line-height: 0rem;\n color: var(--theme-app-header-logo--color);\n }\n}\n\n:host(.mode-~~mobile~~) {\n padding-left: 0.5rem;\n\n .logo {\n margin-left: 0.5rem;\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 } from '@stencil/core';\nimport { menuController } from '../utils/menu-service/menu-service';\nimport { ~~hostContext, isBasicNavigationLayout } from '../utils/screen/context';\nimport {~~ Mode } from '../utils/screen/mode';\nimport { ~~screenMode } from '../utils/screen/service';\nimport {~~ Disposable } from '../utils/typed-event';\n\n@Component({\n tag: 'ix-application-header',\n styleUrl: 'application-header.scss',\n shadow: true,\n})\nexport class ApplicationHeader {\n @Element() ~~host~~!: HTMLIxApplicationHeaderElement;\n\n /\n Application name\n */\n @Prop() name: string;\n\n @~~State~~() mode: Mode = '~~desktop~~';\n\n @State() menuExpanded = false;\n\n private menuDisposable?: Disposable;\n private modeDisposable?: Disposable;\n\n componentWillLoad() {\n ~~const layout = hostContext('ix-basic-navigation',~~ this.host);\n if (isBasicNavigationLayout(layout)) {\n this.modeDisposable = screenMode.onChange.on(\n (mode) => (this.mode = mode)\n );\n this.mode = screenMode.mode;\n\n this.menuDisposable = menuController.expandChange.on((show) => {\n this.menuExpanded = show;\n });\n ~~}\n~~ }\n\n componentDidLoad() {\n this.attachSiemensLogoIfLoaded();\n }\n\n disconnectedCallback() {\n this.menuDisposable?.dispose();\n this.modeDisposable?.dispose();\n }\n\n private async attachSiemensLogoIfLoaded() {\n await window.customElements.whenDefined('ix-siemens-logo');\n const logoElement = document.createElement('ix-siemens-logo');\n\n if (!this.~~host.querySelector~~(~~'[slot=\"logo\"]'~~)) {\n this.~~host~~.shadowRoot.querySelector('.logo').appendChild(logoElement);\n }\n }\n\n private async onMenuClick() {\n menuController.toggle();\n }\n\n render() {\n return (\n <Host class={{ [`mode-${this.mode}`]: true }}>\n {this.mode === '~~mobile~~' ? (\n <ix-burger-menu\n onClick={() => this.onMenuClick()}\n expanded={this.menuExpanded}\n ></ix-burger-menu>\n ) : null}\n <div class=\"logo\">\n <slot name=\"logo\"></slot>\n </div>\n <div class=\"name\">{this.name}</div>\n <slot></slot>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"application-header.js","mappings":";;;;;;;AAAA,MAAM,oBAAoB,GAAG,umBAAumB;;MCmBvnB,iBAAiB;;;;;;gBAWP,OAAO;wBAEJ,KAAK;;EAK7B,iBAAiB;IACf,IAAI,CAAC,cAAc,GAAG,cAAc,CAAC,YAAY,CAAC,EAAE,CAAC,CAAC,IAAI;MACxD,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;KAC1B,CAAC,CAAC;GACJ;EAED,gBAAgB;IACd,IAAI,CAAC,yBAAyB,EAAE,CAAC;GAClC;EAED,oBAAoB;;IAClB,MAAA,IAAI,CAAC,cAAc,0CAAE,OAAO,EAAE,CAAC;IAC/B,MAAA,IAAI,CAAC,cAAc,0CAAE,OAAO,EAAE,CAAC;GAChC;EAEO,aAAa;IACnB,MAAM,WAAW,GAAG,IAAI,CAAC,WAAW,CAAC,UAAU,CAAC,aAAa,CAC3D,mBAAmB,CACD,CAAC;IACrB,MAAM,KAAK,GAAG,WAAW,CAAC,aAAa,CAAC;MACtC,OAAO,EAAE,IAAI;KACd,CAAC,CAAC;IAEH,OAAO,KAAK,CAAC,MAAM,KAAK,CAAC,CAAC;GAC3B;EAEO,MAAM,yBAAyB;IACrC,MAAM,MAAM,CAAC,cAAc,CAAC,WAAW,CAAC,iBAAiB,CAAC,CAAC;IAC3D,MAAM,WAAW,GAAG,QAAQ,CAAC,aAAa,CAAC,iBAAiB,CAAC,CAAC;IAC9D,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,EAAE;MACzB,IAAI,CAAC,WAAW,CAAC,UAAU;SACxB,aAAa,CAAC,OAAO,CAAC;SACtB,WAAW,CAAC,WAAW,CAAC,CAAC;KAC7B;GACF;EAEO,MAAM,WAAW;IACvB,cAAc,CAAC,MAAM,EAAE,CAAC;GACzB;EAED,MAAM;IACJ,QACE,EAAC,IAAI,IAAC,KAAK,EAAE,EAAE,CAAC,QAAQ,IAAI,CAAC,IAAI,EAAE,GAAG,IAAI,EAAE,IACzC,IAAI,CAAC,IAAI,KAAK,OAAO,IACpB,sBACE,OAAO,EAAE,MAAM,IAAI,CAAC,WAAW,EAAE,EACjC,QAAQ,EAAE,IAAI,CAAC,YAAY,GACX,IAChB,IAAI,EACR,WAAK,KAAK,EAAC,MAAM,IACf,YAAM,IAAI,EAAC,MAAM,GAAQ,CACrB,EACN,WAAK,KAAK,EAAC,MAAM,IAAE,IAAI,CAAC,IAAI,CAAO,EACnC,eAAa,CACR,EACP;GACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/application-header/application-header.scss?tag=ix-application-header&encapsulation=shadow","./src/components/application-header/application-header.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:host {\n display: flex;\n align-items: center;\n position: relative;\n width: 100%;\n height: 2.75rem;\n padding-left: 1rem;\n\n color: var(--theme-app-header--color);\n background-color: var(--theme-app-header--background);\n\n border-bottom: var(--theme-app-header--border-width) solid\n var(--theme-app-header--border-color);\n\n .name {\n margin-left: 2.5rem;\n margin-right: 2.5rem;\n color: var(--theme-app-header--color);\n }\n\n .logo {\n display: inline-flex;\n align-items: center;\n position: relative;\n height: 32px;\n overflow: hidden;\n line-height: 0rem;\n color: var(--theme-app-header-logo--color);\n }\n}\n\n:host(.mode-small) {\n padding-left: 0.5rem;\n\n .logo {\n margin-left: 0.5rem;\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 } from '@stencil/core';\nimport { menuController } from '../utils/menu-service/menu-service';\nimport { Mode } from '../utils/screen/mode';\nimport { Disposable } from '../utils/typed-event';\n\n@Component({\n tag: 'ix-application-header',\n styleUrl: 'application-header.scss',\n shadow: true,\n})\nexport class ApplicationHeader {\n @Element() hostElement!: HTMLIxApplicationHeaderElement;\n\n /\n Application name\n /\n @Prop() name: string;\n\n /\n @internal\n */\n @Prop() mode: Mode = 'large';\n\n @State() menuExpanded = false;\n\n private menuDisposable?: Disposable;\n private modeDisposable?: Disposable;\n\n componentWillLoad() {\n this.menuDisposable = menuController.expandChange.on((show) => {\n this.menuExpanded = show;\n });\n }\n\n componentDidLoad() {\n this.attachSiemensLogoIfLoaded();\n }\n\n disconnectedCallback() {\n this.menuDisposable?.dispose();\n this.modeDisposable?.dispose();\n }\n\n private isLogoSlotted() {\n const slotElement = this.hostElement.shadowRoot.querySelector(\n 'slot[name=\"logo\"]'\n ) as HTMLSlotElement;\n const nodes = slotElement.assignedNodes({\n flatten: true,\n });\n\n return nodes.length !== 0;\n }\n\n private async attachSiemensLogoIfLoaded() {\n await window.customElements.whenDefined('ix-siemens-logo');\n const logoElement = document.createElement('ix-siemens-logo');\n if (!this.isLogoSlotted()) {\n this.hostElement.shadowRoot\n .querySelector('.logo')\n .appendChild(logoElement);\n }\n }\n\n private async onMenuClick() {\n menuController.toggle();\n }\n\n render() {\n return (\n <Host class={{ [`mode-${this.mode}`]: true }}>\n {this.mode === 'small' ? (\n <ix-burger-menu\n onClick={() => this.onMenuClick()}\n expanded={this.menuExpanded}\n ></ix-burger-menu>\n ) : null}\n <div class=\"logo\">\n <slot name=\"logo\"></slot>\n </div>\n <div class=\"name\">{this.name}</div>\n <slot></slot>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/avatar.js ADDED Viewed

@@ -0,0 +1,53 @@
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+const avatarCss = ":host{display:flex;position:relative;width:-moz-fit-content;width:fit-content}:host .avatar{display:flex;align-items:center}:host .avatar>.avatar-image{height:2rem;width:2rem;min-height:2rem;min-width:2rem;border-radius:100px}:host .avatar>.avatar-initials{display:flex;align-items:center;justify-content:center;height:2rem;width:2rem;min-height:2rem;min-width:2rem;border-radius:100px;background-color:var(--theme-color-component-3)}:host .avatar #avatar-path-background{fill:var(--theme-avatar--background)}:host .avatar #avatar-path-person{fill:var(--theme-color-4)}";
+/*
+ * SPDX-FileCopyrightText: 2023 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+function DefaultAvatar(props) {
+  const { initials } = props;
+  if (initials) {
+    return h("div", { class: 'avatar-initials' }, initials);
+  }
+  return (h("svg", { class: 'avatar-image', xmlns: "http://www.w3.org/2000/svg", width: "32", height: "32", viewBox: "0 0 32 32" }, h("g", { fill: "none", "fill-rule": "evenodd" }, h("path", { id: "avatar-path-background", d: "M16 0C7.163 0 0 7.163 0 16s7.163 16 16 16 16-7.163\n          16-16c0-4.243-1.686-8.313-4.686-11.314C24.314 1.686 20.244 0 16 0z" }), h("path", { id: "avatar-path-person", d: "M17.897 17.91c3.8-.018 7.358 1.875 9.485 5.046-2.417 3.999-6.734 6.434-11.382\n        6.42-4.648.014-8.965-2.421-11.382-6.42 2.127-3.171 5.685-5.064\n        9.485-5.045h3.794zM15.821 2.129c3.682 0 6.667 2.984 6.667 6.666 0 3.682-2.985\n        6.667-6.667 6.667s-6.667-2.985-6.667-6.667 2.985-6.666 6.667-6.666z" }))));
+}
+const Avatar = /*@__PURE__*/ proxyCustomElement(class Avatar extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+    this.image = undefined;
+    this.initials = undefined;
+  }
+  render() {
+    return (h(Host, null, h("li", { class: "avatar" }, this.image ? (h("img", { src: this.image, class: "avatar-image" })) : (h(DefaultAvatar, { initials: this.initials })))));
+  }
+  get hostElement() { return this; }
+  static get style() { return avatarCss; }
+}, [1, "ix-avatar", {
+    "image": [1],
+    "initials": [1]
+  }]);
+function defineCustomElement() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["ix-avatar"];
+  components.forEach(tagName => { switch (tagName) {
+    case "ix-avatar":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, Avatar);
+      }
+      break;
+  } });
+}
+export { Avatar as A, defineCustomElement as d };
+//# sourceMappingURL=avatar.js.map

package/dist/components/avatar.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"avatar.js","mappings":";;AAAA,MAAM,SAAS,GAAG,2jBAA2jB;;ACA7kB;;;;;;;;AASA,SAAS,aAAa,CAAC,KAA4B;EACjD,MAAM,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC;EAE3B,IAAI,QAAQ,EAAE;IACZ,OAAO,WAAK,KAAK,EAAE,iBAAiB,IAAG,QAAQ,CAAO,CAAC;GACxD;EAED,QACE,WACE,KAAK,EAAE,cAAc,EACrB,KAAK,EAAC,4BAA4B,EAClC,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,IAEnB,SAAG,IAAI,EAAC,MAAM,eAAW,SAAS,IAChC,YACE,EAAE,EAAC,wBAAwB,EAC3B,CAAC,EAAC,kIACiE,GACnE,EACF,YACE,EAAE,EAAC,oBAAoB,EACvB,CAAC,EAAC,2TAGgE,GAClE,CACA,CACA,EACN;AACJ,CAAC;MAYY,MAAM;;;;;;;;EAejB,MAAM;IACJ,QACE,EAAC,IAAI,QACH,UAAI,KAAK,EAAC,QAAQ,IACf,IAAI,CAAC,KAAK,IACT,WAAK,GAAG,EAAE,IAAI,CAAC,KAAK,EAAE,KAAK,EAAC,cAAc,GAAO,KAEjD,EAAC,aAAa,IAAC,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAI,CAC3C,CACE,CACA,EACP;GACH;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/avatar/avatar.scss?tag=ix-avatar&encapsulation=shadow","./src/components/avatar/avatar.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 'mixins/text-truncation';\n@import 'mixins/hover';\n\n:host {\n display: flex;\n position: relative;\n width: fit-content;\n\n .avatar {\n display: flex;\n align-items: center;\n\n > .avatar-image {\n height: 2rem;\n width: 2rem;\n min-height: 2rem;\n min-width: 2rem;\n border-radius: 100px;\n }\n\n > .avatar-initials {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 2rem;\n width: 2rem;\n min-height: 2rem;\n min-width: 2rem;\n border-radius: 100px;\n background-color: var(--theme-color-component-3);\n }\n\n #avatar-path-background {\n fill: var(--theme-avatar--background);\n }\n\n #avatar-path-person {\n fill: var(--theme-color-4);\n }\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\nfunction DefaultAvatar(props: { initials?: string }) {\n const { initials } = props;\n\n if (initials) {\n return <div class={'avatar-initials'}>{initials}</div>;\n }\n\n return (\n <svg\n class={'avatar-image'}\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"32\"\n height=\"32\"\n viewBox=\"0 0 32 32\"\n >\n <g fill=\"none\" fill-rule=\"evenodd\">\n <path\n id=\"avatar-path-background\"\n d=\"M16 0C7.163 0 0 7.163 0 16s7.163 16 16 16 16-7.163\n 16-16c0-4.243-1.686-8.313-4.686-11.314C24.314 1.686 20.244 0 16 0z\"\n />\n <path\n id=\"avatar-path-person\"\n d=\"M17.897 17.91c3.8-.018 7.358 1.875 9.485 5.046-2.417 3.999-6.734 6.434-11.382\n 6.42-4.648.014-8.965-2.421-11.382-6.42 2.127-3.171 5.685-5.064\n 9.485-5.045h3.794zM15.821 2.129c3.682 0 6.667 2.984 6.667 6.666 0 3.682-2.985\n 6.667-6.667 6.667s-6.667-2.985-6.667-6.667 2.985-6.666 6.667-6.666z\"\n />\n </g>\n </svg>\n );\n}\n\nimport { Component, Element, h, Host, Prop } from '@stencil/core';\n\n/**\n * @since 2.0.0\n */\n@Component({\n tag: 'ix-avatar',\n styleUrl: 'avatar.scss',\n shadow: true,\n})\nexport class Avatar {\n @Element() hostElement: HTMLIxAvatarElement;\n\n /**\n * Display a avatar image\n *\n */\n @Prop() image: string;\n\n /**\n * Display the initials of the user. Will be overwritten by image\n *\n */\n @Prop() initials: string;\n\n render() {\n return (\n <Host>\n <li class=\"avatar\">\n {this.image ? (\n <img src={this.image} class=\"avatar-image\"></img>\n ) : (\n <DefaultAvatar initials={this.initials} />\n )}\n </li>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/base-button.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"base-button.js","mappings":"AAAA;;;;;;;;~~AASA~~,MAAM,SAAS,GAAG,CAAC,OAAe;EAChC,OAAO,OAAO,CAAC,WAAW,EAAE,KAAK,SAAS,CAAC,WAAW,EAAE,CAAC;AAC3D,CAAC,CAAC;AAEF,MAAM,WAAW,GAAG,CAAC,OAAe;EAClC,OAAO,OAAO,CAAC,WAAW,EAAE,KAAK,WAAW,CAAC,WAAW,EAAE,CAAC;AAC7D,CAAC,CAAC;MAEW,gBAAgB,GAAG,CAC9B,~~OAAgC~~,~~EAChC~~,OAAgB,EAChB,KAAc,EACd,QAAQ,GAAG,KAAK,EAChB,QAAQ,GAAG,KAAK,EAChB,QAAiB,EACjB,QAAiB;EAEjB,OAAO;IACL,GAAG,EAAE,IAAI;IACT,aAAa,EAAE,SAAS,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,IAAI,CAAC,KAAK;IACvD,qBAAqB,EAAE,SAAS,CAAC,OAAO,CAAC,IAAI,OAAO,IAAI,CAAC,KAAK;IAC9D,uBAAuB,EAAE,SAAS,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,IAAI,KAAK;IAChE,eAAe,EAAE,WAAW,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,IAAI,CAAC,KAAK;IAC3D,uBAAuB,EAAE,WAAW,CAAC,OAAO,CAAC,IAAI,OAAO,IAAI,CAAC,KAAK;IAClE,yBAAyB,EAAE,WAAW,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,IAAI,KAAK;IACpE,UAAU,EAAE,QAAQ;IACpB,UAAU,EAAE,QAAQ;IACpB,QAAQ,EAAE,WAAW,CAAC,OAAO,CAAC,KAAK,OAAO,IAAI,KAAK,CAAC,IAAI,QAAQ;IAChE,QAAQ,EAAE,QAAQ;GACnB,CAAC;AACJ;;;;","names":[],"sources":["./src/components/button/base-button.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\nconst isPrimary = (variant: string) => {\n return variant.toUpperCase() === 'Primary'.toUpperCase();\n};\n\nconst isSecondary = (variant: string) => {\n return variant.toUpperCase() === 'Secondary'.toUpperCase();\n};\n\nexport const getButtonClasses = (\n variant: ~~'Primary' \| 'Secondary'~~,\n outline: boolean,\n ghost: boolean,\n iconOnly = false,\n iconOval = false,\n selected: boolean,\n disabled: boolean\n) => {\n return {\n btn: true,\n 'btn-primary': isPrimary(variant) && !outline && !ghost,\n 'btn-outline-primary': isPrimary(variant) && outline && !ghost,\n 'btn-invisible-primary': isPrimary(variant) && !outline && ghost,\n 'btn-secondary': isSecondary(variant) && !outline && !ghost,\n 'btn-outline-secondary': isSecondary(variant) && outline && !ghost,\n 'btn-invisible-secondary': isSecondary(variant) && !outline && ghost,\n 'btn-icon': iconOnly,\n 'btn-oval': iconOval,\n selected: isSecondary(variant) && (outline \|\| ghost) && selected,\n disabled: disabled,\n };\n};\n"],"version":3}
1	+ {"file":"base-button.js","mappings":"AAAA;;;;;;;;AAWA,MAAM,SAAS,GAAG,CAAC,OAAe;EAChC,OAAO,OAAO,CAAC,WAAW,EAAE,KAAK,SAAS,CAAC,WAAW,EAAE,CAAC;AAC3D,CAAC,CAAC;AAEF,MAAM,WAAW,GAAG,CAAC,OAAe;EAClC,OAAO,OAAO,CAAC,WAAW,EAAE,KAAK,WAAW,CAAC,WAAW,EAAE,CAAC;AAC7D,CAAC,CAAC;MAEW,gBAAgB,GAAG,CAC9B,OAAsB,EACtB,OAAgB,EAChB,KAAc,EACd,QAAQ,GAAG,KAAK,EAChB,QAAQ,GAAG,KAAK,EAChB,QAAiB,EACjB,QAAiB;EAEjB,OAAO;IACL,GAAG,EAAE,IAAI;IACT,aAAa,EAAE,SAAS,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,IAAI,CAAC,KAAK;IACvD,qBAAqB,EAAE,SAAS,CAAC,OAAO,CAAC,IAAI,OAAO,IAAI,CAAC,KAAK;IAC9D,uBAAuB,EAAE,SAAS,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,IAAI,KAAK;IAChE,eAAe,EAAE,WAAW,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,IAAI,CAAC,KAAK;IAC3D,uBAAuB,EAAE,WAAW,CAAC,OAAO,CAAC,IAAI,OAAO,IAAI,CAAC,KAAK;IAClE,yBAAyB,EAAE,WAAW,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,IAAI,KAAK;IACpE,UAAU,EAAE,QAAQ;IACpB,UAAU,EAAE,QAAQ;IACpB,QAAQ,EAAE,WAAW,CAAC,OAAO,CAAC,KAAK,OAAO,IAAI,KAAK,CAAC,IAAI,QAAQ;IAChE,QAAQ,EAAE,QAAQ;GACnB,CAAC;AACJ;;;;","names":[],"sources":["./src/components/button/base-button.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\nimport { ButtonVariant } from './button';\n\nconst isPrimary = (variant: string) => {\n return variant.toUpperCase() === 'Primary'.toUpperCase();\n};\n\nconst isSecondary = (variant: string) => {\n return variant.toUpperCase() === 'Secondary'.toUpperCase();\n};\n\nexport const getButtonClasses = (\n variant: ButtonVariant,\n outline: boolean,\n ghost: boolean,\n iconOnly = false,\n iconOval = false,\n selected: boolean,\n disabled: boolean\n) => {\n return {\n btn: true,\n 'btn-primary': isPrimary(variant) && !outline && !ghost,\n 'btn-outline-primary': isPrimary(variant) && outline && !ghost,\n 'btn-invisible-primary': isPrimary(variant) && !outline && ghost,\n 'btn-secondary': isSecondary(variant) && !outline && !ghost,\n 'btn-outline-secondary': isSecondary(variant) && outline && !ghost,\n 'btn-invisible-secondary': isSecondary(variant) && !outline && ghost,\n 'btn-icon': iconOnly,\n 'btn-oval': iconOval,\n selected: isSecondary(variant) && (outline \|\| ghost) && selected,\n disabled: disabled,\n };\n};\n"],"version":3}