@sekiui/elements 0.0.56 → 0.0.57

package/dist/types/components.d.ts

@@ -7,9 +7,11 @@
 import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
 import { Event } from "./stencil-public-runtime";
 import { SelectChangeEventDetail, SelectOpenChangeEventDetail, SelectPlacement, SelectValidateEventDetail, SelectValue } from "./utils/select";
+import { CollapsedChangeDetail, CollapseModeChangeDetail, MobileStateChangeDetail, NavigateDetail, OpenChangeDetail, SidebarGroupProps, SidebarMenuItemProps, SidebarMenuSubProps, SidebarProps, SidebarState, SidebarTriggerProps, VariantChangeDetail } from "./components/sidebar/types";
 import { TooltipHideDetail, TooltipPositionedDetail, TooltipShowDetail, TooltipSide } from "./components/tooltip/seki-tooltip";
 export { Event } from "./stencil-public-runtime";
 export { SelectChangeEventDetail, SelectOpenChangeEventDetail, SelectPlacement, SelectValidateEventDetail, SelectValue } from "./utils/select";
+export { CollapsedChangeDetail, CollapseModeChangeDetail, MobileStateChangeDetail, NavigateDetail, OpenChangeDetail, SidebarGroupProps, SidebarMenuItemProps, SidebarMenuSubProps, SidebarProps, SidebarState, SidebarTriggerProps, VariantChangeDetail } from "./components/sidebar/types";
 export { TooltipHideDetail, TooltipPositionedDetail, TooltipShowDetail, TooltipSide } from "./components/tooltip/seki-tooltip";
 export namespace Components {
     interface SekiButton {
@@ -416,6 +418,194 @@ export namespace Components {
     }
     interface SekiSelectTrigger {
     }
+    interface SekiSidebar {
+        /**
+          * Close the sidebar (set isOpen=false)
+          * @returns
+         */
+        "close": () => Promise<void>;
+        /**
+          * Collapse mechanism: offcanvas (slides), icon (shrinks), or none (fixed)
+          * @type {'offcanvas' | 'icon' | 'none'}
+          * @default 'offcanvas'
+         */
+        "collapseMode": SidebarProps['collapseMode'];
+        /**
+          * Initial open/closed state
+          * @type {boolean}
+          * @default true
+         */
+        "defaultOpen": boolean;
+        /**
+          * Get current sidebar state
+          * @returns
+         */
+        "getState": () => Promise<SidebarState>;
+        /**
+          * Viewport width for mobile detection (px)
+          * @type {number}
+          * @default 768
+         */
+        "mobileBreakpoint": number;
+        /**
+          * Callback fired when open state changes
+         */
+        "onOpenChange"?: (isOpen: boolean) => void;
+        /**
+          * Open the sidebar (set isOpen=true)
+          * @returns
+         */
+        "open": () => Promise<void>;
+        /**
+          * Storage key for persisted state
+          * @type {string}
+          * @default 'seki-sidebar-state'
+         */
+        "persistenceKey": string;
+        /**
+          * Persist state to localStorage
+          * @type {boolean}
+          * @default false
+         */
+        "persistent": boolean;
+        /**
+          * Update sidebar state
+          * @param state - Partial state object
+          * @returns
+         */
+        "setState": (state: Partial<SidebarState>) => Promise<void>;
+        /**
+          * Position: left or right side of viewport
+          * @type {'left' | 'right'}
+          * @default 'left'
+         */
+        "side": SidebarProps['side'];
+        /**
+          * Toggle the sidebar open/closed state
+          * @returns
+         */
+        "toggle": () => Promise<void>;
+        /**
+          * Layout variant: standard, floating (detached), or inset
+          * @type {'sidebar' | 'floating' | 'inset'}
+          * @default 'sidebar'
+         */
+        "variant": SidebarProps['variant'];
+    }
+    interface SekiSidebarContent {
+    }
+    interface SekiSidebarFooter {
+    }
+    interface SekiSidebarGroup {
+        /**
+          * Optional action button configuration
+          * @type {object}
+         */
+        "action"?: SidebarGroupProps['action'];
+        /**
+          * Allow collapsing this group
+          * @type {boolean}
+          * @default false
+         */
+        "collapsible": boolean;
+        /**
+          * Initial collapsed state
+          * @type {boolean}
+          * @default false
+         */
+        "defaultCollapsed": boolean;
+        /**
+          * Get current collapsed state
+         */
+        "isCollapsedState": () => Promise<boolean>;
+        /**
+          * Set collapsed state
+         */
+        "setCollapsed": (collapsed: boolean) => Promise<void>;
+        /**
+          * Section header text (optional)
+          * @type {string}
+         */
+        "title"?: SidebarGroupProps['title'];
+    }
+    interface SekiSidebarHeader {
+    }
+    interface SekiSidebarMenu {
+    }
+    interface SekiSidebarMenuItem {
+        /**
+          * ARIA current value for active items
+          * @type {string}
+          * @default 'page'
+         */
+        "ariaCurrentValue": SidebarMenuItemProps['ariaCurrentValue'];
+        /**
+          * Accessibility label override
+          * @type {string}
+         */
+        "ariaLabel"?: SidebarMenuItemProps['ariaLabel'];
+        /**
+          * Badge indicator for the item
+          * @type {object}
+         */
+        "badge"?: SidebarMenuItemProps['badge'];
+        /**
+          * Disable interaction
+          * @type {boolean}
+          * @default false
+         */
+        "disabled": boolean;
+        /**
+          * Navigation URL (optional)
+          * @type {string}
+         */
+        "href"?: SidebarMenuItemProps['href'];
+        /**
+          * Highlight as current page
+          * @type {boolean}
+          * @default false
+         */
+        "isActive": boolean;
+        /**
+          * Link target: _blank, _self, etc.
+          * @type {string}
+         */
+        "target"?: SidebarMenuItemProps['target'];
+    }
+    interface SekiSidebarMenuSub {
+        /**
+          * Initial collapsed state
+          * @type {boolean}
+          * @default false
+         */
+        "defaultCollapsed": boolean;
+        /**
+          * Get current collapsed state
+         */
+        "isCollapsedState": () => Promise<boolean>;
+        /**
+          * Label for the submenu (shown when expanded)
+          * @type {string}
+         */
+        "label"?: SidebarMenuSubProps['label'];
+        /**
+          * Set collapsed state
+         */
+        "setCollapsed": (collapsed: boolean) => Promise<void>;
+    }
+    interface SekiSidebarTrigger {
+        /**
+          * Accessibility label for the button
+          * @type {string}
+          * @default 'Toggle sidebar'
+         */
+        "ariaLabel": SidebarTriggerProps['ariaLabel'];
+        /**
+          * Icon name or SVG path (optional)
+          * @type {string}
+         */
+        "icon": SidebarTriggerProps['icon'];
+    }
     /**
      * @component seki-skeleton
      * @description A loading placeholder component that displays an animated skeleton while content is loading
@@ -534,6 +724,22 @@ export interface SekiSelectOptionCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLSekiSelectOptionElement;
 }
+export interface SekiSidebarCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLSekiSidebarElement;
+}
+export interface SekiSidebarGroupCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLSekiSidebarGroupElement;
+}
+export interface SekiSidebarMenuItemCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLSekiSidebarMenuItemElement;
+}
+export interface SekiSidebarMenuSubCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLSekiSidebarMenuSubElement;
+}
 export interface SekiSwitchCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLSekiSwitchElement;
@@ -762,6 +968,107 @@ declare global {
         prototype: HTMLSekiSelectTriggerElement;
         new (): HTMLSekiSelectTriggerElement;
     };
+    interface HTMLSekiSidebarElementEventMap {
+        "openChange": OpenChangeDetail;
+        "variantChange": VariantChangeDetail;
+        "collapseModeChange": CollapseModeChangeDetail;
+        "mobileStateChange": MobileStateChangeDetail;
+    }
+    interface HTMLSekiSidebarElement extends Components.SekiSidebar, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLSekiSidebarElementEventMap>(type: K, listener: (this: HTMLSekiSidebarElement, ev: SekiSidebarCustomEvent<HTMLSekiSidebarElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLSekiSidebarElementEventMap>(type: K, listener: (this: HTMLSekiSidebarElement, ev: SekiSidebarCustomEvent<HTMLSekiSidebarElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLSekiSidebarElement: {
+        prototype: HTMLSekiSidebarElement;
+        new (): HTMLSekiSidebarElement;
+    };
+    interface HTMLSekiSidebarContentElement extends Components.SekiSidebarContent, HTMLStencilElement {
+    }
+    var HTMLSekiSidebarContentElement: {
+        prototype: HTMLSekiSidebarContentElement;
+        new (): HTMLSekiSidebarContentElement;
+    };
+    interface HTMLSekiSidebarFooterElement extends Components.SekiSidebarFooter, HTMLStencilElement {
+    }
+    var HTMLSekiSidebarFooterElement: {
+        prototype: HTMLSekiSidebarFooterElement;
+        new (): HTMLSekiSidebarFooterElement;
+    };
+    interface HTMLSekiSidebarGroupElementEventMap {
+        "collapsedChange": CollapsedChangeDetail;
+    }
+    interface HTMLSekiSidebarGroupElement extends Components.SekiSidebarGroup, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLSekiSidebarGroupElementEventMap>(type: K, listener: (this: HTMLSekiSidebarGroupElement, ev: SekiSidebarGroupCustomEvent<HTMLSekiSidebarGroupElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLSekiSidebarGroupElementEventMap>(type: K, listener: (this: HTMLSekiSidebarGroupElement, ev: SekiSidebarGroupCustomEvent<HTMLSekiSidebarGroupElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLSekiSidebarGroupElement: {
+        prototype: HTMLSekiSidebarGroupElement;
+        new (): HTMLSekiSidebarGroupElement;
+    };
+    interface HTMLSekiSidebarHeaderElement extends Components.SekiSidebarHeader, HTMLStencilElement {
+    }
+    var HTMLSekiSidebarHeaderElement: {
+        prototype: HTMLSekiSidebarHeaderElement;
+        new (): HTMLSekiSidebarHeaderElement;
+    };
+    interface HTMLSekiSidebarMenuElement extends Components.SekiSidebarMenu, HTMLStencilElement {
+    }
+    var HTMLSekiSidebarMenuElement: {
+        prototype: HTMLSekiSidebarMenuElement;
+        new (): HTMLSekiSidebarMenuElement;
+    };
+    interface HTMLSekiSidebarMenuItemElementEventMap {
+        "navigate": NavigateDetail;
+    }
+    interface HTMLSekiSidebarMenuItemElement extends Components.SekiSidebarMenuItem, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLSekiSidebarMenuItemElementEventMap>(type: K, listener: (this: HTMLSekiSidebarMenuItemElement, ev: SekiSidebarMenuItemCustomEvent<HTMLSekiSidebarMenuItemElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLSekiSidebarMenuItemElementEventMap>(type: K, listener: (this: HTMLSekiSidebarMenuItemElement, ev: SekiSidebarMenuItemCustomEvent<HTMLSekiSidebarMenuItemElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLSekiSidebarMenuItemElement: {
+        prototype: HTMLSekiSidebarMenuItemElement;
+        new (): HTMLSekiSidebarMenuItemElement;
+    };
+    interface HTMLSekiSidebarMenuSubElementEventMap {
+        "collapsedChange": CollapsedChangeDetail;
+    }
+    interface HTMLSekiSidebarMenuSubElement extends Components.SekiSidebarMenuSub, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLSekiSidebarMenuSubElementEventMap>(type: K, listener: (this: HTMLSekiSidebarMenuSubElement, ev: SekiSidebarMenuSubCustomEvent<HTMLSekiSidebarMenuSubElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLSekiSidebarMenuSubElementEventMap>(type: K, listener: (this: HTMLSekiSidebarMenuSubElement, ev: SekiSidebarMenuSubCustomEvent<HTMLSekiSidebarMenuSubElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLSekiSidebarMenuSubElement: {
+        prototype: HTMLSekiSidebarMenuSubElement;
+        new (): HTMLSekiSidebarMenuSubElement;
+    };
+    interface HTMLSekiSidebarTriggerElement extends Components.SekiSidebarTrigger, HTMLStencilElement {
+    }
+    var HTMLSekiSidebarTriggerElement: {
+        prototype: HTMLSekiSidebarTriggerElement;
+        new (): HTMLSekiSidebarTriggerElement;
+    };
     /**
      * @component seki-skeleton
      * @description A loading placeholder component that displays an animated skeleton while content is loading
@@ -851,6 +1158,15 @@ declare global {
         "seki-select-group": HTMLSekiSelectGroupElement;
         "seki-select-option": HTMLSekiSelectOptionElement;
         "seki-select-trigger": HTMLSekiSelectTriggerElement;
+        "seki-sidebar": HTMLSekiSidebarElement;
+        "seki-sidebar-content": HTMLSekiSidebarContentElement;
+        "seki-sidebar-footer": HTMLSekiSidebarFooterElement;
+        "seki-sidebar-group": HTMLSekiSidebarGroupElement;
+        "seki-sidebar-header": HTMLSekiSidebarHeaderElement;
+        "seki-sidebar-menu": HTMLSekiSidebarMenuElement;
+        "seki-sidebar-menu-item": HTMLSekiSidebarMenuItemElement;
+        "seki-sidebar-menu-sub": HTMLSekiSidebarMenuSubElement;
+        "seki-sidebar-trigger": HTMLSekiSidebarTriggerElement;
         "seki-skeleton": HTMLSekiSkeletonElement;
         "seki-switch": HTMLSekiSwitchElement;
         "seki-tooltip": HTMLSekiTooltipElement;
@@ -1261,6 +1577,180 @@ declare namespace LocalJSX {
     }
     interface SekiSelectTrigger {
     }
+    interface SekiSidebar {
+        /**
+          * Collapse mechanism: offcanvas (slides), icon (shrinks), or none (fixed)
+          * @type {'offcanvas' | 'icon' | 'none'}
+          * @default 'offcanvas'
+         */
+        "collapseMode"?: SidebarProps['collapseMode'];
+        /**
+          * Initial open/closed state
+          * @type {boolean}
+          * @default true
+         */
+        "defaultOpen"?: boolean;
+        /**
+          * Viewport width for mobile detection (px)
+          * @type {number}
+          * @default 768
+         */
+        "mobileBreakpoint"?: number;
+        /**
+          * Event fired when collapse mode changes
+         */
+        "onCollapseModeChange"?: (event: SekiSidebarCustomEvent<CollapseModeChangeDetail>) => void;
+        /**
+          * Event fired when mobile state changes
+         */
+        "onMobileStateChange"?: (event: SekiSidebarCustomEvent<MobileStateChangeDetail>) => void;
+        /**
+          * Callback fired when open state changes
+         */
+        "onOpenChange"?: (isOpen: boolean) => void;
+        /**
+          * Event fired when sidebar opens/closes
+         */
+        "onOpenChange"?: (event: SekiSidebarCustomEvent<OpenChangeDetail>) => void;
+        /**
+          * Event fired when variant changes
+         */
+        "onVariantChange"?: (event: SekiSidebarCustomEvent<VariantChangeDetail>) => void;
+        /**
+          * Storage key for persisted state
+          * @type {string}
+          * @default 'seki-sidebar-state'
+         */
+        "persistenceKey"?: string;
+        /**
+          * Persist state to localStorage
+          * @type {boolean}
+          * @default false
+         */
+        "persistent"?: boolean;
+        /**
+          * Position: left or right side of viewport
+          * @type {'left' | 'right'}
+          * @default 'left'
+         */
+        "side"?: SidebarProps['side'];
+        /**
+          * Layout variant: standard, floating (detached), or inset
+          * @type {'sidebar' | 'floating' | 'inset'}
+          * @default 'sidebar'
+         */
+        "variant"?: SidebarProps['variant'];
+    }
+    interface SekiSidebarContent {
+    }
+    interface SekiSidebarFooter {
+    }
+    interface SekiSidebarGroup {
+        /**
+          * Optional action button configuration
+          * @type {object}
+         */
+        "action"?: SidebarGroupProps['action'];
+        /**
+          * Allow collapsing this group
+          * @type {boolean}
+          * @default false
+         */
+        "collapsible"?: boolean;
+        /**
+          * Initial collapsed state
+          * @type {boolean}
+          * @default false
+         */
+        "defaultCollapsed"?: boolean;
+        /**
+          * Event fired when collapsed state changes
+         */
+        "onCollapsedChange"?: (event: SekiSidebarGroupCustomEvent<CollapsedChangeDetail>) => void;
+        /**
+          * Section header text (optional)
+          * @type {string}
+         */
+        "title"?: SidebarGroupProps['title'];
+    }
+    interface SekiSidebarHeader {
+    }
+    interface SekiSidebarMenu {
+    }
+    interface SekiSidebarMenuItem {
+        /**
+          * ARIA current value for active items
+          * @type {string}
+          * @default 'page'
+         */
+        "ariaCurrentValue"?: SidebarMenuItemProps['ariaCurrentValue'];
+        /**
+          * Accessibility label override
+          * @type {string}
+         */
+        "ariaLabel"?: SidebarMenuItemProps['ariaLabel'];
+        /**
+          * Badge indicator for the item
+          * @type {object}
+         */
+        "badge"?: SidebarMenuItemProps['badge'];
+        /**
+          * Disable interaction
+          * @type {boolean}
+          * @default false
+         */
+        "disabled"?: boolean;
+        /**
+          * Navigation URL (optional)
+          * @type {string}
+         */
+        "href"?: SidebarMenuItemProps['href'];
+        /**
+          * Highlight as current page
+          * @type {boolean}
+          * @default false
+         */
+        "isActive"?: boolean;
+        /**
+          * Event fired on item click
+         */
+        "onNavigate"?: (event: SekiSidebarMenuItemCustomEvent<NavigateDetail>) => void;
+        /**
+          * Link target: _blank, _self, etc.
+          * @type {string}
+         */
+        "target"?: SidebarMenuItemProps['target'];
+    }
+    interface SekiSidebarMenuSub {
+        /**
+          * Initial collapsed state
+          * @type {boolean}
+          * @default false
+         */
+        "defaultCollapsed"?: boolean;
+        /**
+          * Label for the submenu (shown when expanded)
+          * @type {string}
+         */
+        "label"?: SidebarMenuSubProps['label'];
+        /**
+          * Event fired when collapsed state changes
+         */
+        "onCollapsedChange"?: (event: SekiSidebarMenuSubCustomEvent<CollapsedChangeDetail>) => void;
+    }
+    interface SekiSidebarTrigger {
+        /**
+          * Accessibility label for the button
+          * @type {string}
+          * @default 'Toggle sidebar'
+         */
+        "ariaLabel"?: SidebarTriggerProps['ariaLabel'];
+        /**
+          * Icon name or SVG path (optional)
+          * @type {string}
+         */
+        "icon"?: SidebarTriggerProps['icon'];
+    }
     /**
      * @component seki-skeleton
      * @description A loading placeholder component that displays an animated skeleton while content is loading
@@ -1390,6 +1880,15 @@ declare namespace LocalJSX {
         "seki-select-group": SekiSelectGroup;
         "seki-select-option": SekiSelectOption;
         "seki-select-trigger": SekiSelectTrigger;
+        "seki-sidebar": SekiSidebar;
+        "seki-sidebar-content": SekiSidebarContent;
+        "seki-sidebar-footer": SekiSidebarFooter;
+        "seki-sidebar-group": SekiSidebarGroup;
+        "seki-sidebar-header": SekiSidebarHeader;
+        "seki-sidebar-menu": SekiSidebarMenu;
+        "seki-sidebar-menu-item": SekiSidebarMenuItem;
+        "seki-sidebar-menu-sub": SekiSidebarMenuSub;
+        "seki-sidebar-trigger": SekiSidebarTrigger;
         "seki-skeleton": SekiSkeleton;
         "seki-switch": SekiSwitch;
         "seki-tooltip": SekiTooltip;
@@ -1474,6 +1973,15 @@ declare module "@stencil/core" {
             "seki-select-group": LocalJSX.SekiSelectGroup & JSXBase.HTMLAttributes<HTMLSekiSelectGroupElement>;
             "seki-select-option": LocalJSX.SekiSelectOption & JSXBase.HTMLAttributes<HTMLSekiSelectOptionElement>;
             "seki-select-trigger": LocalJSX.SekiSelectTrigger & JSXBase.HTMLAttributes<HTMLSekiSelectTriggerElement>;
+            "seki-sidebar": LocalJSX.SekiSidebar & JSXBase.HTMLAttributes<HTMLSekiSidebarElement>;
+            "seki-sidebar-content": LocalJSX.SekiSidebarContent & JSXBase.HTMLAttributes<HTMLSekiSidebarContentElement>;
+            "seki-sidebar-footer": LocalJSX.SekiSidebarFooter & JSXBase.HTMLAttributes<HTMLSekiSidebarFooterElement>;
+            "seki-sidebar-group": LocalJSX.SekiSidebarGroup & JSXBase.HTMLAttributes<HTMLSekiSidebarGroupElement>;
+            "seki-sidebar-header": LocalJSX.SekiSidebarHeader & JSXBase.HTMLAttributes<HTMLSekiSidebarHeaderElement>;
+            "seki-sidebar-menu": LocalJSX.SekiSidebarMenu & JSXBase.HTMLAttributes<HTMLSekiSidebarMenuElement>;
+            "seki-sidebar-menu-item": LocalJSX.SekiSidebarMenuItem & JSXBase.HTMLAttributes<HTMLSekiSidebarMenuItemElement>;
+            "seki-sidebar-menu-sub": LocalJSX.SekiSidebarMenuSub & JSXBase.HTMLAttributes<HTMLSekiSidebarMenuSubElement>;
+            "seki-sidebar-trigger": LocalJSX.SekiSidebarTrigger & JSXBase.HTMLAttributes<HTMLSekiSidebarTriggerElement>;
             /**
              * @component seki-skeleton
              * @description A loading placeholder component that displays an animated skeleton while content is loading

package/dist/types/index.d.ts

@@ -1,2 +1,6 @@
 export { Components, JSX } from './components';
 export { SekiSwitch } from './components/switch/seki-switch';
+export * from './services';
+export * from './utils/common';
+export * from './utils/a11y';
+export * from './types';

package/dist/types/services/focus.d.ts

@@ -0,0 +1,74 @@
+/**
+ * Focus Management Service
+ * Provides utilities for focus management, focus traps, and focus restoration
+ */
+export interface FocusTrapOptions {
+    initialFocus?: HTMLElement;
+    restoreFocus?: boolean;
+    allowOutsideClick?: boolean;
+}
+/**
+ * FocusService - Centralized focus management
+ * Provides:
+ * - Focus trap implementation
+ * - Focus restoration
+ * - Focusable element detection
+ * - Focus utilities for accessibility
+ */
+export declare class FocusService {
+    private focusTrapStack;
+    private previouslyFocusedElement;
+    /**
+     * Get all focusable elements within a container
+     * Includes buttons, links, inputs, textareas, selects, and elements with tabindex
+     */
+    getFocusableElements(container?: HTMLElement | Document): HTMLElement[];
+    /**
+     * Check if an element is focusable
+     */
+    isFocusable(element: HTMLElement): boolean;
+    /**
+     * Set focus to an element with optional callbacks
+     */
+    setFocus(element: HTMLElement | null, options?: {
+        preventScroll?: boolean;
+    }): boolean;
+    /**
+     * Trap focus within a container (keyboard navigation stays within bounds)
+     * @param container - The element to trap focus within
+     * @param options - Focus trap options
+     */
+    createFocusTrap(container: HTMLElement, options?: FocusTrapOptions): void;
+    /**
+     * Release focus trap from a container
+     */
+    releaseFocusTrap(container: HTMLElement, restoreFocus?: boolean): void;
+    /**
+     * Get the first focusable element in a container
+     */
+    getFirstFocusable(container?: HTMLElement | Document): HTMLElement | null;
+    /**
+     * Get the last focusable element in a container
+     */
+    getLastFocusable(container?: HTMLElement | Document): HTMLElement | null;
+    /**
+     * Move focus to the next focusable element
+     */
+    focusNext(container?: HTMLElement | Document): boolean;
+    /**
+     * Move focus to the previous focusable element
+     */
+    focusPrevious(container?: HTMLElement | Document): boolean;
+    /**
+     * Clear all focus traps
+     */
+    clearFocusTraps(): void;
+}
+/**
+ * Get the singleton FocusService instance
+ */
+export declare function getFocusService(): FocusService;
+/**
+ * Create a new isolated FocusService instance
+ */
+export declare function createFocusService(): FocusService;

package/dist/types/services/index.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Services Index
+ * Central export point for all application services
+ */
+export * from './keyboard';
+export * from './focus';
+export * from './media-query';