ds-smart-ui/dist/src/theme/types.d.ts

Smart UI v1.0.5 — A production-ready React component library by PT Praisindo Teknologi. Covers inputs, navigation, data display, feedback, and layout with a unified design system, semantic Typography tokens, and full Storybook documentation.

/**
 * Color palette dengan shades dari 50 sampai 900
 */
export interface ColorPalette {
    50: string;
    100: string;
    200: string;
    300: string;
    400: string;
    500: string;
    600: string;
    700: string;
    800: string;
    900: string;
}
/**
 * Special colors untuk kebutuhan khusus
 */
export interface SpecialColors {
    placeholder?: string;
    disabled?: string;
    overlay?: string;
    divider?: string;
    highlight?: string;
}
/**
 * Gradient colors
 */
export interface GradientColors {
    primary?: string;
    secondary?: string;
    success?: string;
    warning?: string;
    danger?: string;
    info?: string;
    light?: string;
    dark?: string;
}
/**
 * Spacing scale
 */
export interface Spacing {
    4?: string;
    8?: string;
    12?: string;
    16?: string;
    24?: string;
    32?: string;
    40?: string;
    48?: string;
    56?: string;
    64?: string;
}
/**
 * Typography scale
 */
export interface Typography {
    fontFamily?: string;
    fontSize?: {
        xxs?: string;
        xs?: string;
        sm?: string;
        md?: string;
        base?: string;
        lg?: string;
        xl?: string;
        '2xl'?: string;
        '3xl'?: string;
        '4xl'?: string;
        '5xl'?: string;
    };
    fontWeight?: {
        light?: string | number;
        regular?: string | number;
        medium?: string | number;
        bold?: string | number;
        extrabold?: string | number;
    };
    lineHeight?: {
        xs?: string;
        sm?: string;
        md?: string;
        base?: string;
        lg?: string;
        xl?: string;
        '2xl'?: string;
        '3xl'?: string;
        '4xl'?: string;
        '5xl'?: string;
    };
    letterSpacing?: {
        tight?: string;
        normal?: string;
        wide?: string;
    };
}
/**
 * Border configuration
 */
export interface BorderConfig {
    radius?: {
        none?: string;
        xs?: string;
        sm?: string;
        md?: string;
        lg?: string;
        xl?: string;
        full?: string;
    };
    width?: {
        thin?: string;
        medium?: string;
        thick?: string;
    };
}
/**
 * Shadow configuration
 */
export interface ShadowConfig {
    none?: string;
    xs?: string;
    sm?: string;
    md?: string;
    lg?: string;
    xl?: string;
}
/**
 * Theme configuration interface
 * Ini adalah interface yang akan digunakan untuk custom theme
 */
export interface ThemeConfig {
    colors?: {
        primary?: Partial<ColorPalette>;
        secondary?: Partial<ColorPalette>;
        success?: Partial<ColorPalette>;
        warning?: Partial<ColorPalette>;
        danger?: Partial<ColorPalette>;
        info?: Partial<ColorPalette>;
        light?: Partial<ColorPalette>;
        dark?: Partial<ColorPalette>;
        special?: SpecialColors;
        gradient?: GradientColors;
        white?: string;
        black?: string;
    };
    spacing?: Spacing;
    typography?: Typography;
    border?: BorderConfig;
    shadow?: ShadowConfig;
}
/**
 * Theme context value
 */
export interface ThemeContextValue {
    theme: ThemeConfig;
    setTheme: (theme: ThemeConfig) => void;
    resetTheme: () => void;
}