@dnb/eufemia/shared/Theme.d.ts

DNB Eufemia Design System UI Library

/**
 * Theme Provider
 *
 */
import type { HTMLAttributes } from 'react';
import type { DynamicElement } from './types';
export type ThemeNames = 'ui' | 'eiendom' | 'sbanken' | 'carnegie';
export type ThemeVariants = string;
export type ThemeSizes = 'basis';
export type ContrastMode = boolean;
/**
 * Controls the color scheme. Use `'dark'` or `'light'` to set explicitly, or `'auto'` to follow the user's system preference. Defaults to `undefined`.
 */
export type ThemeColorScheme = 'auto' | 'light' | 'dark';
/**
 * Adjusts component appearance based on background. Defaults to `undefined`.
 * Use `'initial'` to reset to the component's default behavior, ignoring any parent surface context.
 */
export type ThemeSurface = 'light' | 'dark' | 'initial';
export type ThemeProps = {
    name?: ThemeNames;
    variant?: ThemeVariants;
    size?: ThemeSizes;
    contrastMode?: ContrastMode;
    colorScheme?: ThemeColorScheme;
    surface?: ThemeSurface;
    element?: DynamicElement | false;
};
export type ThemeAllProps = ThemeProps & HTMLAttributes<HTMLElement>;
declare function Theme(themeProps: ThemeAllProps): import("react/jsx-runtime").JSX.Element;
declare namespace Theme {
    var Context: ({ element, ...themeProps }: ThemeAllProps) => import("react/jsx-runtime").JSX.Element;
}
export default Theme;
export declare function ThemeWrapper({ children, theme, element, className, ...rest }: {
    [x: string]: any;
    children: any;
    theme: any;
    element?: any;
    className?: any;
}): any;
export declare function getThemeClasses(theme: ThemeProps, className?: any): any;
export type ThemeState = ThemeProps & Record<string, unknown>;
/**
 * Read the persisted theme state from localStorage.
 * Supports a `?eufemia-theme=<name>` URL query override for the theme name.
 */
export declare function getTheme(defaultTheme?: ThemeNames): ThemeState;
/**
 * Merge the given properties into the persisted theme state
 * and write it back to localStorage.
 */
export declare function setTheme(themeProps: Partial<ThemeState>, callback?: (theme: ThemeState) => void): void;