@memelabui/ui 0.1.1 → 0.2.0

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 (9) hide show
  1. package/README.md +85 -28
  2. package/dist/index.cjs +1237 -57
  3. package/dist/index.d.cts +188 -8
  4. package/dist/index.d.ts +188 -8
  5. package/dist/index.js +1217 -59
  6. package/dist/preset/index.cjs +13 -45
  7. package/dist/preset/index.js +13 -41
  8. package/dist/styles/index.css +351 -91
  9. package/package.json +1 -1
package/dist/index.d.cts CHANGED
@@ -1,5 +1,6 @@
1
+ export { MemelabColors, colors } from './tokens/index.cjs';
1
2
  import * as react from 'react';
2
- import { ButtonHTMLAttributes, ReactNode, InputHTMLAttributes, SelectHTMLAttributes, TextareaHTMLAttributes, HTMLAttributes, ReactElement } from 'react';
3
+ import { ButtonHTMLAttributes, ReactNode, InputHTMLAttributes, SelectHTMLAttributes, TextareaHTMLAttributes, HTMLAttributes, ReactElement, ComponentType } from 'react';
3
4
  import * as react_jsx_runtime from 'react/jsx-runtime';
4
5
 
5
6
  type ClassValue = string | number | null | undefined | boolean | Record<string, boolean | null | undefined> | ClassValue[];
@@ -12,6 +13,24 @@ declare function cn(...values: ClassValue[]): string;
12
13
  declare function getFocusableElements(container: HTMLElement): HTMLElement[];
13
14
  declare function focusSafely(el: HTMLElement | null | undefined): void;
14
15
 
16
+ type UseClipboardReturn = {
17
+ copy: (text: string) => Promise<void>;
18
+ copied: boolean;
19
+ };
20
+ declare function useClipboard(timeout?: number): UseClipboardReturn;
21
+
22
+ type UseDisclosureReturn = {
23
+ isOpen: boolean;
24
+ open: () => void;
25
+ close: () => void;
26
+ toggle: () => void;
27
+ };
28
+ declare function useDisclosure(defaultOpen?: boolean): UseDisclosureReturn;
29
+
30
+ declare function useMediaQuery(query: string): boolean;
31
+
32
+ declare function useDebounce<T>(value: T, delayMs?: number): T;
33
+
15
34
  type Size = 'sm' | 'md' | 'lg';
16
35
 
17
36
  type ButtonVariant = 'primary' | 'success' | 'warning' | 'danger' | 'secondary' | 'ghost';
@@ -57,26 +76,39 @@ declare const Input: react.ForwardRefExoticComponent<InputHTMLAttributes<HTMLInp
57
76
  helperText?: string;
58
77
  } & react.RefAttributes<HTMLInputElement>>;
59
78
 
79
+ type SearchInputProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'type'> & {
80
+ onClear?: () => void;
81
+ label?: string;
82
+ };
83
+ declare const SearchInput: react.ForwardRefExoticComponent<Omit<InputHTMLAttributes<HTMLInputElement>, "type"> & {
84
+ onClear?: () => void;
85
+ label?: string;
86
+ } & react.RefAttributes<HTMLInputElement>>;
87
+
60
88
  type SelectProps = SelectHTMLAttributes<HTMLSelectElement> & {
61
89
  hasError?: boolean;
62
90
  label?: string;
63
91
  error?: string;
92
+ helperText?: string;
64
93
  };
65
94
  declare const Select: react.ForwardRefExoticComponent<SelectHTMLAttributes<HTMLSelectElement> & {
66
95
  hasError?: boolean;
67
96
  label?: string;
68
97
  error?: string;
98
+ helperText?: string;
69
99
  } & react.RefAttributes<HTMLSelectElement>>;
70
100
 
71
101
  type TextareaProps = TextareaHTMLAttributes<HTMLTextAreaElement> & {
72
102
  hasError?: boolean;
73
103
  label?: string;
74
104
  error?: string;
105
+ helperText?: string;
75
106
  };
76
107
  declare const Textarea: react.ForwardRefExoticComponent<TextareaHTMLAttributes<HTMLTextAreaElement> & {
77
108
  hasError?: boolean;
78
109
  label?: string;
79
110
  error?: string;
111
+ helperText?: string;
80
112
  } & react.RefAttributes<HTMLTextAreaElement>>;
81
113
 
82
114
  type BadgeVariant = 'neutral' | 'primary' | 'success' | 'successSolid' | 'warning' | 'danger' | 'dangerSolid' | 'accent';
@@ -105,16 +137,51 @@ type ToggleProps = {
105
137
  disabled?: boolean;
106
138
  label?: string;
107
139
  size?: ToggleSize;
140
+ id?: string;
108
141
  'aria-label'?: string;
109
142
  };
110
- declare function Toggle({ checked, onChange, disabled, label, size, 'aria-label': ariaLabel }: ToggleProps): react_jsx_runtime.JSX.Element;
143
+ declare const Toggle: react.ForwardRefExoticComponent<ToggleProps & react.RefAttributes<HTMLButtonElement>>;
144
+
145
+ type CheckboxProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'type'> & {
146
+ label?: string;
147
+ error?: string;
148
+ indeterminate?: boolean;
149
+ };
150
+ declare const Checkbox: react.ForwardRefExoticComponent<Omit<InputHTMLAttributes<HTMLInputElement>, "type"> & {
151
+ label?: string;
152
+ error?: string;
153
+ indeterminate?: boolean;
154
+ } & react.RefAttributes<HTMLInputElement>>;
155
+
156
+ type RadioGroupProps = {
157
+ value?: string;
158
+ defaultValue?: string;
159
+ onValueChange?: (value: string) => void;
160
+ name?: string;
161
+ disabled?: boolean;
162
+ orientation?: 'horizontal' | 'vertical';
163
+ label?: string;
164
+ error?: string;
165
+ children: ReactNode;
166
+ className?: string;
167
+ };
168
+ type RadioItemProps = {
169
+ value: string;
170
+ disabled?: boolean;
171
+ children: ReactNode;
172
+ className?: string;
173
+ };
174
+ declare function RadioGroup({ value: controlledValue, defaultValue, onValueChange, name: externalName, disabled, orientation, label, error, children, className, }: RadioGroupProps): react_jsx_runtime.JSX.Element;
175
+ declare function RadioItem({ value, disabled: itemDisabled, children, className }: RadioItemProps): react_jsx_runtime.JSX.Element;
111
176
 
112
177
  type SpinnerSize = 'sm' | 'md' | 'lg';
113
178
  type SpinnerProps = {
114
179
  className?: string;
115
180
  size?: SpinnerSize;
181
+ /** Accessible label for screen readers. When provided, the spinner gets role="status". */
182
+ label?: string;
116
183
  };
117
- declare function Spinner({ className, size }: SpinnerProps): react_jsx_runtime.JSX.Element;
184
+ declare function Spinner({ className, size, label }: SpinnerProps): react_jsx_runtime.JSX.Element;
118
185
 
119
186
  type SkeletonProps = {
120
187
  className?: string;
@@ -122,13 +189,46 @@ type SkeletonProps = {
122
189
  };
123
190
  declare function Skeleton({ className, circle }: SkeletonProps): react_jsx_runtime.JSX.Element;
124
191
 
192
+ type TabsVariant = 'underline' | 'pill';
193
+ type TabsProps = {
194
+ defaultValue?: string;
195
+ value?: string;
196
+ onValueChange?: (value: string) => void;
197
+ variant?: TabsVariant;
198
+ children: ReactNode;
199
+ className?: string;
200
+ };
201
+ type TabListProps = {
202
+ children: ReactNode;
203
+ className?: string;
204
+ };
205
+ type TabProps = {
206
+ value: string;
207
+ disabled?: boolean;
208
+ children: ReactNode;
209
+ className?: string;
210
+ };
211
+ type TabPanelProps = {
212
+ value: string;
213
+ children: ReactNode;
214
+ className?: string;
215
+ };
216
+ declare function Tabs({ defaultValue, value, onValueChange, variant, children, className, }: TabsProps): react_jsx_runtime.JSX.Element;
217
+ declare function TabList({ children, className }: TabListProps): react_jsx_runtime.JSX.Element;
218
+ declare function Tab({ value, disabled, children, className }: TabProps): react_jsx_runtime.JSX.Element;
219
+ declare function TabPanel({ value, children, className }: TabPanelProps): react_jsx_runtime.JSX.Element | null;
220
+
125
221
  type CardVariant = 'surface' | 'glass';
126
222
  type CardProps = HTMLAttributes<HTMLDivElement> & {
127
223
  hoverable?: boolean;
128
224
  variant?: CardVariant;
129
225
  children: ReactNode;
130
226
  };
131
- declare function Card({ hoverable, variant, className, ...props }: CardProps): react_jsx_runtime.JSX.Element;
227
+ declare const Card: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & {
228
+ hoverable?: boolean;
229
+ variant?: CardVariant;
230
+ children: ReactNode;
231
+ } & react.RefAttributes<HTMLDivElement>>;
132
232
 
133
233
  type ModalProps = {
134
234
  isOpen: boolean;
@@ -171,9 +271,9 @@ type TooltipProps = {
171
271
  declare function Tooltip({ content, delayMs, placement, className, children }: TooltipProps): react_jsx_runtime.JSX.Element;
172
272
 
173
273
  type EmptyStateProps = {
174
- icon?: (props: {
274
+ icon?: ComponentType<{
175
275
  className?: string;
176
- }) => JSX.Element;
276
+ }>;
177
277
  title: string;
178
278
  description?: string;
179
279
  actionLabel?: string;
@@ -192,6 +292,46 @@ type CollapsibleSectionProps = {
192
292
  };
193
293
  declare function CollapsibleSection({ title, defaultOpen, children, right, className }: CollapsibleSectionProps): react_jsx_runtime.JSX.Element;
194
294
 
295
+ type DropdownProps = {
296
+ children: ReactNode;
297
+ className?: string;
298
+ };
299
+ type DropdownTriggerProps = {
300
+ children: ReactElement;
301
+ className?: string;
302
+ };
303
+ type DropdownMenuProps = {
304
+ children: ReactNode;
305
+ className?: string;
306
+ align?: 'left' | 'right';
307
+ };
308
+ type DropdownItemProps = {
309
+ onSelect?: () => void;
310
+ disabled?: boolean;
311
+ children: ReactNode;
312
+ className?: string;
313
+ };
314
+ type DropdownSeparatorProps = {
315
+ className?: string;
316
+ };
317
+ declare function Dropdown({ children, className }: DropdownProps): react_jsx_runtime.JSX.Element;
318
+ declare function DropdownTrigger({ children, className }: DropdownTriggerProps): ReactElement<any, string | react.JSXElementConstructor<any>>;
319
+ declare function DropdownMenu({ children, className, align }: DropdownMenuProps): react.ReactPortal | null;
320
+ declare function DropdownItem({ onSelect, disabled, children, className }: DropdownItemProps): react_jsx_runtime.JSX.Element;
321
+ declare function DropdownSeparator({ className }: DropdownSeparatorProps): react_jsx_runtime.JSX.Element;
322
+
323
+ type DropZoneProps = {
324
+ onFilesDropped: (files: File[]) => void;
325
+ accept?: string;
326
+ maxFiles?: number;
327
+ maxSize?: number;
328
+ disabled?: boolean;
329
+ children?: ReactNode;
330
+ className?: string;
331
+ 'aria-label'?: string;
332
+ };
333
+ declare function DropZone({ onFilesDropped, accept, maxFiles, maxSize, disabled, children, className, 'aria-label': ariaLabel, }: DropZoneProps): react_jsx_runtime.JSX.Element;
334
+
195
335
  type PageShellVariant = 'plain' | 'glass' | 'minimal';
196
336
  type PageShellProps = {
197
337
  header?: ReactNode;
@@ -200,6 +340,7 @@ type PageShellProps = {
200
340
  children: ReactNode;
201
341
  className?: string;
202
342
  mainClassName?: string;
343
+ /** @deprecated Use `mainClassName` instead. Alias kept for backwards compatibility. */
203
344
  containerClassName?: string;
204
345
  maxWidth?: 'sm' | 'md' | 'lg' | 'xl' | '2xl' | 'full';
205
346
  };
@@ -226,7 +367,46 @@ type DashboardLayoutProps = {
226
367
  navbar?: ReactNode;
227
368
  sidebar?: ReactNode;
228
369
  className?: string;
370
+ mainClassName?: string;
371
+ maxWidth?: 'sm' | 'md' | 'lg' | 'xl' | '2xl' | 'full';
372
+ };
373
+ declare function DashboardLayout({ children, navbar, sidebar, className, mainClassName, maxWidth }: DashboardLayoutProps): react_jsx_runtime.JSX.Element;
374
+
375
+ type ProgressButtonProps = Omit<ButtonProps, 'leftIcon' | 'rightIcon' | 'loading'> & {
376
+ isLoading?: boolean;
377
+ loadingText?: ReactNode;
378
+ };
379
+ declare const ProgressButton: react.ForwardRefExoticComponent<Omit<ButtonProps, "leftIcon" | "rightIcon" | "loading"> & {
380
+ isLoading?: boolean;
381
+ loadingText?: ReactNode;
382
+ } & react.RefAttributes<HTMLButtonElement>>;
383
+
384
+ type ToastVariant = 'info' | 'success' | 'warning' | 'error';
385
+ type ToastPosition = 'top-right' | 'top-center' | 'bottom-right' | 'bottom-center';
386
+ type ToastData = {
387
+ id: string;
388
+ variant: ToastVariant;
389
+ title: string;
390
+ description?: string;
391
+ duration?: number;
392
+ };
393
+ type ToastProviderProps = {
394
+ children: ReactNode;
395
+ position?: ToastPosition;
396
+ maxToasts?: number;
397
+ };
398
+ type ToastOptions = {
399
+ variant: ToastVariant;
400
+ title: string;
401
+ description?: string;
402
+ duration?: number;
403
+ };
404
+ type ToastContextValue = {
405
+ toast: (options: ToastOptions) => string;
406
+ dismiss: (id: string) => void;
407
+ dismissAll: () => void;
229
408
  };
230
- declare function DashboardLayout({ children, navbar, sidebar, className }: DashboardLayoutProps): react_jsx_runtime.JSX.Element;
409
+ declare function ToastProvider({ children, position, maxToasts }: ToastProviderProps): react_jsx_runtime.JSX.Element;
410
+ declare function useToast(): ToastContextValue;
231
411
 
232
- export { Badge, type BadgeProps, type BadgeSize, type BadgeVariant, Button, type ButtonProps, type ButtonSize, type ButtonVariant, Card, type CardProps, type CardVariant, CollapsibleSection, type CollapsibleSectionProps, ConfirmDialog, type ConfirmDialogProps, type ConfirmDialogVariant, DashboardLayout, type DashboardLayoutProps, EmptyState, type EmptyStateProps, IconButton, type IconButtonProps, Input, type InputProps, Modal, type ModalProps, Navbar, type NavbarProps, PageShell, type PageShellProps, type PageShellVariant, Pill, Select, type SelectProps, Sidebar, type SidebarProps, type Size, Skeleton, type SkeletonProps, Spinner, type SpinnerProps, type SpinnerSize, Textarea, type TextareaProps, Toggle, type ToggleProps, type ToggleSize, Tooltip, type TooltipProps, cn, focusSafely, getFocusableElements };
412
+ export { Badge, type BadgeProps, type BadgeSize, type BadgeVariant, Button, type ButtonProps, type ButtonSize, type ButtonVariant, Card, type CardProps, type CardVariant, Checkbox, type CheckboxProps, CollapsibleSection, type CollapsibleSectionProps, ConfirmDialog, type ConfirmDialogProps, type ConfirmDialogVariant, DashboardLayout, type DashboardLayoutProps, DropZone, type DropZoneProps, Dropdown, DropdownItem, type DropdownItemProps, DropdownMenu, type DropdownMenuProps, type DropdownProps, DropdownSeparator, type DropdownSeparatorProps, DropdownTrigger, type DropdownTriggerProps, EmptyState, type EmptyStateProps, IconButton, type IconButtonProps, Input, type InputProps, Modal, type ModalProps, Navbar, type NavbarProps, PageShell, type PageShellProps, type PageShellVariant, Pill, ProgressButton, type ProgressButtonProps, RadioGroup, type RadioGroupProps, RadioItem, type RadioItemProps, SearchInput, type SearchInputProps, Select, type SelectProps, Sidebar, type SidebarProps, type Size, Skeleton, type SkeletonProps, Spinner, type SpinnerProps, type SpinnerSize, Tab, TabList, type TabListProps, TabPanel, type TabPanelProps, type TabProps, Tabs, type TabsProps, type TabsVariant, Textarea, type TextareaProps, type ToastData, type ToastPosition, ToastProvider, type ToastProviderProps, type ToastVariant, Toggle, type ToggleProps, type ToggleSize, Tooltip, type TooltipPlacement, type TooltipProps, type UseClipboardReturn, type UseDisclosureReturn, cn, focusSafely, getFocusableElements, useClipboard, useDebounce, useDisclosure, useMediaQuery, useToast };
package/dist/index.d.ts CHANGED
@@ -1,5 +1,6 @@
1
+ export { MemelabColors, colors } from './tokens/index.js';
1
2
  import * as react from 'react';
2
- import { ButtonHTMLAttributes, ReactNode, InputHTMLAttributes, SelectHTMLAttributes, TextareaHTMLAttributes, HTMLAttributes, ReactElement } from 'react';
3
+ import { ButtonHTMLAttributes, ReactNode, InputHTMLAttributes, SelectHTMLAttributes, TextareaHTMLAttributes, HTMLAttributes, ReactElement, ComponentType } from 'react';
3
4
  import * as react_jsx_runtime from 'react/jsx-runtime';
4
5
 
5
6
  type ClassValue = string | number | null | undefined | boolean | Record<string, boolean | null | undefined> | ClassValue[];
@@ -12,6 +13,24 @@ declare function cn(...values: ClassValue[]): string;
12
13
  declare function getFocusableElements(container: HTMLElement): HTMLElement[];
13
14
  declare function focusSafely(el: HTMLElement | null | undefined): void;
14
15
 
16
+ type UseClipboardReturn = {
17
+ copy: (text: string) => Promise<void>;
18
+ copied: boolean;
19
+ };
20
+ declare function useClipboard(timeout?: number): UseClipboardReturn;
21
+
22
+ type UseDisclosureReturn = {
23
+ isOpen: boolean;
24
+ open: () => void;
25
+ close: () => void;
26
+ toggle: () => void;
27
+ };
28
+ declare function useDisclosure(defaultOpen?: boolean): UseDisclosureReturn;
29
+
30
+ declare function useMediaQuery(query: string): boolean;
31
+
32
+ declare function useDebounce<T>(value: T, delayMs?: number): T;
33
+
15
34
  type Size = 'sm' | 'md' | 'lg';
16
35
 
17
36
  type ButtonVariant = 'primary' | 'success' | 'warning' | 'danger' | 'secondary' | 'ghost';
@@ -57,26 +76,39 @@ declare const Input: react.ForwardRefExoticComponent<InputHTMLAttributes<HTMLInp
57
76
  helperText?: string;
58
77
  } & react.RefAttributes<HTMLInputElement>>;
59
78
 
79
+ type SearchInputProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'type'> & {
80
+ onClear?: () => void;
81
+ label?: string;
82
+ };
83
+ declare const SearchInput: react.ForwardRefExoticComponent<Omit<InputHTMLAttributes<HTMLInputElement>, "type"> & {
84
+ onClear?: () => void;
85
+ label?: string;
86
+ } & react.RefAttributes<HTMLInputElement>>;
87
+
60
88
  type SelectProps = SelectHTMLAttributes<HTMLSelectElement> & {
61
89
  hasError?: boolean;
62
90
  label?: string;
63
91
  error?: string;
92
+ helperText?: string;
64
93
  };
65
94
  declare const Select: react.ForwardRefExoticComponent<SelectHTMLAttributes<HTMLSelectElement> & {
66
95
  hasError?: boolean;
67
96
  label?: string;
68
97
  error?: string;
98
+ helperText?: string;
69
99
  } & react.RefAttributes<HTMLSelectElement>>;
70
100
 
71
101
  type TextareaProps = TextareaHTMLAttributes<HTMLTextAreaElement> & {
72
102
  hasError?: boolean;
73
103
  label?: string;
74
104
  error?: string;
105
+ helperText?: string;
75
106
  };
76
107
  declare const Textarea: react.ForwardRefExoticComponent<TextareaHTMLAttributes<HTMLTextAreaElement> & {
77
108
  hasError?: boolean;
78
109
  label?: string;
79
110
  error?: string;
111
+ helperText?: string;
80
112
  } & react.RefAttributes<HTMLTextAreaElement>>;
81
113
 
82
114
  type BadgeVariant = 'neutral' | 'primary' | 'success' | 'successSolid' | 'warning' | 'danger' | 'dangerSolid' | 'accent';
@@ -105,16 +137,51 @@ type ToggleProps = {
105
137
  disabled?: boolean;
106
138
  label?: string;
107
139
  size?: ToggleSize;
140
+ id?: string;
108
141
  'aria-label'?: string;
109
142
  };
110
- declare function Toggle({ checked, onChange, disabled, label, size, 'aria-label': ariaLabel }: ToggleProps): react_jsx_runtime.JSX.Element;
143
+ declare const Toggle: react.ForwardRefExoticComponent<ToggleProps & react.RefAttributes<HTMLButtonElement>>;
144
+
145
+ type CheckboxProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'type'> & {
146
+ label?: string;
147
+ error?: string;
148
+ indeterminate?: boolean;
149
+ };
150
+ declare const Checkbox: react.ForwardRefExoticComponent<Omit<InputHTMLAttributes<HTMLInputElement>, "type"> & {
151
+ label?: string;
152
+ error?: string;
153
+ indeterminate?: boolean;
154
+ } & react.RefAttributes<HTMLInputElement>>;
155
+
156
+ type RadioGroupProps = {
157
+ value?: string;
158
+ defaultValue?: string;
159
+ onValueChange?: (value: string) => void;
160
+ name?: string;
161
+ disabled?: boolean;
162
+ orientation?: 'horizontal' | 'vertical';
163
+ label?: string;
164
+ error?: string;
165
+ children: ReactNode;
166
+ className?: string;
167
+ };
168
+ type RadioItemProps = {
169
+ value: string;
170
+ disabled?: boolean;
171
+ children: ReactNode;
172
+ className?: string;
173
+ };
174
+ declare function RadioGroup({ value: controlledValue, defaultValue, onValueChange, name: externalName, disabled, orientation, label, error, children, className, }: RadioGroupProps): react_jsx_runtime.JSX.Element;
175
+ declare function RadioItem({ value, disabled: itemDisabled, children, className }: RadioItemProps): react_jsx_runtime.JSX.Element;
111
176
 
112
177
  type SpinnerSize = 'sm' | 'md' | 'lg';
113
178
  type SpinnerProps = {
114
179
  className?: string;
115
180
  size?: SpinnerSize;
181
+ /** Accessible label for screen readers. When provided, the spinner gets role="status". */
182
+ label?: string;
116
183
  };
117
- declare function Spinner({ className, size }: SpinnerProps): react_jsx_runtime.JSX.Element;
184
+ declare function Spinner({ className, size, label }: SpinnerProps): react_jsx_runtime.JSX.Element;
118
185
 
119
186
  type SkeletonProps = {
120
187
  className?: string;
@@ -122,13 +189,46 @@ type SkeletonProps = {
122
189
  };
123
190
  declare function Skeleton({ className, circle }: SkeletonProps): react_jsx_runtime.JSX.Element;
124
191
 
192
+ type TabsVariant = 'underline' | 'pill';
193
+ type TabsProps = {
194
+ defaultValue?: string;
195
+ value?: string;
196
+ onValueChange?: (value: string) => void;
197
+ variant?: TabsVariant;
198
+ children: ReactNode;
199
+ className?: string;
200
+ };
201
+ type TabListProps = {
202
+ children: ReactNode;
203
+ className?: string;
204
+ };
205
+ type TabProps = {
206
+ value: string;
207
+ disabled?: boolean;
208
+ children: ReactNode;
209
+ className?: string;
210
+ };
211
+ type TabPanelProps = {
212
+ value: string;
213
+ children: ReactNode;
214
+ className?: string;
215
+ };
216
+ declare function Tabs({ defaultValue, value, onValueChange, variant, children, className, }: TabsProps): react_jsx_runtime.JSX.Element;
217
+ declare function TabList({ children, className }: TabListProps): react_jsx_runtime.JSX.Element;
218
+ declare function Tab({ value, disabled, children, className }: TabProps): react_jsx_runtime.JSX.Element;
219
+ declare function TabPanel({ value, children, className }: TabPanelProps): react_jsx_runtime.JSX.Element | null;
220
+
125
221
  type CardVariant = 'surface' | 'glass';
126
222
  type CardProps = HTMLAttributes<HTMLDivElement> & {
127
223
  hoverable?: boolean;
128
224
  variant?: CardVariant;
129
225
  children: ReactNode;
130
226
  };
131
- declare function Card({ hoverable, variant, className, ...props }: CardProps): react_jsx_runtime.JSX.Element;
227
+ declare const Card: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & {
228
+ hoverable?: boolean;
229
+ variant?: CardVariant;
230
+ children: ReactNode;
231
+ } & react.RefAttributes<HTMLDivElement>>;
132
232
 
133
233
  type ModalProps = {
134
234
  isOpen: boolean;
@@ -171,9 +271,9 @@ type TooltipProps = {
171
271
  declare function Tooltip({ content, delayMs, placement, className, children }: TooltipProps): react_jsx_runtime.JSX.Element;
172
272
 
173
273
  type EmptyStateProps = {
174
- icon?: (props: {
274
+ icon?: ComponentType<{
175
275
  className?: string;
176
- }) => JSX.Element;
276
+ }>;
177
277
  title: string;
178
278
  description?: string;
179
279
  actionLabel?: string;
@@ -192,6 +292,46 @@ type CollapsibleSectionProps = {
192
292
  };
193
293
  declare function CollapsibleSection({ title, defaultOpen, children, right, className }: CollapsibleSectionProps): react_jsx_runtime.JSX.Element;
194
294
 
295
+ type DropdownProps = {
296
+ children: ReactNode;
297
+ className?: string;
298
+ };
299
+ type DropdownTriggerProps = {
300
+ children: ReactElement;
301
+ className?: string;
302
+ };
303
+ type DropdownMenuProps = {
304
+ children: ReactNode;
305
+ className?: string;
306
+ align?: 'left' | 'right';
307
+ };
308
+ type DropdownItemProps = {
309
+ onSelect?: () => void;
310
+ disabled?: boolean;
311
+ children: ReactNode;
312
+ className?: string;
313
+ };
314
+ type DropdownSeparatorProps = {
315
+ className?: string;
316
+ };
317
+ declare function Dropdown({ children, className }: DropdownProps): react_jsx_runtime.JSX.Element;
318
+ declare function DropdownTrigger({ children, className }: DropdownTriggerProps): ReactElement<any, string | react.JSXElementConstructor<any>>;
319
+ declare function DropdownMenu({ children, className, align }: DropdownMenuProps): react.ReactPortal | null;
320
+ declare function DropdownItem({ onSelect, disabled, children, className }: DropdownItemProps): react_jsx_runtime.JSX.Element;
321
+ declare function DropdownSeparator({ className }: DropdownSeparatorProps): react_jsx_runtime.JSX.Element;
322
+
323
+ type DropZoneProps = {
324
+ onFilesDropped: (files: File[]) => void;
325
+ accept?: string;
326
+ maxFiles?: number;
327
+ maxSize?: number;
328
+ disabled?: boolean;
329
+ children?: ReactNode;
330
+ className?: string;
331
+ 'aria-label'?: string;
332
+ };
333
+ declare function DropZone({ onFilesDropped, accept, maxFiles, maxSize, disabled, children, className, 'aria-label': ariaLabel, }: DropZoneProps): react_jsx_runtime.JSX.Element;
334
+
195
335
  type PageShellVariant = 'plain' | 'glass' | 'minimal';
196
336
  type PageShellProps = {
197
337
  header?: ReactNode;
@@ -200,6 +340,7 @@ type PageShellProps = {
200
340
  children: ReactNode;
201
341
  className?: string;
202
342
  mainClassName?: string;
343
+ /** @deprecated Use `mainClassName` instead. Alias kept for backwards compatibility. */
203
344
  containerClassName?: string;
204
345
  maxWidth?: 'sm' | 'md' | 'lg' | 'xl' | '2xl' | 'full';
205
346
  };
@@ -226,7 +367,46 @@ type DashboardLayoutProps = {
226
367
  navbar?: ReactNode;
227
368
  sidebar?: ReactNode;
228
369
  className?: string;
370
+ mainClassName?: string;
371
+ maxWidth?: 'sm' | 'md' | 'lg' | 'xl' | '2xl' | 'full';
372
+ };
373
+ declare function DashboardLayout({ children, navbar, sidebar, className, mainClassName, maxWidth }: DashboardLayoutProps): react_jsx_runtime.JSX.Element;
374
+
375
+ type ProgressButtonProps = Omit<ButtonProps, 'leftIcon' | 'rightIcon' | 'loading'> & {
376
+ isLoading?: boolean;
377
+ loadingText?: ReactNode;
378
+ };
379
+ declare const ProgressButton: react.ForwardRefExoticComponent<Omit<ButtonProps, "leftIcon" | "rightIcon" | "loading"> & {
380
+ isLoading?: boolean;
381
+ loadingText?: ReactNode;
382
+ } & react.RefAttributes<HTMLButtonElement>>;
383
+
384
+ type ToastVariant = 'info' | 'success' | 'warning' | 'error';
385
+ type ToastPosition = 'top-right' | 'top-center' | 'bottom-right' | 'bottom-center';
386
+ type ToastData = {
387
+ id: string;
388
+ variant: ToastVariant;
389
+ title: string;
390
+ description?: string;
391
+ duration?: number;
392
+ };
393
+ type ToastProviderProps = {
394
+ children: ReactNode;
395
+ position?: ToastPosition;
396
+ maxToasts?: number;
397
+ };
398
+ type ToastOptions = {
399
+ variant: ToastVariant;
400
+ title: string;
401
+ description?: string;
402
+ duration?: number;
403
+ };
404
+ type ToastContextValue = {
405
+ toast: (options: ToastOptions) => string;
406
+ dismiss: (id: string) => void;
407
+ dismissAll: () => void;
229
408
  };
230
- declare function DashboardLayout({ children, navbar, sidebar, className }: DashboardLayoutProps): react_jsx_runtime.JSX.Element;
409
+ declare function ToastProvider({ children, position, maxToasts }: ToastProviderProps): react_jsx_runtime.JSX.Element;
410
+ declare function useToast(): ToastContextValue;
231
411
 
232
- export { Badge, type BadgeProps, type BadgeSize, type BadgeVariant, Button, type ButtonProps, type ButtonSize, type ButtonVariant, Card, type CardProps, type CardVariant, CollapsibleSection, type CollapsibleSectionProps, ConfirmDialog, type ConfirmDialogProps, type ConfirmDialogVariant, DashboardLayout, type DashboardLayoutProps, EmptyState, type EmptyStateProps, IconButton, type IconButtonProps, Input, type InputProps, Modal, type ModalProps, Navbar, type NavbarProps, PageShell, type PageShellProps, type PageShellVariant, Pill, Select, type SelectProps, Sidebar, type SidebarProps, type Size, Skeleton, type SkeletonProps, Spinner, type SpinnerProps, type SpinnerSize, Textarea, type TextareaProps, Toggle, type ToggleProps, type ToggleSize, Tooltip, type TooltipProps, cn, focusSafely, getFocusableElements };
412
+ export { Badge, type BadgeProps, type BadgeSize, type BadgeVariant, Button, type ButtonProps, type ButtonSize, type ButtonVariant, Card, type CardProps, type CardVariant, Checkbox, type CheckboxProps, CollapsibleSection, type CollapsibleSectionProps, ConfirmDialog, type ConfirmDialogProps, type ConfirmDialogVariant, DashboardLayout, type DashboardLayoutProps, DropZone, type DropZoneProps, Dropdown, DropdownItem, type DropdownItemProps, DropdownMenu, type DropdownMenuProps, type DropdownProps, DropdownSeparator, type DropdownSeparatorProps, DropdownTrigger, type DropdownTriggerProps, EmptyState, type EmptyStateProps, IconButton, type IconButtonProps, Input, type InputProps, Modal, type ModalProps, Navbar, type NavbarProps, PageShell, type PageShellProps, type PageShellVariant, Pill, ProgressButton, type ProgressButtonProps, RadioGroup, type RadioGroupProps, RadioItem, type RadioItemProps, SearchInput, type SearchInputProps, Select, type SelectProps, Sidebar, type SidebarProps, type Size, Skeleton, type SkeletonProps, Spinner, type SpinnerProps, type SpinnerSize, Tab, TabList, type TabListProps, TabPanel, type TabPanelProps, type TabProps, Tabs, type TabsProps, type TabsVariant, Textarea, type TextareaProps, type ToastData, type ToastPosition, ToastProvider, type ToastProviderProps, type ToastVariant, Toggle, type ToggleProps, type ToggleSize, Tooltip, type TooltipPlacement, type TooltipProps, type UseClipboardReturn, type UseDisclosureReturn, cn, focusSafely, getFocusableElements, useClipboard, useDebounce, useDisclosure, useMediaQuery, useToast };