@dvcol/neo-svelte
Version:
Neomorphic ui library for svelte 5
88 lines (87 loc) • 2.69 kB
TypeScript
import { type Snippet } from 'svelte';
/**
* The active theme (`dark` or `light`)
*/
export declare const NeoTheme: {
readonly Light: "light";
readonly Dark: "dark";
};
export type NeoThemes = (typeof NeoTheme)[keyof typeof NeoTheme];
/**
* The light source to simulate shadows
*/
export declare const NeoSource: {
readonly TopLeft: "top-left";
readonly TopRight: "top-right";
readonly BottomRight: "bottom-right";
readonly BottomLeft: "bottom-left";
};
export type NeoSources = (typeof NeoSource)[keyof typeof NeoSource];
export type INeoThemeProviderContext = {
/**
* If a style reset is applied.
*/
readonly reset?: boolean;
/**
* The active theme (`dark` or `light`)
*/
readonly theme: NeoThemes;
/**
* The active light source to simulate shadows
*/
readonly source: NeoSources;
/**
* If the reset, theme and source are stored in local-storage
*/
readonly remember: boolean;
/**
* The target to which scope the theme variables
*/
readonly root?: HTMLElement | ShadowRoot;
};
export type NeoThemeProviderProps = {
/**
* Child element to wrap in the theme context.
*/
children?: Snippet<[INeoThemeProviderContext]>;
/**
* If `true`, injects a css reset for common styling.
*/
reset?: boolean;
/**
* Enforce `dark` or `light` theme.
*
* @default prefers-color-scheme
*/
theme?: NeoThemes;
/**
* The light source to simulate shadows
*
* @default top-left
*/
source?: NeoSources;
/**
* To store the last used reset & theme & source in local storage (if available)
*
* @default true
*/
remember?: boolean;
/**
* The target to which scope the theme variables
*
* @default document.documentElement
*/
target?: HTMLElement | ShadowRoot | (() => HTMLElement | ShadowRoot);
};
export declare const NeoThemeRoot = "neo-theme-root";
export declare const NeoThemeStorageKey: Record<string, `neo-${keyof INeoThemeProviderContext | 'transition'}`>;
export type NeoThemeStorageKeys = (typeof NeoThemeStorageKey)[keyof typeof NeoThemeStorageKey];
export declare const getSavedTheme: () => NeoThemes | null;
export declare const getPreferTheme: () => NeoThemes;
export declare const getTheme: () => NeoThemes;
export declare const getSavedSource: () => NeoSources | null;
export declare const getSource: () => NeoSources;
export declare const getSavedReset: () => string | null;
export declare const getReset: () => boolean;
export declare const getSavedRemember: () => string | null;
export declare const getRemember: () => boolean;