/** * Style interface for component styling */ export interface Style { variant?: string; textColor?: string; backgroundColor?: string; borderColor?: string; size?: 'sm' | 'md' | 'lg'; width?: string; height?: string; border?: boolean; rounded?: boolean; outline?: boolean; shadow?: 'none' | 'sm' | 'md' | 'lg'; } /** * Layout interface for component layout */ export interface Layout { display?: 'block' | 'inline' | 'flex' | 'grid' | 'none'; position?: 'static' | 'relative' | 'absolute' | 'fixed' | 'sticky'; gap?: number; padding?: number; paddingX?: number; paddingY?: number; margin?: number; cols?: number; rows?: number; } /** * Typography interface for text styling */ export interface Typography { fontFamily?: 'sans' | 'serif' | 'mono'; fontSize?: 'xs' | 'sm' | 'base' | 'lg' | 'xl' | '2xl'; fontWeight?: 'normal' | 'medium' | 'bold'; textAlign?: 'left' | 'center' | 'right' | 'justify'; lineHeight?: 'none' | 'tight' | 'normal' | 'relaxed'; letterSpacing?: 'tight' | 'normal' | 'wide'; textDecoration?: 'underline' | 'line-through' | 'none'; textTransform?: 'uppercase' | 'lowercase' | 'capitalize'; } /** * Animation interface for component animations */ export interface Animation { animation?: 'none' | 'spin' | 'ping' | 'pulse' | 'bounce'; transition?: 'none' | 'all' | 'colors' | 'opacity' | 'shadow'; duration?: 'fast' | 'normal' | 'slow'; scale?: number; rotate?: number; translate?: string; delay?: number; timing?: 'linear' | 'ease' | 'ease-in' | 'ease-out'; } /** * Interactive interface for interactive states */ export interface Interactive { cursor?: 'pointer' | 'default' | 'not-allowed'; hover?: Partial