@siemens/ix 5.1.1 → 5.2.0

package/dist/collection/components/category-filter/category-filter.css

@@ -81,6 +81,14 @@
 * This source code is licensed under the MIT license found in the
 * LICENSE file in the root directory of this source tree.
 */
+/*
+* SPDX-FileCopyrightText: 2026 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 {
   --ix-button-border-radius-left: var(--theme-btn--border-radius);
   --ix-button-border-radius-right: var(--theme-btn--border-radius);
@@ -101,7 +109,7 @@
 :host *::before {
   box-sizing: border-box;
 }
-:host ::-webkit-scrollbar-button {
+:host *::-webkit-scrollbar-button {
   display: none;
 }
 @-moz-document url-prefix() {
@@ -110,37 +118,37 @@
     scrollbar-width: thin;
   }
 }
-:host {
+:host * {
   /* width */
 }
-:host ::-webkit-scrollbar {
+:host *::-webkit-scrollbar {
   width: 0.5rem;
   height: 0.5rem;
 }
-:host {
+:host * {
   /* Track */
 }
-:host ::-webkit-scrollbar-track {
+:host *::-webkit-scrollbar-track {
   border-radius: 5px;
   background: var(--theme-scrollbar-track--background);
 }
-:host ::-webkit-scrollbar-track:hover {
+:host *::-webkit-scrollbar-track:hover {
   background: var(--theme-scrollbar-track--background--hover);
 }
-:host {
+:host * {
   /* Handle */
 }
-:host ::-webkit-scrollbar-thumb {
+:host *::-webkit-scrollbar-thumb {
   border-radius: 5px;
   background: var(--theme-scrollbar-thumb--background);
 }
-:host {
+:host * {
   /* Handle on hover */
 }
-:host ::-webkit-scrollbar-thumb:hover {
+:host *::-webkit-scrollbar-thumb:hover {
   background: var(--theme-scrollbar-thumb--background--hover);
 }
-:host ::-webkit-scrollbar-corner {
+:host *::-webkit-scrollbar-corner {
   display: none;
 }
 :host button,
@@ -212,7 +220,7 @@
 :host *::before {
   box-sizing: border-box;
 }
-:host ::-webkit-scrollbar-button {
+:host *::-webkit-scrollbar-button {
   display: none;
 }
 @-moz-document url-prefix() {
@@ -221,37 +229,37 @@
     scrollbar-width: thin;
   }
 }
-:host {
+:host * {
   /* width */
 }
-:host ::-webkit-scrollbar {
+:host *::-webkit-scrollbar {
   width: 0.5rem;
   height: 0.5rem;
 }
-:host {
+:host * {
   /* Track */
 }
-:host ::-webkit-scrollbar-track {
+:host *::-webkit-scrollbar-track {
   border-radius: 5px;
   background: var(--theme-scrollbar-track--background);
 }
-:host ::-webkit-scrollbar-track:hover {
+:host *::-webkit-scrollbar-track:hover {
   background: var(--theme-scrollbar-track--background--hover);
 }
-:host {
+:host * {
   /* Handle */
 }
-:host ::-webkit-scrollbar-thumb {
+:host *::-webkit-scrollbar-thumb {
   border-radius: 5px;
   background: var(--theme-scrollbar-thumb--background);
 }
-:host {
+:host * {
   /* Handle on hover */
 }
-:host ::-webkit-scrollbar-thumb:hover {
+:host *::-webkit-scrollbar-thumb:hover {
   background: var(--theme-scrollbar-thumb--background--hover);
 }
-:host ::-webkit-scrollbar-corner {
+:host *::-webkit-scrollbar-corner {
   display: none;
 }
 :host button,
@@ -1100,7 +1108,7 @@ button.dropdown-toggle::after {
 :host *::before {
   box-sizing: border-box;
 }
-:host ::-webkit-scrollbar-button {
+:host *::-webkit-scrollbar-button {
   display: none;
 }
 @-moz-document url-prefix() {
@@ -1109,37 +1117,37 @@ button.dropdown-toggle::after {
     scrollbar-width: thin;
   }
 }
-:host {
+:host * {
   /* width */
 }
-:host ::-webkit-scrollbar {
+:host *::-webkit-scrollbar {
   width: 0.5rem;
   height: 0.5rem;
 }
-:host {
+:host * {
   /* Track */
 }
-:host ::-webkit-scrollbar-track {
+:host *::-webkit-scrollbar-track {
   border-radius: 5px;
   background: var(--theme-scrollbar-track--background);
 }
-:host ::-webkit-scrollbar-track:hover {
+:host *::-webkit-scrollbar-track:hover {
   background: var(--theme-scrollbar-track--background--hover);
 }
-:host {
+:host * {
   /* Handle */
 }
-:host ::-webkit-scrollbar-thumb {
+:host *::-webkit-scrollbar-thumb {
   border-radius: 5px;
   background: var(--theme-scrollbar-thumb--background);
 }
-:host {
+:host * {
   /* Handle on hover */
 }
-:host ::-webkit-scrollbar-thumb:hover {
+:host *::-webkit-scrollbar-thumb:hover {
   background: var(--theme-scrollbar-thumb--background--hover);
 }
-:host ::-webkit-scrollbar-corner {
+:host *::-webkit-scrollbar-corner {
   display: none;
 }
 :host .reset-button {

package/dist/collection/components/category-filter/category-filter.js

@@ -578,19 +578,19 @@ export class CategoryFilter {
         return 'color-primary';
     }
     render() {
-        return (h(Host, { key: '85dbdb78b8e91f24bd024a7f807981c1be021949' }, h("form", { key: 'c7bbb49d432f280a07decbe120f73d6c797d8cc7', ref: (el) => (this.formElement = el) }, h("div", { key: '0564d4922c264f58cdbd27da56913b09fc7ab9a5', "read-only": this.readonly, class: {
+        return (h(Host, { key: '6ae51946907b11bab602d5ffd6da9bbdbc07747c' }, h("form", { key: 'e0a2200a1a6779b8317269384e9e075bdb6769eb', ref: (el) => (this.formElement = el) }, h("div", { key: '3889ea9b0cc83ec856105984732fcb0ca0919d57', "read-only": this.readonly, class: {
                 'input-container': true,
                 disabled: this.disabled,
                 focus: this.hasFocus,
                 readonly: this.readonly,
                 'no-icon': this.hideIcon,
-            } }, h("ix-icon", { key: '3807f9bee30d44bcca3a8aefda6889958f5fa781', color: this.getIconColor(), class: { 'display-none': this.hideIcon }, name: this.icon ?? iconSearch, size: "16" }), h("div", { key: 'eee8f5b467efe653a186361cd6db76a6a92bdb15', class: "token-container" }, h("div", { key: 'd82c1963974f8213fab1b90473d8f0c883306281', class: "list-unstyled" }, this.filterTokens.map((value, index) => (h("span", { key: value.toString(), class: {
+            } }, h("ix-icon", { key: '0529e9e8f8b0bd23ecf205f0cc4ac3a42d72adf6', color: this.getIconColor(), class: { 'display-none': this.hideIcon }, name: this.icon ?? iconSearch, size: "16" }), h("div", { key: 'c7dc47f6e906b9a0cd245fbd7468b61fed49e0e0', class: "token-container" }, h("div", { key: 'df8071f216314251b9f6c58ca115591734548ff9', class: "list-unstyled" }, this.filterTokens.map((value, index) => (h("span", { key: value.toString(), class: {
                 animate__animated: true,
                 animate__fadein: true,
             } }, h("ix-filter-chip", { disabled: this.disabled, readonly: this.readonly, onClick: (e) => e.stopPropagation(), onCloseClick: () => this.removeToken(index) }, this.getFilterChipLabel(value))))), this.categories === undefined ? ('') : (h("span", { class: {
                 'category-preview': true,
                 'display-none': this.category === '',
-            } }, this.categories[this.category]?.label)), h("input", { key: 'bb6d42b5691fa761ed9f8196edce521e5e5e04aa', class: {
+            } }, this.categories[this.category]?.label)), h("input", { key: '5a27624a1f2e967caa57b18fdf7145da9dfbf4f9', class: {
                 'text-input': true,
                 'hide-placeholder': this.readonly || this.disabled || this.category !== '',
             }, autocomplete: "off", name: "category-filter-input", disabled: this.disabled, readonly: this.readonly, ref: this.textInput, type: "text", placeholder: this.placeholder, ...this.a11yAttributes, "aria-label": this.ariaLabelFilterInput }))), !this.readonly && !this.disabled && this.getResetButton())), this.disabled || this.readonly ? ('') : (h("ix-dropdown", { show: this.showDropdown, closeBehavior: "outside", offset: { mainAxis: 2 }, anchor: this.textInput?.waitForCurrent(), trigger: this.hostElement, header: this.getDropdownHeader(), enableTopLayer: this.enableTopLayer }, this.renderDropdownContent()))));

package/dist/collection/components/chat/chat.css

@@ -0,0 +1,114 @@
+/*
+ * SPDX-FileCopyrightText: 2026 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.
+ */
+/*
+* SPDX-FileCopyrightText: 2024 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.
+*/
+/*
+* SPDX-FileCopyrightText: 2024 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 {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  height: 100%;
+  min-height: 0;
+  min-width: 27rem;
+  max-width: calc(45rem + var(--theme-space-5));
+  box-sizing: border-box;
+}
+: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 * {
+  /* width */
+}
+:host *::-webkit-scrollbar {
+  width: 0.5rem;
+  height: 0.5rem;
+}
+:host * {
+  /* Track */
+}
+: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 * {
+  /* Handle */
+}
+:host *::-webkit-scrollbar-thumb {
+  border-radius: 5px;
+  background: var(--theme-scrollbar-thumb--background);
+}
+:host * {
+  /* Handle on hover */
+}
+:host *::-webkit-scrollbar-thumb:hover {
+  background: var(--theme-scrollbar-thumb--background--hover);
+}
+:host *::-webkit-scrollbar-corner {
+  display: none;
+}
+:host .messages {
+  display: flex;
+  flex: 1 1 auto;
+  flex-direction: column;
+  align-items: center;
+  gap: var(--theme-space-5);
+  min-height: 0;
+  width: 100%;
+  padding: var(--theme-space-5);
+  box-sizing: border-box;
+  overflow-y: auto;
+}
+:host .messages ::slotted(*) {
+  width: 100%;
+  max-width: 45rem;
+  flex: 0 0 auto;
+}
+:host .prompt {
+  display: none;
+  flex: 0 0 auto;
+  width: 100%;
+  padding: var(--theme-space-5);
+  box-sizing: border-box;
+}
+:host .prompt ::slotted(*) {
+  width: 100%;
+  max-width: 45rem;
+}
+
+:host(.has-prompt) .prompt {
+  display: flex;
+  justify-content: center;
+}

package/dist/collection/components/chat/chat.js

@@ -0,0 +1,47 @@
+/*
+ * SPDX-FileCopyrightText: 2026 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.
+ */
+import { Host, h } from "@stencil/core";
+/**
+ * @since 5.2.0
+ * @slot - Chat messages, for example ix-chat-user-message and ix-chat-ai-message
+ * @slot prompt - Chat input displayed below the chat messages
+ */
+export class Chat {
+    hasPrompt = false;
+    hasAssignedContent(slot) {
+        return slot.assignedNodes({ flatten: true }).some((node) => {
+            return node.nodeType === 1 || !!node.textContent?.trim();
+        });
+    }
+    handlePromptSlotChange(event) {
+        this.hasPrompt = this.hasAssignedContent(event.target);
+    }
+    render() {
+        return (h(Host, { key: 'b4d659f28fb34320f986c5b046ff794c9b2a0742', class: {
+                'has-prompt': this.hasPrompt,
+            } }, h("div", { key: '0790bede975ba3cba978ec9425d80195fa380b83', class: "messages", part: "messages" }, h("slot", { key: 'f3a2c8f7e337fb3b93a19098a3f3556377692f7c' })), h("div", { key: '4975b7ed690b957d87307fcde8c8c785883bb2b0', class: "prompt", part: "prompt" }, h("slot", { key: 'd99a7efca4cff53916781d3bb1c089ba63f356c0', name: "prompt", onSlotchange: (event) => this.handlePromptSlotChange(event) }))));
+    }
+    static get is() { return "ix-chat"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["chat.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["chat.css"]
+        };
+    }
+    static get states() {
+        return {
+            "hasPrompt": {}
+        };
+    }
+}

package/dist/collection/components/chat-ai-message/chat-ai-message.css

@@ -0,0 +1,139 @@
+/*
+ * SPDX-FileCopyrightText: 2026 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.
+ */
+/*
+* SPDX-FileCopyrightText: 2024 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.
+*/
+/*
+* SPDX-FileCopyrightText: 2024 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 {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  width: 100%;
+  min-width: 0;
+  gap: var(--theme-space-3);
+  box-sizing: border-box;
+  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 * {
+  /* width */
+}
+:host *::-webkit-scrollbar {
+  width: 0.5rem;
+  height: 0.5rem;
+}
+:host * {
+  /* Track */
+}
+: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 * {
+  /* Handle */
+}
+:host *::-webkit-scrollbar-thumb {
+  border-radius: 5px;
+  background: var(--theme-scrollbar-thumb--background);
+}
+:host * {
+  /* Handle on hover */
+}
+:host *::-webkit-scrollbar-thumb:hover {
+  background: var(--theme-scrollbar-thumb--background--hover);
+}
+:host *::-webkit-scrollbar-corner {
+  display: none;
+}
+:host .message {
+  display: flex;
+  flex-direction: column;
+  align-items: stretch;
+  width: 100%;
+  min-width: 0;
+  gap: var(--theme-space-3);
+  font-size: var(--theme-font-size-l);
+  line-height: 1.5;
+  overflow-wrap: anywhere;
+}
+:host .message ::slotted(*) {
+  margin: 0;
+  color: inherit;
+  overflow-wrap: anywhere;
+}
+:host .message ::slotted(h1),
+:host .message ::slotted(h2),
+:host .message ::slotted(h3),
+:host .message ::slotted(h4),
+:host .message ::slotted(h5),
+:host .message ::slotted(h6) {
+  font-size: var(--theme-font-size-l);
+  font-weight: var(--theme-font-weight-bold);
+  line-height: 1.2;
+}
+:host .meta {
+  display: none;
+  align-items: center;
+  gap: var(--theme-space-3);
+  width: 100%;
+  min-height: 2rem;
+}
+:host .actions {
+  display: none;
+  align-items: center;
+  gap: 0.25rem;
+}
+:host .sources {
+  display: none;
+  align-items: center;
+}
+:host .actions ::slotted(ix-icon-button),
+:host .sources ::slotted(*) {
+  flex: 0 0 auto;
+}
+
+:host(.has-meta) .meta {
+  display: flex;
+}
+
+:host(.has-actions) .actions {
+  display: flex;
+}
+
+:host(.has-sources) .sources {
+  display: flex;
+}

package/dist/collection/components/chat-ai-message/chat-ai-message.js

@@ -0,0 +1,56 @@
+/*
+ * SPDX-FileCopyrightText: 2026 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.
+ */
+import { Host, h } from "@stencil/core";
+/**
+ * @since 5.2.0
+ * @slot - AI-generated message content
+ * @slot actions - Optional actions displayed below the AI message
+ * @slot sources - Optional sources displayed next to the AI message actions
+ */
+export class ChatAiMessage {
+    hasActions = false;
+    hasSources = false;
+    hasAssignedContent(slot) {
+        return slot.assignedNodes({ flatten: true }).some((node) => {
+            return node.nodeType === 1 || !!node.textContent?.trim();
+        });
+    }
+    handleActionsSlotChange(event) {
+        this.hasActions = this.hasAssignedContent(event.target);
+    }
+    handleSourcesSlotChange(event) {
+        this.hasSources = this.hasAssignedContent(event.target);
+    }
+    render() {
+        const hasMeta = this.hasActions || this.hasSources;
+        return (h(Host, { key: '7551fd7bf696992eff30a21efd2c6a1ad6934f05', class: {
+                'has-actions': this.hasActions,
+                'has-sources': this.hasSources,
+                'has-meta': hasMeta,
+            } }, h("div", { key: '4ae0ca33bb6f1575d802f081436f9b64cc84a860', class: "message" }, h("slot", { key: 'f9a97d3043c533da53c0a09335a0660ff2fc11ba' })), h("div", { key: '3ea7b4f8a3002c1b70ab6fc3f0038fd3d099a0cc', class: "meta", "aria-hidden": !hasMeta ? 'true' : undefined }, h("div", { key: 'dc13ff30a44ddbde25a9b984ecf534bd99c5f959', class: "actions" }, h("slot", { key: 'e0c8db109a43c9431c9684105b0576a1513f22ce', name: "actions", onSlotchange: (event) => this.handleActionsSlotChange(event) })), h("div", { key: '748966a8345e8dbdf9e4d8c3302577660ba6ec1b', class: "sources" }, h("slot", { key: '0457bbd2d685b6c0fd59251172a8e2fcef82daef', name: "sources", onSlotchange: (event) => this.handleSourcesSlotChange(event) })))));
+    }
+    static get is() { return "ix-chat-ai-message"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["chat-ai-message.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["chat-ai-message.css"]
+        };
+    }
+    static get states() {
+        return {
+            "hasActions": {},
+            "hasSources": {}
+        };
+    }
+}

package/dist/collection/components/chat-attachment/chat-attachment.css

@@ -0,0 +1,135 @@
+/*
+ * SPDX-FileCopyrightText: 2026 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.
+ */
+/*
+* SPDX-FileCopyrightText: 2024 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.
+*/
+/*
+* SPDX-FileCopyrightText: 2024 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 {
+  display: inline-block;
+}
+: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 * {
+  /* width */
+}
+:host *::-webkit-scrollbar {
+  width: 0.5rem;
+  height: 0.5rem;
+}
+:host * {
+  /* Track */
+}
+: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 * {
+  /* Handle */
+}
+:host *::-webkit-scrollbar-thumb {
+  border-radius: 5px;
+  background: var(--theme-scrollbar-thumb--background);
+}
+:host * {
+  /* Handle on hover */
+}
+:host *::-webkit-scrollbar-thumb:hover {
+  background: var(--theme-scrollbar-thumb--background--hover);
+}
+:host *::-webkit-scrollbar-corner {
+  display: none;
+}
+:host .attachment-chip {
+  display: block;
+  width: 100%;
+  max-width: 20rem;
+}
+:host .content,
+:host .status-content {
+  display: inline-flex;
+  align-items: center;
+  min-width: 0;
+}
+:host .content {
+  flex: 1 1 auto;
+  max-width: 100%;
+  width: 100%;
+}
+:host .status-content {
+  gap: var(--theme-space-1);
+}
+:host .status-content ix-spinner {
+  scale: 1.7;
+  margin-left: 0.1875rem;
+}
+:host .file-name {
+  display: inline-flex;
+  flex: 1 1 auto;
+  min-width: 0;
+  max-width: 100%;
+  overflow: hidden;
+}
+:host .file-name__base {
+  flex: 1 1 auto;
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  text-align: end;
+}
+:host .file-name__extension {
+  flex: 0 0 auto;
+  white-space: nowrap;
+}
+:host .status-label {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+:host ix-icon {
+  flex: 0 0 auto;
+}
+:host ix-spinner {
+  flex: 0 0 auto;
+}
+
+:host(.preview-supported) {
+  cursor: pointer;
+}
+
+:host(.has-remove-button) {
+  gap: var(--theme-space-0);
+}