@bizapps/design-system-testing 0.4.3 → 1.0.1
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 +38 -43
- package/dist/inter-cyrillic-ext-wght-normal.woff2 +0 -0
- package/dist/inter-cyrillic-wght-normal.woff2 +0 -0
- package/dist/inter-greek-ext-wght-normal.woff2 +0 -0
- package/dist/inter-greek-wght-normal.woff2 +0 -0
- package/dist/inter-latin-ext-wght-normal.woff2 +0 -0
- package/dist/inter-latin-wght-normal.woff2 +0 -0
- package/dist/inter-vietnamese-wght-normal.woff2 +0 -0
- package/dist/main.cjs +7640 -11
- package/dist/main.cjs.map +1 -1
- package/dist/main.css +1 -1
- package/dist/main.d.cts +1930 -5
- package/dist/main.d.ts +1930 -5
- package/dist/main.js +7364 -13
- package/dist/main.js.map +1 -1
- package/package.json +152 -100
- package/dist/assets/brand/Logo_Total_Civil_Construction/Entrega_Logo_Total.ai +13 -2789
- package/dist/assets/brand/Logo_Total_Civil_Construction/Entrega_Logo_Total.pdf +13 -2947
- package/dist/assets/brand/Logo_Total_Civil_Construction/Entrega_Logo_Total_AW.png +0 -0
- package/dist/assets/brand/Logo_Total_Civil_Construction/Entrega_Logo_Total_CB.png +0 -0
- package/dist/assets/brand/Logo_Total_Civil_Construction/Entrega_Logo_Total_CBT.png +0 -0
- package/dist/assets/brand/Logo_Total_Civil_Construction/Entrega_Logo_Total_CC.png +0 -0
- package/dist/assets/brand/Logo_Total_Civil_Construction/Entrega_Logo_Total_M.png +0 -0
- package/dist/assets/brand/Logo_Total_Civil_Construction/Entrega_Logo_Total_NT.png +0 -0
- package/dist/assets/brand/Logo_Total_Civil_Construction_Optimize/Entrega_Logo_Total_AW.webp +0 -0
- package/dist/assets/brand/Logo_Total_Civil_Construction_Optimize/Entrega_Logo_Total_CB.webp +0 -0
- package/dist/assets/brand/Logo_Total_Civil_Construction_Optimize/Entrega_Logo_Total_CBT.webp +0 -0
- package/dist/assets/brand/Logo_Total_Civil_Construction_Optimize/Entrega_Logo_Total_CC.webp +0 -0
- package/dist/assets/brand/Logo_Total_Civil_Construction_Optimize/Entrega_Logo_Total_M.webp +0 -0
- package/dist/assets/brand/Logo_Total_Civil_Construction_Optimize/Entrega_Logo_Total_NT.webp +0 -0
- package/dist/assets/brand/favicon.svg +0 -7
- package/dist/assets/fonts/Dax-Bold/Dax-Bold.otf +0 -0
- package/dist/assets/fonts/Helvetica-Neue/HelveticaNeueBlack.otf +0 -0
- package/dist/assets/fonts/Helvetica-Neue/HelveticaNeueBlackItalic.otf +0 -0
- package/dist/assets/fonts/Helvetica-Neue/HelveticaNeueBold.otf +0 -0
- package/dist/assets/fonts/Helvetica-Neue/HelveticaNeueBoldItalic.otf +0 -0
- package/dist/assets/fonts/Helvetica-Neue/HelveticaNeueHeavy.otf +0 -0
- package/dist/assets/fonts/Helvetica-Neue/HelveticaNeueHeavyItalic.otf +0 -0
- package/dist/assets/fonts/Helvetica-Neue/HelveticaNeueItalic.ttf +0 -0
- package/dist/assets/fonts/Helvetica-Neue/HelveticaNeueLight.otf +0 -0
- package/dist/assets/fonts/Helvetica-Neue/HelveticaNeueLightItalic.otf +0 -0
- package/dist/assets/fonts/Helvetica-Neue/HelveticaNeueMedium.otf +0 -0
- package/dist/assets/fonts/Helvetica-Neue/HelveticaNeueMediumItalic.otf +0 -0
- package/dist/assets/fonts/Helvetica-Neue/HelveticaNeueRoman.otf +0 -0
- package/dist/assets/fonts/Helvetica-Neue/HelveticaNeueThin.otf +0 -0
- package/dist/assets/fonts/Helvetica-Neue/HelveticaNeueThinItalic.otf +0 -0
- package/dist/assets/fonts/Helvetica-Neue/HelveticaNeueUltraLight.otf +0 -0
- package/dist/assets/fonts/Helvetica-Neue/HelveticaNeueUltraLightItalic.otf +0 -0
- package/dist/assets/fonts/dax-regular/dax-regular.ttf +0 -0
package/dist/main.d.cts
CHANGED
|
@@ -1,15 +1,1940 @@
|
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
2
|
import * as class_variance_authority_types from 'class-variance-authority/types';
|
|
3
|
-
import * as
|
|
3
|
+
import * as class_variance_authority from 'class-variance-authority';
|
|
4
4
|
import { VariantProps } from 'class-variance-authority';
|
|
5
|
+
import * as react from 'react';
|
|
6
|
+
import { HTMLAttributes, ReactNode, ComponentProps, ButtonHTMLAttributes, MouseEventHandler, SVGAttributes } from 'react';
|
|
7
|
+
import { Avatar as Avatar$1, Toggle as Toggle$1, ToggleGroup as ToggleGroup$1, Select as Select$1, Separator as Separator$1, Progress as Progress$1, Slider as Slider$1, Switch as Switch$1, Tabs as Tabs$1, Tooltip as Tooltip$1, Popover as Popover$1, Dialog as Dialog$1, AlertDialog as AlertDialog$1, Accordion as Accordion$1, DropdownMenu as DropdownMenu$1, RadioGroup as RadioGroup$1, NavigationMenu as NavigationMenu$1, Checkbox as Checkbox$1 } from 'radix-ui';
|
|
8
|
+
import { DayPicker, DayButton, Locale, DateRange } from 'react-day-picker';
|
|
9
|
+
export { DateRange } from 'react-day-picker';
|
|
10
|
+
import useEmblaCarousel, { UseEmblaCarouselType } from 'embla-carousel-react';
|
|
11
|
+
import { DropzoneOptions, FileRejection, DropEvent } from 'react-dropzone';
|
|
12
|
+
import Color from 'color';
|
|
13
|
+
import * as react_hook_form from 'react-hook-form';
|
|
14
|
+
import { UseFormProps, FieldValues } from 'react-hook-form';
|
|
15
|
+
export { Controller, useFieldArray } from 'react-hook-form';
|
|
16
|
+
import { ZodType, z } from 'zod';
|
|
17
|
+
import { ColumnDef, SortingState, ColumnFiltersState, Row, RowSelectionState, Table as Table$1, VisibilityState, ColumnSizingState, Header, Updater, Column } from '@tanstack/react-table';
|
|
18
|
+
export { Column, ColumnDef, ColumnFiltersState, Row, SortingState, Table as TanStackTableType, createColumnHelper } from '@tanstack/react-table';
|
|
5
19
|
|
|
6
|
-
declare const
|
|
7
|
-
variant?: "
|
|
20
|
+
declare const alertVariants: (props?: ({
|
|
21
|
+
variant?: "default" | "info" | "success" | "warning" | "error" | null | undefined;
|
|
22
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
23
|
+
interface AlertProps extends HTMLAttributes<HTMLDivElement>, VariantProps<typeof alertVariants> {
|
|
24
|
+
icon?: ReactNode;
|
|
25
|
+
onDismiss?: () => void;
|
|
26
|
+
}
|
|
27
|
+
type AlertTitleProps = HTMLAttributes<HTMLHeadingElement>;
|
|
28
|
+
type AlertDescriptionProps = HTMLAttributes<HTMLParagraphElement>;
|
|
29
|
+
declare function Alert({ className, variant, icon, onDismiss, children, ...props }: AlertProps): react_jsx_runtime.JSX.Element;
|
|
30
|
+
declare function AlertTitle({ className, ...props }: AlertTitleProps): react_jsx_runtime.JSX.Element;
|
|
31
|
+
declare function AlertDescription({ className, ...props }: AlertDescriptionProps): react_jsx_runtime.JSX.Element;
|
|
32
|
+
|
|
33
|
+
declare const avatarVariants: (props?: ({
|
|
34
|
+
size?: "sm" | "md" | "lg" | "xl" | null | undefined;
|
|
35
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
36
|
+
declare function Avatar({ className, size, ...props }: ComponentProps<typeof Avatar$1.Root> & VariantProps<typeof avatarVariants>): react_jsx_runtime.JSX.Element;
|
|
37
|
+
declare function AvatarImage({ className, ...props }: ComponentProps<typeof Avatar$1.Image>): react_jsx_runtime.JSX.Element;
|
|
38
|
+
declare function AvatarFallback({ className, ...props }: ComponentProps<typeof Avatar$1.Fallback>): react_jsx_runtime.JSX.Element;
|
|
39
|
+
declare function AvatarBadge({ className, ...props }: ComponentProps<'span'>): react_jsx_runtime.JSX.Element;
|
|
40
|
+
declare function AvatarGroup({ className, ...props }: ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
41
|
+
declare function AvatarGroupCount({ className, ...props }: ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
42
|
+
|
|
43
|
+
declare const badgeVariants$1: (props?: ({
|
|
44
|
+
variant?: "default" | "link" | "secondary" | "destructive" | "outline" | "ghost" | null | undefined;
|
|
45
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
46
|
+
declare function Badge$1({ className, variant, asChild, ...props }: ComponentProps<'span'> & VariantProps<typeof badgeVariants$1> & {
|
|
47
|
+
asChild?: boolean;
|
|
48
|
+
}): react_jsx_runtime.JSX.Element;
|
|
49
|
+
|
|
50
|
+
type StatusProps = ComponentProps<typeof Badge$1> & {
|
|
51
|
+
status: 'online' | 'offline' | 'maintenance' | 'degraded';
|
|
52
|
+
};
|
|
53
|
+
declare const Status: ({ className, status, ...props }: StatusProps) => react_jsx_runtime.JSX.Element;
|
|
54
|
+
type StatusIndicatorProps = HTMLAttributes<HTMLSpanElement>;
|
|
55
|
+
declare const StatusIndicator: ({ className, ...props }: StatusIndicatorProps) => react_jsx_runtime.JSX.Element;
|
|
56
|
+
type StatusLabelProps = HTMLAttributes<HTMLSpanElement>;
|
|
57
|
+
declare const StatusLabel: ({ className, children, ...props }: StatusLabelProps) => react_jsx_runtime.JSX.Element;
|
|
58
|
+
|
|
59
|
+
declare const badgeVariants: (props?: ({
|
|
60
|
+
variant?: "default" | "link" | "secondary" | "destructive" | "outline" | "ghost" | null | undefined;
|
|
61
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
62
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
63
|
+
declare function Badge({ className, variant, size, asChild, ...props }: ComponentProps<'span'> & VariantProps<typeof badgeVariants> & {
|
|
64
|
+
asChild?: boolean;
|
|
65
|
+
}): react_jsx_runtime.JSX.Element;
|
|
66
|
+
|
|
67
|
+
/**
|
|
68
|
+
* Root landmark for a breadcrumb trail. Renders a `<nav aria-label="breadcrumb">`
|
|
69
|
+
* and wraps a single {@link BreadcrumbList}.
|
|
70
|
+
*/
|
|
71
|
+
declare function Breadcrumb({ className, ...props }: ComponentProps<'nav'>): react_jsx_runtime.JSX.Element;
|
|
72
|
+
/**
|
|
73
|
+
* Ordered list (`<ol>`) holding the trail. Lays the items out in a wrapping,
|
|
74
|
+
* gapped flex row and sets the default `text-main-grey` color and `text-sm` scale.
|
|
75
|
+
*/
|
|
76
|
+
declare function BreadcrumbList({ className, ...props }: ComponentProps<'ol'>): react_jsx_runtime.JSX.Element;
|
|
77
|
+
/**
|
|
78
|
+
* A single segment (`<li>`) of the trail. Wraps a {@link BreadcrumbLink},
|
|
79
|
+
* {@link BreadcrumbPage}, or {@link BreadcrumbEllipsis}.
|
|
80
|
+
*/
|
|
81
|
+
declare function BreadcrumbItem({ className, ...props }: ComponentProps<'li'>): react_jsx_runtime.JSX.Element;
|
|
82
|
+
/**
|
|
83
|
+
* Navigable ancestor in the trail. Renders an `<a>` by default; pass `asChild`
|
|
84
|
+
* to delegate to a router link (e.g. React Router / Next.js `Link`) while keeping
|
|
85
|
+
* the hover and focus styles.
|
|
86
|
+
*
|
|
87
|
+
* @param asChild - Render the child element instead of an `<a>` (Radix `Slot`).
|
|
88
|
+
*/
|
|
89
|
+
declare function BreadcrumbLink({ asChild, className, ...props }: ComponentProps<'a'> & {
|
|
90
|
+
asChild?: boolean;
|
|
91
|
+
}): react_jsx_runtime.JSX.Element;
|
|
92
|
+
/**
|
|
93
|
+
* The current page — the last, non-interactive segment. Renders a `<span>` with
|
|
94
|
+
* `aria-current="page"` and emphasized `text-main-blue-primary` color.
|
|
95
|
+
*/
|
|
96
|
+
declare function BreadcrumbPage({ className, ...props }: ComponentProps<'span'>): react_jsx_runtime.JSX.Element;
|
|
97
|
+
/**
|
|
98
|
+
* Visual divider between items. Defaults to a `ChevronRight` icon; pass any node
|
|
99
|
+
* as children to override it. Always `aria-hidden`, so overrides never reach
|
|
100
|
+
* assistive tech.
|
|
101
|
+
*/
|
|
102
|
+
declare function BreadcrumbSeparator({ children, className, ...props }: ComponentProps<'li'>): react_jsx_runtime.JSX.Element;
|
|
103
|
+
/**
|
|
104
|
+
* Truncation marker (`…`) that collapses hidden middle segments of a long trail.
|
|
105
|
+
* Pair it with a `DropdownMenu` to make the collapsed segments navigable.
|
|
106
|
+
*/
|
|
107
|
+
declare function BreadcrumbEllipsis({ className, ...props }: ComponentProps<'span'>): react_jsx_runtime.JSX.Element;
|
|
108
|
+
|
|
109
|
+
declare const buttonVariants$1: (props?: ({
|
|
110
|
+
variant?: "secondary" | "outline" | "ghost" | "cancel" | "primary" | "cancelGhost" | null | undefined;
|
|
8
111
|
size?: "sm" | "md" | "lg" | "icon-sm" | null | undefined;
|
|
9
112
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
10
|
-
|
|
113
|
+
/**
|
|
114
|
+
* Interactive button with 6 variants and 4 sizes. Use `asChild` to render as any element via Radix Slot.
|
|
115
|
+
* When `isLoading` is true, a spinner is shown and clicks are blocked while keeping the not-allowed cursor.
|
|
116
|
+
*/
|
|
117
|
+
declare function Button$1({ className, variant, size, asChild, isLoading, children, onClick, ...props }: ComponentProps<'button'> & VariantProps<typeof buttonVariants$1> & {
|
|
11
118
|
asChild?: boolean;
|
|
12
119
|
isLoading?: boolean;
|
|
13
120
|
}): react_jsx_runtime.JSX.Element;
|
|
14
121
|
|
|
15
|
-
|
|
122
|
+
declare function Calendar({ className, classNames, showOutsideDays, captionLayout, buttonVariant, locale, formatters, components, fromYear, toYear, ...props }: ComponentProps<typeof DayPicker> & {
|
|
123
|
+
buttonVariant?: ComponentProps<typeof Button$1>['variant'];
|
|
124
|
+
fromYear?: number;
|
|
125
|
+
toYear?: number;
|
|
126
|
+
}): react_jsx_runtime.JSX.Element;
|
|
127
|
+
declare function CalendarDayButton({ className, day, modifiers, locale, ...props }: ComponentProps<typeof DayButton> & {
|
|
128
|
+
locale?: Partial<Locale>;
|
|
129
|
+
}): react_jsx_runtime.JSX.Element;
|
|
130
|
+
|
|
131
|
+
type MiniCalendarProps = HTMLAttributes<HTMLDivElement> & {
|
|
132
|
+
value?: Date;
|
|
133
|
+
defaultValue?: Date;
|
|
134
|
+
onValueChange?: (date: Date | undefined) => void;
|
|
135
|
+
startDate?: Date;
|
|
136
|
+
defaultStartDate?: Date;
|
|
137
|
+
onStartDateChange?: (date: Date | undefined) => void;
|
|
138
|
+
days?: number;
|
|
139
|
+
};
|
|
140
|
+
declare const MiniCalendar: ({ value, defaultValue, onValueChange, startDate, defaultStartDate, onStartDateChange, days, className, children, ...props }: MiniCalendarProps) => react_jsx_runtime.JSX.Element;
|
|
141
|
+
type MiniCalendarNavigationProps = ButtonHTMLAttributes<HTMLButtonElement> & {
|
|
142
|
+
direction: 'prev' | 'next';
|
|
143
|
+
asChild?: boolean;
|
|
144
|
+
};
|
|
145
|
+
declare const MiniCalendarNavigation: ({ direction, asChild, children, onClick, ...props }: MiniCalendarNavigationProps) => react_jsx_runtime.JSX.Element;
|
|
146
|
+
type MiniCalendarDaysProps = Omit<HTMLAttributes<HTMLDivElement>, 'children'> & {
|
|
147
|
+
children: (date: Date) => ReactNode;
|
|
148
|
+
};
|
|
149
|
+
declare const MiniCalendarDays: ({ className, children, ...props }: MiniCalendarDaysProps) => react_jsx_runtime.JSX.Element;
|
|
150
|
+
type MiniCalendarDayProps = ComponentProps<typeof Button$1> & {
|
|
151
|
+
date: Date;
|
|
152
|
+
};
|
|
153
|
+
declare const MiniCalendarDay: ({ date, className, ...props }: MiniCalendarDayProps) => react_jsx_runtime.JSX.Element;
|
|
154
|
+
|
|
155
|
+
declare function Card({ className, size, ...props }: ComponentProps<'div'> & {
|
|
156
|
+
size?: 'default' | 'sm';
|
|
157
|
+
}): react_jsx_runtime.JSX.Element;
|
|
158
|
+
declare function CardHeader({ className, ...props }: ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
159
|
+
declare function CardTitle({ className, ...props }: ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
160
|
+
declare function CardDescription({ className, ...props }: ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
161
|
+
declare function CardAction({ className, ...props }: ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
162
|
+
declare function CardContent({ className, ...props }: ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
163
|
+
declare function CardFooter({ className, ...props }: ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
164
|
+
|
|
165
|
+
type CarouselApi = UseEmblaCarouselType[1];
|
|
166
|
+
type UseCarouselParameters = Parameters<typeof useEmblaCarousel>;
|
|
167
|
+
type CarouselOptions = UseCarouselParameters[0];
|
|
168
|
+
type CarouselPlugin = UseCarouselParameters[1];
|
|
169
|
+
type CarouselProps = {
|
|
170
|
+
opts?: CarouselOptions;
|
|
171
|
+
plugins?: CarouselPlugin;
|
|
172
|
+
orientation?: 'horizontal' | 'vertical';
|
|
173
|
+
setApi?: (api: CarouselApi) => void;
|
|
174
|
+
};
|
|
175
|
+
type CarouselContextProps = {
|
|
176
|
+
carouselRef: ReturnType<typeof useEmblaCarousel>[0];
|
|
177
|
+
api: ReturnType<typeof useEmblaCarousel>[1];
|
|
178
|
+
scrollPrev: () => void;
|
|
179
|
+
scrollNext: () => void;
|
|
180
|
+
canScrollPrev: boolean;
|
|
181
|
+
canScrollNext: boolean;
|
|
182
|
+
} & CarouselProps;
|
|
183
|
+
declare function useCarousel(): CarouselContextProps;
|
|
184
|
+
/**
|
|
185
|
+
* Carousel root. Wraps Embla Carousel with keyboard navigation, scroll state, and context.
|
|
186
|
+
* Use `orientation` for vertical mode and `opts` to pass Embla options directly.
|
|
187
|
+
*/
|
|
188
|
+
declare function Carousel({ orientation, opts, setApi, plugins, className, children, ...props }: ComponentProps<'div'> & CarouselProps): react_jsx_runtime.JSX.Element;
|
|
189
|
+
/**
|
|
190
|
+
* Scrollable track wrapper. Direct child of `Carousel`. Wraps `CarouselItem` children.
|
|
191
|
+
*/
|
|
192
|
+
declare function CarouselContent({ className, ...props }: ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
193
|
+
/**
|
|
194
|
+
* Individual slide. Use `className` with `basis-*` utilities to control how many slides are visible.
|
|
195
|
+
*/
|
|
196
|
+
declare function CarouselItem({ className, ...props }: ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
197
|
+
/**
|
|
198
|
+
* Previous-slide button. Positioned absolutely to the left (horizontal) or top (vertical).
|
|
199
|
+
* Disabled automatically when there are no previous slides.
|
|
200
|
+
*/
|
|
201
|
+
declare function CarouselPrevious({ className, variant, size, ...props }: ComponentProps<typeof Button$1>): react_jsx_runtime.JSX.Element;
|
|
202
|
+
/**
|
|
203
|
+
* Next-slide button. Positioned absolutely to the right (horizontal) or bottom (vertical).
|
|
204
|
+
* Disabled automatically when there are no next slides.
|
|
205
|
+
*/
|
|
206
|
+
declare function CarouselNext({ className, variant, size, ...props }: ComponentProps<typeof Button$1>): react_jsx_runtime.JSX.Element;
|
|
207
|
+
|
|
208
|
+
declare function Field({ className, ...props }: ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
209
|
+
declare function FieldLabel({ className, ...props }: ComponentProps<'label'>): react_jsx_runtime.JSX.Element;
|
|
210
|
+
declare function FieldDescription({ className, ...props }: ComponentProps<'p'>): react_jsx_runtime.JSX.Element;
|
|
211
|
+
declare function FieldError({ errors, className }: {
|
|
212
|
+
errors?: unknown[];
|
|
213
|
+
className?: string;
|
|
214
|
+
}): react_jsx_runtime.JSX.Element | null;
|
|
215
|
+
declare function FieldGroup({ className, ...props }: ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
216
|
+
|
|
217
|
+
declare function Input({ className, type, ...props }: ComponentProps<'input'>): react_jsx_runtime.JSX.Element;
|
|
218
|
+
|
|
219
|
+
declare const linkVariants: (props?: ({
|
|
220
|
+
variant?: "underlined" | "plain" | null | undefined;
|
|
221
|
+
size?: "sm" | "md" | "lg" | "xs" | null | undefined;
|
|
222
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
223
|
+
declare function Link({ className, variant, size, asChild, disabled, target, rel, href, truncate, children, onClick, ...props }: Omit<ComponentProps<'a'>, 'onClick'> & VariantProps<typeof linkVariants> & {
|
|
224
|
+
asChild?: boolean;
|
|
225
|
+
disabled?: boolean;
|
|
226
|
+
truncate?: boolean;
|
|
227
|
+
onClick?: MouseEventHandler<HTMLElement>;
|
|
228
|
+
}): react_jsx_runtime.JSX.Element;
|
|
229
|
+
|
|
230
|
+
interface PinInputProps {
|
|
231
|
+
length?: number;
|
|
232
|
+
value?: string;
|
|
233
|
+
onChange?: (value: string) => void;
|
|
234
|
+
disabled?: boolean;
|
|
235
|
+
invalid?: boolean;
|
|
236
|
+
mask?: boolean;
|
|
237
|
+
className?: string;
|
|
238
|
+
inputClassName?: string;
|
|
239
|
+
}
|
|
240
|
+
declare function PinInput({ length, value, onChange, disabled, invalid, mask, className, inputClassName, }: PinInputProps): react_jsx_runtime.JSX.Element;
|
|
241
|
+
|
|
242
|
+
declare const toggleVariants: (props?: ({
|
|
243
|
+
variant?: "default" | "outline" | null | undefined;
|
|
244
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
245
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
246
|
+
declare function Toggle({ className, variant, size, ...props }: ComponentProps<typeof Toggle$1.Root> & VariantProps<typeof toggleVariants>): react_jsx_runtime.JSX.Element;
|
|
247
|
+
|
|
248
|
+
type SegmentedControlSingleProps = {
|
|
249
|
+
type: 'single';
|
|
250
|
+
value?: string;
|
|
251
|
+
defaultValue?: string;
|
|
252
|
+
onValueChange?: (value: string) => void;
|
|
253
|
+
};
|
|
254
|
+
type SegmentedControlMultipleProps = {
|
|
255
|
+
type: 'multiple';
|
|
256
|
+
value?: string[];
|
|
257
|
+
defaultValue?: string[];
|
|
258
|
+
onValueChange?: (value: string[]) => void;
|
|
259
|
+
};
|
|
260
|
+
type SegmentedControlProps = (SegmentedControlSingleProps | SegmentedControlMultipleProps) & VariantProps<typeof toggleVariants> & {
|
|
261
|
+
disabled?: boolean;
|
|
262
|
+
className?: string;
|
|
263
|
+
children?: ReactNode;
|
|
264
|
+
};
|
|
265
|
+
declare function SegmentedControl({ className, size, children, ...props }: SegmentedControlProps): react_jsx_runtime.JSX.Element;
|
|
266
|
+
declare function SegmentedControlItem({ className, children, value, ...props }: ComponentProps<typeof ToggleGroup$1.Item> & VariantProps<typeof toggleVariants>): react_jsx_runtime.JSX.Element;
|
|
267
|
+
|
|
268
|
+
declare function Select({ ...props }: ComponentProps<typeof Select$1.Root>): react_jsx_runtime.JSX.Element;
|
|
269
|
+
declare function SelectTrigger$1({ className, children, ...props }: ComponentProps<typeof Select$1.Trigger>): react_jsx_runtime.JSX.Element;
|
|
270
|
+
declare function SelectContent({ className, children, position, ...props }: ComponentProps<typeof Select$1.Content>): react_jsx_runtime.JSX.Element;
|
|
271
|
+
declare function SelectItem({ className, children, ...props }: ComponentProps<typeof Select$1.Item>): react_jsx_runtime.JSX.Element;
|
|
272
|
+
declare function SelectLabel({ className, ...props }: ComponentProps<typeof Select$1.Label>): react_jsx_runtime.JSX.Element;
|
|
273
|
+
declare function SelectSeparator({ className, ...props }: ComponentProps<typeof Select$1.Separator>): react_jsx_runtime.JSX.Element;
|
|
274
|
+
declare function SelectScrollUpButton({ className, ...props }: ComponentProps<typeof Select$1.ScrollUpButton>): react_jsx_runtime.JSX.Element;
|
|
275
|
+
declare function SelectScrollDownButton({ className, ...props }: ComponentProps<typeof Select$1.ScrollDownButton>): react_jsx_runtime.JSX.Element;
|
|
276
|
+
declare function SelectValue({ ...props }: ComponentProps<typeof Select$1.Value>): react_jsx_runtime.JSX.Element;
|
|
277
|
+
declare function SelectGroup({ ...props }: ComponentProps<typeof Select$1.Group>): react_jsx_runtime.JSX.Element;
|
|
278
|
+
|
|
279
|
+
declare function Separator({ className, orientation, decorative, ...props }: ComponentProps<typeof Separator$1.Root>): react_jsx_runtime.JSX.Element;
|
|
280
|
+
|
|
281
|
+
declare const progressVariants: (props?: ({
|
|
282
|
+
variant?: "default" | "success" | "warning" | "danger" | "orange" | null | undefined;
|
|
283
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
284
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
285
|
+
declare const progressIndicatorVariants: (props?: ({
|
|
286
|
+
variant?: "default" | "success" | "warning" | "danger" | "orange" | null | undefined;
|
|
287
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
288
|
+
interface ProgressProps extends ComponentProps<typeof Progress$1.Root>, VariantProps<typeof progressVariants> {
|
|
289
|
+
}
|
|
290
|
+
declare function Progress({ className, value, variant, size, ...props }: ProgressProps): react_jsx_runtime.JSX.Element;
|
|
291
|
+
|
|
292
|
+
declare const skeletonVariants: (props?: ({
|
|
293
|
+
variant?: "default" | "text" | "avatar" | null | undefined;
|
|
294
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
295
|
+
declare function Skeleton({ className, variant, ...props }: ComponentProps<'div'> & VariantProps<typeof skeletonVariants>): react_jsx_runtime.JSX.Element;
|
|
296
|
+
|
|
297
|
+
declare function Slider({ className, defaultValue, value, min, max, ...props }: ComponentProps<typeof Slider$1.Root>): react_jsx_runtime.JSX.Element;
|
|
298
|
+
|
|
299
|
+
declare function Switch({ className, size, ...props }: ComponentProps<typeof Switch$1.Root> & {
|
|
300
|
+
size?: 'sm' | 'default';
|
|
301
|
+
}): react_jsx_runtime.JSX.Element;
|
|
302
|
+
|
|
303
|
+
declare function Tabs({ defaultValue, value: controlledValue, onValueChange, ...props }: ComponentProps<typeof Tabs$1.Root>): react_jsx_runtime.JSX.Element;
|
|
304
|
+
declare function TabsList({ className, ...props }: ComponentProps<typeof Tabs$1.List>): react_jsx_runtime.JSX.Element;
|
|
305
|
+
declare function TabsTrigger({ className, value, children, ...props }: ComponentProps<typeof Tabs$1.Trigger>): react_jsx_runtime.JSX.Element;
|
|
306
|
+
declare function TabsContent({ className, value, children, ...props }: ComponentProps<typeof Tabs$1.Content>): react_jsx_runtime.JSX.Element;
|
|
307
|
+
|
|
308
|
+
type ToastType = 'default' | 'success' | 'error' | 'warning' | 'info' | 'loading';
|
|
309
|
+
interface ToastAction {
|
|
310
|
+
label: string;
|
|
311
|
+
onClick: () => void;
|
|
312
|
+
}
|
|
313
|
+
interface ToastItem {
|
|
314
|
+
id: string;
|
|
315
|
+
type: ToastType;
|
|
316
|
+
title: string;
|
|
317
|
+
description?: string;
|
|
318
|
+
duration: number;
|
|
319
|
+
action?: ToastAction;
|
|
320
|
+
}
|
|
321
|
+
type ToastOptions = Partial<Omit<ToastItem, 'id' | 'title' | 'type'>> & {
|
|
322
|
+
id?: string;
|
|
323
|
+
};
|
|
324
|
+
interface PromiseMessages<T> {
|
|
325
|
+
loading: string;
|
|
326
|
+
success: string | ((data: T) => string);
|
|
327
|
+
error: string | ((err: unknown) => string);
|
|
328
|
+
}
|
|
329
|
+
declare function useToast(): ((title: string, options?: ToastOptions) => string) & {
|
|
330
|
+
success: (title: string, options?: ToastOptions) => string;
|
|
331
|
+
error: (title: string, options?: ToastOptions) => string;
|
|
332
|
+
warning: (title: string, options?: ToastOptions) => string;
|
|
333
|
+
info: (title: string, options?: ToastOptions) => string;
|
|
334
|
+
loading: (title: string, options?: ToastOptions) => string;
|
|
335
|
+
dismiss: (id: string) => void;
|
|
336
|
+
promise: <T>(promise: Promise<T>, messages: PromiseMessages<T>) => string;
|
|
337
|
+
};
|
|
338
|
+
type ToasterPosition = 'top-right' | 'top-left' | 'top-center' | 'bottom-right' | 'bottom-left' | 'bottom-center';
|
|
339
|
+
interface ToasterProps {
|
|
340
|
+
position?: ToasterPosition;
|
|
341
|
+
richColors?: boolean;
|
|
342
|
+
closeButton?: boolean;
|
|
343
|
+
duration?: number;
|
|
344
|
+
children?: ReactNode;
|
|
345
|
+
}
|
|
346
|
+
declare function Toaster({ position, children }: ToasterProps): react_jsx_runtime.JSX.Element;
|
|
347
|
+
|
|
348
|
+
declare function ToggleGroup({ className, variant, size, spacing, orientation, children, ...props }: ComponentProps<typeof ToggleGroup$1.Root> & VariantProps<typeof toggleVariants> & {
|
|
349
|
+
spacing?: number;
|
|
350
|
+
orientation?: 'horizontal' | 'vertical';
|
|
351
|
+
}): react_jsx_runtime.JSX.Element;
|
|
352
|
+
declare function ToggleGroupItem({ className, children, variant, size, ...props }: ComponentProps<typeof ToggleGroup$1.Item> & VariantProps<typeof toggleVariants>): react_jsx_runtime.JSX.Element;
|
|
353
|
+
|
|
354
|
+
declare const tooltipContentVariants: (props?: ({
|
|
355
|
+
variant?: "default" | "primary" | null | undefined;
|
|
356
|
+
size?: "sm" | "md" | null | undefined;
|
|
357
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
358
|
+
declare function TooltipProvider({ delayDuration, ...props }: ComponentProps<typeof Tooltip$1.Provider>): react_jsx_runtime.JSX.Element;
|
|
359
|
+
declare function Tooltip({ ...props }: ComponentProps<typeof Tooltip$1.Root>): react_jsx_runtime.JSX.Element;
|
|
360
|
+
declare function TooltipTrigger({ ...props }: ComponentProps<typeof Tooltip$1.Trigger>): react_jsx_runtime.JSX.Element;
|
|
361
|
+
declare function TooltipContent({ className, sideOffset, variant, size, children, ...props }: ComponentProps<typeof Tooltip$1.Content> & VariantProps<typeof tooltipContentVariants>): react_jsx_runtime.JSX.Element;
|
|
362
|
+
|
|
363
|
+
declare function Popover({ ...props }: ComponentProps<typeof Popover$1.Root>): react_jsx_runtime.JSX.Element;
|
|
364
|
+
declare function PopoverTrigger({ ...props }: ComponentProps<typeof Popover$1.Trigger>): react_jsx_runtime.JSX.Element;
|
|
365
|
+
declare function PopoverContent({ className, align, sideOffset, ...props }: ComponentProps<typeof Popover$1.Content>): react_jsx_runtime.JSX.Element;
|
|
366
|
+
declare function PopoverAnchor({ ...props }: ComponentProps<typeof Popover$1.Anchor>): react_jsx_runtime.JSX.Element;
|
|
367
|
+
declare function PopoverHeader({ className, ...props }: ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
368
|
+
declare function PopoverTitle({ className, ...props }: ComponentProps<'h2'>): react_jsx_runtime.JSX.Element;
|
|
369
|
+
declare function PopoverDescription({ className, ...props }: ComponentProps<'p'>): react_jsx_runtime.JSX.Element;
|
|
370
|
+
|
|
371
|
+
declare const TEXT_SIZES: readonly [12, 14, 16, 18, 20, 24, 28, 32, 40, 48];
|
|
372
|
+
declare const TEXT_WEIGHTS: readonly [100, 200, 300, 400, 500, 700, 800, 900];
|
|
373
|
+
type TextSize = (typeof TEXT_SIZES)[number];
|
|
374
|
+
type TextWeight = (typeof TEXT_WEIGHTS)[number];
|
|
375
|
+
type TextAs = 'p' | 'span' | 'label' | 'small' | 'strong' | 'em';
|
|
376
|
+
interface TextProps extends Omit<HTMLAttributes<HTMLElement>, 'color'> {
|
|
377
|
+
/** HTML element to render */
|
|
378
|
+
as?: TextAs;
|
|
379
|
+
/** Font size in pixels */
|
|
380
|
+
size?: TextSize;
|
|
381
|
+
/** Font weight */
|
|
382
|
+
weight?: TextWeight;
|
|
383
|
+
/** Italic style */
|
|
384
|
+
italic?: boolean;
|
|
385
|
+
/** Optional CSS color value */
|
|
386
|
+
color?: string;
|
|
387
|
+
/** Text content */
|
|
388
|
+
children: ReactNode;
|
|
389
|
+
}
|
|
390
|
+
declare function Text({ as: Tag, size, weight, italic, color, className, style, children, ...props }: TextProps): react_jsx_runtime.JSX.Element;
|
|
391
|
+
|
|
392
|
+
declare function Dialog({ children, ...props }: ComponentProps<typeof Dialog$1.Root>): react_jsx_runtime.JSX.Element;
|
|
393
|
+
declare function DialogTrigger({ ...props }: ComponentProps<typeof Dialog$1.Trigger>): react_jsx_runtime.JSX.Element;
|
|
394
|
+
declare function DialogPortal({ children, ...props }: ComponentProps<typeof Dialog$1.Portal>): react_jsx_runtime.JSX.Element;
|
|
395
|
+
declare function DialogClose({ ...props }: ComponentProps<typeof Dialog$1.Close>): react_jsx_runtime.JSX.Element;
|
|
396
|
+
declare function DialogOverlay({ className, ...props }: ComponentProps<typeof Dialog$1.Overlay>): react_jsx_runtime.JSX.Element;
|
|
397
|
+
declare function DialogContent({ className, children, showCloseButton, ...props }: ComponentProps<typeof Dialog$1.Content> & {
|
|
398
|
+
showCloseButton?: boolean;
|
|
399
|
+
}): react_jsx_runtime.JSX.Element;
|
|
400
|
+
declare function DialogHeader({ className, ...props }: ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
401
|
+
declare function DialogFooter({ className, showCloseButton, children, ...props }: ComponentProps<'div'> & {
|
|
402
|
+
showCloseButton?: boolean;
|
|
403
|
+
}): react_jsx_runtime.JSX.Element;
|
|
404
|
+
declare function DialogTitle({ className, ...props }: ComponentProps<typeof Dialog$1.Title>): react_jsx_runtime.JSX.Element;
|
|
405
|
+
declare function DialogDescription({ className, ...props }: ComponentProps<typeof Dialog$1.Description>): react_jsx_runtime.JSX.Element;
|
|
406
|
+
|
|
407
|
+
declare function AlertDialog({ children, ...props }: ComponentProps<typeof AlertDialog$1.Root>): react_jsx_runtime.JSX.Element;
|
|
408
|
+
declare function AlertDialogTrigger({ ...props }: ComponentProps<typeof AlertDialog$1.Trigger>): react_jsx_runtime.JSX.Element;
|
|
409
|
+
declare function AlertDialogPortal({ children, ...props }: ComponentProps<typeof AlertDialog$1.Portal>): react_jsx_runtime.JSX.Element;
|
|
410
|
+
declare function AlertDialogOverlay({ className, ...props }: ComponentProps<typeof AlertDialog$1.Overlay>): react_jsx_runtime.JSX.Element;
|
|
411
|
+
declare function AlertDialogContent({ className, size, variant, showClose, children, ...props }: ComponentProps<typeof AlertDialog$1.Content> & {
|
|
412
|
+
size?: 'default' | 'sm';
|
|
413
|
+
variant?: 'default' | 'dark-glass';
|
|
414
|
+
showClose?: boolean;
|
|
415
|
+
}): react_jsx_runtime.JSX.Element;
|
|
416
|
+
declare function AlertDialogHeader({ className, ...props }: ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
417
|
+
declare function AlertDialogFooter({ className, ...props }: ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
418
|
+
declare function AlertDialogMedia({ className, ...props }: ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
419
|
+
declare function AlertDialogTitle({ className, ...props }: ComponentProps<typeof AlertDialog$1.Title>): react_jsx_runtime.JSX.Element;
|
|
420
|
+
declare function AlertDialogDescription({ className, ...props }: ComponentProps<typeof AlertDialog$1.Description>): react_jsx_runtime.JSX.Element;
|
|
421
|
+
declare function AlertDialogAction({ className, variant, size, children, ...props }: ComponentProps<typeof AlertDialog$1.Action> & Pick<ComponentProps<typeof Button$1>, 'variant' | 'size'>): react_jsx_runtime.JSX.Element;
|
|
422
|
+
declare function AlertDialogCancel({ className, variant, size, children, ...props }: ComponentProps<typeof AlertDialog$1.Cancel> & Pick<ComponentProps<typeof Button$1>, 'variant' | 'size'>): react_jsx_runtime.JSX.Element;
|
|
423
|
+
|
|
424
|
+
declare function Accordion({ className, ...props }: ComponentProps<typeof Accordion$1.Root>): react_jsx_runtime.JSX.Element;
|
|
425
|
+
declare function AccordionItem({ className, ...props }: ComponentProps<typeof Accordion$1.Item>): react_jsx_runtime.JSX.Element;
|
|
426
|
+
declare function AccordionTrigger({ className, children, ...props }: ComponentProps<typeof Accordion$1.Trigger>): react_jsx_runtime.JSX.Element;
|
|
427
|
+
declare function AccordionContent({ className, children, ...props }: ComponentProps<typeof Accordion$1.Content>): react_jsx_runtime.JSX.Element;
|
|
428
|
+
|
|
429
|
+
interface ComboboxOption {
|
|
430
|
+
value: string;
|
|
431
|
+
label: string;
|
|
432
|
+
disabled?: boolean;
|
|
433
|
+
}
|
|
434
|
+
interface ComboboxProps {
|
|
435
|
+
options: ComboboxOption[];
|
|
436
|
+
value?: string;
|
|
437
|
+
onValueChange?: (value: string) => void;
|
|
438
|
+
placeholder?: string;
|
|
439
|
+
searchPlaceholder?: string;
|
|
440
|
+
emptyMessage?: string;
|
|
441
|
+
disabled?: boolean;
|
|
442
|
+
className?: string;
|
|
443
|
+
}
|
|
444
|
+
declare function Combobox({ options, value, onValueChange, placeholder, searchPlaceholder, emptyMessage, disabled, className, }: ComboboxProps): react_jsx_runtime.JSX.Element;
|
|
445
|
+
|
|
446
|
+
declare function DropdownMenu({ ...props }: ComponentProps<typeof DropdownMenu$1.Root>): react_jsx_runtime.JSX.Element;
|
|
447
|
+
declare function DropdownMenuPortal({ ...props }: ComponentProps<typeof DropdownMenu$1.Portal>): react_jsx_runtime.JSX.Element;
|
|
448
|
+
declare function DropdownMenuTrigger({ ...props }: ComponentProps<typeof DropdownMenu$1.Trigger>): react_jsx_runtime.JSX.Element;
|
|
449
|
+
declare function DropdownMenuContent({ className, align, sideOffset, ...props }: ComponentProps<typeof DropdownMenu$1.Content>): react_jsx_runtime.JSX.Element;
|
|
450
|
+
declare function DropdownMenuGroup({ ...props }: ComponentProps<typeof DropdownMenu$1.Group>): react_jsx_runtime.JSX.Element;
|
|
451
|
+
declare function DropdownMenuItem({ className, inset, variant, ...props }: ComponentProps<typeof DropdownMenu$1.Item> & {
|
|
452
|
+
inset?: boolean;
|
|
453
|
+
variant?: 'default' | 'destructive';
|
|
454
|
+
}): react_jsx_runtime.JSX.Element;
|
|
455
|
+
declare function DropdownMenuCheckboxItem({ className, children, checked, inset, ...props }: ComponentProps<typeof DropdownMenu$1.CheckboxItem> & {
|
|
456
|
+
inset?: boolean;
|
|
457
|
+
}): react_jsx_runtime.JSX.Element;
|
|
458
|
+
declare function DropdownMenuRadioGroup({ ...props }: ComponentProps<typeof DropdownMenu$1.RadioGroup>): react_jsx_runtime.JSX.Element;
|
|
459
|
+
declare function DropdownMenuRadioItem({ className, children, inset, ...props }: ComponentProps<typeof DropdownMenu$1.RadioItem> & {
|
|
460
|
+
inset?: boolean;
|
|
461
|
+
}): react_jsx_runtime.JSX.Element;
|
|
462
|
+
declare function DropdownMenuLabel({ className, inset, ...props }: ComponentProps<typeof DropdownMenu$1.Label> & {
|
|
463
|
+
inset?: boolean;
|
|
464
|
+
}): react_jsx_runtime.JSX.Element;
|
|
465
|
+
declare function DropdownMenuSeparator({ className, ...props }: ComponentProps<typeof DropdownMenu$1.Separator>): react_jsx_runtime.JSX.Element;
|
|
466
|
+
declare function DropdownMenuShortcut({ className, ...props }: ComponentProps<'span'>): react_jsx_runtime.JSX.Element;
|
|
467
|
+
declare function DropdownMenuSub({ ...props }: ComponentProps<typeof DropdownMenu$1.Sub>): react_jsx_runtime.JSX.Element;
|
|
468
|
+
declare function DropdownMenuSubTrigger({ className, inset, children, ...props }: ComponentProps<typeof DropdownMenu$1.SubTrigger> & {
|
|
469
|
+
inset?: boolean;
|
|
470
|
+
}): react_jsx_runtime.JSX.Element;
|
|
471
|
+
declare function DropdownMenuSubContent({ className, ...props }: ComponentProps<typeof DropdownMenu$1.SubContent>): react_jsx_runtime.JSX.Element;
|
|
472
|
+
|
|
473
|
+
type DropzoneProps = Omit<DropzoneOptions, 'onDrop'> & {
|
|
474
|
+
src?: File[];
|
|
475
|
+
className?: string;
|
|
476
|
+
border?: 'default' | 'dashed';
|
|
477
|
+
onDrop?: (acceptedFiles: File[], fileRejections: FileRejection[], event: DropEvent) => void;
|
|
478
|
+
children?: ReactNode;
|
|
479
|
+
};
|
|
480
|
+
declare const Dropzone: ({ accept, maxFiles, maxSize, minSize, onDrop, onError, disabled, src, className, children, border, ...props }: DropzoneProps) => react_jsx_runtime.JSX.Element;
|
|
481
|
+
interface DropzoneContentProps {
|
|
482
|
+
children?: ReactNode;
|
|
483
|
+
className?: string;
|
|
484
|
+
}
|
|
485
|
+
declare const DropzoneContent: ({ children, className }: DropzoneContentProps) => string | number | bigint | true | Iterable<ReactNode> | Promise<string | number | bigint | boolean | react.ReactPortal | react.ReactElement<unknown, string | react.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | react_jsx_runtime.JSX.Element | null;
|
|
486
|
+
interface DropzoneEmptyStateProps {
|
|
487
|
+
children?: ReactNode;
|
|
488
|
+
className?: string;
|
|
489
|
+
}
|
|
490
|
+
declare const DropzoneEmptyState: ({ children, className }: DropzoneEmptyStateProps) => string | number | bigint | true | Iterable<ReactNode> | Promise<string | number | bigint | boolean | react.ReactPortal | react.ReactElement<unknown, string | react.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | react_jsx_runtime.JSX.Element | null;
|
|
491
|
+
|
|
492
|
+
declare function Empty({ className, ...props }: React.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
493
|
+
declare function EmptyHeader({ className, ...props }: React.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
494
|
+
declare const emptyMediaVariants: (props?: ({
|
|
495
|
+
variant?: "default" | "icon" | null | undefined;
|
|
496
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
497
|
+
declare function EmptyMedia({ className, variant, ...props }: React.ComponentProps<'div'> & VariantProps<typeof emptyMediaVariants>): react_jsx_runtime.JSX.Element;
|
|
498
|
+
declare function EmptyTitle({ className, ...props }: React.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
499
|
+
declare function EmptyDescription({ className, ...props }: React.ComponentProps<'p'>): react_jsx_runtime.JSX.Element;
|
|
500
|
+
declare function EmptyContent({ className, ...props }: React.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
501
|
+
|
|
502
|
+
declare function ItemGroup({ className, ...props }: ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
503
|
+
declare function ItemSeparator({ className, ...props }: ComponentProps<typeof Separator>): react_jsx_runtime.JSX.Element;
|
|
504
|
+
declare const itemVariants: (props?: ({
|
|
505
|
+
variant?: "default" | "outline" | "muted" | "highlighted" | null | undefined;
|
|
506
|
+
size?: "default" | "sm" | "xs" | null | undefined;
|
|
507
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
508
|
+
declare function Item({ className, variant, size, asChild, ...props }: ComponentProps<'div'> & VariantProps<typeof itemVariants> & {
|
|
509
|
+
asChild?: boolean;
|
|
510
|
+
}): react_jsx_runtime.JSX.Element;
|
|
511
|
+
declare const itemMediaVariants: (props?: ({
|
|
512
|
+
variant?: "default" | "icon" | "image" | null | undefined;
|
|
513
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
514
|
+
declare function ItemMedia({ className, variant, ...props }: ComponentProps<'div'> & VariantProps<typeof itemMediaVariants>): react_jsx_runtime.JSX.Element;
|
|
515
|
+
declare function ItemContent({ className, ...props }: ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
516
|
+
declare function ItemTitle({ className, ...props }: ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
517
|
+
declare function ItemDescription({ className, ...props }: ComponentProps<'p'>): react_jsx_runtime.JSX.Element;
|
|
518
|
+
declare function ItemActions({ className, ...props }: ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
519
|
+
declare function ItemHeader({ className, ...props }: ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
520
|
+
declare function ItemFooter({ className, ...props }: ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
521
|
+
|
|
522
|
+
declare function RadioGroup({ className, ...props }: ComponentProps<typeof RadioGroup$1.Root>): react_jsx_runtime.JSX.Element;
|
|
523
|
+
declare function RadioGroupItem({ className, ...props }: ComponentProps<typeof RadioGroup$1.Item>): react_jsx_runtime.JSX.Element;
|
|
524
|
+
|
|
525
|
+
declare const spinnerVariants: (props?: ({
|
|
526
|
+
size?: "sm" | "md" | "lg" | "xl" | null | undefined;
|
|
527
|
+
color?: "current" | "destructive" | "primary" | "white" | "muted" | null | undefined;
|
|
528
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
529
|
+
interface SpinnerProps extends Omit<ComponentProps<'svg'>, 'color'>, VariantProps<typeof spinnerVariants> {
|
|
530
|
+
}
|
|
531
|
+
declare function Spinner({ className, size, color, ...props }: SpinnerProps): react_jsx_runtime.JSX.Element;
|
|
532
|
+
declare const spinnerLoaderVariants: (props?: ({
|
|
533
|
+
size?: "sm" | "md" | "lg" | "xl" | null | undefined;
|
|
534
|
+
color?: "current" | "destructive" | "primary" | "white" | "muted" | null | undefined;
|
|
535
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
536
|
+
interface SpinnerLoaderProps extends Omit<ComponentProps<'svg'>, 'color'>, VariantProps<typeof spinnerLoaderVariants> {
|
|
537
|
+
}
|
|
538
|
+
declare function SpinnerLoader({ className, size, color, ...props }: SpinnerLoaderProps): react_jsx_runtime.JSX.Element;
|
|
539
|
+
declare const spinnerDotsVariants: (props?: ({
|
|
540
|
+
size?: "sm" | "md" | "lg" | "xl" | null | undefined;
|
|
541
|
+
color?: "current" | "destructive" | "primary" | "white" | "muted" | null | undefined;
|
|
542
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
543
|
+
interface SpinnerDotsProps extends VariantProps<typeof spinnerDotsVariants> {
|
|
544
|
+
className?: string;
|
|
545
|
+
}
|
|
546
|
+
declare function SpinnerDots({ className, size, color }: SpinnerDotsProps): react_jsx_runtime.JSX.Element;
|
|
547
|
+
|
|
548
|
+
declare const buttonVariants: (props?: ({
|
|
549
|
+
variant?: "default" | "link" | "secondary" | "destructive" | "outline" | "ghost" | null | undefined;
|
|
550
|
+
size?: "default" | "icon" | "sm" | "lg" | "icon-sm" | "xs" | "icon-xs" | "icon-lg" | null | undefined;
|
|
551
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
552
|
+
declare function Button({ className, variant, size, asChild, ...props }: ComponentProps<'button'> & VariantProps<typeof buttonVariants> & {
|
|
553
|
+
asChild?: boolean;
|
|
554
|
+
}): react_jsx_runtime.JSX.Element;
|
|
555
|
+
|
|
556
|
+
declare function SelectTrigger({ className, size, children, ...props }: ComponentProps<typeof Select$1.Trigger> & {
|
|
557
|
+
size?: 'sm' | 'default';
|
|
558
|
+
}): react_jsx_runtime.JSX.Element;
|
|
559
|
+
|
|
560
|
+
interface ColorPickerContextValue {
|
|
561
|
+
hue: number;
|
|
562
|
+
saturation: number;
|
|
563
|
+
lightness: number;
|
|
564
|
+
alpha: number;
|
|
565
|
+
mode: string;
|
|
566
|
+
setHue: (hue: number) => void;
|
|
567
|
+
setSaturation: (saturation: number) => void;
|
|
568
|
+
setLightness: (lightness: number) => void;
|
|
569
|
+
setAlpha: (alpha: number) => void;
|
|
570
|
+
setMode: (mode: string) => void;
|
|
571
|
+
}
|
|
572
|
+
declare const useColorPicker: () => ColorPickerContextValue;
|
|
573
|
+
type ColorPickerProps = Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> & {
|
|
574
|
+
value?: Parameters<typeof Color>[0];
|
|
575
|
+
defaultValue?: Parameters<typeof Color>[0];
|
|
576
|
+
onChange?: (value: [number, number, number, number]) => void;
|
|
577
|
+
};
|
|
578
|
+
declare const ColorPicker: ({ value, defaultValue, onChange, className, ...props }: ColorPickerProps) => react_jsx_runtime.JSX.Element;
|
|
579
|
+
type ColorPickerSelectionProps = HTMLAttributes<HTMLDivElement>;
|
|
580
|
+
declare const ColorPickerSelection: react.MemoExoticComponent<({ className, ...props }: ColorPickerSelectionProps) => react_jsx_runtime.JSX.Element>;
|
|
581
|
+
type ColorPickerHueProps = ComponentProps<typeof Slider$1.Root>;
|
|
582
|
+
declare const ColorPickerHue: ({ className, ...props }: ColorPickerHueProps) => react_jsx_runtime.JSX.Element;
|
|
583
|
+
type ColorPickerAlphaProps = ComponentProps<typeof Slider$1.Root>;
|
|
584
|
+
declare const ColorPickerAlpha: ({ className, ...props }: ColorPickerAlphaProps) => react_jsx_runtime.JSX.Element;
|
|
585
|
+
type ColorPickerEyeDropperProps = ComponentProps<typeof Button>;
|
|
586
|
+
declare const ColorPickerEyeDropper: ({ className, ...props }: ColorPickerEyeDropperProps) => react_jsx_runtime.JSX.Element;
|
|
587
|
+
type ColorPickerOutputProps = ComponentProps<typeof SelectTrigger>;
|
|
588
|
+
declare const ColorPickerOutput: ({ ...props }: ColorPickerOutputProps) => react_jsx_runtime.JSX.Element;
|
|
589
|
+
type ColorPickerFormatProps = HTMLAttributes<HTMLDivElement>;
|
|
590
|
+
declare const ColorPickerFormat: ({ className, ...props }: ColorPickerFormatProps) => react_jsx_runtime.JSX.Element | null;
|
|
591
|
+
type ColorPickerPresetsProps = HTMLAttributes<HTMLDivElement> & {
|
|
592
|
+
colors: string[];
|
|
593
|
+
};
|
|
594
|
+
declare const ColorPickerPresets: {
|
|
595
|
+
({ colors, className, ...props }: ColorPickerPresetsProps): react_jsx_runtime.JSX.Element;
|
|
596
|
+
displayName: string;
|
|
597
|
+
};
|
|
598
|
+
|
|
599
|
+
interface DatePickerSingleProps {
|
|
600
|
+
mode?: 'single';
|
|
601
|
+
selected?: Date;
|
|
602
|
+
onSelect?: (date: Date | undefined) => void;
|
|
603
|
+
placeholder?: string;
|
|
604
|
+
disabled?: boolean;
|
|
605
|
+
className?: string;
|
|
606
|
+
fromDate?: Date;
|
|
607
|
+
toDate?: Date;
|
|
608
|
+
}
|
|
609
|
+
interface DatePickerRangeProps {
|
|
610
|
+
mode: 'range';
|
|
611
|
+
selected?: DateRange;
|
|
612
|
+
onSelect?: (range: DateRange | undefined) => void;
|
|
613
|
+
placeholder?: string;
|
|
614
|
+
disabled?: boolean;
|
|
615
|
+
className?: string;
|
|
616
|
+
fromDate?: Date;
|
|
617
|
+
toDate?: Date;
|
|
618
|
+
}
|
|
619
|
+
interface DatePickerProps {
|
|
620
|
+
mode?: 'single' | 'range';
|
|
621
|
+
selected?: Date | DateRange;
|
|
622
|
+
onSelect?: ((date: Date | undefined) => void) | ((range: DateRange | undefined) => void);
|
|
623
|
+
placeholder?: string;
|
|
624
|
+
disabled?: boolean;
|
|
625
|
+
className?: string;
|
|
626
|
+
fromDate?: Date;
|
|
627
|
+
toDate?: Date;
|
|
628
|
+
}
|
|
629
|
+
declare function DatePicker({ mode, selected, onSelect, placeholder, disabled, className, fromDate, toDate, }: DatePickerProps): react_jsx_runtime.JSX.Element;
|
|
630
|
+
|
|
631
|
+
interface NavbarDropdownItem {
|
|
632
|
+
href: string;
|
|
633
|
+
label: string;
|
|
634
|
+
icon?: ReactNode;
|
|
635
|
+
}
|
|
636
|
+
interface NavbarNavLink {
|
|
637
|
+
href: string;
|
|
638
|
+
label: string;
|
|
639
|
+
active?: boolean;
|
|
640
|
+
icon?: ReactNode;
|
|
641
|
+
/** If provided, hovering this link shows a dropdown */
|
|
642
|
+
dropdownItems?: NavbarDropdownItem[];
|
|
643
|
+
}
|
|
644
|
+
interface NavbarUtilityLink {
|
|
645
|
+
href: string;
|
|
646
|
+
label: string;
|
|
647
|
+
}
|
|
648
|
+
interface NavbarProps extends HTMLAttributes<HTMLElement> {
|
|
649
|
+
logo?: ReactNode;
|
|
650
|
+
brandName?: string;
|
|
651
|
+
utilityLinks?: NavbarUtilityLink[];
|
|
652
|
+
navigationLinks?: NavbarNavLink[];
|
|
653
|
+
notificationCount?: number;
|
|
654
|
+
onNavLinkClick?: (href: string) => void;
|
|
655
|
+
onSearchClick?: () => void;
|
|
656
|
+
onHelpClick?: () => void;
|
|
657
|
+
}
|
|
658
|
+
declare const Logo: (props: SVGAttributes<SVGElement>) => react_jsx_runtime.JSX.Element;
|
|
659
|
+
declare const Navbar: react.ForwardRefExoticComponent<NavbarProps & react.RefAttributes<HTMLElement>>;
|
|
660
|
+
|
|
661
|
+
declare function NavigationMenu({ className, children, viewport, ...props }: ComponentProps<typeof NavigationMenu$1.Root> & {
|
|
662
|
+
viewport?: boolean;
|
|
663
|
+
}): react_jsx_runtime.JSX.Element;
|
|
664
|
+
declare function NavigationMenuList({ className, ...props }: ComponentProps<typeof NavigationMenu$1.List>): react_jsx_runtime.JSX.Element;
|
|
665
|
+
declare function NavigationMenuItem({ className, ...props }: ComponentProps<typeof NavigationMenu$1.Item>): react_jsx_runtime.JSX.Element;
|
|
666
|
+
declare const navigationMenuTriggerStyle: (props?: class_variance_authority_types.ClassProp | undefined) => string;
|
|
667
|
+
declare function NavigationMenuTrigger({ className, children, ...props }: ComponentProps<typeof NavigationMenu$1.Trigger>): react_jsx_runtime.JSX.Element;
|
|
668
|
+
declare function NavigationMenuContent({ className, ...props }: ComponentProps<typeof NavigationMenu$1.Content>): react_jsx_runtime.JSX.Element;
|
|
669
|
+
declare function NavigationMenuViewport({ className, ...props }: ComponentProps<typeof NavigationMenu$1.Viewport>): react_jsx_runtime.JSX.Element;
|
|
670
|
+
declare function NavigationMenuLink({ className, ...props }: ComponentProps<typeof NavigationMenu$1.Link>): react_jsx_runtime.JSX.Element;
|
|
671
|
+
declare function NavigationMenuIndicator({ className, ...props }: ComponentProps<typeof NavigationMenu$1.Indicator>): react_jsx_runtime.JSX.Element;
|
|
672
|
+
|
|
673
|
+
interface SidebarProviderProps extends HTMLAttributes<HTMLDivElement> {
|
|
674
|
+
defaultOpen?: boolean;
|
|
675
|
+
open?: boolean;
|
|
676
|
+
onOpenChange?: (open: boolean) => void;
|
|
677
|
+
}
|
|
678
|
+
declare const SidebarProvider: react.ForwardRefExoticComponent<SidebarProviderProps & react.RefAttributes<HTMLDivElement>>;
|
|
679
|
+
declare const SidebarTrigger: react.ForwardRefExoticComponent<Omit<react.ClassAttributes<HTMLButtonElement> & ButtonHTMLAttributes<HTMLButtonElement> & class_variance_authority.VariantProps<(props?: ({
|
|
680
|
+
variant?: "secondary" | "outline" | "ghost" | "cancel" | "primary" | "cancelGhost" | null | undefined;
|
|
681
|
+
size?: "sm" | "md" | "lg" | "icon-sm" | null | undefined;
|
|
682
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string> & {
|
|
683
|
+
asChild?: boolean;
|
|
684
|
+
isLoading?: boolean;
|
|
685
|
+
}, "ref"> & react.RefAttributes<HTMLButtonElement>>;
|
|
686
|
+
|
|
687
|
+
interface SideBarItem {
|
|
688
|
+
label: string;
|
|
689
|
+
icon?: React.ReactNode;
|
|
690
|
+
active?: boolean;
|
|
691
|
+
onClick?: () => void;
|
|
692
|
+
}
|
|
693
|
+
interface SideBarProps {
|
|
694
|
+
items?: SideBarItem[];
|
|
695
|
+
activeItem?: string;
|
|
696
|
+
onItemClick?: (label: string) => void;
|
|
697
|
+
brandName?: string;
|
|
698
|
+
className?: string;
|
|
699
|
+
children?: React.ReactNode;
|
|
700
|
+
}
|
|
701
|
+
declare function SideBar({ items, activeItem, onItemClick, brandName, className, children, }: SideBarProps): react_jsx_runtime.JSX.Element;
|
|
702
|
+
|
|
703
|
+
declare function Textarea({ className, ...props }: ComponentProps<'textarea'>): react_jsx_runtime.JSX.Element;
|
|
704
|
+
|
|
705
|
+
interface CalendarEvent {
|
|
706
|
+
id: string | number;
|
|
707
|
+
title: string;
|
|
708
|
+
/** ISO format: "YYYY-MM-DD HH:mm" for timed events, "YYYY-MM-DD" for all-day */
|
|
709
|
+
start: string;
|
|
710
|
+
/** ISO format: "YYYY-MM-DD HH:mm" for timed events, "YYYY-MM-DD" for all-day */
|
|
711
|
+
end: string;
|
|
712
|
+
color?: 'default' | 'primary' | 'success' | 'warning' | 'danger';
|
|
713
|
+
description?: string;
|
|
714
|
+
[key: string]: unknown;
|
|
715
|
+
}
|
|
716
|
+
type CalendarView = 'month' | 'week' | 'day' | 'agenda';
|
|
717
|
+
interface EventCreateRange {
|
|
718
|
+
/** "YYYY-MM-DD HH:mm" for timed slot, "YYYY-MM-DD" for all-day slot */
|
|
719
|
+
start: string;
|
|
720
|
+
end: string;
|
|
721
|
+
}
|
|
722
|
+
interface EventCalendarProps {
|
|
723
|
+
events: CalendarEvent[];
|
|
724
|
+
/**
|
|
725
|
+
* Initial view. @schedule-x owns view state — use `key` prop to force reset.
|
|
726
|
+
* @default 'month'
|
|
727
|
+
*/
|
|
728
|
+
defaultView?: CalendarView;
|
|
729
|
+
/** Fired whenever the user switches views inside the calendar. */
|
|
730
|
+
onViewChange?: (view: CalendarView) => void;
|
|
731
|
+
/**
|
|
732
|
+
* Initial selected date in "YYYY-MM-DD" format.
|
|
733
|
+
* @default today
|
|
734
|
+
*/
|
|
735
|
+
defaultDate?: string;
|
|
736
|
+
/** Fired when the user clicks an existing event. */
|
|
737
|
+
onEventClick?: (event: CalendarEvent) => void;
|
|
738
|
+
/** Fired when the user double-clicks an empty slot. Use this to open a create-event dialog. */
|
|
739
|
+
onEventCreate?: (range: EventCreateRange) => void;
|
|
740
|
+
/**
|
|
741
|
+
* BCP 47 locale string for calendar labels.
|
|
742
|
+
* @default 'en-US'
|
|
743
|
+
*/
|
|
744
|
+
locale?: string;
|
|
745
|
+
className?: string;
|
|
746
|
+
}
|
|
747
|
+
|
|
748
|
+
declare function EventCalendar({ events, defaultView, onViewChange, defaultDate, onEventClick, onEventCreate, locale, className, }: EventCalendarProps): react_jsx_runtime.JSX.Element;
|
|
749
|
+
|
|
750
|
+
declare const duration: {
|
|
751
|
+
readonly instant: 0.1;
|
|
752
|
+
readonly fast: 0.15;
|
|
753
|
+
readonly normal: 0.25;
|
|
754
|
+
readonly slow: 0.4;
|
|
755
|
+
};
|
|
756
|
+
declare const ease: {
|
|
757
|
+
readonly smooth: readonly [0.4, 0, 0.2, 1];
|
|
758
|
+
readonly enter: readonly [0, 0, 0.2, 1];
|
|
759
|
+
readonly exit: readonly [0.4, 0, 1, 1];
|
|
760
|
+
readonly linear: readonly [0, 0, 1, 1];
|
|
761
|
+
};
|
|
762
|
+
declare const spring: {
|
|
763
|
+
readonly gentle: {
|
|
764
|
+
readonly type: "spring";
|
|
765
|
+
readonly stiffness: 260;
|
|
766
|
+
readonly damping: 28;
|
|
767
|
+
};
|
|
768
|
+
readonly snappy: {
|
|
769
|
+
readonly type: "spring";
|
|
770
|
+
readonly stiffness: 400;
|
|
771
|
+
readonly damping: 30;
|
|
772
|
+
};
|
|
773
|
+
};
|
|
774
|
+
declare const transition: {
|
|
775
|
+
readonly button: {
|
|
776
|
+
readonly duration: 0.1;
|
|
777
|
+
readonly ease: readonly [0.4, 0, 0.2, 1];
|
|
778
|
+
};
|
|
779
|
+
readonly toggle: {
|
|
780
|
+
readonly type: "spring";
|
|
781
|
+
readonly stiffness: 400;
|
|
782
|
+
readonly damping: 30;
|
|
783
|
+
};
|
|
784
|
+
readonly input: {
|
|
785
|
+
readonly duration: 0.15;
|
|
786
|
+
readonly ease: readonly [0.4, 0, 0.2, 1];
|
|
787
|
+
};
|
|
788
|
+
readonly dropdown: {
|
|
789
|
+
readonly duration: 0.15;
|
|
790
|
+
readonly ease: readonly [0, 0, 0.2, 1];
|
|
791
|
+
};
|
|
792
|
+
readonly toast: {
|
|
793
|
+
readonly duration: 0.15;
|
|
794
|
+
readonly ease: readonly [0.4, 0, 0.2, 1];
|
|
795
|
+
};
|
|
796
|
+
readonly modal: {
|
|
797
|
+
readonly type: "spring";
|
|
798
|
+
readonly stiffness: 260;
|
|
799
|
+
readonly damping: 28;
|
|
800
|
+
};
|
|
801
|
+
readonly sidebar: {
|
|
802
|
+
readonly duration: 0.4;
|
|
803
|
+
readonly ease: readonly [0.4, 0, 0.2, 1];
|
|
804
|
+
};
|
|
805
|
+
readonly card: {
|
|
806
|
+
readonly duration: 0.15;
|
|
807
|
+
readonly ease: readonly [0.4, 0, 0.2, 1];
|
|
808
|
+
};
|
|
809
|
+
};
|
|
810
|
+
declare const fadeIn: {
|
|
811
|
+
readonly hidden: {
|
|
812
|
+
readonly opacity: 0;
|
|
813
|
+
};
|
|
814
|
+
readonly visible: {
|
|
815
|
+
readonly opacity: 1;
|
|
816
|
+
readonly transition: {
|
|
817
|
+
readonly duration: 0.15;
|
|
818
|
+
readonly ease: readonly [0, 0, 0.2, 1];
|
|
819
|
+
};
|
|
820
|
+
};
|
|
821
|
+
readonly exit: {
|
|
822
|
+
readonly opacity: 0;
|
|
823
|
+
readonly transition: {
|
|
824
|
+
readonly duration: 0.15;
|
|
825
|
+
readonly ease: readonly [0.4, 0, 1, 1];
|
|
826
|
+
};
|
|
827
|
+
};
|
|
828
|
+
};
|
|
829
|
+
declare const slideUp: {
|
|
830
|
+
readonly hidden: {
|
|
831
|
+
readonly opacity: 0;
|
|
832
|
+
readonly y: 8;
|
|
833
|
+
};
|
|
834
|
+
readonly visible: {
|
|
835
|
+
readonly opacity: 1;
|
|
836
|
+
readonly y: 0;
|
|
837
|
+
readonly transition: {
|
|
838
|
+
readonly duration: 0.15;
|
|
839
|
+
readonly ease: readonly [0, 0, 0.2, 1];
|
|
840
|
+
};
|
|
841
|
+
};
|
|
842
|
+
readonly exit: {
|
|
843
|
+
readonly opacity: 0;
|
|
844
|
+
readonly y: 4;
|
|
845
|
+
readonly transition: {
|
|
846
|
+
readonly duration: 0.15;
|
|
847
|
+
readonly ease: readonly [0.4, 0, 1, 1];
|
|
848
|
+
};
|
|
849
|
+
};
|
|
850
|
+
};
|
|
851
|
+
declare const slideRight: {
|
|
852
|
+
readonly hidden: {
|
|
853
|
+
readonly opacity: 0;
|
|
854
|
+
readonly x: -12;
|
|
855
|
+
};
|
|
856
|
+
readonly visible: {
|
|
857
|
+
readonly opacity: 1;
|
|
858
|
+
readonly x: 0;
|
|
859
|
+
readonly transition: {
|
|
860
|
+
readonly duration: 0.4;
|
|
861
|
+
readonly ease: readonly [0.4, 0, 0.2, 1];
|
|
862
|
+
};
|
|
863
|
+
};
|
|
864
|
+
readonly exit: {
|
|
865
|
+
readonly opacity: 0;
|
|
866
|
+
readonly x: -12;
|
|
867
|
+
readonly transition: {
|
|
868
|
+
readonly duration: 0.25;
|
|
869
|
+
readonly ease: readonly [0.4, 0, 1, 1];
|
|
870
|
+
};
|
|
871
|
+
};
|
|
872
|
+
};
|
|
873
|
+
declare const scaleIn: {
|
|
874
|
+
readonly hidden: {
|
|
875
|
+
readonly opacity: 0;
|
|
876
|
+
readonly scale: 0.97;
|
|
877
|
+
};
|
|
878
|
+
readonly visible: {
|
|
879
|
+
readonly opacity: 1;
|
|
880
|
+
readonly scale: 1;
|
|
881
|
+
readonly transition: {
|
|
882
|
+
readonly type: "spring";
|
|
883
|
+
readonly stiffness: 260;
|
|
884
|
+
readonly damping: 28;
|
|
885
|
+
};
|
|
886
|
+
};
|
|
887
|
+
readonly exit: {
|
|
888
|
+
readonly opacity: 0;
|
|
889
|
+
readonly scale: 0.97;
|
|
890
|
+
readonly transition: {
|
|
891
|
+
readonly duration: 0.15;
|
|
892
|
+
readonly ease: readonly [0.4, 0, 1, 1];
|
|
893
|
+
};
|
|
894
|
+
};
|
|
895
|
+
};
|
|
896
|
+
declare const stagger: {
|
|
897
|
+
readonly container: {
|
|
898
|
+
readonly hidden: {};
|
|
899
|
+
readonly visible: {
|
|
900
|
+
readonly transition: {
|
|
901
|
+
readonly staggerChildren: 0.06;
|
|
902
|
+
readonly delayChildren: 0.05;
|
|
903
|
+
};
|
|
904
|
+
};
|
|
905
|
+
};
|
|
906
|
+
readonly item: {
|
|
907
|
+
readonly hidden: {
|
|
908
|
+
readonly opacity: 0;
|
|
909
|
+
readonly y: 6;
|
|
910
|
+
};
|
|
911
|
+
readonly visible: {
|
|
912
|
+
readonly opacity: 1;
|
|
913
|
+
readonly y: 0;
|
|
914
|
+
readonly transition: {
|
|
915
|
+
readonly duration: 0.15;
|
|
916
|
+
readonly ease: readonly [0.4, 0, 0.2, 1];
|
|
917
|
+
};
|
|
918
|
+
};
|
|
919
|
+
};
|
|
920
|
+
};
|
|
921
|
+
declare const animation: {
|
|
922
|
+
readonly duration: {
|
|
923
|
+
readonly instant: 0.1;
|
|
924
|
+
readonly fast: 0.15;
|
|
925
|
+
readonly normal: 0.25;
|
|
926
|
+
readonly slow: 0.4;
|
|
927
|
+
};
|
|
928
|
+
readonly ease: {
|
|
929
|
+
readonly smooth: readonly [0.4, 0, 0.2, 1];
|
|
930
|
+
readonly enter: readonly [0, 0, 0.2, 1];
|
|
931
|
+
readonly exit: readonly [0.4, 0, 1, 1];
|
|
932
|
+
readonly linear: readonly [0, 0, 1, 1];
|
|
933
|
+
};
|
|
934
|
+
readonly spring: {
|
|
935
|
+
readonly gentle: {
|
|
936
|
+
readonly type: "spring";
|
|
937
|
+
readonly stiffness: 260;
|
|
938
|
+
readonly damping: 28;
|
|
939
|
+
};
|
|
940
|
+
readonly snappy: {
|
|
941
|
+
readonly type: "spring";
|
|
942
|
+
readonly stiffness: 400;
|
|
943
|
+
readonly damping: 30;
|
|
944
|
+
};
|
|
945
|
+
};
|
|
946
|
+
readonly transition: {
|
|
947
|
+
readonly button: {
|
|
948
|
+
readonly duration: 0.1;
|
|
949
|
+
readonly ease: readonly [0.4, 0, 0.2, 1];
|
|
950
|
+
};
|
|
951
|
+
readonly toggle: {
|
|
952
|
+
readonly type: "spring";
|
|
953
|
+
readonly stiffness: 400;
|
|
954
|
+
readonly damping: 30;
|
|
955
|
+
};
|
|
956
|
+
readonly input: {
|
|
957
|
+
readonly duration: 0.15;
|
|
958
|
+
readonly ease: readonly [0.4, 0, 0.2, 1];
|
|
959
|
+
};
|
|
960
|
+
readonly dropdown: {
|
|
961
|
+
readonly duration: 0.15;
|
|
962
|
+
readonly ease: readonly [0, 0, 0.2, 1];
|
|
963
|
+
};
|
|
964
|
+
readonly toast: {
|
|
965
|
+
readonly duration: 0.15;
|
|
966
|
+
readonly ease: readonly [0.4, 0, 0.2, 1];
|
|
967
|
+
};
|
|
968
|
+
readonly modal: {
|
|
969
|
+
readonly type: "spring";
|
|
970
|
+
readonly stiffness: 260;
|
|
971
|
+
readonly damping: 28;
|
|
972
|
+
};
|
|
973
|
+
readonly sidebar: {
|
|
974
|
+
readonly duration: 0.4;
|
|
975
|
+
readonly ease: readonly [0.4, 0, 0.2, 1];
|
|
976
|
+
};
|
|
977
|
+
readonly card: {
|
|
978
|
+
readonly duration: 0.15;
|
|
979
|
+
readonly ease: readonly [0.4, 0, 0.2, 1];
|
|
980
|
+
};
|
|
981
|
+
};
|
|
982
|
+
readonly variants: {
|
|
983
|
+
readonly fadeIn: {
|
|
984
|
+
readonly hidden: {
|
|
985
|
+
readonly opacity: 0;
|
|
986
|
+
};
|
|
987
|
+
readonly visible: {
|
|
988
|
+
readonly opacity: 1;
|
|
989
|
+
readonly transition: {
|
|
990
|
+
readonly duration: 0.15;
|
|
991
|
+
readonly ease: readonly [0, 0, 0.2, 1];
|
|
992
|
+
};
|
|
993
|
+
};
|
|
994
|
+
readonly exit: {
|
|
995
|
+
readonly opacity: 0;
|
|
996
|
+
readonly transition: {
|
|
997
|
+
readonly duration: 0.15;
|
|
998
|
+
readonly ease: readonly [0.4, 0, 1, 1];
|
|
999
|
+
};
|
|
1000
|
+
};
|
|
1001
|
+
};
|
|
1002
|
+
readonly slideUp: {
|
|
1003
|
+
readonly hidden: {
|
|
1004
|
+
readonly opacity: 0;
|
|
1005
|
+
readonly y: 8;
|
|
1006
|
+
};
|
|
1007
|
+
readonly visible: {
|
|
1008
|
+
readonly opacity: 1;
|
|
1009
|
+
readonly y: 0;
|
|
1010
|
+
readonly transition: {
|
|
1011
|
+
readonly duration: 0.15;
|
|
1012
|
+
readonly ease: readonly [0, 0, 0.2, 1];
|
|
1013
|
+
};
|
|
1014
|
+
};
|
|
1015
|
+
readonly exit: {
|
|
1016
|
+
readonly opacity: 0;
|
|
1017
|
+
readonly y: 4;
|
|
1018
|
+
readonly transition: {
|
|
1019
|
+
readonly duration: 0.15;
|
|
1020
|
+
readonly ease: readonly [0.4, 0, 1, 1];
|
|
1021
|
+
};
|
|
1022
|
+
};
|
|
1023
|
+
};
|
|
1024
|
+
readonly slideRight: {
|
|
1025
|
+
readonly hidden: {
|
|
1026
|
+
readonly opacity: 0;
|
|
1027
|
+
readonly x: -12;
|
|
1028
|
+
};
|
|
1029
|
+
readonly visible: {
|
|
1030
|
+
readonly opacity: 1;
|
|
1031
|
+
readonly x: 0;
|
|
1032
|
+
readonly transition: {
|
|
1033
|
+
readonly duration: 0.4;
|
|
1034
|
+
readonly ease: readonly [0.4, 0, 0.2, 1];
|
|
1035
|
+
};
|
|
1036
|
+
};
|
|
1037
|
+
readonly exit: {
|
|
1038
|
+
readonly opacity: 0;
|
|
1039
|
+
readonly x: -12;
|
|
1040
|
+
readonly transition: {
|
|
1041
|
+
readonly duration: 0.25;
|
|
1042
|
+
readonly ease: readonly [0.4, 0, 1, 1];
|
|
1043
|
+
};
|
|
1044
|
+
};
|
|
1045
|
+
};
|
|
1046
|
+
readonly scaleIn: {
|
|
1047
|
+
readonly hidden: {
|
|
1048
|
+
readonly opacity: 0;
|
|
1049
|
+
readonly scale: 0.97;
|
|
1050
|
+
};
|
|
1051
|
+
readonly visible: {
|
|
1052
|
+
readonly opacity: 1;
|
|
1053
|
+
readonly scale: 1;
|
|
1054
|
+
readonly transition: {
|
|
1055
|
+
readonly type: "spring";
|
|
1056
|
+
readonly stiffness: 260;
|
|
1057
|
+
readonly damping: 28;
|
|
1058
|
+
};
|
|
1059
|
+
};
|
|
1060
|
+
readonly exit: {
|
|
1061
|
+
readonly opacity: 0;
|
|
1062
|
+
readonly scale: 0.97;
|
|
1063
|
+
readonly transition: {
|
|
1064
|
+
readonly duration: 0.15;
|
|
1065
|
+
readonly ease: readonly [0.4, 0, 1, 1];
|
|
1066
|
+
};
|
|
1067
|
+
};
|
|
1068
|
+
};
|
|
1069
|
+
readonly stagger: {
|
|
1070
|
+
readonly container: {
|
|
1071
|
+
readonly hidden: {};
|
|
1072
|
+
readonly visible: {
|
|
1073
|
+
readonly transition: {
|
|
1074
|
+
readonly staggerChildren: 0.06;
|
|
1075
|
+
readonly delayChildren: 0.05;
|
|
1076
|
+
};
|
|
1077
|
+
};
|
|
1078
|
+
};
|
|
1079
|
+
readonly item: {
|
|
1080
|
+
readonly hidden: {
|
|
1081
|
+
readonly opacity: 0;
|
|
1082
|
+
readonly y: 6;
|
|
1083
|
+
};
|
|
1084
|
+
readonly visible: {
|
|
1085
|
+
readonly opacity: 1;
|
|
1086
|
+
readonly y: 0;
|
|
1087
|
+
readonly transition: {
|
|
1088
|
+
readonly duration: 0.15;
|
|
1089
|
+
readonly ease: readonly [0.4, 0, 0.2, 1];
|
|
1090
|
+
};
|
|
1091
|
+
};
|
|
1092
|
+
};
|
|
1093
|
+
};
|
|
1094
|
+
};
|
|
1095
|
+
};
|
|
1096
|
+
type AnimationTokens = typeof animation;
|
|
1097
|
+
|
|
1098
|
+
declare function useAppForm<T extends ZodType>(schema: T, options?: Omit<UseFormProps<z.infer<T> & FieldValues>, 'resolver'>): react_hook_form.UseFormReturn<z.core.output<T> & FieldValues, any, z.core.output<T> & FieldValues>;
|
|
1099
|
+
|
|
1100
|
+
declare const logos: {
|
|
1101
|
+
readonly color: "https://dibt9vplwriap.cloudfront.net/logos/Logo_Total_Color.webp";
|
|
1102
|
+
readonly colorAna: "https://dibt9vplwriap.cloudfront.net/logos/Logo_Total_Color-ANA.webp";
|
|
1103
|
+
readonly colorAnaa: "https://dibt9vplwriap.cloudfront.net/logos/Logo_Total_Color-ANAA.webp";
|
|
1104
|
+
readonly negative: "https://dibt9vplwriap.cloudfront.net/logos/Logo_Total_Negative.webp";
|
|
1105
|
+
readonly positive: "https://dibt9vplwriap.cloudfront.net/logos/Logo_Total_Positive.webp";
|
|
1106
|
+
readonly grayScale: "https://dibt9vplwriap.cloudfront.net/logos/Logo_Total_gray_scale.webp";
|
|
1107
|
+
readonly monochBlack: "https://dibt9vplwriap.cloudfront.net/logos/Logo_Total_monochB.webp";
|
|
1108
|
+
readonly monochOrange: "https://dibt9vplwriap.cloudfront.net/logos/Logo_Total_monochO.webp";
|
|
1109
|
+
};
|
|
1110
|
+
type LogoKey = keyof typeof logos;
|
|
1111
|
+
|
|
1112
|
+
declare function Table({ className, containerClassName, ...props }: ComponentProps<'table'> & {
|
|
1113
|
+
/**
|
|
1114
|
+
* Classes for the scroll container that wraps the table. Defaults to
|
|
1115
|
+
* `overflow-x-auto` for horizontal scrolling. Pass `overflow-visible` when an
|
|
1116
|
+
* outer element already owns scrolling (e.g. a sticky-header data table) —
|
|
1117
|
+
* a nested scroll container would otherwise trap `position: sticky` cells.
|
|
1118
|
+
*/
|
|
1119
|
+
containerClassName?: string;
|
|
1120
|
+
}): react_jsx_runtime.JSX.Element;
|
|
1121
|
+
declare function TableHeader({ className, ...props }: ComponentProps<'thead'>): react_jsx_runtime.JSX.Element;
|
|
1122
|
+
declare function TableBody({ className, ...props }: ComponentProps<'tbody'>): react_jsx_runtime.JSX.Element;
|
|
1123
|
+
declare function TableFooter({ className, ...props }: ComponentProps<'tfoot'>): react_jsx_runtime.JSX.Element;
|
|
1124
|
+
declare function TableRow({ className, ...props }: ComponentProps<'tr'>): react_jsx_runtime.JSX.Element;
|
|
1125
|
+
declare function TableHead({ className, ...props }: ComponentProps<'th'>): react_jsx_runtime.JSX.Element;
|
|
1126
|
+
declare function TableCell({ className, ...props }: ComponentProps<'td'>): react_jsx_runtime.JSX.Element;
|
|
1127
|
+
declare function TableCaption({ className, ...props }: ComponentProps<'caption'>): react_jsx_runtime.JSX.Element;
|
|
1128
|
+
|
|
1129
|
+
declare function Checkbox({ className, checked, ...props }: ComponentProps<typeof Checkbox$1.Root>): react_jsx_runtime.JSX.Element;
|
|
1130
|
+
|
|
1131
|
+
type TableCellSize = 'sm' | 'md' | 'lg';
|
|
1132
|
+
type TableVariant = 'default' | 'striped';
|
|
1133
|
+
type SortDirection = 'asc' | 'desc' | false;
|
|
1134
|
+
type CellAlignment = 'left' | 'center' | 'right';
|
|
1135
|
+
interface ColumnMeta {
|
|
1136
|
+
align?: CellAlignment;
|
|
1137
|
+
size?: TableCellSize;
|
|
1138
|
+
sortable?: boolean;
|
|
1139
|
+
filterable?: boolean;
|
|
1140
|
+
ellipsis?: boolean;
|
|
1141
|
+
variant?: 'default' | 'numeric';
|
|
1142
|
+
width?: string | number;
|
|
1143
|
+
className?: string;
|
|
1144
|
+
pinned?: 'left' | 'right' | false;
|
|
1145
|
+
/** Override the field label shown in mobile card view. Uses column header string by default. */
|
|
1146
|
+
cardLabel?: string;
|
|
1147
|
+
/** Exclude this column from the mobile card view entirely. Default: false */
|
|
1148
|
+
hideInCard?: boolean;
|
|
1149
|
+
/** Disable resize handle for this column. Only relevant when DataTable has enableColumnResizing=true. Default: true */
|
|
1150
|
+
resizable?: boolean;
|
|
1151
|
+
}
|
|
1152
|
+
type TableColumnDef<T> = ColumnDef<T, unknown> & {
|
|
1153
|
+
meta?: ColumnMeta;
|
|
1154
|
+
};
|
|
1155
|
+
interface TableClassNames<T> {
|
|
1156
|
+
wrapper?: string;
|
|
1157
|
+
table?: string;
|
|
1158
|
+
header?: string;
|
|
1159
|
+
body?: string;
|
|
1160
|
+
row?: string | ((row: Row<T>) => string);
|
|
1161
|
+
cell?: string | ((row: Row<T>) => string);
|
|
1162
|
+
}
|
|
1163
|
+
interface DataTableProps<T = unknown> {
|
|
1164
|
+
data: T[];
|
|
1165
|
+
columns: TableColumnDef<T>[];
|
|
1166
|
+
size?: TableCellSize;
|
|
1167
|
+
variant?: TableVariant;
|
|
1168
|
+
isLoading?: boolean;
|
|
1169
|
+
stickyHeader?: boolean;
|
|
1170
|
+
maxHeight?: string | number;
|
|
1171
|
+
sorting?: SortingState;
|
|
1172
|
+
defaultSorting?: SortingState;
|
|
1173
|
+
onSortingChange?: (state: SortingState) => void;
|
|
1174
|
+
enableSorting?: boolean;
|
|
1175
|
+
manualSorting?: boolean;
|
|
1176
|
+
columnFilters?: ColumnFiltersState;
|
|
1177
|
+
defaultColumnFilters?: ColumnFiltersState;
|
|
1178
|
+
onColumnFiltersChange?: (state: ColumnFiltersState) => void;
|
|
1179
|
+
enableFiltering?: boolean;
|
|
1180
|
+
manualFiltering?: boolean;
|
|
1181
|
+
onRowClick?: (row: T) => void;
|
|
1182
|
+
classNames?: TableClassNames<T>;
|
|
1183
|
+
getUniqueValues?: (columnId: string) => string[];
|
|
1184
|
+
/** Custom content rendered when data is empty and not loading. Default: "No results found". */
|
|
1185
|
+
emptyState?: ReactNode;
|
|
1186
|
+
rowSelection?: RowSelectionState;
|
|
1187
|
+
defaultRowSelection?: RowSelectionState;
|
|
1188
|
+
onRowSelectionChange?: (state: RowSelectionState) => void;
|
|
1189
|
+
enableRowSelection?: boolean;
|
|
1190
|
+
/** Called with the original row objects whenever selection changes */
|
|
1191
|
+
onSelectedRowsChange?: (rows: T[]) => void;
|
|
1192
|
+
/** Media query below which card layout renders. Default: "(max-width: 767px)" */
|
|
1193
|
+
responsiveBreakpoint?: string;
|
|
1194
|
+
/** Set true to disable auto-responsive behaviour. Default: false */
|
|
1195
|
+
disableResponsive?: boolean;
|
|
1196
|
+
/** Number of skeleton rows shown in card view while loading. Default: 5 */
|
|
1197
|
+
skeletonRowCount?: number;
|
|
1198
|
+
/** Called once on mount with the TanStack Table instance — pass to DataTableToolbar */
|
|
1199
|
+
onTableReady?: (table: Table$1<T>) => void;
|
|
1200
|
+
/**
|
|
1201
|
+
* Rendered inside the DataTable context provider, above the table wrapper.
|
|
1202
|
+
* Use this to place DataTableToolbar and DataTableSearch so they have full
|
|
1203
|
+
* access to context (globalFilter, size, columnVisibility, etc.).
|
|
1204
|
+
*/
|
|
1205
|
+
toolbar?: ReactNode;
|
|
1206
|
+
tableId?: string;
|
|
1207
|
+
globalFilter?: string;
|
|
1208
|
+
defaultGlobalFilter?: string;
|
|
1209
|
+
onGlobalFilterChange?: (value: string) => void;
|
|
1210
|
+
columnVisibility?: VisibilityState;
|
|
1211
|
+
defaultColumnVisibility?: VisibilityState;
|
|
1212
|
+
onColumnVisibilityChange?: (state: VisibilityState) => void;
|
|
1213
|
+
columnSizing?: ColumnSizingState;
|
|
1214
|
+
defaultColumnSizing?: ColumnSizingState;
|
|
1215
|
+
onColumnSizingChange?: (state: ColumnSizingState) => void;
|
|
1216
|
+
/** Enable column resize handles. Default: false */
|
|
1217
|
+
enableColumnResizing?: boolean;
|
|
1218
|
+
/** Called when the user changes density from the toolbar */
|
|
1219
|
+
onSizeChange?: (size: TableCellSize) => void;
|
|
1220
|
+
}
|
|
1221
|
+
interface TableContextType<T = unknown> {
|
|
1222
|
+
size: TableCellSize;
|
|
1223
|
+
variant: TableVariant;
|
|
1224
|
+
sorting: SortingState;
|
|
1225
|
+
setSorting: (state: SortingState) => void;
|
|
1226
|
+
columnFilters: ColumnFiltersState;
|
|
1227
|
+
setColumnFilters: (state: ColumnFiltersState) => void;
|
|
1228
|
+
getUniqueValues?: (columnId: string) => string[];
|
|
1229
|
+
onRowClick?: (row: T) => void;
|
|
1230
|
+
rowSelection: RowSelectionState;
|
|
1231
|
+
setRowSelection: (state: RowSelectionState) => void;
|
|
1232
|
+
globalFilter: string;
|
|
1233
|
+
setGlobalFilter: (value: string) => void;
|
|
1234
|
+
columnVisibility: VisibilityState;
|
|
1235
|
+
setColumnVisibility: (state: VisibilityState) => void;
|
|
1236
|
+
columnSizing: ColumnSizingState;
|
|
1237
|
+
setColumnSizing: (state: ColumnSizingState) => void;
|
|
1238
|
+
setSize: (size: TableCellSize) => void;
|
|
1239
|
+
/** The underlying TanStack Table instance — available inside the DataTable context. */
|
|
1240
|
+
table: Table$1<T>;
|
|
1241
|
+
}
|
|
1242
|
+
interface TablePaginationProps {
|
|
1243
|
+
page: number;
|
|
1244
|
+
totalPages: number;
|
|
1245
|
+
perPage: number;
|
|
1246
|
+
totalRecords?: number;
|
|
1247
|
+
rowsPerPageOptions?: number[];
|
|
1248
|
+
onPageChange: (newPage: number) => void;
|
|
1249
|
+
onPerPageChange: (newPerPage: number) => void;
|
|
1250
|
+
}
|
|
1251
|
+
|
|
1252
|
+
declare function Pagination({ className, ...props }: ComponentProps<'nav'>): react_jsx_runtime.JSX.Element;
|
|
1253
|
+
declare function PaginationContent({ className, ...props }: ComponentProps<'ul'>): react_jsx_runtime.JSX.Element;
|
|
1254
|
+
declare function PaginationItem({ ...props }: ComponentProps<'li'>): react_jsx_runtime.JSX.Element;
|
|
1255
|
+
type PaginationLinkProps = {
|
|
1256
|
+
isActive?: boolean;
|
|
1257
|
+
} & Pick<ComponentProps<typeof Button$1>, 'size'> & ComponentProps<'a'>;
|
|
1258
|
+
declare function PaginationLink({ className, isActive, size, ...props }: PaginationLinkProps): react_jsx_runtime.JSX.Element;
|
|
1259
|
+
declare function PaginationPrevious({ className, text, ...props }: ComponentProps<typeof PaginationLink> & {
|
|
1260
|
+
text?: string;
|
|
1261
|
+
}): react_jsx_runtime.JSX.Element;
|
|
1262
|
+
declare function PaginationNext({ className, text, ...props }: ComponentProps<typeof PaginationLink> & {
|
|
1263
|
+
text?: string;
|
|
1264
|
+
}): react_jsx_runtime.JSX.Element;
|
|
1265
|
+
declare function PaginationEllipsis({ className, ...props }: ComponentProps<'span'>): react_jsx_runtime.JSX.Element;
|
|
1266
|
+
declare function TablePaginationBase({ page, totalPages, perPage, totalRecords, rowsPerPageOptions, onPageChange, onPerPageChange, }: TablePaginationProps): react_jsx_runtime.JSX.Element;
|
|
1267
|
+
declare const TablePagination: react.MemoExoticComponent<typeof TablePaginationBase>;
|
|
1268
|
+
|
|
1269
|
+
declare function useTableContext<T = unknown>(): TableContextType<T>;
|
|
1270
|
+
|
|
1271
|
+
declare function DataTable<T>({ data, columns, size, variant, isLoading, stickyHeader, maxHeight, sorting, defaultSorting, onSortingChange, enableSorting, manualSorting, columnFilters, defaultColumnFilters, onColumnFiltersChange, enableFiltering, manualFiltering, onRowClick, classNames, getUniqueValues, emptyState, rowSelection, defaultRowSelection, onRowSelectionChange, enableRowSelection, onSelectedRowsChange, responsiveBreakpoint, disableResponsive, skeletonRowCount, onTableReady, tableId, globalFilter, defaultGlobalFilter, onGlobalFilterChange, columnVisibility, defaultColumnVisibility, onColumnVisibilityChange, columnSizing, defaultColumnSizing, onColumnSizingChange, enableColumnResizing, onSizeChange, toolbar, }: DataTableProps<T>): react_jsx_runtime.JSX.Element;
|
|
1272
|
+
|
|
1273
|
+
interface FilterOptionProps {
|
|
1274
|
+
value: string;
|
|
1275
|
+
checked: boolean;
|
|
1276
|
+
onChange: (value: string, checked: boolean) => void;
|
|
1277
|
+
}
|
|
1278
|
+
declare const FilterOption: react.NamedExoticComponent<FilterOptionProps>;
|
|
1279
|
+
interface DataTableColumnFilterProps {
|
|
1280
|
+
options: string[];
|
|
1281
|
+
selectedValues: string[];
|
|
1282
|
+
onChange: (values: string[]) => void;
|
|
1283
|
+
searchPlaceholder?: string;
|
|
1284
|
+
/** Human-readable column name used to build accessible labels. */
|
|
1285
|
+
columnLabel?: string;
|
|
1286
|
+
}
|
|
1287
|
+
declare function DataTableColumnFilter({ options, selectedValues, onChange, searchPlaceholder, columnLabel, }: DataTableColumnFilterProps): react_jsx_runtime.JSX.Element;
|
|
1288
|
+
|
|
1289
|
+
interface DataTableSkeletonProps {
|
|
1290
|
+
columnCount: number;
|
|
1291
|
+
rowCount?: number;
|
|
1292
|
+
size?: TableCellSize;
|
|
1293
|
+
}
|
|
1294
|
+
declare function DataTableSkeleton({ columnCount, rowCount, size }: DataTableSkeletonProps): react_jsx_runtime.JSX.Element;
|
|
1295
|
+
|
|
1296
|
+
interface DataTableHeaderCellProps<T> {
|
|
1297
|
+
header: Header<T, unknown>;
|
|
1298
|
+
}
|
|
1299
|
+
declare function DataTableHeaderCell<T>({ header }: DataTableHeaderCellProps<T>): react_jsx_runtime.JSX.Element;
|
|
1300
|
+
|
|
1301
|
+
interface UseTableSortingProps {
|
|
1302
|
+
/**
|
|
1303
|
+
* Controlled sorting state (optional)
|
|
1304
|
+
* If provided, the component operates in controlled mode
|
|
1305
|
+
*/
|
|
1306
|
+
sorting?: SortingState;
|
|
1307
|
+
/**
|
|
1308
|
+
* Default sorting state for uncontrolled mode
|
|
1309
|
+
* @default []
|
|
1310
|
+
*/
|
|
1311
|
+
defaultSorting?: SortingState;
|
|
1312
|
+
/**
|
|
1313
|
+
* Callback fired when sorting changes
|
|
1314
|
+
* Required for controlled mode, optional for uncontrolled
|
|
1315
|
+
*/
|
|
1316
|
+
onSortingChange?: (sorting: SortingState) => void;
|
|
1317
|
+
}
|
|
1318
|
+
interface UseTableSortingReturn {
|
|
1319
|
+
/**
|
|
1320
|
+
* Current sorting state (controlled or internal)
|
|
1321
|
+
*/
|
|
1322
|
+
sortingState: SortingState;
|
|
1323
|
+
/**
|
|
1324
|
+
* Handler for TanStack Table's onSortingChange
|
|
1325
|
+
*/
|
|
1326
|
+
handleSortingChange: (updater: Updater<SortingState>) => void;
|
|
1327
|
+
/**
|
|
1328
|
+
* Whether the component is in controlled mode
|
|
1329
|
+
*/
|
|
1330
|
+
isControlled: boolean;
|
|
1331
|
+
/**
|
|
1332
|
+
* Manual setter for uncontrolled mode (useful for imperative actions)
|
|
1333
|
+
*/
|
|
1334
|
+
setSorting: (sorting: SortingState) => void;
|
|
1335
|
+
}
|
|
1336
|
+
/**
|
|
1337
|
+
* Hook to manage table sorting state (controlled or uncontrolled)
|
|
1338
|
+
*
|
|
1339
|
+
* @example Uncontrolled mode
|
|
1340
|
+
* ```tsx
|
|
1341
|
+
* const { sortingState, handleSortingChange } = useTableSorting({
|
|
1342
|
+
* defaultSorting: [{ id: 'name', desc: false }],
|
|
1343
|
+
* onSortingChange: (state) => console.log(state)
|
|
1344
|
+
* });
|
|
1345
|
+
* ```
|
|
1346
|
+
*
|
|
1347
|
+
* @example Controlled mode
|
|
1348
|
+
* ```tsx
|
|
1349
|
+
* const [sorting, setSorting] = useState<SortingState>([]);
|
|
1350
|
+
* const { sortingState, handleSortingChange } = useTableSorting({
|
|
1351
|
+
* sorting,
|
|
1352
|
+
* onSortingChange: setSorting
|
|
1353
|
+
* });
|
|
1354
|
+
* ```
|
|
1355
|
+
*/
|
|
1356
|
+
declare function useTableSorting({ sorting: controlledSorting, defaultSorting, onSortingChange, }: UseTableSortingProps): UseTableSortingReturn;
|
|
1357
|
+
|
|
1358
|
+
interface UseTableFilteringProps {
|
|
1359
|
+
/**
|
|
1360
|
+
* Controlled column filters state (optional)
|
|
1361
|
+
* If provided, the component operates in controlled mode
|
|
1362
|
+
*/
|
|
1363
|
+
columnFilters?: ColumnFiltersState;
|
|
1364
|
+
/**
|
|
1365
|
+
* Default column filters state for uncontrolled mode
|
|
1366
|
+
* @default []
|
|
1367
|
+
*/
|
|
1368
|
+
defaultColumnFilters?: ColumnFiltersState;
|
|
1369
|
+
/**
|
|
1370
|
+
* Callback fired when column filters change
|
|
1371
|
+
* Required for controlled mode, optional for uncontrolled
|
|
1372
|
+
*/
|
|
1373
|
+
onColumnFiltersChange?: (columnFilters: ColumnFiltersState) => void;
|
|
1374
|
+
}
|
|
1375
|
+
interface UseTableFilteringReturn {
|
|
1376
|
+
/**
|
|
1377
|
+
* Current column filters state (controlled or internal)
|
|
1378
|
+
*/
|
|
1379
|
+
columnFiltersState: ColumnFiltersState;
|
|
1380
|
+
/**
|
|
1381
|
+
* Handler for TanStack Table's onColumnFiltersChange
|
|
1382
|
+
*/
|
|
1383
|
+
handleColumnFiltersChange: (updater: Updater<ColumnFiltersState>) => void;
|
|
1384
|
+
/**
|
|
1385
|
+
* Whether the component is in controlled mode
|
|
1386
|
+
*/
|
|
1387
|
+
isControlled: boolean;
|
|
1388
|
+
/**
|
|
1389
|
+
* Manual setter for uncontrolled mode (useful for imperative actions)
|
|
1390
|
+
*/
|
|
1391
|
+
setColumnFilters: (columnFilters: ColumnFiltersState) => void;
|
|
1392
|
+
}
|
|
1393
|
+
/**
|
|
1394
|
+
* Hook to manage table column filtering state (controlled or uncontrolled)
|
|
1395
|
+
*
|
|
1396
|
+
* @example Uncontrolled mode
|
|
1397
|
+
* ```tsx
|
|
1398
|
+
* const { columnFiltersState, handleColumnFiltersChange } = useTableFiltering({
|
|
1399
|
+
* defaultColumnFilters: [{ id: 'status', value: ['Active'] }],
|
|
1400
|
+
* onColumnFiltersChange: (state) => console.log(state)
|
|
1401
|
+
* });
|
|
1402
|
+
* ```
|
|
1403
|
+
*
|
|
1404
|
+
* @example Controlled mode
|
|
1405
|
+
* ```tsx
|
|
1406
|
+
* const [filters, setFilters] = useState<ColumnFiltersState>([]);
|
|
1407
|
+
* const { columnFiltersState, handleColumnFiltersChange } = useTableFiltering({
|
|
1408
|
+
* columnFilters: filters,
|
|
1409
|
+
* onColumnFiltersChange: setFilters
|
|
1410
|
+
* });
|
|
1411
|
+
* ```
|
|
1412
|
+
*/
|
|
1413
|
+
declare function useTableFiltering({ columnFilters: controlledFilters, defaultColumnFilters, onColumnFiltersChange, }: UseTableFilteringProps): UseTableFilteringReturn;
|
|
1414
|
+
|
|
1415
|
+
declare function useColumnFilter(columnId: string): {
|
|
1416
|
+
selectedValues: string[];
|
|
1417
|
+
handleChange: (values: string[]) => void;
|
|
1418
|
+
};
|
|
1419
|
+
|
|
1420
|
+
interface UseTableDataProps<T> {
|
|
1421
|
+
data: T[];
|
|
1422
|
+
columns: ColumnDef<T, unknown>[];
|
|
1423
|
+
initialPage?: number;
|
|
1424
|
+
initialPerPage?: number;
|
|
1425
|
+
initialSorting?: SortingState;
|
|
1426
|
+
initialColumnFilters?: ColumnFiltersState;
|
|
1427
|
+
}
|
|
1428
|
+
interface UseTableDataReturn<T> {
|
|
1429
|
+
paginatedData: T[];
|
|
1430
|
+
processedData: T[];
|
|
1431
|
+
page: number;
|
|
1432
|
+
perPage: number;
|
|
1433
|
+
totalPages: number;
|
|
1434
|
+
totalRecords: number;
|
|
1435
|
+
filteredRecords: number;
|
|
1436
|
+
setPage: (page: number) => void;
|
|
1437
|
+
setPerPage: (perPage: number) => void;
|
|
1438
|
+
sorting: SortingState;
|
|
1439
|
+
setSorting: (sorting: SortingState) => void;
|
|
1440
|
+
columnFilters: ColumnFiltersState;
|
|
1441
|
+
setColumnFilters: (filters: ColumnFiltersState) => void;
|
|
1442
|
+
getUniqueValues: (columnId: string) => string[];
|
|
1443
|
+
}
|
|
1444
|
+
declare function useTableData<T extends Record<string, unknown>>({ data, columns, initialPage, initialPerPage, initialSorting, initialColumnFilters, }: UseTableDataProps<T>): UseTableDataReturn<T>;
|
|
1445
|
+
|
|
1446
|
+
/**
|
|
1447
|
+
* Extracts unique values from a column in the dataset
|
|
1448
|
+
* @param data - The array of data objects
|
|
1449
|
+
* @param columnId - The column identifier
|
|
1450
|
+
* @param accessor - Optional accessor function to get the value from a row
|
|
1451
|
+
* @returns Array of unique string values, sorted alphabetically
|
|
1452
|
+
*/
|
|
1453
|
+
declare function getUniqueColumnValues<T>(data: T[], columnId: string, accessor?: (row: T, index: number) => unknown): string[];
|
|
1454
|
+
/**
|
|
1455
|
+
* Custom filter function for TanStack Table multi-select filtering
|
|
1456
|
+
* Checks if the row's value is included in the array of selected filter values
|
|
1457
|
+
* @param row - The row being filtered
|
|
1458
|
+
* @param columnId - The column identifier
|
|
1459
|
+
* @param filterValue - Array of selected filter values
|
|
1460
|
+
* @returns true if the row should be included in filtered results
|
|
1461
|
+
*/
|
|
1462
|
+
declare function multiSelectFilter<T>(row: Row<T>, columnId: string, filterValue: unknown): boolean;
|
|
1463
|
+
/**
|
|
1464
|
+
* Searches for a term within an array of items (case-insensitive)
|
|
1465
|
+
* @param items - Array of items to search through
|
|
1466
|
+
* @param searchTerm - The search term
|
|
1467
|
+
* @returns Filtered array of items matching the search term
|
|
1468
|
+
*/
|
|
1469
|
+
declare function searchInArray(items: string[], searchTerm: string): string[];
|
|
1470
|
+
/**
|
|
1471
|
+
* Gets the count of rows for each unique value in a column
|
|
1472
|
+
* Useful for showing counts next to filter options (e.g., "Active (5)")
|
|
1473
|
+
* @param data - The array of data objects
|
|
1474
|
+
* @param columnId - The column identifier
|
|
1475
|
+
* @param accessor - Optional accessor function to get the value from a row
|
|
1476
|
+
* @returns Object mapping values to their counts
|
|
1477
|
+
*/
|
|
1478
|
+
declare function getColumnValueCounts<T>(data: T[], columnId: string, accessor?: (row: T, index: number) => unknown): Record<string, number>;
|
|
1479
|
+
/**
|
|
1480
|
+
* Checks if a column has active filters
|
|
1481
|
+
* @param columnFilters - Current column filters state
|
|
1482
|
+
* @param columnId - The column identifier
|
|
1483
|
+
* @returns true if the column has active filters
|
|
1484
|
+
*/
|
|
1485
|
+
declare function hasActiveFilters(columnFilters: ColumnFiltersState, columnId: string): boolean;
|
|
1486
|
+
/**
|
|
1487
|
+
* Gets the active filter values for a specific column
|
|
1488
|
+
* @param columnFilters - Current column filters state
|
|
1489
|
+
* @param columnId - The column identifier
|
|
1490
|
+
* @returns Array of active filter values for the column
|
|
1491
|
+
*/
|
|
1492
|
+
declare function getActiveFilterValues(columnFilters: ColumnFiltersState, columnId: string): string[];
|
|
1493
|
+
/**
|
|
1494
|
+
* Gets the count of active filters across all columns
|
|
1495
|
+
* @param columnFilters - Current column filters state
|
|
1496
|
+
* @returns Total number of active filter values
|
|
1497
|
+
*/
|
|
1498
|
+
declare function getActiveFilterCount(columnFilters: ColumnFiltersState): number;
|
|
1499
|
+
|
|
1500
|
+
/**
|
|
1501
|
+
* Backend sorting format - object representation
|
|
1502
|
+
* Example: { name: 'asc', created_at: 'desc' }
|
|
1503
|
+
*/
|
|
1504
|
+
type SortRecord = Record<string, 'asc' | 'desc'>;
|
|
1505
|
+
/**
|
|
1506
|
+
* Converts TanStack Table SortingState to backend-friendly record format
|
|
1507
|
+
*
|
|
1508
|
+
* @param sortingState - TanStack sorting state array
|
|
1509
|
+
* @returns Object with field names as keys and 'asc'/'desc' as values
|
|
1510
|
+
*
|
|
1511
|
+
* @example
|
|
1512
|
+
* ```ts
|
|
1513
|
+
* const sortingState = [
|
|
1514
|
+
* { id: 'name', desc: false },
|
|
1515
|
+
* { id: 'created_at', desc: true }
|
|
1516
|
+
* ];
|
|
1517
|
+
*
|
|
1518
|
+
* const sortRecord = sortingStateToRecord(sortingState);
|
|
1519
|
+
* // Result: { name: 'asc', created_at: 'desc' }
|
|
1520
|
+
* ```
|
|
1521
|
+
*/
|
|
1522
|
+
declare function sortingStateToRecord(sortingState: SortingState): SortRecord;
|
|
1523
|
+
/**
|
|
1524
|
+
* Converts backend sort record to TanStack Table SortingState
|
|
1525
|
+
* Useful for initializing sorting state from backend response
|
|
1526
|
+
*
|
|
1527
|
+
* @param sortRecord - Object with field names and sort directions
|
|
1528
|
+
* @returns TanStack sorting state array
|
|
1529
|
+
*
|
|
1530
|
+
* @example
|
|
1531
|
+
* ```ts
|
|
1532
|
+
* const sortRecord = { name: 'asc', created_at: 'desc' };
|
|
1533
|
+
*
|
|
1534
|
+
* const sortingState = sortRecordToSortingState(sortRecord);
|
|
1535
|
+
* // Result: [
|
|
1536
|
+
* // { id: 'name', desc: false },
|
|
1537
|
+
* // { id: 'created_at', desc: true }
|
|
1538
|
+
* // ]
|
|
1539
|
+
* ```
|
|
1540
|
+
*/
|
|
1541
|
+
declare function sortRecordToSortingState(sortRecord: SortRecord): SortingState;
|
|
1542
|
+
/**
|
|
1543
|
+
* Converts SortingState to JSON string ready to send to Laravel backend
|
|
1544
|
+
* This is a convenience function for API calls
|
|
1545
|
+
*
|
|
1546
|
+
* @param sortingState - TanStack sorting state array
|
|
1547
|
+
* @returns JSON string representation of sort record
|
|
1548
|
+
*
|
|
1549
|
+
* @example
|
|
1550
|
+
* ```ts
|
|
1551
|
+
* const sortingState = [{ id: 'name', desc: false }];
|
|
1552
|
+
* const sortsParam = sortingStateToJsonString(sortingState);
|
|
1553
|
+
* // Result: '{"name":"asc"}'
|
|
1554
|
+
*
|
|
1555
|
+
* // Use in API call:
|
|
1556
|
+
* fetch(`/api/users?sorts=${sortsParam}`);
|
|
1557
|
+
* ```
|
|
1558
|
+
*/
|
|
1559
|
+
declare function sortingStateToJsonString(sortingState: SortingState): string;
|
|
1560
|
+
/**
|
|
1561
|
+
* Creates URLSearchParams for backend pagination with sorting
|
|
1562
|
+
* Compatible with Laravel PaginateHelper
|
|
1563
|
+
*
|
|
1564
|
+
* @param options - Pagination and sorting options
|
|
1565
|
+
* @returns URLSearchParams ready to append to API request
|
|
1566
|
+
*
|
|
1567
|
+
* @example
|
|
1568
|
+
* ```ts
|
|
1569
|
+
* const params = createBackendParams({
|
|
1570
|
+
* sorting: [{ id: 'name', desc: false }],
|
|
1571
|
+
* perPage: 20,
|
|
1572
|
+
* genericSearch: 'john',
|
|
1573
|
+
* filters: { role: 'admin', status: 'active' }
|
|
1574
|
+
* });
|
|
1575
|
+
*
|
|
1576
|
+
* fetch(`/api/users?${params.toString()}`);
|
|
1577
|
+
* // Result: /api/users?sorts={"name":"asc"}&perPage=20&genericSearch=john&filters={"role":"admin","status":"active"}
|
|
1578
|
+
* ```
|
|
1579
|
+
*/
|
|
1580
|
+
declare function createBackendParams(options: {
|
|
1581
|
+
sorting?: SortingState;
|
|
1582
|
+
perPage?: number;
|
|
1583
|
+
genericSearch?: string;
|
|
1584
|
+
filters?: Record<string, unknown>;
|
|
1585
|
+
}): URLSearchParams;
|
|
1586
|
+
|
|
1587
|
+
/**
|
|
1588
|
+
* Converts ColumnFiltersState to a simple object format
|
|
1589
|
+
* Example: [{ id: 'status', value: ['Active', 'Pending'] }]
|
|
1590
|
+
* => { status: ['Active', 'Pending'] }
|
|
1591
|
+
*
|
|
1592
|
+
* @param filters - The column filters state from TanStack Table
|
|
1593
|
+
* @returns Object with columnId as keys and filter values as values
|
|
1594
|
+
*/
|
|
1595
|
+
declare function columnFiltersToRecord(filters: ColumnFiltersState): Record<string, string[]>;
|
|
1596
|
+
/**
|
|
1597
|
+
* Converts ColumnFiltersState to a JSON string
|
|
1598
|
+
* Useful for API calls that expect JSON format
|
|
1599
|
+
*
|
|
1600
|
+
* @param filters - The column filters state from TanStack Table
|
|
1601
|
+
* @returns JSON string representation of filters
|
|
1602
|
+
*/
|
|
1603
|
+
declare function columnFiltersToJsonString(filters: ColumnFiltersState): string;
|
|
1604
|
+
/**
|
|
1605
|
+
* Converts ColumnFiltersState to URL query params format
|
|
1606
|
+
* Example: [{ id: 'status', value: ['Active', 'Pending'] }]
|
|
1607
|
+
* => 'filter[status]=Active,Pending'
|
|
1608
|
+
*
|
|
1609
|
+
* @param filters - The column filters state from TanStack Table
|
|
1610
|
+
* @param separator - Separator for multiple values (default: ',')
|
|
1611
|
+
* @returns Object suitable for URLSearchParams
|
|
1612
|
+
*/
|
|
1613
|
+
declare function columnFiltersToQueryParams(filters: ColumnFiltersState, separator?: string): Record<string, string>;
|
|
1614
|
+
/**
|
|
1615
|
+
* Converts ColumnFiltersState to individual query params per value
|
|
1616
|
+
* Example: [{ id: 'status', value: ['Active', 'Pending'] }]
|
|
1617
|
+
* => 'filter[status][]=Active&filter[status][]=Pending'
|
|
1618
|
+
*
|
|
1619
|
+
* @param filters - The column filters state from TanStack Table
|
|
1620
|
+
* @returns Object suitable for URLSearchParams with array notation
|
|
1621
|
+
*/
|
|
1622
|
+
declare function columnFiltersToArrayQueryParams(filters: ColumnFiltersState): Record<string, string[]>;
|
|
1623
|
+
/**
|
|
1624
|
+
* Creates complete backend request params with filters, sorting, and pagination
|
|
1625
|
+
* Combines filtering with other table features
|
|
1626
|
+
*
|
|
1627
|
+
* @param options - Configuration object
|
|
1628
|
+
* @param options.filters - Column filters state
|
|
1629
|
+
* @param options.sorts - Optional sorting state
|
|
1630
|
+
* @param options.page - Optional page number
|
|
1631
|
+
* @param options.perPage - Optional items per page
|
|
1632
|
+
* @returns Complete params object for API requests
|
|
1633
|
+
*/
|
|
1634
|
+
declare function createBackendParamsWithFilters({ filters, sorts, page, perPage, }: {
|
|
1635
|
+
filters: ColumnFiltersState;
|
|
1636
|
+
sorts?: Array<{
|
|
1637
|
+
id: string;
|
|
1638
|
+
desc: boolean;
|
|
1639
|
+
}>;
|
|
1640
|
+
page?: number;
|
|
1641
|
+
perPage?: number;
|
|
1642
|
+
}): Record<string, string | number>;
|
|
1643
|
+
/**
|
|
1644
|
+
* Parses URL query params back to ColumnFiltersState
|
|
1645
|
+
* Useful for restoring filters from URL
|
|
1646
|
+
*
|
|
1647
|
+
* @param params - URLSearchParams or query string
|
|
1648
|
+
* @param separator - Separator used in the query params (default: ',')
|
|
1649
|
+
* @returns ColumnFiltersState
|
|
1650
|
+
*/
|
|
1651
|
+
declare function parseQueryParamsToFilters(params: URLSearchParams | string, separator?: string): ColumnFiltersState;
|
|
1652
|
+
/**
|
|
1653
|
+
* Parses JSON string back to ColumnFiltersState
|
|
1654
|
+
*
|
|
1655
|
+
* @param jsonString - JSON string representation of filters
|
|
1656
|
+
* @returns ColumnFiltersState
|
|
1657
|
+
*/
|
|
1658
|
+
declare function parseJsonToFilters(jsonString: string): ColumnFiltersState;
|
|
1659
|
+
/**
|
|
1660
|
+
* Merges multiple filter states, with later filters overriding earlier ones
|
|
1661
|
+
*
|
|
1662
|
+
* @param filterStates - Multiple ColumnFiltersState arrays to merge
|
|
1663
|
+
* @returns Merged ColumnFiltersState
|
|
1664
|
+
*/
|
|
1665
|
+
declare function mergeFilters(...filterStates: ColumnFiltersState[]): ColumnFiltersState;
|
|
1666
|
+
|
|
1667
|
+
interface RowAction<T> {
|
|
1668
|
+
label: string;
|
|
1669
|
+
onClick: (row: T) => void;
|
|
1670
|
+
/** Renders a separator above this item */
|
|
1671
|
+
separator?: boolean;
|
|
1672
|
+
disabled?: boolean | ((row: T) => boolean);
|
|
1673
|
+
/** Renders item in destructive (red) style */
|
|
1674
|
+
destructive?: boolean;
|
|
1675
|
+
}
|
|
1676
|
+
interface DataTableRowActionsProps<T> {
|
|
1677
|
+
row: T;
|
|
1678
|
+
actions: RowAction<T>[];
|
|
1679
|
+
/** Screen-reader label for the trigger button. Default: "Open actions" */
|
|
1680
|
+
label?: string;
|
|
1681
|
+
}
|
|
1682
|
+
declare function DataTableRowActions<T>({ row, actions, label, }: DataTableRowActionsProps<T>): react_jsx_runtime.JSX.Element;
|
|
1683
|
+
|
|
1684
|
+
interface DataTableFooterProps {
|
|
1685
|
+
pagination: TablePaginationProps;
|
|
1686
|
+
/** Selected row count — renders "N row(s) selected" on the left */
|
|
1687
|
+
selectedCount?: number;
|
|
1688
|
+
className?: string;
|
|
1689
|
+
}
|
|
1690
|
+
declare function DataTableFooter({ pagination, selectedCount, className }: DataTableFooterProps): react_jsx_runtime.JSX.Element;
|
|
1691
|
+
|
|
1692
|
+
interface DataTableCardViewProps<T> {
|
|
1693
|
+
rows: Row<T>[];
|
|
1694
|
+
columns: Column<T, unknown>[];
|
|
1695
|
+
size?: TableCellSize;
|
|
1696
|
+
variant?: TableVariant;
|
|
1697
|
+
onRowClick?: (row: T) => void;
|
|
1698
|
+
isLoading?: boolean;
|
|
1699
|
+
skeletonRowCount?: number;
|
|
1700
|
+
emptyState?: ReactNode;
|
|
1701
|
+
}
|
|
1702
|
+
declare function DataTableCardView<T>({ rows, columns, size, variant, onRowClick, isLoading, skeletonRowCount, emptyState, }: DataTableCardViewProps<T>): react_jsx_runtime.JSX.Element;
|
|
1703
|
+
|
|
1704
|
+
interface DataTableToolbarProps<T> {
|
|
1705
|
+
/** TanStack Table instance. Optional when toolbar is rendered inside DataTable's toolbar prop (context available). */
|
|
1706
|
+
table?: Table$1<T>;
|
|
1707
|
+
/** Slot rendered on the left — e.g. search input, bulk-action buttons */
|
|
1708
|
+
leading?: ReactNode;
|
|
1709
|
+
/** Slot rendered on the right alongside the Columns button */
|
|
1710
|
+
trailing?: ReactNode;
|
|
1711
|
+
className?: string;
|
|
1712
|
+
/** Hide the built-in Columns visibility toggle. Default: false */
|
|
1713
|
+
hideColumnsToggle?: boolean;
|
|
1714
|
+
/** Hide the density toggle. Default: false */
|
|
1715
|
+
hideDensityToggle?: boolean;
|
|
1716
|
+
/**
|
|
1717
|
+
* Pass columnFilters directly if Toolbar is rendered outside DataTable's
|
|
1718
|
+
* context provider. When inside a DataTable, this is read from context.
|
|
1719
|
+
*/
|
|
1720
|
+
columnFilters?: ColumnFiltersState;
|
|
1721
|
+
}
|
|
1722
|
+
declare function DataTableToolbar<T>({ table: tableProp, leading, trailing, className, hideColumnsToggle, hideDensityToggle, columnFilters: columnFiltersProp, }: DataTableToolbarProps<T>): react_jsx_runtime.JSX.Element;
|
|
1723
|
+
|
|
1724
|
+
interface DataTableSearchProps {
|
|
1725
|
+
placeholder?: string;
|
|
1726
|
+
className?: string;
|
|
1727
|
+
/** Debounce delay in ms before committing to context. Default: 300 */
|
|
1728
|
+
debounce?: number;
|
|
1729
|
+
}
|
|
1730
|
+
declare function DataTableSearch({ placeholder, className, debounce, }: DataTableSearchProps): react_jsx_runtime.JSX.Element;
|
|
1731
|
+
|
|
1732
|
+
interface UseTableGlobalFilterProps {
|
|
1733
|
+
/**
|
|
1734
|
+
* Controlled global filter state (optional)
|
|
1735
|
+
* If provided, the component operates in controlled mode
|
|
1736
|
+
*/
|
|
1737
|
+
globalFilter?: string;
|
|
1738
|
+
/**
|
|
1739
|
+
* Default global filter state for uncontrolled mode
|
|
1740
|
+
* @default ''
|
|
1741
|
+
*/
|
|
1742
|
+
defaultGlobalFilter?: string;
|
|
1743
|
+
/**
|
|
1744
|
+
* Callback fired when global filter changes
|
|
1745
|
+
* Required for controlled mode, optional for uncontrolled
|
|
1746
|
+
*/
|
|
1747
|
+
onGlobalFilterChange?: (value: string) => void;
|
|
1748
|
+
}
|
|
1749
|
+
interface UseTableGlobalFilterReturn {
|
|
1750
|
+
/**
|
|
1751
|
+
* Current global filter state (controlled or internal)
|
|
1752
|
+
*/
|
|
1753
|
+
globalFilterState: string;
|
|
1754
|
+
/**
|
|
1755
|
+
* Handler for global filter changes
|
|
1756
|
+
*/
|
|
1757
|
+
handleGlobalFilterChange: (value: string) => void;
|
|
1758
|
+
/**
|
|
1759
|
+
* Whether the component is in controlled mode
|
|
1760
|
+
*/
|
|
1761
|
+
isControlled: boolean;
|
|
1762
|
+
/**
|
|
1763
|
+
* Manual setter for uncontrolled mode (useful for imperative actions)
|
|
1764
|
+
*/
|
|
1765
|
+
setGlobalFilter: (value: string) => void;
|
|
1766
|
+
}
|
|
1767
|
+
/**
|
|
1768
|
+
* Hook to manage table global filter state (controlled or uncontrolled)
|
|
1769
|
+
*
|
|
1770
|
+
* @example Uncontrolled mode
|
|
1771
|
+
* ```tsx
|
|
1772
|
+
* const { globalFilterState, handleGlobalFilterChange } = useTableGlobalFilter({
|
|
1773
|
+
* defaultGlobalFilter: '',
|
|
1774
|
+
* onGlobalFilterChange: (state) => console.log(state)
|
|
1775
|
+
* });
|
|
1776
|
+
* ```
|
|
1777
|
+
*
|
|
1778
|
+
* @example Controlled mode
|
|
1779
|
+
* ```tsx
|
|
1780
|
+
* const [globalFilter, setGlobalFilter] = useState<string>('');
|
|
1781
|
+
* const { globalFilterState, handleGlobalFilterChange } = useTableGlobalFilter({
|
|
1782
|
+
* globalFilter,
|
|
1783
|
+
* onGlobalFilterChange: setGlobalFilter
|
|
1784
|
+
* });
|
|
1785
|
+
* ```
|
|
1786
|
+
*/
|
|
1787
|
+
declare function useTableGlobalFilter({ globalFilter: controlledFilter, defaultGlobalFilter, onGlobalFilterChange, }: UseTableGlobalFilterProps): UseTableGlobalFilterReturn;
|
|
1788
|
+
|
|
1789
|
+
interface UseTableVisibilityProps {
|
|
1790
|
+
/**
|
|
1791
|
+
* Controlled column visibility state (optional)
|
|
1792
|
+
* If provided, the component operates in controlled mode
|
|
1793
|
+
*/
|
|
1794
|
+
columnVisibility?: VisibilityState;
|
|
1795
|
+
/**
|
|
1796
|
+
* Default column visibility state for uncontrolled mode
|
|
1797
|
+
* @default {}
|
|
1798
|
+
*/
|
|
1799
|
+
defaultColumnVisibility?: VisibilityState;
|
|
1800
|
+
/**
|
|
1801
|
+
* Callback fired when column visibility changes
|
|
1802
|
+
* Required for controlled mode, optional for uncontrolled
|
|
1803
|
+
*/
|
|
1804
|
+
onColumnVisibilityChange?: (state: VisibilityState) => void;
|
|
1805
|
+
}
|
|
1806
|
+
interface UseTableVisibilityReturn {
|
|
1807
|
+
/**
|
|
1808
|
+
* Current column visibility state (controlled or internal)
|
|
1809
|
+
*/
|
|
1810
|
+
columnVisibilityState: VisibilityState;
|
|
1811
|
+
/**
|
|
1812
|
+
* Handler for TanStack Table's onColumnVisibilityChange
|
|
1813
|
+
*/
|
|
1814
|
+
handleColumnVisibilityChange: (updater: Updater<VisibilityState>) => void;
|
|
1815
|
+
/**
|
|
1816
|
+
* Whether the component is in controlled mode
|
|
1817
|
+
*/
|
|
1818
|
+
isControlled: boolean;
|
|
1819
|
+
/**
|
|
1820
|
+
* Manual setter for uncontrolled mode (useful for imperative actions)
|
|
1821
|
+
*/
|
|
1822
|
+
setColumnVisibility: (state: VisibilityState) => void;
|
|
1823
|
+
}
|
|
1824
|
+
/**
|
|
1825
|
+
* Hook to manage table column visibility state (controlled or uncontrolled)
|
|
1826
|
+
*
|
|
1827
|
+
* @example Uncontrolled mode
|
|
1828
|
+
* ```tsx
|
|
1829
|
+
* const { columnVisibilityState, handleColumnVisibilityChange } = useTableVisibility({
|
|
1830
|
+
* defaultColumnVisibility: { email: false },
|
|
1831
|
+
* onColumnVisibilityChange: (state) => console.log(state)
|
|
1832
|
+
* });
|
|
1833
|
+
* ```
|
|
1834
|
+
*
|
|
1835
|
+
* @example Controlled mode
|
|
1836
|
+
* ```tsx
|
|
1837
|
+
* const [visibility, setVisibility] = useState<VisibilityState>({});
|
|
1838
|
+
* const { columnVisibilityState, handleColumnVisibilityChange } = useTableVisibility({
|
|
1839
|
+
* columnVisibility: visibility,
|
|
1840
|
+
* onColumnVisibilityChange: setVisibility
|
|
1841
|
+
* });
|
|
1842
|
+
* ```
|
|
1843
|
+
*/
|
|
1844
|
+
declare function useTableVisibility({ columnVisibility: controlledVisibility, defaultColumnVisibility, onColumnVisibilityChange, }: UseTableVisibilityProps): UseTableVisibilityReturn;
|
|
1845
|
+
|
|
1846
|
+
interface UseTableSizingProps {
|
|
1847
|
+
/**
|
|
1848
|
+
* Controlled column sizing state (optional)
|
|
1849
|
+
* If provided, the component operates in controlled mode
|
|
1850
|
+
*/
|
|
1851
|
+
columnSizing?: ColumnSizingState;
|
|
1852
|
+
/**
|
|
1853
|
+
* Default column sizing state for uncontrolled mode
|
|
1854
|
+
* @default {}
|
|
1855
|
+
*/
|
|
1856
|
+
defaultColumnSizing?: ColumnSizingState;
|
|
1857
|
+
/**
|
|
1858
|
+
* Callback fired when column sizing changes
|
|
1859
|
+
* Required for controlled mode, optional for uncontrolled
|
|
1860
|
+
*/
|
|
1861
|
+
onColumnSizingChange?: (state: ColumnSizingState) => void;
|
|
1862
|
+
}
|
|
1863
|
+
interface UseTableSizingReturn {
|
|
1864
|
+
/**
|
|
1865
|
+
* Current column sizing state (controlled or internal)
|
|
1866
|
+
*/
|
|
1867
|
+
columnSizingState: ColumnSizingState;
|
|
1868
|
+
/**
|
|
1869
|
+
* Handler for TanStack Table's onColumnSizingChange
|
|
1870
|
+
*/
|
|
1871
|
+
handleColumnSizingChange: (updater: Updater<ColumnSizingState>) => void;
|
|
1872
|
+
/**
|
|
1873
|
+
* Whether the component is in controlled mode
|
|
1874
|
+
*/
|
|
1875
|
+
isControlled: boolean;
|
|
1876
|
+
/**
|
|
1877
|
+
* Manual setter for uncontrolled mode (useful for imperative actions)
|
|
1878
|
+
*/
|
|
1879
|
+
setColumnSizing: (state: ColumnSizingState) => void;
|
|
1880
|
+
}
|
|
1881
|
+
/**
|
|
1882
|
+
* Hook to manage table column sizing state (controlled or uncontrolled)
|
|
1883
|
+
*
|
|
1884
|
+
* @example Uncontrolled mode
|
|
1885
|
+
* ```tsx
|
|
1886
|
+
* const { columnSizingState, handleColumnSizingChange } = useTableSizing({
|
|
1887
|
+
* defaultColumnSizing: { name: 150, email: 200 },
|
|
1888
|
+
* onColumnSizingChange: (state) => console.log(state)
|
|
1889
|
+
* });
|
|
1890
|
+
* ```
|
|
1891
|
+
*
|
|
1892
|
+
* @example Controlled mode
|
|
1893
|
+
* ```tsx
|
|
1894
|
+
* const [sizing, setSizing] = useState<ColumnSizingState>({});
|
|
1895
|
+
* const { columnSizingState, handleColumnSizingChange } = useTableSizing({
|
|
1896
|
+
* columnSizing: sizing,
|
|
1897
|
+
* onColumnSizingChange: setSizing
|
|
1898
|
+
* });
|
|
1899
|
+
* ```
|
|
1900
|
+
*/
|
|
1901
|
+
declare function useTableSizing({ columnSizing: controlledSizing, defaultColumnSizing, onColumnSizingChange, }: UseTableSizingProps): UseTableSizingReturn;
|
|
1902
|
+
|
|
1903
|
+
interface CanProps {
|
|
1904
|
+
permission: string | string[];
|
|
1905
|
+
mode?: 'any' | 'all';
|
|
1906
|
+
negate?: boolean;
|
|
1907
|
+
fallback?: ReactNode;
|
|
1908
|
+
children: ReactNode | ((allowed: boolean) => ReactNode);
|
|
1909
|
+
}
|
|
1910
|
+
type CanNotProps = Omit<CanProps, 'negate'>;
|
|
1911
|
+
/** Renders children when the user has the required permission(s). Requires `AbilityProvider` in the tree. */
|
|
1912
|
+
declare function Can({ permission, mode, negate, fallback, children }: CanProps): react_jsx_runtime.JSX.Element;
|
|
1913
|
+
declare namespace Can {
|
|
1914
|
+
var displayName: string;
|
|
1915
|
+
}
|
|
1916
|
+
/** Renders children when the user does NOT have the required permission(s). Alias for `<Can negate />`. Requires `AbilityProvider` in the tree. */
|
|
1917
|
+
declare function CanNot({ permission, mode, fallback, children }: CanNotProps): react_jsx_runtime.JSX.Element;
|
|
1918
|
+
declare namespace CanNot {
|
|
1919
|
+
var displayName: string;
|
|
1920
|
+
}
|
|
1921
|
+
|
|
1922
|
+
interface AbilityContextValue {
|
|
1923
|
+
can: (permissions: string | string[], mode?: 'any' | 'all') => boolean;
|
|
1924
|
+
setAbilities: (permissions: string[]) => void;
|
|
1925
|
+
clearAbilities: () => void;
|
|
1926
|
+
}
|
|
1927
|
+
interface AbilityProviderProps {
|
|
1928
|
+
children: ReactNode;
|
|
1929
|
+
permissions?: string[];
|
|
1930
|
+
}
|
|
1931
|
+
/**
|
|
1932
|
+
* @param pattern - an entry from the user's grant set (may contain `*` as a segment wildcard)
|
|
1933
|
+
* @param permission - the permission being requested (from `Can.perform`)
|
|
1934
|
+
*/
|
|
1935
|
+
declare function matchPermission(pattern: string, permission: string): boolean;
|
|
1936
|
+
declare function AbilityProvider({ children, permissions }: AbilityProviderProps): react_jsx_runtime.JSX.Element;
|
|
1937
|
+
declare function useAbility(): AbilityContextValue;
|
|
1938
|
+
declare function useCan(permissions: string | string[], mode?: 'any' | 'all'): boolean;
|
|
1939
|
+
|
|
1940
|
+
export { type AbilityContextValue, AbilityProvider, type AbilityProviderProps, Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, type AnimationTokens, Avatar, AvatarBadge, AvatarFallback, AvatarGroup, AvatarGroupCount, AvatarImage, Badge, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button$1 as Button, Calendar, CalendarDayButton, type CalendarEvent, type CalendarView, Can, CanNot, type CanNotProps, type CanProps, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, type CarouselApi, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, type CellAlignment, Checkbox, ColorPicker, ColorPickerAlpha, type ColorPickerAlphaProps, ColorPickerEyeDropper, type ColorPickerEyeDropperProps, ColorPickerFormat, type ColorPickerFormatProps, ColorPickerHue, type ColorPickerHueProps, ColorPickerOutput, type ColorPickerOutputProps, ColorPickerPresets, type ColorPickerPresetsProps, type ColorPickerProps, ColorPickerSelection, type ColorPickerSelectionProps, type ColumnMeta, Combobox, type ComboboxOption, type ComboboxProps, DataTable, DataTableCardView, type DataTableCardViewProps, DataTableColumnFilter, type DataTableColumnFilterProps, DataTableFooter, type DataTableFooterProps, DataTableHeaderCell, type DataTableHeaderCellProps, type DataTableProps, DataTableRowActions, type DataTableRowActionsProps, DataTableSearch, type DataTableSearchProps, DataTableSkeleton, type DataTableSkeletonProps, DataTableToolbar, type DataTableToolbarProps, DatePicker, type DatePickerProps, type DatePickerRangeProps, type DatePickerSingleProps, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Dropzone, DropzoneContent, type DropzoneContentProps, DropzoneEmptyState, type DropzoneEmptyStateProps, type DropzoneProps, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle, EventCalendar, type EventCalendarProps, type EventCreateRange, Field, FieldDescription, FieldError, FieldGroup, FieldLabel, FilterOption, type FilterOptionProps, Input, Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemGroup, ItemHeader, ItemMedia, ItemSeparator, ItemTitle, Link, Logo, type LogoKey, MiniCalendar, MiniCalendarDay, type MiniCalendarDayProps, MiniCalendarDays, type MiniCalendarDaysProps, MiniCalendarNavigation, type MiniCalendarNavigationProps, type MiniCalendarProps, Navbar, type NavbarDropdownItem, type NavbarNavLink, type NavbarProps, type NavbarUtilityLink, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, PinInput, type PinInputProps, Popover, PopoverAnchor, PopoverContent, PopoverDescription, PopoverHeader, PopoverTitle, PopoverTrigger, Progress, type ProgressProps, RadioGroup, RadioGroupItem, type RowAction, SegmentedControl, SegmentedControlItem, type SegmentedControlProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger$1 as SelectTrigger, SelectValue, Separator, SideBar, type SideBarItem, type SideBarProps, SidebarProvider, SidebarTrigger, Skeleton, Slider, type SortDirection, type SortRecord, Spinner, SpinnerDots, type SpinnerDotsProps, SpinnerLoader, type SpinnerLoaderProps, type SpinnerProps, Status, StatusIndicator, type StatusIndicatorProps, StatusLabel, type StatusLabelProps, type StatusProps, Switch, TEXT_SIZES, TEXT_WEIGHTS, Table, TableBody, TableCaption, TableCell, type TableCellSize, type TableClassNames, type TableColumnDef, type TableContextType, TableFooter, TableHead, TableHeader, TablePagination, type TablePaginationProps, TableRow, type TableVariant, Tabs, TabsContent, TabsList, TabsTrigger, Text, type TextAs, type TextProps, type TextSize, type TextWeight, Textarea, type ToastAction, type ToastItem, type ToastType, Toaster, type ToasterPosition, type ToasterProps, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, type UseTableDataProps, type UseTableDataReturn, type UseTableFilteringProps, type UseTableFilteringReturn, type UseTableGlobalFilterProps, type UseTableGlobalFilterReturn, type UseTableSizingProps, type UseTableSizingReturn, type UseTableSortingProps, type UseTableSortingReturn, type UseTableVisibilityProps, type UseTableVisibilityReturn, alertVariants, animation, avatarVariants, badgeVariants, buttonVariants$1 as buttonVariants, columnFiltersToArrayQueryParams, columnFiltersToJsonString, columnFiltersToQueryParams, columnFiltersToRecord, createBackendParams, createBackendParamsWithFilters, duration, ease, fadeIn, getActiveFilterCount, getActiveFilterValues, getColumnValueCounts, getUniqueColumnValues, hasActiveFilters, linkVariants, logos, matchPermission, mergeFilters, multiSelectFilter, navigationMenuTriggerStyle, parseJsonToFilters, parseQueryParamsToFilters, progressIndicatorVariants, progressVariants, scaleIn, searchInArray, skeletonVariants, slideRight, slideUp, sortRecordToSortingState, sortingStateToJsonString, sortingStateToRecord, spinnerDotsVariants, spinnerLoaderVariants, spinnerVariants, spring, stagger, toggleVariants, tooltipContentVariants, transition, useAbility, useAppForm, useCan, useCarousel, useColorPicker, useColumnFilter, useTableContext, useTableData, useTableFiltering, useTableGlobalFilter, useTableSizing, useTableSorting, useTableVisibility, useToast };
|