aura-glass
Version:
A comprehensive glassmorphism design system for React applications with 142+ production-ready components
98 lines • 2.73 kB
TypeScript
import React from "react";
export interface ToastData {
id: string;
title?: string;
description?: string;
type?: "success" | "error" | "warning" | "info";
duration?: number;
action?: {
label: string;
onClick: () => void;
};
onClose?: () => void;
}
export interface GlassToastProps extends ToastData, Omit<React.HTMLAttributes<HTMLDivElement>, keyof ToastData> {
/**
* Callback when toast is dismissed
*/
onDismiss?: (id: string) => void;
}
export interface GlassToastProviderProps {
/**
* Children
*/
children: React.ReactNode;
/**
* Default toast duration (ms)
*/
duration?: number;
/**
* Maximum number of toasts to show
*/
maxToasts?: number;
/**
* Toast position
*/
position?: "top-left" | "top-right" | "bottom-left" | "bottom-right" | "top-center" | "bottom-center";
}
export interface GlassToastViewportProps {
/**
* Custom className
*/
className?: string;
/**
* Hotkey to focus viewport
*/
hotkey?: string[];
}
export interface GlassToastActionProps {
/**
* Action content
*/
children: React.ReactNode;
/**
* Action className
*/
className?: string;
}
export declare const useToast: () => {
toasts: ToastData[];
addToast: (toast: Omit<ToastData, "id">) => string;
removeToast: (id: string) => void;
updateToast: (id: string, updates: Partial<ToastData>) => void;
};
/**
* GlassToast component
* Individual toast notification
*/
export declare const GlassToast: React.FC<GlassToastProps>;
/**
* GlassToastProvider component
* Provides toast context and manages toast state
*/
export declare const GlassToastProvider: React.FC<GlassToastProviderProps>;
/**
* GlassToastViewport component
* Container for displaying toasts
*/
export declare const GlassToastViewport: React.FC<GlassToastViewportProps & {
position?: GlassToastProviderProps["position"];
}>;
/**
* GlassToastAction component
* Action button for toast
*/
export declare const GlassToastAction: React.FC<GlassToastActionProps & {
onClick?: () => void;
}>;
/**
* Hook for creating different types of toasts
*/
export declare const useToastActions: () => {
success: (title: string, description?: string, options?: Partial<ToastData>) => string;
error: (title: string, description?: string, options?: Partial<ToastData>) => string;
warning: (title: string, description?: string, options?: Partial<ToastData>) => string;
info: (title: string, description?: string, options?: Partial<ToastData>) => string;
custom: (toast: Omit<ToastData, "id">) => string;
};
//# sourceMappingURL=GlassToast.d.ts.map