@acronis-platform/ui-react 5.2.0 → 5.3.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/dist/components/ui/area-chart/area-chart.js +107 -107
- package/dist/components/ui/area-chart/area-chart.js.map +1 -1
- package/dist/components/ui/bar-chart/bar-chart.js +162 -162
- package/dist/components/ui/bar-chart/bar-chart.js.map +1 -1
- package/dist/components/ui/category-bar/category-bar.js +50 -50
- package/dist/components/ui/category-bar/category-bar.js.map +1 -1
- package/dist/components/ui/chart/chart.js +53 -40
- package/dist/components/ui/chart/chart.js.map +1 -1
- package/dist/components/ui/composed-chart/composed-chart.js +146 -146
- package/dist/components/ui/composed-chart/composed-chart.js.map +1 -1
- package/dist/components/ui/confidence-cone/confidence-cone.js +97 -97
- package/dist/components/ui/confidence-cone/confidence-cone.js.map +1 -1
- package/dist/components/ui/data-table/data-table-bulk-actions-bar.js +1 -1
- package/dist/components/ui/data-table/data-table-bulk-actions-bar.js.map +1 -1
- package/dist/components/ui/data-table/data-table-view-options.js +3 -2
- package/dist/components/ui/data-table/data-table-view-options.js.map +1 -1
- package/dist/components/ui/data-table/data-table.js +136 -132
- package/dist/components/ui/data-table/data-table.js.map +1 -1
- package/dist/components/ui/funnel-chart/funnel-chart.js +120 -120
- package/dist/components/ui/funnel-chart/funnel-chart.js.map +1 -1
- package/dist/components/ui/histogram/histogram.js +58 -58
- package/dist/components/ui/histogram/histogram.js.map +1 -1
- package/dist/components/ui/line-chart/line-chart.js +91 -91
- package/dist/components/ui/line-chart/line-chart.js.map +1 -1
- package/dist/components/ui/pie-chart/pie-chart.js +92 -92
- package/dist/components/ui/pie-chart/pie-chart.js.map +1 -1
- package/dist/components/ui/radar-chart/radar-chart.js +37 -37
- package/dist/components/ui/radar-chart/radar-chart.js.map +1 -1
- package/dist/components/ui/radial-bar-chart/radial-bar-chart.js +112 -112
- package/dist/components/ui/radial-bar-chart/radial-bar-chart.js.map +1 -1
- package/dist/components/ui/sankey-chart/sankey-chart.js +78 -78
- package/dist/components/ui/sankey-chart/sankey-chart.js.map +1 -1
- package/dist/components/ui/scatter-chart/scatter-chart.js +57 -57
- package/dist/components/ui/scatter-chart/scatter-chart.js.map +1 -1
- package/dist/components/ui/table/table-view-options.js +88 -33
- package/dist/components/ui/table/table-view-options.js.map +1 -1
- package/dist/components/ui/table/table.js.map +1 -1
- package/dist/components/ui/treemap/treemap.js +87 -87
- package/dist/components/ui/treemap/treemap.js.map +1 -1
- package/dist/index.js +111 -111
- package/dist/llms/data-table.md +33 -7
- package/dist/llms/table.md +56 -23
- package/dist/llms.txt +1 -1
- package/dist/react.js +111 -111
- package/dist/src/components/ui/chart/chart.d.ts +1 -0
- package/dist/src/components/ui/chart/index.d.ts +1 -1
- package/dist/src/components/ui/data-table/data-table-view-options.d.ts +1 -1
- package/dist/src/components/ui/data-table/data-table.d.ts +11 -1
- package/dist/src/components/ui/data-table/data-table.docs.d.ts +6 -0
- package/dist/src/components/ui/radial-bar-chart/radial-bar-chart.d.ts +3 -2
- package/dist/src/components/ui/sankey-chart/sankey-chart.d.ts +1 -1
- package/dist/src/components/ui/table/table-view-options.d.ts +9 -1
- package/dist/src/components/ui/treemap/treemap.d.ts +3 -2
- package/dist/ui-react.css +1 -1
- package/package.json +3 -3
package/dist/index.js
CHANGED
|
@@ -12,116 +12,116 @@ import { Alert as n, AlertActions as r, AlertClose as i, AlertContent as a, Aler
|
|
|
12
12
|
import { Tooltip as d, TooltipContent as f, TooltipProvider as p, TooltipTrigger as m } from "./components/ui/tooltip/tooltip.js";
|
|
13
13
|
import { AppShellChat as h, AppShellChatChat as g, AppShellChatChatBody as _, AppShellChatChatHeader as v, AppShellChatContent as y, AppShellChatContentBody as b, AppShellChatContentHeader as x, AppShellChatSidebar as S, getAppShellChatInitialLayout as C, useAppShellChatInitialLayout as w } from "./components/ui/app-shell-chat/app-shell-chat.js";
|
|
14
14
|
import { CHART_CATEGORICAL_TOKENS as T, CHART_DEFAULT_PALETTE as E, CHART_DIVERGING_TOKENS as D, CHART_SEQUENTIAL_TOKENS as O, CHART_STATUS_TOKENS as k, findDuplicateTones as Te, listPaletteChoices as Ee, listPaletteStops as De, resolveSeriesColor as Oe } from "./components/ui/chart/chart-palette.js";
|
|
15
|
-
import { ChartContainer as ke, ChartLegend as Ae, ChartLegendContent as je, ChartStyle as Me, ChartTooltip as Ne, ChartTooltipContent as Pe, resolveChartColors as Fe } from "./components/ui/chart/chart.js";
|
|
16
|
-
import { CHART_BRUSH_ARIA_LABEL as
|
|
17
|
-
import { AreaChart as
|
|
18
|
-
import { Avatar as
|
|
19
|
-
import { BarChart as
|
|
20
|
-
import { Breadcrumb as
|
|
21
|
-
import { Button as
|
|
22
|
-
import { ButtonGroup as
|
|
23
|
-
import { ButtonMenu as
|
|
24
|
-
import { Calendar as
|
|
25
|
-
import { DialogFooterDefault as
|
|
26
|
-
import { InputSelect as A, InputSelectContent as j, InputSelectDescription as
|
|
27
|
-
import { CalendarHeader as
|
|
28
|
-
import { ButtonIconInput as
|
|
29
|
-
import { Switch as
|
|
30
|
-
import { Card as
|
|
31
|
-
import { CardFilter as
|
|
32
|
-
import { CardSection as
|
|
33
|
-
import { CardWidgetCarousel as
|
|
34
|
-
import { CardWidget as
|
|
35
|
-
import { CategoryBar as
|
|
36
|
-
import { CHART_STATE_ILLUSTRATIONS as
|
|
37
|
-
import { ChartState as
|
|
38
|
-
import { ChartWidget as
|
|
39
|
-
import { Checkbox as
|
|
40
|
-
import { Chip as
|
|
41
|
-
import { Combobox as
|
|
42
|
-
import { ComposedChart as
|
|
43
|
-
import { ConfidenceCone as
|
|
44
|
-
import { DropdownMenu as
|
|
45
|
-
import { Table as
|
|
46
|
-
import { TablePagination as
|
|
47
|
-
import { TableViewOptions as
|
|
48
|
-
import { isBulkSelectionActive as
|
|
49
|
-
import { DataTableViewOptions as
|
|
50
|
-
import { DataTable as
|
|
51
|
-
import { DataTableBulkActionsBar as
|
|
52
|
-
import { DataTableColumnHeader as
|
|
53
|
-
import { DataTableExpandTrigger as
|
|
54
|
-
import { DataTablePagination as
|
|
55
|
-
import { FilterChips as
|
|
56
|
-
import { Popover as
|
|
57
|
-
import { FilterSearch as
|
|
15
|
+
import { ChartContainer as ke, ChartLegend as Ae, ChartLegendContent as je, ChartStyle as Me, ChartTooltip as Ne, ChartTooltipContent as Pe, resolveChartColors as Fe, toCssKey as Ie } from "./components/ui/chart/chart.js";
|
|
16
|
+
import { CHART_BRUSH_ARIA_LABEL as Le, CHART_BRUSH_HEIGHT as Re, CHART_LABEL_FILL_CLASS as ze, CHART_LABEL_FILL_ON_SERIES_CLASS as Be, CHART_LABEL_FONT_SIZE as Ve, CHART_LABEL_MARGIN as He, CHART_REFERENCE_LINE_STROKE as Ue, createTickFormatter as We, dropProjectionPayload as Ge, formatCompactNumber as Ke, formatPercent as qe, resolveAnimation as Je, resolveAxisDomain as Ye, resolveBrushProps as Xe, resolveCartesianLabelPosition as Ze, resolveCategoryRange as Qe, resolveChartReferenceValue as $e, resolveLabelFillClass as et, resolveReferenceLineProps as tt, resolveRotatedTickAnchor as nt, resolveXAxisHeight as rt, resolveXAxisTitle as it, resolveYAxisTitle as at, toLabelFormatter as ot, toReferenceLineList as st } from "./components/ui/chart/chart-format.js";
|
|
17
|
+
import { AreaChart as ct, areaChartVariants as lt } from "./components/ui/area-chart/area-chart.js";
|
|
18
|
+
import { Avatar as ut, AvatarFallback as dt, AvatarGroup as ft, AvatarImage as pt, avatarVariants as mt } from "./components/ui/avatar/avatar.js";
|
|
19
|
+
import { BarChart as ht, barChartVariants as gt } from "./components/ui/bar-chart/bar-chart.js";
|
|
20
|
+
import { Breadcrumb as _t, BreadcrumbEllipsis as vt, BreadcrumbItem as yt, BreadcrumbLink as bt, BreadcrumbList as xt, BreadcrumbPage as St, BreadcrumbSeparator as Ct } from "./components/ui/breadcrumb/breadcrumb.js";
|
|
21
|
+
import { Button as wt, buttonVariants as Tt } from "./components/ui/button/button.js";
|
|
22
|
+
import { ButtonGroup as Et, ButtonGroupItem as Dt, buttonGroupItemVariants as Ot, buttonGroupVariants as kt } from "./components/ui/button-group/button-group.js";
|
|
23
|
+
import { ButtonMenu as At, buttonMenuVariants as jt } from "./components/ui/button-menu/button-menu.js";
|
|
24
|
+
import { Calendar as Mt, CalendarDayButton as Nt } from "./components/ui/calendar/calendar.js";
|
|
25
|
+
import { DialogFooterDefault as Pt } from "./components/ui/dialog-footer-default/dialog-footer-default.js";
|
|
26
|
+
import { InputSelect as A, InputSelectContent as j, InputSelectDescription as Ft, InputSelectError as It, InputSelectExpander as Lt, InputSelectField as Rt, InputSelectGroup as zt, InputSelectItem as M, InputSelectLabel as Bt, InputSelectSearch as Vt, InputSelectSection as N, InputSelectSectionLabel as P, InputSelectStatus as Ht, InputSelectTrigger as F, InputSelectValue as I, useInputSelectFilter as Ut } from "./components/ui/input-select/input-select.js";
|
|
27
|
+
import { CalendarHeader as Wt, CalendarItem as Gt, CalendarPanel as Kt } from "./components/ui/calendar-panel/calendar-panel.js";
|
|
28
|
+
import { ButtonIconInput as qt, buttonIconInputVariants as Jt } from "./components/ui/button-icon-input/button-icon-input.js";
|
|
29
|
+
import { Switch as Yt } from "./components/ui/switch/switch.js";
|
|
30
|
+
import { Card as Xt, CardContent as Zt, CardFooter as Qt, CardHeader as $t, cardVariants as en } from "./components/ui/card/card.js";
|
|
31
|
+
import { CardFilter as tn, cardFilterVariants as nn } from "./components/ui/card-filter/card-filter.js";
|
|
32
|
+
import { CardSection as rn, cardSectionVariants as an } from "./components/ui/card-section/card-section.js";
|
|
33
|
+
import { CardWidgetCarousel as on } from "./components/ui/card-widget-carousel/card-widget-carousel.js";
|
|
34
|
+
import { CardWidget as sn } from "./components/ui/card-widget-carousel/card-widget.js";
|
|
35
|
+
import { CategoryBar as cn, categoryBarVariants as ln } from "./components/ui/category-bar/category-bar.js";
|
|
36
|
+
import { CHART_STATE_ILLUSTRATIONS as un } from "./components/ui/chart-state/chart-state-illustrations.js";
|
|
37
|
+
import { ChartState as dn } from "./components/ui/chart-state/chart-state.js";
|
|
38
|
+
import { ChartWidget as fn } from "./components/ui/chart-widget/chart-widget.js";
|
|
39
|
+
import { Checkbox as pn } from "./components/ui/checkbox/checkbox.js";
|
|
40
|
+
import { Chip as mn, chipVariants as hn } from "./components/ui/chip/chip.js";
|
|
41
|
+
import { Combobox as gn, ComboboxContent as _n, ComboboxEmpty as vn, ComboboxGroup as yn, ComboboxGroupLabel as bn, ComboboxInput as xn, ComboboxItem as Sn, ComboboxList as Cn } from "./components/ui/combobox/combobox.js";
|
|
42
|
+
import { ComposedChart as wn, composedChartVariants as Tn } from "./components/ui/composed-chart/composed-chart.js";
|
|
43
|
+
import { ConfidenceCone as En } from "./components/ui/confidence-cone/confidence-cone.js";
|
|
44
|
+
import { DropdownMenu as Dn, DropdownMenuCheckboxItem as On, DropdownMenuContent as kn, DropdownMenuGroup as An, DropdownMenuItem as jn, DropdownMenuLabel as Mn, DropdownMenuPortal as Nn, DropdownMenuRadioGroup as Pn, DropdownMenuRadioItem as Fn, DropdownMenuSeparator as In, DropdownMenuShortcut as Ln, DropdownMenuSub as Rn, DropdownMenuSubContent as zn, DropdownMenuSubTrigger as Bn, DropdownMenuTrigger as Vn } from "./components/ui/dropdown-menu/dropdown-menu.js";
|
|
45
|
+
import { Table as Hn, TableActionsCell as Un, TableBody as Wn, TableCaption as Gn, TableCell as Kn, TableFooter as qn, TableHead as Jn, TableHeader as Yn, TableRow as Xn, TableSelectCell as Zn, TableSettingsCell as Qn } from "./components/ui/table/table.js";
|
|
46
|
+
import { TablePagination as $n } from "./components/ui/table/table-pagination.js";
|
|
47
|
+
import { TableViewOptions as er } from "./components/ui/table/table-view-options.js";
|
|
48
|
+
import { isBulkSelectionActive as tr } from "./components/ui/data-table/data-table-selection.js";
|
|
49
|
+
import { DataTableViewOptions as nr } from "./components/ui/data-table/data-table-view-options.js";
|
|
50
|
+
import { DataTable as rr, getCellStyle as ir, getColumnWidth as ar, getPinnedStyle as or, reorderColumn as sr } from "./components/ui/data-table/data-table.js";
|
|
51
|
+
import { DataTableBulkActionsBar as cr } from "./components/ui/data-table/data-table-bulk-actions-bar.js";
|
|
52
|
+
import { DataTableColumnHeader as lr } from "./components/ui/data-table/data-table-column-header.js";
|
|
53
|
+
import { DataTableExpandTrigger as ur } from "./components/ui/data-table/data-table-expand-trigger.js";
|
|
54
|
+
import { DataTablePagination as dr } from "./components/ui/data-table/data-table-pagination.js";
|
|
55
|
+
import { FilterChips as fr, FilterChipsList as pr, FilterChipsReset as mr } from "./components/ui/filter-chips/filter-chips.js";
|
|
56
|
+
import { Popover as hr, PopoverBody as gr, PopoverContent as _r, PopoverFooter as vr, PopoverPortal as yr, PopoverTrigger as br } from "./components/ui/popover/popover.js";
|
|
57
|
+
import { FilterSearch as xr, FilterSearchActions as Sr, FilterSearchAppliedFilters as Cr, FilterSearchFilters as wr, useFilterSearchFilters as Tr } from "./components/ui/filter-search/filter-search.js";
|
|
58
58
|
import { InputSearch as L } from "./components/ui/input-search/input-search.js";
|
|
59
|
-
import { DataTableToolbar as
|
|
60
|
-
import { InputDatePicker as
|
|
61
|
-
import { DateRangePicker as
|
|
62
|
-
import { DescriptionList as
|
|
63
|
-
import { InputBox as
|
|
64
|
-
import { InputText as
|
|
65
|
-
import { Loading as
|
|
66
|
-
import { Dialog as
|
|
67
|
-
import { DialogFooterCarousel as
|
|
68
|
-
import { DialogWelcome as
|
|
69
|
-
import { Empty as
|
|
70
|
-
import { EmptyOverlay as
|
|
71
|
-
import { labelClassName as
|
|
72
|
-
import { Separator as
|
|
73
|
-
import { Field as
|
|
74
|
-
import { FittedActions as
|
|
75
|
-
import { FilterCards as
|
|
76
|
-
import { FUNNEL_CHART_DEFAULT_PALETTE as
|
|
77
|
-
import { Grid as
|
|
78
|
-
import { Histogram as
|
|
79
|
-
import { Form as
|
|
80
|
-
import { RadarChart as
|
|
81
|
-
import { RadialBarChart as
|
|
82
|
-
import { Radio as
|
|
83
|
-
import { InputNumPicker as
|
|
84
|
-
import { InputOTP as
|
|
85
|
-
import { InputPassword as
|
|
59
|
+
import { DataTableToolbar as Er } from "./components/ui/data-table/data-table-toolbar.js";
|
|
60
|
+
import { InputDatePicker as Dr } from "./components/ui/input-date-picker/input-date-picker.js";
|
|
61
|
+
import { DateRangePicker as Or } from "./components/ui/date-range-picker/date-range-picker.js";
|
|
62
|
+
import { DescriptionList as kr, DescriptionListActions as Ar, DescriptionListItem as jr, DescriptionListLabel as Mr, DescriptionListValue as Nr, DescriptionListValueDescription as Pr } from "./components/ui/description-list/description-list.js";
|
|
63
|
+
import { InputBox as Fr } from "./components/ui/input/input.js";
|
|
64
|
+
import { InputText as R } from "./components/ui/input-text/input-text.js";
|
|
65
|
+
import { Loading as Ir, loadingVariants as Lr } from "./components/ui/loading/loading.js";
|
|
66
|
+
import { Dialog as Rr, DialogClose as zr } from "./components/ui/dialog/dialog.js";
|
|
67
|
+
import { DialogFooterCarousel as Br } from "./components/ui/dialog-footer-carousel/dialog-footer-carousel.js";
|
|
68
|
+
import { DialogWelcome as Vr } from "./components/ui/dialog-welcome/dialog-welcome.js";
|
|
69
|
+
import { Empty as z, EmptyActions as Hr, EmptyDescription as Ur, EmptyHeader as Wr, EmptyIcon as Gr, EmptyLinks as Kr, EmptyTitle as qr } from "./components/ui/empty/empty.js";
|
|
70
|
+
import { EmptyOverlay as Jr, emptyOverlayIconVariants as Yr } from "./components/ui/empty-overlay/empty-overlay.js";
|
|
71
|
+
import { labelClassName as Xr } from "./components/ui/label/label.js";
|
|
72
|
+
import { Separator as Zr } from "./components/ui/separator/separator.js";
|
|
73
|
+
import { Field as Qr, FieldContent as $r, FieldControl as ei, FieldDescription as ti, FieldError as ni, FieldGroup as ri, FieldLabel as ii, FieldLegend as ai, FieldSeparator as oi, FieldSet as si, FieldTitle as ci } from "./components/ui/field/field.js";
|
|
74
|
+
import { FittedActions as li, computeFittedVisibleCount as ui } from "./components/ui/fitted-actions/fitted-actions.js";
|
|
75
|
+
import { FilterCards as di } from "./components/ui/filter-cards/filter-cards.js";
|
|
76
|
+
import { FUNNEL_CHART_DEFAULT_PALETTE as fi, FunnelChart as pi, funnelChartPercent as mi, funnelChartVariants as hi } from "./components/ui/funnel-chart/funnel-chart.js";
|
|
77
|
+
import { Grid as gi, gridVariants as _i } from "./components/ui/grid/grid.js";
|
|
78
|
+
import { Histogram as vi } from "./components/ui/histogram/histogram.js";
|
|
79
|
+
import { Form as yi } from "./components/ui/form/form.js";
|
|
80
|
+
import { RadarChart as bi, radarChartVariants as xi } from "./components/ui/radar-chart/radar-chart.js";
|
|
81
|
+
import { RadialBarChart as Si } from "./components/ui/radial-bar-chart/radial-bar-chart.js";
|
|
82
|
+
import { Radio as Ci, RadioGroup as wi } from "./components/ui/radio/radio.js";
|
|
83
|
+
import { InputNumPicker as Ti } from "./components/ui/input-num-picker/input-num-picker.js";
|
|
84
|
+
import { InputOTP as Ei } from "./components/ui/input-otp/input-otp.js";
|
|
85
|
+
import { InputPassword as Di } from "./components/ui/input-password/input-password.js";
|
|
86
86
|
import { InputTextArea as B } from "./components/ui/input-text-area/input-text-area.js";
|
|
87
|
-
import { LineChart as
|
|
88
|
-
import { Link as
|
|
89
|
-
import { Skeleton as
|
|
90
|
-
import { TrendIndicator as
|
|
91
|
-
import { Metric as
|
|
92
|
-
import { NumberField as
|
|
93
|
-
import { PageContent as
|
|
94
|
-
import { Tag as V, tagVariants as
|
|
95
|
-
import { PageHeader as
|
|
96
|
-
import { Pagination as
|
|
97
|
-
import { PieChart as
|
|
98
|
-
import { Progress as
|
|
99
|
-
import { ProgressCircle as
|
|
100
|
-
import { SankeyChart as
|
|
101
|
-
import { ScatterChart as
|
|
102
|
-
import { ScrollArea as
|
|
103
|
-
import { Section as
|
|
104
|
-
import { Sheet as H, SheetBody as U, SheetClose as W, SheetCloseButton as G, SheetContent as K, SheetDescription as q, SheetFooter as J, SheetHeader as Y, SheetOverlay as X, SheetPortal as Z, SheetTitle as Q, SheetTrigger as $, sheetVariants as
|
|
105
|
-
import { SheetDetails as
|
|
106
|
-
import { Slider as
|
|
107
|
-
import { Stack as
|
|
108
|
-
import { Stepper as
|
|
109
|
-
import { StepperItem as
|
|
110
|
-
import { ResizableHandle as
|
|
111
|
-
import { SidebarPrimary as
|
|
112
|
-
import { SidebarSecondary as
|
|
113
|
-
import { ButtonIconMenu as
|
|
114
|
-
import { Tabs as
|
|
115
|
-
import { Toaster as
|
|
116
|
-
import { Toggle as
|
|
117
|
-
import { Toolbar as
|
|
118
|
-
import { middleTruncate as
|
|
119
|
-
import { measureTextWidth as
|
|
120
|
-
import { TruncateText as
|
|
121
|
-
import { Timeline as
|
|
122
|
-
import { Timer as
|
|
123
|
-
import { TreeItem as
|
|
124
|
-
import { Treemap as
|
|
125
|
-
import { WidgetPlaceholder as
|
|
126
|
-
import { Wizard as
|
|
127
|
-
export { _e as Accordion, xe as AccordionContainer, Se as AccordionContainerContent, Ce as AccordionContainerTrigger, ve as AccordionContent, ye as AccordionItem, be as AccordionTrigger, n as Alert, r as AlertActions, i as AlertClose, a as AlertContent, o as AlertDescription, s as AlertIcon, c as AlertText, l as AlertTitle, h as AppShellChat, g as AppShellChatChat, _ as AppShellChatChatBody, v as AppShellChatChatHeader, y as AppShellChatContent, b as AppShellChatContentBody, x as AppShellChatContentHeader, S as AppShellChatSidebar,
|
|
87
|
+
import { LineChart as Oi, lineChartVariants as ki } from "./components/ui/line-chart/line-chart.js";
|
|
88
|
+
import { Link as Ai, linkVariants as ji } from "./components/ui/link/link.js";
|
|
89
|
+
import { Skeleton as Mi } from "./components/ui/skeleton/skeleton.js";
|
|
90
|
+
import { TrendIndicator as Ni, trendIndicatorVariants as Pi } from "./components/ui/trend-indicator/trend-indicator.js";
|
|
91
|
+
import { Metric as Fi } from "./components/ui/metric/metric.js";
|
|
92
|
+
import { NumberField as Ii, NumberFieldDecrement as Li, NumberFieldGroup as Ri, NumberFieldIncrement as zi, NumberFieldInput as Bi } from "./components/ui/number-field/number-field.js";
|
|
93
|
+
import { PageContent as Vi } from "./components/ui/page-content/page-content.js";
|
|
94
|
+
import { Tag as V, tagVariants as Hi } from "./components/ui/tag/tag.js";
|
|
95
|
+
import { PageHeader as Ui, PageHeaderActions as Wi, PageHeaderDescription as Gi, PageHeaderDescriptionRow as Ki, PageHeaderRow as qi, PageHeaderTags as Ji, PageHeaderTitle as Yi } from "./components/ui/page-header/page-header.js";
|
|
96
|
+
import { Pagination as Xi, PaginationContent as Zi, PaginationEllipsis as Qi, PaginationItem as $i, PaginationLink as ea, PaginationNext as ta, PaginationPrevious as na } from "./components/ui/pagination/pagination.js";
|
|
97
|
+
import { PieChart as ra, pieChartVariants as ia } from "./components/ui/pie-chart/pie-chart.js";
|
|
98
|
+
import { Progress as aa } from "./components/ui/progress/progress.js";
|
|
99
|
+
import { ProgressCircle as oa, progressCircleVariants as sa } from "./components/ui/progress-circle/progress-circle.js";
|
|
100
|
+
import { SankeyChart as ca } from "./components/ui/sankey-chart/sankey-chart.js";
|
|
101
|
+
import { ScatterChart as la } from "./components/ui/scatter-chart/scatter-chart.js";
|
|
102
|
+
import { ScrollArea as ua, ScrollBar as da } from "./components/ui/scroll-area/scroll-area.js";
|
|
103
|
+
import { Section as fa, SectionContent as pa, SectionHeader as ma, sectionVariants as ha, useSectionContext as ga } from "./components/ui/section/section.js";
|
|
104
|
+
import { Sheet as H, SheetBody as U, SheetClose as W, SheetCloseButton as G, SheetContent as K, SheetDescription as q, SheetFooter as J, SheetHeader as Y, SheetOverlay as X, SheetPortal as Z, SheetTitle as Q, SheetTrigger as $, sheetVariants as _a } from "./components/ui/sheet/sheet.js";
|
|
105
|
+
import { SheetDetails as va } from "./components/ui/sheet/sheet-details.js";
|
|
106
|
+
import { Slider as ya } from "./components/ui/slider/slider.js";
|
|
107
|
+
import { Stack as ba, stackVariants as xa } from "./components/ui/stack/stack.js";
|
|
108
|
+
import { Stepper as Sa } from "./components/ui/stepper/stepper.js";
|
|
109
|
+
import { StepperItem as Ca, stepperItemVariants as wa } from "./components/ui/stepper-item/stepper-item.js";
|
|
110
|
+
import { ResizableHandle as Ta, ResizablePanel as Ea, ResizablePanelGroup as Da } from "./components/ui/resizable/resizable.js";
|
|
111
|
+
import { SidebarPrimary as Oa, SidebarPrimaryCollapseTrigger as ka, SidebarPrimaryContent as Aa, SidebarPrimaryFooter as ja, SidebarPrimaryHeader as Ma, SidebarPrimaryMenu as Na, SidebarPrimaryMenuItem as Pa, SidebarPrimaryMenuItemExtras as Fa, SidebarPrimarySection as Ia, sidebarPrimaryMenuItemVariants as La } from "./components/ui/sidebar-primary/sidebar-primary.js";
|
|
112
|
+
import { SidebarSecondary as Ra, SidebarSecondaryCollapseTrigger as za, SidebarSecondaryContent as Ba, SidebarSecondaryFooter as Va, SidebarSecondaryHeader as Ha, SidebarSecondaryMenu as Ua, SidebarSecondaryMenuItem as Wa, SidebarSecondaryMenuItemExtras as Ga, SidebarSecondarySection as Ka, SidebarSecondarySectionLabel as qa, sidebarSecondaryMenuItemVariants as Ja } from "./components/ui/sidebar-secondary/sidebar-secondary.js";
|
|
113
|
+
import { ButtonIconMenu as Ya } from "./components/ui/button-icon-menu/button-icon-menu.js";
|
|
114
|
+
import { Tabs as Xa, TabsContent as Za, TabsList as Qa, TabsTrigger as $a } from "./components/ui/tabs/tabs.js";
|
|
115
|
+
import { Toaster as eo, toast as to, toastVariants as no } from "./components/ui/toast/toast.js";
|
|
116
|
+
import { Toggle as ro, ToggleGroup as io, ToggleGroupItem as ao } from "./components/ui/toggle-group/toggle-group.js";
|
|
117
|
+
import { Toolbar as oo, ToolbarActionList as so, ToolbarActions as co } from "./components/ui/toolbar/toolbar.js";
|
|
118
|
+
import { middleTruncate as lo } from "./components/ui/truncate-text/middle-truncate.js";
|
|
119
|
+
import { measureTextWidth as uo } from "./components/ui/truncate-text/text-width.js";
|
|
120
|
+
import { TruncateText as fo } from "./components/ui/truncate-text/truncate-text.js";
|
|
121
|
+
import { Timeline as po, TimelineItem as mo } from "./components/ui/timeline/timeline.js";
|
|
122
|
+
import { Timer as ho } from "./components/ui/timer/timer.js";
|
|
123
|
+
import { TreeItem as go } from "./components/ui/tree-item/tree-item.js";
|
|
124
|
+
import { Treemap as _o } from "./components/ui/treemap/treemap.js";
|
|
125
|
+
import { WidgetPlaceholder as vo, WidgetPlaceholderAction as yo, WidgetPlaceholderContent as bo, WidgetPlaceholderFooter as xo, WidgetPlaceholderHeader as So, WidgetPlaceholderIcon as Co, WidgetPlaceholderImage as wo, WidgetPlaceholderText as To, WidgetPlaceholderTitle as Eo } from "./components/ui/widget-placeholder/widget-placeholder.js";
|
|
126
|
+
import { Wizard as Do, WizardBody as Oo, WizardHeader as ko, WizardSubtitle as Ao } from "./components/ui/wizard/wizard.js";
|
|
127
|
+
export { _e as Accordion, xe as AccordionContainer, Se as AccordionContainerContent, Ce as AccordionContainerTrigger, ve as AccordionContent, ye as AccordionItem, be as AccordionTrigger, n as Alert, r as AlertActions, i as AlertClose, a as AlertContent, o as AlertDescription, s as AlertIcon, c as AlertText, l as AlertTitle, h as AppShellChat, g as AppShellChatChat, _ as AppShellChatChatBody, v as AppShellChatChatHeader, y as AppShellChatContent, b as AppShellChatContentBody, x as AppShellChatContentHeader, S as AppShellChatSidebar, ct as AreaChart, ut as Avatar, dt as AvatarFallback, ft as AvatarGroup, pt as AvatarImage, ce as BREAKPOINT_2XL, le as BREAKPOINT_3XL, ue as BREAKPOINT_4XL, de as BREAKPOINT_LG, fe as BREAKPOINT_XL, V as Badge, ht as BarChart, _t as Breadcrumb, vt as BreadcrumbEllipsis, yt as BreadcrumbItem, bt as BreadcrumbLink, xt as BreadcrumbList, St as BreadcrumbPage, Ct as BreadcrumbSeparator, wt as Button, Et as ButtonGroup, Dt as ButtonGroupItem, e as ButtonIcon, qt as ButtonIconInput, Ya as ButtonIconMenu, At as ButtonMenu, Le as CHART_BRUSH_ARIA_LABEL, Re as CHART_BRUSH_HEIGHT, T as CHART_CATEGORICAL_TOKENS, E as CHART_DEFAULT_PALETTE, D as CHART_DIVERGING_TOKENS, ze as CHART_LABEL_FILL_CLASS, Be as CHART_LABEL_FILL_ON_SERIES_CLASS, Ve as CHART_LABEL_FONT_SIZE, He as CHART_LABEL_MARGIN, Ue as CHART_REFERENCE_LINE_STROKE, O as CHART_SEQUENTIAL_TOKENS, un as CHART_STATE_ILLUSTRATIONS, k as CHART_STATUS_TOKENS, Mt as Calendar, Nt as CalendarDayButton, Wt as CalendarHeader, Gt as CalendarItem, Kt as CalendarPanel, Xt as Card, Zt as CardContent, tn as CardFilter, Qt as CardFooter, $t as CardHeader, rn as CardSection, sn as CardWidget, on as CardWidgetCarousel, cn as CategoryBar, ke as ChartContainer, Ae as ChartLegend, je as ChartLegendContent, dn as ChartState, Me as ChartStyle, Ne as ChartTooltip, Pe as ChartTooltipContent, fn as ChartWidget, pn as Checkbox, mn as Chip, gn as Combobox, _n as ComboboxContent, vn as ComboboxEmpty, yn as ComboboxGroup, bn as ComboboxGroupLabel, xn as ComboboxInput, Sn as ComboboxItem, Cn as ComboboxList, wn as ComposedChart, En as ConfidenceCone, re as DEFAULT_TABLE_URL_PARAM_KEYS, rr as DataTable, cr as DataTableBulkActionsBar, lr as DataTableColumnHeader, ur as DataTableExpandTrigger, dr as DataTablePagination, Er as DataTableToolbar, nr as DataTableViewOptions, Or as DateRangePicker, kr as DescriptionList, Ar as DescriptionListActions, jr as DescriptionListItem, Mr as DescriptionListLabel, Nr as DescriptionListValue, Pr as DescriptionListValueDescription, H as Details, U as DetailsBody, W as DetailsClose, G as DetailsCloseButton, K as DetailsContent, q as DetailsDescription, J as DetailsFooter, Y as DetailsHeader, X as DetailsOverlay, Z as DetailsPortal, Q as DetailsTitle, $ as DetailsTrigger, Rr as Dialog, zr as DialogClose, Br as DialogFooterCarousel, Pt as DialogFooterDefault, Vr as DialogWelcome, Dn as DropdownMenu, On as DropdownMenuCheckboxItem, kn as DropdownMenuContent, An as DropdownMenuGroup, jn as DropdownMenuItem, Mn as DropdownMenuLabel, Nn as DropdownMenuPortal, Pn as DropdownMenuRadioGroup, Fn as DropdownMenuRadioItem, In as DropdownMenuSeparator, Ln as DropdownMenuShortcut, Rn as DropdownMenuSub, zn as DropdownMenuSubContent, Bn as DropdownMenuSubTrigger, Vn as DropdownMenuTrigger, z as Empty, Hr as EmptyActions, Ur as EmptyDescription, Wr as EmptyHeader, Gr as EmptyIcon, Kr as EmptyLinks, Jr as EmptyOverlay, qr as EmptyTitle, fi as FUNNEL_CHART_DEFAULT_PALETTE, Qr as Field, $r as FieldContent, ei as FieldControl, ti as FieldDescription, ni as FieldError, ri as FieldGroup, ii as FieldLabel, ai as FieldLegend, oi as FieldSeparator, si as FieldSet, ci as FieldTitle, di as FilterCards, fr as FilterChips, pr as FilterChipsList, mr as FilterChipsReset, xr as FilterSearch, Sr as FilterSearchActions, Cr as FilterSearchAppliedFilters, wr as FilterSearchFilters, li as FittedActions, yi as Form, pi as FunnelChart, gi as Grid, vi as Histogram, R as Input, Fr as InputBox, Dr as InputDatePicker, Ti as InputNumPicker, Ei as InputOTP, Di as InputPassword, L as InputSearch, A as InputSelect, j as InputSelectContent, Ft as InputSelectDescription, It as InputSelectError, Lt as InputSelectExpander, Rt as InputSelectField, zt as InputSelectGroup, M as InputSelectItem, Bt as InputSelectLabel, Vt as InputSelectSearch, N as InputSelectSection, P as InputSelectSectionLabel, Ht as InputSelectStatus, F as InputSelectTrigger, I as InputSelectValue, R as InputText, B as InputTextArea, Oi as LineChart, Ai as Link, Ir as Loading, Fi as Metric, Ii as NumberField, Li as NumberFieldDecrement, Ri as NumberFieldGroup, zi as NumberFieldIncrement, Bi as NumberFieldInput, Vi as PageContent, Ui as PageHeader, Wi as PageHeaderActions, Gi as PageHeaderDescription, Ki as PageHeaderDescriptionRow, qi as PageHeaderRow, Ji as PageHeaderTags, Yi as PageHeaderTitle, Xi as Pagination, Zi as PaginationContent, Qi as PaginationEllipsis, $i as PaginationItem, ea as PaginationLink, ta as PaginationNext, na as PaginationPrevious, ra as PieChart, hr as Popover, gr as PopoverBody, _r as PopoverContent, vr as PopoverFooter, yr as PopoverPortal, br as PopoverTrigger, he as PortalContainerProvider, aa as Progress, oa as ProgressCircle, pe as ROOT_FONT_SIZE_PX, bi as RadarChart, Si as RadialBarChart, Ci as Radio, wi as RadioGroup, Ta as ResizableHandle, Ea as ResizablePanel, Da as ResizablePanelGroup, ca as SankeyChart, la as ScatterChart, ua as ScrollArea, da as ScrollBar, L as Search, fa as Section, pa as SectionContent, ma as SectionHeader, A as Select, j as SelectContent, N as SelectGroup, P as SelectGroupLabel, M as SelectItem, F as SelectTrigger, I as SelectValue, Zr as Separator, H as Sheet, U as SheetBody, W as SheetClose, G as SheetCloseButton, K as SheetContent, q as SheetDescription, va as SheetDetails, J as SheetFooter, Y as SheetHeader, X as SheetOverlay, Z as SheetPortal, Q as SheetTitle, $ as SheetTrigger, Oa as SidebarPrimary, ka as SidebarPrimaryCollapseTrigger, Aa as SidebarPrimaryContent, ja as SidebarPrimaryFooter, Ma as SidebarPrimaryHeader, Na as SidebarPrimaryMenu, Pa as SidebarPrimaryMenuItem, Fa as SidebarPrimaryMenuItemExtras, Ia as SidebarPrimarySection, Ra as SidebarSecondary, za as SidebarSecondaryCollapseTrigger, Ba as SidebarSecondaryContent, Va as SidebarSecondaryFooter, Ha as SidebarSecondaryHeader, Ua as SidebarSecondaryMenu, Wa as SidebarSecondaryMenuItem, Ga as SidebarSecondaryMenuItemExtras, Ka as SidebarSecondarySection, qa as SidebarSecondarySectionLabel, Mi as Skeleton, ya as Slider, ba as Stack, Sa as Stepper, Ca as StepperItem, Yt as Switch, Hn as Table, Un as TableActionsCell, Wn as TableBody, Gn as TableCaption, Kn as TableCell, qn as TableFooter, Jn as TableHead, Yn as TableHeader, $n as TablePagination, Xn as TableRow, Zn as TableSelectCell, Qn as TableSettingsCell, er as TableViewOptions, Xa as Tabs, Za as TabsContent, Qa as TabsList, $a as TabsTrigger, V as Tag, B as Textarea, po as Timeline, mo as TimelineItem, ho as Timer, eo as Toaster, ro as Toggle, io as ToggleGroup, ao as ToggleGroupItem, oo as Toolbar, so as ToolbarActionList, co as ToolbarActions, d as Tooltip, f as TooltipContent, p as TooltipProvider, m as TooltipTrigger, go as TreeItem, _o as Treemap, Ni as TrendIndicator, fo as TruncateText, vo as WidgetPlaceholder, yo as WidgetPlaceholderAction, bo as WidgetPlaceholderContent, xo as WidgetPlaceholderFooter, So as WidgetPlaceholderHeader, Co as WidgetPlaceholderIcon, wo as WidgetPlaceholderImage, To as WidgetPlaceholderText, Eo as WidgetPlaceholderTitle, Do as Wizard, Oo as WizardBody, ko as WizardHeader, Ao as WizardSubtitle, u as alertVariants, lt as areaChartVariants, mt as avatarVariants, gt as barChartVariants, Ot as buttonGroupItemVariants, kt as buttonGroupVariants, Jt as buttonIconInputVariants, t as buttonIconVariants, jt as buttonMenuVariants, Tt as buttonVariants, nn as cardFilterVariants, an as cardSectionVariants, en as cardVariants, ln as categoryBarVariants, hn as chipVariants, ee as cn, Tn as composedChartVariants, ui as computeFittedVisibleCount, We as createTickFormatter, Ge as dropProjectionPayload, Yr as emptyOverlayIconVariants, Te as findDuplicateTones, Ke as formatCompactNumber, qe as formatPercent, mi as funnelChartPercent, hi as funnelChartVariants, C as getAppShellChatInitialLayout, ir as getCellStyle, ar as getColumnWidth, or as getPinnedStyle, me as getViewportWidth, _i as gridVariants, tr as isBulkSelectionActive, Xr as labelClassName, ki as lineChartVariants, ji as linkVariants, Ee as listPaletteChoices, De as listPaletteStops, Lr as loadingVariants, uo as measureTextWidth, lo as middleTruncate, ie as parseTableUrlState, ia as pieChartVariants, sa as progressCircleVariants, xi as radarChartVariants, sr as reorderColumn, Je as resolveAnimation, Ye as resolveAxisDomain, Xe as resolveBrushProps, Ze as resolveCartesianLabelPosition, Qe as resolveCategoryRange, Fe as resolveChartColors, $e as resolveChartReferenceValue, et as resolveLabelFillClass, tt as resolveReferenceLineProps, nt as resolveRotatedTickAnchor, Oe as resolveSeriesColor, rt as resolveXAxisHeight, it as resolveXAxisTitle, at as resolveYAxisTitle, ha as sectionVariants, ae as serializeTableUrlState, _a as sheetVariants, La as sidebarPrimaryMenuItemVariants, Ja as sidebarSecondaryMenuItemVariants, xa as stackVariants, wa as stepperItemVariants, Hi as tagVariants, Ie as toCssKey, ot as toLabelFormatter, st as toReferenceLineList, to as toast, no as toastVariants, Pi as trendIndicatorVariants, we as useAccordionContainerContext, w as useAppShellChatInitialLayout, Tr as useFilterSearchFilters, Ut as useInputSelectFilter, ne as useIntersectionObserver, ge as usePortalContainer, ga as useSectionContext, te as useSortState, oe as useTableUrlState, se as useWizard };
|
package/dist/llms/data-table.md
CHANGED
|
@@ -47,7 +47,7 @@ optional row expansion, column resizing, and sticky (pinned) columns.
|
|
|
47
47
|
| `DataTableColumnHeader` | A sortable column header — single-click toggle (↑/↓/↕). Use in a column's `header`. |
|
|
48
48
|
| `DataTableToolbar` | Search box + per-column filters + applied-filter chips. Takes a `table` instance. |
|
|
49
49
|
| `DataTablePagination` | Selection count, rows-per-page, page controls. Takes a `table`. |
|
|
50
|
-
| `DataTableViewOptions` |
|
|
50
|
+
| `DataTableViewOptions` | Searchable, categorized column-visibility menu (a thin TanStack adapter over `TableViewOptions`). Pass `iconOnly` for the cog trigger in the trailing settings column. |
|
|
51
51
|
| `DataTableExpandTrigger` | A chevron toggle wired to a row's expansion state, placed inside a column's `cell` render function. |
|
|
52
52
|
| `DataTableBulkActionsBar` | A selection-aware bar above the grid: the consumer's bulk actions in a `<fieldset>` disabled until a selection is active, plus the selection summary and a Deselect control (or `loadedLabel` when nothing is selected). Takes a `table`. |
|
|
53
53
|
| `isBulkSelectionActive` | The single predicate for the bulk-selection threshold (one or more rows selected). Pass it to `TableActionsCell`'s `bulkSelectionActive` rather than re-deriving it. |
|
|
@@ -96,10 +96,15 @@ from it too (see **Server-driven usage** below).
|
|
|
96
96
|
`columnResizing`). Pass `onColumnSizingChange` to persist widths.
|
|
97
97
|
- **Sticky (pinned) columns** — set `meta.pin: 'left' | 'right'` on a
|
|
98
98
|
`ColumnDef`. DataTable drives TanStack's native column-pinning and renders the
|
|
99
|
-
column as `position: sticky` cells with an opaque row background.
|
|
99
|
+
column as `position: sticky` cells with an opaque row background. The built-in
|
|
100
|
+
trailing settings/actions column is pinned right by default.
|
|
100
101
|
- **Wrapping columns** — set `meta.wrap: true` on a `ColumnDef` to let that
|
|
101
|
-
column's header and cell content
|
|
102
|
-
|
|
102
|
+
column's header and cell content drop the fixed row height and wrap onto
|
|
103
|
+
multiple lines, mirroring the `Table` primitives' `wrap` prop.
|
|
104
|
+
- **Visibility labels and categories** — set `meta.label` for the text shown in
|
|
105
|
+
the visibility dropdown and `meta.category` to group related columns under a
|
|
106
|
+
labelled section with a Show all action. Labels fall back to a string header,
|
|
107
|
+
then the column id.
|
|
103
108
|
- **Expandable column** — put a `DataTableExpandTrigger` in a column's `cell`
|
|
104
109
|
render function so the expand affordance sits in a real column instead of a
|
|
105
110
|
whole-row click. It reads `row.getCanExpand()` / `getIsExpanded()` and calls
|
|
@@ -164,10 +169,15 @@ as `children` of the toolbar for per-column filtering.
|
|
|
164
169
|
| `renderRowActions` | `(row: Row<TData>) => ReactNode` | — | no | Renders the content of a row's overflow-actions menu (e.g. Edit/Delete items), opened from the ellipsis trigger in the trailing action column. Omit to render that row without a trigger — the 48px column is still reserved. Suppressed (like the trigger itself) while a bulk selection is active, per `TableActionsCell`. |
|
|
165
170
|
| `rowActionsLabel` | `string` | `'Row actions'` | no | Accessible name of a row's overflow-actions trigger. Override to localize. |
|
|
166
171
|
| `columnSettingsLabel` | `string` | — | no | Accessible name of the action column's column-visibility trigger. Override to localize; falls through to the view-options part's own default ("Column settings") when omitted. |
|
|
172
|
+
| `columnSearchPlaceholder` | `string` | `'Search columns'` | no | Placeholder and accessible name of the built-in column-visibility search field. Override to localize. |
|
|
173
|
+
| `showAllColumnsLabel` | `ReactNode` | `'Show all'` | no | Visible label of each category action that reveals every hidden column in that category. Override to localize. |
|
|
174
|
+
| `noColumnsFoundLabel` | `ReactNode` | `'No columns found.'` | no | Empty state shown when the column-visibility search has no matches. Override to localize. |
|
|
167
175
|
| `headerHints` | `Partial<DataTableHeaderHints>` | `{ sort: { label: 'Sort column', action: 'Click' }, reorder: { label: 'Reorder column', action: 'Drag' }, resize: { label: 'Resize column', action: 'Drag border' } }` | no | Copy of the tooltip shown while a header cell is hovered/focused — one `{ label, action }` line per capability that column actually has (`sort` / `reorder` / `resize`). Merged over the defaults, so any subset can be overridden to localize; a column with no capability shows no tooltip at all. |
|
|
168
176
|
| `bulkSelectionActive` | `boolean` | `false` | no | On the `TableActionsCell` part — suppress this row's actions because a *bulk* selection is in play. The cell still reserves its 48px column but renders no children and no hover/press tint. Pass `isBulkSelectionActive(table)` (exported alongside DataTable) rather than re-deriving the threshold: **one or more rows selected**, including exactly one. |
|
|
169
177
|
| `meta.pin` | `'left' | 'right'` | — | no | Set on a `ColumnDef.meta` (not a DataTable prop) — pins the column to a table edge. DataTable drives TanStack's native column-pinning and renders the column as `position: sticky` cells with an opaque row background. |
|
|
170
|
-
| `meta.wrap` | `boolean` | — | no | Set on a `ColumnDef.meta` (not a DataTable prop) — allows a column's header and cell content to wrap onto multiple lines
|
|
178
|
+
| `meta.wrap` | `boolean` | — | no | Set on a `ColumnDef.meta` (not a DataTable prop) — allows a column's header and cell content to wrap onto multiple lines and drop the fixed row height, mirroring the `Table` primitives' `wrap` prop. |
|
|
179
|
+
| `meta.label` | `string` | — | no | Human-readable label shown for the column in the visibility dropdown. Falls back to a string header and then the column id. |
|
|
180
|
+
| `meta.category` | `string` | — | no | Optional visibility-dropdown category. Columns with the same value are grouped under a labelled section with a per-category Show all action. |
|
|
171
181
|
| `children` | `ReactNode` | — | no | On DataTableToolbar — filter fields rendered inside a `FilterSearchFilters` popover (wire each to a column via `useFilterSearchFilters()` keyed by column id). When provided, the toolbar renders the filter popover plus a `FilterSearchAppliedFilters` chip row below it. |
|
|
172
182
|
| `filtersLabel` | `ReactNode` | `'Filters'` | no | On DataTableToolbar — label for the filters trigger button. |
|
|
173
183
|
| `getFilterChipLabel` | `(key: string, value: unknown) => ReactNode` | — | no | On DataTableToolbar — formats an applied-filter chip's label (defaults to "<id>: <value>"). |
|
|
@@ -293,11 +303,27 @@ Scenario: Sort a column in a single click
|
|
|
293
303
|
|
|
294
304
|
```gherkin
|
|
295
305
|
Scenario: Hide a column
|
|
296
|
-
Given the
|
|
306
|
+
Given the view-options menu opened from the trailing settings cog
|
|
297
307
|
When the user unchecks the column
|
|
298
308
|
Then that column is removed from the grid
|
|
299
309
|
```
|
|
300
310
|
|
|
311
|
+
```gherkin
|
|
312
|
+
Scenario: Search and group visible columns
|
|
313
|
+
Given columns with meta.label and meta.category values
|
|
314
|
+
When the user opens the trailing settings cog
|
|
315
|
+
Then the visibility menu uses the metadata labels and groups matching categories
|
|
316
|
+
When the user searches
|
|
317
|
+
Then only matching column labels remain in the internally scrolling popup
|
|
318
|
+
```
|
|
319
|
+
|
|
320
|
+
```gherkin
|
|
321
|
+
Scenario: Reveal a category
|
|
322
|
+
Given a category with multiple hidden columns
|
|
323
|
+
When the user activates that category's Show all action
|
|
324
|
+
Then every hidden column in that category becomes visible
|
|
325
|
+
```
|
|
326
|
+
|
|
301
327
|
```gherkin
|
|
302
328
|
Scenario: Filter via the toolbar
|
|
303
329
|
Given a DataTableToolbar with searchKey="email"
|
|
@@ -394,7 +420,7 @@ Scenario: Sticky (pinned) columns
|
|
|
394
420
|
```gherkin
|
|
395
421
|
Scenario: Wrapping columns
|
|
396
422
|
Given a column with meta.wrap = true
|
|
397
|
-
Then that column's header and cell content wrap onto multiple lines
|
|
423
|
+
Then that column's header and cell content drop the fixed row height and wrap onto multiple lines
|
|
398
424
|
```
|
|
399
425
|
|
|
400
426
|
```gherkin
|
package/dist/llms/table.md
CHANGED
|
@@ -73,21 +73,21 @@ sort and URL-synced state.
|
|
|
73
73
|
|
|
74
74
|
## Parts
|
|
75
75
|
|
|
76
|
-
| Part | Element | Purpose
|
|
77
|
-
| ------------------- | --------- |
|
|
78
|
-
| `Table` | `table` | The table, in a horizontally scrollable container.
|
|
79
|
-
| `TableHeader` | `thead` | Column-header section.
|
|
80
|
-
| `TableBody` | `tbody` | Data rows section.
|
|
81
|
-
| `TableFooter` | `tfoot` | Summary section with a top divider.
|
|
82
|
-
| `TableRow` | `tr` | A row; `selected` applies the active state.
|
|
83
|
-
| `TableHead` | `th` | Column header; `sortable` + `sortDirection` + `onSort`; `wrap`.
|
|
84
|
-
| `TableCell` | `td` | A data cell; `wrap` lets it grow to fit multi-line content.
|
|
85
|
-
| `TableSelectCell` | `td`/`th` | 32px leading selection cell for a `Checkbox`; `header` renders the select-all `th`.
|
|
86
|
-
| `TableActionsCell` | `td` | 48px trailing cell for a row's overflow trigger; owns the hover/press tint and focus ring.
|
|
87
|
-
| `TableSettingsCell` | `th` | 48px trailing header cell for the column-settings trigger.
|
|
88
|
-
| `TableCaption` | `caption` | Optional caption below the table.
|
|
89
|
-
| `TablePagination` | `div` | Plain-prop pagination bar (no TanStack dependency).
|
|
90
|
-
| `TableViewOptions` | `div` |
|
|
76
|
+
| Part | Element | Purpose |
|
|
77
|
+
| ------------------- | --------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
78
|
+
| `Table` | `table` | The table, in a horizontally scrollable container. |
|
|
79
|
+
| `TableHeader` | `thead` | Column-header section. |
|
|
80
|
+
| `TableBody` | `tbody` | Data rows section. |
|
|
81
|
+
| `TableFooter` | `tfoot` | Summary section with a top divider. |
|
|
82
|
+
| `TableRow` | `tr` | A row; `selected` applies the active state. |
|
|
83
|
+
| `TableHead` | `th` | Column header; `sortable` + `sortDirection` + `onSort`; `wrap`. |
|
|
84
|
+
| `TableCell` | `td` | A data cell; `wrap` lets it grow to fit multi-line content. |
|
|
85
|
+
| `TableSelectCell` | `td`/`th` | 32px leading selection cell for a `Checkbox`; `header` renders the select-all `th`. |
|
|
86
|
+
| `TableActionsCell` | `td` | 48px trailing cell for a row's overflow trigger; owns the hover/press tint and focus ring. |
|
|
87
|
+
| `TableSettingsCell` | `th` | 48px trailing header cell for the column-settings trigger. |
|
|
88
|
+
| `TableCaption` | `caption` | Optional caption below the table. |
|
|
89
|
+
| `TablePagination` | `div` | Plain-prop pagination bar (no TanStack dependency). |
|
|
90
|
+
| `TableViewOptions` | `div` | Searchable, internally scrolling show/hide-columns dropdown. Optional `category` values create labelled sections with per-category Show all actions; `iconOnly` fits `TableSettingsCell`. |
|
|
91
91
|
|
|
92
92
|
## Hooks
|
|
93
93
|
|
|
@@ -132,7 +132,7 @@ const { sortedData, getSortDirection, toggleSort } = useSortState({ data });
|
|
|
132
132
|
Name
|
|
133
133
|
</TableHead>
|
|
134
134
|
|
|
135
|
-
// Wrappable cell — grows to fit multi-line content
|
|
135
|
+
// Wrappable cell — drops the fixed row height and grows to fit multi-line content
|
|
136
136
|
<TableCell wrap>{longDescription}</TableCell>
|
|
137
137
|
|
|
138
138
|
// Header row — select-all cell leading, column-settings cell trailing
|
|
@@ -142,7 +142,11 @@ const { sortedData, getSortDirection, toggleSort } = useSortState({ data });
|
|
|
142
142
|
</TableSelectCell>
|
|
143
143
|
<TableHead>Name</TableHead>
|
|
144
144
|
<TableSettingsCell>
|
|
145
|
-
<TableViewOptions
|
|
145
|
+
<TableViewOptions
|
|
146
|
+
iconOnly
|
|
147
|
+
columns={columns}
|
|
148
|
+
onToggle={toggleColumn}
|
|
149
|
+
/>
|
|
146
150
|
</TableSettingsCell>
|
|
147
151
|
</TableRow>
|
|
148
152
|
|
|
@@ -176,7 +180,7 @@ const { sortedData, getSortDirection, toggleSort } = useSortState({ data });
|
|
|
176
180
|
| `selected` | `boolean` | `false` | no | On a row — marks it selected (active row token + `data-state="selected"`). |
|
|
177
181
|
| `sortable` | `boolean` | `false` | no | On a column header — renders a focusable sort affordance and exposes `aria-sort`. |
|
|
178
182
|
| `sort-direction` | `'asc' | 'desc' | false` | `false` | no | On a sortable column header — the current sort direction (`false` = sortable but unsorted). Drives the sort icon and `aria-sort`. |
|
|
179
|
-
| `wrap` | `boolean` | `false` | no | On a cell or column header — allow the content to wrap onto multiple lines (`whitespace-normal`) and drop the fixed row height so the cell grows to fit multi-line content
|
|
183
|
+
| `wrap` | `boolean` | `false` | no | On a cell or column header — allow the content to wrap onto multiple lines (`whitespace-normal`) and drop the fixed row height so the cell grows to fit multi-line content. Default cells retain native table auto-layout; truncation is opt-in through a constrained cell or class. |
|
|
180
184
|
| `header` | `boolean` | `false` | no | On the select-cell — render the header's select-all cell (`<th>`) instead of a row's selection cell (`<td>`). |
|
|
181
185
|
| `bulk-selection-active` | `boolean` | `false` | no | On the actions-cell — suppress this row's actions because a *bulk* selection is in play: the cell keeps its 48px column (so the grid doesn't reflow) but renders no children and no hover/press tint. The threshold is one or more rows being selected — a single selected row is already a bulk selection and loses its row actions. With a TanStack table, pass `isBulkSelectionActive(table)` (from the data-table part) instead of re-deriving it. |
|
|
182
186
|
| `page-index` | `number` | — | yes | On the pagination part — the zero-based index of the current page. |
|
|
@@ -185,7 +189,7 @@ const { sortedData, getSortDirection, toggleSort } = useSortState({ data });
|
|
|
185
189
|
| `page-size-options` | `number[]` | `[10, 20, 30, 40, 50]` | no | On the pagination part — the page-size options offered in the rows-per-page select. |
|
|
186
190
|
| `total-rows` | `number` | — | no | On the pagination part — total rows across all pages (drives the summary text). |
|
|
187
191
|
| `selected-rows` | `number` | — | no | On the pagination part — number of currently selected rows (drives the selection summary text). |
|
|
188
|
-
| `columns` | `{ id: string; label: string; hidden: boolean }[]` | — | yes | On the view-options part — the toggleable columns and their current visibility. |
|
|
192
|
+
| `columns` | `{ id: string; label: string; hidden: boolean; category?: string }[]` | — | yes | On the view-options part — the toggleable columns and their current visibility. Columns with the same optional category render in a labelled section with a per-category action that reveals every hidden column. |
|
|
189
193
|
| `rows-per-page-label` | `string` | `'Rows per page'` | no | On the pagination part — label of the rows-per-page select (also its accessible name). Override to localize. |
|
|
190
194
|
| `first-page-label` | `string` | `'Go to first page'` | no | On the pagination part — accessible name of the first-page control. |
|
|
191
195
|
| `previous-page-label` | `string` | `'Go to previous page'` | no | On the pagination part — accessible name of the previous-page control. |
|
|
@@ -196,7 +200,9 @@ const { sortedData, getSortDirection, toggleSort } = useSortState({ data });
|
|
|
196
200
|
| `trigger-label` | `ReactNode` | `'View'` | no | On the view-options part — the trigger button label. Ignored when `icon-only` is set. |
|
|
197
201
|
| `icon-only` | `boolean` | `false` | no | On the view-options part — render the trigger as a cog-only icon button instead of a labelled button: the shape that fits the 48px `TableSettingsCell` column. |
|
|
198
202
|
| `trigger-aria-label` | `string` | `'Column settings'` | no | On the view-options part — accessible name of the `icon-only` trigger. Override to localize. |
|
|
199
|
-
| `
|
|
203
|
+
| `search-placeholder` | `string` | `'Search columns'` | no | On the view-options part — placeholder and accessible name of the in-dropdown column filter. Override to localize. |
|
|
204
|
+
| `show-all-label` | `ReactNode` | `'Show all'` | no | On the view-options part — visible label of each category action that reveals every hidden column in that category. Its accessible name also includes the category label. |
|
|
205
|
+
| `no-results-label` | `ReactNode` | `'No columns found.'` | no | On the view-options part — empty state shown when no column label matches the search query. Override to localize. |
|
|
200
206
|
|
|
201
207
|
## Events
|
|
202
208
|
|
|
@@ -311,7 +317,7 @@ Scenario: A wrapping cell grows the row
|
|
|
311
317
|
Given a TableCell (or TableHead) with wrap = true holding multi-line content
|
|
312
318
|
When it renders
|
|
313
319
|
Then it uses whitespace-normal and drops the fixed row height
|
|
314
|
-
And the row grows to fit the content
|
|
320
|
+
And the row grows to fit the content
|
|
315
321
|
```
|
|
316
322
|
|
|
317
323
|
### Pagination (TablePagination)
|
|
@@ -345,12 +351,36 @@ Scenario: Selection summary
|
|
|
345
351
|
|
|
346
352
|
```gherkin
|
|
347
353
|
Scenario: Toggling column visibility
|
|
348
|
-
Given a TableViewOptions with a { id, label, hidden }[] of columns
|
|
354
|
+
Given a TableViewOptions with a { id, label, hidden, category? }[] of columns
|
|
349
355
|
When the user toggles a column's checkbox in the dropdown
|
|
350
356
|
Then the toggle event fires with that column's id
|
|
351
357
|
And the consumer updates the column's hidden flag
|
|
352
358
|
```
|
|
353
359
|
|
|
360
|
+
```gherkin
|
|
361
|
+
Scenario: Searching columns
|
|
362
|
+
Given an open TableViewOptions
|
|
363
|
+
When the user types into the column search field
|
|
364
|
+
Then only columns whose labels contain the query remain
|
|
365
|
+
And an overridable empty state renders when no labels match
|
|
366
|
+
```
|
|
367
|
+
|
|
368
|
+
```gherkin
|
|
369
|
+
Scenario: Categorized columns
|
|
370
|
+
Given columns sharing a category
|
|
371
|
+
Then they render in a group programmatically named by that category
|
|
372
|
+
And the category's Show all action is also named with the category
|
|
373
|
+
When the user activates Show all
|
|
374
|
+
Then the toggle event fires once for every hidden column in that category
|
|
375
|
+
```
|
|
376
|
+
|
|
377
|
+
```gherkin
|
|
378
|
+
Scenario: A long column list scrolls inside the dropdown
|
|
379
|
+
Given the open column list is taller than the available viewport height
|
|
380
|
+
Then the 300px dropdown is capped to the available height
|
|
381
|
+
And the dropdown itself scrolls vertically
|
|
382
|
+
```
|
|
383
|
+
|
|
354
384
|
```gherkin
|
|
355
385
|
Scenario: The icon-only trigger fits the settings cell
|
|
356
386
|
Given a TableViewOptions with icon-only = true
|
|
@@ -425,7 +455,10 @@ headers natively. Use the parts as their elements intend.
|
|
|
425
455
|
items; each row shows a presentational checkbox box beside the column name and
|
|
426
456
|
the row itself carries `role="menuitemcheckbox"` + `aria-checked`. The trigger
|
|
427
457
|
has a visible "View" label, or — with `iconOnly` — is a cog-only icon button
|
|
428
|
-
named by `triggerAriaLabel` (default "Column settings").
|
|
458
|
+
named by `triggerAriaLabel` (default "Column settings"). Each categorized
|
|
459
|
+
group is named by its visible heading, and each repeated Show all action
|
|
460
|
+
combines its localized visible label with that category so assistive
|
|
461
|
+
technology can distinguish the actions.
|
|
429
462
|
|
|
430
463
|
## Contrast
|
|
431
464
|
|
package/dist/llms.txt
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# Acronis UI Kit for React — LLM Reference
|
|
2
2
|
|
|
3
|
-
> `@acronis-platform/ui-react` v5.
|
|
3
|
+
> `@acronis-platform/ui-react` v5.3.1
|
|
4
4
|
|
|
5
5
|
Machine-readable component reference compiled from framework-agnostic specs.
|
|
6
6
|
Each entry links to a self-contained markdown file with props, behavior,
|