@govtechsg/sgds-web-component 3.15.1-rc.2 → 3.16.0

package/components/Sidebar/sidebar-element.d.ts

@@ -1,112 +0,0 @@
-import { PropertyValueMap } from "lit";
-import SgdsElement from "../../base/sgds-element";
-/**
- * @summary Base class for sidebar navigation components.
- * Provides core functionality for sidebar items and groups including keyboard navigation,
- * selection state management, and nesting support. This class manages hierarchical navigation,
- * active state tracking, and drawer overlay coordination through context providers.
- *
- * Features:
- * - Multi-level keyboard navigation (Arrow keys, Enter)
- * - Active state management via Lit context subscription
- * - Support for nested hierarchies up to 3 levels deep
- * - Focus management and full ARIA attribute support
- * - Event emission for sidebar coordination (i-sgds-click)
- * - Automatic child element tracking and nesting level detection
- *
- * Keyboard Navigation:
- * - Arrow Up/Down: Navigate between siblings in the same level
- * - Arrow Left/Right: Navigate hierarchically (collapse/expand or move in drawer)
- * - Enter: Activate focused item or toggle group
- *
- * Context Management:
- * - Consumes: SidebarCollapsed, SidebarActiveItem, SidebarActiveGroup, SidebarDrawerItems
- * - Updates state based on context changes for responsive UI updates
- *
- * @internal
- */
-export declare class SidebarElement extends SgdsElement {
-    static styles: import("lit").CSSResult[];
-    /**
-     * The display title/label for the sidebar element.
-     * Shown in the UI and used for accessibility labels (aria-label).
-     * @attribute title
-     * @type {string}
-     * @default ""
-     */
-    title: string;
-    /**
-     * The unique name identifier for the sidebar element.
-     * Used to identify selections in sgds-select events and manage active states.
-     * Should be unique among siblings in the same navigation level.
-     * @attribute name
-     * @type {string}
-     * @default ""
-     */
-    name: string;
-    /** @internal */
-    _sidebarCollapsed: boolean;
-    /** @internal */
-    _sidebarActiveItem: SidebarElement | null;
-    /** @internal */
-    _sidebarActiveGroup: SidebarElement | null;
-    /** @internal */
-    _drawerItems: SidebarElement[] | null;
-    /** @internal Tracks whether a drawer overlay is currently open */
-    _showDrawer: boolean;
-    /** @internal */
-    _childLevel: number;
-    /**
-     * Indicates whether this element is currently selected/active.
-     * @internal
-     */
-    _selected: boolean;
-    /**
-     * Indicates whether this element should be hidden based on nesting context.
-     * @internal
-     */
-    _hidden: boolean;
-    /**
-     * List of child elements assigned to this component.
-     * @internal
-     */
-    _childElements: SidebarElement[];
-    /** @internal */
-    _childActive: boolean;
-    /** @internal */
-    private _defaultNodes;
-    connectedCallback(): void;
-    disconnectedCallback(): void;
-    firstUpdated(changedProperties: PropertyValueMap<this>): void;
-    updated(): void;
-    /**
-     * Handles slot change events and updates child elements list.
-     * @internal
-     * @returns {void}
-     */
-    _handleSlotChange(): void;
-    /**
-     * Handles click/activation events on the sidebar element.
-     * Emits internal click event for parent sidebar to handle selection.
-     * @internal
-     * @param {SidebarElement} [element] - Optional element parameter (for keyboard compatibility)
-     * @returns {void}
-     */
-    protected _handleClick(): void;
-    /**
-     * Handles keyboard navigation events for sidebar elements.
-     * Supports Arrow Up/Down for navigation and Arrow Left/Right for drawer management.
-     * @internal
-     * @param {KeyboardEvent} event - The keyboard event object
-     * @returns {void}
-     */
-    private _handleKeyDown;
-    /**
-     * Calculates the nesting level by counting parent sgds-sidebar-group ancestors.
-     * Level 1 = top-level element, Level 2+ = nested within another group.
-     * Updates the _childLevel state property.
-     * @internal
-     * @returns {void}
-     */
-    private getChildLevel;
-}

package/components/Sidebar/sidebar-element.js

@@ -1,280 +0,0 @@
-import { __decorate } from 'tslib';
-import { property, state, queryAssignedElements } from 'lit/decorators.js';
-import { DropdownElement } from '../../base/dropdown-element.js';
-import SgdsElement from '../../base/sgds-element.js';
-import { consume } from '@lit/context';
-import { SidebarCollapsed, SidebarActiveItem, SidebarActiveGroup, SidebarDrawerItems, SidebarDrawerOpen } from './sidebar-context.js';
-
-const ARROW_DOWN = "ArrowDown";
-const ARROW_UP = "ArrowUp";
-const ARROW_LEFT = "ArrowLeft";
-const ARROW_RIGHT = "ArrowRight";
-const ENTER = "Enter";
-/**
- * @summary Base class for sidebar navigation components.
- * Provides core functionality for sidebar items and groups including keyboard navigation,
- * selection state management, and nesting support. This class manages hierarchical navigation,
- * active state tracking, and drawer overlay coordination through context providers.
- *
- * Features:
- * - Multi-level keyboard navigation (Arrow keys, Enter)
- * - Active state management via Lit context subscription
- * - Support for nested hierarchies up to 3 levels deep
- * - Focus management and full ARIA attribute support
- * - Event emission for sidebar coordination (i-sgds-click)
- * - Automatic child element tracking and nesting level detection
- *
- * Keyboard Navigation:
- * - Arrow Up/Down: Navigate between siblings in the same level
- * - Arrow Left/Right: Navigate hierarchically (collapse/expand or move in drawer)
- * - Enter: Activate focused item or toggle group
- *
- * Context Management:
- * - Consumes: SidebarCollapsed, SidebarActiveItem, SidebarActiveGroup, SidebarDrawerItems
- * - Updates state based on context changes for responsive UI updates
- *
- * @internal
- */
-class SidebarElement extends SgdsElement {
-    constructor() {
-        super(...arguments);
-        /**
-         * The display title/label for the sidebar element.
-         * Shown in the UI and used for accessibility labels (aria-label).
-         * @attribute title
-         * @type {string}
-         * @default ""
-         */
-        this.title = "";
-        /**
-         * The unique name identifier for the sidebar element.
-         * Used to identify selections in sgds-select events and manage active states.
-         * Should be unique among siblings in the same navigation level.
-         * @attribute name
-         * @type {string}
-         * @default ""
-         */
-        this.name = "";
-        /** @internal */
-        this._sidebarCollapsed = false;
-        /** @internal */
-        this._sidebarActiveItem = null;
-        /** @internal */
-        this._sidebarActiveGroup = null;
-        /** @internal */
-        this._drawerItems = null;
-        /** @internal Tracks whether a drawer overlay is currently open */
-        this._showDrawer = false;
-        /** @internal */
-        this._childLevel = 1;
-        /**
-         * Indicates whether this element is currently selected/active.
-         * @internal
-         */
-        this._selected = false;
-        /**
-         * Indicates whether this element should be hidden based on nesting context.
-         * @internal
-         */
-        this._hidden = false;
-        /**
-         * List of child elements assigned to this component.
-         * @internal
-         */
-        this._childElements = [];
-        /** @internal */
-        this._childActive = false;
-    }
-    connectedCallback() {
-        super.connectedCallback();
-        this.getChildLevel();
-        this.setAttribute("role", "navigation");
-        this.addEventListener("keydown", this._handleKeyDown);
-    }
-    disconnectedCallback() {
-        super.disconnectedCallback();
-        this.removeEventListener("keydown", this._handleKeyDown);
-    }
-    firstUpdated(changedProperties) {
-        super.firstUpdated(changedProperties);
-        this.getChildLevel();
-    }
-    updated() {
-        if (this._childLevel === 2) {
-            this._hidden = !this.closest(".sidebar-nested-overlay");
-        }
-    }
-    /**
-     * Handles slot change events and updates child elements list.
-     * @internal
-     * @returns {void}
-     */
-    _handleSlotChange() {
-        this._childElements = this._defaultNodes;
-    }
-    /**
-     * Handles click/activation events on the sidebar element.
-     * Emits internal click event for parent sidebar to handle selection.
-     * @internal
-     * @param {SidebarElement} [element] - Optional element parameter (for keyboard compatibility)
-     * @returns {void}
-     */
-    _handleClick() {
-        this.emit("i-sgds-click", { detail: { element: this, level: this._childLevel } });
-    }
-    /**
-     * Handles keyboard navigation events for sidebar elements.
-     * Supports Arrow Up/Down for navigation and Arrow Left/Right for drawer management.
-     * @internal
-     * @param {KeyboardEvent} event - The keyboard event object
-     * @returns {void}
-     */
-    _handleKeyDown(event) {
-        var _a, _b, _c;
-        const target = event.target;
-        switch (event.key) {
-            case ENTER: {
-                event.preventDefault();
-                event.stopPropagation();
-                if (event.target === this)
-                    this._handleClick();
-                return;
-            }
-            case ARROW_DOWN: {
-                event.preventDefault();
-                event.stopPropagation();
-                const child = target._childElements[0];
-                const isChildHidden = child === null || child === void 0 ? void 0 : child._hidden;
-                const childElement = !isChildHidden ? child : null;
-                const nextElement = childElement || target.nextElementSibling || target.parentElement.nextElementSibling;
-                if (nextElement === null || nextElement === void 0 ? void 0 : nextElement.shadowRoot) {
-                    const focusTarget = nextElement.shadowRoot.querySelector("[tabindex]");
-                    focusTarget === null || focusTarget === void 0 ? void 0 : focusTarget.focus();
-                }
-                return;
-            }
-            case ARROW_UP: {
-                event.preventDefault();
-                event.stopPropagation();
-                const prevSiblingChildren = (_a = target.previousElementSibling) === null || _a === void 0 ? void 0 : _a._childElements;
-                const lastChild = prevSiblingChildren ? prevSiblingChildren[(prevSiblingChildren === null || prevSiblingChildren === void 0 ? void 0 : prevSiblingChildren.length) - 1] : null;
-                const isChildHidden = lastChild === null || lastChild === void 0 ? void 0 : lastChild._hidden;
-                const childElement = !isChildHidden ? lastChild : null;
-                const prevElement = childElement || target.previousElementSibling || target.parentElement;
-                if (prevElement === null || prevElement === void 0 ? void 0 : prevElement.shadowRoot) {
-                    const focusTarget = prevElement.shadowRoot.querySelector("[tabindex]");
-                    focusTarget === null || focusTarget === void 0 ? void 0 : focusTarget.focus();
-                }
-                return;
-            }
-            case ARROW_LEFT: {
-                event.preventDefault();
-                event.stopPropagation();
-                if (this._sidebarActiveGroup === this) {
-                    // when drawer is open, close it
-                    if (this._showDrawer)
-                        this._handleClick();
-                }
-                else {
-                    // check if we are on the drawer, if so move back to parent
-                    const childLevel = target._childLevel;
-                    if (childLevel >= 2 && ((_b = this._sidebarActiveGroup) === null || _b === void 0 ? void 0 : _b.shadowRoot)) {
-                        const focusTarget = this._sidebarActiveGroup.shadowRoot.querySelector("[tabindex]");
-                        focusTarget === null || focusTarget === void 0 ? void 0 : focusTarget.focus();
-                    }
-                }
-                return;
-            }
-            case ARROW_RIGHT: {
-                event.preventDefault();
-                event.stopPropagation();
-                if (this._sidebarActiveGroup === this) {
-                    if ((_c = this._drawerItems) === null || _c === void 0 ? void 0 : _c.length) {
-                        if (this._showDrawer) {
-                            const drawerItem = this._drawerItems[0];
-                            if (drawerItem === null || drawerItem === void 0 ? void 0 : drawerItem.shadowRoot) {
-                                const focusTarget = drawerItem.shadowRoot.querySelector("[tabindex]");
-                                focusTarget === null || focusTarget === void 0 ? void 0 : focusTarget.focus();
-                            }
-                        }
-                        else {
-                            this._handleClick();
-                        }
-                    }
-                }
-                else {
-                    if (this._childLevel === 1 && this._childElements.length > 0) {
-                        // when there is nested, we trigger click to show drawer
-                        this._handleClick();
-                    }
-                }
-                return;
-            }
-        }
-    }
-    /**
-     * Calculates the nesting level by counting parent sgds-sidebar-group ancestors.
-     * Level 1 = top-level element, Level 2+ = nested within another group.
-     * Updates the _childLevel state property.
-     * @internal
-     * @returns {void}
-     */
-    getChildLevel() {
-        let currentEle = this.parentElement;
-        let level = 1;
-        while (currentEle.tagName.toLowerCase() === "sgds-sidebar-group") {
-            level += 1;
-            currentEle = currentEle.parentElement;
-        }
-        const isInDrawer = currentEle.classList.contains("sidebar-nested-overlay");
-        this._childLevel = isInDrawer ? level + 1 : level;
-    }
-}
-SidebarElement.styles = DropdownElement.styles;
-__decorate([
-    property({ type: String, reflect: true })
-], SidebarElement.prototype, "title", void 0);
-__decorate([
-    property({ type: String, reflect: true })
-], SidebarElement.prototype, "name", void 0);
-__decorate([
-    consume({ context: SidebarCollapsed, subscribe: true }),
-    state()
-], SidebarElement.prototype, "_sidebarCollapsed", void 0);
-__decorate([
-    consume({ context: SidebarActiveItem, subscribe: true }),
-    state()
-], SidebarElement.prototype, "_sidebarActiveItem", void 0);
-__decorate([
-    consume({ context: SidebarActiveGroup, subscribe: true }),
-    state()
-], SidebarElement.prototype, "_sidebarActiveGroup", void 0);
-__decorate([
-    consume({ context: SidebarDrawerItems, subscribe: true }),
-    state()
-], SidebarElement.prototype, "_drawerItems", void 0);
-__decorate([
-    consume({ context: SidebarDrawerOpen, subscribe: true }),
-    state()
-], SidebarElement.prototype, "_showDrawer", void 0);
-__decorate([
-    state()
-], SidebarElement.prototype, "_childLevel", void 0);
-__decorate([
-    state()
-], SidebarElement.prototype, "_selected", void 0);
-__decorate([
-    state()
-], SidebarElement.prototype, "_hidden", void 0);
-__decorate([
-    state()
-], SidebarElement.prototype, "_childElements", void 0);
-__decorate([
-    state()
-], SidebarElement.prototype, "_childActive", void 0);
-__decorate([
-    queryAssignedElements({ flatten: true })
-], SidebarElement.prototype, "_defaultNodes", void 0);
-
-export { SidebarElement };
-//# sourceMappingURL=sidebar-element.js.map

package/components/Sidebar/sidebar-element.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"sidebar-element.js","sources":["../../../src/components/Sidebar/sidebar-element.ts"],"sourcesContent":["import { property, queryAssignedElements, state } from \"lit/decorators.js\";\nimport { DropdownElement } from \"../../base/dropdown-element\";\nimport { PropertyValueMap } from \"lit\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport { consume } from \"@lit/context\";\nimport {\n  SidebarActiveGroup,\n  SidebarActiveItem,\n  SidebarCollapsed,\n  SidebarDrawerItems,\n  SidebarDrawerOpen\n} from \"./sidebar-context\";\n\nconst ARROW_DOWN = \"ArrowDown\";\nconst ARROW_UP = \"ArrowUp\";\nconst ARROW_LEFT = \"ArrowLeft\";\nconst ARROW_RIGHT = \"ArrowRight\";\nconst ENTER = \"Enter\";\n\n/**\n * @summary Base class for sidebar navigation components.\n * Provides core functionality for sidebar items and groups including keyboard navigation,\n * selection state management, and nesting support. This class manages hierarchical navigation,\n * active state tracking, and drawer overlay coordination through context providers.\n *\n * Features:\n * - Multi-level keyboard navigation (Arrow keys, Enter)\n * - Active state management via Lit context subscription\n * - Support for nested hierarchies up to 3 levels deep\n * - Focus management and full ARIA attribute support\n * - Event emission for sidebar coordination (i-sgds-click)\n * - Automatic child element tracking and nesting level detection\n *\n * Keyboard Navigation:\n * - Arrow Up/Down: Navigate between siblings in the same level\n * - Arrow Left/Right: Navigate hierarchically (collapse/expand or move in drawer)\n * - Enter: Activate focused item or toggle group\n *\n * Context Management:\n * - Consumes: SidebarCollapsed, SidebarActiveItem, SidebarActiveGroup, SidebarDrawerItems\n * - Updates state based on context changes for responsive UI updates\n *\n * @internal\n */\nexport class SidebarElement extends SgdsElement {\n  static styles = DropdownElement.styles;\n\n  /**\n   * The display title/label for the sidebar element.\n   * Shown in the UI and used for accessibility labels (aria-label).\n   * @attribute title\n   * @type {string}\n   * @default \"\"\n   */\n  @property({ type: String, reflect: true }) title = \"\";\n\n  /**\n   * The unique name identifier for the sidebar element.\n   * Used to identify selections in sgds-select events and manage active states.\n   * Should be unique among siblings in the same navigation level.\n   * @attribute name\n   * @type {string}\n   * @default \"\"\n   */\n  @property({ type: String, reflect: true }) name = \"\";\n\n  /** @internal */\n  @consume({ context: SidebarCollapsed, subscribe: true })\n  @state()\n  _sidebarCollapsed = false;\n\n  /** @internal */\n  @consume({ context: SidebarActiveItem, subscribe: true })\n  @state()\n  _sidebarActiveItem: SidebarElement | null = null;\n\n  /** @internal */\n  @consume({ context: SidebarActiveGroup, subscribe: true })\n  @state()\n  _sidebarActiveGroup: SidebarElement | null = null;\n\n  /** @internal */\n  @consume({ context: SidebarDrawerItems, subscribe: true })\n  @state()\n  _drawerItems: SidebarElement[] | null = null;\n\n  /** @internal Tracks whether a drawer overlay is currently open */\n  @consume({ context: SidebarDrawerOpen, subscribe: true })\n  @state()\n  _showDrawer = false;\n\n  /** @internal */\n  @state() _childLevel = 1;\n\n  /**\n   * Indicates whether this element is currently selected/active.\n   * @internal\n   */\n  @state() _selected = false;\n\n  /**\n   * Indicates whether this element should be hidden based on nesting context.\n   * @internal\n   */\n  @state() _hidden = false;\n\n  /**\n   * List of child elements assigned to this component.\n   * @internal\n   */\n  @state()\n  _childElements: SidebarElement[] = [];\n\n  /** @internal */\n  @state() _childActive = false;\n\n  /** @internal */\n  @queryAssignedElements({ flatten: true })\n  private _defaultNodes!: SidebarElement[];\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.getChildLevel();\n    this.setAttribute(\"role\", \"navigation\");\n    this.addEventListener(\"keydown\", this._handleKeyDown);\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.removeEventListener(\"keydown\", this._handleKeyDown);\n  }\n\n  firstUpdated(changedProperties: PropertyValueMap<this>) {\n    super.firstUpdated(changedProperties);\n    this.getChildLevel();\n  }\n\n  updated() {\n    if (this._childLevel === 2) {\n      this._hidden = !this.closest(\".sidebar-nested-overlay\");\n    }\n  }\n\n  /**\n   * Handles slot change events and updates child elements list.\n   * @internal\n   * @returns {void}\n   */\n  _handleSlotChange() {\n    this._childElements = this._defaultNodes;\n  }\n\n  /**\n   * Handles click/activation events on the sidebar element.\n   * Emits internal click event for parent sidebar to handle selection.\n   * @internal\n   * @param {SidebarElement} [element] - Optional element parameter (for keyboard compatibility)\n   * @returns {void}\n   */\n  protected _handleClick() {\n    this.emit(\"i-sgds-click\", { detail: { element: this, level: this._childLevel } });\n  }\n\n  /**\n   * Handles keyboard navigation events for sidebar elements.\n   * Supports Arrow Up/Down for navigation and Arrow Left/Right for drawer management.\n   * @internal\n   * @param {KeyboardEvent} event - The keyboard event object\n   * @returns {void}\n   */\n  private _handleKeyDown(event: KeyboardEvent) {\n    const target = event.target as HTMLElement;\n\n    switch (event.key) {\n      case ENTER: {\n        event.preventDefault();\n        event.stopPropagation();\n        if (event.target === this) this._handleClick();\n        return;\n      }\n      case ARROW_DOWN: {\n        event.preventDefault();\n        event.stopPropagation();\n\n        const child = (target as SidebarElement)._childElements[0];\n\n        const isChildHidden = child?._hidden;\n        const childElement = !isChildHidden ? child : null;\n        const nextElement = childElement || target.nextElementSibling || target.parentElement.nextElementSibling;\n\n        if (nextElement?.shadowRoot) {\n          const focusTarget = nextElement.shadowRoot.querySelector(\"[tabindex]\") as HTMLElement | null;\n          focusTarget?.focus();\n        }\n\n        return;\n      }\n      case ARROW_UP: {\n        event.preventDefault();\n        event.stopPropagation();\n\n        const prevSiblingChildren = (target.previousElementSibling as SidebarElement)?._childElements;\n        const lastChild = prevSiblingChildren ? prevSiblingChildren[prevSiblingChildren?.length - 1] : null;\n        const isChildHidden = lastChild?._hidden;\n\n        const childElement = !isChildHidden ? lastChild : null;\n        const prevElement = childElement || target.previousElementSibling || target.parentElement;\n\n        if (prevElement?.shadowRoot) {\n          const focusTarget = prevElement.shadowRoot.querySelector(\"[tabindex]\") as HTMLElement | null;\n          focusTarget?.focus();\n        }\n        return;\n      }\n      case ARROW_LEFT: {\n        event.preventDefault();\n        event.stopPropagation();\n\n        if (this._sidebarActiveGroup === this) {\n          // when drawer is open, close it\n          if (this._showDrawer) this._handleClick();\n        } else {\n          // check if we are on the drawer, if so move back to parent\n          const childLevel = (target as SidebarElement)._childLevel;\n          if (childLevel >= 2 && this._sidebarActiveGroup?.shadowRoot) {\n            const focusTarget = this._sidebarActiveGroup.shadowRoot.querySelector(\"[tabindex]\") as HTMLElement | null;\n            focusTarget?.focus();\n          }\n        }\n\n        return;\n      }\n      case ARROW_RIGHT: {\n        event.preventDefault();\n        event.stopPropagation();\n\n        if (this._sidebarActiveGroup === this) {\n          if (this._drawerItems?.length) {\n            if (this._showDrawer) {\n              const drawerItem = this._drawerItems[0];\n              if (drawerItem?.shadowRoot) {\n                const focusTarget = drawerItem.shadowRoot.querySelector(\"[tabindex]\") as HTMLElement | null;\n                focusTarget?.focus();\n              }\n            } else {\n              this._handleClick();\n            }\n          }\n        } else {\n          if (this._childLevel === 1 && this._childElements.length > 0) {\n            // when there is nested, we trigger click to show drawer\n            this._handleClick();\n          }\n        }\n\n        return;\n      }\n    }\n  }\n\n  /**\n   * Calculates the nesting level by counting parent sgds-sidebar-group ancestors.\n   * Level 1 = top-level element, Level 2+ = nested within another group.\n   * Updates the _childLevel state property.\n   * @internal\n   * @returns {void}\n   */\n  private getChildLevel() {\n    let currentEle = this.parentElement;\n    let level = 1;\n\n    while (currentEle.tagName.toLowerCase() === \"sgds-sidebar-group\") {\n      level += 1;\n      currentEle = currentEle.parentElement;\n    }\n\n    const isInDrawer = currentEle.classList.contains(\"sidebar-nested-overlay\");\n    this._childLevel = isInDrawer ? level + 1 : level;\n  }\n}\n"],"names":[],"mappings":";;;;;;;AAaA,MAAM,UAAU,GAAG,WAAW,CAAC;AAC/B,MAAM,QAAQ,GAAG,SAAS,CAAC;AAC3B,MAAM,UAAU,GAAG,WAAW,CAAC;AAC/B,MAAM,WAAW,GAAG,YAAY,CAAC;AACjC,MAAM,KAAK,GAAG,OAAO,CAAC;AAEtB;;;;;;;;;;;;;;;;;;;;;;;;AAwBG;AACG,MAAO,cAAe,SAAQ,WAAW,CAAA;AAA/C,IAAA,WAAA,GAAA;;AAGE;;;;;;AAMG;QACwC,IAAK,CAAA,KAAA,GAAG,EAAE,CAAC;AAEtD;;;;;;;AAOG;QACwC,IAAI,CAAA,IAAA,GAAG,EAAE,CAAC;;QAKrD,IAAiB,CAAA,iBAAA,GAAG,KAAK,CAAC;;QAK1B,IAAkB,CAAA,kBAAA,GAA0B,IAAI,CAAC;;QAKjD,IAAmB,CAAA,mBAAA,GAA0B,IAAI,CAAC;;QAKlD,IAAY,CAAA,YAAA,GAA4B,IAAI,CAAC;;QAK7C,IAAW,CAAA,WAAA,GAAG,KAAK,CAAC;;QAGX,IAAW,CAAA,WAAA,GAAG,CAAC,CAAC;AAEzB;;;AAGG;QACM,IAAS,CAAA,SAAA,GAAG,KAAK,CAAC;AAE3B;;;AAGG;QACM,IAAO,CAAA,OAAA,GAAG,KAAK,CAAC;AAEzB;;;AAGG;QAEH,IAAc,CAAA,cAAA,GAAqB,EAAE,CAAC;;QAG7B,IAAY,CAAA,YAAA,GAAG,KAAK,CAAC;KAqK/B;IA/JC,iBAAiB,GAAA;QACf,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,aAAa,EAAE,CAAC;AACrB,QAAA,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC;QACxC,IAAI,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC;KACvD;IAED,oBAAoB,GAAA;QAClB,KAAK,CAAC,oBAAoB,EAAE,CAAC;QAC7B,IAAI,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC;KAC1D;AAED,IAAA,YAAY,CAAC,iBAAyC,EAAA;AACpD,QAAA,KAAK,CAAC,YAAY,CAAC,iBAAiB,CAAC,CAAC;QACtC,IAAI,CAAC,aAAa,EAAE,CAAC;KACtB;IAED,OAAO,GAAA;AACL,QAAA,IAAI,IAAI,CAAC,WAAW,KAAK,CAAC,EAAE;YAC1B,IAAI,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC,yBAAyB,CAAC,CAAC;SACzD;KACF;AAED;;;;AAIG;IACH,iBAAiB,GAAA;AACf,QAAA,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,aAAa,CAAC;KAC1C;AAED;;;;;;AAMG;IACO,YAAY,GAAA;QACpB,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE,EAAE,MAAM,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,CAAC,WAAW,EAAE,EAAE,CAAC,CAAC;KACnF;AAED;;;;;;AAMG;AACK,IAAA,cAAc,CAAC,KAAoB,EAAA;;AACzC,QAAA,MAAM,MAAM,GAAG,KAAK,CAAC,MAAqB,CAAC;AAE3C,QAAA,QAAQ,KAAK,CAAC,GAAG;YACf,KAAK,KAAK,EAAE;gBACV,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,KAAK,CAAC,eAAe,EAAE,CAAC;AACxB,gBAAA,IAAI,KAAK,CAAC,MAAM,KAAK,IAAI;oBAAE,IAAI,CAAC,YAAY,EAAE,CAAC;gBAC/C,OAAO;aACR;YACD,KAAK,UAAU,EAAE;gBACf,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,KAAK,CAAC,eAAe,EAAE,CAAC;gBAExB,MAAM,KAAK,GAAI,MAAyB,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC;gBAE3D,MAAM,aAAa,GAAG,KAAK,KAAA,IAAA,IAAL,KAAK,KAAL,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,KAAK,CAAE,OAAO,CAAC;AACrC,gBAAA,MAAM,YAAY,GAAG,CAAC,aAAa,GAAG,KAAK,GAAG,IAAI,CAAC;AACnD,gBAAA,MAAM,WAAW,GAAG,YAAY,IAAI,MAAM,CAAC,kBAAkB,IAAI,MAAM,CAAC,aAAa,CAAC,kBAAkB,CAAC;gBAEzG,IAAI,WAAW,aAAX,WAAW,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAX,WAAW,CAAE,UAAU,EAAE;oBAC3B,MAAM,WAAW,GAAG,WAAW,CAAC,UAAU,CAAC,aAAa,CAAC,YAAY,CAAuB,CAAC;AAC7F,oBAAA,WAAW,aAAX,WAAW,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAX,WAAW,CAAE,KAAK,EAAE,CAAC;iBACtB;gBAED,OAAO;aACR;YACD,KAAK,QAAQ,EAAE;gBACb,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,KAAK,CAAC,eAAe,EAAE,CAAC;gBAExB,MAAM,mBAAmB,GAAG,CAAC,EAAA,GAAA,MAAM,CAAC,sBAAyC,MAAA,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAE,cAAc,CAAC;gBAC9F,MAAM,SAAS,GAAG,mBAAmB,GAAG,mBAAmB,CAAC,CAAA,mBAAmB,KAAA,IAAA,IAAnB,mBAAmB,KAAnB,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,mBAAmB,CAAE,MAAM,IAAG,CAAC,CAAC,GAAG,IAAI,CAAC;gBACpG,MAAM,aAAa,GAAG,SAAS,KAAA,IAAA,IAAT,SAAS,KAAT,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,SAAS,CAAE,OAAO,CAAC;AAEzC,gBAAA,MAAM,YAAY,GAAG,CAAC,aAAa,GAAG,SAAS,GAAG,IAAI,CAAC;gBACvD,MAAM,WAAW,GAAG,YAAY,IAAI,MAAM,CAAC,sBAAsB,IAAI,MAAM,CAAC,aAAa,CAAC;gBAE1F,IAAI,WAAW,aAAX,WAAW,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAX,WAAW,CAAE,UAAU,EAAE;oBAC3B,MAAM,WAAW,GAAG,WAAW,CAAC,UAAU,CAAC,aAAa,CAAC,YAAY,CAAuB,CAAC;AAC7F,oBAAA,WAAW,aAAX,WAAW,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAX,WAAW,CAAE,KAAK,EAAE,CAAC;iBACtB;gBACD,OAAO;aACR;YACD,KAAK,UAAU,EAAE;gBACf,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,KAAK,CAAC,eAAe,EAAE,CAAC;AAExB,gBAAA,IAAI,IAAI,CAAC,mBAAmB,KAAK,IAAI,EAAE;;oBAErC,IAAI,IAAI,CAAC,WAAW;wBAAE,IAAI,CAAC,YAAY,EAAE,CAAC;iBAC3C;qBAAM;;AAEL,oBAAA,MAAM,UAAU,GAAI,MAAyB,CAAC,WAAW,CAAC;AAC1D,oBAAA,IAAI,UAAU,IAAI,CAAC,KAAI,CAAA,EAAA,GAAA,IAAI,CAAC,mBAAmB,MAAE,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,UAAU,CAAA,EAAE;AAC3D,wBAAA,MAAM,WAAW,GAAG,IAAI,CAAC,mBAAmB,CAAC,UAAU,CAAC,aAAa,CAAC,YAAY,CAAuB,CAAC;AAC1G,wBAAA,WAAW,aAAX,WAAW,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAX,WAAW,CAAE,KAAK,EAAE,CAAC;qBACtB;iBACF;gBAED,OAAO;aACR;YACD,KAAK,WAAW,EAAE;gBAChB,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,KAAK,CAAC,eAAe,EAAE,CAAC;AAExB,gBAAA,IAAI,IAAI,CAAC,mBAAmB,KAAK,IAAI,EAAE;AACrC,oBAAA,IAAI,MAAA,IAAI,CAAC,YAAY,MAAE,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,MAAM,EAAE;AAC7B,wBAAA,IAAI,IAAI,CAAC,WAAW,EAAE;4BACpB,MAAM,UAAU,GAAG,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC;4BACxC,IAAI,UAAU,aAAV,UAAU,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAV,UAAU,CAAE,UAAU,EAAE;gCAC1B,MAAM,WAAW,GAAG,UAAU,CAAC,UAAU,CAAC,aAAa,CAAC,YAAY,CAAuB,CAAC;AAC5F,gCAAA,WAAW,aAAX,WAAW,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAX,WAAW,CAAE,KAAK,EAAE,CAAC;6BACtB;yBACF;6BAAM;4BACL,IAAI,CAAC,YAAY,EAAE,CAAC;yBACrB;qBACF;iBACF;qBAAM;AACL,oBAAA,IAAI,IAAI,CAAC,WAAW,KAAK,CAAC,IAAI,IAAI,CAAC,cAAc,CAAC,MAAM,GAAG,CAAC,EAAE;;wBAE5D,IAAI,CAAC,YAAY,EAAE,CAAC;qBACrB;iBACF;gBAED,OAAO;aACR;SACF;KACF;AAED;;;;;;AAMG;IACK,aAAa,GAAA;AACnB,QAAA,IAAI,UAAU,GAAG,IAAI,CAAC,aAAa,CAAC;QACpC,IAAI,KAAK,GAAG,CAAC,CAAC;QAEd,OAAO,UAAU,CAAC,OAAO,CAAC,WAAW,EAAE,KAAK,oBAAoB,EAAE;YAChE,KAAK,IAAI,CAAC,CAAC;AACX,YAAA,UAAU,GAAG,UAAU,CAAC,aAAa,CAAC;SACvC;QAED,MAAM,UAAU,GAAG,UAAU,CAAC,SAAS,CAAC,QAAQ,CAAC,wBAAwB,CAAC,CAAC;AAC3E,QAAA,IAAI,CAAC,WAAW,GAAG,UAAU,GAAG,KAAK,GAAG,CAAC,GAAG,KAAK,CAAC;KACnD;;AAzOM,cAAA,CAAA,MAAM,GAAG,eAAe,CAAC,MAAM,CAAC;AASI,UAAA,CAAA;IAA1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AAAY,CAAA,EAAA,cAAA,CAAA,SAAA,EAAA,OAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAUX,UAAA,CAAA;IAA1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AAAW,CAAA,EAAA,cAAA,CAAA,SAAA,EAAA,MAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAKrD,UAAA,CAAA;IAFC,OAAO,CAAC,EAAE,OAAO,EAAE,gBAAgB,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;AACvD,IAAA,KAAK,EAAE;AACkB,CAAA,EAAA,cAAA,CAAA,SAAA,EAAA,mBAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAK1B,UAAA,CAAA;IAFC,OAAO,CAAC,EAAE,OAAO,EAAE,iBAAiB,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;AACxD,IAAA,KAAK,EAAE;AACyC,CAAA,EAAA,cAAA,CAAA,SAAA,EAAA,oBAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAKjD,UAAA,CAAA;IAFC,OAAO,CAAC,EAAE,OAAO,EAAE,kBAAkB,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;AACzD,IAAA,KAAK,EAAE;AAC0C,CAAA,EAAA,cAAA,CAAA,SAAA,EAAA,qBAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAKlD,UAAA,CAAA;IAFC,OAAO,CAAC,EAAE,OAAO,EAAE,kBAAkB,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;AACzD,IAAA,KAAK,EAAE;AACqC,CAAA,EAAA,cAAA,CAAA,SAAA,EAAA,cAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAK7C,UAAA,CAAA;IAFC,OAAO,CAAC,EAAE,OAAO,EAAE,iBAAiB,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;AACxD,IAAA,KAAK,EAAE;AACY,CAAA,EAAA,cAAA,CAAA,SAAA,EAAA,aAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAGX,UAAA,CAAA;AAAR,IAAA,KAAK,EAAE;AAAiB,CAAA,EAAA,cAAA,CAAA,SAAA,EAAA,aAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAMhB,UAAA,CAAA;AAAR,IAAA,KAAK,EAAE;AAAmB,CAAA,EAAA,cAAA,CAAA,SAAA,EAAA,WAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAMlB,UAAA,CAAA;AAAR,IAAA,KAAK,EAAE;AAAiB,CAAA,EAAA,cAAA,CAAA,SAAA,EAAA,SAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAOzB,UAAA,CAAA;AADC,IAAA,KAAK,EAAE;AAC8B,CAAA,EAAA,cAAA,CAAA,SAAA,EAAA,gBAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAG7B,UAAA,CAAA;AAAR,IAAA,KAAK,EAAE;AAAsB,CAAA,EAAA,cAAA,CAAA,SAAA,EAAA,cAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAItB,UAAA,CAAA;AADP,IAAA,qBAAqB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AACA,CAAA,EAAA,cAAA,CAAA,SAAA,EAAA,eAAA,EAAA,KAAA,CAAA,CAAA;;;;"}

package/components/Sidebar/sidebar-item.js

@@ -1,6 +0,0 @@
-import { css } from 'lit';
-
-var css_248z = css`.sidebar-item{border-radius:var(--sgds-border-radius-md);cursor:pointer;padding:var(--sgds-padding-xs);transition:background-color .15s ease-in-out,color .15s ease-in-out}.sidebar-item.active,.sidebar-item:hover{background-color:var(--sgds-bg-translucent-subtle)}.sidebar-item:focus,.sidebar-item:focus-visible{outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}.sidebar-item-label-wrapper,.sidebar-item-label-wrapper>div{align-items:center;display:flex;gap:var(--sgds-gap-xs)}.sidebar-item-label-wrapper{justify-content:space-between}.sidebar-item-label{-webkit-line-clamp:2;-webkit-box-orient:vertical;line-clamp:2;display:-webkit-box;font-size:var(--sgds-font-size-1);line-height:var(--sgds-line-height-20);max-height:calc(var(--sgds-line-height-20, 20px)*2);overflow:hidden}.sidebar-item-label.offset{margin-left:var(--sgds-margin-2-xl)}.sidebar-item-label-wrapper .sidebar-item.active{background-color:var(--sgds-surface-raised);color:var(--sgds-primary-color-default)}.sidebar-item-label-wrapper .sidebar-item-trailingIcon{align-items:center;display:flex;gap:var(--sgds-gap-2-xs)}.sidebar-item--collapsed .sidebar-item-label,.sidebar-item--collapsed .sidebar-item-trailingIcon{display:none}.sidebar-item--collapsed .sidebar-item-label-wrapper{justify-content:center}.sidebar-submenu{overflow:hidden}.sidebar-submenu>div{margin-top:-100%;opacity:0;pointer-events:none;transition:all var(--sgds-motion-duration-standard) var(--sgds-motion-easing-standard)}.sidebar-submenu.show>div{margin-top:0;opacity:1;pointer-events:auto}.sidebar-submenu--collapsed{display:none}`;
-
-export { css_248z as default };
-//# sourceMappingURL=sidebar-item.js.map

package/components/Sidebar/sidebar-item.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"sidebar-item.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

package/components/Sidebar/sidebar-section.js

@@ -1,6 +0,0 @@
-import { css } from 'lit';
-
-var css_248z = css`.sidebar-section{display:flex;flex-direction:column}.sidebar-section-label{align-items:center;border-radius:var(--sgds-border-radius-md);color:var(--sgds-label-color-subtle);cursor:pointer;display:flex;font-size:var(--sgds-font-size-0);gap:var(--sgds-gap-2-xs);line-height:var(--sgds-line-height-20);padding:var(--sgds-padding-xs) var(--sgds-padding-sm)}.sidebar-section-label:hover{color:var(--sgds-label-color-default)}.sidebar-section-label:focus,.sidebar-section-label:focus-visible{outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}.sidebar-section--collapsed .sidebar-section-label{height:0;margin:0;opacity:0;overflow:hidden;padding:0;pointer-events:none;width:0}.sidebar-section-content{overflow:hidden;padding:0 var(--sgds-padding-xs)}.sidebar-section-content>div{margin-top:0;pointer-events:auto;transition:all var(--sgds-motion-duration-slow) var(--sgds-motion-easing-standard)}.sidebar-section-content.sidebar-section-content--collapsed>div{margin-top:-100%;pointer-events:none}.sidebar-section--collapsed .sidebar-section-content--collapsed>div{margin-top:0}.sidebar-section-seperator{margin-bottom:var(--sgds-margin-md)}`;
-
-export { css_248z as default };
-//# sourceMappingURL=sidebar-section.js.map

package/components/Sidebar/sidebar-section.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"sidebar-section.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

package/components/Sidebar/sidebar.js

@@ -1,6 +0,0 @@
-import { css } from 'lit';
-
-var css_248z = css`.sidebar{display:flex;flex-direction:column;height:100%;position:relative;transition:width var(--sgds-motion-duration-standard) var(--sgds-motion-easing-standard);z-index:1100}.sidebar--expanded{width:var(--sgds-dimension-288)}.sidebar--collapsed{width:var(--sgds-dimension-72)}.sidebar-top{align-items:center;display:flex;gap:var(--sgds-gap-md);justify-content:space-between;padding:0 var(--sgds-padding-xs)}.sidebar--collapsed .sidebar-brand-name{display:none}.sidebar--collapsed .sidebar-top{justify-content:center}.sidebar-main{background-color:var(--sgds-bg-default);border-right:var(--sgds-border-width-1) solid var(--sgds-border-color-muted);height:100%;overflow-x:hidden;overflow-y:auto;padding:var(--sgds-padding-lg) 0;position:relative;z-index:1}.sidebar-wrapper{display:flex;flex-direction:column;height:100%;justify-content:space-between}.sidebar-content{display:flex;flex:1;flex-direction:column;gap:var(--sgds-gap-md);overflow-y:auto}.sidebar-nested-overlay{background-color:var(--sgds-surface-raised);overflow-y:scroll;padding:var(--sgds-padding-md) var(--sgds-padding-xs);transition:all var(--sgds-motion-duration-standard) var(--sgds-motion-easing-standard);transition-property:opacity left;width:var(--sgds-dimension-288);z-index:0}.sidebar--overlay,.sidebar-nested-overlay{bottom:0;left:0;opacity:0;pointer-events:none;position:absolute;top:0}.sidebar--overlay{background-color:var(--sgds-bg-overlay);content:"";transition:all var(--sgds-motion-duration-standard) var(--sgds-motion-easing-standard);width:100dvw}.sidebar--overlay.show{opacity:1;pointer-events:unset}.sidebar-nested-overlay.show{border-right:var(--sgds-border-width-1) solid var(--sgds-border-color-muted);left:var(--sgds-dimension-288);opacity:1;pointer-events:auto}.sidebar--collapsed .sidebar-nested-overlay.show{left:var(--sgds-dimension-72)}.sidebar-nested-overlay sgds-icon-button{display:none}.sidebar::-webkit-scrollbar{width:var(--sgds-dimension-2)}.sidebar::-webkit-scrollbar-track{background:transparent}.sidebar::-webkit-scrollbar-thumb{background:var(--sgds-border-color-muted);border-radius:var(--sgds-border-radius-xs)}.sidebar::-webkit-scrollbar-thumb:hover{background:var(--sgds-color-subtle)}@media screen and (max-width:767px){.sidebar-nested-overlay sgds-icon-button{display:block}.sidebar--expanded,.sidebar-nested-overlay{width:var(--sgds-dimension-256)}.sidebar-nested-overlay,.sidebar-nested-overlay.show{left:var(--sgds-dimension-256)}}@media screen and (max-width:511px){.sidebar--overlay{display:none}.sidebar--expanded{position:absolute;width:100dvw}.sidebar-nested-overlay{left:-100dvw;width:100dvw;z-index:2}.sidebar--collapsed .sidebar-nested-overlay.show,.sidebar-nested-overlay.show{left:0}}`;
-
-export { css_248z as default };
-//# sourceMappingURL=sidebar.js.map

package/components/Sidebar/sidebar.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"sidebar.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

package/react/components/Sidebar/sgds-sidebar-group.cjs.js

@@ -1,129 +0,0 @@
-'use client';
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var tslib = require('tslib');
-var lit = require('lit');
-var decorators_js = require('lit/decorators.js');
-var classMap_js = require('lit/directives/class-map.js');
-var sgdsElement = require('../../base/sgds-element.cjs.js');
-var sidebarItem = require('./sidebar-item.cjs.js');
-var sgdsIcon = require('../Icon/sgds-icon.cjs.js');
-var sidebarElement = require('./sidebar-element.cjs.js');
-
-/**
- * @summary Sidebar group represents a navigable parent item within the sidebar that can have nested children.
- * Groups support multiple levels of nesting and show nested items in a drawer overlay or submenu.
- * Groups can be used to organize related sidebar items into expanding/collapsing sections.
- *
- * Behavior varies by nesting level:
- * - Level 1 (root): Clicking opens drawer overlay showing all nested children. Keyboard: ArrowRight opens drawer.
- * - Level 2+ (nested): Clicking toggles submenu visibility. Keyboard: ArrowRight toggles submenu.
- *
- * @slot default - Insert sgds-sidebar-group or sgds-sidebar-item elements as nested children
- * @slot trailingIcon - Icon to display after the label text. A chevron is auto-appended.
- *
- */
-class SgdsSidebarGroup extends sidebarElement.SidebarElement {
-    constructor() {
-        super(...arguments);
-        /**
-         * Manages submenu visibility state for nested groups.
-         * When true, the submenu is displayed showing nested children.
-         * When false, the submenu is hidden.
-         * Only used for nested groups (level 2+). Root-level groups use drawer overlay instead.
-         * @internal
-         */
-        this._showMenu = false;
-    }
-    /**
-     * Reports the visibility state of the submenu for nested groups.
-     * Returns true when the submenu is displayed showing child items, false when hidden.
-     * Only applicable for nested groups (level 2+). Root-level groups use drawer overlay instead.
-     * @readonly
-     * @type {boolean}
-     */
-    get showMenu() {
-        return this._showMenu;
-    }
-    /** @internal */
-    _handleClick() {
-        if (this._childLevel !== 1) {
-            this._showMenu = !this._showMenu;
-            this._childElements.forEach(v => {
-                v._hidden = !this._showMenu;
-            });
-        }
-        else {
-            super._handleClick();
-        }
-    }
-    /**
-     * Determines the appropriate chevron icon based on nesting level and menu visibility.
-     * Icon changes provide visual feedback on expandable/collapsible state:
-     * - Level 1: chevron-right (closed drawer) or chevron-right (no change - drawer controlled by parent)
-     * - Level 2+: chevron-down (submenu open) or chevron-up (submenu closed)
-     * @private
-     * @returns {string} The icon name to display (e.g., 'chevron-right', 'chevron-down')
-     */
-    _getIcon() {
-        if (this._childLevel === 1) {
-            return "chevron-right";
-        }
-        else {
-            return this._showMenu ? "chevron-down" : "chevron-up";
-        }
-    }
-    render() {
-        return lit.html `
-      <div
-        class=${classMap_js.classMap({
-            "sidebar-item": true,
-            "sidebar-item--collapsed": this._sidebarCollapsed && this._childLevel === 1,
-            active: this._selected
-        })}
-        @click=${() => this._handleClick()}
-        aria-level=${this._childLevel}
-        .aria-expanded=${this._showMenu}
-        tabindex=${this._childLevel > 2 && !this._showMenu ? -1 : 0}
-      >
-        <div class="sidebar-item-label-wrapper">
-          <div>
-            <slot name="leadingIcon"></slot>
-            <span class="sidebar-item-label">${this.title}</span>
-          </div>
-
-          <span class="sidebar-item-trailingIcon">
-            <slot name="trailingIcon"></slot>
-            <sgds-icon aria-label=${this.title || this.name} name=${this._getIcon()} size="sm"></sgds-icon>
-          </span>
-        </div>
-      </div>
-
-      <div
-        class=${classMap_js.classMap({
-            "sidebar-submenu": true,
-            "sidebar-submenu--collapsed": this._sidebarCollapsed && this._childLevel == 1,
-            show: this._showMenu
-        })}
-      >
-        <div>
-          <slot @slotchange=${this._handleSlotChange}></slot>
-        </div>
-      </div>
-    `;
-    }
-}
-SgdsSidebarGroup.styles = [...sgdsElement["default"].styles, sidebarItem["default"]];
-/** @internal */
-SgdsSidebarGroup.dependencies = {
-    "sgds-icon": sgdsIcon.SgdsIcon
-};
-tslib.__decorate([
-    decorators_js.state()
-], SgdsSidebarGroup.prototype, "_showMenu", void 0);
-
-exports.SgdsSidebarGroup = SgdsSidebarGroup;
-exports["default"] = SgdsSidebarGroup;
-//# sourceMappingURL=sgds-sidebar-group.cjs.js.map

package/react/components/Sidebar/sgds-sidebar-group.cjs.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"sgds-sidebar-group.cjs.js","sources":["../../../../src/components/Sidebar/sgds-sidebar-group.ts"],"sourcesContent":["import { html } from \"lit\";\nimport { state } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport sidebarOptionStyle from \"./sidebar-item.css\";\nimport SgdsIcon from \"../Icon/sgds-icon\";\n\nimport { SidebarElement } from \"./sidebar-element\";\n\n/**\n * @summary Sidebar group represents a navigable parent item within the sidebar that can have nested children.\n * Groups support multiple levels of nesting and show nested items in a drawer overlay or submenu.\n * Groups can be used to organize related sidebar items into expanding/collapsing sections.\n *\n * Behavior varies by nesting level:\n * - Level 1 (root): Clicking opens drawer overlay showing all nested children. Keyboard: ArrowRight opens drawer.\n * - Level 2+ (nested): Clicking toggles submenu visibility. Keyboard: ArrowRight toggles submenu.\n *\n * @slot default - Insert sgds-sidebar-group or sgds-sidebar-item elements as nested children\n * @slot trailingIcon - Icon to display after the label text. A chevron is auto-appended.\n *\n */\nexport class SgdsSidebarGroup extends SidebarElement {\n  static styles = [...SgdsElement.styles, sidebarOptionStyle];\n\n  /** @internal */\n  static dependencies = {\n    \"sgds-icon\": SgdsIcon\n  };\n\n  /**\n   * Manages submenu visibility state for nested groups.\n   * When true, the submenu is displayed showing nested children.\n   * When false, the submenu is hidden.\n   * Only used for nested groups (level 2+). Root-level groups use drawer overlay instead.\n   * @internal\n   */\n  @state() _showMenu = false;\n\n  /**\n   * Reports the visibility state of the submenu for nested groups.\n   * Returns true when the submenu is displayed showing child items, false when hidden.\n   * Only applicable for nested groups (level 2+). Root-level groups use drawer overlay instead.\n   * @readonly\n   * @type {boolean}\n   */\n  get showMenu(): boolean {\n    return this._showMenu;\n  }\n\n  /** @internal */\n  protected override _handleClick(): void {\n    if (this._childLevel !== 1) {\n      this._showMenu = !this._showMenu;\n      this._childElements.forEach(v => {\n        v._hidden = !this._showMenu;\n      });\n    } else {\n      super._handleClick();\n    }\n  }\n  /**\n   * Determines the appropriate chevron icon based on nesting level and menu visibility.\n   * Icon changes provide visual feedback on expandable/collapsible state:\n   * - Level 1: chevron-right (closed drawer) or chevron-right (no change - drawer controlled by parent)\n   * - Level 2+: chevron-down (submenu open) or chevron-up (submenu closed)\n   * @private\n   * @returns {string} The icon name to display (e.g., 'chevron-right', 'chevron-down')\n   */\n  private _getIcon() {\n    if (this._childLevel === 1) {\n      return \"chevron-right\";\n    } else {\n      return this._showMenu ? \"chevron-down\" : \"chevron-up\";\n    }\n  }\n\n  render() {\n    return html`\n      <div\n        class=${classMap({\n          \"sidebar-item\": true,\n          \"sidebar-item--collapsed\": this._sidebarCollapsed && this._childLevel === 1,\n          active: this._selected\n        })}\n        @click=${() => this._handleClick()}\n        aria-level=${this._childLevel}\n        .aria-expanded=${this._showMenu}\n        tabindex=${this._childLevel > 2 && !this._showMenu ? -1 : 0}\n      >\n        <div class=\"sidebar-item-label-wrapper\">\n          <div>\n            <slot name=\"leadingIcon\"></slot>\n            <span class=\"sidebar-item-label\">${this.title}</span>\n          </div>\n\n          <span class=\"sidebar-item-trailingIcon\">\n            <slot name=\"trailingIcon\"></slot>\n            <sgds-icon aria-label=${this.title || this.name} name=${this._getIcon()} size=\"sm\"></sgds-icon>\n          </span>\n        </div>\n      </div>\n\n      <div\n        class=${classMap({\n          \"sidebar-submenu\": true,\n          \"sidebar-submenu--collapsed\": this._sidebarCollapsed && this._childLevel == 1,\n          show: this._showMenu\n        })}\n      >\n        <div>\n          <slot @slotchange=${this._handleSlotChange}></slot>\n        </div>\n      </div>\n    `;\n  }\n}\n\nexport default SgdsSidebarGroup;\n"],"names":["SidebarElement","html","classMap","SgdsElement","sidebarOptionStyle","SgdsIcon","__decorate","state"],"mappings":";;;;;;;;;;;;;;AASA;;;;;;;;;;;;AAYG;AACG,MAAO,gBAAiB,SAAQA,6BAAc,CAAA;AAApD,IAAA,WAAA,GAAA;;AAQE;;;;;;AAMG;QACM,IAAS,CAAA,SAAA,GAAG,KAAK,CAAC;KA+E5B;AA7EC;;;;;;AAMG;AACH,IAAA,IAAI,QAAQ,GAAA;QACV,OAAO,IAAI,CAAC,SAAS,CAAC;KACvB;;IAGkB,YAAY,GAAA;AAC7B,QAAA,IAAI,IAAI,CAAC,WAAW,KAAK,CAAC,EAAE;AAC1B,YAAA,IAAI,CAAC,SAAS,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC;AACjC,YAAA,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,IAAG;AAC9B,gBAAA,CAAC,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC;AAC9B,aAAC,CAAC,CAAC;SACJ;aAAM;YACL,KAAK,CAAC,YAAY,EAAE,CAAC;SACtB;KACF;AACD;;;;;;;AAOG;IACK,QAAQ,GAAA;AACd,QAAA,IAAI,IAAI,CAAC,WAAW,KAAK,CAAC,EAAE;AAC1B,YAAA,OAAO,eAAe,CAAC;SACxB;aAAM;YACL,OAAO,IAAI,CAAC,SAAS,GAAG,cAAc,GAAG,YAAY,CAAC;SACvD;KACF;IAED,MAAM,GAAA;AACJ,QAAA,OAAOC,QAAI,CAAA,CAAA;;AAEC,cAAA,EAAAC,oBAAQ,CAAC;AACf,YAAA,cAAc,EAAE,IAAI;YACpB,yBAAyB,EAAE,IAAI,CAAC,iBAAiB,IAAI,IAAI,CAAC,WAAW,KAAK,CAAC;YAC3E,MAAM,EAAE,IAAI,CAAC,SAAS;SACvB,CAAC,CAAA;AACO,eAAA,EAAA,MAAM,IAAI,CAAC,YAAY,EAAE,CAAA;AACrB,mBAAA,EAAA,IAAI,CAAC,WAAW,CAAA;AACZ,uBAAA,EAAA,IAAI,CAAC,SAAS,CAAA;AACpB,iBAAA,EAAA,IAAI,CAAC,WAAW,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,GAAG,CAAC,CAAC,GAAG,CAAC,CAAA;;;;;AAKpB,6CAAA,EAAA,IAAI,CAAC,KAAK,CAAA;;;;;oCAKrB,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,IAAI,CAAS,MAAA,EAAA,IAAI,CAAC,QAAQ,EAAE,CAAA;;;;;;AAMnE,cAAA,EAAAA,oBAAQ,CAAC;AACf,YAAA,iBAAiB,EAAE,IAAI;YACvB,4BAA4B,EAAE,IAAI,CAAC,iBAAiB,IAAI,IAAI,CAAC,WAAW,IAAI,CAAC;YAC7E,IAAI,EAAE,IAAI,CAAC,SAAS;SACrB,CAAC,CAAA;;;AAGoB,4BAAA,EAAA,IAAI,CAAC,iBAAiB,CAAA;;;KAG/C,CAAC;KACH;;AA5FM,gBAAM,CAAA,MAAA,GAAG,CAAC,GAAGC,sBAAW,CAAC,MAAM,EAAEC,sBAAkB,CAA7C,CAA+C;AAE5D;AACO,gBAAA,CAAA,YAAY,GAAG;AACpB,IAAA,WAAW,EAAEC,iBAAQ;AACtB,CAFkB,CAEjB;AASOC,gBAAA,CAAA;AAAR,IAAAC,mBAAK,EAAE;AAAmB,CAAA,EAAA,gBAAA,CAAA,SAAA,EAAA,WAAA,EAAA,KAAA,CAAA,CAAA;;;;;"}