shubh-ui 0.1.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.
package/README.md ADDED
@@ -0,0 +1,141 @@
1
+ # @shubh/ui
2
+
3
+ Reusable React UI component library built with TypeScript, Tailwind CSS, and tsup.
4
+
5
+ ## Install
6
+
7
+ ```bash
8
+ npm install @shubh/ui
9
+ ```
10
+
11
+ Peer dependencies (required by consumer app):
12
+
13
+ ```bash
14
+ npm install react react-dom
15
+ ```
16
+
17
+ ## Tailwind Requirement
18
+
19
+ This package uses Tailwind utility classes and does **not** bundle Tailwind.
20
+ Consumers must configure Tailwind in their React/Next.js app.
21
+
22
+ ## Usage
23
+
24
+ ```tsx
25
+ import { Button, Input, Card, Navbar, Sidebar } from "@shubh/ui";
26
+
27
+ export function Example() {
28
+ return (
29
+ <Card>
30
+ <Button variant="primary" size="lg" loading={false}>
31
+ Save
32
+ </Button>
33
+ <Input label="Email" placeholder="you@example.com" />
34
+ </Card>
35
+ );
36
+ }
37
+ ```
38
+
39
+ ## Admin Dashboard Usage
40
+
41
+ ```tsx
42
+ import { Topbar, AdminSidebar, StatsCard, Table, Pagination } from "@shubh/ui";
43
+ import { BarChart3, Users, TrendingUp } from "lucide-react";
44
+
45
+ export function AdminDashboard() {
46
+ const [page, setPage] = useState(1);
47
+
48
+ return (
49
+ <div className="flex h-screen">
50
+ <AdminSidebar
51
+ collapsed={false}
52
+ activeItem="dashboard"
53
+ navigation={[
54
+ { id: "dashboard", label: "Dashboard", icon: <Home /> },
55
+ { id: "users", label: "Users", icon: <Users /> },
56
+ { id: "reports", label: "Reports", icon: <BarChart3 /> },
57
+ ]}
58
+ />
59
+ <div className="flex-1 flex flex-col">
60
+ <Topbar
61
+ title="Dashboard"
62
+ notifications={3}
63
+ userName="John Doe"
64
+ onSearchChange={(q) => console.log("Search:", q)}
65
+ />
66
+ <main className="flex-1 overflow-auto p-6">
67
+ <div className="grid grid-cols-1 md:grid-cols-3 gap-6">
68
+ <StatsCard
69
+ title="Total Users"
70
+ value="2,543"
71
+ trend="up"
72
+ trendPercent={12}
73
+ icon={<Users className="h-6 w-6" />}
74
+ />
75
+ <StatsCard
76
+ title="Revenue"
77
+ value="$45,230"
78
+ trend="up"
79
+ trendPercent={8}
80
+ icon={<TrendingUp className="h-6 w-6" />}
81
+ />
82
+ </div>
83
+ <Table columns={columns} data={tableData} />
84
+ <Pagination total={100} page={page} onPageChange={setPage} />
85
+ </main>
86
+ </div>
87
+ </div>
88
+ );
89
+ }
90
+ ```
91
+
92
+ ## Available Starter Exports
93
+
94
+ ### Core Components
95
+ - Button
96
+ - Input
97
+ - Card
98
+ - Modal
99
+ - Badge
100
+ - Tabs
101
+ - Select
102
+ - Textarea
103
+
104
+ ### Data & Display
105
+ - Table
106
+ - Pagination
107
+ - Sidebar (layout)
108
+ - Navbar (layout)
109
+
110
+ ### Admin Dashboard Components
111
+ - **Topbar** — Header with menu toggle, search, notifications, and user profile
112
+ - **AdminSidebar** — Collapsible sidebar navigation with icons and nested items
113
+ - **StatsCard** — KPI card with title, value, trend, and icon support
114
+ - **Form Components** — Input, Select, Textarea, Checkbox, Radio, Switch for admin forms
115
+ - **DataTable** — Sortable table with pagination and row actions
116
+ - **Pagination** — Page navigation with configurable steps
117
+
118
+ ### Utilities & Hooks
119
+ - `cn()` — Tailwind class merger (clsx + tailwind-merge)
120
+ - `useToggle()` — Boolean state toggle
121
+ - `useDebounce()` — Debounce values
122
+ - `useClickOutside()` — Detect clicks outside element
123
+
124
+ ## Scripts
125
+
126
+ ```bash
127
+ npm run dev # tsup watch build
128
+ npm run build # library build (esm + cjs + d.ts)
129
+ npm run lint # lint
130
+ npm run dev:showcase # Next.js showcase page
131
+ npm run build:showcase
132
+ ```
133
+
134
+ ## Build Output
135
+
136
+ `tsup` compiles from `src/index.ts` and generates:
137
+
138
+ - ESM
139
+ - CommonJS
140
+ - Type definitions
141
+ - Sourcemaps
@@ -0,0 +1,535 @@
1
+ import * as React$1 from 'react';
2
+ import React__default, { ButtonHTMLAttributes, ReactNode, InputHTMLAttributes, HTMLAttributes, RefObject } from 'react';
3
+ import { VariantProps } from 'class-variance-authority';
4
+ import * as class_variance_authority_types from 'class-variance-authority/types';
5
+ import * as react_jsx_runtime from 'react/jsx-runtime';
6
+ import { ClassValue } from 'clsx';
7
+
8
+ declare const buttonVariants: (props?: ({
9
+ variant?: "primary" | "secondary" | "outline" | "ghost" | "danger" | "destructive" | "navy" | "success" | "warning" | "link" | null | undefined;
10
+ size?: "xs" | "sm" | "md" | "lg" | "xl" | "icon" | "icon-sm" | "icon-lg" | null | undefined;
11
+ fullWidth?: boolean | null | undefined;
12
+ loading?: boolean | null | undefined;
13
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
14
+
15
+ interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
16
+ loading?: boolean;
17
+ leftIcon?: ReactNode;
18
+ rightIcon?: ReactNode;
19
+ fullWidth?: boolean;
20
+ }
21
+
22
+ declare const Button: React__default.ForwardRefExoticComponent<ButtonProps & React__default.RefAttributes<HTMLButtonElement>>;
23
+
24
+ interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "size"> {
25
+ variant?: "default" | "error" | "success";
26
+ size?: "sm" | "md" | "lg";
27
+ leftElement?: ReactNode;
28
+ rightElement?: ReactNode;
29
+ clearable?: boolean;
30
+ onClear?: () => void;
31
+ error?: string | boolean;
32
+ success?: string;
33
+ hint?: string;
34
+ label?: string;
35
+ required?: boolean;
36
+ }
37
+ declare const Input: React$1.ForwardRefExoticComponent<InputProps & React$1.RefAttributes<HTMLInputElement>>;
38
+
39
+ declare const inputVariants: (props?: ({
40
+ variant?: "success" | "default" | "error" | null | undefined;
41
+ size?: "sm" | "md" | "lg" | null | undefined;
42
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
43
+
44
+ declare const cardVariants: (props?: ({
45
+ variant?: "primary" | "outline" | "ghost" | "navy" | "default" | "elevated" | "outlined" | "filled" | "accent" | null | undefined;
46
+ padding?: "sm" | "md" | "lg" | "xl" | "none" | null | undefined;
47
+ hoverable?: boolean | null | undefined;
48
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
49
+ interface CardProps extends HTMLAttributes<HTMLDivElement>, VariantProps<typeof cardVariants> {
50
+ }
51
+ declare const Card: React$1.ForwardRefExoticComponent<CardProps & React$1.RefAttributes<HTMLDivElement>>;
52
+ declare const CardHeader: React$1.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & React$1.RefAttributes<HTMLDivElement>>;
53
+ declare const CardTitle: React$1.ForwardRefExoticComponent<HTMLAttributes<HTMLParagraphElement> & React$1.RefAttributes<HTMLParagraphElement>>;
54
+ declare const CardDescription: React$1.ForwardRefExoticComponent<HTMLAttributes<HTMLParagraphElement> & React$1.RefAttributes<HTMLParagraphElement>>;
55
+ declare const CardContent: React$1.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & React$1.RefAttributes<HTMLDivElement>>;
56
+ declare const CardFooter: React$1.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & React$1.RefAttributes<HTMLDivElement>>;
57
+
58
+ interface ModalProps {
59
+ open: boolean;
60
+ onClose: () => void;
61
+ title?: string;
62
+ description?: string;
63
+ children?: React__default.ReactNode;
64
+ footer?: React__default.ReactNode;
65
+ size?: 'sm' | 'md' | 'lg' | 'xl' | 'full';
66
+ closeOnOverlay?: boolean;
67
+ closeOnEsc?: boolean;
68
+ showCloseButton?: boolean;
69
+ className?: string;
70
+ }
71
+ declare const Modal: React__default.FC<ModalProps>;
72
+
73
+ interface TableColumn<T = Record<string, unknown>> {
74
+ key: string;
75
+ header: React__default.ReactNode;
76
+ cell?: (row: T, index: number) => React__default.ReactNode;
77
+ width?: string;
78
+ align?: 'left' | 'center' | 'right';
79
+ sortable?: boolean;
80
+ }
81
+ interface TableProps<T = Record<string, unknown>> {
82
+ columns: TableColumn<T>[];
83
+ data: T[];
84
+ keyExtractor: (row: T, index: number) => string;
85
+ sortKey?: string;
86
+ sortDir?: 'asc' | 'desc';
87
+ onSort?: (key: string) => void;
88
+ onRowClick?: (row: T) => void;
89
+ striped?: boolean;
90
+ hoverable?: boolean;
91
+ bordered?: boolean;
92
+ compact?: boolean;
93
+ className?: string;
94
+ emptyMessage?: string;
95
+ loading?: boolean;
96
+ }
97
+ declare function Table<T = Record<string, unknown>>({ columns, data, keyExtractor, sortKey, sortDir, onSort, onRowClick, striped, hoverable, bordered, compact, className, emptyMessage, loading, }: TableProps<T>): react_jsx_runtime.JSX.Element;
98
+ declare namespace Table {
99
+ var displayName: string;
100
+ }
101
+
102
+ interface PaginationProps {
103
+ total: number;
104
+ page: number;
105
+ pageSize?: number;
106
+ onPageChange: (page: number) => void;
107
+ onPageSizeChange?: (size: number) => void;
108
+ pageSizeOptions?: number[];
109
+ showPageSize?: boolean;
110
+ showTotal?: boolean;
111
+ showFirstLast?: boolean;
112
+ siblingCount?: number;
113
+ className?: string;
114
+ size?: 'sm' | 'md' | 'lg';
115
+ }
116
+ declare const Pagination: React__default.FC<PaginationProps>;
117
+
118
+ interface SelectOption {
119
+ value: string;
120
+ label: string;
121
+ disabled?: boolean;
122
+ description?: string;
123
+ icon?: React__default.ReactNode;
124
+ }
125
+ interface SelectProps {
126
+ options: SelectOption[];
127
+ value?: string | string[];
128
+ onChange?: (value: string | string[]) => void;
129
+ placeholder?: string;
130
+ label?: string;
131
+ hint?: string;
132
+ error?: string;
133
+ disabled?: boolean;
134
+ multiple?: boolean;
135
+ clearable?: boolean;
136
+ size?: 'sm' | 'md' | 'lg';
137
+ className?: string;
138
+ id?: string;
139
+ required?: boolean;
140
+ }
141
+ declare const Select: React__default.ForwardRefExoticComponent<SelectProps & React__default.RefAttributes<HTMLDivElement>>;
142
+
143
+ interface TextareaProps extends React__default.TextareaHTMLAttributes<HTMLTextAreaElement> {
144
+ label?: string;
145
+ hint?: string;
146
+ error?: string;
147
+ success?: string;
148
+ required?: boolean;
149
+ resize?: 'none' | 'both' | 'horizontal' | 'vertical';
150
+ showCount?: boolean;
151
+ maxLength?: number;
152
+ }
153
+ declare const Textarea: React__default.ForwardRefExoticComponent<TextareaProps & React__default.RefAttributes<HTMLTextAreaElement>>;
154
+
155
+ declare const badgeVariants: (props?: ({
156
+ variant?: "primary" | "secondary" | "outline" | "ghost" | "destructive" | "navy" | "success" | "warning" | "default" | "info" | null | undefined;
157
+ size?: "sm" | "md" | "lg" | null | undefined;
158
+ dot?: boolean | null | undefined;
159
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
160
+ interface BadgeProps extends React__default.HTMLAttributes<HTMLSpanElement>, VariantProps<typeof badgeVariants> {
161
+ dot?: boolean;
162
+ dotColor?: string;
163
+ removable?: boolean;
164
+ onRemove?: () => void;
165
+ }
166
+ declare const Badge: React__default.FC<BadgeProps>;
167
+
168
+ interface TabItem {
169
+ id: string;
170
+ label: React__default.ReactNode;
171
+ content: React__default.ReactNode;
172
+ disabled?: boolean;
173
+ badge?: string | number;
174
+ icon?: React__default.ReactNode;
175
+ }
176
+ interface TabsProps {
177
+ items: TabItem[];
178
+ defaultTab?: string;
179
+ activeTab?: string;
180
+ onChange?: (id: string) => void;
181
+ variant?: 'line' | 'pill' | 'enclosed' | 'soft';
182
+ size?: 'sm' | 'md' | 'lg';
183
+ fullWidth?: boolean;
184
+ className?: string;
185
+ contentClassName?: string;
186
+ }
187
+ declare const Tabs: React__default.FC<TabsProps>;
188
+
189
+ interface AccordionItem {
190
+ id: string;
191
+ title: React__default.ReactNode;
192
+ content: React__default.ReactNode;
193
+ disabled?: boolean;
194
+ icon?: React__default.ReactNode;
195
+ badge?: React__default.ReactNode;
196
+ }
197
+ interface AccordionProps {
198
+ items: AccordionItem[];
199
+ defaultOpen?: string[];
200
+ multiple?: boolean;
201
+ variant?: 'default' | 'bordered' | 'flush' | 'filled';
202
+ className?: string;
203
+ }
204
+ declare const Accordion: React__default.FC<AccordionProps>;
205
+
206
+ declare const alertVariants: (props?: ({
207
+ variant?: "destructive" | "navy" | "success" | "warning" | "info" | "neutral" | null | undefined;
208
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
209
+ interface AlertProps extends React__default.HTMLAttributes<HTMLDivElement>, VariantProps<typeof alertVariants> {
210
+ title?: string;
211
+ dismissible?: boolean;
212
+ onDismiss?: () => void;
213
+ icon?: React__default.ReactNode;
214
+ action?: React__default.ReactNode;
215
+ }
216
+ declare const Alert: React__default.FC<AlertProps>;
217
+
218
+ declare const avatarVariants: (props?: ({
219
+ size?: "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | null | undefined;
220
+ shape?: "circle" | "square" | null | undefined;
221
+ variant?: "primary" | "navy" | "icon" | "image" | "initials" | null | undefined;
222
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
223
+ interface AvatarProps extends React__default.HTMLAttributes<HTMLDivElement>, VariantProps<typeof avatarVariants> {
224
+ src?: string;
225
+ alt?: string;
226
+ initials?: string;
227
+ status?: 'online' | 'offline' | 'busy' | 'away';
228
+ }
229
+ declare const Avatar: React__default.FC<AvatarProps>;
230
+
231
+ interface BreadcrumbItem {
232
+ label: string;
233
+ href?: string;
234
+ icon?: React__default.ReactNode;
235
+ }
236
+ interface BreadcrumbProps {
237
+ items: BreadcrumbItem[];
238
+ separator?: React__default.ReactNode;
239
+ showHome?: boolean;
240
+ maxItems?: number;
241
+ className?: string;
242
+ size?: 'sm' | 'md' | 'lg';
243
+ }
244
+ declare const Breadcrumb: React__default.FC<BreadcrumbProps>;
245
+
246
+ type CalendarSize = 'sm' | 'md' | 'lg';
247
+ type CalendarView = 'day' | 'month' | 'year';
248
+ type CalendarTheme = 'navy' | 'light';
249
+ interface CalendarProps {
250
+ /** Controlled selected date */
251
+ value?: Date | null;
252
+ /** Default selected date (uncontrolled) */
253
+ defaultValue?: Date | null;
254
+ /** Called when a date is selected */
255
+ onChange?: (date: Date) => void;
256
+ /** Size variant */
257
+ size?: CalendarSize;
258
+ /** Theme variant */
259
+ theme?: CalendarTheme;
260
+ /** Initial view to show */
261
+ initialView?: CalendarView;
262
+ /** Minimum selectable date */
263
+ minDate?: Date;
264
+ /** Maximum selectable date */
265
+ maxDate?: Date;
266
+ /** Additional class names */
267
+ className?: string;
268
+ /** ARIA label for the calendar */
269
+ 'aria-label'?: string;
270
+ }
271
+ declare function Calendar({ value, defaultValue, onChange, size, theme, initialView, minDate, maxDate, className, 'aria-label': ariaLabel, }: CalendarProps): react_jsx_runtime.JSX.Element;
272
+
273
+ declare const calendarVariants: (props?: ({
274
+ size?: "sm" | "md" | "lg" | null | undefined;
275
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
276
+ declare const calendarCellVariants: (props?: ({
277
+ size?: "sm" | "md" | "lg" | null | undefined;
278
+ selected?: boolean | null | undefined;
279
+ outside?: boolean | null | undefined;
280
+ disabled?: boolean | null | undefined;
281
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
282
+
283
+ interface CheckboxProps extends Omit<React__default.InputHTMLAttributes<HTMLInputElement>, 'type' | 'size'> {
284
+ label?: string;
285
+ description?: string;
286
+ size?: 'sm' | 'md' | 'lg';
287
+ indeterminate?: boolean;
288
+ error?: string;
289
+ }
290
+ declare const Checkbox: React__default.ForwardRefExoticComponent<CheckboxProps & React__default.RefAttributes<HTMLInputElement>>;
291
+
292
+ interface DividerProps extends React__default.HTMLAttributes<HTMLDivElement> {
293
+ orientation?: 'horizontal' | 'vertical';
294
+ label?: React__default.ReactNode;
295
+ labelAlign?: 'left' | 'center' | 'right';
296
+ variant?: 'solid' | 'dashed' | 'dotted';
297
+ thickness?: 'thin' | 'medium' | 'thick';
298
+ }
299
+ declare const Divider: React__default.FC<DividerProps>;
300
+
301
+ interface DrawerProps {
302
+ open: boolean;
303
+ onClose: () => void;
304
+ title?: string;
305
+ description?: string;
306
+ children?: React__default.ReactNode;
307
+ footer?: React__default.ReactNode;
308
+ placement?: 'left' | 'right' | 'top' | 'bottom';
309
+ size?: 'sm' | 'md' | 'lg' | 'full';
310
+ closeOnOverlay?: boolean;
311
+ closeOnEsc?: boolean;
312
+ showCloseButton?: boolean;
313
+ className?: string;
314
+ }
315
+ declare const Drawer: React__default.FC<DrawerProps>;
316
+
317
+ interface DropdownItem {
318
+ id: string;
319
+ label: React__default.ReactNode;
320
+ icon?: React__default.ReactNode;
321
+ shortcut?: string;
322
+ disabled?: boolean;
323
+ danger?: boolean;
324
+ checked?: boolean;
325
+ separator?: false;
326
+ onClick?: () => void;
327
+ children?: DropdownItem[];
328
+ }
329
+ interface DropdownSeparator {
330
+ id: string;
331
+ separator: true;
332
+ label?: string;
333
+ }
334
+ type DropdownMenuItem = DropdownItem | DropdownSeparator;
335
+ interface DropdownProps {
336
+ trigger: React__default.ReactNode;
337
+ items: DropdownMenuItem[];
338
+ align?: 'left' | 'right';
339
+ className?: string;
340
+ menuClassName?: string;
341
+ }
342
+ declare const Dropdown: React__default.FC<DropdownProps>;
343
+
344
+ declare const labelVariants: (props?: ({
345
+ variant?: "default" | "error" | "muted" | null | undefined;
346
+ required?: boolean | null | undefined;
347
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
348
+ interface LabelProps extends React__default.LabelHTMLAttributes<HTMLLabelElement>, VariantProps<typeof labelVariants> {
349
+ }
350
+ declare const Label: React__default.ForwardRefExoticComponent<LabelProps & React__default.RefAttributes<HTMLLabelElement>>;
351
+
352
+ declare const progressTrackVariants: (props?: ({
353
+ size?: "xs" | "sm" | "md" | "lg" | "xl" | null | undefined;
354
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
355
+ interface ProgressProps extends React__default.HTMLAttributes<HTMLDivElement>, VariantProps<typeof progressTrackVariants> {
356
+ value: number;
357
+ max?: number;
358
+ color?: 'primary' | 'success' | 'warning' | 'destructive' | 'navy';
359
+ showLabel?: boolean;
360
+ label?: string;
361
+ animated?: boolean;
362
+ striped?: boolean;
363
+ }
364
+ declare const Progress: React__default.FC<ProgressProps>;
365
+
366
+ interface RadioProps extends Omit<React__default.InputHTMLAttributes<HTMLInputElement>, 'type' | 'size'> {
367
+ label?: string;
368
+ description?: string;
369
+ size?: 'sm' | 'md' | 'lg';
370
+ error?: string;
371
+ }
372
+ declare const Radio: React__default.ForwardRefExoticComponent<RadioProps & React__default.RefAttributes<HTMLInputElement>>;
373
+
374
+ type SortDirection = 'asc' | 'desc' | null;
375
+ type FetchParams = {
376
+ page: number;
377
+ pageSize: number;
378
+ search: string;
379
+ sortField: string | null;
380
+ sortDirection: SortDirection;
381
+ status: 'active' | 'closed';
382
+ };
383
+ type FetchResult<T> = {
384
+ data: T[];
385
+ total: number;
386
+ };
387
+ type ServerDataTableTheme = 'navy' | 'light';
388
+ interface ServerDataTableProps<T extends Record<string, unknown>> {
389
+ fetchData: (params: FetchParams) => Promise<FetchResult<T>>;
390
+ columns: ColumnDef<T>[];
391
+ keyExtractor: (row: T) => string;
392
+ pageSize?: number;
393
+ renderExpandedRow?: (row: T, note: string, onNoteChange: (v: string) => void, onApprove: () => void, onReject: () => void) => React__default.ReactNode;
394
+ onApprove?: (row: T, note: string) => void;
395
+ onReject?: (row: T, note: string) => void;
396
+ appliedDateField?: keyof T;
397
+ className?: string;
398
+ theme?: ServerDataTableTheme;
399
+ }
400
+ type ColumnDef<T> = {
401
+ key: string;
402
+ header: string;
403
+ sortable?: boolean;
404
+ cell?: (row: T) => React__default.ReactNode;
405
+ width?: string;
406
+ };
407
+ declare function ServerDataTable<T extends Record<string, unknown>>({ fetchData, columns, keyExtractor, pageSize, renderExpandedRow, onApprove, onReject, appliedDateField, className, theme, }: ServerDataTableProps<T>): react_jsx_runtime.JSX.Element;
408
+
409
+ interface SkeletonProps extends React__default.HTMLAttributes<HTMLDivElement> {
410
+ variant?: 'text' | 'circle' | 'rect' | 'card';
411
+ width?: string | number;
412
+ height?: string | number;
413
+ lines?: number;
414
+ animated?: boolean;
415
+ }
416
+ declare const Skeleton: React__default.FC<SkeletonProps>;
417
+ declare const SkeletonCard: React__default.FC<{
418
+ className?: string;
419
+ }>;
420
+
421
+ declare const spinnerVariants: (props?: ({
422
+ size?: "xs" | "sm" | "md" | "lg" | "xl" | null | undefined;
423
+ color?: "primary" | "danger" | "success" | "warning" | "muted" | "white" | null | undefined;
424
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
425
+ interface SpinnerProps extends Omit<React__default.HTMLAttributes<HTMLDivElement>, 'color'>, VariantProps<typeof spinnerVariants> {
426
+ label?: string;
427
+ }
428
+ declare const Spinner: React__default.FC<SpinnerProps>;
429
+
430
+ interface SwitchProps extends Omit<React__default.InputHTMLAttributes<HTMLInputElement>, 'size' | 'type'> {
431
+ label?: string;
432
+ description?: string;
433
+ size?: 'sm' | 'md' | 'lg';
434
+ labelPlacement?: 'left' | 'right';
435
+ }
436
+ declare const Switch: React__default.ForwardRefExoticComponent<SwitchProps & React__default.RefAttributes<HTMLInputElement>>;
437
+
438
+ interface TagProps extends React__default.HTMLAttributes<HTMLSpanElement> {
439
+ size?: 'sm' | 'md' | 'lg';
440
+ variant?: 'default' | 'outlined' | 'filled' | 'navy';
441
+ color?: 'default' | 'blue' | 'green' | 'red' | 'amber' | 'purple' | 'pink';
442
+ removable?: boolean;
443
+ onRemove?: () => void;
444
+ icon?: React__default.ReactNode;
445
+ }
446
+ declare const Tag: React__default.FC<TagProps>;
447
+
448
+ interface TooltipProps {
449
+ content: React__default.ReactNode;
450
+ children: React__default.ReactElement;
451
+ placement?: 'top' | 'bottom' | 'left' | 'right';
452
+ delay?: number;
453
+ className?: string;
454
+ maxWidth?: string;
455
+ disabled?: boolean;
456
+ }
457
+ declare const Tooltip: React__default.FC<TooltipProps>;
458
+
459
+ interface TopbarProps extends HTMLAttributes<HTMLElement> {
460
+ title?: string;
461
+ onSearchChange?: (query: string) => void;
462
+ onMenuToggle?: () => void;
463
+ menuOpen?: boolean;
464
+ notifications?: number;
465
+ onNotifications?: () => void;
466
+ onProfile?: () => void;
467
+ profileImage?: string;
468
+ userName?: string;
469
+ }
470
+ declare const Topbar: React$1.ForwardRefExoticComponent<TopbarProps & React$1.RefAttributes<HTMLElement>>;
471
+
472
+ interface AdminSidebarProps extends HTMLAttributes<HTMLElement> {
473
+ collapsed?: boolean;
474
+ onToggle?: () => void;
475
+ navigation?: NavItem[];
476
+ activeItem?: string;
477
+ onNavigate?: (item: string) => void;
478
+ }
479
+ interface NavItem {
480
+ id: string;
481
+ label: string;
482
+ icon?: React.ReactNode;
483
+ href?: string;
484
+ children?: NavItem[];
485
+ }
486
+ declare const AdminSidebar: React$1.ForwardRefExoticComponent<AdminSidebarProps & React$1.RefAttributes<HTMLElement>>;
487
+
488
+ interface StatsCardProps extends HTMLAttributes<HTMLDivElement> {
489
+ title: string;
490
+ value: string | number;
491
+ subtitle?: string;
492
+ icon?: ReactNode;
493
+ trend?: "up" | "down" | null;
494
+ trendPercent?: number;
495
+ trendLabel?: string;
496
+ variant?: "default" | "primary" | "success" | "warning" | "danger";
497
+ }
498
+ declare const StatsCard: React$1.ForwardRefExoticComponent<StatsCardProps & React$1.RefAttributes<HTMLDivElement>>;
499
+
500
+ interface NavbarProps extends HTMLAttributes<HTMLElement> {
501
+ sticky?: boolean;
502
+ }
503
+ declare const Navbar: React$1.ForwardRefExoticComponent<NavbarProps & React$1.RefAttributes<HTMLElement>>;
504
+
505
+ interface SidebarProps extends HTMLAttributes<HTMLElement> {
506
+ collapsed?: boolean;
507
+ }
508
+ declare const Sidebar: React$1.ForwardRefExoticComponent<SidebarProps & React$1.RefAttributes<HTMLElement>>;
509
+
510
+ /**
511
+ * useClickOutside — fires callback when user clicks outside the referenced element.
512
+ */
513
+ declare function useClickOutside<T extends HTMLElement>(ref: RefObject<T>, callback: () => void): void;
514
+
515
+ /**
516
+ * useDebounce — delays updating value until after delay ms.
517
+ */
518
+ declare function useDebounce<T>(value: T, delay?: number): T;
519
+
520
+ /**
521
+ * useToggle — simple boolean toggle hook.
522
+ * @param initialValue - initial state (default false)
523
+ * @returns [value, toggle, setOn, setOff, setValue]
524
+ */
525
+ declare function useToggle(initialValue?: boolean): [
526
+ boolean,
527
+ () => void,
528
+ () => void,
529
+ () => void,
530
+ (v: boolean) => void
531
+ ];
532
+
533
+ declare function cn(...inputs: ClassValue[]): string;
534
+
535
+ export { Accordion, type AccordionProps, Button as AdminButton, Card as AdminCard, CardContent as AdminCardContent, CardDescription as AdminCardDescription, CardFooter as AdminCardFooter, CardHeader as AdminCardHeader, CardTitle as AdminCardTitle, Input as AdminInput, Pagination as AdminPagination, Select as AdminSelect, AdminSidebar, type AdminSidebarProps, Table as AdminTable, Alert, type AlertProps, Avatar, type AvatarProps, Badge, type BadgeProps, Breadcrumb, type BreadcrumbItem, type BreadcrumbProps, Button, type ButtonProps, Calendar, type CalendarProps, type CalendarSize, type CalendarTheme, type CalendarView, Card, CardContent, CardDescription, CardFooter, CardHeader, type CardProps, CardTitle, Checkbox, type CheckboxProps, type ColumnDef, Divider, type DividerProps, Drawer, type DrawerProps, Dropdown, type DropdownProps, type FetchParams, type FetchResult, Input, type InputProps, Label, type LabelProps, Modal, type ModalProps, type NavItem, Navbar, type NavbarProps, Pagination, type PaginationProps, Progress, type ProgressProps, Radio, type RadioProps, Select, type SelectProps, ServerDataTable, type ServerDataTableProps, type ServerDataTableTheme, Sidebar, type SidebarProps, Skeleton, SkeletonCard, type SkeletonProps, type SortDirection, Spinner, type SpinnerProps, StatsCard, type StatsCardProps, Switch, type SwitchProps, Table, type TableProps, Tabs, type TabsProps, Tag, type TagProps, Textarea, type TextareaProps, Tooltip, type TooltipProps, Topbar, type TopbarProps, alertVariants, badgeVariants, buttonVariants, calendarCellVariants, calendarVariants, cardVariants, cn, inputVariants, useClickOutside, useDebounce, useToggle };