@peppone.choi/ui-kit 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.
@@ -0,0 +1,1936 @@
1
+ import * as react_jsx_runtime from 'react/jsx-runtime';
2
+ import * as class_variance_authority_types from 'class-variance-authority/types';
3
+ import { Button as Button$1 } from '@base-ui/react/button';
4
+ import { VariantProps } from 'class-variance-authority';
5
+ import * as React$1 from 'react';
6
+ import { ReactNode, JSX } from 'react';
7
+ import { Checkbox as Checkbox$1 } from '@base-ui/react/checkbox';
8
+ import { Radio as Radio$1 } from '@base-ui/react/radio';
9
+ import { RadioGroup as RadioGroup$1 } from '@base-ui/react/radio-group';
10
+ import { Switch as Switch$1 } from '@base-ui/react/switch';
11
+
12
+ declare const buttonVariants: (props?: ({
13
+ variant?: "default" | "outline" | "secondary" | "ghost" | "destructive" | "link" | null | undefined;
14
+ size?: "default" | "xs" | "sm" | "lg" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined;
15
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
16
+ declare function Button({ className, variant, size, ...props }: Button$1.Props & VariantProps<typeof buttonVariants>): react_jsx_runtime.JSX.Element;
17
+
18
+ declare const chipVariants: (props?: ({
19
+ variant?: "filled" | "outlined" | "soft" | null | undefined;
20
+ size?: "sm" | "md" | null | undefined;
21
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
22
+ interface ChipProps extends React.HTMLAttributes<HTMLSpanElement>, VariantProps<typeof chipVariants> {
23
+ active?: boolean;
24
+ disabled?: boolean;
25
+ onRemove?: () => void;
26
+ leadingIcon?: React.ReactNode;
27
+ trailingIcon?: React.ReactNode;
28
+ }
29
+ declare function Chip({ className, variant, size, active, disabled, onRemove, leadingIcon, trailingIcon, children, ...props }: ChipProps): react_jsx_runtime.JSX.Element;
30
+
31
+ declare const iconButtonVariants: (props?: ({
32
+ variant?: "ghost" | "outlined" | "normal" | "solid" | null | undefined;
33
+ size?: "sm" | "lg" | "md" | null | undefined;
34
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
35
+ interface IconButtonProps extends Omit<Button$1.Props, "aria-label">, VariantProps<typeof iconButtonVariants> {
36
+ "aria-label": string;
37
+ icon: React.ReactNode;
38
+ }
39
+ declare function IconButton({ className, variant, size, icon, "aria-label": ariaLabel, ...props }: IconButtonProps): react_jsx_runtime.JSX.Element;
40
+
41
+ declare const textButtonVariants: (props?: ({
42
+ size?: "sm" | "lg" | "md" | null | undefined;
43
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
44
+ interface TextButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof textButtonVariants> {
45
+ leadingIcon?: React.ReactNode;
46
+ trailingIcon?: React.ReactNode;
47
+ }
48
+ declare function TextButton({ className, size, leadingIcon, trailingIcon, children, disabled, ...props }: TextButtonProps): react_jsx_runtime.JSX.Element;
49
+
50
+ interface ActionAreaProps extends React$1.HTMLAttributes<HTMLElement> {
51
+ href?: string;
52
+ onClick?: () => void;
53
+ disabled?: boolean;
54
+ children: React$1.ReactNode;
55
+ /**
56
+ * Component used to render the link when `href` is set. Defaults to a
57
+ * native `<a>` so the core works in any framework. Pass a framework link
58
+ * (e.g. Next.js `Link`, React Router `Link`) for client-side navigation.
59
+ * The "@peppone.choi/ui-kit/next" entry exports a Next.js-wired ActionArea.
60
+ */
61
+ linkComponent?: React$1.ElementType;
62
+ }
63
+ declare function ActionArea({ className, href, onClick, disabled, children, linkComponent, ...props }: ActionAreaProps): react_jsx_runtime.JSX.Element;
64
+
65
+ interface ToggleIconProps {
66
+ active: boolean;
67
+ activeIcon: React$1.ReactNode;
68
+ inactiveIcon: React$1.ReactNode;
69
+ onToggle: (active: boolean) => void;
70
+ className?: string;
71
+ size?: "sm" | "md" | "lg";
72
+ disabled?: boolean;
73
+ ariaLabel?: string;
74
+ }
75
+ declare function ToggleIcon({ active, activeIcon, inactiveIcon, onToggle, className, size, disabled, ariaLabel, }: ToggleIconProps): react_jsx_runtime.JSX.Element;
76
+
77
+ interface AccordionProps {
78
+ children: React$1.ReactNode;
79
+ type?: "single" | "multiple";
80
+ defaultValue?: string | string[];
81
+ value?: string | string[];
82
+ onValueChange?: (value: string | string[]) => void;
83
+ className?: string;
84
+ }
85
+ declare function Accordion({ children, type, defaultValue, value: controlledValue, onValueChange, className, }: AccordionProps): react_jsx_runtime.JSX.Element;
86
+ declare const accordionItemVariants: (props?: ({
87
+ divider?: boolean | null | undefined;
88
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
89
+ interface AccordionItemProps extends React$1.HTMLAttributes<HTMLDivElement>, VariantProps<typeof accordionItemVariants> {
90
+ value: string;
91
+ children: React$1.ReactNode;
92
+ }
93
+ declare function AccordionItem({ value, divider, className, children, ...props }: AccordionItemProps): react_jsx_runtime.JSX.Element;
94
+ declare const accordionTriggerVariants: (props?: ({
95
+ size?: "sm" | "lg" | "md" | null | undefined;
96
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
97
+ interface AccordionTriggerProps extends React$1.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof accordionTriggerVariants> {
98
+ children: React$1.ReactNode;
99
+ }
100
+ declare function AccordionTrigger({ className, size, children, ...props }: AccordionTriggerProps): react_jsx_runtime.JSX.Element;
101
+ interface AccordionContentProps extends React$1.HTMLAttributes<HTMLDivElement> {
102
+ children: React$1.ReactNode;
103
+ }
104
+ declare function AccordionContent({ className, children, ...props }: AccordionContentProps): react_jsx_runtime.JSX.Element;
105
+
106
+ type AvatarSize = "xs" | "sm" | "md" | "lg" | "xl";
107
+ type AvatarStatus = "online" | "offline" | "away";
108
+ declare const sizeMap: Record<AvatarSize, number>;
109
+ declare const avatarVariants: (props?: ({
110
+ size?: "xs" | "sm" | "lg" | "md" | "xl" | null | undefined;
111
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
112
+ declare function getInitials(name: string): string;
113
+ declare function getBorderRadius(size: AvatarSize): number;
114
+ interface AvatarProps extends React$1.HTMLAttributes<HTMLDivElement>, VariantProps<typeof avatarVariants> {
115
+ src?: string;
116
+ alt?: string;
117
+ name?: string;
118
+ status?: AvatarStatus;
119
+ fallback?: React$1.ReactNode;
120
+ }
121
+ declare function Avatar({ className, size, src, alt, name, status, fallback, style, ...props }: AvatarProps): react_jsx_runtime.JSX.Element;
122
+
123
+ interface AvatarGroupItem {
124
+ src?: string;
125
+ alt?: string;
126
+ name?: string;
127
+ status?: "online" | "offline" | "away";
128
+ }
129
+ interface AvatarGroupProps extends React$1.HTMLAttributes<HTMLDivElement> {
130
+ items: AvatarGroupItem[];
131
+ max?: number;
132
+ size?: AvatarSize;
133
+ className?: string;
134
+ }
135
+ declare const avatarGroupVariants: (props?: ({
136
+ size?: "xs" | "sm" | "lg" | "md" | "xl" | null | undefined;
137
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
138
+ declare function AvatarGroup({ className, items, max, size, ...props }: AvatarGroupProps): react_jsx_runtime.JSX.Element;
139
+
140
+ interface AvatarButtonProps {
141
+ src?: string;
142
+ alt?: string;
143
+ name?: string;
144
+ size?: "xs" | "sm" | "md" | "lg" | "xl";
145
+ status?: "online" | "offline" | "away";
146
+ className?: string;
147
+ disabled?: boolean;
148
+ onClick?: () => void;
149
+ ariaLabel?: string;
150
+ }
151
+ declare function AvatarButton({ src, alt, name, size, status, className, disabled, onClick, ariaLabel, }: AvatarButtonProps): react_jsx_runtime.JSX.Element;
152
+
153
+ interface CardListProps extends React$1.HTMLAttributes<HTMLDivElement> {
154
+ gap?: "sm" | "md" | "lg";
155
+ columns?: 1 | 2 | 3;
156
+ }
157
+ declare function CardList({ className, children, gap, columns, ...props }: CardListProps): react_jsx_runtime.JSX.Element;
158
+
159
+ interface ListProps extends React$1.HTMLAttributes<HTMLUListElement> {
160
+ spacing?: "none" | "sm" | "md" | "lg";
161
+ divided?: boolean;
162
+ }
163
+ declare function List({ className, children, spacing, divided, ...props }: ListProps): react_jsx_runtime.JSX.Element;
164
+ interface ListItemProps extends React$1.LiHTMLAttributes<HTMLLIElement> {
165
+ leading?: React$1.ReactNode;
166
+ trailing?: React$1.ReactNode;
167
+ active?: boolean;
168
+ }
169
+ declare function ListItem({ className, children, leading, trailing, active, ...props }: ListItemProps): react_jsx_runtime.JSX.Element;
170
+
171
+ declare function Card({ className, size, ...props }: React$1.ComponentProps<"div"> & {
172
+ size?: "default" | "sm";
173
+ }): react_jsx_runtime.JSX.Element;
174
+ declare function CardHeader({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
175
+ declare function CardTitle({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
176
+ declare function CardDescription({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
177
+ declare function CardContent({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
178
+ declare function CardFooter({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
179
+
180
+ type ContentBadgeVariant = "default" | "brand" | "success" | "warning" | "error";
181
+ declare const contentBadgeVariants: (props?: ({
182
+ variant?: "default" | "error" | "brand" | "success" | "warning" | null | undefined;
183
+ size?: "sm" | "lg" | "md" | null | undefined;
184
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
185
+ declare const dotVariants: (props?: ({
186
+ variant?: "default" | "error" | "brand" | "success" | "warning" | null | undefined;
187
+ size?: "sm" | "lg" | "md" | null | undefined;
188
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
189
+ interface ContentBadgeProps extends React$1.HTMLAttributes<HTMLSpanElement>, VariantProps<typeof contentBadgeVariants> {
190
+ count?: number;
191
+ max?: number;
192
+ dot?: boolean;
193
+ }
194
+ declare function ContentBadge({ className, variant, size, count, max, dot, children, ...props }: ContentBadgeProps): react_jsx_runtime.JSX.Element;
195
+
196
+ interface ListCardProps extends Omit<React$1.HTMLAttributes<HTMLDivElement>, "title"> {
197
+ leading?: React$1.ReactNode;
198
+ title: React$1.ReactNode;
199
+ subtitle?: React$1.ReactNode;
200
+ description?: React$1.ReactNode;
201
+ trailing?: React$1.ReactNode;
202
+ thumbnail?: React$1.ReactNode;
203
+ hoverable?: boolean;
204
+ }
205
+ declare function ListCard({ className, leading, title, subtitle, description, trailing, thumbnail, hoverable, ...props }: ListCardProps): react_jsx_runtime.JSX.Element;
206
+
207
+ declare const listCellVariants: (props?: ({
208
+ variant?: "default" | "disabled" | "active" | null | undefined;
209
+ size?: "sm" | "lg" | "md" | null | undefined;
210
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
211
+ interface ListCellBaseProps extends VariantProps<typeof listCellVariants> {
212
+ leading?: React$1.ReactNode;
213
+ titleNode: React$1.ReactNode;
214
+ description?: React$1.ReactNode;
215
+ trailing?: React$1.ReactNode;
216
+ divider?: boolean;
217
+ }
218
+ interface ListCellDivProps extends ListCellBaseProps, Omit<React$1.HTMLAttributes<HTMLDivElement>, "title"> {
219
+ as?: "div";
220
+ }
221
+ interface ListCellButtonProps extends ListCellBaseProps, Omit<React$1.ButtonHTMLAttributes<HTMLButtonElement>, "title"> {
222
+ as: "button";
223
+ }
224
+ interface ListCellAnchorProps extends ListCellBaseProps, Omit<React$1.AnchorHTMLAttributes<HTMLAnchorElement>, "title"> {
225
+ as: "a";
226
+ href: string;
227
+ }
228
+ type ListCellProps = ListCellDivProps | ListCellButtonProps | ListCellAnchorProps;
229
+ declare function ListCell({ className, variant, size, leading, titleNode, description, trailing, divider, as, ...props }: ListCellProps): react_jsx_runtime.JSX.Element;
230
+ declare function ListCellChevron({ className }: {
231
+ className?: string;
232
+ }): react_jsx_runtime.JSX.Element;
233
+
234
+ declare const sectionHeaderVariants: (props?: ({
235
+ layout?: "default" | "inline" | null | undefined;
236
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
237
+ interface SectionHeaderProps extends VariantProps<typeof sectionHeaderVariants> {
238
+ titleNode: React$1.ReactNode;
239
+ description?: React$1.ReactNode;
240
+ action?: React$1.ReactNode;
241
+ className?: string;
242
+ }
243
+ declare function SectionHeader({ className, layout, titleNode, description, action, }: SectionHeaderProps): react_jsx_runtime.JSX.Element;
244
+
245
+ type ThumbnailRatio = "1:1" | "4:3" | "16:9" | "3:2";
246
+ declare const ratioMap: Record<ThumbnailRatio, string>;
247
+ declare const thumbnailVariants: (props?: ({
248
+ ratio?: "1:1" | "4:3" | "16:9" | "3:2" | null | undefined;
249
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
250
+ interface ThumbnailProps extends React$1.HTMLAttributes<HTMLDivElement>, VariantProps<typeof thumbnailVariants> {
251
+ src?: string;
252
+ alt?: string;
253
+ overlay?: React$1.ReactNode;
254
+ fallback?: React$1.ReactNode;
255
+ objectFit?: "cover" | "contain";
256
+ }
257
+ declare function Thumbnail({ className, ratio, src, alt, overlay, fallback, objectFit, style, ...props }: ThumbnailProps): react_jsx_runtime.JSX.Element;
258
+
259
+ interface PlayBadgeProps {
260
+ duration?: string;
261
+ size?: "sm" | "md" | "lg";
262
+ className?: string;
263
+ }
264
+ declare function PlayBadge({ duration, size, className }: PlayBadgeProps): react_jsx_runtime.JSX.Element;
265
+
266
+ type TableProps = React$1.HTMLAttributes<HTMLTableElement>;
267
+ declare function Table({ className, ...props }: TableProps): react_jsx_runtime.JSX.Element;
268
+ declare function TableHeader({ className, ...props }: React$1.HTMLAttributes<HTMLTableSectionElement>): react_jsx_runtime.JSX.Element;
269
+ declare function TableBody({ className, ...props }: React$1.HTMLAttributes<HTMLTableSectionElement>): react_jsx_runtime.JSX.Element;
270
+ declare function TableRow({ className, ...props }: React$1.HTMLAttributes<HTMLTableRowElement>): react_jsx_runtime.JSX.Element;
271
+ declare function TableHead({ className, ...props }: React$1.ThHTMLAttributes<HTMLTableCellElement>): react_jsx_runtime.JSX.Element;
272
+ declare function TableCell({ className, ...props }: React$1.TdHTMLAttributes<HTMLTableCellElement>): react_jsx_runtime.JSX.Element;
273
+
274
+ declare const alertVariants: (props?: ({
275
+ variant?: "error" | "success" | "warning" | "info" | null | undefined;
276
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
277
+ interface AlertProps extends React$1.HTMLAttributes<HTMLDivElement>, VariantProps<typeof alertVariants> {
278
+ title?: string;
279
+ onClose?: () => void;
280
+ }
281
+ declare function Alert({ className, variant, title, children, onClose, ...props }: AlertProps): react_jsx_runtime.JSX.Element;
282
+
283
+ interface FallbackViewProps extends React$1.HTMLAttributes<HTMLDivElement> {
284
+ type?: "empty" | "error" | "search-empty" | "offline";
285
+ title?: string;
286
+ description?: string;
287
+ action?: {
288
+ label: string;
289
+ onClick: () => void;
290
+ };
291
+ }
292
+ declare function FallbackView({ className, type, title, description, action, ...props }: FallbackViewProps): react_jsx_runtime.JSX.Element;
293
+
294
+ interface PushBadgeProps extends React$1.HTMLAttributes<HTMLSpanElement> {
295
+ count?: number;
296
+ variant?: "dot" | "count" | "max";
297
+ max?: number;
298
+ }
299
+ declare function PushBadge({ className, count, variant, max, ...props }: PushBadgeProps): react_jsx_runtime.JSX.Element | null;
300
+
301
+ declare const sectionMessageVariants: (props?: ({
302
+ variant?: "error" | "success" | "warning" | "info" | null | undefined;
303
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
304
+ interface SectionMessageProps extends React$1.HTMLAttributes<HTMLDivElement>, VariantProps<typeof sectionMessageVariants> {
305
+ title?: string;
306
+ }
307
+ declare function SectionMessage({ className, variant, title, children, ...props }: SectionMessageProps): react_jsx_runtime.JSX.Element;
308
+
309
+ declare const snackbarVariants: (props?: ({
310
+ state?: "hidden" | "visible" | null | undefined;
311
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
312
+ interface SnackbarProps extends VariantProps<typeof snackbarVariants> {
313
+ message: string;
314
+ action?: {
315
+ label: string;
316
+ onClick: () => void;
317
+ };
318
+ onClose?: () => void;
319
+ duration?: number;
320
+ className?: string;
321
+ }
322
+ declare function Snackbar({ message, action, onClose, duration, className, }: SnackbarProps): react_jsx_runtime.JSX.Element;
323
+
324
+ declare const toastVariants: (props?: ({
325
+ variant?: "normal" | "positive" | "cautionary" | "negative" | null | undefined;
326
+ state?: "visible" | "entering" | "exiting" | null | undefined;
327
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
328
+ interface ToastItem {
329
+ id: string;
330
+ message: string;
331
+ variant?: "normal" | "positive" | "cautionary" | "negative";
332
+ duration?: number;
333
+ action?: {
334
+ label: string;
335
+ onClick: () => void;
336
+ };
337
+ }
338
+ interface ToastProps extends React$1.HTMLAttributes<HTMLDivElement>, VariantProps<typeof toastVariants> {
339
+ toast: ToastItem;
340
+ onClose: (id: string) => void;
341
+ index: number;
342
+ }
343
+ declare function Toast({ toast, onClose, index, className, ...props }: ToastProps): react_jsx_runtime.JSX.Element;
344
+
345
+ interface SkeletonProps extends React$1.HTMLAttributes<HTMLDivElement> {
346
+ variant?: "text" | "rectangle" | "circle" | "combined";
347
+ lines?: number;
348
+ }
349
+ declare function Skeleton({ className, variant, lines, ...props }: SkeletonProps): react_jsx_runtime.JSX.Element;
350
+
351
+ interface LoadingProps {
352
+ variant?: "spinner" | "dots" | "linear" | "circular";
353
+ size?: "sm" | "md" | "lg" | "xl";
354
+ className?: string;
355
+ value?: number;
356
+ max?: number;
357
+ }
358
+ declare function Loading({ variant, size, className, value, max, }: LoadingProps): react_jsx_runtime.JSX.Element | null;
359
+
360
+ declare const tabVariants: (props?: ({
361
+ variant?: "line" | "pill" | "segmented" | null | undefined;
362
+ size?: "sm" | "lg" | "md" | null | undefined;
363
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
364
+ interface TabItem {
365
+ key: string;
366
+ label: React$1.ReactNode;
367
+ icon?: React$1.ReactNode;
368
+ disabled?: boolean;
369
+ }
370
+ interface TabProps extends VariantProps<typeof tabVariants> {
371
+ items: TabItem[];
372
+ activeKey: string;
373
+ onChange?: (key: string) => void;
374
+ className?: string;
375
+ fullWidth?: boolean;
376
+ }
377
+ declare function Tab({ items, activeKey, onChange, variant, size, className, fullWidth, }: TabProps): react_jsx_runtime.JSX.Element;
378
+
379
+ interface BottomNavItem {
380
+ key: string;
381
+ label: string;
382
+ icon: React$1.ReactNode;
383
+ activeIcon?: React$1.ReactNode;
384
+ }
385
+ interface BottomNavigationProps {
386
+ items: BottomNavItem[];
387
+ activeKey: string;
388
+ onChange?: (key: string) => void;
389
+ className?: string;
390
+ }
391
+ declare function BottomNavigation({ items, activeKey, onChange, className, }: BottomNavigationProps): react_jsx_runtime.JSX.Element;
392
+
393
+ interface CategoryItem {
394
+ key: string;
395
+ label: string;
396
+ }
397
+ interface CategoryProps {
398
+ items: CategoryItem[];
399
+ activeKey: string;
400
+ onChange?: (key: string) => void;
401
+ className?: string;
402
+ }
403
+ declare function Category({ items, activeKey, onChange, className }: CategoryProps): react_jsx_runtime.JSX.Element;
404
+
405
+ interface PageCounterProps {
406
+ current: number;
407
+ total: number;
408
+ className?: string;
409
+ }
410
+ declare function PageCounter({ current, total, className }: PageCounterProps): react_jsx_runtime.JSX.Element;
411
+
412
+ interface PaginationProps {
413
+ page: number;
414
+ total: number;
415
+ onChange: (page: number) => void;
416
+ siblingCount?: number;
417
+ className?: string;
418
+ }
419
+ declare function Pagination({ page, total, onChange, siblingCount, className, }: PaginationProps): react_jsx_runtime.JSX.Element;
420
+
421
+ interface PaginationDotsProps {
422
+ total: number;
423
+ current: number;
424
+ onChange?: (index: number) => void;
425
+ className?: string;
426
+ }
427
+ declare function PaginationDots({ total, current, onChange, className, }: PaginationDotsProps): react_jsx_runtime.JSX.Element;
428
+
429
+ interface ProgressIndicatorProps extends React$1.HTMLAttributes<HTMLDivElement> {
430
+ value: number;
431
+ max?: number;
432
+ size?: "sm" | "md" | "lg";
433
+ variant?: "linear" | "circular";
434
+ showLabel?: boolean;
435
+ labelPosition?: "inside" | "outside";
436
+ }
437
+ declare function ProgressIndicator({ className, value, max, size, variant, showLabel, labelPosition, ...props }: ProgressIndicatorProps): react_jsx_runtime.JSX.Element;
438
+
439
+ interface TrackerStep {
440
+ key: string;
441
+ label: string;
442
+ description?: string;
443
+ }
444
+ interface ProgressTrackerProps {
445
+ steps: TrackerStep[];
446
+ currentStep: number;
447
+ orientation?: "horizontal" | "vertical";
448
+ className?: string;
449
+ }
450
+ declare function ProgressTracker({ steps, currentStep, orientation, className, }: ProgressTrackerProps): react_jsx_runtime.JSX.Element;
451
+
452
+ interface ProgressStep {
453
+ label?: React$1.ReactNode;
454
+ description?: React$1.ReactNode;
455
+ }
456
+ interface ProgressStepIndicatorProps extends React$1.HTMLAttributes<HTMLOListElement> {
457
+ /** Step definitions, or pass `count` for unlabeled dots. */
458
+ steps?: ProgressStep[];
459
+ count?: number;
460
+ /** Zero-based index of the active step. Steps before it are "completed". */
461
+ current: number;
462
+ orientation?: "horizontal" | "vertical";
463
+ size?: "sm" | "md";
464
+ }
465
+ declare const ProgressStepIndicator: React$1.ForwardRefExoticComponent<ProgressStepIndicatorProps & React$1.RefAttributes<HTMLOListElement>>;
466
+
467
+ declare const topNavVariants: (props?: ({
468
+ variant?: "default" | "transparent" | "sticky" | null | undefined;
469
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
470
+ interface TopNavigationProps extends VariantProps<typeof topNavVariants> {
471
+ leading?: React$1.ReactNode;
472
+ title?: React$1.ReactNode;
473
+ actions?: React$1.ReactNode;
474
+ className?: string;
475
+ onScrollShadow?: boolean;
476
+ }
477
+ declare function TopNavigation({ variant, leading, title, actions, className, onScrollShadow, }: TopNavigationProps): react_jsx_runtime.JSX.Element;
478
+
479
+ declare const tooltipContentVariants: (props?: ({
480
+ size?: "sm" | "md" | null | undefined;
481
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
482
+ declare const tooltipArrowVariants: (props?: ({
483
+ placement?: "left" | "right" | "bottom" | "top" | null | undefined;
484
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
485
+ interface TooltipProviderProps {
486
+ children: React$1.ReactNode;
487
+ delay?: number;
488
+ }
489
+ declare function TooltipProvider({ children, delay }: TooltipProviderProps): react_jsx_runtime.JSX.Element;
490
+ interface TooltipProps {
491
+ content: React$1.ReactNode;
492
+ children: React$1.ReactElement;
493
+ placement?: "top" | "bottom" | "left" | "right";
494
+ size?: VariantProps<typeof tooltipContentVariants>["size"];
495
+ maxWidth?: number;
496
+ disabled?: boolean;
497
+ arrow?: boolean;
498
+ }
499
+ declare function TooltipComponent({ content, children, placement, size, maxWidth, disabled, arrow, }: TooltipProps): react_jsx_runtime.JSX.Element;
500
+
501
+ declare const popoverContentVariants: (props?: ({
502
+ placement?: "left" | "right" | "bottom" | "top" | null | undefined;
503
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
504
+ declare const popoverArrowVariants: (props?: ({
505
+ placement?: "left" | "right" | "bottom" | "top" | null | undefined;
506
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
507
+ interface PopoverProps {
508
+ trigger: React$1.ReactElement;
509
+ children: React$1.ReactNode;
510
+ open?: boolean;
511
+ onOpenChange?: (open: boolean) => void;
512
+ placement?: "top" | "bottom" | "left" | "right";
513
+ arrow?: boolean;
514
+ maxWidth?: number;
515
+ className?: string;
516
+ showClose?: boolean;
517
+ title?: string;
518
+ }
519
+ declare function PopoverComponent({ trigger, children, open: controlledOpen, onOpenChange, placement, arrow, maxWidth, className, showClose, title, }: PopoverProps): react_jsx_runtime.JSX.Element;
520
+
521
+ declare const bottomSheetVariants: (props?: ({
522
+ size?: "sm" | "lg" | "md" | "full" | null | undefined;
523
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
524
+ declare const dragHandleVariants: (props?: ({
525
+ size?: "sm" | "lg" | "md" | "full" | null | undefined;
526
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
527
+ interface BottomSheetProps extends VariantProps<typeof bottomSheetVariants> {
528
+ open: boolean;
529
+ onClose: () => void;
530
+ title?: React$1.ReactNode;
531
+ children: React$1.ReactNode;
532
+ footer?: React$1.ReactNode;
533
+ showHandle?: boolean;
534
+ /** Accessible name when no string `title` is provided. */
535
+ ariaLabel?: string;
536
+ className?: string;
537
+ }
538
+ /**
539
+ * Bottom sheet built on Base UI's Dialog primitive, so it gets a real focus
540
+ * trap, focus restore, scroll lock, outside-press + Escape dismissal, portal,
541
+ * and aria-modal wiring. Drag-to-dismiss is bound to the grab handle only (the
542
+ * previous version bound drag to the whole sheet, so any mousedown inside the
543
+ * content started a drag).
544
+ */
545
+ declare function BottomSheet({ open, onClose, title, children, footer, size, showHandle, ariaLabel, className, }: BottomSheetProps): react_jsx_runtime.JSX.Element;
546
+
547
+ declare const menuContentVariants: (props?: ({
548
+ align?: "center" | "end" | "start" | null | undefined;
549
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
550
+ declare const menuItemVariants: (props?: ({
551
+ variant?: "default" | "danger" | null | undefined;
552
+ disabled?: boolean | null | undefined;
553
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
554
+ interface MenuItemDef {
555
+ key: string;
556
+ label: React$1.ReactNode;
557
+ icon?: React$1.ReactNode;
558
+ shortcut?: string;
559
+ disabled?: boolean;
560
+ divider?: boolean;
561
+ danger?: boolean;
562
+ }
563
+ interface MenuProps {
564
+ trigger: React$1.ReactElement;
565
+ items: MenuItemDef[];
566
+ onSelect?: (key: string) => void;
567
+ className?: string;
568
+ align?: "start" | "end" | "center";
569
+ }
570
+ declare function MenuComponent({ trigger, items, onSelect, className, align }: MenuProps): react_jsx_runtime.JSX.Element;
571
+
572
+ interface PopupProps {
573
+ open: boolean;
574
+ onClose: () => void;
575
+ title?: React$1.ReactNode;
576
+ description?: React$1.ReactNode;
577
+ icon?: React$1.ReactNode;
578
+ size?: "sm" | "md" | "lg";
579
+ primaryAction?: {
580
+ label: string;
581
+ onClick: () => void;
582
+ variant?: "default" | "destructive";
583
+ };
584
+ secondaryAction?: {
585
+ label: string;
586
+ onClick: () => void;
587
+ };
588
+ /** Custom body content rendered between the description and the actions. */
589
+ children?: React$1.ReactNode;
590
+ /**
591
+ * Accessible name for the dialog. Required when no `title` is provided —
592
+ * without a title or this prop the modal has no accessible name.
593
+ */
594
+ ariaLabel?: string;
595
+ className?: string;
596
+ }
597
+ /**
598
+ * Modal dialog built on Base UI's Dialog primitive, so it gets a real focus
599
+ * trap, focus restore on close, scroll lock, outside-press + Escape dismissal,
600
+ * portalling, and aria-modal / aria-labelledby / aria-describedby wiring for
601
+ * free — none of which the previous hand-rolled implementation had.
602
+ */
603
+ declare function Popup({ open, onClose, title, description, icon, size, primaryAction, secondaryAction, children, ariaLabel, className, }: PopupProps): react_jsx_runtime.JSX.Element;
604
+
605
+ interface AutocompleteOption {
606
+ value: string;
607
+ label: string;
608
+ group?: string;
609
+ }
610
+ interface AutocompleteProps {
611
+ options: AutocompleteOption[];
612
+ value?: string;
613
+ placeholder?: string;
614
+ onSelect?: (value: string) => void;
615
+ onSearch?: (query: string) => void;
616
+ loading?: boolean;
617
+ className?: string;
618
+ debounce?: number;
619
+ }
620
+ declare function Autocomplete({ options, value, placeholder, onSelect, onSearch, loading, className, debounce, }: AutocompleteProps): react_jsx_runtime.JSX.Element;
621
+
622
+ interface ScrollAreaProps extends React$1.HTMLAttributes<HTMLDivElement> {
623
+ orientation?: "vertical" | "horizontal" | "both";
624
+ scrollbarSize?: "sm" | "md";
625
+ }
626
+ declare function ScrollArea({ className, children, orientation, scrollbarSize, ...props }: ScrollAreaProps): react_jsx_runtime.JSX.Element;
627
+
628
+ declare const checkboxBoxVariants: (props?: ({
629
+ size?: "sm" | "lg" | "md" | null | undefined;
630
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
631
+ interface CheckboxProps extends Omit<React$1.ComponentProps<typeof Checkbox$1.Root>, "className">, VariantProps<typeof checkboxBoxVariants> {
632
+ label?: React$1.ReactNode;
633
+ error?: string;
634
+ className?: string;
635
+ }
636
+ declare const Checkbox: React$1.ForwardRefExoticComponent<Omit<CheckboxProps, "ref"> & React$1.RefAttributes<HTMLSpanElement>>;
637
+
638
+ declare const radioBoxVariants: (props?: ({
639
+ size?: "sm" | "lg" | "md" | null | undefined;
640
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
641
+ interface RadioProps extends Omit<React$1.ComponentProps<typeof Radio$1.Root>, "className">, VariantProps<typeof radioBoxVariants> {
642
+ label?: React$1.ReactNode;
643
+ error?: string;
644
+ className?: string;
645
+ checked?: boolean;
646
+ onCheckedChange?: (checked: boolean) => void;
647
+ }
648
+ declare const Radio: React$1.ForwardRefExoticComponent<Omit<RadioProps, "ref"> & React$1.RefAttributes<HTMLSpanElement>>;
649
+
650
+ type RadioSize = "sm" | "md" | "lg";
651
+ interface RadioGroupProps extends Omit<React$1.ComponentProps<typeof RadioGroup$1>, "className"> {
652
+ className?: string;
653
+ orientation?: "horizontal" | "vertical";
654
+ }
655
+ /**
656
+ * Proper mutually-exclusive radio group. Wrap `RadioGroupItem`s with this so a
657
+ * single value is shared across the group (unlike the standalone `Radio`, which
658
+ * manages its own isolated group).
659
+ */
660
+ declare const RadioGroup: React$1.ForwardRefExoticComponent<Omit<RadioGroupProps, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
661
+ interface RadioGroupItemProps extends Omit<React$1.ComponentProps<typeof Radio$1.Root>, "className"> {
662
+ value: NonNullable<React$1.ComponentProps<typeof Radio$1.Root>["value"]>;
663
+ label?: React$1.ReactNode;
664
+ size?: RadioSize;
665
+ className?: string;
666
+ }
667
+ declare const RadioGroupItem: React$1.ForwardRefExoticComponent<Omit<RadioGroupItemProps, "ref"> & React$1.RefAttributes<HTMLSpanElement>>;
668
+
669
+ declare const switchTrackVariants: (props?: ({
670
+ size?: "sm" | "lg" | "md" | null | undefined;
671
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
672
+ declare const switchThumbVariants: (props?: ({
673
+ size?: "sm" | "lg" | "md" | null | undefined;
674
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
675
+ interface SwitchProps extends Omit<React$1.ComponentProps<typeof Switch$1.Root>, "className">, VariantProps<typeof switchTrackVariants> {
676
+ label?: React$1.ReactNode;
677
+ className?: string;
678
+ }
679
+ declare const Switch: React$1.ForwardRefExoticComponent<Omit<SwitchProps, "ref"> & React$1.RefAttributes<HTMLSpanElement>>;
680
+
681
+ declare function Input({ className, type, ...props }: React$1.ComponentProps<"input">): react_jsx_runtime.JSX.Element;
682
+
683
+ declare const textareaVariants: (props?: ({
684
+ variant?: "default" | "error" | null | undefined;
685
+ resize?: "none" | "both" | "horizontal" | "vertical" | null | undefined;
686
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
687
+ interface TextAreaProps extends Omit<React$1.TextareaHTMLAttributes<HTMLTextAreaElement>, "className">, VariantProps<typeof textareaVariants> {
688
+ maxLength?: number;
689
+ showCount?: boolean;
690
+ label?: string;
691
+ error?: string;
692
+ helperText?: string;
693
+ autoResize?: boolean;
694
+ className?: string;
695
+ }
696
+ declare const TextArea: React$1.ForwardRefExoticComponent<TextAreaProps & React$1.RefAttributes<HTMLTextAreaElement>>;
697
+
698
+ interface SelectOption$1 {
699
+ value: string;
700
+ label: string;
701
+ disabled?: boolean;
702
+ }
703
+ interface SelectProps {
704
+ options: SelectOption$1[];
705
+ value?: string;
706
+ placeholder?: string;
707
+ onChange?: (value: string) => void;
708
+ searchable?: boolean;
709
+ disabled?: boolean;
710
+ className?: string;
711
+ label?: string;
712
+ error?: string;
713
+ }
714
+ declare function Select({ options, value, placeholder, onChange, searchable, disabled, className, label, error, }: SelectProps): react_jsx_runtime.JSX.Element;
715
+
716
+ declare const containerVariants: (props?: ({
717
+ size?: "sm" | "md" | null | undefined;
718
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
719
+ declare const itemVariants: (props?: ({
720
+ size?: "sm" | "md" | null | undefined;
721
+ active?: boolean | null | undefined;
722
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
723
+ interface SegmentedItem {
724
+ key: string;
725
+ label: React$1.ReactNode;
726
+ icon?: React$1.ReactNode;
727
+ }
728
+ interface SegmentedControlProps extends VariantProps<typeof containerVariants> {
729
+ items: SegmentedItem[];
730
+ activeKey: string;
731
+ onChange?: (key: string) => void;
732
+ className?: string;
733
+ }
734
+ declare function SegmentedControl({ items, activeKey, onChange, size, className, }: SegmentedControlProps): react_jsx_runtime.JSX.Element;
735
+
736
+ declare const searchFieldVariants: (props?: ({
737
+ size?: "sm" | "lg" | "md" | null | undefined;
738
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
739
+ interface SearchFieldProps extends Omit<React$1.InputHTMLAttributes<HTMLInputElement>, "onChange" | "size" | "className">, VariantProps<typeof searchFieldVariants> {
740
+ value: string;
741
+ onChange: (value: string) => void;
742
+ onSearch?: (value: string) => void;
743
+ loading?: boolean;
744
+ debounceMs?: number;
745
+ className?: string;
746
+ }
747
+ declare function SearchField({ value, onChange, onSearch, loading, size, className, placeholder, debounceMs, ...props }: SearchFieldProps): react_jsx_runtime.JSX.Element;
748
+
749
+ interface SliderProps {
750
+ value?: number | [number, number];
751
+ defaultValue?: number | [number, number];
752
+ min?: number;
753
+ max?: number;
754
+ step?: number;
755
+ onChange?: (value: number | [number, number]) => void;
756
+ className?: string;
757
+ disabled?: boolean;
758
+ }
759
+ declare function Slider({ value, defaultValue, min, max, step, onChange, className, disabled, }: SliderProps): react_jsx_runtime.JSX.Element;
760
+
761
+ interface FilterButtonProps {
762
+ selectedCount?: number;
763
+ onClick?: () => void;
764
+ onClear?: () => void;
765
+ className?: string;
766
+ label?: string;
767
+ }
768
+ declare function FilterButton({ selectedCount, onClick, onClear, className, label, }: FilterButtonProps): react_jsx_runtime.JSX.Element;
769
+
770
+ interface DatePickerProps {
771
+ value?: Date | null;
772
+ onChange?: (date: Date | null) => void;
773
+ min?: Date;
774
+ max?: Date;
775
+ placeholder?: string;
776
+ className?: string;
777
+ disabled?: boolean;
778
+ }
779
+ declare function DatePicker({ value, onChange, min, max, placeholder, className, disabled, }: DatePickerProps): react_jsx_runtime.JSX.Element;
780
+
781
+ interface TimePickerProps {
782
+ value?: string;
783
+ onChange?: (time: string) => void;
784
+ placeholder?: string;
785
+ className?: string;
786
+ disabled?: boolean;
787
+ }
788
+ declare function TimePicker({ value, onChange, placeholder, className, disabled, }: TimePickerProps): react_jsx_runtime.JSX.Element;
789
+
790
+ interface CheckMarkProps {
791
+ checked?: boolean;
792
+ size?: "sm" | "md" | "lg";
793
+ className?: string;
794
+ }
795
+ declare function CheckMark({ checked, size, className }: CheckMarkProps): react_jsx_runtime.JSX.Element;
796
+
797
+ declare const framedStyleVariants: (props?: ({
798
+ variant?: "default" | "error" | "success" | "warning" | "highlight" | null | undefined;
799
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
800
+ interface FramedStyleProps extends React$1.HTMLAttributes<HTMLDivElement>, VariantProps<typeof framedStyleVariants> {
801
+ }
802
+ declare function FramedStyle({ className, variant, children, ...props }: FramedStyleProps): react_jsx_runtime.JSX.Element;
803
+
804
+ interface LabelProps extends React$1.LabelHTMLAttributes<HTMLLabelElement> {
805
+ error?: string;
806
+ description?: string;
807
+ required?: boolean;
808
+ }
809
+ declare function Label({ className, children, error, description, required, ...props }: LabelProps): react_jsx_runtime.JSX.Element;
810
+
811
+ interface StepperProps {
812
+ value: number;
813
+ onChange: (value: number) => void;
814
+ min?: number;
815
+ max?: number;
816
+ step?: number;
817
+ size?: "sm" | "md";
818
+ disabled?: boolean;
819
+ className?: string;
820
+ }
821
+ declare function Stepper({ value, onChange, min, max, step, size, disabled, className, }: StepperProps): react_jsx_runtime.JSX.Element;
822
+
823
+ interface PickerActionAreaProps extends React$1.ButtonHTMLAttributes<HTMLButtonElement> {
824
+ label: string;
825
+ description?: string;
826
+ selected?: boolean;
827
+ disabled?: boolean;
828
+ }
829
+ declare function PickerActionArea({ className, label, description, selected, disabled, ...props }: PickerActionAreaProps): react_jsx_runtime.JSX.Element;
830
+
831
+ interface DateCalendarProps {
832
+ value?: Date;
833
+ onChange?: (date: Date) => void;
834
+ minDate?: Date;
835
+ maxDate?: Date;
836
+ className?: string;
837
+ }
838
+ declare function DateCalendar({ value, onChange, minDate, maxDate, className, }: DateCalendarProps): react_jsx_runtime.JSX.Element;
839
+
840
+ interface DateRange {
841
+ start?: Date;
842
+ end?: Date;
843
+ }
844
+ interface DateRangeCalendarProps {
845
+ value?: DateRange;
846
+ onChange?: (range: DateRange) => void;
847
+ className?: string;
848
+ }
849
+ declare function DateRangeCalendar({ value, onChange, className, }: DateRangeCalendarProps): react_jsx_runtime.JSX.Element;
850
+
851
+ interface DateRangePickerProps {
852
+ value?: DateRange;
853
+ onChange?: (range: DateRange) => void;
854
+ placeholder?: string;
855
+ className?: string;
856
+ disabled?: boolean;
857
+ }
858
+ declare function DateRangePicker({ value, onChange, placeholder, className, disabled, }: DateRangePickerProps): react_jsx_runtime.JSX.Element;
859
+
860
+ interface RoundCheckboxProps {
861
+ checked?: boolean;
862
+ onCheckedChange?: (checked: boolean) => void;
863
+ size?: "sm" | "md" | "lg";
864
+ disabled?: boolean;
865
+ className?: string;
866
+ ariaLabel?: string;
867
+ }
868
+ declare function RoundCheckbox({ checked, onCheckedChange, size, disabled, className, ariaLabel, }: RoundCheckboxProps): react_jsx_runtime.JSX.Element;
869
+
870
+ interface SelectOption {
871
+ value: string;
872
+ label: string;
873
+ }
874
+ interface SelectMultipleProps {
875
+ options: SelectOption[];
876
+ value: string[];
877
+ onChange: (value: string[]) => void;
878
+ placeholder?: string;
879
+ disabled?: boolean;
880
+ className?: string;
881
+ }
882
+ declare function SelectMultiple({ options, value, onChange, placeholder, disabled, className, }: SelectMultipleProps): react_jsx_runtime.JSX.Element;
883
+
884
+ interface FormContextValue {
885
+ errors: Record<string, string>;
886
+ setError: (name: string, message: string) => void;
887
+ clearError: (name: string) => void;
888
+ }
889
+ declare function useForm(): FormContextValue;
890
+ interface FormProps extends React$1.FormHTMLAttributes<HTMLFormElement> {
891
+ onSubmit?: (e: React$1.FormEvent) => void;
892
+ }
893
+ declare function Form({ className, children, onSubmit, ...props }: FormProps): react_jsx_runtime.JSX.Element;
894
+ interface FormFieldProps {
895
+ name: string;
896
+ children: React$1.ReactNode;
897
+ className?: string;
898
+ }
899
+ declare function FormField({ name, children, className }: FormFieldProps): react_jsx_runtime.JSX.Element;
900
+ interface FormSubmitProps {
901
+ children: React$1.ReactNode;
902
+ className?: string;
903
+ }
904
+ declare function FormSubmit({ children, className }: FormSubmitProps): react_jsx_runtime.JSX.Element;
905
+
906
+ interface DividerProps extends React$1.HTMLAttributes<HTMLDivElement> {
907
+ orientation?: "horizontal" | "vertical";
908
+ variant?: "solid" | "dashed" | "dotted";
909
+ label?: React$1.ReactNode;
910
+ spacing?: "sm" | "md" | "lg";
911
+ }
912
+ declare function Divider({ className, orientation, variant, label, spacing, ...props }: DividerProps): react_jsx_runtime.JSX.Element;
913
+
914
+ declare const typographyVariants: (props?: ({
915
+ variant?: "display-1" | "display-2" | "display-3" | "title-1" | "title-2" | "title-3" | "heading-1" | "heading-2" | "headline-1" | "headline-2" | "body-1" | "body-2" | "label-1" | "label-2" | "caption-1" | "caption-2" | null | undefined;
916
+ color?: "default" | "brand" | "muted" | "subtle" | "inverse" | null | undefined;
917
+ truncate?: boolean | null | undefined;
918
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
919
+ interface TypographyProps extends Omit<React$1.HTMLAttributes<HTMLElement>, "color" | "as">, VariantProps<typeof typographyVariants> {
920
+ as?: "p" | "span" | "div" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "label";
921
+ lines?: number;
922
+ }
923
+ declare function Typography({ className, variant, color, truncate, as, lines, children, ...props }: TypographyProps): react_jsx_runtime.JSX.Element;
924
+
925
+ type SpacingValue = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 8 | 10 | 12 | 16 | 20 | 24 | 32;
926
+ type RadiusValue = "none" | "sm" | "md" | "lg" | "xl" | "2xl" | "full";
927
+ interface BoxProps extends React$1.HTMLAttributes<HTMLDivElement> {
928
+ as?: React$1.ElementType;
929
+ p?: SpacingValue;
930
+ px?: SpacingValue;
931
+ py?: SpacingValue;
932
+ pt?: SpacingValue;
933
+ pr?: SpacingValue;
934
+ pb?: SpacingValue;
935
+ pl?: SpacingValue;
936
+ m?: SpacingValue;
937
+ mx?: SpacingValue;
938
+ my?: SpacingValue;
939
+ mt?: SpacingValue;
940
+ mr?: SpacingValue;
941
+ mb?: SpacingValue;
942
+ ml?: SpacingValue;
943
+ bg?: string;
944
+ border?: boolean;
945
+ borderColor?: string;
946
+ radius?: RadiusValue;
947
+ width?: string | number;
948
+ height?: string | number;
949
+ }
950
+ declare const Box: React$1.ForwardRefExoticComponent<BoxProps & React$1.RefAttributes<HTMLDivElement>>;
951
+
952
+ interface FlexBoxProps extends React$1.HTMLAttributes<HTMLDivElement> {
953
+ direction?: "row" | "column" | "row-reverse" | "column-reverse";
954
+ align?: "start" | "center" | "end" | "stretch" | "baseline";
955
+ justify?: "start" | "center" | "end" | "between" | "around" | "evenly";
956
+ gap?: 0 | 1 | 2 | 3 | 4 | 5 | 6 | 8 | 10 | 12 | 16;
957
+ wrap?: "wrap" | "nowrap" | "wrap-reverse";
958
+ center?: boolean;
959
+ column?: boolean;
960
+ grow?: number;
961
+ shrink?: number;
962
+ basis?: string | number;
963
+ }
964
+ declare const FlexBox: React$1.ForwardRefExoticComponent<FlexBoxProps & React$1.RefAttributes<HTMLDivElement>>;
965
+
966
+ type GapValue = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 8 | 10 | 12 | 16;
967
+ interface GridProps extends React$1.HTMLAttributes<HTMLDivElement> {
968
+ /** Number of equal columns, or an explicit grid-template-columns string. */
969
+ columns?: number | string;
970
+ /** Number of equal rows, or an explicit grid-template-rows string. */
971
+ rows?: number | string;
972
+ gap?: GapValue;
973
+ columnGap?: GapValue;
974
+ rowGap?: GapValue;
975
+ align?: "start" | "center" | "end" | "stretch";
976
+ justify?: "start" | "center" | "end" | "stretch" | "between" | "around" | "evenly";
977
+ inline?: boolean;
978
+ as?: React$1.ElementType;
979
+ }
980
+ declare const Grid: React$1.ForwardRefExoticComponent<GridProps & React$1.RefAttributes<HTMLDivElement>>;
981
+
982
+ interface GridItemProps extends React$1.HTMLAttributes<HTMLDivElement> {
983
+ /** Number of columns to span, or "full" to span the whole row. */
984
+ colSpan?: number | "full";
985
+ /** Number of rows to span. */
986
+ rowSpan?: number | "full";
987
+ colStart?: number;
988
+ colEnd?: number;
989
+ rowStart?: number;
990
+ rowEnd?: number;
991
+ align?: "start" | "center" | "end" | "stretch";
992
+ justify?: "start" | "center" | "end" | "stretch";
993
+ as?: React$1.ElementType;
994
+ }
995
+ declare const GridItem: React$1.ForwardRefExoticComponent<GridItemProps & React$1.RefAttributes<HTMLDivElement>>;
996
+
997
+ interface TimeViewProps extends React$1.HTMLAttributes<HTMLSpanElement> {
998
+ value: Date | string;
999
+ format?: "24h" | "12h";
1000
+ showSeconds?: boolean;
1001
+ className?: string;
1002
+ }
1003
+ declare function TimeView({ value, format, showSeconds, className, ...props }: TimeViewProps): react_jsx_runtime.JSX.Element;
1004
+
1005
+ declare const _default: {
1006
+ blue: {
1007
+ readonly 10: "#001536";
1008
+ readonly 20: "#002966";
1009
+ readonly 30: "#003E9C";
1010
+ readonly 40: "#0054D1";
1011
+ readonly 45: "#005EEB";
1012
+ readonly 50: "#0066FF";
1013
+ readonly 55: "#1A75FF";
1014
+ readonly 60: "#3385FF";
1015
+ readonly 65: "#4F95FF";
1016
+ readonly 70: "#69A5FF";
1017
+ readonly 80: "#9EC5FF";
1018
+ readonly 90: "#C9DEFE";
1019
+ readonly 95: "#EAF2FE";
1020
+ readonly 99: "#F7FBFF";
1021
+ };
1022
+ common: {
1023
+ readonly 0: "#000000";
1024
+ readonly 100: "#ffffff";
1025
+ };
1026
+ coolNeutral: {
1027
+ readonly 5: "#0F0F10";
1028
+ readonly 7: "#141415";
1029
+ readonly 10: "#171719";
1030
+ readonly 15: "#1B1C1E";
1031
+ readonly 17: "#212225";
1032
+ readonly 20: "#292A2D";
1033
+ readonly 22: "#2E2F33";
1034
+ readonly 23: "#333438";
1035
+ readonly 25: "#37383C";
1036
+ readonly 30: "#46474C";
1037
+ readonly 40: "#5A5C63";
1038
+ readonly 50: "#70737C";
1039
+ readonly 60: "#878A93";
1040
+ readonly 70: "#989BA2";
1041
+ readonly 80: "#AEB0B6";
1042
+ readonly 90: "#C2C4C8";
1043
+ readonly 95: "#DBDCDF";
1044
+ readonly 96: "#E1E2E4";
1045
+ readonly 97: "#EAEBEC";
1046
+ readonly 98: "#F4F4F5";
1047
+ readonly 99: "#F7F7F8";
1048
+ };
1049
+ cyan: {
1050
+ readonly 10: "#00252B";
1051
+ readonly 20: "#004854";
1052
+ readonly 30: "#006F82";
1053
+ readonly 40: "#0098B2";
1054
+ readonly 50: "#00BDDE";
1055
+ readonly 60: "#28D0ED";
1056
+ readonly 70: "#57DFF7";
1057
+ readonly 80: "#8AEDFF";
1058
+ readonly 90: "#B5F4FF";
1059
+ readonly 95: "#DEFAFF";
1060
+ readonly 99: "#F7FEFF";
1061
+ };
1062
+ green: {
1063
+ readonly 10: "#00240C";
1064
+ readonly 20: "#004517";
1065
+ readonly 30: "#006E25";
1066
+ readonly 40: "#009632";
1067
+ readonly 50: "#00BF40";
1068
+ readonly 60: "#1ED45A";
1069
+ readonly 70: "#49E57D";
1070
+ readonly 80: "#7DF5A5";
1071
+ readonly 90: "#ACFCC7";
1072
+ readonly 95: "#D9FFE6";
1073
+ readonly 99: "#F2FFF6";
1074
+ };
1075
+ lightBlue: {
1076
+ readonly 10: "#002130";
1077
+ readonly 20: "#004261";
1078
+ readonly 30: "#006796";
1079
+ readonly 40: "#008DCF";
1080
+ readonly 50: "#00AEFF";
1081
+ readonly 60: "#3DC2FF";
1082
+ readonly 70: "#70D2FF";
1083
+ readonly 80: "#A1E1FF";
1084
+ readonly 90: "#C4ECFE";
1085
+ readonly 95: "#E5F6FE";
1086
+ readonly 99: "#F7FDFF";
1087
+ };
1088
+ lime: {
1089
+ readonly 10: "#112900";
1090
+ readonly 20: "#225200";
1091
+ readonly 30: "#347D00";
1092
+ readonly 37: "#429E00";
1093
+ readonly 40: "#48AD00";
1094
+ readonly 50: "#58CF04";
1095
+ readonly 60: "#6BE016";
1096
+ readonly 70: "#88F03E";
1097
+ readonly 80: "#AEF779";
1098
+ readonly 90: "#CCFCA9";
1099
+ readonly 95: "#E6FFD4";
1100
+ readonly 99: "#F8FFF2";
1101
+ };
1102
+ neutral: {
1103
+ readonly 5: "#0F0F0F";
1104
+ readonly 10: "#171717";
1105
+ readonly 15: "#1C1C1C";
1106
+ readonly 20: "#2A2A2A";
1107
+ readonly 22: "#303030";
1108
+ readonly 30: "#474747";
1109
+ readonly 40: "#5C5C5C";
1110
+ readonly 50: "#737373";
1111
+ readonly 60: "#8A8A8A";
1112
+ readonly 70: "#9B9B9B";
1113
+ readonly 80: "#B0B0B0";
1114
+ readonly 90: "#C4C4C4";
1115
+ readonly 95: "#DCDCDC";
1116
+ readonly 99: "#F7F7F7";
1117
+ };
1118
+ orange: {
1119
+ readonly 10: "#361E00";
1120
+ readonly 20: "#663A00";
1121
+ readonly 30: "#9C5800";
1122
+ readonly 39: "#D17600";
1123
+ readonly 40: "#D47800";
1124
+ readonly 50: "#FF9200";
1125
+ readonly 60: "#FFA938";
1126
+ readonly 70: "#FFC06E";
1127
+ readonly 80: "#FFD49C";
1128
+ readonly 90: "#FEE6C6";
1129
+ readonly 95: "#FEF4E6";
1130
+ readonly 99: "#FFFCF7";
1131
+ };
1132
+ pink: {
1133
+ readonly 10: "#3D0133";
1134
+ readonly 20: "#730560";
1135
+ readonly 30: "#A81690";
1136
+ readonly 40: "#D331B8";
1137
+ readonly 46: "#E846CD";
1138
+ readonly 50: "#F553DA";
1139
+ readonly 60: "#FA73E3";
1140
+ readonly 70: "#FF94ED";
1141
+ readonly 80: "#FFB8F3";
1142
+ readonly 90: "#FED3F7";
1143
+ readonly 95: "#FEECFB";
1144
+ readonly 99: "#FFFAFE";
1145
+ };
1146
+ purple: {
1147
+ readonly 99: "#FEFBFF";
1148
+ readonly 95: "#F9EDFF";
1149
+ readonly 90: "#F2D6FF";
1150
+ readonly 80: "#E9BAFF";
1151
+ readonly 70: "#DE96FF";
1152
+ readonly 60: "#D478FF";
1153
+ readonly 50: "#CB59FF";
1154
+ readonly 40: "#AD36E3";
1155
+ readonly 30: "#861CB8";
1156
+ readonly 20: "#580A7D";
1157
+ readonly 10: "#290247";
1158
+ };
1159
+ red: {
1160
+ readonly 10: "#3B0101";
1161
+ readonly 20: "#730303";
1162
+ readonly 30: "#B00C0C";
1163
+ readonly 40: "#E52222";
1164
+ readonly 50: "#FF4242";
1165
+ readonly 60: "#FF6363";
1166
+ readonly 70: "#FF8C8C";
1167
+ readonly 80: "#FFB5B5";
1168
+ readonly 90: "#FED5D5";
1169
+ readonly 95: "#FEECEC";
1170
+ readonly 99: "#FFFAFA";
1171
+ };
1172
+ violet: {
1173
+ readonly 10: "#11024D";
1174
+ readonly 20: "#23098F";
1175
+ readonly 30: "#3A16C9";
1176
+ readonly 40: "#4F29E5";
1177
+ readonly 45: "#5B37ED";
1178
+ readonly 50: "#6541F2";
1179
+ readonly 60: "#7D5EF7";
1180
+ readonly 70: "#9E86FC";
1181
+ readonly 80: "#C0B0FF";
1182
+ readonly 90: "#DBD3FE";
1183
+ readonly 95: "#F0ECFE";
1184
+ readonly 99: "#FBFAFF";
1185
+ };
1186
+ redOrange: {
1187
+ readonly 10: "#290F00";
1188
+ readonly 20: "#592100";
1189
+ readonly 30: "#913500";
1190
+ readonly 40: "#C94A00";
1191
+ readonly 48: "#F55A00";
1192
+ readonly 50: "#FF5E00";
1193
+ readonly 60: "#FF7B2E";
1194
+ readonly 70: "#FF9B61";
1195
+ readonly 80: "#FFBD96";
1196
+ readonly 90: "#FED9C4";
1197
+ readonly 95: "#FEEEE5";
1198
+ readonly 99: "#FFFAF7";
1199
+ };
1200
+ };
1201
+
1202
+ declare const lightTheme: {
1203
+ atomic: typeof _default;
1204
+ semantic: {
1205
+ platform: {
1206
+ ios: {
1207
+ navigation: string;
1208
+ };
1209
+ };
1210
+ static: {
1211
+ white: "#ffffff";
1212
+ black: "#000000";
1213
+ };
1214
+ primary: {
1215
+ normal: "#0066FF";
1216
+ strong: "#005EEB";
1217
+ heavy: "#0054D1";
1218
+ };
1219
+ label: {
1220
+ normal: "#171719";
1221
+ strong: "#000000";
1222
+ neutral: string;
1223
+ alternative: string;
1224
+ assistive: string;
1225
+ disable: string;
1226
+ };
1227
+ background: {
1228
+ normal: {
1229
+ normal: "#ffffff";
1230
+ alternative: "#F7F7F8";
1231
+ };
1232
+ elevated: {
1233
+ normal: "#ffffff";
1234
+ alternative: "#F7F7F8";
1235
+ };
1236
+ transparent: {
1237
+ normal: string;
1238
+ alternative: string;
1239
+ };
1240
+ };
1241
+ interaction: {
1242
+ inactive: "#989BA2";
1243
+ disable: "#F4F4F5";
1244
+ };
1245
+ line: {
1246
+ normal: {
1247
+ normal: string;
1248
+ neutral: string;
1249
+ alternative: string;
1250
+ };
1251
+ solid: {
1252
+ normal: "#E1E2E4";
1253
+ neutral: "#EAEBEC";
1254
+ alternative: "#F4F4F5";
1255
+ };
1256
+ };
1257
+ status: {
1258
+ positive: "#00BF40";
1259
+ cautionary: "#FF9200";
1260
+ negative: "#FF4242";
1261
+ };
1262
+ accent: {
1263
+ background: {
1264
+ redOrange: "#FF5E00";
1265
+ lime: "#58CF04";
1266
+ cyan: "#00BDDE";
1267
+ lightBlue: "#00AEFF";
1268
+ violet: "#6541F2";
1269
+ purple: "#CB59FF";
1270
+ pink: "#F553DA";
1271
+ };
1272
+ foreground: {
1273
+ red: "#E52222";
1274
+ redOrange: "#F55A00";
1275
+ orange: "#D17600";
1276
+ lime: "#429E00";
1277
+ green: "#009632";
1278
+ cyan: "#0098B2";
1279
+ lightBlue: "#008DCF";
1280
+ blue: "#005EEB";
1281
+ violet: "#5B37ED";
1282
+ purple: "#AD36E3";
1283
+ pink: "#E846CD";
1284
+ };
1285
+ };
1286
+ inverse: {
1287
+ primary: "#3385FF";
1288
+ background: "#1B1C1E";
1289
+ label: "#F7F7F8";
1290
+ };
1291
+ fill: {
1292
+ normal: string;
1293
+ strong: string;
1294
+ alternative: string;
1295
+ };
1296
+ material: {
1297
+ dimmer: string;
1298
+ };
1299
+ elevation: {
1300
+ shadow: {
1301
+ normal: {
1302
+ xsmall: string;
1303
+ small: string;
1304
+ medium: string;
1305
+ large: string;
1306
+ xlarge: string;
1307
+ };
1308
+ drop: {
1309
+ xsmall: string;
1310
+ small: string;
1311
+ medium: string;
1312
+ large: string;
1313
+ xlarge: string;
1314
+ };
1315
+ spread: {
1316
+ small: string;
1317
+ medium: string;
1318
+ };
1319
+ };
1320
+ };
1321
+ };
1322
+ opacity: {
1323
+ readonly 0: 0;
1324
+ readonly 5: 0.05;
1325
+ readonly 8: 0.08;
1326
+ readonly 12: 0.12;
1327
+ readonly 16: 0.16;
1328
+ readonly 22: 0.22;
1329
+ readonly 28: 0.28;
1330
+ readonly 35: 0.35;
1331
+ readonly 43: 0.43;
1332
+ readonly 52: 0.52;
1333
+ readonly 61: 0.61;
1334
+ readonly 74: 0.74;
1335
+ readonly 88: 0.88;
1336
+ readonly 97: 0.97;
1337
+ readonly 100: 1;
1338
+ };
1339
+ breakpoint: {
1340
+ readonly xl: "1600px";
1341
+ readonly lg: "1200px";
1342
+ readonly md: "992px";
1343
+ readonly sm: "768px";
1344
+ readonly xs: "0px";
1345
+ };
1346
+ spacing: {
1347
+ readonly 0: "0px";
1348
+ readonly 0.5: "0.5px";
1349
+ readonly 1: "1px";
1350
+ readonly 2: "2px";
1351
+ readonly 4: "4px";
1352
+ readonly 6: "6px";
1353
+ readonly 8: "8px";
1354
+ readonly 10: "10px";
1355
+ readonly 12: "12px";
1356
+ readonly 14: "14px";
1357
+ readonly 16: "16px";
1358
+ readonly 20: "20px";
1359
+ readonly 24: "24px";
1360
+ readonly 32: "32px";
1361
+ readonly 40: "40px";
1362
+ readonly 48: "48px";
1363
+ readonly 56: "56px";
1364
+ readonly 64: "64px";
1365
+ readonly 72: "72px";
1366
+ readonly 80: "80px";
1367
+ };
1368
+ zIndex: {
1369
+ readonly modal: 1300;
1370
+ };
1371
+ };
1372
+ declare const darkTheme: {
1373
+ atomic: typeof _default;
1374
+ semantic: {
1375
+ platform: {
1376
+ ios: {
1377
+ navigation: string;
1378
+ };
1379
+ };
1380
+ static: {
1381
+ white: "#ffffff";
1382
+ black: "#000000";
1383
+ };
1384
+ primary: {
1385
+ normal: "#3385FF";
1386
+ strong: "#1A75FF";
1387
+ heavy: "#0066FF";
1388
+ };
1389
+ label: {
1390
+ normal: "#F7F7F8";
1391
+ strong: "#ffffff";
1392
+ neutral: string;
1393
+ alternative: string;
1394
+ assistive: string;
1395
+ disable: string;
1396
+ };
1397
+ background: {
1398
+ normal: {
1399
+ normal: "#1B1C1E";
1400
+ alternative: "#0F0F10";
1401
+ };
1402
+ elevated: {
1403
+ normal: "#212225";
1404
+ alternative: "#141415";
1405
+ };
1406
+ transparent: {
1407
+ normal: string;
1408
+ alternative: string;
1409
+ };
1410
+ };
1411
+ interaction: {
1412
+ inactive: "#5A5C63";
1413
+ disable: "#2E2F33";
1414
+ };
1415
+ line: {
1416
+ normal: {
1417
+ normal: string;
1418
+ neutral: string;
1419
+ alternative: string;
1420
+ };
1421
+ solid: {
1422
+ normal: "#37383C";
1423
+ neutral: "#333438";
1424
+ alternative: "#2E2F33";
1425
+ };
1426
+ };
1427
+ status: {
1428
+ positive: "#1ED45A";
1429
+ cautionary: "#FFA938";
1430
+ negative: "#FF6363";
1431
+ };
1432
+ accent: {
1433
+ background: {
1434
+ redOrange: "#FF7B2E";
1435
+ lime: "#6BE016";
1436
+ cyan: "#28D0ED";
1437
+ lightBlue: "#3DC2FF";
1438
+ violet: "#7D5EF7";
1439
+ purple: "#D478FF";
1440
+ pink: "#FA73E3";
1441
+ };
1442
+ foreground: {
1443
+ red: "#FF6363";
1444
+ redOrange: "#FF7B2E";
1445
+ orange: "#FF9200";
1446
+ lime: "#58CF04";
1447
+ green: "#1ED45A";
1448
+ cyan: "#00BDDE";
1449
+ lightBlue: "#00AEFF";
1450
+ blue: "#4F95FF";
1451
+ violet: "#9E86FC";
1452
+ purple: "#D478FF";
1453
+ pink: "#FA73E3";
1454
+ };
1455
+ };
1456
+ inverse: {
1457
+ primary: "#0066FF";
1458
+ background: "#ffffff";
1459
+ label: "#171719";
1460
+ };
1461
+ fill: {
1462
+ normal: string;
1463
+ strong: string;
1464
+ alternative: string;
1465
+ };
1466
+ material: {
1467
+ dimmer: string;
1468
+ };
1469
+ elevation: {
1470
+ shadow: {
1471
+ normal: {
1472
+ xsmall: string;
1473
+ small: string;
1474
+ medium: string;
1475
+ large: string;
1476
+ xlarge: string;
1477
+ };
1478
+ drop: {
1479
+ xsmall: string;
1480
+ small: string;
1481
+ medium: string;
1482
+ large: string;
1483
+ xlarge: string;
1484
+ };
1485
+ spread: {
1486
+ small: string;
1487
+ medium: string;
1488
+ };
1489
+ };
1490
+ };
1491
+ };
1492
+ opacity: {
1493
+ readonly 0: 0;
1494
+ readonly 5: 0.05;
1495
+ readonly 8: 0.08;
1496
+ readonly 12: 0.12;
1497
+ readonly 16: 0.16;
1498
+ readonly 22: 0.22;
1499
+ readonly 28: 0.28;
1500
+ readonly 35: 0.35;
1501
+ readonly 43: 0.43;
1502
+ readonly 52: 0.52;
1503
+ readonly 61: 0.61;
1504
+ readonly 74: 0.74;
1505
+ readonly 88: 0.88;
1506
+ readonly 97: 0.97;
1507
+ readonly 100: 1;
1508
+ };
1509
+ breakpoint: {
1510
+ readonly xl: "1600px";
1511
+ readonly lg: "1200px";
1512
+ readonly md: "992px";
1513
+ readonly sm: "768px";
1514
+ readonly xs: "0px";
1515
+ };
1516
+ spacing: {
1517
+ readonly 0: "0px";
1518
+ readonly 0.5: "0.5px";
1519
+ readonly 1: "1px";
1520
+ readonly 2: "2px";
1521
+ readonly 4: "4px";
1522
+ readonly 6: "6px";
1523
+ readonly 8: "8px";
1524
+ readonly 10: "10px";
1525
+ readonly 12: "12px";
1526
+ readonly 14: "14px";
1527
+ readonly 16: "16px";
1528
+ readonly 20: "20px";
1529
+ readonly 24: "24px";
1530
+ readonly 32: "32px";
1531
+ readonly 40: "40px";
1532
+ readonly 48: "48px";
1533
+ readonly 56: "56px";
1534
+ readonly 64: "64px";
1535
+ readonly 72: "72px";
1536
+ readonly 80: "80px";
1537
+ };
1538
+ zIndex: {
1539
+ readonly modal: 1300;
1540
+ };
1541
+ };
1542
+ declare const theme: {
1543
+ light: {
1544
+ atomic: typeof _default;
1545
+ semantic: {
1546
+ platform: {
1547
+ ios: {
1548
+ navigation: string;
1549
+ };
1550
+ };
1551
+ static: {
1552
+ white: "#ffffff";
1553
+ black: "#000000";
1554
+ };
1555
+ primary: {
1556
+ normal: "#0066FF";
1557
+ strong: "#005EEB";
1558
+ heavy: "#0054D1";
1559
+ };
1560
+ label: {
1561
+ normal: "#171719";
1562
+ strong: "#000000";
1563
+ neutral: string;
1564
+ alternative: string;
1565
+ assistive: string;
1566
+ disable: string;
1567
+ };
1568
+ background: {
1569
+ normal: {
1570
+ normal: "#ffffff";
1571
+ alternative: "#F7F7F8";
1572
+ };
1573
+ elevated: {
1574
+ normal: "#ffffff";
1575
+ alternative: "#F7F7F8";
1576
+ };
1577
+ transparent: {
1578
+ normal: string;
1579
+ alternative: string;
1580
+ };
1581
+ };
1582
+ interaction: {
1583
+ inactive: "#989BA2";
1584
+ disable: "#F4F4F5";
1585
+ };
1586
+ line: {
1587
+ normal: {
1588
+ normal: string;
1589
+ neutral: string;
1590
+ alternative: string;
1591
+ };
1592
+ solid: {
1593
+ normal: "#E1E2E4";
1594
+ neutral: "#EAEBEC";
1595
+ alternative: "#F4F4F5";
1596
+ };
1597
+ };
1598
+ status: {
1599
+ positive: "#00BF40";
1600
+ cautionary: "#FF9200";
1601
+ negative: "#FF4242";
1602
+ };
1603
+ accent: {
1604
+ background: {
1605
+ redOrange: "#FF5E00";
1606
+ lime: "#58CF04";
1607
+ cyan: "#00BDDE";
1608
+ lightBlue: "#00AEFF";
1609
+ violet: "#6541F2";
1610
+ purple: "#CB59FF";
1611
+ pink: "#F553DA";
1612
+ };
1613
+ foreground: {
1614
+ red: "#E52222";
1615
+ redOrange: "#F55A00";
1616
+ orange: "#D17600";
1617
+ lime: "#429E00";
1618
+ green: "#009632";
1619
+ cyan: "#0098B2";
1620
+ lightBlue: "#008DCF";
1621
+ blue: "#005EEB";
1622
+ violet: "#5B37ED";
1623
+ purple: "#AD36E3";
1624
+ pink: "#E846CD";
1625
+ };
1626
+ };
1627
+ inverse: {
1628
+ primary: "#3385FF";
1629
+ background: "#1B1C1E";
1630
+ label: "#F7F7F8";
1631
+ };
1632
+ fill: {
1633
+ normal: string;
1634
+ strong: string;
1635
+ alternative: string;
1636
+ };
1637
+ material: {
1638
+ dimmer: string;
1639
+ };
1640
+ elevation: {
1641
+ shadow: {
1642
+ normal: {
1643
+ xsmall: string;
1644
+ small: string;
1645
+ medium: string;
1646
+ large: string;
1647
+ xlarge: string;
1648
+ };
1649
+ drop: {
1650
+ xsmall: string;
1651
+ small: string;
1652
+ medium: string;
1653
+ large: string;
1654
+ xlarge: string;
1655
+ };
1656
+ spread: {
1657
+ small: string;
1658
+ medium: string;
1659
+ };
1660
+ };
1661
+ };
1662
+ };
1663
+ opacity: {
1664
+ readonly 0: 0;
1665
+ readonly 5: 0.05;
1666
+ readonly 8: 0.08;
1667
+ readonly 12: 0.12;
1668
+ readonly 16: 0.16;
1669
+ readonly 22: 0.22;
1670
+ readonly 28: 0.28;
1671
+ readonly 35: 0.35;
1672
+ readonly 43: 0.43;
1673
+ readonly 52: 0.52;
1674
+ readonly 61: 0.61;
1675
+ readonly 74: 0.74;
1676
+ readonly 88: 0.88;
1677
+ readonly 97: 0.97;
1678
+ readonly 100: 1;
1679
+ };
1680
+ breakpoint: {
1681
+ readonly xl: "1600px";
1682
+ readonly lg: "1200px";
1683
+ readonly md: "992px";
1684
+ readonly sm: "768px";
1685
+ readonly xs: "0px";
1686
+ };
1687
+ spacing: {
1688
+ readonly 0: "0px";
1689
+ readonly 0.5: "0.5px";
1690
+ readonly 1: "1px";
1691
+ readonly 2: "2px";
1692
+ readonly 4: "4px";
1693
+ readonly 6: "6px";
1694
+ readonly 8: "8px";
1695
+ readonly 10: "10px";
1696
+ readonly 12: "12px";
1697
+ readonly 14: "14px";
1698
+ readonly 16: "16px";
1699
+ readonly 20: "20px";
1700
+ readonly 24: "24px";
1701
+ readonly 32: "32px";
1702
+ readonly 40: "40px";
1703
+ readonly 48: "48px";
1704
+ readonly 56: "56px";
1705
+ readonly 64: "64px";
1706
+ readonly 72: "72px";
1707
+ readonly 80: "80px";
1708
+ };
1709
+ zIndex: {
1710
+ readonly modal: 1300;
1711
+ };
1712
+ };
1713
+ dark: {
1714
+ atomic: typeof _default;
1715
+ semantic: {
1716
+ platform: {
1717
+ ios: {
1718
+ navigation: string;
1719
+ };
1720
+ };
1721
+ static: {
1722
+ white: "#ffffff";
1723
+ black: "#000000";
1724
+ };
1725
+ primary: {
1726
+ normal: "#3385FF";
1727
+ strong: "#1A75FF";
1728
+ heavy: "#0066FF";
1729
+ };
1730
+ label: {
1731
+ normal: "#F7F7F8";
1732
+ strong: "#ffffff";
1733
+ neutral: string;
1734
+ alternative: string;
1735
+ assistive: string;
1736
+ disable: string;
1737
+ };
1738
+ background: {
1739
+ normal: {
1740
+ normal: "#1B1C1E";
1741
+ alternative: "#0F0F10";
1742
+ };
1743
+ elevated: {
1744
+ normal: "#212225";
1745
+ alternative: "#141415";
1746
+ };
1747
+ transparent: {
1748
+ normal: string;
1749
+ alternative: string;
1750
+ };
1751
+ };
1752
+ interaction: {
1753
+ inactive: "#5A5C63";
1754
+ disable: "#2E2F33";
1755
+ };
1756
+ line: {
1757
+ normal: {
1758
+ normal: string;
1759
+ neutral: string;
1760
+ alternative: string;
1761
+ };
1762
+ solid: {
1763
+ normal: "#37383C";
1764
+ neutral: "#333438";
1765
+ alternative: "#2E2F33";
1766
+ };
1767
+ };
1768
+ status: {
1769
+ positive: "#1ED45A";
1770
+ cautionary: "#FFA938";
1771
+ negative: "#FF6363";
1772
+ };
1773
+ accent: {
1774
+ background: {
1775
+ redOrange: "#FF7B2E";
1776
+ lime: "#6BE016";
1777
+ cyan: "#28D0ED";
1778
+ lightBlue: "#3DC2FF";
1779
+ violet: "#7D5EF7";
1780
+ purple: "#D478FF";
1781
+ pink: "#FA73E3";
1782
+ };
1783
+ foreground: {
1784
+ red: "#FF6363";
1785
+ redOrange: "#FF7B2E";
1786
+ orange: "#FF9200";
1787
+ lime: "#58CF04";
1788
+ green: "#1ED45A";
1789
+ cyan: "#00BDDE";
1790
+ lightBlue: "#00AEFF";
1791
+ blue: "#4F95FF";
1792
+ violet: "#9E86FC";
1793
+ purple: "#D478FF";
1794
+ pink: "#FA73E3";
1795
+ };
1796
+ };
1797
+ inverse: {
1798
+ primary: "#0066FF";
1799
+ background: "#ffffff";
1800
+ label: "#171719";
1801
+ };
1802
+ fill: {
1803
+ normal: string;
1804
+ strong: string;
1805
+ alternative: string;
1806
+ };
1807
+ material: {
1808
+ dimmer: string;
1809
+ };
1810
+ elevation: {
1811
+ shadow: {
1812
+ normal: {
1813
+ xsmall: string;
1814
+ small: string;
1815
+ medium: string;
1816
+ large: string;
1817
+ xlarge: string;
1818
+ };
1819
+ drop: {
1820
+ xsmall: string;
1821
+ small: string;
1822
+ medium: string;
1823
+ large: string;
1824
+ xlarge: string;
1825
+ };
1826
+ spread: {
1827
+ small: string;
1828
+ medium: string;
1829
+ };
1830
+ };
1831
+ };
1832
+ };
1833
+ opacity: {
1834
+ readonly 0: 0;
1835
+ readonly 5: 0.05;
1836
+ readonly 8: 0.08;
1837
+ readonly 12: 0.12;
1838
+ readonly 16: 0.16;
1839
+ readonly 22: 0.22;
1840
+ readonly 28: 0.28;
1841
+ readonly 35: 0.35;
1842
+ readonly 43: 0.43;
1843
+ readonly 52: 0.52;
1844
+ readonly 61: 0.61;
1845
+ readonly 74: 0.74;
1846
+ readonly 88: 0.88;
1847
+ readonly 97: 0.97;
1848
+ readonly 100: 1;
1849
+ };
1850
+ breakpoint: {
1851
+ readonly xl: "1600px";
1852
+ readonly lg: "1200px";
1853
+ readonly md: "992px";
1854
+ readonly sm: "768px";
1855
+ readonly xs: "0px";
1856
+ };
1857
+ spacing: {
1858
+ readonly 0: "0px";
1859
+ readonly 0.5: "0.5px";
1860
+ readonly 1: "1px";
1861
+ readonly 2: "2px";
1862
+ readonly 4: "4px";
1863
+ readonly 6: "6px";
1864
+ readonly 8: "8px";
1865
+ readonly 10: "10px";
1866
+ readonly 12: "12px";
1867
+ readonly 14: "14px";
1868
+ readonly 16: "16px";
1869
+ readonly 20: "20px";
1870
+ readonly 24: "24px";
1871
+ readonly 32: "32px";
1872
+ readonly 40: "40px";
1873
+ readonly 48: "48px";
1874
+ readonly 56: "56px";
1875
+ readonly 64: "64px";
1876
+ readonly 72: "72px";
1877
+ readonly 80: "80px";
1878
+ };
1879
+ zIndex: {
1880
+ readonly modal: 1300;
1881
+ };
1882
+ };
1883
+ };
1884
+
1885
+ type Theme = typeof lightTheme | typeof darkTheme;
1886
+ type BreakPoint = Theme['breakpoint'];
1887
+ type Spacing = Theme['spacing'];
1888
+ type MergeWithDot<T extends string> = T extends '' ? '' : `.${T}`;
1889
+ type ObjectToNestedKeys<T> = (T extends object ? {
1890
+ [K in Exclude<keyof T, symbol>]: `${K}${MergeWithDot<ObjectToNestedKeys<T[K]>>}`;
1891
+ }[Exclude<keyof T, symbol>] : '') extends infer D ? Extract<D, string> : never;
1892
+ type ThemeToken = ObjectToNestedKeys<Theme>;
1893
+ type PickThemeShadowToken<T extends string> = T extends `semantic.elevation.shadow.${infer _}` ? T : never;
1894
+ type ThemeShadowToken = PickThemeShadowToken<ObjectToNestedKeys<Pick<Theme, 'semantic'>>>;
1895
+ type ThemeColorsToken = ObjectToNestedKeys<Pick<Theme, 'atomic'>> | Exclude<ObjectToNestedKeys<Pick<Theme, 'semantic'>>, 'semantic.platform.ios.navigation' | ThemeShadowToken>;
1896
+ type ThemeOpacityToken = ObjectToNestedKeys<Pick<Theme, 'opacity'>>;
1897
+
1898
+ /**
1899
+ * Type for the `sx` prop. Emotion-free — plain React.CSSProperties.
1900
+ */
1901
+ type SxProp = React.CSSProperties;
1902
+
1903
+ declare const getColorByToken: (theme: Theme, token: ThemeColorsToken) => string;
1904
+ declare const addHexOpacity: (hex: string, value: number) => string;
1905
+
1906
+ declare const useSxProps: () => (sx: SxProp) => React$1.CSSProperties;
1907
+
1908
+ declare const useTheme: () => Theme;
1909
+
1910
+ type ThemeProviderProps = {
1911
+ theme?: 'light' | 'dark';
1912
+ children: ReactNode;
1913
+ provider?: (props: {
1914
+ theme: Theme;
1915
+ children: ReactNode;
1916
+ }) => JSX.Element;
1917
+ };
1918
+
1919
+ declare const ThemeProvider: ({ theme: localTheme, children, provider, }: ThemeProviderProps) => react_jsx_runtime.JSX.Element;
1920
+
1921
+ type ForceThemeProps = {
1922
+ theme: 'light' | 'dark';
1923
+ children?: ReactNode;
1924
+ };
1925
+
1926
+ declare const ForceTheme: {
1927
+ ({ theme: localTheme, children }: ForceThemeProps): react_jsx_runtime.JSX.Element;
1928
+ displayName: string;
1929
+ };
1930
+
1931
+ type Props = {
1932
+ styles: string | ((theme: Theme) => string);
1933
+ };
1934
+ declare const Global: ({ styles }: Props) => react_jsx_runtime.JSX.Element;
1935
+
1936
+ export { Input as $, type ActionAreaProps as A, BottomNavigation as B, Card as C, Checkbox as D, Chip as E, ContentBadge as F, type ContentBadgeProps as G, type ContentBadgeVariant as H, DateCalendar as I, DatePicker as J, DateRangeCalendar as K, DateRangePicker as L, Divider as M, FallbackView as N, FilterButton as O, FlexBox as P, ForceTheme as Q, Form as R, FormField as S, FormSubmit as T, FramedStyle as U, Global as V, Grid as W, GridItem as X, type GridItemProps as Y, type GridProps as Z, IconButton as _, Accordion as a, ThemeProvider as a$, Label as a0, List as a1, ListCard as a2, ListCell as a3, type ListCellBaseProps as a4, ListCellChevron as a5, type ListCellProps as a6, ListItem as a7, Loading as a8, MenuComponent as a9, SectionMessage as aA, SegmentedControl as aB, type SegmentedControlProps as aC, type SegmentedItem as aD, Select as aE, SelectMultiple as aF, type SelectOption$1 as aG, type SelectProps as aH, Skeleton as aI, Slider as aJ, type SliderProps as aK, Snackbar as aL, type Spacing as aM, Stepper as aN, Switch as aO, Tab as aP, Table as aQ, TableBody as aR, TableCell as aS, TableHead as aT, TableHeader as aU, TableRow as aV, TextArea as aW, TextButton as aX, type Theme as aY, type ThemeColorsToken as aZ, type ThemeOpacityToken as a_, type MenuItemDef as aa, type MenuProps as ab, PageCounter as ac, Pagination as ad, PaginationDots as ae, PickerActionArea as af, PlayBadge as ag, PopoverComponent as ah, Popup as ai, ProgressIndicator as aj, type ProgressStep as ak, ProgressStepIndicator as al, type ProgressStepIndicatorProps as am, ProgressTracker as an, PushBadge as ao, Radio as ap, RadioGroup as aq, RadioGroupItem as ar, type RadioGroupItemProps as as, type RadioGroupProps as at, RoundCheckbox as au, ScrollArea as av, SearchField as aw, type SearchFieldProps as ax, SectionHeader as ay, type SectionHeaderProps as az, AccordionContent as b, type ThemeShadowToken as b0, type ThemeToken as b1, Thumbnail as b2, type ThumbnailProps as b3, type ThumbnailRatio as b4, TimePicker as b5, TimeView as b6, Toast as b7, type ToastItem as b8, ToggleIcon as b9, menuContentVariants as bA, menuItemVariants as bB, popoverArrowVariants as bC, popoverContentVariants as bD, radioBoxVariants as bE, ratioMap as bF, searchFieldVariants as bG, sectionHeaderVariants as bH, sectionMessageVariants as bI, sizeMap as bJ, snackbarVariants as bK, switchThumbVariants as bL, switchTrackVariants as bM, tabVariants as bN, textButtonVariants as bO, textareaVariants as bP, theme as bQ, thumbnailVariants as bR, toastVariants as bS, tooltipArrowVariants as bT, tooltipContentVariants as bU, topNavVariants as bV, typographyVariants as bW, useForm as bX, useSxProps as bY, useTheme as bZ, ActionArea as b_, TooltipComponent as ba, TooltipProvider as bb, TopNavigation as bc, Typography as bd, type TypographyProps as be, addHexOpacity as bf, alertVariants as bg, avatarGroupVariants as bh, avatarVariants as bi, bottomSheetVariants as bj, buttonVariants as bk, checkboxBoxVariants as bl, chipVariants as bm, containerVariants as bn, contentBadgeVariants as bo, darkTheme as bp, dotVariants as bq, dragHandleVariants as br, framedStyleVariants as bs, getBorderRadius as bt, getColorByToken as bu, getInitials as bv, iconButtonVariants as bw, itemVariants as bx, lightTheme as by, listCellVariants as bz, AccordionItem as c, AccordionTrigger as d, Alert as e, Autocomplete as f, Avatar as g, AvatarButton as h, AvatarGroup as i, type AvatarGroupItem as j, type AvatarGroupProps as k, type AvatarProps as l, type AvatarSize as m, type AvatarStatus as n, BottomSheet as o, Box as p, type BreakPoint as q, Button as r, CardContent as s, CardDescription as t, CardFooter as u, CardHeader as v, CardList as w, CardTitle as x, Category as y, CheckMark as z };