aura-glass
Version:
A comprehensive glassmorphism design system for React applications with 142+ production-ready components
60 lines • 2.72 kB
TypeScript
import React from 'react';
import { CSSProperties } from 'react';
export interface TooltipStyles {
container: CSSProperties;
header: CSSProperties;
body: CSSProperties;
footer: CSSProperties;
label: CSSProperties;
value: CSSProperties;
separator: CSSProperties;
arrow: CSSProperties;
}
export interface TooltipPosition {
x: number;
y: number;
placement: 'top' | 'bottom' | 'left' | 'right' | 'auto';
}
interface GlassTooltipContainerProps extends React.HTMLAttributes<HTMLDivElement> {
$theme?: 'light' | 'dark' | 'glass';
$size?: 'small' | 'medium' | 'large';
$position?: TooltipPosition;
$animated?: boolean;
}
export declare const GlassTooltipContainer: React.FC<GlassTooltipContainerProps>;
interface TooltipHeaderProps extends React.HTMLAttributes<HTMLDivElement> {
$theme?: 'light' | 'dark' | 'glass';
$size?: 'small' | 'medium' | 'large';
}
export declare const TooltipHeader: React.FC<TooltipHeaderProps>;
interface TooltipBodyProps extends React.HTMLAttributes<HTMLDivElement> {
$size?: 'small' | 'medium' | 'large';
}
export declare const TooltipBody: React.FC<TooltipBodyProps>;
export declare const TooltipItem: React.FC<React.HTMLAttributes<HTMLDivElement>>;
interface TooltipLabelProps extends React.HTMLAttributes<HTMLSpanElement> {
$theme?: 'light' | 'dark' | 'glass';
$size?: 'small' | 'medium' | 'large';
}
export declare const TooltipLabel: React.FC<TooltipLabelProps>;
interface TooltipValueProps extends React.HTMLAttributes<HTMLSpanElement> {
$theme?: 'light' | 'dark' | 'glass';
$size?: 'small' | 'medium' | 'large';
$color?: string;
}
export declare const TooltipValue: React.FC<TooltipValueProps>;
interface TooltipSeparatorProps extends React.HTMLAttributes<HTMLDivElement> {
$theme?: 'light' | 'dark' | 'glass';
$size?: 'small' | 'medium' | 'large';
}
export declare const TooltipSeparator: React.FC<TooltipSeparatorProps>;
interface TooltipFooterProps extends React.HTMLAttributes<HTMLDivElement> {
$theme?: 'light' | 'dark' | 'glass';
$size?: 'small' | 'medium' | 'large';
}
export declare const TooltipFooter: React.FC<TooltipFooterProps>;
export declare const createTooltipStyles: (theme?: "light" | "dark" | "glass", size?: "small" | "medium" | "large") => TooltipStyles;
export declare const calculateTooltipPosition: (mouseX: number, mouseY: number, tooltipWidth: number, tooltipHeight: number, containerRect: DOMRect, offset?: number) => TooltipPosition;
export declare const formatTooltipValue: (value: number | string, format?: "number" | "currency" | "percentage" | "string", options?: Intl.NumberFormatOptions) => string;
export {};
//# sourceMappingURL=TooltipStyles.d.ts.map