aura-glass
Version:
A comprehensive glassmorphism design system for React applications with 142+ production-ready components
79 lines • 1.96 kB
TypeScript
import React from "react";
export interface GlassAvatarProps extends React.ImgHTMLAttributes<HTMLImageElement> {
/**
* Avatar variant
*/
variant?: "default" | "circle" | "square" | "glass-radius-md";
/**
* Avatar size
*/
size?: "xs" | "sm" | "md" | "lg" | "xl" | "2xl";
/**
* Avatar status indicator
*/
status?: "online" | "offline" | "away" | "busy";
/**
* Show status indicator
*/
showStatus?: boolean;
/**
* Glass elevation
*/
elevation?: 1 | 2 | 3;
/**
* Custom fallback content
*/
fallback?: React.ReactNode;
/**
* Fallback text (will generate initials)
*/
fallbackText?: string;
/**
* ARIA label for the avatar
*/
"aria-label"?: string;
}
export interface GlassAvatarGroupProps {
/**
* Maximum number of avatars to show
*/
max?: number;
/**
* Spacing between avatars
*/
spacing?: "tight" | "normal" | "loose";
/**
* Avatar size for group
*/
size?: GlassAvatarProps["size"];
/**
* Children (GlassAvatar components)
*/
children: React.ReactNode;
}
export interface GlassAvatarFallbackProps {
/**
* Delay before showing fallback (ms)
*/
delayMs?: number;
/**
* Children content
*/
children: React.ReactNode;
}
/**
* GlassAvatar component
* A glassmorphism avatar with status indicators and fallbacks
*/
export declare const GlassAvatar: React.ForwardRefExoticComponent<GlassAvatarProps & React.RefAttributes<HTMLImageElement>>;
/**
* GlassAvatarGroup component
* Groups multiple avatars with overlap and max display
*/
export declare const GlassAvatarGroup: React.FC<GlassAvatarGroupProps>;
/**
* GlassAvatarFallback component
* Shows fallback content with optional delay
*/
export declare const GlassAvatarFallback: React.FC<GlassAvatarFallbackProps>;
//# sourceMappingURL=GlassAvatar.d.ts.map