import * as CSS from 'csstype'; import { ObjectWithDefault, RecastUICSSProperties, RecastUIStyleObject, TLengthStyledSystem } from '../system'; export interface ScaleDict { [K: string]: T | T[] | NestedScaleDict | undefined; [I: number]: T; } export interface NestedScaleDict extends ScaleDict, ObjectWithDefault { } export declare type Scale = T[] | ScaleDict; export declare type NestedScale = T[] | NestedScaleDict; export declare type ColorOrNestedColorScale = CSS.Property.Color | NestedScale; export interface ColorMode extends ScaleDict { background?: ColorOrNestedColorScale; text?: ColorOrNestedColorScale; primary?: ColorOrNestedColorScale; secondary?: ColorOrNestedColorScale; accent?: ColorOrNestedColorScale; highlight?: ColorOrNestedColorScale; muted?: ColorOrNestedColorScale; } export declare type ColorModesScale = ColorMode & { modes?: { [k: string]: ColorMode; }; }; export interface ThemeStyles { tr?: RecastUIStyleObject; th?: RecastUIStyleObject; td?: RecastUIStyleObject; em?: RecastUIStyleObject; strong?: RecastUIStyleObject; div?: RecastUIStyleObject; p?: RecastUIStyleObject; b?: RecastUIStyleObject; i?: RecastUIStyleObject; a?: RecastUIStyleObject; h1?: RecastUIStyleObject; h2?: RecastUIStyleObject; h3?: RecastUIStyleObject; h4?: RecastUIStyleObject; h5?: RecastUIStyleObject; h6?: RecastUIStyleObject; img?: RecastUIStyleObject; pre?: RecastUIStyleObject; code?: RecastUIStyleObject; ol?: RecastUIStyleObject; ul?: RecastUIStyleObject; li?: RecastUIStyleObject; blockquote?: RecastUIStyleObject; hr?: RecastUIStyleObject; table?: RecastUIStyleObject; delete?: RecastUIStyleObject; inlineCode?: RecastUIStyleObject; thematicBreak?: RecastUIStyleObject; root?: RecastUIStyleObject; [key: string]: RecastUIStyleObject | undefined; } export interface RecastUIConfig { /** * Provide a value here to enable color modes */ initialColorModeName?: string; /** * Provide a value here to set a color mode for printing */ printColorModeName?: string; /** * Adds styles defined in theme.styles.root to the element along with color and background-color */ useRootStyles?: boolean; /** * Initializes the color mode based on the prefers-color-scheme media query */ useColorSchemeMediaQuery?: 'system' | 'initial' | true | false; /** * Adds a global box-sizing: border-box style */ useBorderBox?: boolean; /** * If false, does not save color mode as a localStorage value. */ useLocalStorage?: boolean; } export interface Theme { breakpoints?: Array; mediaQueries?: { [size: string]: string; }; space?: Scale>; fontSizes?: Scale>; fonts?: Scale; fontWeights?: Scale; lineHeights?: Scale>; letterSpacings?: Scale>; sizes?: Scale | CSS.Property.Width<{}>>; borders?: Scale>; borderStyles?: Scale>; borderWidths?: Scale>; radii?: Scale>; shadows?: Scale; zIndices?: Scale; colorStyles?: Scale; textStyles?: Scale; opacities?: Scale; transitions?: Scale; config?: RecastUIConfig; colors?: ColorModesScale; rawColors?: ColorModesScale; styles?: ThemeStyles; grids?: Record; buttons?: Record; text?: Record; links?: Record; images?: Record; cards?: Record; layout?: Record; forms?: Record; badges?: Record; alerts?: Record; messages?: Record; } export interface ThemeContextProps { theme: Theme; children?: any; }