@sabrenski/spire-ui-vue 0.3.2 → 0.3.3

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

@@ -1,5 +1,6 @@
 import { nextTick, Component } from 'vue';
 import { SelectProps, SelectOptionData } from './types';
+declare function focus(): void;
 declare function __VLS_template(): {
     attrs: Partial<{}>;
     slots: {
@@ -8,8 +9,15 @@ declare function __VLS_template(): {
             active: boolean;
             option: SelectOptionData;
         }): any;
+        option?(_: {
+            selected: boolean;
+            active: boolean;
+            option: SelectOptionData;
+        }): any;
+        default?(_: {}): any;
         default?(_: {}): any;
         empty?(_: {}): any;
+        empty?(_: {}): any;
     };
     refs: {
         searchInputRef: ({
@@ -25,6 +33,7 @@ declare function __VLS_template(): {
                 readonly readonly?: boolean | undefined;
                 readonly invalid?: boolean | undefined;
                 readonly clearable?: boolean | undefined;
+                readonly loading?: boolean | undefined;
                 readonly icon?: Component | undefined;
                 readonly iconEnd?: Component | undefined;
                 readonly onClear?: (() => any) | undefined;
@@ -58,9 +67,10 @@ declare function __VLS_template(): {
             }, string, {
                 type: import('..').InputType;
                 disabled: boolean;
+                loading: boolean;
                 invalid: boolean;
-                clearable: boolean;
                 readonly: boolean;
+                clearable: boolean;
             }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & {
                 beforeCreate?: (() => void) | (() => void)[];
                 created?: (() => void) | (() => void)[];
@@ -84,13 +94,105 @@ declare function __VLS_template(): {
         } & Readonly<{
             type: import('..').InputType;
             disabled: boolean;
+            loading: boolean;
             invalid: boolean;
+            readonly: boolean;
             clearable: boolean;
+        }> & Omit<Readonly<import('..').InputProps> & Readonly<{
+            onClear?: (() => any) | undefined;
+            "onUpdate:modelValue"?: ((value: string | number) => any) | undefined;
+        }>, "focus" | "inputRef" | ("type" | "disabled" | "loading" | "invalid" | "readonly" | "clearable")> & import('vue').ShallowUnwrapRef<{
+            focus: () => void;
+            inputRef: import('vue').Ref<HTMLInputElement | null, HTMLInputElement | null>;
+        }> & {} & import('vue').ComponentCustomProperties & {} & {
+            $slots: {
+                start?(_: {}): any;
+                end?(_: {}): any;
+            };
+        }) | null;
+        dialogRef: HTMLDialogElement;
+        mobileSearchInputRef: ({
+            $: import('vue').ComponentInternalInstance;
+            $data: {};
+            $props: {
+                readonly modelValue?: string | number | undefined;
+                readonly type?: import('..').InputType | undefined;
+                readonly placeholder?: string | undefined;
+                readonly size?: import('..').InputSize | undefined;
+                readonly variant?: import('..').InputVariant | undefined;
+                readonly disabled?: boolean | undefined;
+                readonly readonly?: boolean | undefined;
+                readonly invalid?: boolean | undefined;
+                readonly clearable?: boolean | undefined;
+                readonly loading?: boolean | undefined;
+                readonly icon?: Component | undefined;
+                readonly iconEnd?: Component | undefined;
+                readonly onClear?: (() => any) | undefined;
+                readonly "onUpdate:modelValue"?: ((value: string | number) => any) | undefined;
+            } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps;
+            $attrs: {
+                [x: string]: unknown;
+            };
+            $refs: {
+                [x: string]: unknown;
+            } & {
+                inputRef: HTMLInputElement;
+            };
+            $slots: Readonly<{
+                [name: string]: import('vue').Slot<any> | undefined;
+            }>;
+            $root: import('vue').ComponentPublicInstance | null;
+            $parent: import('vue').ComponentPublicInstance | null;
+            $host: Element | null;
+            $emit: ((event: "clear") => void) & ((event: "update:modelValue", value: string | number) => void);
+            $el: HTMLDivElement;
+            $options: import('vue').ComponentOptionsBase<Readonly<import('..').InputProps> & Readonly<{
+                onClear?: (() => any) | undefined;
+                "onUpdate:modelValue"?: ((value: string | number) => any) | undefined;
+            }>, {
+                focus: () => void;
+                inputRef: import('vue').Ref<HTMLInputElement | null, HTMLInputElement | null>;
+            }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+                clear: () => any;
+                "update:modelValue": (value: string | number) => any;
+            }, string, {
+                type: import('..').InputType;
+                disabled: boolean;
+                loading: boolean;
+                invalid: boolean;
+                readonly: boolean;
+                clearable: boolean;
+            }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & {
+                beforeCreate?: (() => void) | (() => void)[];
+                created?: (() => void) | (() => void)[];
+                beforeMount?: (() => void) | (() => void)[];
+                mounted?: (() => void) | (() => void)[];
+                beforeUpdate?: (() => void) | (() => void)[];
+                updated?: (() => void) | (() => void)[];
+                activated?: (() => void) | (() => void)[];
+                deactivated?: (() => void) | (() => void)[];
+                beforeDestroy?: (() => void) | (() => void)[];
+                beforeUnmount?: (() => void) | (() => void)[];
+                destroyed?: (() => void) | (() => void)[];
+                unmounted?: (() => void) | (() => void)[];
+                renderTracked?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
+                renderTriggered?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
+                errorCaptured?: ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void) | ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void)[];
+            };
+            $forceUpdate: () => void;
+            $nextTick: typeof 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<{
+            type: import('..').InputType;
+            disabled: boolean;
+            loading: boolean;
+            invalid: boolean;
             readonly: boolean;
+            clearable: boolean;
         }> & Omit<Readonly<import('..').InputProps> & Readonly<{
             onClear?: (() => any) | undefined;
             "onUpdate:modelValue"?: ((value: string | number) => any) | undefined;
-        }>, "focus" | "inputRef" | ("type" | "disabled" | "invalid" | "clearable" | "readonly")> & import('vue').ShallowUnwrapRef<{
+        }>, "focus" | "inputRef" | ("type" | "disabled" | "loading" | "invalid" | "readonly" | "clearable")> & import('vue').ShallowUnwrapRef<{
             focus: () => void;
             inputRef: import('vue').Ref<HTMLInputElement | null, HTMLInputElement | null>;
         }> & {} & import('vue').ComponentCustomProperties & {} & {
@@ -100,10 +202,13 @@ declare function __VLS_template(): {
             };
         }) | null;
     };
-    rootEl: HTMLDivElement;
+    rootEl: any;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
-declare const __VLS_component: import('vue').DefineComponent<SelectProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+declare const __VLS_component: import('vue').DefineComponent<SelectProps, {
+    focus: typeof focus;
+    triggerRef: import('vue').Ref<HTMLElement | null, HTMLElement | null>;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     search: (query: string) => any;
     "update:modelValue": (value: string | string[] | undefined) => any;
     change: (value: string | string[] | undefined) => any;
@@ -118,10 +223,12 @@ declare const __VLS_component: import('vue').DefineComponent<SelectProps, {}, {}
     loading: boolean;
     placeholder: string;
     invalid: boolean;
+    readonly: boolean;
     clearable: boolean;
     chips: boolean;
     maxChips: number;
     emptyMessage: string;
+    loadingMessage: string;
     strategy: "absolute" | "fixed";
     searchable: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
@@ -138,6 +245,7 @@ declare const __VLS_component: import('vue').DefineComponent<SelectProps, {}, {}
             readonly readonly?: boolean | undefined;
             readonly invalid?: boolean | undefined;
             readonly clearable?: boolean | undefined;
+            readonly loading?: boolean | undefined;
             readonly icon?: Component | undefined;
             readonly iconEnd?: Component | undefined;
             readonly onClear?: (() => any) | undefined;
@@ -171,9 +279,10 @@ declare const __VLS_component: import('vue').DefineComponent<SelectProps, {}, {}
         }, string, {
             type: import('..').InputType;
             disabled: boolean;
+            loading: boolean;
             invalid: boolean;
-            clearable: boolean;
             readonly: boolean;
+            clearable: boolean;
         }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & {
             beforeCreate?: (() => void) | (() => void)[];
             created?: (() => void) | (() => void)[];
@@ -197,13 +306,105 @@ declare const __VLS_component: import('vue').DefineComponent<SelectProps, {}, {}
     } & Readonly<{
         type: import('..').InputType;
         disabled: boolean;
+        loading: boolean;
         invalid: boolean;
+        readonly: boolean;
         clearable: boolean;
+    }> & Omit<Readonly<import('..').InputProps> & Readonly<{
+        onClear?: (() => any) | undefined;
+        "onUpdate:modelValue"?: ((value: string | number) => any) | undefined;
+    }>, "focus" | "inputRef" | ("type" | "disabled" | "loading" | "invalid" | "readonly" | "clearable")> & import('vue').ShallowUnwrapRef<{
+        focus: () => void;
+        inputRef: import('vue').Ref<HTMLInputElement | null, HTMLInputElement | null>;
+    }> & {} & import('vue').ComponentCustomProperties & {} & {
+        $slots: {
+            start?(_: {}): any;
+            end?(_: {}): any;
+        };
+    }) | null;
+    dialogRef: HTMLDialogElement;
+    mobileSearchInputRef: ({
+        $: import('vue').ComponentInternalInstance;
+        $data: {};
+        $props: {
+            readonly modelValue?: string | number | undefined;
+            readonly type?: import('..').InputType | undefined;
+            readonly placeholder?: string | undefined;
+            readonly size?: import('..').InputSize | undefined;
+            readonly variant?: import('..').InputVariant | undefined;
+            readonly disabled?: boolean | undefined;
+            readonly readonly?: boolean | undefined;
+            readonly invalid?: boolean | undefined;
+            readonly clearable?: boolean | undefined;
+            readonly loading?: boolean | undefined;
+            readonly icon?: Component | undefined;
+            readonly iconEnd?: Component | undefined;
+            readonly onClear?: (() => any) | undefined;
+            readonly "onUpdate:modelValue"?: ((value: string | number) => any) | undefined;
+        } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps;
+        $attrs: {
+            [x: string]: unknown;
+        };
+        $refs: {
+            [x: string]: unknown;
+        } & {
+            inputRef: HTMLInputElement;
+        };
+        $slots: Readonly<{
+            [name: string]: import('vue').Slot<any> | undefined;
+        }>;
+        $root: import('vue').ComponentPublicInstance | null;
+        $parent: import('vue').ComponentPublicInstance | null;
+        $host: Element | null;
+        $emit: ((event: "clear") => void) & ((event: "update:modelValue", value: string | number) => void);
+        $el: HTMLDivElement;
+        $options: import('vue').ComponentOptionsBase<Readonly<import('..').InputProps> & Readonly<{
+            onClear?: (() => any) | undefined;
+            "onUpdate:modelValue"?: ((value: string | number) => any) | undefined;
+        }>, {
+            focus: () => void;
+            inputRef: import('vue').Ref<HTMLInputElement | null, HTMLInputElement | null>;
+        }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+            clear: () => any;
+            "update:modelValue": (value: string | number) => any;
+        }, string, {
+            type: import('..').InputType;
+            disabled: boolean;
+            loading: boolean;
+            invalid: boolean;
+            readonly: boolean;
+            clearable: boolean;
+        }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & {
+            beforeCreate?: (() => void) | (() => void)[];
+            created?: (() => void) | (() => void)[];
+            beforeMount?: (() => void) | (() => void)[];
+            mounted?: (() => void) | (() => void)[];
+            beforeUpdate?: (() => void) | (() => void)[];
+            updated?: (() => void) | (() => void)[];
+            activated?: (() => void) | (() => void)[];
+            deactivated?: (() => void) | (() => void)[];
+            beforeDestroy?: (() => void) | (() => void)[];
+            beforeUnmount?: (() => void) | (() => void)[];
+            destroyed?: (() => void) | (() => void)[];
+            unmounted?: (() => void) | (() => void)[];
+            renderTracked?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
+            renderTriggered?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
+            errorCaptured?: ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void) | ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void)[];
+        };
+        $forceUpdate: () => void;
+        $nextTick: typeof 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<{
+        type: import('..').InputType;
+        disabled: boolean;
+        loading: boolean;
+        invalid: boolean;
         readonly: boolean;
+        clearable: boolean;
     }> & Omit<Readonly<import('..').InputProps> & Readonly<{
         onClear?: (() => any) | undefined;
         "onUpdate:modelValue"?: ((value: string | number) => any) | undefined;
-    }>, "focus" | "inputRef" | ("type" | "disabled" | "invalid" | "clearable" | "readonly")> & import('vue').ShallowUnwrapRef<{
+    }>, "focus" | "inputRef" | ("type" | "disabled" | "loading" | "invalid" | "readonly" | "clearable")> & import('vue').ShallowUnwrapRef<{
         focus: () => void;
         inputRef: import('vue').Ref<HTMLInputElement | null, HTMLInputElement | null>;
     }> & {} & import('vue').ComponentCustomProperties & {} & {
@@ -212,7 +413,7 @@ declare const __VLS_component: import('vue').DefineComponent<SelectProps, {}, {}
             end?(_: {}): any;
         };
     }) | null;
-}, HTMLDivElement>;
+}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

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

@@ -1,6 +1,6 @@
 import { InjectionKey, Ref, Component } from 'vue';
 import { Placement } from '../../composables';
-export type SelectSize = 'xs' | 'sm' | 'md' | 'lg';
+export type SelectSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
 export type SelectVariant = 'outline' | 'filled' | 'underline';
 export interface SelectOptionData {
     value: string;
@@ -17,6 +17,8 @@ export interface SelectProps {
     searchable?: boolean;
     clearable?: boolean;
     disabled?: boolean;
+    /** Whether the select is read-only (can't be changed but still focusable) */
+    readonly?: boolean;
     invalid?: boolean;
     size?: SelectSize;
     variant?: SelectVariant;
@@ -25,6 +27,8 @@ export interface SelectProps {
     filterFn?: (query: string, option: SelectOptionData) => boolean;
     loading?: boolean;
     emptyMessage?: string;
+    /** Text shown while loading */
+    loadingMessage?: string;
     /** Placement of the dropdown relative to the trigger */
     placement?: Placement;
     /** Positioning strategy for the dropdown */

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

@@ -43,6 +43,7 @@ declare const __VLS_component: import('vue').DefineComponent<SidebarProps, {}, {
     onMobileClose?: (() => any) | undefined;
 }>, {
     variant: SidebarVariant;
+    storageKey: string;
     expandedWidth: number;
     collapsedWidth: number;
     mobileBreakpoint: number;
@@ -50,7 +51,6 @@ declare const __VLS_component: import('vue').DefineComponent<SidebarProps, {}, {
     hoverExpandDelay: number;
     hoverCollapseDelay: number;
     persistState: boolean;
-    storageKey: string;
     showTrigger: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
     desktopNavRef: HTMLElement;

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

@@ -25,7 +25,6 @@ declare const __VLS_component: import('vue').DefineComponent<TabsProps, {}, {},
     hashNavigation: boolean;
     hashPrefix: string;
     showScrollArrows: boolean;
-    disableContainerQuery: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;

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

@@ -4,7 +4,7 @@ import { IconKey } from '../../icons/registry';
 export type IconProp = IconKey | Component;
 export type TabsVariant = 'solid' | 'underlined' | 'bordered' | 'light';
 export type TabsColor = 'default' | 'primary' | 'secondary' | 'success' | 'warning' | 'danger';
-export type TabsSize = 'sm' | 'md' | 'lg';
+export type TabsSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
 export type TabsRadius = 'none' | 'sm' | 'md' | 'lg' | 'full';
 export type TabsPlacement = 'top' | 'bottom' | 'start' | 'end';
 export interface TabData {
@@ -43,8 +43,6 @@ export interface TabsProps {
     hashPrefix?: string;
     /** Show scroll navigation arrows when tabs overflow */
     showScrollArrows?: boolean;
-    /** Disable container query on TabList for intrinsic sizing support */
-    disableContainerQuery?: boolean;
 }
 export interface TabListProps {
     /** Accessible label for the tab list */
@@ -91,8 +89,6 @@ export interface TabsContext {
     fullWidth: Ref<boolean>;
     /** Show scroll navigation arrows when tabs overflow */
     showScrollArrows: Ref<boolean>;
-    /** Disable container query on TabList */
-    disableContainerQuery: Ref<boolean>;
     /** Registered tabs data for cursor positioning */
     registeredTabs: Ref<Map<string, TabData>>;
     /** Tab keys in registration order */

package/dist/components/TimeInput/TimeInput.vue.d.ts

@@ -14,8 +14,8 @@ declare const _default: import('vue').DefineComponent<TimeInputProps, {}, {}, {}
     placement: import('../..').Placement;
     placeholder: string;
     invalid: boolean;
-    clearable: boolean;
     readonly: boolean;
+    clearable: boolean;
     strategy: "absolute" | "fixed";
     mode: import('./types').TimeInputMode;
     format: import('./types').TimeInputFormat;

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

@@ -1,5 +1,5 @@
 import { Placement } from '../../composables';
-export type TimeInputSize = 'sm' | 'md' | 'lg';
+export type TimeInputSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
 export type TimeInputVariant = 'outline' | 'filled' | 'underline';
 export type TimeInputFormat = '12' | '24';
 export type TimeInputMode = 'columns' | 'presets';

package/dist/composables/index.d.ts

@@ -15,3 +15,6 @@ export * from './useListbox';
 export * from './useComponentDefaults';
 export { useComponentAs, INERTIA_LINK_KEY, ROUTER_LINK_KEY } from './useComponentAs';
 export * from './useOverlayRegistry';
+export * from './useMobilePopover';
+export * from './useDarkMode';
+export * from './useTheme';

package/dist/composables/useDarkMode/index.d.ts

@@ -0,0 +1 @@
+export { useDarkMode, type UseDarkModeOptions, type UseDarkModeReturn } from './useDarkMode';

package/dist/composables/useDarkMode/useDarkMode.d.ts

@@ -0,0 +1,42 @@
+import { Ref } from 'vue';
+export interface UseDarkModeOptions {
+    /** Storage key for persisting preference */
+    storageKey?: string;
+    /** Initial value (defaults to system preference) */
+    initialValue?: boolean;
+    /** Selector for the element to apply dark class */
+    selector?: string;
+    /** CSS class to apply for dark mode */
+    darkClass?: string;
+    /** Whether to listen for system preference changes */
+    listenToSystemChanges?: boolean;
+}
+export interface UseDarkModeReturn {
+    /** Reactive dark mode state */
+    isDark: Ref<boolean>;
+    /** Toggle dark mode on/off */
+    toggle: () => void;
+    /** Set dark mode explicitly */
+    set: (value: boolean) => void;
+    /** Clear stored preference and follow system */
+    clearPreference: () => void;
+}
+/**
+ * Composable for managing dark mode with system preference detection and localStorage persistence.
+ *
+ * @example
+ * ```vue
+ * <script setup>
+ * import { useDarkMode } from '@sabrenski/spire-ui-vue'
+ *
+ * const { isDark, toggle } = useDarkMode()
+ * </script>
+ *
+ * <template>
+ *   <button @click="toggle">
+ *     {{ isDark ? 'Light Mode' : 'Dark Mode' }}
+ *   </button>
+ * </template>
+ * ```
+ */
+export declare function useDarkMode(options?: UseDarkModeOptions): UseDarkModeReturn;

package/dist/composables/useMobilePopover/index.d.ts

@@ -0,0 +1 @@
+export { useMobilePopover, MOBILE_BREAKPOINT } from './useMobilePopover';

package/dist/composables/useMobilePopover/useMobilePopover.d.ts

@@ -0,0 +1,8 @@
+export declare const MOBILE_BREAKPOINT = 640;
+/**
+ * Composable for detecting mobile viewport for popover positioning.
+ * Uses matchMedia for efficient viewport detection with proper cleanup.
+ */
+export declare function useMobilePopover(): {
+    isMobile: Readonly<import('vue').Ref<boolean, boolean>>;
+};

package/dist/composables/useTheme/index.d.ts

@@ -0,0 +1 @@
+export { useTheme, type UseThemeOptions, type UseThemeReturn, type ThemeScheme } from './useTheme';

package/dist/composables/useTheme/useTheme.d.ts

@@ -0,0 +1,43 @@
+import { Ref, ComputedRef } from 'vue';
+export type ThemeScheme = 'default' | 'ocean' | 'forest' | 'sunset' | 'rose' | 'midnight';
+export interface UseThemeOptions {
+    /** Storage key for persisting preference */
+    storageKey?: string;
+    /** Initial color scheme */
+    initialScheme?: ThemeScheme;
+    /** Selector for the element to apply theme class */
+    selector?: string;
+    /** Custom schemes to include (in addition to built-in ones) */
+    customSchemes?: string[];
+}
+export interface UseThemeReturn {
+    /** All available scheme names */
+    schemes: ComputedRef<ThemeScheme[]>;
+    /** Current active scheme */
+    currentScheme: Ref<ThemeScheme>;
+    /** Set the color scheme */
+    setScheme: (scheme: ThemeScheme) => void;
+    /** Clear stored preference and reset to default */
+    clearPreference: () => void;
+}
+/**
+ * Composable for managing color scheme themes with localStorage persistence.
+ *
+ * @example
+ * ```vue
+ * <script setup>
+ * import { useTheme } from '@sabrenski/spire-ui-vue'
+ *
+ * const { schemes, currentScheme, setScheme } = useTheme()
+ * </script>
+ *
+ * <template>
+ *   <select v-model="currentScheme">
+ *     <option v-for="scheme in schemes" :key="scheme" :value="scheme">
+ *       {{ scheme }}
+ *     </option>
+ *   </select>
+ * </template>
+ * ```
+ */
+export declare function useTheme(options?: UseThemeOptions): UseThemeReturn;