export interface ThemeColors { /** Action/accent color (buttons, links, active states). Default: #1355ff */ action?: string; /** Action hover state. Default: #0f44cc */ actionHover?: string; /** Text color on action-colored buttons. Default: #ffffff */ actionText?: string; /** Default background for panels, cards, dropdowns. Default: #ffffff */ bg?: string; /** Hover background. Default: #dbdbdb */ hoverBg?: string; /** Active/pressed background. Default: #c8d0d8 */ activeBg?: string; /** Disabled background. Default: #f5f5f5 */ disabledBg?: string; /** Primary text color. Default: #47484a */ text?: string; /** Secondary/muted text. Default: #666666 */ textMuted?: string; /** Disabled text. Default: #ababab */ textDisabled?: string; /** Default border color. Default: #dbdbdb */ border?: string; } export interface ThemeConfig { /** Theme name — used in the generated class name (e.g., "dark" → "sd-theme-dark") */ name?: string; /** UI font family */ font?: string; /** Default border radius (e.g., "8px") */ radius?: string; /** Default box shadow */ shadow?: string; /** Core color palette — cascades to every component */ colors?: ThemeColors; /** Escape hatch — raw CSS variable overrides (e.g., { '--sd-ui-toolbar-bg': '#f8fafc' }) */ vars?: Record; } export interface ThemeResult { className: string; css: string; } /** * Create a SuperDoc theme from a config object. * * Returns a CSS class name. Apply it to `` to activate the theme. * The style element is injected into the document automatically. * * For strict CSP environments that require a nonce, use {@link buildTheme} instead * and inject the CSS yourself with the appropriate nonce attribute. * * @example * ```ts * import { createTheme } from 'superdoc'; * * const theme = createTheme({ * colors: { action: '#6366f1', bg: '#ffffff', text: '#1e293b' }, * font: 'Inter, sans-serif', * vars: { '--sd-ui-toolbar-bg': '#f8fafc' }, * }); * * document.documentElement.classList.add(theme); * ``` */ export declare function createTheme(config: ThemeConfig): string; /** * Build a SuperDoc theme and return both the class name and raw CSS. * Pure function — does NOT inject styles into the DOM. Use this for SSR * or when you need to control style injection yourself (e.g., CSP nonce). * * @example * ```ts * import { buildTheme } from 'superdoc'; * * const { className, css } = buildTheme({ * colors: { action: '#6366f1', bg: '#ffffff', text: '#1e293b' }, * }); * * const html = `...`; * ``` */ export declare function buildTheme(config: ThemeConfig): ThemeResult; //# sourceMappingURL=create-theme.d.ts.map