use-theme-toggle/dist/index.d.ts

A lightweight theme toggler with animated transitions and customizable strategies.

interface BaseOptions<Light, Dark> {
    light?: Light;
    dark?: Dark;
    easing?: string;
    duration?: number;
    /**
     * Key in `localstorage`
     * @default theme
     */
    key?: string;
}
interface ClassModeOptions<Light, Dark> extends BaseOptions<Light, Dark> {
}
interface AttributeModeOptions<Light, Dark> extends BaseOptions<Light, Dark> {
    /**
     * Key in `attribute` mode.
     * @example data-theme, mode
     * @default data-theme
     */
    attribute?: string;
}
type ThemeToggleOptions<Light, Dark> = {
    mode: 'class';
} & ClassModeOptions<Light, Dark> | {
    mode: 'attribute';
} & AttributeModeOptions<Light, Dark> | {
    mode: 'both';
} & ClassModeOptions<Light, Dark> & AttributeModeOptions<Light, Dark>;
interface ThemeToggleReturn<Light, Dark> {
    toggle: (e?: Event) => void;
    onThemeToggled: (cb: (currentTheme: Light | Dark) => void) => void;
}
type TransitionLoader<Light, Dark> = (toggleClassOrAttribute: () => Light | Dark, options: ThemeToggleOptions<Light, Dark> & {
    root: HTMLElement;
    darkSelector: string;
    previousTheme: Light | Dark;
}, e?: any) => void;

declare function useThemeToggle<const Light extends string = 'light', const Dark extends string = 'dark'>(): ThemeToggleReturn<Light, Dark>;
declare function useThemeToggle<const Light extends string = 'light', const Dark extends string = 'dark'>(options: ThemeToggleOptions<Light, Dark>): ThemeToggleReturn<Light, Dark>;
declare function useThemeToggle<const Light extends string = 'light', const Dark extends string = 'dark'>(loader: TransitionLoader<Light, Dark>): ThemeToggleReturn<Light, Dark>;
declare function useThemeToggle<const Light extends string = 'light', const Dark extends string = 'dark'>(loader: TransitionLoader<Light, Dark>, options: ThemeToggleOptions<Light, Dark>): ThemeToggleReturn<Light, Dark>;

declare function BaseTransition<Light, Dark>(): TransitionLoader<Light, Dark>;

declare function Diffusion<Light, Dark>(): TransitionLoader<Light, Dark>;

declare function Slide<Light, Dark>(): TransitionLoader<Light, Dark>;

export { type AttributeModeOptions, type BaseOptions, BaseTransition, type ClassModeOptions, Diffusion, Slide, type ThemeToggleOptions, type ThemeToggleReturn, type TransitionLoader, useThemeToggle };