@carbon/ai-chat-components 0.10.0 → 0.11.0

package/es/components/workspace-shell/src/header-collapsible-manager.js

@@ -0,0 +1,223 @@
+/**
+ * Copyright IBM Corp. 2025
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/**
+ * @license
+ *
+ * Copyright IBM Corp. 2026
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+/**
+ * Manages automatic header collapsible behavior for the workspace shell.
+ * Monitors slot heights and determines when the header should be collapsible
+ * to ensure the body slot has adequate space.
+ */
+class HeaderCollapsibleManager {
+    constructor(shellRoot, hostElement) {
+        this.shellRoot = shellRoot;
+        this.hostElement = hostElement;
+        this.isManagerControlled = false;
+        this.hadInitialAttribute = false;
+        this.calculationPending = false;
+        // Check if header already has collapsible attribute at initialization
+        const headerSlot = this.shellRoot.querySelector('slot[name="header"]');
+        const headerElement = headerSlot?.assignedElements()[0];
+        this.hadInitialAttribute =
+            headerElement?.hasAttribute("collapsible") || false;
+    }
+    /**
+     * Start observing slot heights and managing collapsible state
+     */
+    connect(onStateChange) {
+        this.onStateChangeCallback = onStateChange;
+        this.setupResizeObserver();
+        this.setupSlotChangeListener();
+    }
+    /**
+     * Stop observing and clean up
+     */
+    disconnect() {
+        this.resizeObserver?.disconnect();
+        if (this.throttleTimeout) {
+            clearTimeout(this.throttleTimeout);
+        }
+        this.removeSlotChangeListener();
+        this.onStateChangeCallback = undefined;
+        this.isManagerControlled = false;
+        this.calculationPending = false;
+        this.lastState = undefined;
+        this.expandedHeaderHeight = undefined;
+    }
+    /**
+     * Reset the stored expanded header height.
+     * Call this when workspace content changes to recalculate with new header size.
+     */
+    reset() {
+        this.expandedHeaderHeight = undefined;
+        this.lastState = undefined;
+        // Trigger a new calculation
+        this.calculateCollapsibleState();
+    }
+    /**
+     * Set up ResizeObserver to monitor all relevant elements
+     */
+    setupResizeObserver() {
+        if (typeof ResizeObserver === "undefined") {
+            return;
+        }
+        this.resizeObserver = new ResizeObserver(() => {
+            // Throttle calculations to max once per 150ms to prevent performance issues
+            if (this.throttleTimeout) {
+                return;
+            }
+            this.throttleTimeout = window.setTimeout(() => {
+                this.throttleTimeout = undefined;
+                if (!this.calculationPending) {
+                    this.calculationPending = true;
+                    requestAnimationFrame(() => {
+                        this.calculationPending = false;
+                        this.calculateCollapsibleState();
+                    });
+                }
+            }, 150);
+        });
+        // Only observe the host element - this is sufficient to detect size changes
+        // Observing individual slots was causing performance issues
+        this.resizeObserver.observe(this.hostElement);
+        // Initial calculation
+        this.calculateCollapsibleState();
+    }
+    /**
+     * Set up listener for slot content changes to reset when header content changes
+     */
+    setupSlotChangeListener() {
+        const headerSlot = this.shellRoot.querySelector('slot[name="header"]');
+        if (headerSlot) {
+            this.slotChangeHandler = () => {
+                // Reset expanded height when slot content changes
+                this.reset();
+            };
+            headerSlot.addEventListener("slotchange", this.slotChangeHandler);
+        }
+    }
+    /**
+     * Remove slot change listener
+     */
+    removeSlotChangeListener() {
+        if (this.slotChangeHandler) {
+            const headerSlot = this.shellRoot.querySelector('slot[name="header"]');
+            if (headerSlot) {
+                headerSlot.removeEventListener("slotchange", this.slotChangeHandler);
+            }
+            this.slotChangeHandler = undefined;
+        }
+    }
+    /**
+     * Calculate if header should be collapsible based on available space
+     */
+    calculateCollapsibleState() {
+        const totalHeight = this.hostElement.offsetHeight;
+        // Get individual slot heights
+        const toolbarHeight = this.getSlotHeight("toolbar");
+        const notificationHeight = this.getSlotHeight("notification");
+        const currentHeaderHeight = this.getSlotHeight("header");
+        const footerHeight = this.getSlotHeight("footer");
+        // Store the expanded header height ONCE when we first see it expanded
+        // Never update it after that to avoid flip-flopping
+        const headerElement = this.getHeaderElement();
+        const isCurrentlyCollapsed = headerElement?.hasAttribute("collapsible");
+        // Only store expanded height if we don't have one yet AND header is not collapsed
+        if (!this.expandedHeaderHeight &&
+            !isCurrentlyCollapsed &&
+            currentHeaderHeight > 0) {
+            // First time seeing the expanded header, store this as the permanent reference
+            this.expandedHeaderHeight = currentHeaderHeight;
+        }
+        // Use the expanded height for calculations to avoid flip-flopping
+        // If we don't have expanded height yet, use current (only happens on very first render)
+        const headerHeight = this.expandedHeaderHeight || currentHeaderHeight;
+        // Calculate available body height using the EXPANDED header height
+        const availableBodyHeight = totalHeight -
+            toolbarHeight -
+            notificationHeight -
+            headerHeight -
+            footerHeight;
+        // Determine if header should be collapsible
+        // Rule: If body would be smaller than expanded header, collapse the header
+        const shouldCollapse = availableBodyHeight < headerHeight;
+        // Only notify if state actually changed to prevent unnecessary updates
+        if (!this.lastState ||
+            this.lastState.shouldCollapse !== shouldCollapse ||
+            this.lastState.availableBodyHeight !== availableBodyHeight ||
+            this.lastState.headerHeight !== headerHeight) {
+            this.lastState = {
+                shouldCollapse,
+                availableBodyHeight,
+                headerHeight,
+            };
+            // Notify callback
+            if (this.onStateChangeCallback) {
+                this.onStateChangeCallback(this.lastState);
+            }
+        }
+    }
+    /**
+     * Get the header element
+     */
+    getHeaderElement() {
+        const headerSlot = this.shellRoot.querySelector('slot[name="header"]');
+        return headerSlot?.assignedElements()[0] || null;
+    }
+    /**
+     * Get the total height of elements assigned to a slot
+     */
+    getSlotHeight(slotName) {
+        const slot = this.shellRoot.querySelector(`slot[name="${slotName}"]`);
+        const elements = slot?.assignedElements() || [];
+        return elements.reduce((sum, el) => sum + el.offsetHeight, 0);
+    }
+    /**
+     * Check if a header element has a manually set collapsible attribute
+     */
+    hasManualOverride() {
+        // If attribute existed at initialization, it's a manual override
+        if (this.hadInitialAttribute) {
+            return true;
+        }
+        const headerSlot = this.shellRoot.querySelector('slot[name="header"]');
+        const headerElement = headerSlot?.assignedElements()[0];
+        if (!headerElement?.hasAttribute("collapsible")) {
+            return false;
+        }
+        // If manager set it, it's not a manual override
+        return !this.isManagerControlled;
+    }
+    /**
+     * Update the header's collapsible attribute
+     */
+    updateHeaderCollapsible(shouldCollapse) {
+        const headerSlot = this.shellRoot.querySelector('slot[name="header"]');
+        const headerElement = headerSlot?.assignedElements()[0];
+        if (headerElement && !this.hasManualOverride()) {
+            const currentlyHasAttr = headerElement.hasAttribute("collapsible");
+            if (shouldCollapse && !currentlyHasAttr) {
+                headerElement.setAttribute("collapsible", "");
+                this.isManagerControlled = true;
+            }
+            else if (!shouldCollapse && currentlyHasAttr) {
+                headerElement.removeAttribute("collapsible");
+                this.isManagerControlled = false;
+            }
+        }
+    }
+}
+// Made with Bob
+
+export { HeaderCollapsibleManager };
+//# sourceMappingURL=header-collapsible-manager.js.map

package/es/components/workspace-shell/src/header-collapsible-manager.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"header-collapsible-manager.js","sources":["../../../../src/components/workspace-shell/src/header-collapsible-manager.ts"],"sourcesContent":[null],"names":[],"mappings":"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"}

package/es/components/workspace-shell/src/workspace-shell-body.d.ts

@@ -6,7 +6,7 @@ import { LitElement } from "lit";
  *
  */
 declare class CDSAIChatWorkspaceShellBody extends LitElement {
-    static styles: any;
+    static styles: any[];
     /**
      * Sets default slot value to body
      */

package/es/components/workspace-shell/src/workspace-shell-body.js

@@ -8,6 +8,7 @@
 import { __decorate } from 'tslib';
 import { LitElement, html } from 'lit';
 import { property } from 'lit/decorators.js';
+import commonStyles from '../../../globals/scss/common.scss.js';
 import styles from './workspace-shell.scss.js';
 import { carbonElement } from '../../../globals/decorators/carbon-element.js';
 import prefix from '../../../globals/settings.js';
@@ -38,7 +39,7 @@ let CDSAIChatWorkspaceShellBody = class CDSAIChatWorkspaceShellBody extends LitE
         return html ` <slot></slot> `;
     }
 };
-CDSAIChatWorkspaceShellBody.styles = styles;
+CDSAIChatWorkspaceShellBody.styles = [commonStyles, styles];
 __decorate([
     property({ type: String, reflect: true })
 ], CDSAIChatWorkspaceShellBody.prototype, "slot", void 0);

package/es/components/workspace-shell/src/workspace-shell-body.js.map

@@ -1 +1 @@
-{"version":3,"file":"workspace-shell-body.js","sources":["../../../../src/components/workspace-shell/src/workspace-shell-body.ts"],"sourcesContent":[null],"names":[],"mappings":";;;;;;;;;;;;;;AAAA;;;;;;;AAOG;AAQH;;;;;AAKG;AAEH,IAAM,2BAA2B,GAAjC,MAAM,2BAA4B,SAAQ,UAAU,CAAA;AAApD,IAAA,WAAA,GAAA;;AAGE;;AAEG;QAEH,IAAA,CAAA,IAAI,GAAG,MAAM;IAKf;IAHE,MAAM,GAAA;QACJ,OAAO,IAAI,CAAA,CAAA,eAAA,CAAiB;IAC9B;;AAVO,2BAAA,CAAA,MAAM,GAAG,MAAH;AAMb,UAAA,CAAA;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE;AAC3B,CAAA,EAAA,2BAAA,CAAA,SAAA,EAAA,MAAA,EAAA,MAAA,CAAA;AAPV,2BAA2B,GAAA,UAAA,CAAA;AADhC,IAAA,aAAa,CAAC,CAAA,EAAG,MAAM,CAAA,qBAAA,CAAuB;AACzC,CAAA,EAAA,2BAA2B,CAYhC;AAGD,oCAAe,2BAA2B;;;;"}
+{"version":3,"file":"workspace-shell-body.js","sources":["../../../../src/components/workspace-shell/src/workspace-shell-body.ts"],"sourcesContent":[null],"names":[],"mappings":";;;;;;;;;;;;;;;AAAA;;;;;;;AAOG;AASH;;;;;AAKG;AAEH,IAAM,2BAA2B,GAAjC,MAAM,2BAA4B,SAAQ,UAAU,CAAA;AAApD,IAAA,WAAA,GAAA;;AAGE;;AAEG;QAEH,IAAA,CAAA,IAAI,GAAG,MAAM;IAKf;IAHE,MAAM,GAAA;QACJ,OAAO,IAAI,CAAA,CAAA,eAAA,CAAiB;IAC9B;;AAVO,2BAAA,CAAA,MAAM,GAAG,CAAC,YAAY,EAAE,MAAM,CAAC;AAMtC,UAAA,CAAA;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE;AAC3B,CAAA,EAAA,2BAAA,CAAA,SAAA,EAAA,MAAA,EAAA,MAAA,CAAA;AAPV,2BAA2B,GAAA,UAAA,CAAA;AADhC,IAAA,aAAa,CAAC,CAAA,EAAG,MAAM,CAAA,qBAAA,CAAuB;AACzC,CAAA,EAAA,2BAA2B,CAYhC;AAGD,oCAAe,2BAA2B;;;;"}

package/es/components/workspace-shell/src/workspace-shell-footer.d.ts

@@ -16,9 +16,7 @@ export type Action = {
  * @fires cds-aichat-workspace-shell-footer-clicked - The custom event fired when footer buttons are clicked.
  */
 declare class CDSAIChatWorkspaceShellFooter extends LitElement {
-    static styles: any;
-    private _ro;
-    private _isStacked;
+    static styles: any[];
     /**
      * Sets default slot value to footer
      */

package/es/components/workspace-shell/src/workspace-shell-footer.js

@@ -12,6 +12,7 @@ import '@carbon/web-components/es/components/button/button.js';
 import { iconLoader } from '@carbon/web-components/es/globals/internal/icon-loader.js';
 import { carbonElement } from '../../../globals/decorators/carbon-element.js';
 import prefix from '../../../globals/settings.js';
+import commonStyles from '../../../globals/scss/common.scss.js';
 import styles from './workspace-shell-footer.scss.js';
 
 /*
@@ -30,6 +31,9 @@ import styles from './workspace-shell-footer.scss.js';
 let CDSAIChatWorkspaceShellFooter = class CDSAIChatWorkspaceShellFooter extends LitElement {
     constructor() {
         super(...arguments);
+        /**
+         * @internal
+         */
         this._isStacked = false;
         /**
          * Sets default slot value to footer
@@ -40,16 +44,14 @@ let CDSAIChatWorkspaceShellFooter = class CDSAIChatWorkspaceShellFooter extends
     connectedCallback() {
         super.connectedCallback();
         this.setAttribute("data-rounded", "bottom");
-        // Observe parent size changes
+        // Observe component's own size changes
         // Use requestAnimationFrame to avoid ResizeObserver loop errors
         this._ro = new ResizeObserver(() => {
             requestAnimationFrame(() => {
                 this._updateStacked();
             });
         });
-        if (this.parentElement) {
-            this._ro.observe(this.parentElement);
-        }
+        this._ro.observe(this);
     }
     updated(changedProps) {
         if (changedProps.has("actions")) {
@@ -100,7 +102,7 @@ let CDSAIChatWorkspaceShellFooter = class CDSAIChatWorkspaceShellFooter extends
             .eventButtonClick, init));
     }
     _updateStacked() {
-        const shouldStack = window.innerWidth < 671;
+        const shouldStack = this.offsetWidth < 671;
         if (shouldStack !== this._isStacked) {
             this._isStacked = shouldStack;
             // Force re-render so actions get sorted again
@@ -130,7 +132,7 @@ let CDSAIChatWorkspaceShellFooter = class CDSAIChatWorkspaceShellFooter extends
         return `${prefix}-workspace-shell-footer-clicked`;
     }
 };
-CDSAIChatWorkspaceShellFooter.styles = styles;
+CDSAIChatWorkspaceShellFooter.styles = [commonStyles, styles];
 __decorate([
     state()
 ], CDSAIChatWorkspaceShellFooter.prototype, "_isStacked", void 0);

package/es/components/workspace-shell/src/workspace-shell-footer.js.map

@@ -1 +1 @@
-{"version":3,"file":"workspace-shell-footer.js","sources":["../../../../src/components/workspace-shell/src/workspace-shell-footer.ts"],"sourcesContent":[null],"names":[],"mappings":"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"}
+{"version":3,"file":"workspace-shell-footer.js","sources":["../../../../src/components/workspace-shell/src/workspace-shell-footer.ts"],"sourcesContent":[null],"names":[],"mappings":"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"}

package/es/components/workspace-shell/src/workspace-shell-footer.scss.js

@@ -7,7 +7,7 @@
 
 import { css } from 'lit';
 
-var styles = css([":host([data-rounded=\"\"]),[data-rounded=\"\"]{border-radius:calc(var(--cds-aichat-rounded-modifier-radius) - .0625rem)}:host([data-rounded=\"\"])::part(button),:host([data-rounded=\"\"])::part(link),[data-rounded=\"\"]::part(button),[data-rounded=\"\"]::part(link){border-radius:calc(var(--cds-aichat-rounded-modifier-radius) - .0625rem);outline-offset:-.0625rem}:host([data-rounded=\"\"])>:only-child,[data-rounded=\"\"]>:only-child{border-radius:calc(var(--cds-aichat-rounded-modifier-radius) - .0625rem)}:host([data-rounded=top]),[data-rounded=top]{border-start-end-radius:calc(var(--cds-aichat-rounded-modifier-radius-start-end, var(--cds-aichat-rounded-modifier-radius)) - .0625rem);border-start-start-radius:calc(var(--cds-aichat-rounded-modifier-radius-start-start, var(--cds-aichat-rounded-modifier-radius)) - .0625rem)}:host([data-rounded=top-left]),[data-rounded=top-left]{border-start-start-radius:calc(var(--cds-aichat-rounded-modifier-radius-start-start, var(--cds-aichat-rounded-modifier-radius)) - .0625rem)}:host([data-rounded=top-right]),[data-rounded=top-right]{border-start-end-radius:calc(var(--cds-aichat-rounded-modifier-radius-start-end, var(--cds-aichat-rounded-modifier-radius)) - .0625rem)}:host([data-rounded=bottom]),[data-rounded=bottom]{border-end-end-radius:calc(var(--cds-aichat-rounded-modifier-radius-end-end, var(--cds-aichat-rounded-modifier-radius)) - .0625rem);border-end-start-radius:calc(var(--cds-aichat-rounded-modifier-radius-end-start, var(--cds-aichat-rounded-modifier-radius)) - .0625rem)}:host([data-rounded=bottom-left]),[data-rounded=bottom-left]{border-end-start-radius:calc(var(--cds-aichat-rounded-modifier-radius-end-start, var(--cds-aichat-rounded-modifier-radius)) - .0625rem)}:host([data-rounded=bottom-right]),[data-rounded=bottom-right]{border-end-end-radius:calc(var(--cds-aichat-rounded-modifier-radius-end-end, var(--cds-aichat-rounded-modifier-radius)) - .0625rem)}:host([data-rounded=top]:not([data-stacked]))>:first-child,[data-rounded=top]:not([data-stacked])>:first-child{border-start-start-radius:calc(var(--cds-aichat-rounded-modifier-radius-start-start, var(--cds-aichat-rounded-modifier-radius)) - .0625rem)}:host([data-rounded=top]:not([data-stacked]))>:first-child::part(button),[data-rounded=top]:not([data-stacked])>:first-child::part(button){border-start-start-radius:calc(var(--cds-aichat-rounded-modifier-radius-start-start, var(--cds-aichat-rounded-modifier-radius)) - .0625rem)}:host([data-rounded=top]:not([data-stacked]))>:last-child,[data-rounded=top]:not([data-stacked])>:last-child{border-start-end-radius:calc(var(--cds-aichat-rounded-modifier-radius-start-end, var(--cds-aichat-rounded-modifier-radius)) - .0625rem)}:host([data-rounded=top]:not([data-stacked]))>:last-child::part(button),[data-rounded=top]:not([data-stacked])>:last-child::part(button){border-start-end-radius:calc(var(--cds-aichat-rounded-modifier-radius-start-end, var(--cds-aichat-rounded-modifier-radius)) - .0625rem)}:host([data-rounded=top-left]:not([data-stacked]))>:first-child,[data-rounded=top-left]:not([data-stacked])>:first-child{border-start-start-radius:calc(var(--cds-aichat-rounded-modifier-radius-start-start, var(--cds-aichat-rounded-modifier-radius)) - .0625rem)}:host([data-rounded=top-left]:not([data-stacked]))>:first-child::part(button),[data-rounded=top-left]:not([data-stacked])>:first-child::part(button){border-start-start-radius:calc(var(--cds-aichat-rounded-modifier-radius-start-start, var(--cds-aichat-rounded-modifier-radius)) - .0625rem)}:host([data-rounded=top-right]:not([data-stacked]))>:last-child,[data-rounded=top-right]:not([data-stacked])>:last-child{border-start-end-radius:calc(var(--cds-aichat-rounded-modifier-radius-start-end, var(--cds-aichat-rounded-modifier-radius)) - .0625rem)}:host([data-rounded=top-right]:not([data-stacked]))>:last-child::part(button),[data-rounded=top-right]:not([data-stacked])>:last-child::part(button){border-start-end-radius:calc(var(--cds-aichat-rounded-modifier-radius-start-end, var(--cds-aichat-rounded-modifier-radius)) - .0625rem)}:host([data-rounded=bottom]:not([data-stacked]))>:first-child,[data-rounded=bottom]:not([data-stacked])>:first-child{border-end-start-radius:calc(var(--cds-aichat-rounded-modifier-radius-end-start, var(--cds-aichat-rounded-modifier-radius)) - .0625rem)}:host([data-rounded=bottom]:not([data-stacked]))>:first-child::part(button),[data-rounded=bottom]:not([data-stacked])>:first-child::part(button){border-end-start-radius:calc(var(--cds-aichat-rounded-modifier-radius-end-start, var(--cds-aichat-rounded-modifier-radius)) - .0625rem)}:host([data-rounded=bottom]:not([data-stacked]))>:last-child,[data-rounded=bottom]:not([data-stacked])>:last-child{border-end-end-radius:calc(var(--cds-aichat-rounded-modifier-radius-end-end, var(--cds-aichat-rounded-modifier-radius)) - .0625rem)}:host([data-rounded=bottom]:not([data-stacked]))>:last-child::part(button),[data-rounded=bottom]:not([data-stacked])>:last-child::part(button){border-end-end-radius:calc(var(--cds-aichat-rounded-modifier-radius-end-end, var(--cds-aichat-rounded-modifier-radius)) - .0625rem)}:host([data-rounded=bottom-left]:not([data-stacked]))>:first-child,[data-rounded=bottom-left]:not([data-stacked])>:first-child{border-end-start-radius:calc(var(--cds-aichat-rounded-modifier-radius-end-start, var(--cds-aichat-rounded-modifier-radius)) - .0625rem)}:host([data-rounded=bottom-left]:not([data-stacked]))>:first-child::part(button),[data-rounded=bottom-left]:not([data-stacked])>:first-child::part(button){border-end-start-radius:calc(var(--cds-aichat-rounded-modifier-radius-end-start, var(--cds-aichat-rounded-modifier-radius)) - .0625rem)}:host([data-rounded=bottom-right]:not([data-stacked]))>:last-child,[data-rounded=bottom-right]:not([data-stacked])>:last-child{border-end-end-radius:calc(var(--cds-aichat-rounded-modifier-radius-end-end, var(--cds-aichat-rounded-modifier-radius)) - .0625rem)}:host([data-rounded=bottom-right]:not([data-stacked]))>:last-child::part(button),[data-rounded=bottom-right]:not([data-stacked])>:last-child::part(button){border-end-end-radius:calc(var(--cds-aichat-rounded-modifier-radius-end-end, var(--cds-aichat-rounded-modifier-radius)) - .0625rem)}:host([data-rounded=top][data-stacked])>:first-child,[data-rounded=top][data-stacked]>:first-child{border-start-end-radius:calc(var(--cds-aichat-rounded-modifier-radius-start-end, var(--cds-aichat-rounded-modifier-radius)) - .0625rem);border-start-start-radius:calc(var(--cds-aichat-rounded-modifier-radius-start-start, var(--cds-aichat-rounded-modifier-radius)) - .0625rem)}:host([data-rounded=top][data-stacked])>:first-child::part(button),[data-rounded=top][data-stacked]>:first-child::part(button){border-start-end-radius:calc(var(--cds-aichat-rounded-modifier-radius-start-end, var(--cds-aichat-rounded-modifier-radius)) - .0625rem);border-start-start-radius:calc(var(--cds-aichat-rounded-modifier-radius-start-start, var(--cds-aichat-rounded-modifier-radius)) - .0625rem)}:host([data-rounded=top-right][data-stacked])>:first-child,[data-rounded=top-right][data-stacked]>:first-child{border-start-end-radius:calc(var(--cds-aichat-rounded-modifier-radius-start-end, var(--cds-aichat-rounded-modifier-radius)) - .0625rem)}:host([data-rounded=top-right][data-stacked])>:first-child::part(button),[data-rounded=top-right][data-stacked]>:first-child::part(button){border-start-end-radius:calc(var(--cds-aichat-rounded-modifier-radius-start-end, var(--cds-aichat-rounded-modifier-radius)) - .0625rem)}:host([data-rounded=top-left][data-stacked])>:first-child,[data-rounded=top-left][data-stacked]>:first-child{border-start-start-radius:calc(var(--cds-aichat-rounded-modifier-radius-start-start, var(--cds-aichat-rounded-modifier-radius)) - .0625rem)}:host([data-rounded=top-left][data-stacked])>:first-child::part(button),[data-rounded=top-left][data-stacked]>:first-child::part(button){border-start-start-radius:calc(var(--cds-aichat-rounded-modifier-radius-start-start, var(--cds-aichat-rounded-modifier-radius)) - .0625rem)}:host([data-rounded=bottom][data-stacked])>:last-child,[data-rounded=bottom][data-stacked]>:last-child{border-end-end-radius:calc(var(--cds-aichat-rounded-modifier-radius-end-end, var(--cds-aichat-rounded-modifier-radius)) - .0625rem);border-end-start-radius:calc(var(--cds-aichat-rounded-modifier-radius-end-start, var(--cds-aichat-rounded-modifier-radius)) - .0625rem)}:host([data-rounded=bottom][data-stacked])>:last-child::part(button),[data-rounded=bottom][data-stacked]>:last-child::part(button){border-end-end-radius:calc(var(--cds-aichat-rounded-modifier-radius-end-end, var(--cds-aichat-rounded-modifier-radius)) - .0625rem);border-end-start-radius:calc(var(--cds-aichat-rounded-modifier-radius-end-start, var(--cds-aichat-rounded-modifier-radius)) - .0625rem)}:host([data-rounded=bottom-right][data-stacked])>:last-child,[data-rounded=bottom-right][data-stacked]>:last-child{border-end-end-radius:calc(var(--cds-aichat-rounded-modifier-radius-end-end, var(--cds-aichat-rounded-modifier-radius)) - .0625rem)}:host([data-rounded=bottom-right][data-stacked])>:last-child::part(button),[data-rounded=bottom-right][data-stacked]>:last-child::part(button){border-end-end-radius:calc(var(--cds-aichat-rounded-modifier-radius-end-end, var(--cds-aichat-rounded-modifier-radius)) - .0625rem)}:host([data-rounded=bottom-left][data-stacked])>:last-child,[data-rounded=bottom-left][data-stacked]>:last-child{border-end-start-radius:calc(var(--cds-aichat-rounded-modifier-radius-end-start, var(--cds-aichat-rounded-modifier-radius)) - .0625rem)}:host([data-rounded=bottom-left][data-stacked])>:last-child::part(button),[data-rounded=bottom-left][data-stacked]>:last-child::part(button){border-end-start-radius:calc(var(--cds-aichat-rounded-modifier-radius-end-start, var(--cds-aichat-rounded-modifier-radius)) - .0625rem)}:host(cds-aichat-workspace-shell-footer){--cds-aichat-rounded-modifier-radius:0.5rem;align-items:stretch;border-block-start:solid .0625rem var(--cds-border-subtle-00,#e0e0e0);display:grid;margin-block-start:auto}@media (max-width:41.98rem){:host(cds-aichat-workspace-shell-footer){grid-auto-flow:row;grid-template-columns:1fr}}:host(.cds-aichat-workspace-shell-footer__three-buttons){grid-template-columns:50% 25% 25%}@media (max-width:41.98rem){:host(.cds-aichat-workspace-shell-footer__three-buttons){grid-auto-flow:row;grid-template-columns:1fr}}:host(:not(.cds-aichat-workspace-shell-footer__three-buttons)){grid-template-columns:repeat(auto-fit,minmax(80px,auto))}@media (max-width:41.98rem){:host(:not(.cds-aichat-workspace-shell-footer__three-buttons)){grid-auto-flow:row;grid-template-columns:1fr}}"]);
+var styles = css([":host([data-rounded=\"\"]),[data-rounded=\"\"]{border-end-end-radius:calc(var(--cds-aichat-border-radius-end-end, var(--cds-aichat-border-radius)) - .0625rem);border-end-start-radius:calc(var(--cds-aichat-border-radius-end-start, var(--cds-aichat-border-radius)) - .0625rem);border-start-end-radius:calc(var(--cds-aichat-border-radius-start-end, var(--cds-aichat-border-radius)) - .0625rem);border-start-start-radius:calc(var(--cds-aichat-border-radius-start-start, var(--cds-aichat-border-radius)) - .0625rem)}:host([data-rounded=\"\"])::part(button),:host([data-rounded=\"\"])::part(link),[data-rounded=\"\"]::part(button),[data-rounded=\"\"]::part(link){border-end-end-radius:calc(var(--cds-aichat-border-radius-end-end, var(--cds-aichat-border-radius)) - .0625rem);border-end-start-radius:calc(var(--cds-aichat-border-radius-end-start, var(--cds-aichat-border-radius)) - .0625rem);border-start-end-radius:calc(var(--cds-aichat-border-radius-start-end, var(--cds-aichat-border-radius)) - .0625rem);border-start-start-radius:calc(var(--cds-aichat-border-radius-start-start, var(--cds-aichat-border-radius)) - .0625rem);outline-offset:-.0625rem}:host([data-rounded=\"\"])>:only-child,[data-rounded=\"\"]>:only-child{border-end-end-radius:calc(var(--cds-aichat-border-radius-end-end, var(--cds-aichat-border-radius)) - .0625rem);border-end-start-radius:calc(var(--cds-aichat-border-radius-end-start, var(--cds-aichat-border-radius)) - .0625rem);border-start-end-radius:calc(var(--cds-aichat-border-radius-start-end, var(--cds-aichat-border-radius)) - .0625rem);border-start-start-radius:calc(var(--cds-aichat-border-radius-start-start, var(--cds-aichat-border-radius)) - .0625rem)}:host([data-rounded=top]),[data-rounded=top]{border-start-end-radius:calc(var(--cds-aichat-border-radius-start-end, var(--cds-aichat-border-radius)) - .0625rem);border-start-start-radius:calc(var(--cds-aichat-border-radius-start-start, var(--cds-aichat-border-radius)) - .0625rem)}:host([data-rounded=top-left]),[data-rounded=top-left]{border-start-start-radius:calc(var(--cds-aichat-border-radius-start-start, var(--cds-aichat-border-radius)) - .0625rem)}:host([data-rounded=top-right]),[data-rounded=top-right]{border-start-end-radius:calc(var(--cds-aichat-border-radius-start-end, var(--cds-aichat-border-radius)) - .0625rem)}:host([data-rounded=bottom]),[data-rounded=bottom]{border-end-end-radius:calc(var(--cds-aichat-border-radius-end-end, var(--cds-aichat-border-radius)) - .0625rem);border-end-start-radius:calc(var(--cds-aichat-border-radius-end-start, var(--cds-aichat-border-radius)) - .0625rem)}:host([data-rounded=bottom-left]),[data-rounded=bottom-left]{border-end-start-radius:calc(var(--cds-aichat-border-radius-end-start, var(--cds-aichat-border-radius)) - .0625rem)}:host([data-rounded=bottom-right]),[data-rounded=bottom-right]{border-end-end-radius:calc(var(--cds-aichat-border-radius-end-end, var(--cds-aichat-border-radius)) - .0625rem)}:host([data-rounded=top]:not([data-stacked]))>:first-child,[data-rounded=top]:not([data-stacked])>:first-child{border-start-start-radius:calc(var(--cds-aichat-border-radius-start-start, var(--cds-aichat-border-radius)) - .0625rem)}:host([data-rounded=top]:not([data-stacked]))>:first-child::part(button),[data-rounded=top]:not([data-stacked])>:first-child::part(button){border-start-start-radius:calc(var(--cds-aichat-border-radius-start-start, var(--cds-aichat-border-radius)) - .0625rem)}:host([data-rounded=top]:not([data-stacked]))>:last-child,[data-rounded=top]:not([data-stacked])>:last-child{border-start-end-radius:calc(var(--cds-aichat-border-radius-start-end, var(--cds-aichat-border-radius)) - .0625rem)}:host([data-rounded=top]:not([data-stacked]))>:last-child::part(button),[data-rounded=top]:not([data-stacked])>:last-child::part(button){border-start-end-radius:calc(var(--cds-aichat-border-radius-start-end, var(--cds-aichat-border-radius)) - .0625rem)}:host([data-rounded=top-left]:not([data-stacked]))>:first-child,[data-rounded=top-left]:not([data-stacked])>:first-child{border-start-start-radius:calc(var(--cds-aichat-border-radius-start-start, var(--cds-aichat-border-radius)) - .0625rem)}:host([data-rounded=top-left]:not([data-stacked]))>:first-child::part(button),[data-rounded=top-left]:not([data-stacked])>:first-child::part(button){border-start-start-radius:calc(var(--cds-aichat-border-radius-start-start, var(--cds-aichat-border-radius)) - .0625rem)}:host([data-rounded=top-right]:not([data-stacked]))>:last-child,[data-rounded=top-right]:not([data-stacked])>:last-child{border-start-end-radius:calc(var(--cds-aichat-border-radius-start-end, var(--cds-aichat-border-radius)) - .0625rem)}:host([data-rounded=top-right]:not([data-stacked]))>:last-child::part(button),[data-rounded=top-right]:not([data-stacked])>:last-child::part(button){border-start-end-radius:calc(var(--cds-aichat-border-radius-start-end, var(--cds-aichat-border-radius)) - .0625rem)}:host([data-rounded=bottom]:not([data-stacked]))>:first-child,[data-rounded=bottom]:not([data-stacked])>:first-child{border-end-start-radius:calc(var(--cds-aichat-border-radius-end-start, var(--cds-aichat-border-radius)) - .0625rem)}:host([data-rounded=bottom]:not([data-stacked]))>:first-child::part(button),[data-rounded=bottom]:not([data-stacked])>:first-child::part(button){border-end-start-radius:calc(var(--cds-aichat-border-radius-end-start, var(--cds-aichat-border-radius)) - .0625rem)}:host([data-rounded=bottom]:not([data-stacked]))>:last-child,[data-rounded=bottom]:not([data-stacked])>:last-child{border-end-end-radius:calc(var(--cds-aichat-border-radius-end-end, var(--cds-aichat-border-radius)) - .0625rem)}:host([data-rounded=bottom]:not([data-stacked]))>:last-child::part(button),[data-rounded=bottom]:not([data-stacked])>:last-child::part(button){border-end-end-radius:calc(var(--cds-aichat-border-radius-end-end, var(--cds-aichat-border-radius)) - .0625rem)}:host([data-rounded=bottom-left]:not([data-stacked]))>:first-child,[data-rounded=bottom-left]:not([data-stacked])>:first-child{border-end-start-radius:calc(var(--cds-aichat-border-radius-end-start, var(--cds-aichat-border-radius)) - .0625rem)}:host([data-rounded=bottom-left]:not([data-stacked]))>:first-child::part(button),[data-rounded=bottom-left]:not([data-stacked])>:first-child::part(button){border-end-start-radius:calc(var(--cds-aichat-border-radius-end-start, var(--cds-aichat-border-radius)) - .0625rem)}:host([data-rounded=bottom-right]:not([data-stacked]))>:last-child,[data-rounded=bottom-right]:not([data-stacked])>:last-child{border-end-end-radius:calc(var(--cds-aichat-border-radius-end-end, var(--cds-aichat-border-radius)) - .0625rem)}:host([data-rounded=bottom-right]:not([data-stacked]))>:last-child::part(button),[data-rounded=bottom-right]:not([data-stacked])>:last-child::part(button){border-end-end-radius:calc(var(--cds-aichat-border-radius-end-end, var(--cds-aichat-border-radius)) - .0625rem)}:host([data-rounded=top][data-stacked])>:first-child,[data-rounded=top][data-stacked]>:first-child{border-start-end-radius:calc(var(--cds-aichat-border-radius-start-end, var(--cds-aichat-border-radius)) - .0625rem);border-start-start-radius:calc(var(--cds-aichat-border-radius-start-start, var(--cds-aichat-border-radius)) - .0625rem)}:host([data-rounded=top][data-stacked])>:first-child::part(button),[data-rounded=top][data-stacked]>:first-child::part(button){border-start-end-radius:calc(var(--cds-aichat-border-radius-start-end, var(--cds-aichat-border-radius)) - .0625rem);border-start-start-radius:calc(var(--cds-aichat-border-radius-start-start, var(--cds-aichat-border-radius)) - .0625rem)}:host([data-rounded=top-right][data-stacked])>:first-child,[data-rounded=top-right][data-stacked]>:first-child{border-start-end-radius:calc(var(--cds-aichat-border-radius-start-end, var(--cds-aichat-border-radius)) - .0625rem)}:host([data-rounded=top-right][data-stacked])>:first-child::part(button),[data-rounded=top-right][data-stacked]>:first-child::part(button){border-start-end-radius:calc(var(--cds-aichat-border-radius-start-end, var(--cds-aichat-border-radius)) - .0625rem)}:host([data-rounded=top-left][data-stacked])>:first-child,[data-rounded=top-left][data-stacked]>:first-child{border-start-start-radius:calc(var(--cds-aichat-border-radius-start-start, var(--cds-aichat-border-radius)) - .0625rem)}:host([data-rounded=top-left][data-stacked])>:first-child::part(button),[data-rounded=top-left][data-stacked]>:first-child::part(button){border-start-start-radius:calc(var(--cds-aichat-border-radius-start-start, var(--cds-aichat-border-radius)) - .0625rem)}:host([data-rounded=bottom][data-stacked])>:last-child,[data-rounded=bottom][data-stacked]>:last-child{border-end-end-radius:calc(var(--cds-aichat-border-radius-end-end, var(--cds-aichat-border-radius)) - .0625rem);border-end-start-radius:calc(var(--cds-aichat-border-radius-end-start, var(--cds-aichat-border-radius)) - .0625rem)}:host([data-rounded=bottom][data-stacked])>:last-child::part(button),[data-rounded=bottom][data-stacked]>:last-child::part(button){border-end-end-radius:calc(var(--cds-aichat-border-radius-end-end, var(--cds-aichat-border-radius)) - .0625rem);border-end-start-radius:calc(var(--cds-aichat-border-radius-end-start, var(--cds-aichat-border-radius)) - .0625rem)}:host([data-rounded=bottom-right][data-stacked])>:last-child,[data-rounded=bottom-right][data-stacked]>:last-child{border-end-end-radius:calc(var(--cds-aichat-border-radius-end-end, var(--cds-aichat-border-radius)) - .0625rem)}:host([data-rounded=bottom-right][data-stacked])>:last-child::part(button),[data-rounded=bottom-right][data-stacked]>:last-child::part(button){border-end-end-radius:calc(var(--cds-aichat-border-radius-end-end, var(--cds-aichat-border-radius)) - .0625rem)}:host([data-rounded=bottom-left][data-stacked])>:last-child,[data-rounded=bottom-left][data-stacked]>:last-child{border-end-start-radius:calc(var(--cds-aichat-border-radius-end-start, var(--cds-aichat-border-radius)) - .0625rem)}:host([data-rounded=bottom-left][data-stacked])>:last-child::part(button),[data-rounded=bottom-left][data-stacked]>:last-child::part(button){border-end-start-radius:calc(var(--cds-aichat-border-radius-end-start, var(--cds-aichat-border-radius)) - .0625rem)}:host([data-stacked]),[data-stacked]{display:flex;flex-direction:column}:host(cds-aichat-workspace-shell-footer){align-items:stretch;border-block-start:solid .0625rem var(--cds-border-subtle-00,#e0e0e0);container-type:inline-size;display:grid;margin-block-start:auto}:host(.cds-aichat-workspace-shell-footer__three-buttons){grid-template-columns:50% 25% 25%}:host(:not(.cds-aichat-workspace-shell-footer__three-buttons)){grid-template-columns:repeat(auto-fit,minmax(80px,auto))}@container (max-width: 671px){:host(cds-aichat-workspace-shell-footer){grid-auto-flow:row;grid-template-columns:1fr}:host(.cds-aichat-workspace-shell-footer__three-buttons){grid-template-columns:repeat(3,1fr)}}"]);
 
 export { styles as default };
 //# sourceMappingURL=workspace-shell-footer.scss.js.map

package/es/components/workspace-shell/src/workspace-shell-header.d.ts

@@ -1,4 +1,5 @@
 import { LitElement } from "lit";
+import "../../truncated-text/index.js";
 /**
  * Workspace Shell Header.
  *
@@ -7,9 +8,10 @@ import { LitElement } from "lit";
  * @slot header-description - Represents the description area in the Header.
  * @slot header-action - Represents the action area in the workspace.
  *
+ * @fires workspace-header-toggle - Fired when the details element is toggled
  */
 declare class CDSAIChatWorkspaceShellHeader extends LitElement {
-    static styles: any;
+    static styles: any[];
     /**
      * Sets default slot value to toolbar
      */
@@ -22,6 +24,14 @@ declare class CDSAIChatWorkspaceShellHeader extends LitElement {
      * Sets the subTitle text for the Toolbar Component
      */
     subTitleText: any;
+    /**
+     * Controls whether the header can be collapsed/expanded.
+     * When true, header starts collapsed and can be toggled.
+     * When false, header is always fully expanded.
+     */
+    collapsible: boolean;
+    firstUpdated(): void;
+    disconnectedCallback(): void;
     render(): import("lit-html").TemplateResult<1>;
 }
 export { CDSAIChatWorkspaceShellHeader };

package/es/components/workspace-shell/src/workspace-shell-header.js

@@ -7,10 +7,14 @@
 
 import { __decorate } from 'tslib';
 import { LitElement, html } from 'lit';
-import { property } from 'lit/decorators.js';
+import { property, query } from 'lit/decorators.js';
 import { carbonElement } from '../../../globals/decorators/carbon-element.js';
 import prefix from '../../../globals/settings.js';
+import commonStyles from '../../../globals/scss/common.scss.js';
 import styles from './workspace-shell-header.scss.js';
+import { iconLoader } from '@carbon/web-components/es/globals/internal/icon-loader.js';
+import ChevronDown16 from '@carbon/icons/es/chevron--down/16.js';
+import '../../truncated-text/src/truncated-text.js';
 
 /*
  *  Copyright IBM Corp. 2025
@@ -28,6 +32,7 @@ import styles from './workspace-shell-header.scss.js';
  * @slot header-description - Represents the description area in the Header.
  * @slot header-action - Represents the action area in the workspace.
  *
+ * @fires workspace-header-toggle - Fired when the details element is toggled
  */
 let CDSAIChatWorkspaceShellHeader = class CDSAIChatWorkspaceShellHeader extends LitElement {
     constructor() {
@@ -36,30 +41,93 @@ let CDSAIChatWorkspaceShellHeader = class CDSAIChatWorkspaceShellHeader extends
          * Sets default slot value to toolbar
          */
         this.slot = "header";
+        /**
+         * Controls whether the header can be collapsed/expanded.
+         * When true, header starts collapsed and can be toggled.
+         * When false, header is always fully expanded.
+         */
+        this.collapsible = false;
+        /**
+         * @internal
+         */
+        this._handleToggle = () => {
+            const isOpen = this._detailsElement?.open || false;
+            this.dispatchEvent(new CustomEvent("workspace-header-toggle", {
+                detail: { open: isOpen },
+                bubbles: true,
+                composed: true,
+            }));
+        };
+    }
+    firstUpdated() {
+        if (this.collapsible && this._detailsElement) {
+            this._detailsElement.addEventListener("toggle", this._handleToggle);
+        }
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        if (this._detailsElement) {
+            this._detailsElement.removeEventListener("toggle", this._handleToggle);
+        }
     }
     render() {
-        const { titleText, subTitleText } = this;
+        const { titleText, subTitleText, collapsible } = this;
+        const headerContent = html `
+      ${subTitleText &&
+            html `
+        <h3 class="${prefix}-workspace-shell__header-sub-title">
+          ${subTitleText}
+        </h3>
+      `}
+      <slot name="header-description"></slot>
+      <slot name="header-action"></slot>
+    `;
+        if (collapsible) {
+            // Collapsible mode: starts closed, can be toggled
+            return html `
+        <details
+          class="${prefix}-workspace-shell__header-details ${prefix}-workspace-shell__header-content"
+        >
+          ${titleText &&
+                html `
+            <summary class="${prefix}-workspace-shell__header-summary">
+              <h1 class="${prefix}-workspace-shell__header-title">
+                <cds-aichat-truncated-text
+                  value=${titleText}
+                  lines="1"
+                  type="tooltip"
+                ></cds-aichat-truncated-text>
+              </h1>
+              <span class="${prefix}-workspace-shell__header-chevron">
+                ${iconLoader(ChevronDown16)}
+              </span>
+            </summary>
+          `}
+          <div class="${prefix}-workspace-shell__header-content">
+            ${headerContent}
+          </div>
+        </details>
+      `;
+        }
+        // Non-collapsible: render without details/summary
         return html `
       <div class="${prefix}-workspace-shell__header-content">
         ${titleText &&
             html `
-          <h1 class="${prefix}-workspace-shell__header-title">${titleText}</h1>
-        `}
-        ${subTitleText &&
-            html `
-          <h3 class="${prefix}-workspace-shell__header-sub-title">
-            ${subTitleText}
-          </h3>
+          <h1 class="${prefix}-workspace-shell__header-title">
+            <cds-aichat-truncated-text
+              value=${titleText}
+              lines="1"
+              type="tooltip"
+            ></cds-aichat-truncated-text>
+          </h1>
         `}
-        <slot name="header-description"></slot>
-      </div>
-      <div class="${prefix}-workspace-shell__header-action">
-        <slot name="header-action"></slot>
+        ${headerContent}
       </div>
     `;
     }
 };
-CDSAIChatWorkspaceShellHeader.styles = styles;
+CDSAIChatWorkspaceShellHeader.styles = [commonStyles, styles];
 __decorate([
     property({ type: String, reflect: true })
 ], CDSAIChatWorkspaceShellHeader.prototype, "slot", void 0);
@@ -69,6 +137,12 @@ __decorate([
 __decorate([
     property({ type: String, attribute: "subtitle-text" })
 ], CDSAIChatWorkspaceShellHeader.prototype, "subTitleText", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], CDSAIChatWorkspaceShellHeader.prototype, "collapsible", void 0);
+__decorate([
+    query("details")
+], CDSAIChatWorkspaceShellHeader.prototype, "_detailsElement", void 0);
 CDSAIChatWorkspaceShellHeader = __decorate([
     carbonElement(`${prefix}-workspace-shell-header`)
 ], CDSAIChatWorkspaceShellHeader);

package/es/components/workspace-shell/src/workspace-shell-header.js.map

@@ -1 +1 @@
-{"version":3,"file":"workspace-shell-header.js","sources":["../../../../src/components/workspace-shell/src/workspace-shell-header.ts"],"sourcesContent":[null],"names":[],"mappings":";;;;;;;;;;;;;;AAAA;;;;;;;AAOG;AAQH;;;;;;;;AAQG;AAEH,IAAM,6BAA6B,GAAnC,MAAM,6BAA8B,SAAQ,UAAU,CAAA;AAAtD,IAAA,WAAA,GAAA;;AAGE;;AAEG;QAEH,IAAA,CAAA,IAAI,GAAG,QAAQ;IAmCjB;IArBE,MAAM,GAAA;AACJ,QAAA,MAAM,EAAE,SAAS,EAAE,YAAY,EAAE,GAAG,IAAI;AACxC,QAAA,OAAO,IAAI,CAAA;oBACK,MAAM,CAAA;UAChB,SAAS;AACX,YAAA,IAAI,CAAA;AACW,qBAAA,EAAA,MAAM,mCAAmC,SAAS,CAAA;AAChE,QAAA,CAAA;UACC,YAAY;AACd,YAAA,IAAI,CAAA;uBACW,MAAM,CAAA;cACf,YAAY;;AAEjB,QAAA,CAAA;;;oBAGW,MAAM,CAAA;;;KAGrB;IACH;;AAxCO,6BAAA,CAAA,MAAM,GAAG,MAAH;AAMb,UAAA,CAAA;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE;AACzB,CAAA,EAAA,6BAAA,CAAA,SAAA,EAAA,MAAA,EAAA,MAAA,CAAA;AAMhB,UAAA,CAAA;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,YAAY,EAAE;AACzC,CAAA,EAAA,6BAAA,CAAA,SAAA,EAAA,WAAA,EAAA,MAAA,CAAA;AAMV,UAAA,CAAA;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,eAAe,EAAE;AACzC,CAAA,EAAA,6BAAA,CAAA,SAAA,EAAA,cAAA,EAAA,MAAA,CAAA;AAnBT,6BAA6B,GAAA,UAAA,CAAA;AADlC,IAAA,aAAa,CAAC,CAAA,EAAG,MAAM,CAAA,uBAAA,CAAyB;AAC3C,CAAA,EAAA,6BAA6B,CA0ClC;AAGD,sCAAe,6BAA6B;;;;"}
+{"version":3,"file":"workspace-shell-header.js","sources":["../../../../src/components/workspace-shell/src/workspace-shell-header.ts"],"sourcesContent":[null],"names":[],"mappings":"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"}

package/es/components/workspace-shell/src/workspace-shell-header.scss.js

@@ -7,7 +7,7 @@
 
 import { css } from 'lit';
 
-var styles = css(["a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{font-feature-settings:\"liga\" 1;border:0;font:inherit;font-size:100%;margin:0;padding:0;vertical-align:baseline}button,input,select,textarea{border-radius:0;font-family:inherit}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{background-color:var(--cds-background,#fff);color:var(--cds-text-primary,#161616);line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:none}table{border-collapse:collapse;border-spacing:0}html{box-sizing:border-box}*,:after,:before{box-sizing:inherit}html{font-size:100%}body{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:IBM Plex Sans,system-ui,-apple-system,BlinkMacSystemFont,\\.SFNSText-Regular,sans-serif;font-weight:400;text-rendering:optimizeLegibility}code{font-family:IBM Plex Mono,system-ui,-apple-system,BlinkMacSystemFont,\\.SFNSText-Regular,monospace}strong{font-weight:600}@media screen and (-ms-high-contrast:active){svg{fill:ButtonText}}h1{font-size:var(--cds-heading-06-font-size,2.625rem);font-weight:var(--cds-heading-06-font-weight,300);letter-spacing:var(--cds-heading-06-letter-spacing,0);line-height:var(--cds-heading-06-line-height,1.199)}h2{font-size:var(--cds-heading-05-font-size,2rem);font-weight:var(--cds-heading-05-font-weight,400);letter-spacing:var(--cds-heading-05-letter-spacing,0);line-height:var(--cds-heading-05-line-height,1.25)}h3{font-size:var(--cds-heading-04-font-size,1.75rem);font-weight:var(--cds-heading-04-font-weight,400);letter-spacing:var(--cds-heading-04-letter-spacing,0);line-height:var(--cds-heading-04-line-height,1.28572)}h4{font-size:var(--cds-heading-03-font-size,1.25rem);font-weight:var(--cds-heading-03-font-weight,400);letter-spacing:var(--cds-heading-03-letter-spacing,0);line-height:var(--cds-heading-03-line-height,1.4)}h5{font-size:var(--cds-heading-02-font-size,1rem);font-weight:var(--cds-heading-02-font-weight,600);letter-spacing:var(--cds-heading-02-letter-spacing,0);line-height:var(--cds-heading-02-line-height,1.5)}h6{font-size:var(--cds-heading-01-font-size,.875rem);font-weight:var(--cds-heading-01-font-weight,600);letter-spacing:var(--cds-heading-01-letter-spacing,.16px);line-height:var(--cds-heading-01-line-height,1.42857)}p{font-size:var(--cds-body-02-font-size,1rem);font-weight:var(--cds-body-02-font-weight,400);letter-spacing:var(--cds-body-02-letter-spacing,0);line-height:var(--cds-body-02-line-height,1.5)}a{color:var(--cds-link-primary,#0062fe)}em{font-style:italic}:host(cds-aichat-workspace-shell-header){align-items:baseline;border-block-end:solid .0625rem var(--cds-chat-bubble-border,#e0e0e0);color:var(--cds-text-secondary,#525252);display:grid;font-size:var(--cds-body-01-font-size,.875rem);font-weight:var(--cds-body-01-font-weight,400);grid-auto-flow:column;letter-spacing:var(--cds-body-01-letter-spacing,.16px);line-height:var(--cds-body-01-line-height,1.42857);overflow-x:hidden;overflow-y:auto;padding:1.5rem 2rem}@media (max-width:41.98rem){:host(cds-aichat-workspace-shell-header){gap:16px;grid-auto-flow:row}}.cds-aichat-workspace-shell__header-content{display:grid;gap:1rem}.cds-aichat-workspace-shell__header-title{color:var(--cds-text-primary,#161616);font-size:var(--cds-heading-04-font-size,1.75rem);font-weight:var(--cds-heading-04-font-weight,400);letter-spacing:var(--cds-heading-04-letter-spacing,0);line-height:var(--cds-heading-04-line-height,1.28572);margin-block-end:-.875rem}.cds-aichat-workspace-shell__header-sub-title{color:var(--cds-text-secondary,#525252);font-size:var(--cds-label-01-font-size,.75rem);font-weight:var(--cds-label-01-font-weight,400);letter-spacing:var(--cds-label-01-letter-spacing,.32px);line-height:var(--cds-label-01-line-height,1.33333)}"]);
+var styles = css([":host(cds-aichat-workspace-shell-header){border-block-end:solid .0625rem var(--cds-chat-bubble-border,#e0e0e0);color:var(--cds-text-secondary,#525252);font-size:var(--cds-body-01-font-size,.875rem);font-weight:var(--cds-body-01-font-weight,400);letter-spacing:var(--cds-body-01-letter-spacing,.16px);line-height:var(--cds-body-01-line-height,1.42857);padding:1.5rem 2rem}@media (max-width:41.98rem){:host(cds-aichat-workspace-shell-header){gap:16px;grid-auto-flow:row}}:host(cds-aichat-workspace-shell-header) ::marker{content:\"\"}:host(cds-aichat-workspace-shell-header) ::-webkit-details-marker{display:none}.cds-aichat-workspace-shell__header-details{cursor:pointer}.cds-aichat-workspace-shell__header-details:open{overflow:auto}.cds-aichat-workspace-shell__header-details:open .cds-aichat-workspace-shell__header-chevron{transform:rotate(180deg)}.cds-aichat-workspace-shell__header-content{display:flex;flex-direction:column;gap:1rem}.cds-aichat-workspace-shell__header-title{color:var(--cds-text-primary,#161616);font-size:var(--cds-heading-04-font-size,1.75rem);font-weight:var(--cds-heading-04-font-weight,400);letter-spacing:var(--cds-heading-04-letter-spacing,0);line-height:var(--cds-heading-04-line-height,1.28572)}.cds-aichat-workspace-shell__header-sub-title{color:var(--cds-text-secondary,#525252);font-size:var(--cds-label-01-font-size,.75rem);font-weight:var(--cds-label-01-font-weight,400);letter-spacing:var(--cds-label-01-letter-spacing,.32px);line-height:var(--cds-label-01-line-height,1.33333);margin-block-start:-.875rem}.cds-aichat-workspace-shell__header-summary{align-items:baseline;display:flex;justify-content:space-between}"]);
 
 export { styles as default };
 //# sourceMappingURL=workspace-shell-header.scss.js.map