@skewedaspect/sleekspace-ui 0.7.1 → 0.8.1

package/dist/components/Button/SkButton.vue.d.ts

@@ -50,6 +50,13 @@ export interface SkButtonComponentProps extends ComponentCustomColors {
      * @default false
      */
     pressed?: boolean;
+    /**
+     * Opts out of the coarse-pointer touch-target floor (44px minimum on touch devices).
+     * Use for tight toolbars, data tables, or other contexts where a compact size is preferable
+     * to the default touch-friendly floor. On fine-pointer devices (mouse) this has no effect.
+     * @default false
+     */
+    dense?: boolean;
     /**
      * URL for the button to navigate to. When provided, the button renders as an `<a>` element
      * instead of a `<button>`. Use for external links or simple navigation that doesn't require
@@ -87,6 +94,7 @@ declare const __VLS_component: import('vue').DefineComponent<SkButtonComponentPr
     variant: SkButtonVariant;
     loading: boolean;
     pressed: boolean;
+    dense: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;

package/dist/components/NavBar/SkNavBar.vue.d.ts

@@ -19,6 +19,7 @@ export interface SkNavBarComponentProps extends ComponentCustomColors {
 declare function __VLS_template(): {
     attrs: Partial<{}>;
     slots: {
+        leading?(_: {}): any;
         brand?(_: {}): any;
         default?(_: {}): any;
         actions?(_: {}): any;

package/dist/components/NavBar/context.d.ts

@@ -0,0 +1,3 @@
+import { InjectionKey, Ref } from 'vue';
+import { SkNavBarKind } from './types';
+export declare const NAVBAR_KIND_KEY: InjectionKey<Ref<SkNavBarKind>>;

package/dist/components/Page/SkPage.vue.d.ts

@@ -1,60 +1,157 @@
 import { SkThemeName } from '../Theme/types';
-import { SkPageSidebarPosition } from './types';
+import { SkPagePanelMode } from './types';
 export interface SkPageComponentProps {
     /**
-     * Controls which side of the page the sidebar appears on. The sidebar slot content
-     * will be positioned on the specified side, with the main content area filling the
-     * remaining space. Has no effect if the sidebar slot is not provided.
-     * @default 'left'
-     */
-    sidebarPosition?: SkPageSidebarPosition;
-    /**
-     * When true, the header remains fixed at the top of the viewport while the main
-     * content scrolls beneath it. Useful for keeping navigation always accessible.
-     * The content area adjusts its top padding to prevent overlap with the fixed header.
+     * When true, the header remains sticky at the top of the viewport while the main content scrolls.
      * @default false
      */
     fixedHeader?: boolean;
     /**
-     * When true, the footer remains fixed at the bottom of the viewport while the main
-     * content scrolls above it. Useful for persistent action bars or important links.
-     * The content area adjusts its bottom padding to prevent overlap with the fixed footer.
+     * When true, the footer remains sticky at the bottom of the viewport while the main content scrolls.
      * @default false
      */
     fixedFooter?: boolean;
     /**
-     * Custom width for the sidebar region. Accepts any valid CSS width value (px, rem, %, etc.).
-     * When not specified, the sidebar uses the default width defined in the design tokens.
-     * Only applies when the sidebar slot is provided.
+     * Custom width for the sidebar (persistent and drawer). Accepts any CSS length. When not specified,
+     * uses the `--sk-page-sidebar-width` token default (16rem).
      */
     sidebarWidth?: string;
     /**
-     * Optional theme name. When provided, SkPage acts as a theme provider — setting
-     * `data-scheme` on the root element and providing theme context for descendant
-     * components (including portal components like dropdowns and modals).
-     * When omitted, SkPage has no theme behavior.
+     * Custom width for the aside (persistent and drawer). Accepts any CSS length. When not specified,
+     * uses the `--sk-page-aside-width` token default (16rem).
+     */
+    asideWidth?: string;
+    /**
+     * Sidebar rendering mode.
+     * - `auto`: persistent above `sidebarBreakpoint`, drawer below. Default.
+     * - `persistent`: always inline.
+     * - `drawer`: always off-canvas.
+     * @default 'auto'
+     */
+    sidebarMode?: SkPagePanelMode;
+    /**
+     * Aside rendering mode. Mirror of `sidebarMode` for the right-side panel.
+     * @default 'auto'
+     */
+    asideMode?: SkPagePanelMode;
+    /**
+     * Viewport width below which the sidebar's `auto` mode switches to drawer. Accepts any CSS length.
+     * @default '1024px'
+     */
+    sidebarBreakpoint?: string;
+    /**
+     * Viewport width below which the aside's `auto` mode switches to drawer. Accepts any CSS length.
+     * @default '1024px'
+     */
+    asideBreakpoint?: string;
+    /**
+     * Controlled sidebar drawer open state. Bind via `v-model:sidebarOpen` to control programmatically.
+     * When omitted, SkPage manages state internally.
+     */
+    sidebarOpen?: boolean;
+    /**
+     * Controlled aside drawer open state. Bind via `v-model:asideOpen` to control programmatically.
+     * When omitted, SkPage manages state internally.
+     */
+    asideOpen?: boolean;
+    /**
+     * Optional theme name. When provided, SkPage acts as a theme provider -- setting `data-scheme`
+     * on the root element and providing theme context for descendant components (including portal
+     * components like dropdowns and modals).
      */
     theme?: SkThemeName;
+    /**
+     * When true, zeroes out `--sk-page-gap` and `--sk-page-content-padding` so panels and content
+     * sit flush against the header, footer, edges, and each other.
+     * @default false
+     */
+    flush?: boolean;
 }
 declare function __VLS_template(): {
     attrs: Partial<{}>;
-    slots: {
-        header?(_: {}): any;
-        sidebar?(_: {}): any;
-        default?(_: {}): any;
-        footer?(_: {}): any;
+    slots: Readonly<{
+        default?: () => unknown;
+        header?: () => unknown;
+        subheader?: () => unknown;
+        sidebar?: (props: {
+            isDrawer: boolean;
+        }) => unknown;
+        'sidebar-header'?: (props: {
+            isDrawer: boolean;
+        }) => unknown;
+        'sidebar-footer'?: (props: {
+            isDrawer: boolean;
+        }) => unknown;
+        'main-header'?: () => unknown;
+        'main-footer'?: () => unknown;
+        aside?: (props: {
+            isDrawer: boolean;
+        }) => unknown;
+        'aside-header'?: (props: {
+            isDrawer: boolean;
+        }) => unknown;
+        'aside-footer'?: (props: {
+            isDrawer: boolean;
+        }) => unknown;
+        footer?: () => unknown;
+    }> & {
+        default?: () => unknown;
+        header?: () => unknown;
+        subheader?: () => unknown;
+        sidebar?: (props: {
+            isDrawer: boolean;
+        }) => unknown;
+        'sidebar-header'?: (props: {
+            isDrawer: boolean;
+        }) => unknown;
+        'sidebar-footer'?: (props: {
+            isDrawer: boolean;
+        }) => unknown;
+        'main-header'?: () => unknown;
+        'main-footer'?: () => unknown;
+        aside?: (props: {
+            isDrawer: boolean;
+        }) => unknown;
+        'aside-header'?: (props: {
+            isDrawer: boolean;
+        }) => unknown;
+        'aside-footer'?: (props: {
+            isDrawer: boolean;
+        }) => unknown;
+        footer?: () => unknown;
+    };
+    refs: {
+        rootRef: HTMLDivElement;
+        sidebarDrawerRef: HTMLElement;
+        asideDrawerRef: HTMLElement;
     };
-    refs: {};
     rootEl: HTMLDivElement;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
-declare const __VLS_component: import('vue').DefineComponent<SkPageComponentProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<SkPageComponentProps> & Readonly<{}>, {
+declare const __VLS_component: import('vue').DefineComponent<SkPageComponentProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:sidebarOpen": (value: boolean) => any;
+    "update:asideOpen": (value: boolean) => any;
+}, string, import('vue').PublicProps, Readonly<SkPageComponentProps> & Readonly<{
+    "onUpdate:sidebarOpen"?: ((value: boolean) => any) | undefined;
+    "onUpdate:asideOpen"?: ((value: boolean) => any) | undefined;
+}>, {
     theme: SkThemeName;
-    sidebarPosition: SkPageSidebarPosition;
     fixedHeader: boolean;
     fixedFooter: boolean;
     sidebarWidth: string;
-}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+    asideWidth: string;
+    sidebarMode: SkPagePanelMode;
+    asideMode: SkPagePanelMode;
+    sidebarBreakpoint: string;
+    asideBreakpoint: string;
+    sidebarOpen: boolean;
+    asideOpen: boolean;
+    flush: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    rootRef: HTMLDivElement;
+    sidebarDrawerRef: HTMLElement;
+    asideDrawerRef: HTMLElement;
+}, HTMLDivElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

package/dist/components/Page/SkPageSidebarToggle.vue.d.ts

@@ -0,0 +1,41 @@
+import { SkButtonKind } from '../Button/types';
+import { SkPageDrawerSide } from './types';
+export interface SkPageSidebarToggleComponentProps {
+    /**
+     * Which drawer this toggle controls. `sidebar` binds to the left drawer; `aside` binds to the right.
+     * @default 'sidebar'
+     */
+    side?: SkPageDrawerSide;
+    /**
+     * Override the toggle's color kind. By default the toggle inherits the enclosing SkNavBar's
+     * kind (when placed inside one) and falls back to `neutral` otherwise. Pass a kind explicitly
+     * to force a specific color scheme.
+     */
+    kind?: SkButtonKind;
+    /**
+     * Accessible label for the toggle. Screen readers announce this; sighted users see only the glyph.
+     * Defaults to a label matching `side`.
+     */
+    ariaLabel?: string;
+}
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<SkPageSidebarToggleComponentProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<SkPageSidebarToggleComponentProps> & Readonly<{}>, {
+    kind: SkButtonKind;
+    side: SkPageDrawerSide;
+    ariaLabel: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/Page/index.d.ts

@@ -1,2 +1,3 @@
 export { default as SkPage } from './SkPage.vue';
+export { default as SkPageSidebarToggle } from './SkPageSidebarToggle.vue';
 export * from './types';

package/dist/components/Page/types.d.ts

@@ -1,16 +1,39 @@
 import { SkThemeName } from '../Theme/types';
-/** Sidebar position */
-export type SkPageSidebarPosition = 'left' | 'right';
+/**
+ * Sidebar / aside rendering mode.
+ * - `auto`: persistent above the matching breakpoint, drawer below. Default.
+ * - `persistent`: always inline, regardless of viewport size.
+ * - `drawer`: always off-canvas, opens over content.
+ */
+export type SkPagePanelMode = 'auto' | 'persistent' | 'drawer';
+/** @deprecated Use `SkPagePanelMode`. Retained as an alias. */
+export type SkPageSidebarMode = SkPagePanelMode;
+/** Which drawer a toggle button controls. */
+export type SkPageDrawerSide = 'sidebar' | 'aside';
 /** Page props interface */
 export interface SkPageProps {
-    /** Sidebar position */
-    sidebarPosition?: SkPageSidebarPosition;
     /** Fixed header (stays at top when scrolling) */
     fixedHeader?: boolean;
     /** Fixed footer (stays at bottom when scrolling) */
     fixedFooter?: boolean;
-    /** Custom sidebar width */
+    /** Custom sidebar width. CSS length. */
     sidebarWidth?: string;
+    /** Custom aside width. CSS length. */
+    asideWidth?: string;
+    /** Sidebar rendering mode. Defaults to 'auto' (persistent above breakpoint, drawer below) */
+    sidebarMode?: SkPagePanelMode;
+    /** Aside rendering mode. Defaults to 'auto'. */
+    asideMode?: SkPagePanelMode;
+    /** Breakpoint below which sidebar `auto` mode switches to drawer. CSS length. Default: 1024px */
+    sidebarBreakpoint?: string;
+    /** Breakpoint below which aside `auto` mode switches to drawer. CSS length. Default: 1024px */
+    asideBreakpoint?: string;
+    /** Controlled sidebar drawer open state. When omitted, SkPage manages state internally */
+    sidebarOpen?: boolean;
+    /** Controlled aside drawer open state. When omitted, SkPage manages state internally */
+    asideOpen?: boolean;
     /** Optional theme name — when provided, SkPage acts as a theme provider */
     theme?: SkThemeName;
+    /** Flush layout (no default gap/padding around main area or inside content) */
+    flush?: boolean;
 }

package/dist/components/ScrollArea/SkScrollArea.vue.d.ts

@@ -5,6 +5,14 @@ export interface SkScrollAreaComponentProps {
     kind?: SkScrollAreaKind;
     baseColor?: string;
     textColor?: string;
+    /**
+     * When true, fade the scrollable edges with a CSS mask so content visibly tapers
+     * into/out of the viewport. Applies to whichever axis (or both) is scrollable.
+     * Override the fade distance via the `--sk-scroll-area-fade` custom property
+     * (default 1.5rem).
+     * @default false
+     */
+    fade?: boolean;
 }
 declare function __VLS_template(): {
     attrs: Partial<{}>;
@@ -21,6 +29,7 @@ declare const __VLS_component: import('vue').DefineComponent<SkScrollAreaCompone
     baseColor: string;
     textColor: string;
     orientation: SkScrollAreaOrientation;
+    fade: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;

package/dist/components/Select/SkSelectItem.vue.d.ts

@@ -24,9 +24,7 @@ declare function __VLS_template(): {
                 readonly asChild?: boolean | undefined;
                 readonly as?: (import('reka-ui').AsTag | import('vue').Component) | undefined;
             } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps;
-            $attrs: {
-                [x: string]: unknown;
-            };
+            $attrs: import('vue').Attrs;
             $refs: {
                 [x: string]: unknown;
             };
@@ -38,9 +36,7 @@ declare function __VLS_template(): {
             $host: Element | null;
             $emit: (event: string, ...args: any[]) => void;
             $el: any;
-            $options: import('vue').ComponentOptionsBase<Readonly<import('reka-ui').SelectItemTextProps> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {
-                as: import('reka-ui').AsTag | import('vue').Component;
-            }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & {
+            $options: import('vue').ComponentOptionsBase<Readonly<import('reka-ui').SelectItemTextProps> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & {
                 beforeCreate?: (() => void) | (() => void)[];
                 created?: (() => void) | (() => void)[];
                 beforeMount?: (() => void) | (() => void)[];
@@ -60,9 +56,7 @@ declare function __VLS_template(): {
             $forceUpdate: () => void;
             $nextTick: typeof import('vue').nextTick;
             $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (...args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('vue').WatchOptions): import('vue').WatchStopHandle;
-        } & Readonly<{
-            as: import('reka-ui').AsTag | import('vue').Component;
-        }> & Omit<Readonly<import('reka-ui').SelectItemTextProps> & Readonly<{}>, "as"> & import('vue').ShallowUnwrapRef<{}> & {} & import('vue').ComponentCustomProperties & {} & {
+        } & Readonly<{}> & Omit<Readonly<import('reka-ui').SelectItemTextProps> & Readonly<{}>, never> & {} & import('vue').ComponentCustomProperties & {} & {
             $slots: {
                 default?: (props: {}) => any;
             };
@@ -81,9 +75,7 @@ declare const __VLS_component: import('vue').DefineComponent<SkSelectItemCompone
             readonly asChild?: boolean | undefined;
             readonly as?: (import('reka-ui').AsTag | import('vue').Component) | undefined;
         } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps;
-        $attrs: {
-            [x: string]: unknown;
-        };
+        $attrs: import('vue').Attrs;
         $refs: {
             [x: string]: unknown;
         };
@@ -95,9 +87,7 @@ declare const __VLS_component: import('vue').DefineComponent<SkSelectItemCompone
         $host: Element | null;
         $emit: (event: string, ...args: any[]) => void;
         $el: any;
-        $options: import('vue').ComponentOptionsBase<Readonly<import('reka-ui').SelectItemTextProps> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {
-            as: import('reka-ui').AsTag | import('vue').Component;
-        }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & {
+        $options: import('vue').ComponentOptionsBase<Readonly<import('reka-ui').SelectItemTextProps> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & {
             beforeCreate?: (() => void) | (() => void)[];
             created?: (() => void) | (() => void)[];
             beforeMount?: (() => void) | (() => void)[];
@@ -117,9 +107,7 @@ declare const __VLS_component: import('vue').DefineComponent<SkSelectItemCompone
         $forceUpdate: () => void;
         $nextTick: typeof import('vue').nextTick;
         $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (...args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('vue').WatchOptions): import('vue').WatchStopHandle;
-    } & Readonly<{
-        as: import('reka-ui').AsTag | import('vue').Component;
-    }> & Omit<Readonly<import('reka-ui').SelectItemTextProps> & Readonly<{}>, "as"> & import('vue').ShallowUnwrapRef<{}> & {} & import('vue').ComponentCustomProperties & {} & {
+    } & Readonly<{}> & Omit<Readonly<import('reka-ui').SelectItemTextProps> & Readonly<{}>, never> & {} & import('vue').ComponentCustomProperties & {} & {
         $slots: {
             default?: (props: {}) => any;
         };

package/dist/components/Sidebar/SkSidebar.vue.d.ts

@@ -21,6 +21,13 @@ export interface SkSidebarComponentProps extends ComponentCustomColors {
      * @default 'left'
      */
     side?: SkSidebarSide;
+    /**
+     * Opts out of the coarse-pointer touch-target floor on sidebar items (44px minimum on
+     * touch devices). Use in compact navigation contexts where density matters more than
+     * tap comfort. No effect on fine-pointer (mouse) devices.
+     * @default false
+     */
+    dense?: boolean;
 }
 declare function __VLS_template(): {
     attrs: Partial<{}>;
@@ -33,8 +40,9 @@ declare function __VLS_template(): {
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 declare const __VLS_component: import('vue').DefineComponent<SkSidebarComponentProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<SkSidebarComponentProps> & Readonly<{}>, {
     kind: SkSidebarKind;
-    width: string;
+    dense: boolean;
     side: SkSidebarSide;
+    width: string;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;

package/dist/components/Skeleton/SkSkeleton.vue.d.ts

@@ -48,8 +48,8 @@ declare const _default: import('vue').DefineComponent<SkSkeletonComponentProps,
     bevel: string;
     variant: SkSkeletonVariant;
     corners: SkSkeletonCorner[];
-    height: string;
-    width: string;
     animation: SkSkeletonAnimation;
+    width: string;
+    height: string;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
 export default _default;

package/dist/components/Tabs/SkTabs.vue.d.ts

@@ -48,8 +48,8 @@ declare const __VLS_component: import('vue').DefineComponent<SkTabsComponentProp
 }>, {
     kind: ComponentKind;
     orientation: SkTabsOrientation;
-    placement: SkTabsPlacement;
     flush: boolean;
+    placement: SkTabsPlacement;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;

package/dist/components/TreeView/SkTreeView.vue.d.ts

@@ -1,8 +1,8 @@
 import { SkTreeViewDefaultExpanded, SkTreeViewKind } from './types';
-export interface SkTreeViewComponentProps {
-    items: T[];
-    getKey: (item: T) => string;
-    modelValue?: T | T[];
+export interface SkTreeViewComponentProps<TItem extends Record<string, unknown> = Record<string, unknown>> {
+    items: TItem[];
+    getKey: (item: TItem) => string;
+    modelValue?: TItem | TItem[];
     multiple?: boolean;
     propagateSelect?: boolean;
     kind?: SkTreeViewKind;
@@ -13,7 +13,7 @@ export interface SkTreeViewComponentProps {
 declare const _default: <T extends Record<string, unknown>>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
     props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
         readonly "onUpdate:modelValue"?: ((value: T | T[]) => any) | undefined;
-    } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>, "onUpdate:modelValue"> & SkTreeViewComponentProps & Partial<{}>> & import('vue').PublicProps;
+    } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>, "onUpdate:modelValue"> & SkTreeViewComponentProps<T> & Partial<{}>> & import('vue').PublicProps;
     expose(exposed: import('vue').ShallowUnwrapRef<{}>): void;
     attrs: any;
     slots: {

package/dist/composables/useFocusTrap.d.ts

@@ -0,0 +1,17 @@
+import { Ref } from 'vue';
+export interface UseFocusTrapOptions {
+    /** When true, the trap is active: focus moves inside and tab cycling is constrained. */
+    active: Ref<boolean>;
+    /** Element whose descendants form the trap region. */
+    container: Ref<HTMLElement | null>;
+    /**
+     * Optional callback fired when the user presses Escape. Most consumers will use this to
+     * close the modal/drawer.
+     */
+    onEscape?: () => void;
+}
+/**
+ * Trap focus inside a container while `active` is true. Restores focus to the previously
+ * active element when deactivated.
+ */
+export declare function useFocusTrap(options: UseFocusTrapOptions): void;

package/dist/composables/useFocusTrap.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/composables/usePageDrawer.d.ts

@@ -0,0 +1,35 @@
+import { Ref } from 'vue';
+export type PageDrawerSide = 'sidebar' | 'aside';
+export interface PageDrawerContext {
+    /** Whether the drawer is currently open. */
+    isOpen: Ref<boolean>;
+    /** Whether drawer mode is actually available (false on purely persistent layouts). */
+    isAvailable: Ref<boolean>;
+    open: () => void;
+    close: () => void;
+    toggle: () => void;
+}
+export interface PageDrawersContext {
+    sidebar: PageDrawerContext;
+    aside: PageDrawerContext;
+}
+/**
+ * Expose drawer state for both the sidebar and aside from SkPage so descendants (like toggle
+ * buttons) can wire into either without prop drilling.
+ */
+export declare function providePageDrawers(sidebar: {
+    isOpen: Ref<boolean>;
+    isAvailable: Ref<boolean>;
+    setOpen: (value: boolean) => void;
+}, aside: {
+    isOpen: Ref<boolean>;
+    isAvailable: Ref<boolean>;
+    setOpen: (value: boolean) => void;
+}): PageDrawersContext;
+/**
+ * Consume drawer state inside SkPage. Returns a safe no-op context when used outside SkPage
+ * so components like SkPageSidebarToggle can still render without throwing.
+ *
+ * @param side - Which drawer to bind to. Defaults to the left sidebar.
+ */
+export declare function usePageDrawer(side?: PageDrawerSide): PageDrawerContext;

package/dist/index.d.ts

@@ -39,6 +39,7 @@ import { default as SkModal, SkModalComponentProps } from './components/Modal/Sk
 import { default as SkNavBar, SkNavBarComponentProps } from './components/NavBar/SkNavBar.vue';
 import { default as SkNumberInput, SkNumberInputComponentProps } from './components/NumberInput/SkNumberInput.vue';
 import { default as SkPage, SkPageComponentProps } from './components/Page/SkPage.vue';
+import { default as SkPageSidebarToggle, SkPageSidebarToggleComponentProps } from './components/Page/SkPageSidebarToggle.vue';
 import { default as SkPagination, SkPaginationComponentProps } from './components/Pagination/SkPagination.vue';
 import { default as SkPaginationItem, SkPaginationItemComponentProps } from './components/Pagination/SkPaginationItem.vue';
 import { default as SkPanel, SkPanelComponentProps } from './components/Panel/SkPanel.vue';
@@ -165,6 +166,7 @@ export { SkModal, type SkModalComponentProps };
 export { SkNavBar, type SkNavBarComponentProps };
 export { SkNumberInput, type SkNumberInputComponentProps };
 export { SkPage, type SkPageComponentProps };
+export { SkPageSidebarToggle, type SkPageSidebarToggleComponentProps };
 export { SkPagination, type SkPaginationComponentProps };
 export { SkPaginationItem, type SkPaginationItemComponentProps };
 export { SkPanel, type SkPanelComponentProps };