@etherealui/react 0.0.0-stage → 0.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (67) hide show
  1. package/LICENSE +21 -0
  2. package/README.md +62 -2
  3. package/dist/index.d.mts +583 -0
  4. package/dist/index.d.ts +583 -0
  5. package/dist/index.js +5189 -0
  6. package/dist/index.js.map +1 -0
  7. package/dist/index.mjs +5189 -0
  8. package/dist/index.mjs.map +1 -0
  9. package/package.json +83 -3
  10. package/src/blocks/app-shell.tsx +441 -0
  11. package/src/blocks/billing-card.tsx +2 -0
  12. package/src/blocks/data-table.tsx +479 -0
  13. package/src/blocks/filter-bar.tsx +134 -0
  14. package/src/blocks/header-navbar.tsx +7 -0
  15. package/src/blocks/metric-grid.tsx +5 -0
  16. package/src/blocks/profile-form.tsx +2 -0
  17. package/src/blocks/security-settings.tsx +2 -0
  18. package/src/blocks/settings-blocks.tsx +406 -0
  19. package/src/blocks/sidebar.tsx +6 -0
  20. package/src/blocks/stat-card.tsx +7 -0
  21. package/src/blocks/stat-cards.tsx +212 -0
  22. package/src/blocks/team-members.tsx +5 -0
  23. package/src/index.ts +114 -0
  24. package/src/primitives/accordion.tsx +61 -0
  25. package/src/primitives/announcement.tsx +33 -0
  26. package/src/primitives/avatar.tsx +156 -0
  27. package/src/primitives/badge.tsx +108 -0
  28. package/src/primitives/breadcrumb.tsx +45 -0
  29. package/src/primitives/button-group.tsx +79 -0
  30. package/src/primitives/button.tsx +165 -0
  31. package/src/primitives/carousel.tsx +84 -0
  32. package/src/primitives/chart.tsx +831 -0
  33. package/src/primitives/checkbox.tsx +26 -0
  34. package/src/primitives/chip.tsx +37 -0
  35. package/src/primitives/close-button.tsx +29 -0
  36. package/src/primitives/color-picker.tsx +62 -0
  37. package/src/primitives/combobox.tsx +123 -0
  38. package/src/primitives/command-palette.tsx +216 -0
  39. package/src/primitives/context-menu.tsx +84 -0
  40. package/src/primitives/date-calendar.tsx +76 -0
  41. package/src/primitives/date-picker.tsx +400 -0
  42. package/src/primitives/dialog.tsx +279 -0
  43. package/src/primitives/divider.tsx +31 -0
  44. package/src/primitives/drawer.tsx +95 -0
  45. package/src/primitives/dropdown-menu.tsx +164 -0
  46. package/src/primitives/file-upload.tsx +123 -0
  47. package/src/primitives/icon-button.tsx +23 -0
  48. package/src/primitives/input.tsx +124 -0
  49. package/src/primitives/modal.tsx +26 -0
  50. package/src/primitives/pagination.tsx +58 -0
  51. package/src/primitives/popover.tsx +28 -0
  52. package/src/primitives/progress.tsx +145 -0
  53. package/src/primitives/radio-group.tsx +63 -0
  54. package/src/primitives/select.tsx +207 -0
  55. package/src/primitives/skeleton.tsx +61 -0
  56. package/src/primitives/slider.tsx +44 -0
  57. package/src/primitives/switch.tsx +146 -0
  58. package/src/primitives/table.tsx +47 -0
  59. package/src/primitives/tabs.tsx +86 -0
  60. package/src/primitives/textarea.tsx +40 -0
  61. package/src/primitives/toast.tsx +71 -0
  62. package/src/primitives/tooltip.tsx +58 -0
  63. package/src/styles/globals.css +49 -0
  64. package/src/templates/control-tower.tsx +41 -0
  65. package/src/templates/executive-analytics.tsx +272 -0
  66. package/src/templates/workspace-settings.tsx +179 -0
  67. package/src/utils/cn.ts +7 -0
package/LICENSE ADDED
@@ -0,0 +1,21 @@
1
+ MIT License
2
+
3
+ Copyright (c) 2026 Saeful Rohman
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in all
13
+ copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
+ SOFTWARE.
package/README.md CHANGED
@@ -1,3 +1,63 @@
1
- # Temporary Holding Version
1
+ # Ethereal UI (`@etherealui/react`)
2
+
3
+ **Free, Open-Source, Modern Enterprise Dashboard Blocks & Component System for React**
4
+
5
+ [![NPM Version](https://img.shields.io/npm/v/@etherealui/react?style=flat-square&logo=npm&color=2563eb&label=%40etherealui%2Freact)](https://www.npmjs.com/package/@etherealui/react)
6
+ [![License: MIT](https://img.shields.io/badge/License-MIT-10b981.svg?style=flat-square)](https://github.com/XenchinRyu7/Ethereal-UI/blob/main/LICENSE)
7
+ [![Astro Docs](https://img.shields.io/badge/Docs-ethereal-ui.saefulrohman.dev-ff5d01?style=flat-square&logo=astro&logoColor=white)](https://ethereal-ui.saefulrohman.dev)
8
+ [![Tailwind CSS v4](https://img.shields.io/badge/Tailwind%20CSS-v4.0-38bdf8?style=flat-square&logo=tailwindcss&logoColor=white)](https://tailwindcss.com)
9
+
10
+ ---
11
+
12
+ ## 📦 Installation
13
+
14
+ ```bash
15
+ pnpm add @etherealui/react lucide-react clsx tailwind-merge class-variance-authority
16
+ ```
17
+
18
+ Import the stylesheet in your root CSS file:
19
+
20
+ ```css
21
+ @import "tailwindcss";
22
+ @import "@etherealui/react/styles.css";
23
+ ```
24
+
25
+ ---
26
+
27
+ ## 🚀 Quickstart
28
+
29
+ ```tsx
30
+ import { AppShell, Avatar, Button, StatCard, PageHeaderBar } from "@etherealui/react"
31
+
32
+ export default function Dashboard() {
33
+ return (
34
+ <AppShell workspaceName="Acme Corp" planBadge="Enterprise">
35
+ <PageHeaderBar
36
+ title="Revenue & Telemetry Overview"
37
+ subtitle="Real-time financial metrics and API throughput."
38
+ badge="Live Sync"
39
+ actions={
40
+ <div className="flex items-center gap-2">
41
+ <Avatar initials="SR" size="sm" tint="blue" status="online" />
42
+ <Button variant="primary" size="sm">Create Report</Button>
43
+ </div>
44
+ }
45
+ />
46
+ <div className="grid grid-cols-1 gap-4 md:grid-cols-3">
47
+ <StatCard title="Net Revenue (MRR)" value="$128,430" change="+18.4%" trend="up" accent="blue" />
48
+ <StatCard title="Active Enterprise Seats" value="14,892" change="+11.2%" trend="up" accent="emerald" />
49
+ <StatCard title="P99 Edge Latency" value="18.4ms" change="-4.1%" trend="up" accent="indigo" />
50
+ </div>
51
+ </AppShell>
52
+ )
53
+ }
54
+ ```
55
+
56
+ ---
57
+
58
+ ## 🔗 Links
59
+
60
+ - **Official Documentation**: [https://ethereal-ui.saefulrohman.dev](https://ethereal-ui.saefulrohman.dev)
61
+ - **GitHub Repository**: [https://github.com/XenchinRyu7/Ethereal-UI](https://github.com/XenchinRyu7/Ethereal-UI)
62
+ - **Author**: [Saeful Rohman (`saefulrohman.dev`)](https://saefulrohman.dev)
2
63
 
3
- This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
@@ -0,0 +1,583 @@
1
+ import { ClassValue } from 'clsx';
2
+ import * as React from 'react';
3
+ import * as class_variance_authority_types from 'class-variance-authority/types';
4
+ import { VariantProps } from 'class-variance-authority';
5
+ import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
6
+ import * as DialogPrimitive from '@radix-ui/react-dialog';
7
+ import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
8
+ import * as PopoverPrimitive from '@radix-ui/react-popover';
9
+ import * as SelectPrimitive from '@radix-ui/react-select';
10
+ import * as SwitchPrimitives from '@radix-ui/react-switch';
11
+ import * as TabsPrimitive from '@radix-ui/react-tabs';
12
+ import * as TooltipPrimitive from '@radix-ui/react-tooltip';
13
+
14
+ declare function cn(...inputs: ClassValue[]): string;
15
+
16
+ interface AccordionItemData {
17
+ id: string;
18
+ title: string;
19
+ content: string;
20
+ }
21
+ interface AccordionProps {
22
+ items: AccordionItemData[];
23
+ defaultOpenId?: string;
24
+ className?: string;
25
+ }
26
+ declare const Accordion: React.FC<AccordionProps>;
27
+
28
+ interface AnnouncementProps {
29
+ tag?: string;
30
+ title: string;
31
+ href?: string;
32
+ className?: string;
33
+ }
34
+ declare const Announcement: React.FC<AnnouncementProps>;
35
+
36
+ declare const avatarVariants: (props?: ({
37
+ size?: "xs" | "sm" | "default" | "lg" | "xl" | null | undefined;
38
+ tint?: "neutral" | "blue" | "emerald" | "amber" | null | undefined;
39
+ ring?: "emerald" | "none" | "subtle" | "glow" | null | undefined;
40
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
41
+ type AvatarStatusType = "online" | "away" | "busy" | "offline";
42
+ interface AvatarProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof avatarVariants> {
43
+ src?: string;
44
+ alt?: string;
45
+ fallback?: string;
46
+ status?: AvatarStatusType;
47
+ }
48
+ declare const Avatar: React.ForwardRefExoticComponent<AvatarProps & React.RefAttributes<HTMLDivElement>>;
49
+ interface AvatarGroupProps extends React.HTMLAttributes<HTMLDivElement> {
50
+ items: Array<{
51
+ src?: string;
52
+ alt: string;
53
+ fallback?: string;
54
+ tint?: "neutral" | "blue" | "emerald" | "amber";
55
+ status?: AvatarStatusType;
56
+ }>;
57
+ max?: number;
58
+ size?: "xs" | "sm" | "default" | "lg";
59
+ }
60
+ declare const AvatarGroup: React.ForwardRefExoticComponent<AvatarGroupProps & React.RefAttributes<HTMLDivElement>>;
61
+
62
+ declare const badgeVariants: (props?: ({
63
+ variant?: "default" | "blue" | "emerald" | "amber" | "glow" | "rose" | "outline" | "mono" | null | undefined;
64
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
65
+ interface BadgeProps extends React.HTMLAttributes<HTMLSpanElement>, VariantProps<typeof badgeVariants> {
66
+ dot?: boolean;
67
+ }
68
+ declare const Badge: React.ForwardRefExoticComponent<BadgeProps & React.RefAttributes<HTMLSpanElement>>;
69
+
70
+ interface BreadcrumbItem {
71
+ label: string;
72
+ href?: string;
73
+ }
74
+ interface BreadcrumbProps {
75
+ items: BreadcrumbItem[];
76
+ className?: string;
77
+ }
78
+ declare const Breadcrumb: React.FC<BreadcrumbProps>;
79
+
80
+ declare const buttonVariants: (props?: ({
81
+ variant?: "default" | "glow" | "outline" | "primary" | "secondary" | "ghost" | "destructive" | null | undefined;
82
+ size?: "sm" | "default" | "lg" | "icon" | null | undefined;
83
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
84
+ interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
85
+ asChild?: boolean;
86
+ loading?: boolean;
87
+ }
88
+ declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
89
+
90
+ interface ButtonGroupProps extends React.HTMLAttributes<HTMLDivElement> {
91
+ attached?: boolean;
92
+ }
93
+ declare const ButtonGroup: React.ForwardRefExoticComponent<ButtonGroupProps & React.RefAttributes<HTMLDivElement>>;
94
+ interface ToggleGroupItem {
95
+ value: string;
96
+ label: React.ReactNode;
97
+ icon?: React.ReactNode;
98
+ }
99
+ interface ToggleGroupProps {
100
+ items: ToggleGroupItem[];
101
+ value: string;
102
+ onValueChange: (value: string) => void;
103
+ size?: "sm" | "default";
104
+ className?: string;
105
+ }
106
+ declare const ToggleGroup: React.FC<ToggleGroupProps>;
107
+
108
+ interface CarouselSlide {
109
+ title: string;
110
+ subtitle: string;
111
+ metric: string;
112
+ }
113
+ interface CarouselProps {
114
+ slides?: CarouselSlide[];
115
+ className?: string;
116
+ }
117
+ declare const Carousel: React.FC<CarouselProps>;
118
+
119
+ declare const Checkbox: React.ForwardRefExoticComponent<Omit<CheckboxPrimitive.CheckboxProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
120
+
121
+ interface ChipProps extends React.HTMLAttributes<HTMLSpanElement> {
122
+ onRemove?: () => void;
123
+ active?: boolean;
124
+ }
125
+ declare const Chip: React.ForwardRefExoticComponent<ChipProps & React.RefAttributes<HTMLSpanElement>>;
126
+
127
+ interface CloseButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
128
+ size?: "sm" | "default";
129
+ }
130
+ declare const CloseButton: React.ForwardRefExoticComponent<CloseButtonProps & React.RefAttributes<HTMLButtonElement>>;
131
+
132
+ interface ColorPickerProps {
133
+ className?: string;
134
+ defaultColor?: string;
135
+ }
136
+ declare const ColorPicker: React.FC<ColorPickerProps>;
137
+
138
+ interface ComboboxOption {
139
+ value: string;
140
+ label: string;
141
+ badge?: string;
142
+ }
143
+ interface ComboboxProps {
144
+ options: ComboboxOption[];
145
+ value: string;
146
+ onValueChange: (value: string) => void;
147
+ placeholder?: string;
148
+ searchPlaceholder?: string;
149
+ className?: string;
150
+ }
151
+ declare const Combobox: React.FC<ComboboxProps>;
152
+
153
+ interface CommandItem {
154
+ id: string;
155
+ label: string;
156
+ category: string;
157
+ shortcut?: string;
158
+ icon?: React.ReactNode;
159
+ onSelect?: () => void;
160
+ }
161
+ interface CommandPaletteProps {
162
+ open?: boolean;
163
+ onOpenChange?: (open: boolean) => void;
164
+ items?: CommandItem[];
165
+ placeholder?: string;
166
+ enableGlobalShortcut?: boolean;
167
+ }
168
+ declare const CommandPalette: React.FC<CommandPaletteProps>;
169
+
170
+ interface ContextMenuAction {
171
+ label: string;
172
+ shortcut?: string;
173
+ icon?: React.ReactNode;
174
+ destructive?: boolean;
175
+ onClick?: () => void;
176
+ }
177
+ interface ContextMenuBoxProps extends React.HTMLAttributes<HTMLDivElement> {
178
+ actions: ContextMenuAction[];
179
+ }
180
+ declare const ContextMenuBox: React.FC<ContextMenuBoxProps>;
181
+
182
+ interface DateCalendarProps {
183
+ className?: string;
184
+ defaultSelectedDay?: number;
185
+ }
186
+ declare const DateCalendar: React.FC<DateCalendarProps>;
187
+
188
+ interface DateRangePreset {
189
+ label: string;
190
+ value: string;
191
+ rangeText: string;
192
+ }
193
+ interface DateRangePickerProps {
194
+ value?: string;
195
+ onValueChange?: (preset: DateRangePreset) => void;
196
+ className?: string;
197
+ }
198
+ declare const DateRangePicker: React.FC<DateRangePickerProps>;
199
+
200
+ declare const Dialog: React.FC<DialogPrimitive.DialogProps>;
201
+ declare const DialogTrigger: React.ForwardRefExoticComponent<DialogPrimitive.DialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
202
+ declare const DialogPortal: React.FC<DialogPrimitive.DialogPortalProps>;
203
+ declare const DialogClose: React.ForwardRefExoticComponent<DialogPrimitive.DialogCloseProps & React.RefAttributes<HTMLButtonElement>>;
204
+ declare const DialogOverlay: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogOverlayProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
205
+ declare const DialogContent: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
206
+ declare const DialogHeader: {
207
+ ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): React.JSX.Element;
208
+ displayName: string;
209
+ };
210
+ declare const DialogFooter: {
211
+ ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): React.JSX.Element;
212
+ displayName: string;
213
+ };
214
+ declare const DialogTitle: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogTitleProps & React.RefAttributes<HTMLHeadingElement>, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
215
+ declare const DialogDescription: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
216
+
217
+ interface DividerProps {
218
+ label?: string;
219
+ className?: string;
220
+ }
221
+ declare const Divider: React.FC<DividerProps>;
222
+
223
+ declare const Drawer: React.FC<DialogPrimitive.DialogProps>;
224
+ declare const DrawerTrigger: React.ForwardRefExoticComponent<DialogPrimitive.DialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
225
+ declare const DrawerClose: React.ForwardRefExoticComponent<DialogPrimitive.DialogCloseProps & React.RefAttributes<HTMLButtonElement>>;
226
+ interface DrawerContentProps extends React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content> {
227
+ side?: "right" | "left";
228
+ }
229
+ declare const DrawerContent: React.ForwardRefExoticComponent<DrawerContentProps & React.RefAttributes<HTMLDivElement>>;
230
+ declare const DrawerHeader: {
231
+ ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): React.JSX.Element;
232
+ displayName: string;
233
+ };
234
+ declare const DrawerTitle: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogTitleProps & React.RefAttributes<HTMLHeadingElement>, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
235
+ declare const DrawerDescription: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
236
+ declare const DrawerFooter: {
237
+ ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): React.JSX.Element;
238
+ displayName: string;
239
+ };
240
+
241
+ declare const DropdownMenu: React.FC<DropdownMenuPrimitive.DropdownMenuProps>;
242
+ declare const DropdownMenuTrigger: React.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuTriggerProps & React.RefAttributes<HTMLButtonElement>>;
243
+ declare const DropdownMenuGroup: React.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuGroupProps & React.RefAttributes<HTMLDivElement>>;
244
+ declare const DropdownMenuContent: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
245
+ declare const DropdownMenuItem: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
246
+ shortcut?: string;
247
+ destructive?: boolean;
248
+ } & React.RefAttributes<HTMLDivElement>>;
249
+ declare const DropdownMenuSeparator: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
250
+ declare const DropdownMenuLabel: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuLabelProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
251
+
252
+ interface UploadedFileItem {
253
+ name: string;
254
+ size: string;
255
+ progress: number;
256
+ }
257
+ interface FileDropzoneProps {
258
+ className?: string;
259
+ initialFiles?: UploadedFileItem[];
260
+ }
261
+ declare const FileDropzone: React.FC<FileDropzoneProps>;
262
+
263
+ interface IconButtonProps extends Omit<ButtonProps, "size"> {
264
+ label: string;
265
+ }
266
+ declare const IconButton: React.ForwardRefExoticComponent<IconButtonProps & React.RefAttributes<HTMLButtonElement>>;
267
+
268
+ interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {
269
+ leftIcon?: React.ReactNode;
270
+ rightIcon?: React.ReactNode;
271
+ prefixText?: string;
272
+ suffixText?: string;
273
+ }
274
+ declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement>>;
275
+ interface LabelProps extends React.LabelHTMLAttributes<HTMLLabelElement> {
276
+ optional?: boolean;
277
+ }
278
+ declare const Label: React.ForwardRefExoticComponent<LabelProps & React.RefAttributes<HTMLLabelElement>>;
279
+
280
+ interface PaginationProps {
281
+ totalPages?: number;
282
+ initialPage?: number;
283
+ className?: string;
284
+ }
285
+ declare const Pagination: React.FC<PaginationProps>;
286
+
287
+ declare const Popover: React.FC<PopoverPrimitive.PopoverProps>;
288
+ declare const PopoverTrigger: React.ForwardRefExoticComponent<PopoverPrimitive.PopoverTriggerProps & React.RefAttributes<HTMLButtonElement>>;
289
+ declare const PopoverContent: React.ForwardRefExoticComponent<Omit<PopoverPrimitive.PopoverContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
290
+
291
+ interface ProgressProps extends React.HTMLAttributes<HTMLDivElement> {
292
+ value: number;
293
+ max?: number;
294
+ variant?: "blue" | "indigo" | "emerald" | "amber" | "rose" | "white";
295
+ size?: "sm" | "default" | "lg";
296
+ showValue?: boolean;
297
+ label?: string;
298
+ }
299
+ declare const Progress: React.ForwardRefExoticComponent<ProgressProps & React.RefAttributes<HTMLDivElement>>;
300
+ interface CircularProgressProps extends React.HTMLAttributes<HTMLDivElement> {
301
+ value: number;
302
+ size?: number;
303
+ strokeWidth?: number;
304
+ variant?: "blue" | "indigo" | "emerald" | "amber" | "rose";
305
+ }
306
+ declare const CircularProgress: React.FC<CircularProgressProps>;
307
+
308
+ interface RadioGroupOption {
309
+ value: string;
310
+ label: string;
311
+ description?: string;
312
+ }
313
+ interface RadioGroupProps {
314
+ options: RadioGroupOption[];
315
+ value: string;
316
+ onValueChange: (val: string) => void;
317
+ className?: string;
318
+ }
319
+ declare const RadioGroup: React.FC<RadioGroupProps>;
320
+
321
+ declare const Select: React.FC<SelectPrimitive.SelectProps>;
322
+ declare const SelectGroup: React.ForwardRefExoticComponent<SelectPrimitive.SelectGroupProps & React.RefAttributes<HTMLDivElement>>;
323
+ declare const SelectValue: React.ForwardRefExoticComponent<SelectPrimitive.SelectValueProps & React.RefAttributes<HTMLSpanElement>>;
324
+ declare const SelectTrigger: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
325
+ declare const SelectContent: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
326
+ declare const SelectItem: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
327
+
328
+ declare function Skeleton({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): React.JSX.Element;
329
+ declare function CardSkeleton({ className }: {
330
+ className?: string;
331
+ }): React.JSX.Element;
332
+ declare function TableRowSkeleton({ rows }: {
333
+ rows?: number;
334
+ }): React.JSX.Element;
335
+
336
+ interface SliderProps {
337
+ value: number;
338
+ min?: number;
339
+ max?: number;
340
+ step?: number;
341
+ onValueChange?: (val: number) => void;
342
+ label?: string;
343
+ className?: string;
344
+ }
345
+ declare const Slider: React.FC<SliderProps>;
346
+
347
+ declare const Switch: React.ForwardRefExoticComponent<Omit<SwitchPrimitives.SwitchProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
348
+
349
+ declare const Table: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLTableElement> & React.RefAttributes<HTMLTableElement>>;
350
+ declare const TableHeader: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLTableSectionElement> & React.RefAttributes<HTMLTableSectionElement>>;
351
+ declare const TableBody: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLTableSectionElement> & React.RefAttributes<HTMLTableSectionElement>>;
352
+
353
+ declare const Tabs: React.ForwardRefExoticComponent<TabsPrimitive.TabsProps & React.RefAttributes<HTMLDivElement>>;
354
+ declare const tabsListVariants: (props?: ({
355
+ variant?: "underline" | "segmented" | "pills" | null | undefined;
356
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
357
+ interface TabsListProps extends React.ComponentPropsWithoutRef<typeof TabsPrimitive.List>, VariantProps<typeof tabsListVariants> {
358
+ }
359
+ declare const TabsList: React.ForwardRefExoticComponent<TabsListProps & React.RefAttributes<HTMLDivElement>>;
360
+ declare const tabsTriggerVariants: (props?: ({
361
+ variant?: "underline" | "segmented" | "pills" | null | undefined;
362
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
363
+ interface TabsTriggerProps extends React.ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger>, VariantProps<typeof tabsTriggerVariants> {
364
+ }
365
+ declare const TabsTrigger: React.ForwardRefExoticComponent<TabsTriggerProps & React.RefAttributes<HTMLButtonElement>>;
366
+ declare const TabsContent: React.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
367
+
368
+ interface TextareaProps extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {
369
+ autoResize?: boolean;
370
+ }
371
+ declare const Textarea: React.ForwardRefExoticComponent<TextareaProps & React.RefAttributes<HTMLTextAreaElement>>;
372
+
373
+ type ToastVariant = "success" | "error" | "warning" | "info";
374
+ interface ToastItem {
375
+ id: string;
376
+ title: string;
377
+ description?: string;
378
+ variant?: ToastVariant;
379
+ }
380
+ interface ToastCardProps extends Omit<ToastItem, "id"> {
381
+ onDismiss?: () => void;
382
+ className?: string;
383
+ }
384
+ declare const ToastCard: React.FC<ToastCardProps>;
385
+
386
+ declare const TooltipProvider: React.FC<TooltipPrimitive.TooltipProviderProps>;
387
+ declare const Tooltip: React.FC<TooltipPrimitive.TooltipProps>;
388
+ declare const TooltipTrigger: React.ForwardRefExoticComponent<TooltipPrimitive.TooltipTriggerProps & React.RefAttributes<HTMLButtonElement>>;
389
+ declare const TooltipContent: React.ForwardRefExoticComponent<Omit<TooltipPrimitive.TooltipContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
390
+
391
+ interface ChartDataPoint {
392
+ label: string;
393
+ value: number;
394
+ secondary?: number;
395
+ }
396
+ interface AreaStatisticChartProps {
397
+ title?: string;
398
+ subtitle?: string;
399
+ value?: string;
400
+ change?: string;
401
+ data?: ChartDataPoint[];
402
+ className?: string;
403
+ }
404
+ declare const AreaStatisticChart: React.FC<AreaStatisticChartProps>;
405
+ interface BarStatisticChartProps {
406
+ title?: string;
407
+ subtitle?: string;
408
+ data?: ChartDataPoint[];
409
+ className?: string;
410
+ }
411
+ declare const BarStatisticChart: React.FC<BarStatisticChartProps>;
412
+ interface LineStatisticChartProps {
413
+ title?: string;
414
+ subtitle?: string;
415
+ className?: string;
416
+ }
417
+ declare const LineStatisticChart: React.FC<LineStatisticChartProps>;
418
+ interface DonutSegment {
419
+ label: string;
420
+ value: number;
421
+ color: string;
422
+ dotClass: string;
423
+ }
424
+ declare const DonutStatisticChart: React.FC<{
425
+ title?: string;
426
+ segments?: DonutSegment[];
427
+ className?: string;
428
+ }>;
429
+ declare const RadialStatisticChart: React.FC<{
430
+ title?: string;
431
+ score?: number;
432
+ className?: string;
433
+ }>;
434
+ declare const HeatmapStatisticChart: React.FC<{
435
+ title?: string;
436
+ subtitle?: string;
437
+ className?: string;
438
+ }>;
439
+
440
+ interface SidebarNavItem {
441
+ id: string;
442
+ label: string;
443
+ icon?: React.ReactNode;
444
+ badge?: string;
445
+ active?: boolean;
446
+ children?: Array<{
447
+ id: string;
448
+ label: string;
449
+ active?: boolean;
450
+ }>;
451
+ }
452
+ interface SidebarShellProps {
453
+ items?: SidebarNavItem[];
454
+ activeId?: string;
455
+ onSelect?: (id: string) => void;
456
+ defaultCollapsed?: boolean;
457
+ workspaceName?: string;
458
+ workspaceTier?: string;
459
+ className?: string;
460
+ }
461
+ declare const SidebarShell: React.FC<SidebarShellProps>;
462
+ interface HeaderNavbarProps {
463
+ breadcrumbs?: string[];
464
+ onOpenCommandPalette?: () => void;
465
+ className?: string;
466
+ }
467
+ declare const HeaderNavbar: React.FC<HeaderNavbarProps>;
468
+ interface PageHeaderBarProps {
469
+ title: string;
470
+ subtitle?: string;
471
+ badge?: string;
472
+ actions?: React.ReactNode;
473
+ className?: string;
474
+ }
475
+ declare const PageHeaderBar: React.FC<PageHeaderBarProps>;
476
+ interface AppShellProps {
477
+ workspaceName?: string;
478
+ planBadge?: string;
479
+ breadcrumbs?: string[];
480
+ user?: {
481
+ name: string;
482
+ email: string;
483
+ initials: string;
484
+ avatarSrc?: string;
485
+ };
486
+ children?: React.ReactNode;
487
+ className?: string;
488
+ }
489
+ declare const AppShell: React.FC<AppShellProps>;
490
+
491
+ interface StatMetricCardProps {
492
+ title: string;
493
+ value: string;
494
+ change: string;
495
+ trend?: "up" | "down" | "neutral";
496
+ subtitle?: string;
497
+ sparkline?: number[];
498
+ accent?: "blue" | "indigo" | "emerald" | "amber" | "rose";
499
+ className?: string;
500
+ }
501
+ declare const StatMetricCard: React.FC<StatMetricCardProps>;
502
+ interface MultiMetricGridProps {
503
+ metrics?: StatMetricCardProps[];
504
+ className?: string;
505
+ }
506
+ declare const MultiMetricGrid: React.FC<MultiMetricGridProps>;
507
+ interface ProgressMetricCardProps {
508
+ title?: string;
509
+ current?: string;
510
+ target?: string;
511
+ percentage?: number;
512
+ statusText?: string;
513
+ variant?: "blue" | "indigo" | "emerald" | "amber" | "rose";
514
+ className?: string;
515
+ }
516
+ declare const ProgressMetricCard: React.FC<ProgressMetricCardProps>;
517
+ type StatCardProps = StatMetricCardProps;
518
+ declare const StatCard: React.FC<StatMetricCardProps>;
519
+
520
+ interface ActiveFilterPill {
521
+ id: string;
522
+ field: string;
523
+ value: string;
524
+ }
525
+ interface AdvancedFilterBarProps {
526
+ searchQuery?: string;
527
+ onSearchChange?: (q: string) => void;
528
+ initialPills?: ActiveFilterPill[];
529
+ className?: string;
530
+ }
531
+ declare const AdvancedFilterBar: React.FC<AdvancedFilterBarProps>;
532
+
533
+ interface EnterpriseRowData {
534
+ id: string;
535
+ customer: string;
536
+ email: string;
537
+ plan: string;
538
+ status: "active" | "trialing" | "past_due" | "canceled";
539
+ mrrAmount: number;
540
+ mrrFormatted: string;
541
+ seatUsage: number;
542
+ updatedAt: string;
543
+ }
544
+ interface EnterpriseDataTableProps {
545
+ data?: EnterpriseRowData[];
546
+ className?: string;
547
+ }
548
+ declare const EnterpriseDataTable: React.FC<EnterpriseDataTableProps>;
549
+
550
+ declare const UserProfileFormBlock: React.FC<{
551
+ className?: string;
552
+ }>;
553
+ declare const SecurityPasswordFormBlock: React.FC<{
554
+ className?: string;
555
+ }>;
556
+ interface TeamMember {
557
+ id: string;
558
+ name: string;
559
+ email: string;
560
+ fallback: string;
561
+ role: string;
562
+ status: "online" | "away" | "offline";
563
+ }
564
+ declare const TeamRbacTableBlock: React.FC<{
565
+ className?: string;
566
+ }>;
567
+ declare const BillingPlanCardBlock: React.FC<{
568
+ className?: string;
569
+ }>;
570
+
571
+ declare const ExecutiveAnalyticsTemplate: React.FC<{
572
+ className?: string;
573
+ }>;
574
+
575
+ declare const ControlTowerTemplate: React.FC<{
576
+ className?: string;
577
+ }>;
578
+
579
+ declare const WorkspaceSettingsTemplate: React.FC<{
580
+ className?: string;
581
+ }>;
582
+
583
+ export { Accordion, type AccordionItemData, type AccordionProps, type ActiveFilterPill, AdvancedFilterBar, type AdvancedFilterBarProps, Announcement, type AnnouncementProps, AppShell, type AppShellProps, AreaStatisticChart, type AreaStatisticChartProps, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, type AvatarStatusType, Badge, type BadgeProps, BarStatisticChart, type BarStatisticChartProps, BillingPlanCardBlock, Breadcrumb, type BreadcrumbItem, type BreadcrumbProps, Button, ButtonGroup, type ButtonGroupProps, type ButtonProps, CardSkeleton, Carousel, type CarouselProps, type CarouselSlide, type ChartDataPoint, Checkbox, Chip, type ChipProps, CircularProgress, type CircularProgressProps, CloseButton, type CloseButtonProps, ColorPicker, type ColorPickerProps, Combobox, type ComboboxOption, type ComboboxProps, type CommandItem, CommandPalette, type CommandPaletteProps, type ContextMenuAction, ContextMenuBox, type ContextMenuBoxProps, ControlTowerTemplate, DateCalendar, type DateCalendarProps, DateRangePicker, type DateRangePickerProps, type DateRangePreset, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Divider, type DividerProps, type DonutSegment, DonutStatisticChart, Drawer, DrawerClose, DrawerContent, type DrawerContentProps, DrawerDescription, DrawerFooter, DrawerHeader, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger, EnterpriseDataTable, type EnterpriseDataTableProps, type EnterpriseRowData, ExecutiveAnalyticsTemplate, FileDropzone, type FileDropzoneProps, HeaderNavbar, type HeaderNavbarProps, HeatmapStatisticChart, IconButton, type IconButtonProps, Input, type InputProps, Label, type LabelProps, LineStatisticChart, type LineStatisticChartProps, Dialog as Modal, DialogClose as ModalClose, DialogContent as ModalContent, DialogDescription as ModalDescription, DialogFooter as ModalFooter, DialogHeader as ModalHeader, DialogOverlay as ModalOverlay, DialogPortal as ModalPortal, DialogTitle as ModalTitle, DialogTrigger as ModalTrigger, MultiMetricGrid, type MultiMetricGridProps, PageHeaderBar, type PageHeaderBarProps, Pagination, type PaginationProps, Popover, PopoverContent, PopoverTrigger, Progress, ProgressMetricCard, type ProgressMetricCardProps, type ProgressProps, RadialStatisticChart, RadioGroup, type RadioGroupOption, type RadioGroupProps, SecurityPasswordFormBlock, Select, SelectContent, SelectGroup, SelectItem, SelectTrigger, SelectValue, type SidebarNavItem, SidebarShell, type SidebarShellProps, Skeleton, Slider, type SliderProps, StatCard, type StatCardProps, StatMetricCard, type StatMetricCardProps, Switch, Table, TableBody, TableHeader, TableRowSkeleton, Tabs, TabsContent, TabsList, type TabsListProps, TabsTrigger, type TabsTriggerProps, type TeamMember, TeamRbacTableBlock, Textarea, type TextareaProps, ToastCard, type ToastCardProps, type ToastItem, type ToastVariant, ToggleGroup, type ToggleGroupItem, type ToggleGroupProps, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, type UploadedFileItem, UserProfileFormBlock, WorkspaceSettingsTemplate, avatarVariants, badgeVariants, buttonVariants, cn };