aura-glass
Version:
A comprehensive glassmorphism design system for React applications with 142+ production-ready components
52 lines • 1.93 kB
TypeScript
/**
* AuraGlass Style Utilities
* Generate token-based style objects for glassmorphism components
*/
export interface GlassStyleOptions {
elev?: 0 | 1 | 2 | 3 | 4 | 5 | 6;
variant?: 'default' | 'primary' | 'success' | 'warning' | 'danger' | 'info';
blur?: 'none' | 'sm' | 'md' | 'lg' | 'xl';
radius?: 'none' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | 'full';
opacity?: number;
interactive?: boolean;
glow?: boolean;
}
/**
* Create a style object for glassmorphism components
* Returns CSSProperties-compatible object
*/
export declare function createGlassStyle(options?: GlassStyleOptions): React.CSSProperties;
/**
* Get CSS variable for a token path
*/
export declare function getGlassToken(path: string): string;
/**
* Compose multiple glass styles with proper precedence
*/
export declare function composeGlassStyles(...styles: (React.CSSProperties | undefined)[]): React.CSSProperties;
/**
* Generate responsive glass styles
*/
export declare function createResponsiveGlassStyle(base: GlassStyleOptions, breakpoints?: {
sm?: GlassStyleOptions;
md?: GlassStyleOptions;
lg?: GlassStyleOptions;
xl?: GlassStyleOptions;
}): Record<string, React.CSSProperties>;
/**
* Calculate appropriate text color based on background luminance
*/
export declare function getGlassTextColor(variant?: GlassStyleOptions['variant'], isDark?: boolean): string;
/**
* Generate animation properties for glass elements
*/
export declare function createGlassAnimation(type: 'float' | 'shimmer' | 'ambient' | 'press'): React.CSSProperties;
/**
* Create elevation-specific shadow values
*/
export declare function getElevationShadow(level?: GlassStyleOptions['elev']): string;
/**
* Create border styles with proper token usage
*/
export declare function createGlassBorder(variant?: GlassStyleOptions['variant'], width?: number): React.CSSProperties;
//# sourceMappingURL=createGlassStyle.d.ts.map