@countermeasure-platform/web-components 1.2.1 → 1.2.2-dev.8.1

package/dist/sidebar/component.d.ts

@@ -4,8 +4,12 @@ export declare class SidebarComponent {
     private readonly aside;
     private readonly config;
     private readonly iconSet;
+    private collapseButton;
     constructor(config: SidebarComponentConfig);
     private render;
+    private buildSection;
+    private renderHeader;
+    private renderCollapseButton;
     private renderFooter;
     /** Mark a nav item as active, removing active state from all others. */
     setActive(itemId: string): void;
@@ -19,5 +23,6 @@ export declare class SidebarComponent {
     expand(): void;
     /** Remove the sidebar from the DOM. */
     destroy(): void;
+    private updateCollapseButton;
 }
 //# sourceMappingURL=component.d.ts.map

package/dist/sidebar/component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"component.d.ts","sourceRoot":"","sources":["../../src/sidebar/component.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;GAkBG;AAIH,OAAO,EAAE,KAAK,sBAAsB,EAAE,MAAM,SAAS,CAAA;AA2BrD,qBAAa,gBAAgB;IAC3B,OAAO,CAAC,QAAQ,CAAC,SAAS,CAAa;IACvC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAa;IACnC,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAwB;IAC/C,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAS;gBAErB,MAAM,EAAE,sBAAsB;IAa1C,OAAO,CAAC,MAAM;IAqDd,OAAO,CAAC,YAAY;IA2DpB,wEAAwE;IACxE,SAAS,CAAC,MAAM,EAAE,MAAM,GAAG,IAAI;IAW/B,4EAA4E;IAC5E,WAAW,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI;IAOhD,gEAAgE;IAChE,cAAc,IAAI,IAAI;IAOtB,4BAA4B;IAC5B,QAAQ,IAAI,IAAI;IAIhB,0BAA0B;IAC1B,MAAM,IAAI,IAAI;IAId,uCAAuC;IACvC,OAAO,IAAI,IAAI;CAGhB"}
+{"version":3,"file":"component.d.ts","sourceRoot":"","sources":["../../src/sidebar/component.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;GAkBG;AAKH,OAAO,EAAE,KAAK,sBAAsB,EAAuB,MAAM,SAAS,CAAA;AAgC1E,qBAAa,gBAAgB;IAC3B,OAAO,CAAC,QAAQ,CAAC,SAAS,CAAa;IACvC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAa;IACnC,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAwB;IAC/C,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAS;IACjC,OAAO,CAAC,cAAc,CAAiC;gBAE3C,MAAM,EAAE,sBAAsB;IAiB1C,OAAO,CAAC,MAAM;IAkBd,OAAO,CAAC,YAAY;IAuGpB,OAAO,CAAC,YAAY;IAiDpB,OAAO,CAAC,oBAAoB;IAgC5B,OAAO,CAAC,YAAY;IA2DpB,wEAAwE;IACxE,SAAS,CAAC,MAAM,EAAE,MAAM,GAAG,IAAI;IAW/B,4EAA4E;IAC5E,WAAW,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI;IAShD,gEAAgE;IAChE,cAAc,IAAI,IAAI;IAQtB,4BAA4B;IAC5B,QAAQ,IAAI,IAAI;IAShB,0BAA0B;IAC1B,MAAM,IAAI,IAAI;IASd,uCAAuC;IACvC,OAAO,IAAI,IAAI;IAIf,OAAO,CAAC,oBAAoB;CAe7B"}

package/dist/sidebar/index.d.ts

@@ -11,7 +11,7 @@
  * - Add data-sidebar-backdrop="{variant}" to the backdrop element
  */
 export { SidebarComponent } from './component';
-export type { SidebarComponentConfig, SidebarNavItem, SidebarSection, SidebarUser, SidebarFooterAction, } from './types';
+export type { SidebarComponentConfig, SidebarBrandConfig, SidebarNavItem, SidebarSection, SidebarUser, SidebarFooterAction, } from './types';
 export interface SidebarConfig {
     storageKey?: string;
     mobileBreakpoint?: number;

package/dist/sidebar/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/sidebar/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AAGH,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAA;AAC9C,YAAY,EACV,sBAAsB,EACtB,cAAc,EACd,cAAc,EACd,WAAW,EACX,mBAAmB,GACpB,MAAM,SAAS,CAAA;AAEhB,MAAM,WAAW,aAAa;IAC5B,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,cAAc,CAAC,EAAE,MAAM,CAAA;CACxB;AAED,MAAM,WAAW,mBAAmB;IAClC,OAAO,EAAE,MAAM,CAAA;IACf,MAAM,EAAE,MAAM,CAAA;IACd,YAAY,EAAE,MAAM,CAAA;IACpB,QAAQ,EAAE,MAAM,CAAA;IAChB,cAAc,EAAE,MAAM,CAAA;CACvB;AAUD;;GAEG;AACH,wBAAgB,gBAAgB,CAAC,MAAM,EAAE,aAAa,GAAG,IAAI,CAE5D;AAED;;GAEG;AACH,wBAAgB,QAAQ,IAAI,OAAO,CAElC;AAED;;GAEG;AACH,wBAAgB,cAAc,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAGnD;AAED;;GAEG;AACH,wBAAgB,SAAS,CAAC,GAAG,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,GAAG,IAAI,CAE/D;AAkID;;GAEG;AACH,eAAO,MAAM,oBAAoB,EAAE,mBAAmB,EA6BrD,CAAA;AAED;;GAEG;AACH,wBAAgB,WAAW,CACzB,MAAM,CAAC,EAAE,aAAa,EACtB,aAAa,GAAE,mBAAmB,EAAyB,GAC1D,IAAI,CAUN"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/sidebar/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AAGH,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAA;AAC9C,YAAY,EACV,sBAAsB,EACtB,kBAAkB,EAClB,cAAc,EACd,cAAc,EACd,WAAW,EACX,mBAAmB,GACpB,MAAM,SAAS,CAAA;AAEhB,MAAM,WAAW,aAAa;IAC5B,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,cAAc,CAAC,EAAE,MAAM,CAAA;CACxB;AAED,MAAM,WAAW,mBAAmB;IAClC,OAAO,EAAE,MAAM,CAAA;IACf,MAAM,EAAE,MAAM,CAAA;IACd,YAAY,EAAE,MAAM,CAAA;IACpB,QAAQ,EAAE,MAAM,CAAA;IAChB,cAAc,EAAE,MAAM,CAAA;CACvB;AAUD;;GAEG;AACH,wBAAgB,gBAAgB,CAAC,MAAM,EAAE,aAAa,GAAG,IAAI,CAE5D;AAED;;GAEG;AACH,wBAAgB,QAAQ,IAAI,OAAO,CAElC;AAED;;GAEG;AACH,wBAAgB,cAAc,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAGnD;AAED;;GAEG;AACH,wBAAgB,SAAS,CAAC,GAAG,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,GAAG,IAAI,CAE/D;AAkID;;GAEG;AACH,eAAO,MAAM,oBAAoB,EAAE,mBAAmB,EA6BrD,CAAA;AAED;;GAEG;AACH,wBAAgB,WAAW,CACzB,MAAM,CAAC,EAAE,aAAa,EACtB,aAAa,GAAE,mBAAmB,EAAyB,GAC1D,IAAI,CAUN"}

package/dist/sidebar/index.js

@@ -1,4 +1,4 @@
-import { t as e } from "../component-C1Jiz1Ki.js";
+import { t as e } from "../component-CBXhVCNE.js";
 //#region src/sidebar/index.ts
 var t = {
 	storageKey: "sidebar-collapsed",

package/dist/sidebar/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../src/sidebar/index.ts"],"sourcesContent":["/**\n * Sidebar Module\n *\n * Unified sidebar toggle functionality for CounterMeasure applications.\n * Handles collapsible sidebar for desktop and mobile with localStorage persistence.\n *\n * Usage:\n * - Add data-sidebar=\"{variant}\" to your sidebar element (e.g., data-sidebar=\"admin\")\n * - Add data-sidebar-toggle to the toggle button\n * - Add data-sidebar-mobile-toggle to the mobile toggle button\n * - Add data-sidebar-backdrop=\"{variant}\" to the backdrop element\n */\n\n// Re-export programmatic sidebar component\nexport { SidebarComponent } from './component'\nexport type {\n  SidebarComponentConfig,\n  SidebarNavItem,\n  SidebarSection,\n  SidebarUser,\n  SidebarFooterAction,\n} from './types'\n\nexport interface SidebarConfig {\n  storageKey?: string\n  mobileBreakpoint?: number\n  collapsedClass?: string\n}\n\nexport interface LegacySidebarConfig {\n  sidebar: string\n  toggle: string\n  mobileToggle: string\n  backdrop: string\n  collapsedClass: string\n}\n\nconst DEFAULT_CONFIG: Required<SidebarConfig> = {\n  storageKey: 'sidebar-collapsed',\n  mobileBreakpoint: 900,\n  collapsedClass: 'sidebar--collapsed',\n}\n\nlet currentConfig: Required<SidebarConfig> = { ...DEFAULT_CONFIG }\n\n/**\n * Configure sidebar settings.\n */\nexport function configureSidebar(config: SidebarConfig): void {\n  currentConfig = { ...DEFAULT_CONFIG, ...config }\n}\n\n/**\n * Check if we're on mobile viewport.\n */\nexport function isMobile(): boolean {\n  return window.innerWidth <= currentConfig.mobileBreakpoint\n}\n\n/**\n * Get stored collapsed state for a sidebar.\n */\nexport function getStoredState(key: string): boolean {\n  const stored = localStorage.getItem(`${currentConfig.storageKey}-${key}`)\n  return stored === 'true'\n}\n\n/**\n * Save collapsed state for a sidebar.\n */\nexport function saveState(key: string, collapsed: boolean): void {\n  localStorage.setItem(`${currentConfig.storageKey}-${key}`, String(collapsed))\n}\n\n/**\n * Close a sidebar (mobile).\n */\nfunction closeSidebar(sidebar: HTMLElement, backdrop: HTMLElement | null): void {\n  sidebar.setAttribute('data-open', 'false')\n  if (backdrop) {\n    backdrop.setAttribute('data-visible', 'false')\n  }\n}\n\n/**\n * Toggle sidebar open state (mobile).\n */\nfunction toggleSidebarOpen(sidebar: HTMLElement, backdrop: HTMLElement | null): void {\n  const isOpen = sidebar.getAttribute('data-open') === 'true'\n  sidebar.setAttribute('data-open', String(!isOpen))\n  if (backdrop) {\n    backdrop.setAttribute('data-visible', String(!isOpen))\n  }\n}\n\ninterface SidebarHandlerParams {\n  sidebar: HTMLElement\n  toggle: HTMLButtonElement | null\n  mobileToggles: HTMLButtonElement[]\n  backdrop: HTMLElement | null\n  collapsedClass: string\n  key: string\n}\n\n/**\n * Attach all sidebar event handlers (shared between unified and legacy init).\n */\nfunction attachSidebarHandlers({\n  sidebar,\n  toggle,\n  mobileToggles,\n  backdrop,\n  collapsedClass,\n  key,\n}: SidebarHandlerParams): void {\n  // Apply stored collapsed state on desktop\n  if (!isMobile() && getStoredState(key)) {\n    sidebar.classList.add(collapsedClass)\n  }\n\n  // Desktop toggle handler\n  if (toggle) {\n    toggle.addEventListener('click', () => {\n      const isCollapsed = sidebar.classList.toggle(collapsedClass)\n      saveState(key, isCollapsed)\n    })\n  }\n\n  // Mobile toggle handler\n  mobileToggles.forEach(mobileToggle => {\n    mobileToggle.addEventListener('click', () => {\n      toggleSidebarOpen(sidebar, backdrop)\n    })\n  })\n\n  // Backdrop click handler\n  if (backdrop) {\n    backdrop.addEventListener('click', () => {\n      closeSidebar(sidebar, backdrop)\n    })\n  }\n\n  // Handle window resize\n  window.addEventListener('resize', () => {\n    if (isMobile()) {\n      closeSidebar(sidebar, backdrop)\n    }\n  })\n\n  // Close sidebar on escape key\n  document.addEventListener('keydown', e => {\n    if (e.key === 'Escape' && sidebar.getAttribute('data-open') === 'true') {\n      closeSidebar(sidebar, backdrop)\n    }\n  })\n}\n\n/**\n * Initialize a single sidebar using the unified data-sidebar attribute.\n */\nfunction initUnifiedSidebar(sidebar: HTMLElement): void {\n  const variant = sidebar.getAttribute('data-sidebar')\n  if (variant === null || variant === '') {\n    return\n  }\n\n  attachSidebarHandlers({\n    sidebar,\n    toggle: sidebar.querySelector<HTMLButtonElement>('[data-sidebar-toggle]'),\n    mobileToggles: Array.from(\n      document.querySelectorAll<HTMLButtonElement>('[data-sidebar-mobile-toggle]')\n    ),\n    backdrop: document.querySelector<HTMLElement>(`[data-sidebar-backdrop=\"${variant}\"]`),\n    collapsedClass: currentConfig.collapsedClass,\n    key: variant,\n  })\n}\n\n/**\n * Initialize a legacy sidebar (backwards compatibility).\n */\nfunction initLegacySidebar(config: LegacySidebarConfig): void {\n  const sidebar = document.querySelector<HTMLElement>(config.sidebar)\n  if (!sidebar) {\n    return\n  }\n\n  // Skip if this sidebar uses the new unified approach\n  if (sidebar.hasAttribute('data-sidebar')) {\n    return\n  }\n\n  attachSidebarHandlers({\n    sidebar,\n    toggle: document.querySelector<HTMLButtonElement>(config.toggle),\n    mobileToggles: Array.from(document.querySelectorAll<HTMLButtonElement>(config.mobileToggle)),\n    backdrop: document.querySelector<HTMLElement>(config.backdrop),\n    collapsedClass: config.collapsedClass,\n    key: config.sidebar.replace(/[^a-z]/g, ''),\n  })\n}\n\n/**\n * Default legacy sidebar configurations for CounterMeasure apps.\n */\nexport const defaultLegacyConfigs: LegacySidebarConfig[] = [\n  {\n    sidebar: '.page__sidebar',\n    toggle: '[data-page-sidebar-toggle]',\n    mobileToggle: '[data-page-mobile-toggle]',\n    backdrop: '.sidebar-backdrop',\n    collapsedClass: 'page__sidebar--collapsed',\n  },\n  {\n    sidebar: '.chat-sidebar',\n    toggle: '[data-chat-sidebar-toggle]',\n    mobileToggle: '.chat-header__menu-toggle',\n    backdrop: '.chat-sidebar-backdrop',\n    collapsedClass: 'chat-sidebar--collapsed',\n  },\n  {\n    sidebar: '.files-sidebar',\n    toggle: '[data-files-sidebar-toggle]',\n    mobileToggle: '[data-files-mobile-toggle]',\n    backdrop: '.files-sidebar-backdrop',\n    collapsedClass: 'files-sidebar--collapsed',\n  },\n  {\n    sidebar: '.storage-sidebar',\n    toggle: '[data-storage-sidebar-toggle]',\n    mobileToggle: '[data-storage-mobile-toggle]',\n    backdrop: '.storage-sidebar-backdrop',\n    collapsedClass: 'storage-sidebar--collapsed',\n  },\n]\n\n/**\n * Initialize all sidebars (both new unified and legacy).\n */\nexport function initSidebar(\n  config?: SidebarConfig,\n  legacyConfigs: LegacySidebarConfig[] = defaultLegacyConfigs\n): void {\n  if (config) {\n    configureSidebar(config)\n  }\n\n  // Initialize new unified sidebars\n  document.querySelectorAll<HTMLElement>('[data-sidebar]').forEach(initUnifiedSidebar)\n\n  // Initialize legacy sidebars for backwards compatibility\n  legacyConfigs.forEach(initLegacySidebar)\n}\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":[],"sources":["../../src/sidebar/index.ts"],"sourcesContent":["/**\n * Sidebar Module\n *\n * Unified sidebar toggle functionality for CounterMeasure applications.\n * Handles collapsible sidebar for desktop and mobile with localStorage persistence.\n *\n * Usage:\n * - Add data-sidebar=\"{variant}\" to your sidebar element (e.g., data-sidebar=\"admin\")\n * - Add data-sidebar-toggle to the toggle button\n * - Add data-sidebar-mobile-toggle to the mobile toggle button\n * - Add data-sidebar-backdrop=\"{variant}\" to the backdrop element\n */\n\n// Re-export programmatic sidebar component\nexport { SidebarComponent } from './component'\nexport type {\n  SidebarComponentConfig,\n  SidebarBrandConfig,\n  SidebarNavItem,\n  SidebarSection,\n  SidebarUser,\n  SidebarFooterAction,\n} from './types'\n\nexport interface SidebarConfig {\n  storageKey?: string\n  mobileBreakpoint?: number\n  collapsedClass?: string\n}\n\nexport interface LegacySidebarConfig {\n  sidebar: string\n  toggle: string\n  mobileToggle: string\n  backdrop: string\n  collapsedClass: string\n}\n\nconst DEFAULT_CONFIG: Required<SidebarConfig> = {\n  storageKey: 'sidebar-collapsed',\n  mobileBreakpoint: 900,\n  collapsedClass: 'sidebar--collapsed',\n}\n\nlet currentConfig: Required<SidebarConfig> = { ...DEFAULT_CONFIG }\n\n/**\n * Configure sidebar settings.\n */\nexport function configureSidebar(config: SidebarConfig): void {\n  currentConfig = { ...DEFAULT_CONFIG, ...config }\n}\n\n/**\n * Check if we're on mobile viewport.\n */\nexport function isMobile(): boolean {\n  return window.innerWidth <= currentConfig.mobileBreakpoint\n}\n\n/**\n * Get stored collapsed state for a sidebar.\n */\nexport function getStoredState(key: string): boolean {\n  const stored = localStorage.getItem(`${currentConfig.storageKey}-${key}`)\n  return stored === 'true'\n}\n\n/**\n * Save collapsed state for a sidebar.\n */\nexport function saveState(key: string, collapsed: boolean): void {\n  localStorage.setItem(`${currentConfig.storageKey}-${key}`, String(collapsed))\n}\n\n/**\n * Close a sidebar (mobile).\n */\nfunction closeSidebar(sidebar: HTMLElement, backdrop: HTMLElement | null): void {\n  sidebar.setAttribute('data-open', 'false')\n  if (backdrop) {\n    backdrop.setAttribute('data-visible', 'false')\n  }\n}\n\n/**\n * Toggle sidebar open state (mobile).\n */\nfunction toggleSidebarOpen(sidebar: HTMLElement, backdrop: HTMLElement | null): void {\n  const isOpen = sidebar.getAttribute('data-open') === 'true'\n  sidebar.setAttribute('data-open', String(!isOpen))\n  if (backdrop) {\n    backdrop.setAttribute('data-visible', String(!isOpen))\n  }\n}\n\ninterface SidebarHandlerParams {\n  sidebar: HTMLElement\n  toggle: HTMLButtonElement | null\n  mobileToggles: HTMLButtonElement[]\n  backdrop: HTMLElement | null\n  collapsedClass: string\n  key: string\n}\n\n/**\n * Attach all sidebar event handlers (shared between unified and legacy init).\n */\nfunction attachSidebarHandlers({\n  sidebar,\n  toggle,\n  mobileToggles,\n  backdrop,\n  collapsedClass,\n  key,\n}: SidebarHandlerParams): void {\n  // Apply stored collapsed state on desktop\n  if (!isMobile() && getStoredState(key)) {\n    sidebar.classList.add(collapsedClass)\n  }\n\n  // Desktop toggle handler\n  if (toggle) {\n    toggle.addEventListener('click', () => {\n      const isCollapsed = sidebar.classList.toggle(collapsedClass)\n      saveState(key, isCollapsed)\n    })\n  }\n\n  // Mobile toggle handler\n  mobileToggles.forEach(mobileToggle => {\n    mobileToggle.addEventListener('click', () => {\n      toggleSidebarOpen(sidebar, backdrop)\n    })\n  })\n\n  // Backdrop click handler\n  if (backdrop) {\n    backdrop.addEventListener('click', () => {\n      closeSidebar(sidebar, backdrop)\n    })\n  }\n\n  // Handle window resize\n  window.addEventListener('resize', () => {\n    if (isMobile()) {\n      closeSidebar(sidebar, backdrop)\n    }\n  })\n\n  // Close sidebar on escape key\n  document.addEventListener('keydown', e => {\n    if (e.key === 'Escape' && sidebar.getAttribute('data-open') === 'true') {\n      closeSidebar(sidebar, backdrop)\n    }\n  })\n}\n\n/**\n * Initialize a single sidebar using the unified data-sidebar attribute.\n */\nfunction initUnifiedSidebar(sidebar: HTMLElement): void {\n  const variant = sidebar.getAttribute('data-sidebar')\n  if (variant === null || variant === '') {\n    return\n  }\n\n  attachSidebarHandlers({\n    sidebar,\n    toggle: sidebar.querySelector<HTMLButtonElement>('[data-sidebar-toggle]'),\n    mobileToggles: Array.from(\n      document.querySelectorAll<HTMLButtonElement>('[data-sidebar-mobile-toggle]')\n    ),\n    backdrop: document.querySelector<HTMLElement>(`[data-sidebar-backdrop=\"${variant}\"]`),\n    collapsedClass: currentConfig.collapsedClass,\n    key: variant,\n  })\n}\n\n/**\n * Initialize a legacy sidebar (backwards compatibility).\n */\nfunction initLegacySidebar(config: LegacySidebarConfig): void {\n  const sidebar = document.querySelector<HTMLElement>(config.sidebar)\n  if (!sidebar) {\n    return\n  }\n\n  // Skip if this sidebar uses the new unified approach\n  if (sidebar.hasAttribute('data-sidebar')) {\n    return\n  }\n\n  attachSidebarHandlers({\n    sidebar,\n    toggle: document.querySelector<HTMLButtonElement>(config.toggle),\n    mobileToggles: Array.from(document.querySelectorAll<HTMLButtonElement>(config.mobileToggle)),\n    backdrop: document.querySelector<HTMLElement>(config.backdrop),\n    collapsedClass: config.collapsedClass,\n    key: config.sidebar.replace(/[^a-z]/g, ''),\n  })\n}\n\n/**\n * Default legacy sidebar configurations for CounterMeasure apps.\n */\nexport const defaultLegacyConfigs: LegacySidebarConfig[] = [\n  {\n    sidebar: '.page__sidebar',\n    toggle: '[data-page-sidebar-toggle]',\n    mobileToggle: '[data-page-mobile-toggle]',\n    backdrop: '.sidebar-backdrop',\n    collapsedClass: 'page__sidebar--collapsed',\n  },\n  {\n    sidebar: '.chat-sidebar',\n    toggle: '[data-chat-sidebar-toggle]',\n    mobileToggle: '.chat-header__menu-toggle',\n    backdrop: '.chat-sidebar-backdrop',\n    collapsedClass: 'chat-sidebar--collapsed',\n  },\n  {\n    sidebar: '.files-sidebar',\n    toggle: '[data-files-sidebar-toggle]',\n    mobileToggle: '[data-files-mobile-toggle]',\n    backdrop: '.files-sidebar-backdrop',\n    collapsedClass: 'files-sidebar--collapsed',\n  },\n  {\n    sidebar: '.storage-sidebar',\n    toggle: '[data-storage-sidebar-toggle]',\n    mobileToggle: '[data-storage-mobile-toggle]',\n    backdrop: '.storage-sidebar-backdrop',\n    collapsedClass: 'storage-sidebar--collapsed',\n  },\n]\n\n/**\n * Initialize all sidebars (both new unified and legacy).\n */\nexport function initSidebar(\n  config?: SidebarConfig,\n  legacyConfigs: LegacySidebarConfig[] = defaultLegacyConfigs\n): void {\n  if (config) {\n    configureSidebar(config)\n  }\n\n  // Initialize new unified sidebars\n  document.querySelectorAll<HTMLElement>('[data-sidebar]').forEach(initUnifiedSidebar)\n\n  // Initialize legacy sidebars for backwards compatibility\n  legacyConfigs.forEach(initLegacySidebar)\n}\n"],"mappings":"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"}

package/dist/sidebar/types.d.ts

@@ -1,3 +1,4 @@
+import { BrandSize } from '../components/brand';
 import { IconSet } from '../icons/index';
 export interface SidebarNavItem {
     /** Stable identifier used for selection and badge updates. */
@@ -8,6 +9,11 @@ export interface SidebarNavItem {
     icon?: string;
     /** Numeric badge displayed at the trailing edge of the row. */
     badge?: number;
+    /**
+     * Visual tone for the badge.
+     * @default 'primary'
+     */
+    badgeTone?: 'default' | 'primary' | 'amber' | 'cyan' | 'rose' | 'warning' | 'error';
     /** Called when the item is activated. */
     onClick?: () => void;
 }
@@ -18,6 +24,20 @@ export interface SidebarSection {
     label?: string;
     /** Nav items rendered within this section. */
     items: SidebarNavItem[];
+    /**
+     * Render the section as a collapsible accordion group with a clickable
+     * header instead of a flat label. When set, `label` is rendered as the
+     * toggle and items collapse/expand on click.
+     * @default false
+     */
+    collapsible?: boolean;
+    /**
+     * Initial expanded state when `collapsible` is true.
+     * @default true
+     */
+    defaultExpanded?: boolean;
+    /** Optional icon for the collapsible group header. */
+    icon?: string;
 }
 export interface SidebarUser {
     /** Display name shown in the footer. */
@@ -38,6 +58,26 @@ export interface SidebarFooterAction {
     /** Called when the action is activated. */
     onClick?: () => void;
 }
+export interface SidebarBrandConfig {
+    /** Accessible brand label. */
+    label?: string;
+    /** Brand mark size. */
+    markSize?: BrandSize | number;
+    /**
+     * Show the COUNTERMEASURE wordmark next to the diamond.
+     * @default true
+     */
+    showWordmark?: boolean;
+    /** Optional link target for the brand surface. */
+    href?: string;
+    /** Called when the brand surface is activated. */
+    onClick?: () => void;
+    /**
+     * Render the brand as decorative.
+     * @default false
+     */
+    decorative?: boolean;
+}
 export interface SidebarComponentConfig {
     /** Container element (or selector) the sidebar is mounted into. */
     container: HTMLElement | string;
@@ -45,6 +85,19 @@ export interface SidebarComponentConfig {
     variant?: string;
     /** Sections rendered top-to-bottom. */
     sections: SidebarSection[];
+    /** Optional brand header rendered above the navigation. */
+    brand?: SidebarBrandConfig;
+    /**
+     * Render the shared edge-docked collapse control.
+     * @default false
+     */
+    collapsible?: boolean;
+    /**
+     * Keep the collapse control visible instead of hover/focus-only.
+     * Useful for docs and constrained previews.
+     * @default false
+     */
+    collapseButtonVisible?: boolean;
     /** Optional user surface rendered in the footer. */
     user?: SidebarUser;
     /** Footer action buttons rendered next to the user surface. */
@@ -54,6 +107,12 @@ export interface SidebarComponentConfig {
      * @default 'lucide'
      */
     iconSet?: IconSet;
+    /**
+     * Initial collapsed state. When `collapsible` is true the collapse button
+     * starts pointing the matching direction.
+     * @default false
+     */
+    collapsed?: boolean;
     /** Called when a nav item is activated. */
     onNavigate?: (item: SidebarNavItem) => void;
     /** Called when the sidebar's collapsed state changes. */

package/dist/sidebar/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/sidebar/types.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,KAAK,OAAO,EAAE,MAAM,gBAAgB,CAAA;AAE7C,MAAM,WAAW,cAAc;IAC7B,8DAA8D;IAC9D,EAAE,EAAE,MAAM,CAAA;IACV,iDAAiD;IACjD,KAAK,EAAE,MAAM,CAAA;IACb,sDAAsD;IACtD,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,+DAA+D;IAC/D,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,yCAAyC;IACzC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;CACrB;AAED,MAAM,WAAW,cAAc;IAC7B,iCAAiC;IACjC,EAAE,EAAE,MAAM,CAAA;IACV,gCAAgC;IAChC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,8CAA8C;IAC9C,KAAK,EAAE,cAAc,EAAE,CAAA;CACxB;AAED,MAAM,WAAW,WAAW;IAC1B,wCAAwC;IACxC,IAAI,EAAE,MAAM,CAAA;CACb;AAED,MAAM,WAAW,mBAAmB;IAClC,wCAAwC;IACxC,EAAE,EAAE,MAAM,CAAA;IACV,sDAAsD;IACtD,IAAI,EAAE,MAAM,CAAA;IACZ,iDAAiD;IACjD,KAAK,EAAE,MAAM,CAAA;IACb;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,2CAA2C;IAC3C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;CACrB;AAED,MAAM,WAAW,sBAAsB;IACrC,mEAAmE;IACnE,SAAS,EAAE,WAAW,GAAG,MAAM,CAAA;IAC/B,yEAAyE;IACzE,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,uCAAuC;IACvC,QAAQ,EAAE,cAAc,EAAE,CAAA;IAC1B,oDAAoD;IACpD,IAAI,CAAC,EAAE,WAAW,CAAA;IAClB,+DAA+D;IAC/D,aAAa,CAAC,EAAE,mBAAmB,EAAE,CAAA;IACrC;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,2CAA2C;IAC3C,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,cAAc,KAAK,IAAI,CAAA;IAC3C,yDAAyD;IACzD,UAAU,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAA;CAC1C"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/sidebar/types.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,qBAAqB,CAAA;AACpD,OAAO,EAAE,KAAK,OAAO,EAAE,MAAM,gBAAgB,CAAA;AAE7C,MAAM,WAAW,cAAc;IAC7B,8DAA8D;IAC9D,EAAE,EAAE,MAAM,CAAA;IACV,iDAAiD;IACjD,KAAK,EAAE,MAAM,CAAA;IACb,sDAAsD;IACtD,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,+DAA+D;IAC/D,KAAK,CAAC,EAAE,MAAM,CAAA;IACd;;;OAGG;IACH,SAAS,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,GAAG,MAAM,GAAG,SAAS,GAAG,OAAO,CAAA;IACnF,yCAAyC;IACzC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;CACrB;AAED,MAAM,WAAW,cAAc;IAC7B,iCAAiC;IACjC,EAAE,EAAE,MAAM,CAAA;IACV,gCAAgC;IAChC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,8CAA8C;IAC9C,KAAK,EAAE,cAAc,EAAE,CAAA;IACvB;;;;;OAKG;IACH,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,sDAAsD;IACtD,IAAI,CAAC,EAAE,MAAM,CAAA;CACd;AAED,MAAM,WAAW,WAAW;IAC1B,wCAAwC;IACxC,IAAI,EAAE,MAAM,CAAA;CACb;AAED,MAAM,WAAW,mBAAmB;IAClC,wCAAwC;IACxC,EAAE,EAAE,MAAM,CAAA;IACV,sDAAsD;IACtD,IAAI,EAAE,MAAM,CAAA;IACZ,iDAAiD;IACjD,KAAK,EAAE,MAAM,CAAA;IACb;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,2CAA2C;IAC3C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;CACrB;AAED,MAAM,WAAW,kBAAkB;IACjC,8BAA8B;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,uBAAuB;IACvB,QAAQ,CAAC,EAAE,SAAS,GAAG,MAAM,CAAA;IAC7B;;;OAGG;IACH,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,kDAAkD;IAClD,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,kDAAkD;IAClD,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAA;CACrB;AAED,MAAM,WAAW,sBAAsB;IACrC,mEAAmE;IACnE,SAAS,EAAE,WAAW,GAAG,MAAM,CAAA;IAC/B,yEAAyE;IACzE,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,uCAAuC;IACvC,QAAQ,EAAE,cAAc,EAAE,CAAA;IAC1B,2DAA2D;IAC3D,KAAK,CAAC,EAAE,kBAAkB,CAAA;IAC1B;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB;;;;OAIG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAA;IAC/B,oDAAoD;IACpD,IAAI,CAAC,EAAE,WAAW,CAAA;IAClB,+DAA+D;IAC/D,aAAa,CAAC,EAAE,mBAAmB,EAAE,CAAA;IACrC;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,2CAA2C;IAC3C,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,cAAc,KAAK,IAAI,CAAA;IAC3C,yDAAyD;IACzD,UAAU,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAA;CAC1C"}