@mvn-ui/react 0.1.2 → 0.1.4

package/dist/index.d.mts

@@ -44,6 +44,7 @@ import { DayPicker, DayButton, DateRange } from 'react-day-picker';
 export { DateRange } from 'react-day-picker';
 import useEmblaCarousel, { UseEmblaCarouselType } from 'embla-carousel-react';
 import { ClassValue } from 'clsx';
+export { Area, Bar, Brush, CartesianGrid, Cell, Legend as ChartLegend, Tooltip as ChartTooltip, Line, Pie, PolarAngleAxis, PolarGrid, PolarRadiusAxis, Radar, ReferenceArea, ReferenceLine, ResponsiveContainer, Scatter, XAxis, YAxis, ZAxis } from 'recharts';
 
 /**
  * Button variants (shadcn-style)
@@ -309,8 +310,14 @@ interface RadioGroupProps extends Omit<React$1.ComponentPropsWithoutRef<typeof R
 declare const RadioGroup: React$1.ForwardRefExoticComponent<RadioGroupProps & React$1.RefAttributes<HTMLDivElement>>;
 declare const RadioGroupItem: React$1.ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupItemProps & React$1.RefAttributes<HTMLButtonElement>, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
 
-type SwitchProps = React$1.ComponentPropsWithoutRef<typeof SwitchPrimitives.Root>;
-declare const Switch: React$1.ForwardRefExoticComponent<Omit<SwitchPrimitives.SwitchProps & React$1.RefAttributes<HTMLButtonElement>, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
+type SwitchProps = React$1.ComponentPropsWithoutRef<typeof SwitchPrimitives.Root> & {
+    offNode?: React$1.ReactNode;
+    onNode?: React$1.ReactNode;
+};
+declare const Switch: React$1.ForwardRefExoticComponent<Omit<SwitchPrimitives.SwitchProps & React$1.RefAttributes<HTMLButtonElement>, "ref"> & {
+    offNode?: React$1.ReactNode;
+    onNode?: React$1.ReactNode;
+} & React$1.RefAttributes<HTMLButtonElement>>;
 
 declare const toggleVariants: (props?: ({
     variant?: "default" | "outline" | "solid" | null | undefined;
@@ -988,7 +995,11 @@ declare const DialogTrigger: React$1.ForwardRefExoticComponent<DialogPrimitive.D
 declare const DialogPortal: React$1.FC<DialogPrimitive.DialogPortalProps>;
 declare const DialogClose: React$1.ForwardRefExoticComponent<DialogPrimitive.DialogCloseProps & React$1.RefAttributes<HTMLButtonElement>>;
 declare const DialogOverlay: React$1.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogOverlayProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
-declare const DialogContent: React$1.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogContentProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
+declare const DialogContent: React$1.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogContentProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & {
+    showClose?: boolean;
+    closeClassName?: string;
+    customClose?: React$1.ReactNode;
+} & React$1.RefAttributes<HTMLDivElement>>;
 declare const DialogHeader: {
     ({ className, ...props }: React$1.HTMLAttributes<HTMLDivElement>): react_jsx_runtime.JSX.Element;
     displayName: string;
@@ -1073,8 +1084,8 @@ declare const TooltipContent: React$1.ForwardRefExoticComponent<Omit<TooltipPrim
 interface SimpleTooltipProps {
     children: React$1.ReactNode;
     content: React$1.ReactNode;
-    side?: "top" | "right" | "bottom" | "left";
-    align?: "start" | "center" | "end";
+    side?: 'top' | 'right' | 'bottom' | 'left';
+    align?: 'start' | 'center' | 'end';
     delayDuration?: number;
     className?: string;
 }
@@ -1646,7 +1657,7 @@ declare const ResizableHandle: ({ withHandle, className, ...props }: React$1.Com
 }) => react_jsx_runtime.JSX.Element;
 
 interface ScrollAreaProps extends React$1.ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.Root> {
-    orientation?: "vertical" | "horizontal" | "both";
+    orientation?: 'vertical' | 'horizontal' | 'both';
     scrollbarClassName?: string;
     thumbClassName?: string;
 }
@@ -1899,6 +1910,15 @@ interface SimpleTableProps<T = any> extends VariantProps<typeof tableVariants> {
     pagingPosition?: 'right' | 'left' | 'middle';
     /** Number of records to load per lazy load call */
     recordPerChunk?: number;
+    /** Initial column pinning state */
+    defaultColumnPinning?: {
+        left?: string[];
+        right?: string[];
+    };
+    /** Enable column resizing */
+    enableColumnResizing?: boolean;
+    /** Column resize mode: 'onChange' updates width while dragging, 'onEnd' updates on mouse up */
+    columnResizeMode?: 'onChange' | 'onEnd';
 }
 interface MetaFilterValue {
     filterType: string;
@@ -1950,7 +1970,7 @@ interface MetaFilterValue {
  *   onRowClick={(record) => console.log(record)}
  * />
  */
-declare function SimpleTable<T = any>({ data, columns, caption, loading, loadingComponent, emptyMessage, rowKey, onRowClick, rowClassName, className, pagination, pageSize, currentPage, onPageChange, sortBy, sortDirection, onSortChange, variant, size, selectable, onSelectionChange, enableGlobalFilter, globalFilterPlaceholder, enableColumnOrdering, getCheckboxProps, selectedRowKey, enableExport, exportFileName, onExport, expandable, renderExpandedContent, getRowCanExpand, getRowExpandable, onExpandedChange, onLazyScrollLoad, scrollLoadThreshold, numberOfPageButtons, onClickExport, baseRowEstimateSize, expandContentEstimateSize, overScan, virtualizationThreshold, showIndex, customizeToolbar, manualSorting, onFilterChange, manualFiltering, lazyLoadIndicatorType, maxHeight, maxWidth, maxRecords, loadingText, pagingPosition, recordPerChunk, }: SimpleTableProps<T>): react_jsx_runtime.JSX.Element;
+declare function SimpleTable<T = any>({ data, columns, caption, loading, loadingComponent, emptyMessage, rowKey, onRowClick, rowClassName, className, pagination, pageSize, currentPage, onPageChange, sortBy, sortDirection, onSortChange, variant, size, selectable, onSelectionChange, enableGlobalFilter, globalFilterPlaceholder, enableColumnOrdering, getCheckboxProps, selectedRowKey, enableExport, exportFileName, onExport, expandable, renderExpandedContent, getRowCanExpand, getRowExpandable, onExpandedChange, onLazyScrollLoad, scrollLoadThreshold, numberOfPageButtons, onClickExport, baseRowEstimateSize, expandContentEstimateSize, overScan, virtualizationThreshold, showIndex, customizeToolbar, manualSorting, onFilterChange, manualFiltering, lazyLoadIndicatorType, maxHeight, maxWidth, maxRecords, loadingText, pagingPosition, recordPerChunk, defaultColumnPinning, }: SimpleTableProps<T>): react_jsx_runtime.JSX.Element;
 
 interface DataTableProps<TData, TValue> {
     columns: ColumnDef<TData, TValue>[];
@@ -2363,7 +2383,7 @@ type CarouselPlugin = UseCarouselParameters[1];
 type CarouselProps = {
     opts?: CarouselOptions;
     plugins?: CarouselPlugin;
-    orientation?: "horizontal" | "vertical";
+    orientation?: 'horizontal' | 'vertical';
     setApi?: (api: CarouselApi) => void;
 };
 type CarouselContextProps = {
@@ -2394,7 +2414,7 @@ interface SimpleCarouselProps {
     /** Array of carousel items */
     items: CarouselItemData[];
     /** Carousel orientation */
-    orientation?: "horizontal" | "vertical";
+    orientation?: 'horizontal' | 'vertical';
     /** Show navigation arrows */
     showArrows?: boolean;
     /** Show dots indicators */
@@ -2508,4 +2528,445 @@ declare const TypographyGroup: {
 
 declare function cn(...inputs: ClassValue[]): string;
 
-export { Accordion, type AccordionItemData, type AccordionProps, Alert, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, type AlertProps, AspectRatio, Avatar, AvatarFallback, AvatarGroup, type AvatarGroupData, type AvatarGroupProps, AvatarImage, Badge, type BadgeProps, Blockquote, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, ButtonGroup, type ButtonGroupProps, ButtonGroupSeparator, type ButtonGroupSeparatorProps, ButtonGroupText, type ButtonGroupTextProps, type ButtonProps, Calendar, CalendarDayButton, type CalendarProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, type CarouselApi, CarouselContent, CarouselItem, type CarouselItemData, CarouselNext, CarouselPrevious, Checkbox, type CheckboxProps, Collapsible, CollapsibleContent, CollapsibleItem, CollapsibleTrigger, type ColumnsProps, Combobox, type ComboboxOption, type ComboboxProps, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, DataTable, type DataTableProps, DatePicker, type DatePickerProps, DateRangePicker, type DateRangePickerProps, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DotsSpinner, type DotsSpinnerProps, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Empty, type EmptyProps, Field, type FieldError, type FieldProps, Form, type FormInstance, FormItem, type FormItemProps, type FormItemVariant, FormList, type FormProps, H1, H2, H3, H4, HoverCard, HoverCardContent, HoverCardTrigger, IconButton, type IconButtonProps, InlineCode, Input, InputGroup, type InputGroupProps, InputOTP, InputOTPGroup, type InputOTPProps, InputOTPSeparator, InputOTPSlot, type InputProps, Item, ItemGroup, ItemList, type ItemProps, ItemSeparator, Label, type LabelProps, Lead, List, ListItem, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, Muted, type NamePath, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, P, Pagination, PaginationContent, PaginationEllipsis, PaginationFirst, PaginationItem, PaginationLast, PaginationLink, PaginationNext, PaginationPrevious, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, ProductCard, ProfileCard, Progress, type ProgressProps, RadioGroup, RadioGroupItem, type RadioGroupItemData, type RadioGroupProps, ResizableHandle, ResizablePanel, ResizablePanelGroup, type Rule, ScrollArea, type ScrollAreaProps, ScrollBar, type ScrollBarProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, type SeparatorProps, Sheet, SheetClose, SheetContent, type SheetContentProps, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Sidebar, SidebarContent, type SidebarContextProps, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, SimpleAvatar, type SimpleAvatarProps, SimpleCard, type SimpleCardProps, SimpleCarousel, type SimpleCarouselProps, SimpleTable, type SimpleTableProps, SimpleTabs, type SimpleTabsProps, SimpleTooltip, type SimpleTooltipProps, Skeleton, SkeletonCard, type SkeletonCardProps, type SkeletonProps, Slider, type SliderProps, Small, Spinner, type SpinnerProps, Switch, type SwitchProps, type TabItem, Table, TableBody, TableCaption, TableCell, type TableColumn, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, type TextareaProps, Toast, type ToastData, type ToastId, type ToastProps, ToastProvider, Toaster, Toggle, ToggleGroup, ToggleGroupItem, type ToggleGroupItemData, type ToggleGroupItemProps, type ToggleGroupProps, type ToggleProps, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, Typography, TypographyGroup, type TypographyProps, type TypographyType, alertVariants, avatarVariants, badgeVariants, buttonVariants, cardVariants, checkboxVariants, cn, composeRules, emailRule, emptyVariants, fieldVariants, getInitials, inputGroupVariants, inputVariants, itemVariants, labelVariants, maxLengthRule, maxValueRule, minLengthRule, minValueRule, navigationMenuTriggerStyle, numberRule, patternRule, progressVariants, radioGroupVariants, requiredRule, separatorVariants, skeletonVariants, spinnerVariants, tableVariants, textareaVariants, toastVariants, toggleGroupVariants, toggleVariants, urlRule, useCarousel, useForm, useSidebar, useToast, useWatch };
+/**
+ * Default chart color palette - uses CSS variables for theme integration
+ * CSS variables contain hex colors directly (e.g., #007bff)
+ */
+declare const CHART_COLORS: {
+    readonly primary: "var(--chart-1)";
+    readonly secondary: "var(--chart-2)";
+    readonly tertiary: "var(--chart-3)";
+    readonly quaternary: "var(--chart-4)";
+    readonly quinary: "var(--chart-5)";
+    readonly success: "#22a55b";
+    readonly warning: "#f59e0b";
+    readonly error: "#ef4444";
+    readonly info: "var(--chart-1)";
+    readonly muted: "var(--muted-foreground)";
+    readonly foreground: "var(--foreground)";
+    readonly background: "var(--background)";
+    readonly grid: "var(--border)";
+};
+/**
+ * Chart color palette array for multi-series charts
+ */
+declare const CHART_PALETTE: ("var(--chart-1)" | "var(--chart-2)" | "var(--chart-3)" | "var(--chart-4)" | "var(--chart-5)" | "#22a55b" | "#f59e0b" | "#ef4444")[];
+/**
+ * Get theme-aware chart colors (for client-side usage)
+ * Returns hex colors directly from CSS variables
+ */
+declare const getThemeColors: () => {
+    primary: string;
+    chart1: string;
+    chart2: string;
+    chart3: string;
+    chart4: string;
+    chart5: string;
+    foreground: string;
+    muted: string;
+    grid: string;
+    background: string;
+};
+/**
+ * Common chart tooltip styles
+ */
+declare const tooltipStyle: {
+    backgroundColor: string;
+    border: string;
+    borderRadius: string;
+    padding: string;
+    boxShadow: string;
+    color: string;
+};
+/**
+ * Common chart legend styles
+ */
+declare const legendStyle: {
+    fontSize: string;
+    color: string;
+};
+type ChartColor = keyof typeof CHART_COLORS;
+
+interface LineChartDataKey {
+    dataKey: string;
+    name?: string;
+    stroke?: string;
+    strokeWidth?: number;
+    dot?: boolean;
+    type?: 'monotone' | 'linear' | 'step' | 'stepBefore' | 'stepAfter';
+}
+interface LineChartProps {
+    /** Chart data array */
+    data: Record<string, unknown>[];
+    /** Data key for X axis */
+    xAxisKey: string;
+    /** Line configurations */
+    lines: LineChartDataKey[];
+    /** Chart width (default: 100%) */
+    width?: number | string;
+    /** Chart height (default: 300, use '100%' to fill container) */
+    height?: number | string;
+    /** Show grid lines */
+    showGrid?: boolean;
+    /** Show tooltip */
+    showTooltip?: boolean;
+    /** Show legend */
+    showLegend?: boolean;
+    /** Show X axis (default: true) */
+    showXAxis?: boolean;
+    /** Show Y axis (default: true) */
+    showYAxis?: boolean;
+    /** X axis label */
+    xAxisLabel?: string;
+    /** Y axis label */
+    yAxisLabel?: string;
+    /** Chart margins */
+    margin?: {
+        top?: number;
+        right?: number;
+        bottom?: number;
+        left?: number;
+    };
+    /** Custom class name */
+    className?: string;
+}
+/**
+ * LineChart - Theme-aware line chart component
+ *
+ * @example
+ * <LineChart
+ *   data={[{ month: 'Jan', sales: 100 }, { month: 'Feb', sales: 200 }]}
+ *   xAxisKey="month"
+ *   lines={[{ dataKey: 'sales', name: 'Sales' }]}
+ * />
+ */
+declare function LineChart({ data, xAxisKey, lines, width, height, showGrid, showTooltip, showLegend, showXAxis, showYAxis, margin, className, }: LineChartProps): react_jsx_runtime.JSX.Element;
+
+interface BarChartDataKey {
+    dataKey: string;
+    name?: string;
+    fill?: string;
+    stackId?: string;
+    radius?: number | [number, number, number, number];
+}
+interface BarChartProps {
+    /** Chart data array */
+    data: Record<string, unknown>[];
+    /** Data key for X axis */
+    xAxisKey: string;
+    /** Bar configurations */
+    bars: BarChartDataKey[];
+    /** Chart width (default: 100%) */
+    width?: number | string;
+    /** Chart height (default: 300) */
+    height?: number;
+    /** Show grid lines */
+    showGrid?: boolean;
+    /** Show tooltip */
+    showTooltip?: boolean;
+    /** Show legend */
+    showLegend?: boolean;
+    /** Layout direction */
+    layout?: 'horizontal' | 'vertical';
+    /** Chart margins */
+    margin?: {
+        top?: number;
+        right?: number;
+        bottom?: number;
+        left?: number;
+    };
+    /** Custom class name */
+    className?: string;
+}
+/**
+ * BarChart - Theme-aware bar chart component
+ *
+ * @example
+ * <BarChart
+ *   data={[{ category: 'A', value: 100 }, { category: 'B', value: 200 }]}
+ *   xAxisKey="category"
+ *   bars={[{ dataKey: 'value', name: 'Value' }]}
+ * />
+ */
+declare function BarChart({ data, xAxisKey, bars, width, height, showGrid, showTooltip, showLegend, layout, margin, className, }: BarChartProps): react_jsx_runtime.JSX.Element;
+
+interface PieChartDataItem {
+    name: string;
+    value: number;
+    fill?: string;
+}
+interface PieChartProps {
+    /** Chart data array */
+    data: PieChartDataItem[];
+    /** Data key for values (default: 'value') */
+    dataKey?: string;
+    /** Name key for labels (default: 'name') */
+    nameKey?: string;
+    /** Chart width (default: 100%) */
+    width?: number | string;
+    /** Chart height (default: 300) */
+    height?: number;
+    /** Show tooltip */
+    showTooltip?: boolean;
+    /** Show legend */
+    showLegend?: boolean;
+    /** Inner radius for donut chart (default: 0) */
+    innerRadius?: number;
+    /** Outer radius (default: 80) */
+    outerRadius?: number;
+    /** Show labels on slices */
+    showLabel?: boolean;
+    /** Chart margins */
+    margin?: {
+        top?: number;
+        right?: number;
+        bottom?: number;
+        left?: number;
+    };
+    /** Custom class name */
+    className?: string;
+}
+/**
+ * PieChart - Theme-aware pie/donut chart component
+ *
+ * @example
+ * <PieChart
+ *   data={[
+ *     { name: 'Category A', value: 400 },
+ *     { name: 'Category B', value: 300 },
+ *   ]}
+ * />
+ *
+ * // Donut chart
+ * <PieChart data={data} innerRadius={60} outerRadius={80} />
+ */
+declare function PieChart({ data, dataKey, nameKey, width, height, showTooltip, showLegend, innerRadius, outerRadius, showLabel, margin, className, }: PieChartProps): react_jsx_runtime.JSX.Element;
+
+interface AreaChartDataKey {
+    dataKey: string;
+    name?: string;
+    stroke?: string;
+    fill?: string;
+    fillOpacity?: number;
+    stackId?: string;
+    type?: 'monotone' | 'linear' | 'step' | 'stepBefore' | 'stepAfter';
+}
+interface AreaChartProps {
+    /** Chart data array */
+    data: Record<string, unknown>[];
+    /** Data key for X axis */
+    xAxisKey: string;
+    /** Area configurations */
+    areas: AreaChartDataKey[];
+    /** Chart width (default: 100%) */
+    width?: number | string;
+    /** Chart height (default: 300) */
+    height?: number;
+    /** Show grid lines */
+    showGrid?: boolean;
+    /** Show tooltip */
+    showTooltip?: boolean;
+    /** Show legend */
+    showLegend?: boolean;
+    /** Chart margins */
+    margin?: {
+        top?: number;
+        right?: number;
+        bottom?: number;
+        left?: number;
+    };
+    /** Custom class name */
+    className?: string;
+}
+/**
+ * AreaChart - Theme-aware area chart component
+ *
+ * @example
+ * <AreaChart
+ *   data={[{ month: 'Jan', revenue: 1000 }, { month: 'Feb', revenue: 1500 }]}
+ *   xAxisKey="month"
+ *   areas={[{ dataKey: 'revenue', name: 'Revenue' }]}
+ * />
+ */
+declare function AreaChart({ data, xAxisKey, areas, width, height, showGrid, showTooltip, showLegend, margin, className, }: AreaChartProps): react_jsx_runtime.JSX.Element;
+
+interface ScatterChartDataSeries {
+    name: string;
+    data: Record<string, unknown>[];
+    fill?: string;
+}
+interface ScatterChartProps {
+    /** Scatter data series */
+    series: ScatterChartDataSeries[];
+    /** Data key for X axis */
+    xAxisKey: string;
+    /** Data key for Y axis */
+    yAxisKey: string;
+    /** Data key for Z axis (bubble size) */
+    zAxisKey?: string;
+    /** Chart width (default: 100%) */
+    width?: number | string;
+    /** Chart height (default: 300) */
+    height?: number;
+    /** Show grid lines */
+    showGrid?: boolean;
+    /** Show tooltip */
+    showTooltip?: boolean;
+    /** Show legend */
+    showLegend?: boolean;
+    /** X axis label */
+    xAxisLabel?: string;
+    /** Y axis label */
+    yAxisLabel?: string;
+    /** Chart margins */
+    margin?: {
+        top?: number;
+        right?: number;
+        bottom?: number;
+        left?: number;
+    };
+    /** Custom class name */
+    className?: string;
+}
+/**
+ * ScatterChart - Theme-aware scatter/bubble chart component
+ *
+ * @example
+ * <ScatterChart
+ *   series={[
+ *     { name: 'Series A', data: [{ x: 100, y: 200 }, { x: 120, y: 100 }] }
+ *   ]}
+ *   xAxisKey="x"
+ *   yAxisKey="y"
+ * />
+ */
+declare function ScatterChart({ series, xAxisKey, yAxisKey, zAxisKey, width, height, showGrid, showTooltip, showLegend, margin, className, }: ScatterChartProps): react_jsx_runtime.JSX.Element;
+
+interface RadarChartDataKey {
+    dataKey: string;
+    name?: string;
+    stroke?: string;
+    fill?: string;
+    fillOpacity?: number;
+}
+interface RadarChartProps {
+    /** Chart data array */
+    data: Record<string, unknown>[];
+    /** Data key for angle axis (categories) */
+    angleKey: string;
+    /** Radar configurations */
+    radars: RadarChartDataKey[];
+    /** Chart width (default: 100%) */
+    width?: number | string;
+    /** Chart height (default: 300) */
+    height?: number;
+    /** Show tooltip */
+    showTooltip?: boolean;
+    /** Show legend */
+    showLegend?: boolean;
+    /** Outer radius (default: 80) */
+    outerRadius?: number | string;
+    /** Chart margins */
+    margin?: {
+        top?: number;
+        right?: number;
+        bottom?: number;
+        left?: number;
+    };
+    /** Custom class name */
+    className?: string;
+    /** Domain for radius axis */
+    domain?: [number, number];
+}
+/**
+ * RadarChart - Theme-aware radar/spider chart component
+ *
+ * @example
+ * <RadarChart
+ *   data={[
+ *     { subject: 'Math', score: 80 },
+ *     { subject: 'Science', score: 90 },
+ *   ]}
+ *   angleKey="subject"
+ *   radars={[{ dataKey: 'score', name: 'Score' }]}
+ * />
+ */
+declare function RadarChart({ data, angleKey, radars, width, height, showTooltip, showLegend, outerRadius, margin, domain, className, }: RadarChartProps): react_jsx_runtime.JSX.Element;
+
+/** Available theme names */
+declare const THEMES: {
+    readonly default: "default";
+    readonly sunset: "sunset";
+    readonly lavender: "lavender";
+    readonly rose: "rose";
+    readonly slate: "slate";
+    readonly midnight: "midnight";
+    readonly emerald: "emerald";
+    readonly amber: "amber";
+    readonly crimson: "crimson";
+};
+type ThemeName = keyof typeof THEMES;
+type ThemeMode = 'light' | 'dark' | 'system';
+/** Theme metadata for UI selectors */
+interface ThemeInfo {
+    name: ThemeName;
+    label: string;
+    description: string;
+    primaryColor: string;
+}
+/** Theme catalog with metadata */
+declare const THEME_CATALOG: ThemeInfo[];
+/**
+ * Get the current theme from the document
+ */
+declare function getCurrentTheme(): ThemeName;
+/**
+ * Get the current color mode (light/dark)
+ */
+declare function getCurrentMode(): 'light' | 'dark';
+/**
+ * Set the theme on the document root
+ */
+declare function setTheme(theme: ThemeName): void;
+/**
+ * Set the color mode (light/dark)
+ */
+declare function setMode(mode: ThemeMode): void;
+/**
+ * Initialize theme from localStorage or system preference
+ */
+declare function initializeTheme(): void;
+interface ThemeContextValue {
+    theme: ThemeName;
+    mode: ThemeMode;
+    resolvedMode: 'light' | 'dark';
+    setTheme: (theme: ThemeName) => void;
+    setMode: (mode: ThemeMode) => void;
+}
+interface ThemeProviderProps {
+    children: ReactNode;
+    /** Default theme (default: 'default') */
+    defaultTheme?: ThemeName;
+    /** Default mode (default: 'system') */
+    defaultMode?: ThemeMode;
+    /** Storage key for theme persistence */
+    storageKey?: string;
+}
+/**
+ * ThemeProvider component for React applications
+ *
+ * @example
+ * <ThemeProvider defaultTheme="ocean" defaultMode="dark">
+ *   <App />
+ * </ThemeProvider>
+ */
+declare function ThemeProvider({ children, defaultTheme, defaultMode, storageKey, }: ThemeProviderProps): react_jsx_runtime.JSX.Element;
+/**
+ * Hook to access theme context
+ *
+ * @example
+ * const { theme, setTheme, mode, setMode } = useTheme();
+ */
+declare function useTheme(): ThemeContextValue;
+
+export { Accordion, type AccordionItemData, type AccordionProps, Alert, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, type AlertProps, AreaChart, type AreaChartDataKey, type AreaChartProps, AspectRatio, Avatar, AvatarFallback, AvatarGroup, type AvatarGroupData, type AvatarGroupProps, AvatarImage, Badge, type BadgeProps, BarChart, type BarChartDataKey, type BarChartProps, Blockquote, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, ButtonGroup, type ButtonGroupProps, ButtonGroupSeparator, type ButtonGroupSeparatorProps, ButtonGroupText, type ButtonGroupTextProps, type ButtonProps, CHART_COLORS, CHART_PALETTE, Calendar, CalendarDayButton, type CalendarProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, type CarouselApi, CarouselContent, CarouselItem, type CarouselItemData, CarouselNext, CarouselPrevious, type ChartColor, Checkbox, type CheckboxProps, Collapsible, CollapsibleContent, CollapsibleItem, CollapsibleTrigger, type ColumnsProps, Combobox, type ComboboxOption, type ComboboxProps, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, DataTable, type DataTableProps, DatePicker, type DatePickerProps, DateRangePicker, type DateRangePickerProps, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DotsSpinner, type DotsSpinnerProps, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Empty, type EmptyProps, Field, type FieldError, type FieldProps, Form, type FormInstance, FormItem, type FormItemProps, type FormItemVariant, FormList, type FormProps, H1, H2, H3, H4, HoverCard, HoverCardContent, HoverCardTrigger, IconButton, type IconButtonProps, InlineCode, Input, InputGroup, type InputGroupProps, InputOTP, InputOTPGroup, type InputOTPProps, InputOTPSeparator, InputOTPSlot, type InputProps, Item, ItemGroup, ItemList, type ItemProps, ItemSeparator, Label, type LabelProps, Lead, LineChart, type LineChartDataKey, type LineChartProps, List, ListItem, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, Muted, type NamePath, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, P, Pagination, PaginationContent, PaginationEllipsis, PaginationFirst, PaginationItem, PaginationLast, PaginationLink, PaginationNext, PaginationPrevious, PieChart, type PieChartDataItem, type PieChartProps, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, ProductCard, ProfileCard, Progress, type ProgressProps, RadarChart, type RadarChartDataKey, type RadarChartProps, RadioGroup, RadioGroupItem, type RadioGroupItemData, type RadioGroupProps, ResizableHandle, ResizablePanel, ResizablePanelGroup, type Rule, ScatterChart, type ScatterChartDataSeries, type ScatterChartProps, ScrollArea, type ScrollAreaProps, ScrollBar, type ScrollBarProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, type SeparatorProps, Sheet, SheetClose, SheetContent, type SheetContentProps, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Sidebar, SidebarContent, type SidebarContextProps, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, SimpleAvatar, type SimpleAvatarProps, SimpleCard, type SimpleCardProps, SimpleCarousel, type SimpleCarouselProps, SimpleTable, type SimpleTableProps, SimpleTabs, type SimpleTabsProps, SimpleTooltip, type SimpleTooltipProps, Skeleton, SkeletonCard, type SkeletonCardProps, type SkeletonProps, Slider, type SliderProps, Small, Spinner, type SpinnerProps, Switch, type SwitchProps, THEMES, THEME_CATALOG, type TabItem, Table, TableBody, TableCaption, TableCell, type TableColumn, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, type TextareaProps, type ThemeInfo, type ThemeMode, type ThemeName, ThemeProvider, type ThemeProviderProps, Toast, type ToastData, type ToastId, type ToastProps, ToastProvider, Toaster, Toggle, ToggleGroup, ToggleGroupItem, type ToggleGroupItemData, type ToggleGroupItemProps, type ToggleGroupProps, type ToggleProps, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, Typography, TypographyGroup, type TypographyProps, type TypographyType, alertVariants, avatarVariants, badgeVariants, buttonVariants, cardVariants, checkboxVariants, cn, composeRules, emailRule, emptyVariants, fieldVariants, getCurrentMode, getCurrentTheme, getInitials, getThemeColors, initializeTheme, inputGroupVariants, inputVariants, itemVariants, labelVariants, legendStyle, maxLengthRule, maxValueRule, minLengthRule, minValueRule, navigationMenuTriggerStyle, numberRule, patternRule, progressVariants, radioGroupVariants, requiredRule, separatorVariants, setMode, setTheme, skeletonVariants, spinnerVariants, tableVariants, textareaVariants, toastVariants, toggleGroupVariants, toggleVariants, tooltipStyle, urlRule, useCarousel, useForm, useSidebar, useTheme, useToast, useWatch };