@yuva-devlab/ui 1.4.4 → 2.0.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 +117 -33
- package/dist/components/accordion/accordion.mdx +18 -0
- package/dist/components/alert/alert.css +2 -2
- package/dist/components/alert-dialog/alert-dialog.mdx +18 -0
- package/dist/components/aspect-ratio/aspect-ratio.mdx +22 -0
- package/dist/components/breadcrumb/breadcrumb.mdx +18 -0
- package/dist/components/calendar/calendar-nav.css +111 -0
- package/dist/components/calendar/calendar.css +27 -82
- package/dist/components/calendar/calendar.mdx +18 -0
- package/dist/components/card/card.css +4 -4
- package/dist/components/carousel/carousel.css +4 -4
- package/dist/components/carousel/carousel.mdx +18 -0
- package/dist/components/chart/chart.css +86 -0
- package/dist/components/chart/chart.mdx +18 -0
- package/dist/components/checkbox/checkbox.css +11 -0
- package/dist/components/collapsible/collapsible.mdx +18 -0
- package/dist/components/command/command.css +3 -3
- package/dist/components/command/command.mdx +18 -0
- package/dist/components/confirm-dialog/confirm-dialog.mdx +18 -0
- package/dist/components/context-menu/context-menu.mdx +18 -0
- package/dist/components/copy-button/copy-button.mdx +18 -0
- package/dist/components/date-picker/date-picker.css +2 -2
- package/dist/components/date-picker/date-picker.mdx +18 -0
- package/dist/components/dialog/dialog.css +6 -6
- package/dist/components/drawer/drawer.mdx +18 -0
- package/dist/components/dropdown-menu/dropdown-menu.css +18 -0
- package/dist/components/dropdown-menu/dropdown-menu.mdx +18 -0
- package/dist/components/empty-state/empty-state.css +67 -0
- package/dist/components/empty-state/empty-state.mdx +18 -0
- package/dist/components/form/form.mdx +18 -0
- package/dist/components/hover-card/hover-card.mdx +18 -0
- package/dist/components/input-otp/input-otp.mdx +18 -0
- package/dist/components/label/label.mdx +18 -0
- package/dist/components/layout/layout.css +158 -0
- package/dist/components/layout/layout.mdx +30 -0
- package/dist/components/loading-state/loading-state.css +11 -0
- package/dist/components/loading-state/loading-state.mdx +18 -0
- package/dist/components/menubar/menubar.css +4 -4
- package/dist/components/menubar/menubar.mdx +18 -0
- package/dist/components/metric-card/metric-card.mdx +18 -0
- package/dist/components/navigation-menu/navigation-menu.css +2 -2
- package/dist/components/navigation-menu/navigation-menu.mdx +18 -0
- package/dist/components/pagination/pagination.css +8 -2
- package/dist/components/pagination/pagination.mdx +18 -0
- package/dist/components/panel/panel.mdx +18 -0
- package/dist/components/popover/popover.css +2 -2
- package/dist/components/popover/popover.mdx +18 -0
- package/dist/components/radio-group/radio-group.mdx +18 -0
- package/dist/components/resizable/resizable.mdx +18 -0
- package/dist/components/scroll-area/scroll-area.mdx +18 -0
- package/dist/components/searchable-select/searchable-select.css +26 -3
- package/dist/components/searchable-select/searchable-select.mdx +18 -0
- package/dist/components/secret-reveal-card/secret-reveal-card.css +6 -0
- package/dist/components/secret-reveal-card/secret-reveal-card.mdx +18 -0
- package/dist/components/select/select.css +16 -1
- package/dist/components/separator/separator.mdx +18 -0
- package/dist/components/sheet/sheet.css +5 -1
- package/dist/components/sheet/sheet.mdx +18 -0
- package/dist/components/sidebar/sidebar-menu.css +183 -0
- package/dist/components/sidebar/sidebar-submenu.css +69 -0
- package/dist/components/sidebar/sidebar.css +171 -4
- package/dist/components/sidebar/sidebar.mdx +18 -0
- package/dist/components/slider/slider.mdx +18 -0
- package/dist/components/status-chip/status-chip.mdx +18 -0
- package/dist/components/table/table.css +5 -3
- package/dist/components/tabs/tabs.css +3 -3
- package/dist/components/textarea/textarea.css +3 -3
- package/dist/components/textarea/textarea.mdx +18 -0
- package/dist/components/toggle/toggle.css +9 -9
- package/dist/components/toggle/toggle.mdx +18 -0
- package/dist/components/toggle-group/toggle-group.mdx +18 -0
- package/dist/components/tooltip/tooltip.mdx +18 -0
- package/dist/components/typography/heading.mdx +36 -0
- package/dist/components/typography/text.mdx +34 -0
- package/dist/components/typography/typography.css +98 -0
- package/dist/components.css +1156 -164
- package/dist/index.cjs +1206 -958
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +657 -196
- package/dist/index.d.ts +657 -196
- package/dist/index.js +1174 -948
- package/dist/index.js.map +1 -1
- package/dist/preset.css +2 -4
- package/dist/styles/components.css +1156 -164
- package/dist/styles/preset.css +2 -4
- package/dist/styles/styles.css +7 -4
- package/dist/styles/utilities.css +137 -0
- package/dist/styles.css +7 -4
- package/dist/utilities.css +137 -0
- package/package.json +5 -6
package/dist/index.d.cts
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import { ClassValue } from 'clsx';
|
|
2
|
+
export { ClassValue } from 'clsx';
|
|
2
3
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
3
4
|
import * as React$1 from 'react';
|
|
4
|
-
import React__default from 'react';
|
|
5
|
+
import React__default, { HTMLAttributes, ReactNode } from 'react';
|
|
5
6
|
import * as AccordionPrimitive from '@radix-ui/react-accordion';
|
|
6
7
|
import * as class_variance_authority_types from 'class-variance-authority/types';
|
|
7
8
|
import { VariantProps } from 'class-variance-authority';
|
|
@@ -44,11 +45,20 @@ import * as TogglePrimitive from '@radix-ui/react-toggle';
|
|
|
44
45
|
import * as ToggleGroupPrimitive from '@radix-ui/react-toggle-group';
|
|
45
46
|
|
|
46
47
|
/**
|
|
47
|
-
*
|
|
48
|
-
*
|
|
48
|
+
* Platform-native class name composer.
|
|
49
|
+
* Zero-overhead utility that joins class names and evaluates conditional expressions.
|
|
50
|
+
* Use for @layer dl-* semantic class composition.
|
|
51
|
+
*
|
|
52
|
+
* @param inputs - Class names, falsy conditionals, or arrays.
|
|
53
|
+
* @returns Clean joined class name string.
|
|
54
|
+
*/
|
|
55
|
+
declare function cx(...inputs: ClassValue[]): string;
|
|
56
|
+
/**
|
|
57
|
+
* Canonical class name helper for components.
|
|
58
|
+
* Joins class names and filters falsy values.
|
|
49
59
|
*
|
|
50
60
|
* @param inputs - List of class names, conditional records, or arrays.
|
|
51
|
-
* @returns
|
|
61
|
+
* @returns Clean joined CSS class string.
|
|
52
62
|
*/
|
|
53
63
|
declare function cn(...inputs: ClassValue[]): string;
|
|
54
64
|
|
|
@@ -143,7 +153,7 @@ interface AlertProps extends React$1.HTMLAttributes<HTMLDivElement>, VariantProp
|
|
|
143
153
|
* @example
|
|
144
154
|
* ```tsx
|
|
145
155
|
* <Alert variant="destructive">
|
|
146
|
-
* <AlertCircle
|
|
156
|
+
* <AlertCircle />
|
|
147
157
|
* <AlertTitle>Authentication Failed</AlertTitle>
|
|
148
158
|
* <AlertDescription>
|
|
149
159
|
* Your session has expired. Please log in again to continue.
|
|
@@ -375,7 +385,6 @@ interface ButtonProps extends React$1.ButtonHTMLAttributes<HTMLButtonElement>, V
|
|
|
375
385
|
}
|
|
376
386
|
/**
|
|
377
387
|
* Primary interactive button component for triggering actions, submitting forms, or navigation.
|
|
378
|
-
* Pure CSS with zero runtime Tailwind dependencies.
|
|
379
388
|
*
|
|
380
389
|
* @example
|
|
381
390
|
* ```tsx
|
|
@@ -489,6 +498,7 @@ type CarouselContextProps = {
|
|
|
489
498
|
canScrollPrev: boolean;
|
|
490
499
|
canScrollNext: boolean;
|
|
491
500
|
} & CarouselProps;
|
|
501
|
+
declare const CarouselContext: React$1.Context<CarouselContextProps | null>;
|
|
492
502
|
/**
|
|
493
503
|
* Accesses the parent Carousel context.
|
|
494
504
|
*/
|
|
@@ -500,9 +510,8 @@ declare function useCarousel(): CarouselContextProps;
|
|
|
500
510
|
* ```tsx
|
|
501
511
|
* <Carousel>
|
|
502
512
|
* <CarouselContent>
|
|
503
|
-
* <CarouselItem
|
|
504
|
-
* <CarouselItem
|
|
505
|
-
* <CarouselItem className="basis-1/3">Slide 3</CarouselItem>
|
|
513
|
+
* <CarouselItem>Slide 1</CarouselItem>
|
|
514
|
+
* <CarouselItem>Slide 2</CarouselItem>
|
|
506
515
|
* </CarouselContent>
|
|
507
516
|
* <CarouselPrevious />
|
|
508
517
|
* <CarouselNext />
|
|
@@ -510,6 +519,7 @@ declare function useCarousel(): CarouselContextProps;
|
|
|
510
519
|
* ```
|
|
511
520
|
*/
|
|
512
521
|
declare const Carousel: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLDivElement> & CarouselProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
522
|
+
|
|
513
523
|
type CarouselContentProps = React$1.HTMLAttributes<HTMLDivElement>;
|
|
514
524
|
/**
|
|
515
525
|
* Viewport and track container holding all carousel slides.
|
|
@@ -531,10 +541,14 @@ type CarouselNextProps = React$1.ComponentProps<typeof Button>;
|
|
|
531
541
|
*/
|
|
532
542
|
declare const CarouselNext: React$1.ForwardRefExoticComponent<Omit<ButtonProps & React$1.RefAttributes<HTMLButtonElement>, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
|
|
533
543
|
|
|
544
|
+
/** Theme mappings for chart color resolution. */
|
|
534
545
|
declare const THEMES: {
|
|
535
546
|
readonly light: "";
|
|
536
547
|
readonly dark: ".dark";
|
|
537
548
|
};
|
|
549
|
+
/**
|
|
550
|
+
* Configuration mapping series keys to colors, labels, and icons.
|
|
551
|
+
*/
|
|
538
552
|
type ChartConfig = {
|
|
539
553
|
[k in string]: {
|
|
540
554
|
label?: React$1.ReactNode;
|
|
@@ -547,35 +561,55 @@ type ChartConfig = {
|
|
|
547
561
|
theme: Record<keyof typeof THEMES, string>;
|
|
548
562
|
});
|
|
549
563
|
};
|
|
564
|
+
type ChartContextProps = {
|
|
565
|
+
config: ChartConfig;
|
|
566
|
+
};
|
|
567
|
+
declare const ChartContext: React$1.Context<ChartContextProps | null>;
|
|
568
|
+
/**
|
|
569
|
+
* Accesses active chart series configuration from parent `<ChartContainer />`.
|
|
570
|
+
*/
|
|
571
|
+
declare function useChart(): ChartContextProps;
|
|
572
|
+
/**
|
|
573
|
+
* Helper to extract item config from a Recharts payload.
|
|
574
|
+
*/
|
|
575
|
+
declare function getPayloadConfigFromPayload(config: ChartConfig, payload: unknown, key: string): ({
|
|
576
|
+
label?: React$1.ReactNode;
|
|
577
|
+
icon?: React$1.ComponentType;
|
|
578
|
+
} & ({
|
|
579
|
+
color?: string;
|
|
580
|
+
theme?: never;
|
|
581
|
+
} | {
|
|
582
|
+
color?: never;
|
|
583
|
+
theme: Record<keyof typeof THEMES, string>;
|
|
584
|
+
})) | undefined;
|
|
585
|
+
|
|
550
586
|
type ChartContainerProps = React$1.ComponentProps<"div"> & {
|
|
551
587
|
/** Configuration mapping series keys to colors, labels, and icons */
|
|
552
588
|
config: ChartConfig;
|
|
553
589
|
/** Responsive chart content (Recharts element) */
|
|
554
590
|
children: React$1.ComponentProps<typeof RechartsPrimitive.ResponsiveContainer>["children"];
|
|
555
591
|
};
|
|
592
|
+
/**
|
|
593
|
+
* Dynamic style block injecting CSS custom properties for chart color keys.
|
|
594
|
+
*/
|
|
595
|
+
declare const ChartStyle: ({ id, config, }: {
|
|
596
|
+
id: string;
|
|
597
|
+
config: ChartConfig;
|
|
598
|
+
}) => react_jsx_runtime.JSX.Element | null;
|
|
556
599
|
/**
|
|
557
600
|
* Responsive wrapper for Recharts visualizations with CSS variable theming and unified legend/tooltip support.
|
|
558
601
|
*
|
|
559
602
|
* @example
|
|
560
603
|
* ```tsx
|
|
561
|
-
* const chartConfig = {
|
|
562
|
-
* desktop: { label: "Desktop", color: "var(--color-primary)" },
|
|
563
|
-
* mobile: { label: "Mobile", color: "var(--color-muted)" },
|
|
564
|
-
* } satisfies ChartConfig;
|
|
565
|
-
*
|
|
566
604
|
* <ChartContainer config={chartConfig} className="min-h-[200px] w-full">
|
|
567
605
|
* <BarChart data={chartData}>
|
|
568
606
|
* <Bar dataKey="desktop" fill="var(--color-desktop)" radius={4} />
|
|
569
|
-
* <Bar dataKey="mobile" fill="var(--color-mobile)" radius={4} />
|
|
570
607
|
* </BarChart>
|
|
571
608
|
* </ChartContainer>
|
|
572
609
|
* ```
|
|
573
610
|
*/
|
|
574
611
|
declare const ChartContainer: React$1.ForwardRefExoticComponent<Omit<ChartContainerProps, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
|
|
575
|
-
|
|
576
|
-
id: string;
|
|
577
|
-
config: ChartConfig;
|
|
578
|
-
}) => react_jsx_runtime.JSX.Element | null;
|
|
612
|
+
|
|
579
613
|
/**
|
|
580
614
|
* Tooltip trigger component from Recharts.
|
|
581
615
|
*/
|
|
@@ -596,6 +630,7 @@ type ChartTooltipContentProps = React$1.ComponentProps<typeof RechartsPrimitive.
|
|
|
596
630
|
* Standard content container rendered inside a `ChartTooltip`.
|
|
597
631
|
*/
|
|
598
632
|
declare const ChartTooltipContent: React$1.ForwardRefExoticComponent<Omit<ChartTooltipContentProps, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
|
|
633
|
+
|
|
599
634
|
/**
|
|
600
635
|
* Legend component from Recharts.
|
|
601
636
|
*/
|
|
@@ -615,15 +650,14 @@ type CheckboxProps = React$1.ComponentPropsWithoutRef<typeof CheckboxPrimitive.R
|
|
|
615
650
|
/**
|
|
616
651
|
* Accessible binary selection control built upon Radix UI Checkbox.
|
|
617
652
|
* Supports checked, unchecked, and indeterminate states with smooth micro-animations.
|
|
618
|
-
* Pure CSS with zero runtime Tailwind dependencies.
|
|
619
653
|
*
|
|
620
654
|
* @example
|
|
621
655
|
* ```tsx
|
|
622
656
|
* // Basic checkbox with associated label
|
|
623
|
-
* <
|
|
657
|
+
* <Flex align="center" gap="2">
|
|
624
658
|
* <Checkbox id="terms" checked={agreed} onCheckedChange={setAgreed} />
|
|
625
659
|
* <Label htmlFor="terms">Accept terms and conditions</Label>
|
|
626
|
-
* </
|
|
660
|
+
* </Flex>
|
|
627
661
|
*
|
|
628
662
|
* // Disabled checkbox
|
|
629
663
|
* <Checkbox disabled checked />
|
|
@@ -839,20 +873,6 @@ declare function ConfirmDialog({ open, onOpenChange, title, description, onConfi
|
|
|
839
873
|
|
|
840
874
|
/**
|
|
841
875
|
* Root ContextMenu container.
|
|
842
|
-
*
|
|
843
|
-
* @example
|
|
844
|
-
* ```tsx
|
|
845
|
-
* <ContextMenu>
|
|
846
|
-
* <ContextMenuTrigger className="flex h-[150px] w-[300px] items-center justify-center rounded-md border border-dashed text-sm">
|
|
847
|
-
* Right click here
|
|
848
|
-
* </ContextMenuTrigger>
|
|
849
|
-
* <ContextMenuContent>
|
|
850
|
-
* <ContextMenuItem>Back</ContextMenuItem>
|
|
851
|
-
* <ContextMenuItem>Forward</ContextMenuItem>
|
|
852
|
-
* <ContextMenuItem>Reload</ContextMenuItem>
|
|
853
|
-
* </ContextMenuContent>
|
|
854
|
-
* </ContextMenu>
|
|
855
|
-
* ```
|
|
856
876
|
*/
|
|
857
877
|
declare const ContextMenu: React$1.FC<ContextMenuPrimitive.ContextMenuProps>;
|
|
858
878
|
/**
|
|
@@ -894,6 +914,7 @@ type ContextMenuContentProps = React$1.ComponentPropsWithoutRef<typeof ContextMe
|
|
|
894
914
|
* Floating content panel containing context menu items.
|
|
895
915
|
*/
|
|
896
916
|
declare const ContextMenuContent: React$1.ForwardRefExoticComponent<Omit<ContextMenuPrimitive.ContextMenuContentProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
|
|
917
|
+
|
|
897
918
|
type ContextMenuItemProps = React$1.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.Item> & {
|
|
898
919
|
inset?: boolean;
|
|
899
920
|
};
|
|
@@ -963,7 +984,6 @@ interface DatePickerProps {
|
|
|
963
984
|
/**
|
|
964
985
|
* Accessible date picker component featuring an interactive popover calendar.
|
|
965
986
|
* Formats dates safely in local timezone to prevent UTC day-shifting.
|
|
966
|
-
* Pure CSS with zero runtime Tailwind dependencies.
|
|
967
987
|
*
|
|
968
988
|
* @example
|
|
969
989
|
* ```tsx
|
|
@@ -1085,23 +1105,6 @@ declare const DrawerDescription: React$1.ForwardRefExoticComponent<Omit<DialogPr
|
|
|
1085
1105
|
|
|
1086
1106
|
/**
|
|
1087
1107
|
* Root DropdownMenu container managing open/closed state.
|
|
1088
|
-
*
|
|
1089
|
-
* @example
|
|
1090
|
-
* ```tsx
|
|
1091
|
-
* <DropdownMenu>
|
|
1092
|
-
* <DropdownMenuTrigger asChild>
|
|
1093
|
-
* <Button variant="outline">Open Menu</Button>
|
|
1094
|
-
* </DropdownMenuTrigger>
|
|
1095
|
-
* <DropdownMenuContent>
|
|
1096
|
-
* <DropdownMenuLabel>My Account</DropdownMenuLabel>
|
|
1097
|
-
* <DropdownMenuSeparator />
|
|
1098
|
-
* <DropdownMenuItem>Profile</DropdownMenuItem>
|
|
1099
|
-
* <DropdownMenuItem>Settings</DropdownMenuItem>
|
|
1100
|
-
* <DropdownMenuSeparator />
|
|
1101
|
-
* <DropdownMenuItem>Logout</DropdownMenuItem>
|
|
1102
|
-
* </DropdownMenuContent>
|
|
1103
|
-
* </DropdownMenu>
|
|
1104
|
-
* ```
|
|
1105
1108
|
*/
|
|
1106
1109
|
declare const DropdownMenu: React$1.FC<DropdownMenuPrimitive.DropdownMenuProps>;
|
|
1107
1110
|
/**
|
|
@@ -1143,6 +1146,7 @@ type DropdownMenuContentProps = React$1.ComponentPropsWithoutRef<typeof Dropdown
|
|
|
1143
1146
|
* Floating content panel containing dropdown menu items.
|
|
1144
1147
|
*/
|
|
1145
1148
|
declare const DropdownMenuContent: React$1.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuContentProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
|
|
1149
|
+
|
|
1146
1150
|
type DropdownMenuItemProps = React$1.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Item> & {
|
|
1147
1151
|
inset?: boolean;
|
|
1148
1152
|
};
|
|
@@ -1185,6 +1189,37 @@ declare const DropdownMenuShortcut: {
|
|
|
1185
1189
|
displayName: string;
|
|
1186
1190
|
};
|
|
1187
1191
|
|
|
1192
|
+
/**
|
|
1193
|
+
* Properties for configuring the {@link EmptyState} component.
|
|
1194
|
+
*/
|
|
1195
|
+
interface EmptyStateProps extends Omit<React$1.HTMLAttributes<HTMLDivElement>, "title"> {
|
|
1196
|
+
/** Primary headline or title text */
|
|
1197
|
+
readonly title: React$1.ReactNode;
|
|
1198
|
+
/** Secondary explanatory description */
|
|
1199
|
+
readonly description?: React$1.ReactNode;
|
|
1200
|
+
/** Optional visual icon displayed in the central badge */
|
|
1201
|
+
readonly icon?: React$1.ReactNode;
|
|
1202
|
+
/** Primary action button or trigger node */
|
|
1203
|
+
readonly action?: React$1.ReactNode;
|
|
1204
|
+
/** Custom children rendered beneath the description */
|
|
1205
|
+
readonly children?: React$1.ReactNode;
|
|
1206
|
+
}
|
|
1207
|
+
/**
|
|
1208
|
+
* Universal EmptyState component displaying cybernetic or theme-adaptive placeholders
|
|
1209
|
+
* when queries, tables, or collections yield zero entries.
|
|
1210
|
+
*
|
|
1211
|
+
* @example
|
|
1212
|
+
* ```tsx
|
|
1213
|
+
* <EmptyState
|
|
1214
|
+
* icon={<Search />}
|
|
1215
|
+
* title="No results found"
|
|
1216
|
+
* description="Try adjusting your filters or search keywords."
|
|
1217
|
+
* action={<Button variant="outline">Reset filters</Button>}
|
|
1218
|
+
* />
|
|
1219
|
+
* ```
|
|
1220
|
+
*/
|
|
1221
|
+
declare const EmptyState: React$1.ForwardRefExoticComponent<EmptyStateProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
1222
|
+
|
|
1188
1223
|
/**
|
|
1189
1224
|
* Top-level form provider component wrapping react-hook-form.
|
|
1190
1225
|
*/
|
|
@@ -1250,7 +1285,6 @@ interface InputProps extends React$1.InputHTMLAttributes<HTMLInputElement> {
|
|
|
1250
1285
|
/**
|
|
1251
1286
|
* Textual input control styled with design system tokens and scoped CSS.
|
|
1252
1287
|
* Provides accessible focus states, logical padding, and seamless icon integration.
|
|
1253
|
-
* Zero Tailwind runtime dependencies.
|
|
1254
1288
|
*
|
|
1255
1289
|
* @example
|
|
1256
1290
|
* ```tsx
|
|
@@ -1261,7 +1295,7 @@ interface InputProps extends React$1.InputHTMLAttributes<HTMLInputElement> {
|
|
|
1261
1295
|
* <Input
|
|
1262
1296
|
* type="search"
|
|
1263
1297
|
* placeholder="Search agents..."
|
|
1264
|
-
* startIcon={<Search
|
|
1298
|
+
* startIcon={<Search />}
|
|
1265
1299
|
* />
|
|
1266
1300
|
*
|
|
1267
1301
|
* // Password field with end visibility action
|
|
@@ -1282,7 +1316,6 @@ type InputOTPProps = React$1.ComponentPropsWithoutRef<typeof OTPInput>;
|
|
|
1282
1316
|
/**
|
|
1283
1317
|
* Accessible One-Time Password (OTP) input component with pin slots and fake carets.
|
|
1284
1318
|
* Built upon the `input-otp` primitive with scoped token styling.
|
|
1285
|
-
* Zero Tailwind runtime dependencies.
|
|
1286
1319
|
*
|
|
1287
1320
|
* @example
|
|
1288
1321
|
* ```tsx
|
|
@@ -1325,15 +1358,14 @@ interface LabelProps extends React$1.ComponentPropsWithoutRef<typeof LabelPrimit
|
|
|
1325
1358
|
/**
|
|
1326
1359
|
* Accessible label component associated with input controls, checkboxes, or form fields.
|
|
1327
1360
|
* Built upon Radix UI Label primitive with design token typography and disabled styling.
|
|
1328
|
-
* Zero Tailwind runtime dependencies.
|
|
1329
1361
|
*
|
|
1330
1362
|
* @example
|
|
1331
1363
|
* ```tsx
|
|
1332
1364
|
* // Associated with an Input via htmlFor
|
|
1333
|
-
* <
|
|
1365
|
+
* <Stack gap="2">
|
|
1334
1366
|
* <Label htmlFor="email">Email address</Label>
|
|
1335
1367
|
* <Input id="email" type="email" placeholder="name@company.com" />
|
|
1336
|
-
* </
|
|
1368
|
+
* </Stack>
|
|
1337
1369
|
* ```
|
|
1338
1370
|
*/
|
|
1339
1371
|
declare const Label: React$1.ForwardRefExoticComponent<LabelProps & React$1.RefAttributes<HTMLLabelElement>>;
|
|
@@ -1422,6 +1454,7 @@ type MenubarContentProps = React$1.ComponentPropsWithoutRef<typeof MenubarPrimit
|
|
|
1422
1454
|
* Floating panel displaying items under a top-level `MenubarTrigger`.
|
|
1423
1455
|
*/
|
|
1424
1456
|
declare const MenubarContent: React$1.ForwardRefExoticComponent<Omit<MenubarPrimitive.MenubarContentProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
|
|
1457
|
+
|
|
1425
1458
|
type MenubarItemProps = React$1.ComponentPropsWithoutRef<typeof MenubarPrimitive.Item> & {
|
|
1426
1459
|
inset?: boolean;
|
|
1427
1460
|
};
|
|
@@ -1475,7 +1508,7 @@ type NavigationMenuProps = React$1.ComponentPropsWithoutRef<typeof NavigationMen
|
|
|
1475
1508
|
* <NavigationMenuItem>
|
|
1476
1509
|
* <NavigationMenuTrigger>Getting Started</NavigationMenuTrigger>
|
|
1477
1510
|
* <NavigationMenuContent>
|
|
1478
|
-
* <ul
|
|
1511
|
+
* <ul>
|
|
1479
1512
|
* <li><a href="/intro">Introduction</a></li>
|
|
1480
1513
|
* <li><a href="/install">Installation</a></li>
|
|
1481
1514
|
* </ul>
|
|
@@ -1628,11 +1661,11 @@ declare const Panel: React$1.ForwardRefExoticComponent<PanelProps & React$1.RefA
|
|
|
1628
1661
|
* <PopoverTrigger asChild>
|
|
1629
1662
|
* <Button variant="outline">Open Filters</Button>
|
|
1630
1663
|
* </PopoverTrigger>
|
|
1631
|
-
* <PopoverContent align="start"
|
|
1632
|
-
* <
|
|
1633
|
-
* <h4
|
|
1634
|
-
* <p
|
|
1635
|
-
* </
|
|
1664
|
+
* <PopoverContent align="start">
|
|
1665
|
+
* <Stack gap="2">
|
|
1666
|
+
* <h4>Filter Results</h4>
|
|
1667
|
+
* <p>Adjust display criteria.</p>
|
|
1668
|
+
* </Stack>
|
|
1636
1669
|
* </PopoverContent>
|
|
1637
1670
|
* </Popover>
|
|
1638
1671
|
* ```
|
|
@@ -1667,14 +1700,14 @@ type RadioGroupProps = React$1.ComponentPropsWithoutRef<typeof RadioGroupPrimiti
|
|
|
1667
1700
|
* @example
|
|
1668
1701
|
* ```tsx
|
|
1669
1702
|
* <RadioGroup defaultValue="monthly" onValueChange={setBillingCycle}>
|
|
1670
|
-
* <
|
|
1703
|
+
* <Flex align="center" gap="2">
|
|
1671
1704
|
* <RadioGroupItem value="monthly" id="r1" />
|
|
1672
1705
|
* <Label htmlFor="r1">Monthly Billing</Label>
|
|
1673
|
-
* </
|
|
1674
|
-
* <
|
|
1706
|
+
* </Flex>
|
|
1707
|
+
* <Flex align="center" gap="2">
|
|
1675
1708
|
* <RadioGroupItem value="annual" id="r2" />
|
|
1676
1709
|
* <Label htmlFor="r2">Annual Billing (Save 20%)</Label>
|
|
1677
|
-
* </
|
|
1710
|
+
* </Flex>
|
|
1678
1711
|
* </RadioGroup>
|
|
1679
1712
|
* ```
|
|
1680
1713
|
*/
|
|
@@ -1691,7 +1724,7 @@ type ResizablePanelGroupProps = React$1.ComponentProps<typeof Group>;
|
|
|
1691
1724
|
*
|
|
1692
1725
|
* @example
|
|
1693
1726
|
* ```tsx
|
|
1694
|
-
* <ResizablePanelGroup
|
|
1727
|
+
* <ResizablePanelGroup orientation="horizontal">
|
|
1695
1728
|
* <ResizablePanel defaultSize={50}>Left Content</ResizablePanel>
|
|
1696
1729
|
* <ResizableHandle withHandle />
|
|
1697
1730
|
* <ResizablePanel defaultSize={50}>Right Content</ResizablePanel>
|
|
@@ -1719,12 +1752,12 @@ type ScrollAreaProps = React$1.ComponentPropsWithoutRef<typeof ScrollAreaPrimiti
|
|
|
1719
1752
|
*
|
|
1720
1753
|
* @example
|
|
1721
1754
|
* ```tsx
|
|
1722
|
-
* <ScrollArea
|
|
1723
|
-
* <
|
|
1755
|
+
* <ScrollArea>
|
|
1756
|
+
* <Box p="4">
|
|
1724
1757
|
* {items.map((item) => (
|
|
1725
1758
|
* <div key={item.id}>{item.name}</div>
|
|
1726
1759
|
* ))}
|
|
1727
|
-
* </
|
|
1760
|
+
* </Box>
|
|
1728
1761
|
* </ScrollArea>
|
|
1729
1762
|
* ```
|
|
1730
1763
|
*/
|
|
@@ -1773,6 +1806,7 @@ interface SearchableSelectProps {
|
|
|
1773
1806
|
/** Unique HTML id attribute */
|
|
1774
1807
|
id?: string;
|
|
1775
1808
|
}
|
|
1809
|
+
|
|
1776
1810
|
/**
|
|
1777
1811
|
* Searchable select component with live filtering, keyboard navigation, option grouping,
|
|
1778
1812
|
* and optional creation of new entries.
|
|
@@ -1843,14 +1877,14 @@ type SeparatorProps = React$1.ComponentPropsWithoutRef<typeof SeparatorPrimitive
|
|
|
1843
1877
|
* @example
|
|
1844
1878
|
* ```tsx
|
|
1845
1879
|
* <div>
|
|
1846
|
-
* <h4>
|
|
1847
|
-
* <p>An
|
|
1848
|
-
* <Separator
|
|
1849
|
-
* <
|
|
1880
|
+
* <h4>Primitives</h4>
|
|
1881
|
+
* <p>An enterprise UI component library.</p>
|
|
1882
|
+
* <Separator />
|
|
1883
|
+
* <Flex align="center" gap="4">
|
|
1850
1884
|
* <div>Blog</div>
|
|
1851
1885
|
* <Separator orientation="vertical" />
|
|
1852
1886
|
* <div>Docs</div>
|
|
1853
|
-
* </
|
|
1887
|
+
* </Flex>
|
|
1854
1888
|
* </div>
|
|
1855
1889
|
* ```
|
|
1856
1890
|
*/
|
|
@@ -1871,7 +1905,7 @@ declare const Separator: React$1.ForwardRefExoticComponent<Omit<SeparatorPrimiti
|
|
|
1871
1905
|
* <SheetTitle>Navigation Menu</SheetTitle>
|
|
1872
1906
|
* <SheetDescription>Explore workspace features.</SheetDescription>
|
|
1873
1907
|
* </SheetHeader>
|
|
1874
|
-
* <
|
|
1908
|
+
* <Box py="4">Sheet navigation links...</Box>
|
|
1875
1909
|
* </SheetContent>
|
|
1876
1910
|
* </Sheet>
|
|
1877
1911
|
* ```
|
|
@@ -1911,37 +1945,15 @@ declare const SheetTitle: React$1.ForwardRefExoticComponent<Omit<DialogPrimitive
|
|
|
1911
1945
|
/** Accessible explanatory text for the sheet panel. */
|
|
1912
1946
|
declare const SheetDescription: React$1.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogDescriptionProps & React$1.RefAttributes<HTMLParagraphElement>, "ref"> & React$1.RefAttributes<HTMLParagraphElement>>;
|
|
1913
1947
|
|
|
1914
|
-
|
|
1915
|
-
declare const
|
|
1916
|
-
|
|
1917
|
-
|
|
1918
|
-
|
|
1919
|
-
|
|
1920
|
-
* @example
|
|
1921
|
-
* ```tsx
|
|
1922
|
-
* <TooltipProvider>
|
|
1923
|
-
* <Tooltip>
|
|
1924
|
-
* <TooltipTrigger asChild>
|
|
1925
|
-
* <Button variant="ghost" size="icon">
|
|
1926
|
-
* <Info />
|
|
1927
|
-
* </Button>
|
|
1928
|
-
* </TooltipTrigger>
|
|
1929
|
-
* <TooltipContent side="top">
|
|
1930
|
-
* <p>Display telemetry details</p>
|
|
1931
|
-
* </TooltipContent>
|
|
1932
|
-
* </Tooltip>
|
|
1933
|
-
* </TooltipProvider>
|
|
1934
|
-
* ```
|
|
1935
|
-
*/
|
|
1936
|
-
declare const Tooltip: React$1.FC<TooltipPrimitive.TooltipProps>;
|
|
1937
|
-
/** Trigger element that displays the tooltip on hover or keyboard focus. */
|
|
1938
|
-
declare const TooltipTrigger: React$1.ForwardRefExoticComponent<TooltipPrimitive.TooltipTriggerProps & React$1.RefAttributes<HTMLButtonElement>>;
|
|
1939
|
-
type TooltipContentProps = React$1.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content>;
|
|
1948
|
+
declare const SIDEBAR_COOKIE_NAME = "sidebar_state";
|
|
1949
|
+
declare const SIDEBAR_COOKIE_MAX_AGE: number;
|
|
1950
|
+
declare const SIDEBAR_WIDTH = "16rem";
|
|
1951
|
+
declare const SIDEBAR_WIDTH_MOBILE = "18rem";
|
|
1952
|
+
declare const SIDEBAR_WIDTH_ICON = "3rem";
|
|
1953
|
+
declare const SIDEBAR_KEYBOARD_SHORTCUT = "b";
|
|
1940
1954
|
/**
|
|
1941
|
-
*
|
|
1955
|
+
* Shape of the context provided by `SidebarProvider`.
|
|
1942
1956
|
*/
|
|
1943
|
-
declare const TooltipContent: React$1.ForwardRefExoticComponent<Omit<TooltipPrimitive.TooltipContentProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
|
|
1944
|
-
|
|
1945
1957
|
type SidebarContextProps = {
|
|
1946
1958
|
state: "expanded" | "collapsed";
|
|
1947
1959
|
open: boolean;
|
|
@@ -1951,10 +1963,16 @@ type SidebarContextProps = {
|
|
|
1951
1963
|
isMobile: boolean;
|
|
1952
1964
|
toggleSidebar: () => void;
|
|
1953
1965
|
};
|
|
1966
|
+
declare const SidebarContext: React$1.Context<SidebarContextProps | null>;
|
|
1954
1967
|
/**
|
|
1955
1968
|
* Hook to access the parent Sidebar context state and controls.
|
|
1969
|
+
*
|
|
1970
|
+
* @throws Error if used outside of `SidebarProvider`.
|
|
1956
1971
|
*/
|
|
1957
1972
|
declare function useSidebar(): SidebarContextProps;
|
|
1973
|
+
/**
|
|
1974
|
+
* Props for `SidebarProvider`.
|
|
1975
|
+
*/
|
|
1958
1976
|
type SidebarProviderProps = React$1.ComponentProps<"div"> & {
|
|
1959
1977
|
/** Initial open state in uncontrolled mode (default: true) */
|
|
1960
1978
|
defaultOpen?: boolean;
|
|
@@ -1969,81 +1987,51 @@ type SidebarProviderProps = React$1.ComponentProps<"div"> & {
|
|
|
1969
1987
|
* @example
|
|
1970
1988
|
* ```tsx
|
|
1971
1989
|
* <SidebarProvider>
|
|
1972
|
-
* <Sidebar>
|
|
1973
|
-
*
|
|
1974
|
-
* <SidebarContent>
|
|
1975
|
-
* <SidebarMenu>
|
|
1976
|
-
* <SidebarMenuItem>
|
|
1977
|
-
* <SidebarMenuButton>Dashboard</SidebarMenuButton>
|
|
1978
|
-
* </SidebarMenuItem>
|
|
1979
|
-
* </SidebarMenu>
|
|
1980
|
-
* </SidebarContent>
|
|
1981
|
-
* </Sidebar>
|
|
1982
|
-
* <SidebarInset>
|
|
1983
|
-
* <header><SidebarTrigger /></header>
|
|
1984
|
-
* <main>Main Page Content</main>
|
|
1985
|
-
* </SidebarInset>
|
|
1990
|
+
* <Sidebar>...</Sidebar>
|
|
1991
|
+
* <SidebarInset>...</SidebarInset>
|
|
1986
1992
|
* </SidebarProvider>
|
|
1987
1993
|
* ```
|
|
1988
1994
|
*/
|
|
1989
1995
|
declare const SidebarProvider: React$1.ForwardRefExoticComponent<Omit<SidebarProviderProps, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
|
|
1996
|
+
|
|
1997
|
+
/** Props for `Sidebar`. */
|
|
1990
1998
|
type SidebarProps = React$1.ComponentProps<"div"> & {
|
|
1991
|
-
/** Side where the sidebar is positioned (default: "left") */
|
|
1992
1999
|
side?: "left" | "right";
|
|
1993
|
-
/** Sidebar variant style (default: "sidebar") */
|
|
1994
2000
|
variant?: "sidebar" | "floating" | "inset";
|
|
1995
|
-
/** Collapse behavior when toggled (default: "offcanvas") */
|
|
1996
2001
|
collapsible?: "offcanvas" | "icon" | "none";
|
|
1997
2002
|
};
|
|
1998
2003
|
/**
|
|
1999
2004
|
* Main collapsible navigation sidebar supporting floating, inset, desktop, and mobile sheet views.
|
|
2000
2005
|
*/
|
|
2001
2006
|
declare const Sidebar: React$1.ForwardRefExoticComponent<Omit<SidebarProps, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
|
|
2002
|
-
|
|
2003
|
-
/**
|
|
2004
|
-
* Button trigger toggling sidebar collapsed/expanded state.
|
|
2005
|
-
*/
|
|
2006
|
-
declare const SidebarTrigger: React$1.ForwardRefExoticComponent<Omit<ButtonProps & React$1.RefAttributes<HTMLButtonElement>, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
|
|
2007
|
+
/** Props for `SidebarRail`. */
|
|
2007
2008
|
type SidebarRailProps = React$1.ComponentProps<"button">;
|
|
2008
|
-
/**
|
|
2009
|
-
* Hoverable/draggable rail divider on the edge of the sidebar for quick toggling.
|
|
2010
|
-
*/
|
|
2009
|
+
/** Hoverable/draggable rail divider on the edge of the sidebar for quick toggling. */
|
|
2011
2010
|
declare const SidebarRail: React$1.ForwardRefExoticComponent<Omit<React$1.DetailedHTMLProps<React$1.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
|
|
2011
|
+
/** Props for `SidebarInset`. */
|
|
2012
2012
|
type SidebarInsetProps = React$1.ComponentProps<"main">;
|
|
2013
|
-
/**
|
|
2014
|
-
* Main application container when paired with an inset or standard sidebar.
|
|
2015
|
-
*/
|
|
2013
|
+
/** Main application container when paired with an inset or standard sidebar. */
|
|
2016
2014
|
declare const SidebarInset: React$1.ForwardRefExoticComponent<Omit<React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
|
|
2017
|
-
|
|
2018
|
-
/**
|
|
2019
|
-
* Styled text input tailored for use inside a sidebar header or filter bar.
|
|
2020
|
-
*/
|
|
2021
|
-
declare const SidebarInput: React$1.ForwardRefExoticComponent<Omit<InputProps & React$1.RefAttributes<HTMLInputElement>, "ref"> & React$1.RefAttributes<HTMLInputElement>>;
|
|
2015
|
+
/** Props for `SidebarHeader`. */
|
|
2022
2016
|
type SidebarHeaderProps = React$1.ComponentProps<"div">;
|
|
2023
|
-
/**
|
|
2024
|
-
* Header section at the top of a sidebar.
|
|
2025
|
-
*/
|
|
2017
|
+
/** Header section at the top of a sidebar. */
|
|
2026
2018
|
declare const SidebarHeader: React$1.ForwardRefExoticComponent<Omit<React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
|
|
2019
|
+
/** Props for `SidebarFooter`. */
|
|
2027
2020
|
type SidebarFooterProps = React$1.ComponentProps<"div">;
|
|
2028
|
-
/**
|
|
2029
|
-
* Footer section pinned to the bottom of a sidebar.
|
|
2030
|
-
*/
|
|
2021
|
+
/** Footer section pinned to the bottom of a sidebar. */
|
|
2031
2022
|
declare const SidebarFooter: React$1.ForwardRefExoticComponent<Omit<React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
|
|
2032
|
-
|
|
2033
|
-
/**
|
|
2034
|
-
* Divider separating sidebar sections.
|
|
2035
|
-
*/
|
|
2036
|
-
declare const SidebarSeparator: React$1.ForwardRefExoticComponent<Omit<Omit<SeparatorPrimitive.SeparatorProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
|
|
2023
|
+
/** Props for `SidebarContent`. */
|
|
2037
2024
|
type SidebarContentProps = React$1.ComponentProps<"div">;
|
|
2038
|
-
/**
|
|
2039
|
-
* Scrollable middle container holding sidebar navigation groups.
|
|
2040
|
-
*/
|
|
2025
|
+
/** Scrollable middle container holding sidebar navigation groups. */
|
|
2041
2026
|
declare const SidebarContent: React$1.ForwardRefExoticComponent<Omit<React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
|
|
2027
|
+
|
|
2028
|
+
/** Props for `SidebarGroup`. */
|
|
2042
2029
|
type SidebarGroupProps = React$1.ComponentProps<"div">;
|
|
2043
2030
|
/**
|
|
2044
2031
|
* Section grouping related sidebar menu items.
|
|
2045
2032
|
*/
|
|
2046
2033
|
declare const SidebarGroup: React$1.ForwardRefExoticComponent<Omit<React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
|
|
2034
|
+
/** Props for `SidebarGroupLabel`. */
|
|
2047
2035
|
type SidebarGroupLabelProps = React$1.ComponentProps<"div"> & {
|
|
2048
2036
|
asChild?: boolean;
|
|
2049
2037
|
};
|
|
@@ -2051,6 +2039,7 @@ type SidebarGroupLabelProps = React$1.ComponentProps<"div"> & {
|
|
|
2051
2039
|
* Text heading or label for a `SidebarGroup`.
|
|
2052
2040
|
*/
|
|
2053
2041
|
declare const SidebarGroupLabel: React$1.ForwardRefExoticComponent<Omit<SidebarGroupLabelProps, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
|
|
2042
|
+
/** Props for `SidebarGroupAction`. */
|
|
2054
2043
|
type SidebarGroupActionProps = React$1.ComponentProps<"button"> & {
|
|
2055
2044
|
asChild?: boolean;
|
|
2056
2045
|
};
|
|
@@ -2058,73 +2047,118 @@ type SidebarGroupActionProps = React$1.ComponentProps<"button"> & {
|
|
|
2058
2047
|
* Secondary action button placed beside a `SidebarGroupLabel` (e.g. "+" to add items).
|
|
2059
2048
|
*/
|
|
2060
2049
|
declare const SidebarGroupAction: React$1.ForwardRefExoticComponent<Omit<SidebarGroupActionProps, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
|
|
2050
|
+
/** Props for `SidebarGroupContent`. */
|
|
2061
2051
|
type SidebarGroupContentProps = React$1.ComponentProps<"div">;
|
|
2062
2052
|
/**
|
|
2063
2053
|
* Content container rendered inside a `SidebarGroup`.
|
|
2064
2054
|
*/
|
|
2065
2055
|
declare const SidebarGroupContent: React$1.ForwardRefExoticComponent<Omit<React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
|
|
2066
|
-
|
|
2056
|
+
|
|
2057
|
+
/** Global provider setting delay duration and hover behavior for all child Tooltips. */
|
|
2058
|
+
declare const TooltipProvider: React$1.FC<TooltipPrimitive.TooltipProviderProps>;
|
|
2067
2059
|
/**
|
|
2068
|
-
*
|
|
2060
|
+
* Root container for accessible hover/focus contextual tooltips.
|
|
2061
|
+
* Built upon Radix UI Tooltip.
|
|
2062
|
+
*
|
|
2063
|
+
* @example
|
|
2064
|
+
* ```tsx
|
|
2065
|
+
* <TooltipProvider>
|
|
2066
|
+
* <Tooltip>
|
|
2067
|
+
* <TooltipTrigger asChild>
|
|
2068
|
+
* <Button variant="ghost" size="icon">
|
|
2069
|
+
* <Info />
|
|
2070
|
+
* </Button>
|
|
2071
|
+
* </TooltipTrigger>
|
|
2072
|
+
* <TooltipContent side="top">
|
|
2073
|
+
* <p>Display telemetry details</p>
|
|
2074
|
+
* </TooltipContent>
|
|
2075
|
+
* </Tooltip>
|
|
2076
|
+
* </TooltipProvider>
|
|
2077
|
+
* ```
|
|
2069
2078
|
*/
|
|
2070
|
-
declare const
|
|
2071
|
-
|
|
2079
|
+
declare const Tooltip: React$1.FC<TooltipPrimitive.TooltipProps>;
|
|
2080
|
+
/** Trigger element that displays the tooltip on hover or keyboard focus. */
|
|
2081
|
+
declare const TooltipTrigger: React$1.ForwardRefExoticComponent<TooltipPrimitive.TooltipTriggerProps & React$1.RefAttributes<HTMLButtonElement>>;
|
|
2082
|
+
type TooltipContentProps = React$1.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content>;
|
|
2072
2083
|
/**
|
|
2073
|
-
*
|
|
2084
|
+
* Floating tooltip content element styled with scoped `dl-tooltip` CSS tokens.
|
|
2074
2085
|
*/
|
|
2075
|
-
declare const
|
|
2086
|
+
declare const TooltipContent: React$1.ForwardRefExoticComponent<Omit<TooltipPrimitive.TooltipContentProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
|
|
2087
|
+
|
|
2088
|
+
/** Menu button variant styles. */
|
|
2076
2089
|
declare const sidebarMenuButtonVariants: (props?: ({
|
|
2077
2090
|
variant?: "default" | "outline" | null | undefined;
|
|
2078
2091
|
size?: "default" | "sm" | "lg" | null | undefined;
|
|
2079
2092
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
2093
|
+
/** Props for `SidebarMenu`. */
|
|
2094
|
+
type SidebarMenuProps = React$1.ComponentProps<"ul">;
|
|
2095
|
+
/** Vertical list (`<ul>`) holding sidebar menu items. */
|
|
2096
|
+
declare const SidebarMenu: React$1.ForwardRefExoticComponent<Omit<React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLUListElement>, HTMLUListElement>, "ref"> & React$1.RefAttributes<HTMLUListElement>>;
|
|
2097
|
+
/** Props for `SidebarMenuItem`. */
|
|
2098
|
+
type SidebarMenuItemProps = React$1.ComponentProps<"li">;
|
|
2099
|
+
/** List item (`<li>`) wrapper for a sidebar navigation button or link. */
|
|
2100
|
+
declare const SidebarMenuItem: React$1.ForwardRefExoticComponent<Omit<React$1.DetailedHTMLProps<React$1.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & React$1.RefAttributes<HTMLLIElement>>;
|
|
2101
|
+
/** Props for `SidebarMenuButton`. */
|
|
2080
2102
|
type SidebarMenuButtonProps = React$1.ComponentProps<"button"> & {
|
|
2081
2103
|
asChild?: boolean;
|
|
2082
2104
|
isActive?: boolean;
|
|
2083
2105
|
tooltip?: string | React$1.ComponentProps<typeof TooltipContent>;
|
|
2084
2106
|
} & VariantProps<typeof sidebarMenuButtonVariants>;
|
|
2085
|
-
/**
|
|
2086
|
-
* Interactive navigation button inside a sidebar menu item, with automatic tooltip in collapsed icon mode.
|
|
2087
|
-
*/
|
|
2107
|
+
/** Interactive navigation button inside a sidebar menu item, with automatic tooltip in collapsed icon mode. */
|
|
2088
2108
|
declare const SidebarMenuButton: React$1.ForwardRefExoticComponent<Omit<SidebarMenuButtonProps, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
|
|
2109
|
+
/** Props for `SidebarMenuAction`. */
|
|
2089
2110
|
type SidebarMenuActionProps = React$1.ComponentProps<"button"> & {
|
|
2090
2111
|
asChild?: boolean;
|
|
2091
2112
|
showOnHover?: boolean;
|
|
2092
2113
|
};
|
|
2093
|
-
/**
|
|
2094
|
-
* Secondary action button placed beside a sidebar menu button (e.g. "..." more options menu).
|
|
2095
|
-
*/
|
|
2114
|
+
/** Secondary action button placed beside a sidebar menu button. */
|
|
2096
2115
|
declare const SidebarMenuAction: React$1.ForwardRefExoticComponent<Omit<SidebarMenuActionProps, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
|
|
2116
|
+
/** Props for `SidebarMenuBadge`. */
|
|
2097
2117
|
type SidebarMenuBadgeProps = React$1.ComponentProps<"div">;
|
|
2098
|
-
/**
|
|
2099
|
-
* Numeric or label badge placed on the right side of a sidebar menu button.
|
|
2100
|
-
*/
|
|
2118
|
+
/** Numeric or label badge placed on the right side of a sidebar menu button. */
|
|
2101
2119
|
declare const SidebarMenuBadge: React$1.ForwardRefExoticComponent<Omit<React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
|
|
2120
|
+
|
|
2121
|
+
/** Props for `SidebarMenuSkeleton`. */
|
|
2102
2122
|
type SidebarMenuSkeletonProps = React$1.ComponentProps<"div"> & {
|
|
2103
2123
|
showIcon?: boolean;
|
|
2104
2124
|
};
|
|
2105
|
-
/**
|
|
2106
|
-
* Loading skeleton placeholder simulating a sidebar menu item.
|
|
2107
|
-
*/
|
|
2125
|
+
/** Loading skeleton placeholder simulating a sidebar menu item. */
|
|
2108
2126
|
declare const SidebarMenuSkeleton: React$1.ForwardRefExoticComponent<Omit<SidebarMenuSkeletonProps, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
|
|
2127
|
+
/** Props for `SidebarMenuSub`. */
|
|
2109
2128
|
type SidebarMenuSubProps = React$1.ComponentProps<"ul">;
|
|
2110
|
-
/**
|
|
2111
|
-
* Nested sub-list container for hierarchical sidebar navigation.
|
|
2112
|
-
*/
|
|
2129
|
+
/** Nested sub-list container for hierarchical sidebar navigation. */
|
|
2113
2130
|
declare const SidebarMenuSub: React$1.ForwardRefExoticComponent<Omit<React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLUListElement>, HTMLUListElement>, "ref"> & React$1.RefAttributes<HTMLUListElement>>;
|
|
2131
|
+
/** Props for `SidebarMenuSubItem`. */
|
|
2114
2132
|
type SidebarMenuSubItemProps = React$1.ComponentProps<"li">;
|
|
2115
|
-
/**
|
|
2116
|
-
* Nested item wrapper inside a `SidebarMenuSub`.
|
|
2117
|
-
*/
|
|
2133
|
+
/** Nested item wrapper inside a `SidebarMenuSub`. */
|
|
2118
2134
|
declare const SidebarMenuSubItem: React$1.ForwardRefExoticComponent<Omit<React$1.DetailedHTMLProps<React$1.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & React$1.RefAttributes<HTMLLIElement>>;
|
|
2135
|
+
/** Props for `SidebarMenuSubButton`. */
|
|
2119
2136
|
type SidebarMenuSubButtonProps = React$1.ComponentProps<"a"> & {
|
|
2120
2137
|
asChild?: boolean;
|
|
2121
2138
|
size?: "sm" | "md";
|
|
2122
2139
|
isActive?: boolean;
|
|
2123
2140
|
};
|
|
2141
|
+
/** Navigation button/link inside a nested `SidebarMenuSub` tree. */
|
|
2142
|
+
declare const SidebarMenuSubButton: React$1.ForwardRefExoticComponent<Omit<SidebarMenuSubButtonProps, "ref"> & React$1.RefAttributes<HTMLAnchorElement>>;
|
|
2143
|
+
|
|
2144
|
+
/** Props for `SidebarTrigger`. */
|
|
2145
|
+
type SidebarTriggerProps = React$1.ComponentProps<typeof Button>;
|
|
2124
2146
|
/**
|
|
2125
|
-
*
|
|
2147
|
+
* Button trigger toggling sidebar collapsed/expanded state.
|
|
2126
2148
|
*/
|
|
2127
|
-
declare const
|
|
2149
|
+
declare const SidebarTrigger: React$1.ForwardRefExoticComponent<Omit<ButtonProps & React$1.RefAttributes<HTMLButtonElement>, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
|
|
2150
|
+
/** Props for `SidebarSeparator`. */
|
|
2151
|
+
type SidebarSeparatorProps = React$1.ComponentProps<typeof Separator>;
|
|
2152
|
+
/**
|
|
2153
|
+
* Divider separating sidebar sections.
|
|
2154
|
+
*/
|
|
2155
|
+
declare const SidebarSeparator: React$1.ForwardRefExoticComponent<Omit<Omit<SeparatorPrimitive.SeparatorProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
|
|
2156
|
+
/** Props for `SidebarInput`. */
|
|
2157
|
+
type SidebarInputProps = React$1.ComponentProps<typeof Input>;
|
|
2158
|
+
/**
|
|
2159
|
+
* Styled text input tailored for use inside a sidebar header or filter bar.
|
|
2160
|
+
*/
|
|
2161
|
+
declare const SidebarInput: React$1.ForwardRefExoticComponent<Omit<InputProps & React$1.RefAttributes<HTMLInputElement>, "ref"> & React$1.RefAttributes<HTMLInputElement>>;
|
|
2128
2162
|
|
|
2129
2163
|
type SkeletonProps = React$1.HTMLAttributes<HTMLDivElement>;
|
|
2130
2164
|
/**
|
|
@@ -2132,13 +2166,13 @@ type SkeletonProps = React$1.HTMLAttributes<HTMLDivElement>;
|
|
|
2132
2166
|
*
|
|
2133
2167
|
* @example
|
|
2134
2168
|
* ```tsx
|
|
2135
|
-
* <
|
|
2136
|
-
* <Skeleton
|
|
2137
|
-
* <
|
|
2138
|
-
* <Skeleton
|
|
2139
|
-
* <Skeleton
|
|
2140
|
-
* </
|
|
2141
|
-
* </
|
|
2169
|
+
* <Flex align="center" gap="4">
|
|
2170
|
+
* <Skeleton variant="circle" />
|
|
2171
|
+
* <Stack gap="2">
|
|
2172
|
+
* <Skeleton />
|
|
2173
|
+
* <Skeleton />
|
|
2174
|
+
* </Stack>
|
|
2175
|
+
* </Flex>
|
|
2142
2176
|
* ```
|
|
2143
2177
|
*/
|
|
2144
2178
|
declare function Skeleton({ className, ...props }: SkeletonProps): react_jsx_runtime.JSX.Element;
|
|
@@ -2147,7 +2181,6 @@ type SliderProps = React$1.ComponentPropsWithoutRef<typeof SliderPrimitive.Root>
|
|
|
2147
2181
|
/**
|
|
2148
2182
|
* Interactive slider component for selecting single numeric values or continuous ranges.
|
|
2149
2183
|
* Built upon Radix UI Slider with scoped CSS track and thumb styling.
|
|
2150
|
-
* Zero Tailwind runtime dependencies.
|
|
2151
2184
|
*
|
|
2152
2185
|
* @example
|
|
2153
2186
|
* ```tsx
|
|
@@ -2227,7 +2260,6 @@ type SwitchProps = React$1.ComponentPropsWithoutRef<typeof SwitchPrimitives.Root
|
|
|
2227
2260
|
/**
|
|
2228
2261
|
* Interactive toggle control that allows users to switch between on and off states.
|
|
2229
2262
|
* Powered by Radix UI Switch primitive with scoped CSS transitions and token styling.
|
|
2230
|
-
* Zero Tailwind runtime dependencies.
|
|
2231
2263
|
*
|
|
2232
2264
|
* @example
|
|
2233
2265
|
* ```tsx
|
|
@@ -2341,7 +2373,6 @@ type TextareaProps = React$1.TextareaHTMLAttributes<HTMLTextAreaElement>;
|
|
|
2341
2373
|
/**
|
|
2342
2374
|
* Multi-line text field styled with design system tokens and scoped CSS.
|
|
2343
2375
|
* Provides accessible focus states, vertical resizing, and clean error integration.
|
|
2344
|
-
* Zero Tailwind runtime dependencies.
|
|
2345
2376
|
*
|
|
2346
2377
|
* @example
|
|
2347
2378
|
* ```tsx
|
|
@@ -2370,7 +2401,7 @@ type ToggleProps = React$1.ComponentPropsWithoutRef<typeof TogglePrimitive.Root>
|
|
|
2370
2401
|
* @example
|
|
2371
2402
|
* ```tsx
|
|
2372
2403
|
* <Toggle aria-label="Toggle italic">
|
|
2373
|
-
* <Italic
|
|
2404
|
+
* <Italic />
|
|
2374
2405
|
* </Toggle>
|
|
2375
2406
|
* ```
|
|
2376
2407
|
*/
|
|
@@ -2387,10 +2418,10 @@ type ToggleGroupProps = React$1.ComponentPropsWithoutRef<typeof ToggleGroupPrimi
|
|
|
2387
2418
|
* ```tsx
|
|
2388
2419
|
* <ToggleGroup type="multiple">
|
|
2389
2420
|
* <ToggleGroupItem value="bold" aria-label="Toggle bold">
|
|
2390
|
-
* <Bold
|
|
2421
|
+
* <Bold />
|
|
2391
2422
|
* </ToggleGroupItem>
|
|
2392
2423
|
* <ToggleGroupItem value="italic" aria-label="Toggle italic">
|
|
2393
|
-
* <Italic
|
|
2424
|
+
* <Italic />
|
|
2394
2425
|
* </ToggleGroupItem>
|
|
2395
2426
|
* </ToggleGroup>
|
|
2396
2427
|
* ```
|
|
@@ -2482,4 +2513,434 @@ interface SecretRevealCardProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
|
2482
2513
|
*/
|
|
2483
2514
|
declare const SecretRevealCard: React$1.ForwardRefExoticComponent<SecretRevealCardProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2484
2515
|
|
|
2485
|
-
|
|
2516
|
+
/**
|
|
2517
|
+
* @file typography.types.ts
|
|
2518
|
+
* @description Type definitions and prop contracts for Heading and Text typography primitives.
|
|
2519
|
+
*/
|
|
2520
|
+
|
|
2521
|
+
/**
|
|
2522
|
+
* Supported heading HTML tag elements for semantic hierarchy.
|
|
2523
|
+
*/
|
|
2524
|
+
type HeadingTag = "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "span" | "div";
|
|
2525
|
+
/**
|
|
2526
|
+
* Typographic visual size levels corresponding to the design token scale.
|
|
2527
|
+
*/
|
|
2528
|
+
type HeadingSize = "display" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6";
|
|
2529
|
+
/**
|
|
2530
|
+
* Text element tags for semantic markup.
|
|
2531
|
+
*/
|
|
2532
|
+
type TextTag = "p" | "span" | "div" | "label" | "small" | "strong" | "em" | "code";
|
|
2533
|
+
/**
|
|
2534
|
+
* Body and inline text scale variants.
|
|
2535
|
+
*/
|
|
2536
|
+
type TextVariant = "body-lg" | "body" | "body-sm" | "caption" | "code" | "metric";
|
|
2537
|
+
/**
|
|
2538
|
+
* Typographic color semantics mapped to design tokens.
|
|
2539
|
+
*/
|
|
2540
|
+
type TypographyColor = "default" | "muted" | "subtle" | "primary" | "destructive" | "warning" | "success" | "info";
|
|
2541
|
+
/**
|
|
2542
|
+
* Text alignment options.
|
|
2543
|
+
*/
|
|
2544
|
+
type TypographyAlign = "left" | "center" | "right";
|
|
2545
|
+
/**
|
|
2546
|
+
* Font weight overrides.
|
|
2547
|
+
*/
|
|
2548
|
+
type TypographyWeight = "normal" | "medium" | "semibold" | "bold" | "extrabold";
|
|
2549
|
+
/**
|
|
2550
|
+
* Props for the Heading component.
|
|
2551
|
+
*/
|
|
2552
|
+
interface HeadingProps extends HTMLAttributes<HTMLHeadingElement> {
|
|
2553
|
+
/**
|
|
2554
|
+
* The underlying HTML element tag rendered in the DOM for accessibility and SEO.
|
|
2555
|
+
* Allows decoupling semantic hierarchy (e.g. `as="h1"`) from visual appearance (e.g. `size="h3"`).
|
|
2556
|
+
* @default Matching the `size` prop if h1-h6, otherwise "h2"
|
|
2557
|
+
*/
|
|
2558
|
+
readonly as?: HeadingTag;
|
|
2559
|
+
/**
|
|
2560
|
+
* The visual size styling applied to the heading from the design scale.
|
|
2561
|
+
* @default "h2"
|
|
2562
|
+
*/
|
|
2563
|
+
readonly size?: HeadingSize;
|
|
2564
|
+
/**
|
|
2565
|
+
* Semantic color variant.
|
|
2566
|
+
* @default "default"
|
|
2567
|
+
*/
|
|
2568
|
+
readonly color?: TypographyColor;
|
|
2569
|
+
/**
|
|
2570
|
+
* Explicit font-weight override.
|
|
2571
|
+
*/
|
|
2572
|
+
readonly weight?: TypographyWeight;
|
|
2573
|
+
/**
|
|
2574
|
+
* Horizontal text alignment.
|
|
2575
|
+
* @default "left"
|
|
2576
|
+
*/
|
|
2577
|
+
readonly align?: TypographyAlign;
|
|
2578
|
+
/**
|
|
2579
|
+
* Whether to truncate long text with an ellipsis on a single line.
|
|
2580
|
+
* @default false
|
|
2581
|
+
*/
|
|
2582
|
+
readonly truncate?: boolean;
|
|
2583
|
+
/**
|
|
2584
|
+
* Additional custom CSS classes.
|
|
2585
|
+
*/
|
|
2586
|
+
readonly className?: string;
|
|
2587
|
+
/**
|
|
2588
|
+
* Heading content.
|
|
2589
|
+
*/
|
|
2590
|
+
readonly children?: ReactNode;
|
|
2591
|
+
}
|
|
2592
|
+
/**
|
|
2593
|
+
* Props for the Text component.
|
|
2594
|
+
*/
|
|
2595
|
+
interface TextProps extends HTMLAttributes<HTMLElement> {
|
|
2596
|
+
/**
|
|
2597
|
+
* The underlying HTML element tag rendered in the DOM.
|
|
2598
|
+
* @default "p"
|
|
2599
|
+
*/
|
|
2600
|
+
readonly as?: TextTag;
|
|
2601
|
+
/**
|
|
2602
|
+
* Visual typography variant from the token scale.
|
|
2603
|
+
* @default "body"
|
|
2604
|
+
*/
|
|
2605
|
+
readonly variant?: TextVariant;
|
|
2606
|
+
/**
|
|
2607
|
+
* Semantic color variant.
|
|
2608
|
+
* @default "default"
|
|
2609
|
+
*/
|
|
2610
|
+
readonly color?: TypographyColor;
|
|
2611
|
+
/**
|
|
2612
|
+
* Explicit font-weight override.
|
|
2613
|
+
*/
|
|
2614
|
+
readonly weight?: TypographyWeight;
|
|
2615
|
+
/**
|
|
2616
|
+
* Horizontal text alignment.
|
|
2617
|
+
* @default "left"
|
|
2618
|
+
*/
|
|
2619
|
+
readonly align?: TypographyAlign;
|
|
2620
|
+
/**
|
|
2621
|
+
* Whether to truncate long text with an ellipsis on a single line.
|
|
2622
|
+
* @default false
|
|
2623
|
+
*/
|
|
2624
|
+
readonly truncate?: boolean;
|
|
2625
|
+
/**
|
|
2626
|
+
* Additional custom CSS classes.
|
|
2627
|
+
*/
|
|
2628
|
+
readonly className?: string;
|
|
2629
|
+
/**
|
|
2630
|
+
* Text content.
|
|
2631
|
+
*/
|
|
2632
|
+
readonly children?: ReactNode;
|
|
2633
|
+
}
|
|
2634
|
+
|
|
2635
|
+
/**
|
|
2636
|
+
* Heading primitive component.
|
|
2637
|
+
*
|
|
2638
|
+
* Allows developers to decouple semantic accessibility (`as="h1"`) from visual
|
|
2639
|
+
* design styling (`size="h3"`), ensuring 100% SEO/a11y compliance without breaking layouts.
|
|
2640
|
+
*
|
|
2641
|
+
* @example
|
|
2642
|
+
* ```tsx
|
|
2643
|
+
* // Visual h3 styling but semantic h1 tag in document outline
|
|
2644
|
+
* <Heading as="h1" size="h3">Financial Overview</Heading>
|
|
2645
|
+
*
|
|
2646
|
+
* // Standard display heading
|
|
2647
|
+
* <Heading size="display" color="primary">Hero Headline</Heading>
|
|
2648
|
+
* ```
|
|
2649
|
+
*/
|
|
2650
|
+
declare const Heading: React$1.ForwardRefExoticComponent<HeadingProps & React$1.RefAttributes<HTMLHeadingElement>>;
|
|
2651
|
+
|
|
2652
|
+
/**
|
|
2653
|
+
* Text primitive component.
|
|
2654
|
+
*
|
|
2655
|
+
* Provides standardized body, caption, code, and metric formatting consuming
|
|
2656
|
+
* centralized design tokens across all brands.
|
|
2657
|
+
*
|
|
2658
|
+
* @example
|
|
2659
|
+
* ```tsx
|
|
2660
|
+
* <Text variant="body-sm" color="muted">Updated 2 minutes ago</Text>
|
|
2661
|
+
* <Text as="span" variant="metric" color="success">+18.4%</Text>
|
|
2662
|
+
* ```
|
|
2663
|
+
*/
|
|
2664
|
+
declare const Text: React$1.ForwardRefExoticComponent<TextProps & React$1.RefAttributes<HTMLElement>>;
|
|
2665
|
+
|
|
2666
|
+
/**
|
|
2667
|
+
* Visual padding scale tokens mapped to semantic spacing CSS variables.
|
|
2668
|
+
*/
|
|
2669
|
+
type BoxPadding = "0" | "1" | "2" | "3" | "4" | "5" | "6" | "8" | "10" | 0 | 1 | 2 | 3 | 4 | 5 | 6 | 8 | 10;
|
|
2670
|
+
/**
|
|
2671
|
+
* Border radius scale tokens mapped to brand radius CSS variables.
|
|
2672
|
+
*/
|
|
2673
|
+
type BoxRadius = "none" | "sm" | "md" | "lg" | "xl" | "full";
|
|
2674
|
+
/**
|
|
2675
|
+
* Elevation shadow scale tokens.
|
|
2676
|
+
*/
|
|
2677
|
+
type BoxShadow = "none" | "sm" | "md" | "lg" | "glass";
|
|
2678
|
+
/**
|
|
2679
|
+
* Props for the polymorphic Box layout primitive.
|
|
2680
|
+
*/
|
|
2681
|
+
interface BoxProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
2682
|
+
/**
|
|
2683
|
+
* If true, delegates rendering to the direct child element via Radix Slot.
|
|
2684
|
+
* @default false
|
|
2685
|
+
*/
|
|
2686
|
+
asChild?: boolean;
|
|
2687
|
+
/**
|
|
2688
|
+
* HTML element type to render.
|
|
2689
|
+
* @default "div"
|
|
2690
|
+
*/
|
|
2691
|
+
as?: React$1.ElementType;
|
|
2692
|
+
/**
|
|
2693
|
+
* Internal padding token mapped to --space-* CSS variables.
|
|
2694
|
+
*/
|
|
2695
|
+
p?: BoxPadding;
|
|
2696
|
+
/**
|
|
2697
|
+
* Horizontal padding token mapped to --space-* CSS variables.
|
|
2698
|
+
*/
|
|
2699
|
+
px?: BoxPadding;
|
|
2700
|
+
/**
|
|
2701
|
+
* Vertical padding token mapped to --space-* CSS variables.
|
|
2702
|
+
*/
|
|
2703
|
+
py?: BoxPadding;
|
|
2704
|
+
/**
|
|
2705
|
+
* Border radius token mapped to --radius-* CSS variables.
|
|
2706
|
+
*/
|
|
2707
|
+
radius?: BoxRadius;
|
|
2708
|
+
/**
|
|
2709
|
+
* Elevation shadow token.
|
|
2710
|
+
*/
|
|
2711
|
+
shadow?: BoxShadow;
|
|
2712
|
+
/**
|
|
2713
|
+
* Whether to render a default 1px border using var(--border).
|
|
2714
|
+
* @default false
|
|
2715
|
+
*/
|
|
2716
|
+
border?: boolean;
|
|
2717
|
+
/**
|
|
2718
|
+
* Background surface token.
|
|
2719
|
+
*/
|
|
2720
|
+
bg?: "background" | "card" | "surface" | "surface-2" | "muted" | "transparent";
|
|
2721
|
+
}
|
|
2722
|
+
/**
|
|
2723
|
+
* Primitive bounding Box component for structured spacing, borders, and surfaces.
|
|
2724
|
+
*
|
|
2725
|
+
* @example
|
|
2726
|
+
* ```tsx
|
|
2727
|
+
* <Box p="6" bg="card" border radius="lg" shadow="md">
|
|
2728
|
+
* <p>Card Content</p>
|
|
2729
|
+
* </Box>
|
|
2730
|
+
* ```
|
|
2731
|
+
*/
|
|
2732
|
+
declare const Box: React$1.ForwardRefExoticComponent<BoxProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2733
|
+
|
|
2734
|
+
/**
|
|
2735
|
+
* Flexbox direction options.
|
|
2736
|
+
*/
|
|
2737
|
+
type FlexDirection = "row" | "row-reverse" | "col" | "col-reverse";
|
|
2738
|
+
/**
|
|
2739
|
+
* Flexbox content alignment options along the main axis.
|
|
2740
|
+
*/
|
|
2741
|
+
type FlexJustify = "start" | "center" | "end" | "between" | "around" | "evenly";
|
|
2742
|
+
/**
|
|
2743
|
+
* Flexbox item alignment options along the cross axis.
|
|
2744
|
+
*/
|
|
2745
|
+
type FlexAlign = "start" | "center" | "end" | "stretch" | "baseline";
|
|
2746
|
+
/**
|
|
2747
|
+
* Spacing gap scale tokens mapped to --space-* CSS variables.
|
|
2748
|
+
*/
|
|
2749
|
+
type LayoutGap = "0" | "1" | "2" | "3" | "4" | "5" | "6" | "8" | "10" | 0 | 1 | 2 | 3 | 4 | 5 | 6 | 8 | 10;
|
|
2750
|
+
/**
|
|
2751
|
+
* Props for the Flex layout primitive.
|
|
2752
|
+
*/
|
|
2753
|
+
interface FlexProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
2754
|
+
/**
|
|
2755
|
+
* If true, delegates rendering to the direct child element via Radix Slot.
|
|
2756
|
+
* @default false
|
|
2757
|
+
*/
|
|
2758
|
+
asChild?: boolean;
|
|
2759
|
+
/**
|
|
2760
|
+
* HTML element type to render.
|
|
2761
|
+
* @default "div"
|
|
2762
|
+
*/
|
|
2763
|
+
as?: React$1.ElementType;
|
|
2764
|
+
/**
|
|
2765
|
+
* Flex direction.
|
|
2766
|
+
* @default "row"
|
|
2767
|
+
*/
|
|
2768
|
+
direction?: FlexDirection;
|
|
2769
|
+
/**
|
|
2770
|
+
* Main axis alignment (justify-content).
|
|
2771
|
+
*/
|
|
2772
|
+
justify?: FlexJustify;
|
|
2773
|
+
/**
|
|
2774
|
+
* Cross axis alignment (align-items).
|
|
2775
|
+
*/
|
|
2776
|
+
align?: FlexAlign;
|
|
2777
|
+
/**
|
|
2778
|
+
* Flex wrap behavior.
|
|
2779
|
+
* @default false
|
|
2780
|
+
*/
|
|
2781
|
+
wrap?: boolean | "wrap" | "nowrap" | "reverse";
|
|
2782
|
+
/**
|
|
2783
|
+
* Gap spacing token mapped to --space-*.
|
|
2784
|
+
*/
|
|
2785
|
+
gap?: LayoutGap;
|
|
2786
|
+
/**
|
|
2787
|
+
* Whether to display as inline-flex.
|
|
2788
|
+
* @default false
|
|
2789
|
+
*/
|
|
2790
|
+
inline?: boolean;
|
|
2791
|
+
}
|
|
2792
|
+
/**
|
|
2793
|
+
* Polymorphic Flex container component for fluid 1-dimensional layouts.
|
|
2794
|
+
*
|
|
2795
|
+
* @example
|
|
2796
|
+
* ```tsx
|
|
2797
|
+
* <Flex justify="between" align="center" gap="4">
|
|
2798
|
+
* <span>Title</span>
|
|
2799
|
+
* <Button size="sm">Action</Button>
|
|
2800
|
+
* </Flex>
|
|
2801
|
+
* ```
|
|
2802
|
+
*/
|
|
2803
|
+
declare const Flex: React$1.ForwardRefExoticComponent<FlexProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2804
|
+
|
|
2805
|
+
/**
|
|
2806
|
+
* Direction orientation for Stack flow.
|
|
2807
|
+
*/
|
|
2808
|
+
type StackDirection = "col" | "row";
|
|
2809
|
+
/**
|
|
2810
|
+
* Alignment options for Stack items.
|
|
2811
|
+
*/
|
|
2812
|
+
type StackAlign = "start" | "center" | "end" | "stretch" | "baseline";
|
|
2813
|
+
/**
|
|
2814
|
+
* Props for the Stack layout primitive.
|
|
2815
|
+
*/
|
|
2816
|
+
interface StackProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
2817
|
+
/**
|
|
2818
|
+
* If true, delegates rendering to the direct child element via Radix Slot.
|
|
2819
|
+
* @default false
|
|
2820
|
+
*/
|
|
2821
|
+
asChild?: boolean;
|
|
2822
|
+
/**
|
|
2823
|
+
* HTML element type to render.
|
|
2824
|
+
* @default "div"
|
|
2825
|
+
*/
|
|
2826
|
+
as?: React$1.ElementType;
|
|
2827
|
+
/**
|
|
2828
|
+
* Flow orientation of the stack items.
|
|
2829
|
+
* @default "col"
|
|
2830
|
+
*/
|
|
2831
|
+
direction?: StackDirection;
|
|
2832
|
+
/**
|
|
2833
|
+
* Spacing gap token mapped to --space-* CSS variables.
|
|
2834
|
+
* @default "3"
|
|
2835
|
+
*/
|
|
2836
|
+
gap?: LayoutGap;
|
|
2837
|
+
/**
|
|
2838
|
+
* Alignment along the cross axis.
|
|
2839
|
+
* @default "stretch"
|
|
2840
|
+
*/
|
|
2841
|
+
align?: StackAlign;
|
|
2842
|
+
}
|
|
2843
|
+
/**
|
|
2844
|
+
* High-velocity Stack layout primitive for structured vertical or horizontal flows.
|
|
2845
|
+
*
|
|
2846
|
+
* @example
|
|
2847
|
+
* ```tsx
|
|
2848
|
+
* <Stack direction="col" gap="4">
|
|
2849
|
+
* <Input label="Name" />
|
|
2850
|
+
* <Input label="Email" />
|
|
2851
|
+
* <Button>Submit</Button>
|
|
2852
|
+
* </Stack>
|
|
2853
|
+
* ```
|
|
2854
|
+
*/
|
|
2855
|
+
declare const Stack: React$1.ForwardRefExoticComponent<StackProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2856
|
+
|
|
2857
|
+
/**
|
|
2858
|
+
* Grid column counts (1 through 12).
|
|
2859
|
+
*/
|
|
2860
|
+
type GridColumns = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
|
|
2861
|
+
/**
|
|
2862
|
+
* Props for the Grid layout primitive.
|
|
2863
|
+
*/
|
|
2864
|
+
interface GridProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
2865
|
+
/**
|
|
2866
|
+
* If true, delegates rendering to the direct child element via Radix Slot.
|
|
2867
|
+
* @default false
|
|
2868
|
+
*/
|
|
2869
|
+
asChild?: boolean;
|
|
2870
|
+
/**
|
|
2871
|
+
* HTML element type to render.
|
|
2872
|
+
* @default "div"
|
|
2873
|
+
*/
|
|
2874
|
+
as?: React$1.ElementType;
|
|
2875
|
+
/**
|
|
2876
|
+
* Number of uniform columns, or an auto-fit minItemWidth (e.g. "280px").
|
|
2877
|
+
* @default 1
|
|
2878
|
+
*/
|
|
2879
|
+
cols?: GridColumns | string;
|
|
2880
|
+
/**
|
|
2881
|
+
* Alias for `cols`.
|
|
2882
|
+
*/
|
|
2883
|
+
columns?: GridColumns | string;
|
|
2884
|
+
/**
|
|
2885
|
+
* Spacing gap token mapped to --space-* CSS variables.
|
|
2886
|
+
* @default "4"
|
|
2887
|
+
*/
|
|
2888
|
+
gap?: LayoutGap;
|
|
2889
|
+
/**
|
|
2890
|
+
* Whether to display as inline-grid.
|
|
2891
|
+
* @default false
|
|
2892
|
+
*/
|
|
2893
|
+
inline?: boolean;
|
|
2894
|
+
}
|
|
2895
|
+
/**
|
|
2896
|
+
* Responsive 2D Grid layout primitive.
|
|
2897
|
+
*
|
|
2898
|
+
* @example
|
|
2899
|
+
* ```tsx
|
|
2900
|
+
* <Grid cols={3} gap="4">
|
|
2901
|
+
* <MetricCard title="A" />
|
|
2902
|
+
* <MetricCard title="B" />
|
|
2903
|
+
* <MetricCard title="C" />
|
|
2904
|
+
* </Grid>
|
|
2905
|
+
* ```
|
|
2906
|
+
*/
|
|
2907
|
+
declare const Grid: React$1.ForwardRefExoticComponent<GridProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2908
|
+
|
|
2909
|
+
/**
|
|
2910
|
+
* Responsive maximum width constraint for the Container.
|
|
2911
|
+
*/
|
|
2912
|
+
type ContainerSize = "sm" | "md" | "lg" | "xl" | "2xl" | "fluid";
|
|
2913
|
+
/**
|
|
2914
|
+
* Props for the Container layout primitive.
|
|
2915
|
+
*/
|
|
2916
|
+
interface ContainerProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
2917
|
+
/**
|
|
2918
|
+
* If true, delegates rendering to the direct child element via Radix Slot.
|
|
2919
|
+
* @default false
|
|
2920
|
+
*/
|
|
2921
|
+
asChild?: boolean;
|
|
2922
|
+
/**
|
|
2923
|
+
* HTML element type to render.
|
|
2924
|
+
* @default "div"
|
|
2925
|
+
*/
|
|
2926
|
+
as?: React$1.ElementType;
|
|
2927
|
+
/**
|
|
2928
|
+
* Maximum width threshold.
|
|
2929
|
+
* @default "xl"
|
|
2930
|
+
*/
|
|
2931
|
+
size?: ContainerSize;
|
|
2932
|
+
}
|
|
2933
|
+
/**
|
|
2934
|
+
* Centered responsive max-width boundary component for page sections and layouts.
|
|
2935
|
+
*
|
|
2936
|
+
* @example
|
|
2937
|
+
* ```tsx
|
|
2938
|
+
* <Container size="xl">
|
|
2939
|
+
* <Header />
|
|
2940
|
+
* <Main />
|
|
2941
|
+
* </Container>
|
|
2942
|
+
* ```
|
|
2943
|
+
*/
|
|
2944
|
+
declare const Container: React$1.ForwardRefExoticComponent<ContainerProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
2945
|
+
|
|
2946
|
+
export { Accordion, AccordionContent, type AccordionContentProps, AccordionItem, type AccordionItemProps, AccordionTrigger, type AccordionTriggerProps, Alert, AlertDescription, type AlertDescriptionProps, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, type AlertDialogContentProps, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, type AlertDialogOverlayProps, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, type AlertProps, AlertTitle, type AlertTitleProps, AspectRatio, type AspectRatioProps, Avatar, AvatarFallback, type AvatarFallbackProps, AvatarImage, type AvatarImageProps, type AvatarProps, Badge, type BadgeProps, Box, type BoxPadding, type BoxProps, type BoxRadius, type BoxShadow, type Brand, Breadcrumb, BreadcrumbEllipsis, type BreadcrumbEllipsisProps, BreadcrumbItem, type BreadcrumbItemProps, BreadcrumbLink, type BreadcrumbLinkProps, BreadcrumbList, type BreadcrumbListProps, BreadcrumbPage, type BreadcrumbPageProps, type BreadcrumbProps, BreadcrumbSeparator, type BreadcrumbSeparatorProps, Button, type ButtonProps, Calendar, CalendarDayButton, type CalendarProps, Card, CardContent, type CardContentProps, CardDescription, type CardDescriptionProps, CardFooter, type CardFooterProps, CardHeader, type CardHeaderProps, type CardProps, CardTitle, type CardTitleProps, Carousel, type CarouselApi, CarouselContent, type CarouselContentProps, CarouselContext, type CarouselContextProps, CarouselItem, type CarouselItemProps, CarouselNext, type CarouselNextProps, CarouselPrevious, type CarouselPreviousProps, type CarouselProps, type ChartConfig, ChartContainer, type ChartContainerProps, ChartContext, type ChartContextProps, ChartLegend, ChartLegendContent, type ChartLegendContentProps, ChartStyle, ChartTooltip, ChartTooltipContent, type ChartTooltipContentProps, Checkbox, type CheckboxProps, Collapsible, CollapsibleContent, type CollapsibleContentProps, type CollapsibleProps, CollapsibleTrigger, type CollapsibleTriggerProps, Command, CommandDialog, type CommandDialogProps, CommandEmpty, type CommandEmptyProps, CommandGroup, type CommandGroupProps, CommandInput, type CommandInputProps, CommandItem, type CommandItemProps, CommandList, type CommandListProps, type CommandProps, CommandSeparator, type CommandSeparatorProps, CommandShortcut, type CommandShortcutProps, ConfigProvider, type ConfigProviderProps, ConfirmDialog, type ConfirmDialogProps, Container, type ContainerProps, type ContainerSize, ContextMenu, ContextMenuCheckboxItem, type ContextMenuCheckboxItemProps, ContextMenuContent, type ContextMenuContentProps, ContextMenuGroup, ContextMenuItem, type ContextMenuItemProps, ContextMenuLabel, type ContextMenuLabelProps, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, type ContextMenuRadioItemProps, ContextMenuSeparator, type ContextMenuSeparatorProps, ContextMenuShortcut, type ContextMenuShortcutProps, ContextMenuSub, ContextMenuSubContent, type ContextMenuSubContentProps, ContextMenuSubTrigger, type ContextMenuSubTriggerProps, ContextMenuTrigger, CopyButton, type CopyButtonProps, DatePicker, type DatePickerProps, Dialog, DialogBody, DialogClose, DialogContent, type DialogContentProps, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, type DialogOverlayProps, DialogPortal, type DialogSize, DialogTitle, DialogTrigger, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, type DropdownMenuCheckboxItemProps, DropdownMenuContent, type DropdownMenuContentProps, DropdownMenuGroup, DropdownMenuItem, type DropdownMenuItemProps, DropdownMenuLabel, type DropdownMenuLabelProps, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, type DropdownMenuRadioItemProps, DropdownMenuSeparator, type DropdownMenuSeparatorProps, DropdownMenuShortcut, type DropdownMenuShortcutProps, DropdownMenuSub, DropdownMenuSubContent, type DropdownMenuSubContentProps, DropdownMenuSubTrigger, type DropdownMenuSubTriggerProps, DropdownMenuTrigger, EmptyState, type EmptyStateProps, Flex, type FlexAlign, type FlexDirection, type FlexJustify, type FlexProps, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, Grid, type GridColumns, type GridProps, Heading, type HeadingProps, type HeadingSize, type HeadingTag, HoverCard, HoverCardContent, HoverCardTrigger, Input, InputOTP, InputOTPGroup, type InputOTPProps, InputOTPSeparator, InputOTPSlot, type InputOTPSlotProps, type InputProps, Label, type LabelProps, type LayoutGap, LoadingState, type LoadingStateProps, Menubar, MenubarCheckboxItem, type MenubarCheckboxItemProps, MenubarContent, type MenubarContentProps, MenubarGroup, MenubarItem, type MenubarItemProps, MenubarLabel, type MenubarLabelProps, MenubarMenu, MenubarPortal, type MenubarProps, MenubarRadioGroup, MenubarRadioItem, type MenubarRadioItemProps, MenubarSeparator, type MenubarSeparatorProps, MenubarShortcut, type MenubarShortcutProps, MenubarSub, MenubarSubContent, type MenubarSubContentProps, MenubarSubTrigger, type MenubarSubTriggerProps, MenubarTrigger, type MenubarTriggerProps, MetricCard, type MetricCardProps, MetricsGrid, type MetricsGridProps, NavigationMenu, NavigationMenuContent, type NavigationMenuContentProps, NavigationMenuIndicator, type NavigationMenuIndicatorProps, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, type NavigationMenuListProps, type NavigationMenuProps, NavigationMenuTrigger, type NavigationMenuTriggerProps, NavigationMenuViewport, type NavigationMenuViewportProps, Pagination, PaginationContent, type PaginationContentProps, PaginationEllipsis, type PaginationEllipsisProps, PaginationItem, type PaginationItemProps, PaginationLink, type PaginationLinkProps, PaginationNext, type PaginationNextProps, PaginationPrevious, type PaginationPreviousProps, type PaginationProps, Panel, type PanelProps, Popover, PopoverAnchor, PopoverContent, type PopoverContentProps, PopoverTrigger, Progress, type ProgressProps, RadioGroup, RadioGroupItem, type RadioGroupItemProps, type RadioGroupProps, ResizableHandle, type ResizableHandleProps, ResizablePanel, ResizablePanelGroup, type ResizablePanelGroupProps, type ResizablePanelProps, SIDEBAR_COOKIE_MAX_AGE, SIDEBAR_COOKIE_NAME, SIDEBAR_KEYBOARD_SHORTCUT, SIDEBAR_WIDTH, SIDEBAR_WIDTH_ICON, SIDEBAR_WIDTH_MOBILE, ScrollArea, type ScrollAreaProps, ScrollBar, type ScrollBarProps, SearchableSelect, type SearchableSelectOption, type SearchableSelectProps, SecretRevealCard, type SecretRevealCardProps, Select, SelectContent, type SelectContentProps, SelectGroup, SelectItem, type SelectItemProps, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, type SelectTriggerProps, SelectValue, Separator, type SeparatorProps, Sheet, SheetClose, SheetContent, type SheetContentProps, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, type SheetOverlayProps, SheetPortal, SheetTitle, SheetTrigger, Sidebar, SidebarContent, type SidebarContentProps, SidebarContext, type SidebarContextProps, SidebarFooter, type SidebarFooterProps, SidebarGroup, SidebarGroupAction, type SidebarGroupActionProps, SidebarGroupContent, type SidebarGroupContentProps, SidebarGroupLabel, type SidebarGroupLabelProps, type SidebarGroupProps, SidebarHeader, type SidebarHeaderProps, SidebarInput, type SidebarInputProps, SidebarInset, type SidebarInsetProps, SidebarMenu, SidebarMenuAction, type SidebarMenuActionProps, SidebarMenuBadge, type SidebarMenuBadgeProps, SidebarMenuButton, type SidebarMenuButtonProps, SidebarMenuItem, type SidebarMenuItemProps, type SidebarMenuProps, SidebarMenuSkeleton, type SidebarMenuSkeletonProps, SidebarMenuSub, SidebarMenuSubButton, type SidebarMenuSubButtonProps, SidebarMenuSubItem, type SidebarMenuSubItemProps, type SidebarMenuSubProps, type SidebarProps, SidebarProvider, type SidebarProviderProps, SidebarRail, type SidebarRailProps, SidebarSeparator, type SidebarSeparatorProps, SidebarTrigger, type SidebarTriggerProps, Skeleton, type SkeletonProps, Slider, type SliderProps, Stack, type StackAlign, type StackDirection, type StackProps, StatusBadge, type StatusBadgeProps, StatusChip, type StatusChipProps, Switch, type SwitchProps, THEMES, Table, TableBody, type TableBodyProps, TableCaption, type TableCaptionProps, TableCell, type TableCellProps, TableFooter, type TableFooterProps, TableHead, type TableHeadProps, TableHeader, type TableHeaderProps, type TableProps, TableRow, type TableRowProps, Tabs, TabsContent, type TabsContentProps, TabsList, type TabsListProps, TabsTrigger, type TabsTriggerProps, Text, type TextProps, type TextTag, type TextVariant, Textarea, type TextareaProps, type Theme, type ThemeMode, ThemeProvider, type ThemeProviderProps, type ThemeProviderState, type ToastTheme, Toaster, type ToasterProps, Toggle, ToggleGroup, ToggleGroupItem, type ToggleGroupItemProps, type ToggleGroupProps, type ToggleProps, Tooltip, TooltipContent, type TooltipContentProps, TooltipProvider, TooltipTrigger, type TypographyAlign, type TypographyColor, type TypographyWeight, alertVariants, badgeVariants, buttonVariants, cn, cx, getPayloadConfigFromPayload, labelVariants, navigationMenuTriggerStyle, sheetVariants, sidebarMenuButtonVariants, toggleVariants, useCarousel, useChart, useConfig, useFormField, useIsMobile, useSidebar, useTheme };
|