import { c as ThemeInput } from './registry-GVSJPmus.js'; /** * Font loading utilities. */ /** * Font source configuration. */ interface FontSource { /** Source type */ source: 'google' | 'css'; /** For Google fonts: the family name */ family?: string; /** For Google fonts: the css2 query params (e.g., 'wght@400..700') */ css2?: string; /** For CSS source: the URL to the CSS file */ url?: string; } /** * Font configuration map. */ type FontConfig = Record; /** * Component loader map for dynamic imports. * Maps tag names to their module paths for selective/lazy loading. */ /** * All root-level web-kit element tags (excludes internal sub-components). */ declare const WEB_KIT_ELEMENT_TAGS: readonly ["ease-button", "ease-checkbox", "ease-color-input", "ease-color-picker", "ease-dropdown", "ease-input", "ease-number-input", "ease-origin", "ease-radio-group", "ease-radio-input", "ease-slider", "ease-toggle", "ease-field", "ease-panel", "ease-popover", "ease-state", "ease-tooltip", "ease-logo-loader", "ease-monitor", "ease-monitor-fps", "ease-icon-anchor-add", "ease-icon-anchor-remove", "ease-icon-arrow-up", "ease-icon-arrows-vertical", "ease-icon-bezier", "ease-icon-bezier-angle", "ease-icon-bezier-distribute", "ease-icon-bezier-length", "ease-icon-bezier-mirror", "ease-icon-check", "ease-icon-chevron", "ease-icon-circle-arrow-left", "ease-icon-circle-arrow-right", "ease-icon-clear", "ease-icon-code", "ease-icon-dots", "ease-icon-grid", "ease-icon-loading", "ease-icon-mention", "ease-icon-minus", "ease-icon-picker", "ease-icon-plus", "ease-icon-settings", "ease-icon-snap"]; /** * Advanced component tags (curve, code editor, etc.) */ declare const WEB_KIT_COMPONENT_TAGS: readonly ["ease-curve", "ease-code"]; /** * All public web-kit tags. */ declare const WEB_KIT_ALL_TAGS: readonly ["ease-button", "ease-checkbox", "ease-color-input", "ease-color-picker", "ease-dropdown", "ease-input", "ease-number-input", "ease-origin", "ease-radio-group", "ease-radio-input", "ease-slider", "ease-toggle", "ease-field", "ease-panel", "ease-popover", "ease-state", "ease-tooltip", "ease-logo-loader", "ease-monitor", "ease-monitor-fps", "ease-icon-anchor-add", "ease-icon-anchor-remove", "ease-icon-arrow-up", "ease-icon-arrows-vertical", "ease-icon-bezier", "ease-icon-bezier-angle", "ease-icon-bezier-distribute", "ease-icon-bezier-length", "ease-icon-bezier-mirror", "ease-icon-check", "ease-icon-chevron", "ease-icon-circle-arrow-left", "ease-icon-circle-arrow-right", "ease-icon-clear", "ease-icon-code", "ease-icon-dots", "ease-icon-grid", "ease-icon-loading", "ease-icon-mention", "ease-icon-minus", "ease-icon-picker", "ease-icon-plus", "ease-icon-settings", "ease-icon-snap", "ease-curve", "ease-code"]; /** * Union type of all element tag names. */ type WebKitElementTag = (typeof WEB_KIT_ELEMENT_TAGS)[number]; /** * Union type of all component tag names. */ type WebKitComponentTag = (typeof WEB_KIT_COMPONENT_TAGS)[number]; /** * Union type of all public tag names. */ type WebKitTag = (typeof WEB_KIT_ALL_TAGS)[number]; /** * Lazy loading utilities using MutationObserver. */ /** * Lazy load configuration. */ interface LazyLoadConfig { /** MutationObserver strategy */ strategy?: 'mutation'; /** Root element to observe (default: document) */ root?: Document | Element; /** Tags to include in lazy loading */ include?: readonly string[]; /** Tags to exclude from lazy loading */ exclude?: readonly string[]; /** Tags to preload immediately */ preload?: readonly string[]; } /** * Lazy loader instance. */ interface LazyLoader { /** Stop observing and cleanup */ dispose: () => void; /** Manually load a component */ load: (tag: WebKitTag) => Promise; } type StylePreset = 'reset' | 'base' | 'main'; /** * Main initialization API for @easemate/web-kit */ /** * Theme mode configuration for light/dark switching. */ interface ThemeModeConfig { /** Mode selection: 'light', 'dark', or 'system' for auto-switching */ mode: 'light' | 'dark' | 'system'; /** Theme to use in light mode */ light: ThemeInput; /** Theme to use in dark mode */ dark: ThemeInput; /** Persist user preference to localStorage */ persist?: { key: string; }; } /** * Style injection configuration. */ type StylesConfig = false | StylePreset | { reset?: boolean; base?: boolean; }; /** * Component replacement configuration. * Keys are tag names, values are either: * - A custom element constructor * - A string tag name to alias to */ type ReplaceConfig = Record; /** * initWebKit options. */ interface InitWebKitOptions { /** * Tags to include (register only these). * If not provided, all components are registered. */ include?: readonly string[]; /** * Tags to exclude (register all except these). * Ignored if `include` is provided. */ exclude?: readonly string[]; /** * Replace components with custom implementations. * - Constructor: registers your class under the tag name * - String: creates a bridge element that renders the aliased tag */ replace?: ReplaceConfig; /** * Theme to apply. * - String: registered theme name (e.g., 'default', 'dark') * - WebKitThemeRef: theme reference from registerTheme() * - ThemeConfig: inline theme configuration * - ThemeModeConfig: light/dark mode configuration */ theme?: ThemeInput | ThemeModeConfig; /** * Element to scope theme variables to (default: document.documentElement). */ target?: HTMLElement; /** * Inject global styles. * - false: no styles (default) * - 'reset': minimal CSS reset * - 'base': body/html dark theme styles * - 'main': reset + base * - { reset?: boolean; base?: boolean }: fine-grained control */ styles?: StylesConfig; /** * Font loading configuration. * - false: no font loading (default) * - 'default': load default fonts (Instrument Sans, Geist Mono) * - FontConfig: custom font configuration */ fonts?: FontConfig | 'default' | false; /** * Enable lazy loading of components. * - false: eager loading (default) * - true: lazy load with default config * - LazyLoadConfig: custom lazy load config */ lazyLoad?: boolean | LazyLoadConfig; /** * CSP nonce for injected style/link elements. */ cspNonce?: string; /** * Development mode options. */ dev?: { /** Warn about unknown tag names in include/exclude */ warnUnknownTags?: boolean; /** Log component loads */ logLoads?: boolean; }; } /** * Controller returned by initWebKit. */ interface WebKitController { /** Cleanup all injected styles, fonts, and listeners */ dispose: () => void; /** Theme controller (if theme was configured) */ theme?: { /** Set theme by name or config */ set: (theme: ThemeInput) => void; /** Set theme mode (only for ThemeModeConfig) */ mode?: (mode: 'light' | 'dark' | 'system') => void; }; /** Promise that resolves when all components are loaded */ ready: Promise; } /** * Initialize the web-kit. * * @example * ```ts * // Basic usage - register all components with default theme * initWebKit({ theme: 'default' }); * * // Selective loading * initWebKit({ * include: ['ease-button', 'ease-slider'], * theme: 'default' * }); * * // With styles * initWebKit({ * theme: 'default', * styles: 'main', * fonts: 'default' * }); * * // Light/dark mode * initWebKit({ * theme: { * mode: 'system', * light: myLightTheme, * dark: 'default' * } * }); * ``` */ declare function initWebKit(options?: InitWebKitOptions): WebKitController; export { type FontConfig as F, type InitWebKitOptions as I, type LazyLoadConfig as L, type ReplaceConfig as R, type StylePreset as S, type ThemeModeConfig as T, type WebKitComponentTag as W, type FontSource as a, type LazyLoader as b, type StylesConfig as c, type WebKitController as d, type WebKitElementTag as e, type WebKitTag as f, initWebKit as i };