ixia-ui-react 1.2.0 → 1.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.mts +495 -309
- package/dist/index.mjs +1007 -273
- package/dist/index.mjs.map +1 -1
- package/dist/styles.css +36 -22
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -1,14 +1,15 @@
|
|
|
1
|
+
import { createRequire } from "node:module";
|
|
1
2
|
import { Accordion as Accordion$1 } from "@base-ui/react/accordion";
|
|
2
3
|
import { clsx } from "clsx";
|
|
3
|
-
import {
|
|
4
|
+
import { extendTailwindMerge } from "tailwind-merge";
|
|
4
5
|
import { cva } from "class-variance-authority";
|
|
5
6
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
6
7
|
import { ArrowsDownUpIcon, CaretDownIcon, CaretLeftIcon, CaretLineLeftIcon, CaretLineRightIcon, CaretRightIcon, CaretUpDownIcon, CaretUpIcon, CheckCircleIcon, CheckIcon, CircleNotchIcon, CopyIcon, DotsThreeIcon, DownloadIcon, EyeClosedIcon, EyeIcon, FileArrowUpIcon, FolderIcon, FolderOpenIcon, FolderSimpleIcon, FunnelIcon, FunnelSimpleIcon, InfoIcon, LockSimpleIcon, LockSimpleOpenIcon, MagnifyingGlassIcon, MinusIcon, PercentIcon, PlusIcon, SortAscendingIcon, SortDescendingIcon, TrashIcon, UploadIcon, WarningCircleIcon, WarningIcon, XCircleIcon, XIcon } from "@phosphor-icons/react";
|
|
7
8
|
import { AlertDialog as AlertDialog$1, Button as Button$1, Checkbox as Checkbox$1, CheckboxGroup as CheckboxGroup$1, Drawer as Drawer$1, Meter as Meter$1, NavigationMenu as NavigationMenu$1, OTPField, PreviewCard as PreviewCard$1, Radio as Radio$1, RadioGroup as RadioGroup$1, Slider as Slider$1 } from "@base-ui/react";
|
|
8
|
-
import React, { Children, createContext, createElement, isValidElement, useContext, useEffect, useId, useRef, useState } from "react";
|
|
9
|
+
import React, { Children, createContext, createElement, isValidElement, useCallback, useContext, useEffect, useId, useRef, useState } from "react";
|
|
9
10
|
import { Autocomplete as Autocomplete$1 } from "@base-ui/react/autocomplete";
|
|
10
11
|
import { Avatar as Avatar$1 } from "@base-ui/react/avatar";
|
|
11
|
-
import { DayPicker, getDefaultClassNames, isDateRange, labelDayButton } from "@daypicker/react";
|
|
12
|
+
import { DayButton, DayPicker, getDefaultClassNames, isDateRange, labelDayButton } from "@daypicker/react";
|
|
12
13
|
import { Select as Select$1 } from "@base-ui/react/select";
|
|
13
14
|
import { Legend, ResponsiveContainer, Tooltip as Tooltip$1 } from "recharts";
|
|
14
15
|
import { Checkbox as Checkbox$2 } from "@base-ui/react/checkbox";
|
|
@@ -36,7 +37,31 @@ import { ScrollArea as ScrollArea$1 } from "@base-ui/react/scroll-area";
|
|
|
36
37
|
import { z } from "zod";
|
|
37
38
|
import { Toast as Toast$1 } from "@base-ui/react/toast";
|
|
38
39
|
import { ToggleGroup as ToggleGroup$1 } from "@base-ui/react/toggle-group";
|
|
40
|
+
//#region \0rolldown/runtime.js
|
|
41
|
+
var __commonJSMin = (cb, mod) => () => (mod || (cb((mod = { exports: {} }).exports, mod, mod.exports), cb = null), mod.exports);
|
|
42
|
+
var __require = /* #__PURE__ */ (() => createRequire(import.meta.url))();
|
|
43
|
+
//#endregion
|
|
39
44
|
//#region src/utils/cn.ts
|
|
45
|
+
const twMerge = extendTailwindMerge({ extend: { theme: { spacing: [
|
|
46
|
+
"3xs",
|
|
47
|
+
"2xs",
|
|
48
|
+
"xs",
|
|
49
|
+
"sm",
|
|
50
|
+
"md",
|
|
51
|
+
"lg",
|
|
52
|
+
"xl",
|
|
53
|
+
"2xl",
|
|
54
|
+
"3xl",
|
|
55
|
+
"3xs-2xs",
|
|
56
|
+
"2xs-xs",
|
|
57
|
+
"xs-sm",
|
|
58
|
+
"sm-md",
|
|
59
|
+
"md-lg",
|
|
60
|
+
"lg-xl",
|
|
61
|
+
"xl-2xl",
|
|
62
|
+
"2xl-3xl",
|
|
63
|
+
"sm-lg"
|
|
64
|
+
] } } });
|
|
40
65
|
function cn(...inputs) {
|
|
41
66
|
return twMerge(clsx(inputs));
|
|
42
67
|
}
|
|
@@ -171,7 +196,7 @@ const Accordion = Object.assign(Accordion$2, {
|
|
|
171
196
|
});
|
|
172
197
|
//#endregion
|
|
173
198
|
//#region src/components/alert/alert.types.ts
|
|
174
|
-
const alertVariants = cva("group grid auto-rows-min items-center justify-start gap-x-xs rounded-xl border
|
|
199
|
+
const alertVariants = cva("group grid auto-rows-min items-center justify-start gap-x-xs rounded-xl border py-sm pr-sm pl-md transition-all has-data-[slot=alert-action]:grid-cols-[1fr_auto] has-data-[slot=alert-description]:grid-rows-[auto_auto] has-data-[slot=alert-icon]:grid-cols-[auto_1fr] has-data-[slot=alert-icon]:has-data-[slot=alert-action]:grid-cols-[auto_1fr_auto] has-data-[slot=alert-description]:**:data-[slot=alert-icon]:row-span-2", {
|
|
175
200
|
defaultVariants: { tone: "brand" },
|
|
176
201
|
variants: { tone: {
|
|
177
202
|
accent: "border-accent-border bg-accent-container [&_[data-slot=alert-description]]:text-accent-on-container-muted [&_[data-slot=alert-icon]]:text-accent-on-container [&_[data-slot=alert-title]]:text-accent-on-container",
|
|
@@ -298,7 +323,7 @@ const buttonVariants = cva("inline-flex cursor-pointer items-center justify-cent
|
|
|
298
323
|
variant: "outline"
|
|
299
324
|
},
|
|
300
325
|
{
|
|
301
|
-
className: "border-
|
|
326
|
+
className: "border-border text-neutral-default hover:bg-neutral-subtle hover:text-neutral-on-container",
|
|
302
327
|
tone: "neutral",
|
|
303
328
|
variant: "outline"
|
|
304
329
|
},
|
|
@@ -475,9 +500,9 @@ const buttonVariants = cva("inline-flex cursor-pointer items-center justify-cent
|
|
|
475
500
|
iconLarge: "size-2xl p-[0px] [&>svg]:size-md",
|
|
476
501
|
iconMedium: "size-xl p-[0px] [&>svg]:size-sm",
|
|
477
502
|
iconSmall: "size-lg p-[0px] [&>svg]:size-xs",
|
|
478
|
-
large: "h-2xl gap-xs px-md style-text-default-
|
|
479
|
-
medium: "h-xl gap-2xs px-sm style-text-default-0 [&>svg]:size-sm",
|
|
480
|
-
small: "h-lg gap-3xs px-xs style-text-default--1 [&>svg]:size-xs"
|
|
503
|
+
large: "h-2xl min-w-2xl gap-xs px-md style-text-default-1 [&>svg]:size-md",
|
|
504
|
+
medium: "h-xl min-w-xl gap-2xs px-sm style-text-default-0 [&>svg]:size-sm",
|
|
505
|
+
small: "h-lg min-w-lg gap-3xs px-xs style-text-default--1 [&>svg]:size-xs"
|
|
481
506
|
},
|
|
482
507
|
tone: {
|
|
483
508
|
accent: "",
|
|
@@ -490,11 +515,11 @@ const buttonVariants = cva("inline-flex cursor-pointer items-center justify-cent
|
|
|
490
515
|
},
|
|
491
516
|
variant: {
|
|
492
517
|
elevated: "shadow-xs not-active:hover:shadow-md",
|
|
493
|
-
fill: "active:scale-
|
|
494
|
-
ghost: "active:scale-
|
|
518
|
+
fill: "active:scale-95",
|
|
519
|
+
ghost: "active:scale-95",
|
|
495
520
|
link: "size-fit! p-0! underline decoration-transparent underline-offset-2 [&>svg]:transition-colors",
|
|
496
|
-
outline: "border active:scale-
|
|
497
|
-
soft: "border active:scale-
|
|
521
|
+
outline: "border active:scale-95",
|
|
522
|
+
soft: "border active:scale-95"
|
|
498
523
|
}
|
|
499
524
|
}
|
|
500
525
|
});
|
|
@@ -714,6 +739,7 @@ const inputVariants = cva("group flex w-full items-center text-ellipsis caret-br
|
|
|
714
739
|
},
|
|
715
740
|
variant: {
|
|
716
741
|
ghost: "bg-transparent",
|
|
742
|
+
outline: "bg-transparent outline outline-border",
|
|
717
743
|
primary: "bg-surface shadow-2xs",
|
|
718
744
|
secondary: "bg-neutral-container"
|
|
719
745
|
}
|
|
@@ -864,9 +890,9 @@ const Autocomplete = Object.assign(Autocomplete$2, {
|
|
|
864
890
|
const avatarVariants = cva("group/avatar relative inline-flex shrink-0 items-center justify-center rounded-full", {
|
|
865
891
|
defaultVariants: { size: "medium" },
|
|
866
892
|
variants: { size: {
|
|
867
|
-
large: "size-
|
|
868
|
-
medium: "size-
|
|
869
|
-
small: "size-
|
|
893
|
+
large: "size-3xl style-text-default-1",
|
|
894
|
+
medium: "size-2xl style-text-default-0",
|
|
895
|
+
small: "size-xl style-text-default--1"
|
|
870
896
|
} }
|
|
871
897
|
});
|
|
872
898
|
const avatarBadgeVariants = cva("absolute right-0 bottom-0 inline-flex items-center justify-center rounded-full outline-3 outline-surface-background group-data-[size=large]/avatar:size-md group-data-[size=medium]/avatar:size-sm group-data-[size=small]/avatar:size-xs group-data-[size=large]/avatar:[&_svg]:size-sm group-data-[size=medium]/avatar:[&_svg]:size-xs group-data-[size=small]/avatar:[&_svg]:size-2xs", {
|
|
@@ -876,10 +902,10 @@ const avatarBadgeVariants = cva("absolute right-0 bottom-0 inline-flex items-cen
|
|
|
876
902
|
},
|
|
877
903
|
variants: {
|
|
878
904
|
position: {
|
|
879
|
-
bottomLeft: "bottom-
|
|
880
|
-
bottomRight: "right-
|
|
881
|
-
topLeft: "top-
|
|
882
|
-
topRight: "top-
|
|
905
|
+
bottomLeft: "bottom-px left-px",
|
|
906
|
+
bottomRight: "right-px bottom-px",
|
|
907
|
+
topLeft: "top-px left-px",
|
|
908
|
+
topRight: "top-px right-px"
|
|
883
909
|
},
|
|
884
910
|
tone: {
|
|
885
911
|
accent: "bg-accent-default [&>svg]:text-accent-on-default",
|
|
@@ -960,7 +986,7 @@ const Avatar = Object.assign(Avatar$2, {
|
|
|
960
986
|
});
|
|
961
987
|
//#endregion
|
|
962
988
|
//#region src/components/badge/badge.types.ts
|
|
963
|
-
const badgeVariants = cva("inline-flex h-md items-center justify-center gap-3xs rounded-full
|
|
989
|
+
const badgeVariants = cva("inline-flex h-md items-center justify-center gap-3xs rounded-full font-body text-xs leading-none font-medium whitespace-nowrap transition-all select-none [&>svg]:shrink-0", {
|
|
964
990
|
compoundVariants: [
|
|
965
991
|
{
|
|
966
992
|
className: "bg-brand-default text-brand-on-default",
|
|
@@ -1078,9 +1104,9 @@ const badgeVariants = cva("inline-flex h-md items-center justify-center gap-3xs
|
|
|
1078
1104
|
iconLarge: "size-lg [&>svg]:size-sm",
|
|
1079
1105
|
iconMedium: "size-md [&>svg]:size-xs",
|
|
1080
1106
|
iconSmall: "size-sm [&>svg]:size-2xs",
|
|
1081
|
-
large: "h-lg px-xs [&>svg]:size-
|
|
1082
|
-
medium: "h-md px-xs [&>svg]:size-
|
|
1083
|
-
small: "h-sm px-xs [&>svg]:size-
|
|
1107
|
+
large: "h-lg px-xs [&>svg]:size-[1em]",
|
|
1108
|
+
medium: "h-md px-xs [&>svg]:size-[1em]",
|
|
1109
|
+
small: "h-sm px-xs [&>svg]:size-[1em]"
|
|
1084
1110
|
},
|
|
1085
1111
|
tone: {
|
|
1086
1112
|
accent: "",
|
|
@@ -1133,9 +1159,9 @@ const bentoBoxVariants = cva("group/box flex size-full min-h-0 flex-col overflow
|
|
|
1133
1159
|
true: "p-0!"
|
|
1134
1160
|
},
|
|
1135
1161
|
size: {
|
|
1136
|
-
large: "gap-md rounded-3xl p-
|
|
1137
|
-
medium: "gap-sm rounded-2xl p-
|
|
1138
|
-
small: "gap-xs rounded-xl p-
|
|
1162
|
+
large: "gap-md rounded-3xl p-lg",
|
|
1163
|
+
medium: "gap-sm rounded-2xl p-md",
|
|
1164
|
+
small: "gap-xs rounded-xl p-sm"
|
|
1139
1165
|
}
|
|
1140
1166
|
}
|
|
1141
1167
|
});
|
|
@@ -1222,7 +1248,7 @@ const BentoBox = Object.assign(BentoBox$1, {
|
|
|
1222
1248
|
//#region src/components/breadcrumb/breadcrumb.tsx
|
|
1223
1249
|
function Breadcrumb$1({ className, ref, ...props }) {
|
|
1224
1250
|
return /* @__PURE__ */ jsx("nav", {
|
|
1225
|
-
className: cn("flex items-center gap-2xs
|
|
1251
|
+
className: cn("flex items-center gap-2xs", className),
|
|
1226
1252
|
ref,
|
|
1227
1253
|
...props
|
|
1228
1254
|
});
|
|
@@ -1241,7 +1267,7 @@ function BreadcrumbEllipsis({ className, children, ref, ...props }) {
|
|
|
1241
1267
|
//#region src/components/breadcrumb/breadcrumb-item.tsx
|
|
1242
1268
|
function BreadcrumbItem({ className, ref, ...props }) {
|
|
1243
1269
|
return /* @__PURE__ */ jsx("div", {
|
|
1244
|
-
className: cn("inline-flex h-
|
|
1270
|
+
className: cn("inline-flex h-lg items-center justify-center gap-2xs rounded-full px-2xs style-text-default--1 text-accent-default [&>svg]:size-sm", className),
|
|
1245
1271
|
ref,
|
|
1246
1272
|
...props
|
|
1247
1273
|
});
|
|
@@ -1250,7 +1276,7 @@ function BreadcrumbItem({ className, ref, ...props }) {
|
|
|
1250
1276
|
//#region src/components/breadcrumb/breadcrumb-link.tsx
|
|
1251
1277
|
function BreadcrumbLink({ className, ref, ...props }) {
|
|
1252
1278
|
return /* @__PURE__ */ jsx("div", {
|
|
1253
|
-
className: cn("inline-flex h-
|
|
1279
|
+
className: cn("inline-flex h-lg items-center justify-center gap-3xs rounded-full px-2xs style-text-default--1 text-on-surface-variant transition-all hover:cursor-pointer hover:bg-neutral-container active:scale-[0.98] active:bg-neutral-container disabled:opacity-50 [&>svg]:size-sm", className),
|
|
1254
1280
|
ref,
|
|
1255
1281
|
...props
|
|
1256
1282
|
});
|
|
@@ -1567,7 +1593,7 @@ const calendarPanelVariants = cva("w-fit", {
|
|
|
1567
1593
|
variants: { variant: {
|
|
1568
1594
|
elevated: "bg-surface shadow-2xs",
|
|
1569
1595
|
ghost: "bg-transparent",
|
|
1570
|
-
outline: "border border-border
|
|
1596
|
+
outline: "border border-border"
|
|
1571
1597
|
} }
|
|
1572
1598
|
});
|
|
1573
1599
|
//#endregion
|
|
@@ -1743,6 +1769,17 @@ const Select = Object.assign(Select$2, {
|
|
|
1743
1769
|
});
|
|
1744
1770
|
//#endregion
|
|
1745
1771
|
//#region src/components/calendar/calendar-picker.tsx
|
|
1772
|
+
function CalendarDayButton({ className, modifiers, ...props }) {
|
|
1773
|
+
return /* @__PURE__ */ jsx(DayButton, {
|
|
1774
|
+
...props,
|
|
1775
|
+
modifiers,
|
|
1776
|
+
className: cn(buttonVariants({
|
|
1777
|
+
size: "medium",
|
|
1778
|
+
tone: "neutral",
|
|
1779
|
+
variant: "ghost"
|
|
1780
|
+
}), "text-inherit hover:bg-brand-container hover:text-brand-on-container", modifiers.selected && "hover:bg-brand-default hover:text-brand-on-default", className)
|
|
1781
|
+
});
|
|
1782
|
+
}
|
|
1746
1783
|
function createSelectTarget(value) {
|
|
1747
1784
|
const element = document.createElement("select"), option = Object.assign(document.createElement("option"), { value });
|
|
1748
1785
|
element.append(option);
|
|
@@ -1791,7 +1828,8 @@ function CalendarNextMonthButton({ onClick, disabled, ...props }) {
|
|
|
1791
1828
|
...props,
|
|
1792
1829
|
variant: "ghost",
|
|
1793
1830
|
tone: "neutral",
|
|
1794
|
-
size: "
|
|
1831
|
+
size: "iconMedium",
|
|
1832
|
+
className: cn("hover:bg-neutral-container-high hover:text-neutral-on-container"),
|
|
1795
1833
|
onClick,
|
|
1796
1834
|
disabled,
|
|
1797
1835
|
children: /* @__PURE__ */ jsx(CaretRightIcon, { weight: "bold" })
|
|
@@ -1802,7 +1840,8 @@ function CalendarPreviousMonthButton({ onClick, disabled, ...props }) {
|
|
|
1802
1840
|
...props,
|
|
1803
1841
|
variant: "ghost",
|
|
1804
1842
|
tone: "neutral",
|
|
1805
|
-
size: "
|
|
1843
|
+
size: "iconMedium",
|
|
1844
|
+
className: cn("hover:bg-neutral-container-high hover:text-neutral-on-container"),
|
|
1806
1845
|
onClick,
|
|
1807
1846
|
disabled,
|
|
1808
1847
|
children: /* @__PURE__ */ jsx(CaretLeftIcon, { weight: "bold" })
|
|
@@ -1824,20 +1863,23 @@ function labelDayButtonWithVisibleText(...args) {
|
|
|
1824
1863
|
const defaultClassNames = getDefaultClassNames();
|
|
1825
1864
|
const calendarClassNames = {
|
|
1826
1865
|
caption_label: "style-text-strong-0",
|
|
1827
|
-
day: cn("
|
|
1866
|
+
day: cn("size-xl! rounded-full style-text-default-0 transition-colors hover:bg-brand-container hover:text-brand-on-container data-selected:text-brand-on-default data-selected:hover:bg-brand-default", defaultClassNames.day),
|
|
1867
|
+
day_button: cn("size-xl! rounded-full", defaultClassNames.day_button),
|
|
1828
1868
|
disabled: cn("pointer-events-none text-on-surface", defaultClassNames.disabled),
|
|
1829
1869
|
month_caption: "flex items-center justify-center h-lg",
|
|
1830
|
-
month_grid: cn("mt-xs", defaultClassNames.month_grid),
|
|
1870
|
+
month_grid: cn("mt-xs border-separate! border-spacing-3xs", defaultClassNames.month_grid),
|
|
1831
1871
|
nav: cn("h-lg! w-full justify-between!", defaultClassNames.nav),
|
|
1832
|
-
outside: cn("border-none text-on-surface", defaultClassNames.outside),
|
|
1872
|
+
outside: cn("border-none text-on-surface-muted", defaultClassNames.outside),
|
|
1833
1873
|
range_end: cn("rounded-l-none bg-brand-default text-brand-on-default"),
|
|
1834
1874
|
range_middle: cn("rounded-none! border-y border-brand-border bg-brand-container! text-brand-on-container! transition-none"),
|
|
1835
1875
|
range_start: cn("rounded-r-none bg-brand-default text-brand-on-default", "[&.rounded-l-none]:rounded-xl"),
|
|
1836
1876
|
selected: cn("bg-brand-default text-brand-on-default"),
|
|
1837
1877
|
today: cn("text-brand-default! data-selected:text-brand-on-default!", defaultClassNames.today),
|
|
1838
|
-
|
|
1878
|
+
week: cn("", defaultClassNames.week),
|
|
1879
|
+
weekdays: cn("style-text-default-0 text-on-surface-muted", defaultClassNames.weekdays)
|
|
1839
1880
|
};
|
|
1840
1881
|
const calendarComponents = {
|
|
1882
|
+
DayButton: CalendarDayButton,
|
|
1841
1883
|
Dropdown: CalendarDropdown,
|
|
1842
1884
|
NextMonthButton: CalendarNextMonthButton,
|
|
1843
1885
|
PreviousMonthButton: CalendarPreviousMonthButton
|
|
@@ -1939,8 +1981,6 @@ function ChartContainer({ id, config, className, children, initialDimension, ref
|
|
|
1939
1981
|
ref,
|
|
1940
1982
|
...props,
|
|
1941
1983
|
children: /* @__PURE__ */ jsx(ResponsiveContainer, {
|
|
1942
|
-
width: "100%",
|
|
1943
|
-
height: "100%",
|
|
1944
1984
|
initialDimension,
|
|
1945
1985
|
children
|
|
1946
1986
|
})
|
|
@@ -2241,34 +2281,28 @@ function CheckboxIndicator({ className, ...props }) {
|
|
|
2241
2281
|
}
|
|
2242
2282
|
//#endregion
|
|
2243
2283
|
//#region src/components/checkbox/checkbox.types.ts
|
|
2244
|
-
const checkboxVariants = cva("group flex size-
|
|
2284
|
+
const checkboxVariants = cva("group flex size-md items-center justify-center rounded-md shadow-2xs outline-2 outline-transparent transition-colors not-indeterminate:text-accent-on-default indeterminate:text-accent-default hover:cursor-pointer hover:outline-accent-border disabled:cursor-not-allowed disabled:hover:cursor-not-allowed data-checked:bg-accent-default [&_svg]:size-sm", {
|
|
2245
2285
|
defaultVariants: { variant: "elevated" },
|
|
2246
2286
|
variants: { variant: {
|
|
2247
2287
|
elevated: "bg-surface shadow-2xs",
|
|
2248
|
-
inSurface: "bg-surface-low shadow-none inset-shadow-2xs data-checked:inset-shadow-none"
|
|
2288
|
+
inSurface: "bg-surface-low shadow-none inset-shadow-2xs data-checked:inset-shadow-none",
|
|
2289
|
+
outline: "bg-inherit shadow-none outline [&:not([data-checked])]:not-hover:outline-border-strong"
|
|
2249
2290
|
} }
|
|
2250
2291
|
});
|
|
2251
2292
|
//#endregion
|
|
2252
2293
|
//#region src/components/checkbox/checkbox.tsx
|
|
2253
|
-
function Checkbox$3({ variant,
|
|
2254
|
-
|
|
2255
|
-
|
|
2256
|
-
if (checkboxId === void 0 && hasLabel) checkboxId = generatedId;
|
|
2257
|
-
return /* @__PURE__ */ jsxs("div", {
|
|
2258
|
-
className: "flex items-center gap-xs",
|
|
2294
|
+
function Checkbox$3({ variant, children, className, ref, ...props }) {
|
|
2295
|
+
return /* @__PURE__ */ jsxs(Label, {
|
|
2296
|
+
className: "flex items-center gap-xs has-disabled:opacity-50",
|
|
2259
2297
|
children: [/* @__PURE__ */ jsx(Checkbox$1.Root, {
|
|
2260
2298
|
className: cn(checkboxVariants({
|
|
2261
2299
|
className,
|
|
2262
2300
|
variant
|
|
2263
2301
|
})),
|
|
2264
|
-
id: checkboxId,
|
|
2265
2302
|
ref,
|
|
2266
2303
|
...props,
|
|
2267
2304
|
children: /* @__PURE__ */ jsx(CheckboxIndicator, {})
|
|
2268
|
-
}),
|
|
2269
|
-
htmlFor: checkboxId,
|
|
2270
|
-
children: label
|
|
2271
|
-
})]
|
|
2305
|
+
}), children]
|
|
2272
2306
|
});
|
|
2273
2307
|
}
|
|
2274
2308
|
//#endregion
|
|
@@ -2341,6 +2375,7 @@ function CodeBlockCopy({ className, children, ref, ...props }) {
|
|
|
2341
2375
|
console.error("Failed to copy text:", error);
|
|
2342
2376
|
}
|
|
2343
2377
|
};
|
|
2378
|
+
if (React.isValidElement(currentValue.content)) return;
|
|
2344
2379
|
return /* @__PURE__ */ jsxs(Button, {
|
|
2345
2380
|
"aria-label": "Copy code",
|
|
2346
2381
|
onClick: handleClick,
|
|
@@ -2381,6 +2416,7 @@ function CodeBlockDownload({ className, children, ref, ...props }) {
|
|
|
2381
2416
|
console.error("Failed to download file:", error);
|
|
2382
2417
|
}
|
|
2383
2418
|
};
|
|
2419
|
+
if (React.isValidElement(currentValue.content)) return;
|
|
2384
2420
|
return /* @__PURE__ */ jsxs(Button, {
|
|
2385
2421
|
"aria-label": "Download file",
|
|
2386
2422
|
onClick: handleClick,
|
|
@@ -2550,7 +2586,7 @@ const tabsVariants = cva("", {
|
|
|
2550
2586
|
variant: "underline"
|
|
2551
2587
|
},
|
|
2552
2588
|
{
|
|
2553
|
-
class: "[&_[role=presentation]]:rounded-
|
|
2589
|
+
class: "[&_[role=presentation]]:rounded-full [&_[role=tab]]:rounded-full [&_[role=tablist]]:rounded-full",
|
|
2554
2590
|
size: "small",
|
|
2555
2591
|
variant: "default"
|
|
2556
2592
|
},
|
|
@@ -2560,55 +2596,65 @@ const tabsVariants = cva("", {
|
|
|
2560
2596
|
variant: "default"
|
|
2561
2597
|
},
|
|
2562
2598
|
{
|
|
2563
|
-
class: "[&_[role=presentation]]:rounded-
|
|
2599
|
+
class: "[&_[role=presentation]]:rounded-full [&_[role=tab]]:h-xl [&_[role=tab]]:rounded-full [&_[role=tab]]:px-md [&_[role=tab]]:style-text-default-0 [&_[role=tablist]]:gap-xs [&_[role=tablist]]:rounded-full [&_[role=tablist]]:p-2xs",
|
|
2564
2600
|
size: "medium",
|
|
2565
2601
|
variant: "default"
|
|
2566
2602
|
},
|
|
2567
2603
|
{
|
|
2568
|
-
class: "[&_[role=presentation]]:rounded-
|
|
2604
|
+
class: "[&_[role=presentation]]:rounded-full [&_[role=tab]]:h-2xl [&_[role=tab]]:rounded-full [&_[role=tab]]:px-lg [&_[role=tab]]:style-text-default-1 [&_[role=tablist]]:gap-sm [&_[role=tablist]]:rounded-full [&_[role=tablist]]:p-xs",
|
|
2569
2605
|
size: "large",
|
|
2570
2606
|
variant: "default"
|
|
2571
2607
|
},
|
|
2572
2608
|
{
|
|
2573
|
-
class: "[&_[role=presentation]]:rounded-
|
|
2609
|
+
class: "[&_[role=presentation]]:rounded-full [&_[role=tab]]:h-lg [&_[role=tab]]:px-sm [&_[role=tab]]:style-text-default--1 [&_[role=tablist]]:gap-2xs [&_[role=tablist]]:rounded-full [&_[role=tablist]]:p-3xs",
|
|
2574
2610
|
size: "small",
|
|
2575
2611
|
variant: "ghost"
|
|
2576
2612
|
},
|
|
2577
2613
|
{
|
|
2578
|
-
class: "[&_[role=presentation]]:rounded-
|
|
2614
|
+
class: "[&_[role=presentation]]:rounded-full [&_[role=tab]]:h-xl [&_[role=tab]]:px-md [&_[role=tab]]:style-text-default-0 [&_[role=tablist]]:gap-xs [&_[role=tablist]]:rounded-full [&_[role=tablist]]:p-2xs",
|
|
2579
2615
|
size: "medium",
|
|
2580
2616
|
variant: "ghost"
|
|
2581
2617
|
},
|
|
2582
2618
|
{
|
|
2583
|
-
class: "[&_[role=presentation]]:rounded-
|
|
2619
|
+
class: "[&_[role=presentation]]:rounded-full [&_[role=tab]]:h-2xl [&_[role=tab]]:px-lg [&_[role=tab]]:style-text-default-1 [&_[role=tablist]]:gap-sm [&_[role=tablist]]:rounded-full [&_[role=tablist]]:p-xs",
|
|
2584
2620
|
size: "large",
|
|
2585
2621
|
variant: "ghost"
|
|
2586
2622
|
},
|
|
2587
2623
|
{
|
|
2588
|
-
class: "[&_[role=tab]]:px-lg [&_[role=tab]]:pb-sm [&_[role=tab]]:style-text-default--1 [&_[role=tablist]]:h-lg [&_[role=tablist]]:gap-md [&_[role=tablist]]:border-b-
|
|
2624
|
+
class: "[&_[role=tab]]:px-lg [&_[role=tab]]:pb-sm [&_[role=tab]]:style-text-default--1 [&_[role=tablist]]:h-lg [&_[role=tablist]]:gap-md [&_[role=tablist]]:border-b-[1px] **:[[role=presentation]]:bottom-[-3px] **:[[role=presentation]]:h-[2px]",
|
|
2589
2625
|
size: "small",
|
|
2590
2626
|
variant: "underline"
|
|
2591
2627
|
},
|
|
2592
2628
|
{
|
|
2593
|
-
class: "[&_[role=tab]]:px-xl [&_[role=tab]]:pb-xs [&_[role=tab]]:style-text-default-0 [&_[role=tablist]]:h-xl [&_[role=tablist]]:gap-lg [&_[role=tablist]]:border-b-
|
|
2629
|
+
class: "[&_[role=tab]]:px-xl [&_[role=tab]]:pb-xs [&_[role=tab]]:style-text-default-0 [&_[role=tablist]]:h-xl [&_[role=tablist]]:gap-lg [&_[role=tablist]]:border-b-[1px] **:[[role=presentation]]:bottom-[-2px] **:[[role=presentation]]:h-px",
|
|
2594
2630
|
size: "medium",
|
|
2595
2631
|
variant: "underline"
|
|
2596
2632
|
},
|
|
2597
2633
|
{
|
|
2598
|
-
class: "[&_[role=tab]]:px-2xl [&_[role=tab]]:pb-2xs [&_[role=tab]]:style-text-default-1 [&_[role=tablist]]:h-2xl [&_[role=tablist]]:gap-xl [&_[role=tablist]]:border-b-
|
|
2634
|
+
class: "[&_[role=tab]]:px-2xl [&_[role=tab]]:pb-2xs [&_[role=tab]]:style-text-default-1 [&_[role=tablist]]:h-2xl [&_[role=tablist]]:gap-xl [&_[role=tablist]]:border-b-[1px] **:[[role=presentation]]:bottom-[-2px] **:[[role=presentation]]:h-px",
|
|
2599
2635
|
size: "large",
|
|
2600
2636
|
variant: "underline"
|
|
2637
|
+
},
|
|
2638
|
+
{
|
|
2639
|
+
class: "[&_[role=tablist]]:w-fit",
|
|
2640
|
+
fill: false,
|
|
2641
|
+
variant: ["default", "ghost"]
|
|
2642
|
+
},
|
|
2643
|
+
{
|
|
2644
|
+
class: "[&_[role=tablist]]:w-full",
|
|
2645
|
+
fill: false,
|
|
2646
|
+
variant: "underline"
|
|
2601
2647
|
}
|
|
2602
2648
|
],
|
|
2603
2649
|
defaultVariants: {
|
|
2604
|
-
fill:
|
|
2650
|
+
fill: false,
|
|
2605
2651
|
size: "medium",
|
|
2606
2652
|
tone: "brand",
|
|
2607
2653
|
variant: "default"
|
|
2608
2654
|
},
|
|
2609
2655
|
variants: {
|
|
2610
2656
|
fill: {
|
|
2611
|
-
false: "
|
|
2657
|
+
false: "",
|
|
2612
2658
|
true: "[&_[role=tab]]:grow [&_[role=tablist]]:w-full"
|
|
2613
2659
|
},
|
|
2614
2660
|
size: {
|
|
@@ -2656,10 +2702,11 @@ function TabsIndicator({ className, ...props }) {
|
|
|
2656
2702
|
}
|
|
2657
2703
|
//#endregion
|
|
2658
2704
|
//#region src/components/tabs/tabs-list.tsx
|
|
2659
|
-
function TabsList({ className, ...props }) {
|
|
2660
|
-
return /* @__PURE__ */
|
|
2705
|
+
function TabsList({ children, className, ...props }) {
|
|
2706
|
+
return /* @__PURE__ */ jsxs(Tabs$1.List, {
|
|
2661
2707
|
className: cn("relative z-0 flex", className),
|
|
2662
|
-
...props
|
|
2708
|
+
...props,
|
|
2709
|
+
children: [children, /* @__PURE__ */ jsx(TabsIndicator, {})]
|
|
2663
2710
|
});
|
|
2664
2711
|
}
|
|
2665
2712
|
//#endregion
|
|
@@ -2851,9 +2898,9 @@ const colorPickerVariants = cva("flex flex-col space-y-sm", {
|
|
|
2851
2898
|
const colorPickerSwatchVariants = cva("overflow-hidden border border-border hover:cursor-pointer focus:outline-2 focus:outline-offset-2", {
|
|
2852
2899
|
defaultVariants: { size: "medium" },
|
|
2853
2900
|
variants: { size: {
|
|
2854
|
-
large: "size-lg rounded-
|
|
2855
|
-
medium: "size-md rounded-
|
|
2856
|
-
small: "size-sm rounded-
|
|
2901
|
+
large: "size-lg rounded-lg",
|
|
2902
|
+
medium: "size-md rounded-md",
|
|
2903
|
+
small: "size-sm rounded-sm"
|
|
2857
2904
|
} }
|
|
2858
2905
|
});
|
|
2859
2906
|
const RGB_CHANNEL_COUNT = 3;
|
|
@@ -3557,7 +3604,7 @@ function ColorPickerInput({ showPopover = false, showTransparencyField = true, c
|
|
|
3557
3604
|
}) })] }),
|
|
3558
3605
|
!showPopover && /* @__PURE__ */ jsx(InputGroupAddon, {
|
|
3559
3606
|
style: { backgroundColor: color.hex() },
|
|
3560
|
-
className: "aspect-square size-md rounded-
|
|
3607
|
+
className: "aspect-square size-md rounded-md"
|
|
3561
3608
|
}),
|
|
3562
3609
|
/* @__PURE__ */ jsx(InputGroupInput, {
|
|
3563
3610
|
"aria-label": "Color value",
|
|
@@ -4263,7 +4310,7 @@ function Dialog$2({ ...props }) {
|
|
|
4263
4310
|
//#region src/components/dialog/dialog-close.tsx
|
|
4264
4311
|
function DialogClose({ className, ref, ...props }) {
|
|
4265
4312
|
return /* @__PURE__ */ jsx(Dialog$1.Close, {
|
|
4266
|
-
className: cn("absolute top-
|
|
4313
|
+
className: cn("absolute top-xs right-xs", className),
|
|
4267
4314
|
ref,
|
|
4268
4315
|
...props,
|
|
4269
4316
|
render: /* @__PURE__ */ jsx(Button, {
|
|
@@ -4332,7 +4379,7 @@ function DialogPopup({ className, children, ref, ...props }) {
|
|
|
4332
4379
|
backdropFilter: "blur(16px)"
|
|
4333
4380
|
}
|
|
4334
4381
|
}), /* @__PURE__ */ jsx(Dialog$1.Popup, {
|
|
4335
|
-
className: cn("fixed top-1/2 left-1/2 z-999 flex max-w-[calc(100vw-3rem)] min-w-1/6 -translate-1/2 flex-col gap-sm overflow-hidden rounded-3xl bg-surface-2
|
|
4382
|
+
className: cn("fixed top-1/2 left-1/2 z-999 flex max-w-[calc(100vw-3rem)] min-w-1/6 -translate-1/2 flex-col gap-sm overflow-hidden rounded-3xl bg-surface-2 px-lg py-md shadow-lg transition-all duration-150 data-ending-style:scale-90 data-ending-style:opacity-0 data-starting-style:scale-90 data-starting-style:opacity-0", className),
|
|
4336
4383
|
ref,
|
|
4337
4384
|
...props,
|
|
4338
4385
|
children
|
|
@@ -4901,7 +4948,7 @@ function MeterSubtitle({ className, ref, ...props }) {
|
|
|
4901
4948
|
//#region src/components/meter/meter-track.tsx
|
|
4902
4949
|
function MeterTrack({ className, ref, ...props }) {
|
|
4903
4950
|
return /* @__PURE__ */ jsx(Meter$1.Track, {
|
|
4904
|
-
className: cn("w-full self-center rounded-full bg-
|
|
4951
|
+
className: cn("w-full self-center rounded-full bg-neutral-container", className),
|
|
4905
4952
|
"data-track": true,
|
|
4906
4953
|
ref,
|
|
4907
4954
|
...props
|
|
@@ -5092,20 +5139,15 @@ function Field$1({ className, children, ref, ...props }) {
|
|
|
5092
5139
|
const { fieldContext, useFieldContext, formContext, useFormContext } = createFormHookContexts();
|
|
5093
5140
|
//#endregion
|
|
5094
5141
|
//#region src/components/field/field-checkbox.tsx
|
|
5095
|
-
function FieldCheckbox({ ...props }) {
|
|
5142
|
+
function FieldCheckbox({ children, ...props }) {
|
|
5096
5143
|
const field = useFieldContext();
|
|
5097
|
-
return /* @__PURE__ */
|
|
5098
|
-
|
|
5099
|
-
|
|
5100
|
-
|
|
5101
|
-
|
|
5102
|
-
|
|
5103
|
-
|
|
5104
|
-
...props
|
|
5105
|
-
}), props.label && /* @__PURE__ */ jsx(Label, {
|
|
5106
|
-
htmlFor: field.name,
|
|
5107
|
-
children: props.label
|
|
5108
|
-
})]
|
|
5144
|
+
return /* @__PURE__ */ jsx(Checkbox, {
|
|
5145
|
+
checked: field.state.value,
|
|
5146
|
+
id: field.name,
|
|
5147
|
+
name: field.name,
|
|
5148
|
+
onCheckedChange: (checked) => field.handleChange(checked),
|
|
5149
|
+
...props,
|
|
5150
|
+
children
|
|
5109
5151
|
});
|
|
5110
5152
|
}
|
|
5111
5153
|
//#endregion
|
|
@@ -5195,7 +5237,7 @@ function Input({ fileUploadButtonIcon = defaultFileUploadButtonIcon, fileUploadB
|
|
|
5195
5237
|
onClick: () => inputRef.current?.click(),
|
|
5196
5238
|
type: "button",
|
|
5197
5239
|
children: [/* @__PURE__ */ jsx("div", {
|
|
5198
|
-
className: cn("size-full", size === "small" && "rounded-
|
|
5240
|
+
className: cn("size-full", size === "small" && "rounded-md", size === "medium" && "rounded-lg", size === "large" && "rounded-xl"),
|
|
5199
5241
|
style: { backgroundColor: colorValue }
|
|
5200
5242
|
}), /* @__PURE__ */ jsx(Input$1, {
|
|
5201
5243
|
className: "peer pointer-events-none invisible absolute",
|
|
@@ -5643,11 +5685,15 @@ function Switch({ children, className, ref, ...props }) {
|
|
|
5643
5685
|
return /* @__PURE__ */ jsxs(Label, {
|
|
5644
5686
|
className: "flex items-center gap-xs",
|
|
5645
5687
|
children: [/* @__PURE__ */ jsx(Switch$1.Root, {
|
|
5646
|
-
className: cn("group relative flex h-
|
|
5688
|
+
className: cn("group relative flex h-lg w-2xl items-center rounded-full bg-surface-low bg-size-[6.5rem_100%] outline-2 outline-transparent transition-colors ease-[cubic-bezier(0.26,0.75,0.38,0.45)] before:absolute before:rounded-full hover:cursor-pointer hover:not-disabled:outline-accent-border-strong disabled:pointer-events-none disabled:opacity-50 data-checked:bg-accent-default data-disabled:pointer-events-none data-disabled:opacity-50", className),
|
|
5647
5689
|
ref,
|
|
5648
5690
|
...props,
|
|
5649
|
-
children: /* @__PURE__ */ jsx(Switch$1.Thumb, { className: "size-
|
|
5650
|
-
}), children
|
|
5691
|
+
children: /* @__PURE__ */ jsx(Switch$1.Thumb, { className: "size-md translate-x-[calc(0%+3px)] rounded-full shadow-2xs transition-transform duration-500 ease-[cubic-bezier(0.68,-0.55,0.27,1.55)] data-checked:translate-x-[calc(100%--7px)] data-checked:bg-accent-on-default data-unchecked:bg-white" })
|
|
5692
|
+
}), children != void 0 && /* @__PURE__ */ jsx("span", {
|
|
5693
|
+
"data-slot": "switch-label",
|
|
5694
|
+
className: "leading-none",
|
|
5695
|
+
children
|
|
5696
|
+
})]
|
|
5651
5697
|
});
|
|
5652
5698
|
}
|
|
5653
5699
|
//#endregion
|
|
@@ -5668,6 +5714,8 @@ function FieldSwitch({ children, ...props }) {
|
|
|
5668
5714
|
const textAreaVariants = cva("relative flex resize flex-col overflow-hidden rounded-xl outline outline-transparent transition-[outline] hover:not-focus-within:outline-border-strong data-[disabled=true]:cursor-not-allowed", {
|
|
5669
5715
|
defaultVariants: { variant: "primary" },
|
|
5670
5716
|
variants: { variant: {
|
|
5717
|
+
ghost: "bg-transparent",
|
|
5718
|
+
outline: "border border-border",
|
|
5671
5719
|
primary: "bg-surface shadow-2xs",
|
|
5672
5720
|
secondary: "bg-neutral-container"
|
|
5673
5721
|
} }
|
|
@@ -5955,32 +6003,32 @@ function FormSubmit({ className, children, ref, ...props }) {
|
|
|
5955
6003
|
//#region src/components/form/form-context.tsx
|
|
5956
6004
|
const { useAppForm, withFieldGroup, withForm, useTypedAppFormContext } = createFormHook({
|
|
5957
6005
|
fieldComponents: {
|
|
5958
|
-
FieldCheckbox,
|
|
5959
|
-
FieldDescription,
|
|
5960
|
-
FieldErrors,
|
|
5961
|
-
FieldInput,
|
|
5962
|
-
FieldInputGroup,
|
|
5963
|
-
FieldInputGroupInput,
|
|
5964
|
-
FieldLabel,
|
|
5965
|
-
FieldRadio,
|
|
5966
|
-
FieldRadioGroup,
|
|
5967
|
-
FieldRow,
|
|
5968
|
-
FieldSelect,
|
|
5969
|
-
FieldSet,
|
|
5970
|
-
FieldSlider,
|
|
5971
|
-
FieldSwitch,
|
|
5972
|
-
FieldTextArea,
|
|
5973
|
-
FieldToggle
|
|
6006
|
+
Checkbox: FieldCheckbox,
|
|
6007
|
+
Description: FieldDescription,
|
|
6008
|
+
Errors: FieldErrors,
|
|
6009
|
+
Input: FieldInput,
|
|
6010
|
+
InputGroup: FieldInputGroup,
|
|
6011
|
+
InputGroupInput: FieldInputGroupInput,
|
|
6012
|
+
Label: FieldLabel,
|
|
6013
|
+
Radio: FieldRadio,
|
|
6014
|
+
RadioGroup: FieldRadioGroup,
|
|
6015
|
+
Row: FieldRow,
|
|
6016
|
+
Select: FieldSelect,
|
|
6017
|
+
Set: FieldSet,
|
|
6018
|
+
Slider: FieldSlider,
|
|
6019
|
+
Switch: FieldSwitch,
|
|
6020
|
+
TextArea: FieldTextArea,
|
|
6021
|
+
Toggle: FieldToggle
|
|
5974
6022
|
},
|
|
5975
6023
|
fieldContext,
|
|
5976
6024
|
formComponents: {
|
|
5977
|
-
FormErrors,
|
|
5978
|
-
FormFooter,
|
|
5979
|
-
FormReset,
|
|
5980
|
-
FormSet,
|
|
5981
|
-
FormSetContent,
|
|
5982
|
-
FormSetHeading,
|
|
5983
|
-
FormSubmit
|
|
6025
|
+
Errors: FormErrors,
|
|
6026
|
+
Footer: FormFooter,
|
|
6027
|
+
Reset: FormReset,
|
|
6028
|
+
Set: FormSet,
|
|
6029
|
+
SetContent: FormSetContent,
|
|
6030
|
+
SetHeading: FormSetHeading,
|
|
6031
|
+
Submit: FormSubmit
|
|
5984
6032
|
},
|
|
5985
6033
|
formContext
|
|
5986
6034
|
});
|
|
@@ -5996,6 +6044,66 @@ const Form = Object.assign(Form$1, {
|
|
|
5996
6044
|
Submit: FormSubmit
|
|
5997
6045
|
});
|
|
5998
6046
|
//#endregion
|
|
6047
|
+
//#region src/components/icon-container/icon-container.types.ts
|
|
6048
|
+
const iconContainerVariants = cva("flex shrink-0 items-center justify-center", {
|
|
6049
|
+
compoundVariants: [
|
|
6050
|
+
{
|
|
6051
|
+
className: "rounded-xl",
|
|
6052
|
+
shape: "square",
|
|
6053
|
+
size: "small"
|
|
6054
|
+
},
|
|
6055
|
+
{
|
|
6056
|
+
className: "rounded-2xl",
|
|
6057
|
+
shape: "square",
|
|
6058
|
+
size: "medium"
|
|
6059
|
+
},
|
|
6060
|
+
{
|
|
6061
|
+
className: "rounded-3xl",
|
|
6062
|
+
shape: "square",
|
|
6063
|
+
size: "large"
|
|
6064
|
+
}
|
|
6065
|
+
],
|
|
6066
|
+
defaultVariants: {
|
|
6067
|
+
shape: "rounded",
|
|
6068
|
+
size: "medium",
|
|
6069
|
+
tone: "brand"
|
|
6070
|
+
},
|
|
6071
|
+
variants: {
|
|
6072
|
+
shape: {
|
|
6073
|
+
rounded: "rounded-full",
|
|
6074
|
+
square: ""
|
|
6075
|
+
},
|
|
6076
|
+
size: {
|
|
6077
|
+
large: "size-3xl [&>svg]:size-xl",
|
|
6078
|
+
medium: "size-2xl [&>svg]:size-lg",
|
|
6079
|
+
small: "size-xl [&>svg]:size-md"
|
|
6080
|
+
},
|
|
6081
|
+
tone: {
|
|
6082
|
+
accent: "bg-accent-container-high text-accent-on-container",
|
|
6083
|
+
brand: "bg-brand-container-high text-brand-on-container",
|
|
6084
|
+
error: "bg-error-container-high text-error-on-container",
|
|
6085
|
+
info: "bg-info-container-high text-info-on-container",
|
|
6086
|
+
neutral: "bg-neutral-container-high text-neutral-on-container",
|
|
6087
|
+
success: "bg-success-container-high text-success-on-container",
|
|
6088
|
+
warning: "bg-warning-container-high text-warning-on-container"
|
|
6089
|
+
}
|
|
6090
|
+
}
|
|
6091
|
+
});
|
|
6092
|
+
//#endregion
|
|
6093
|
+
//#region src/components/icon-container/icon-container.tsx
|
|
6094
|
+
function IconContainer({ shape, size, tone, className, children, ref, ...props }) {
|
|
6095
|
+
return /* @__PURE__ */ jsx("div", {
|
|
6096
|
+
className: cn(iconContainerVariants({
|
|
6097
|
+
shape,
|
|
6098
|
+
size,
|
|
6099
|
+
tone
|
|
6100
|
+
}), className),
|
|
6101
|
+
ref,
|
|
6102
|
+
...props,
|
|
6103
|
+
children
|
|
6104
|
+
});
|
|
6105
|
+
}
|
|
6106
|
+
//#endregion
|
|
5999
6107
|
//#region src/components/input-otp/input-otp.tsx
|
|
6000
6108
|
function InputOTP$1({ children, className, id, ref, ...props }) {
|
|
6001
6109
|
const generatedId = useId(), fieldId = id ?? generatedId;
|
|
@@ -6589,7 +6697,7 @@ function MenuGroupLabel({ className, ref, ...props }) {
|
|
|
6589
6697
|
}
|
|
6590
6698
|
//#endregion
|
|
6591
6699
|
//#region src/components/menu/menu.types.ts
|
|
6592
|
-
const menuItemVariants = cva("relative z-0 flex
|
|
6700
|
+
const menuItemVariants = cva("relative z-0 flex cursor-default items-center px-xs py-3xs style-text-default-0 transition-colors duration-100 outline-none select-none before:absolute before:inset-x-3xs before:inset-y-[0px] before:z-[-1] before:rounded-md before:bg-transparent before:transition-colors before:duration-100 before:content-[\"\"] hover:cursor-pointer", {
|
|
6593
6701
|
defaultVariants: { tone: "neutral" },
|
|
6594
6702
|
variants: { tone: {
|
|
6595
6703
|
accent: "text-accent-default data-highlighted:text-accent-on-container data-highlighted:before:bg-accent-container",
|
|
@@ -6601,7 +6709,7 @@ const menuItemVariants = cva("relative z-0 flex h-lg cursor-default items-center
|
|
|
6601
6709
|
warning: "text-warning-default data-highlighted:text-warning-on-container data-highlighted:before:bg-warning-container"
|
|
6602
6710
|
} }
|
|
6603
6711
|
});
|
|
6604
|
-
const menuSubmenuTriggerVariants = cva("relative z-0 grid
|
|
6712
|
+
const menuSubmenuTriggerVariants = cva("relative z-0 grid cursor-default grid-cols-[1fr_2rem] items-center px-xs py-3xs style-text-default-0 transition-colors duration-100 outline-none select-none before:absolute before:inset-x-3xs before:inset-y-[0px] before:z-[-1] before:rounded-md before:transition-colors before:duration-100 before:content-[\"\"] hover:cursor-pointer", {
|
|
6605
6713
|
defaultVariants: { tone: "neutral" },
|
|
6606
6714
|
variants: { tone: {
|
|
6607
6715
|
accent: "text-accent-default data-highlighted:text-accent-on-container data-highlighted:before:bg-accent-container data-popup-open:text-accent-on-container data-popup-open:before:bg-accent-container data-highlighted:data-popup-open:before:bg-accent-container",
|
|
@@ -6638,7 +6746,7 @@ function MenuPopup({ className, children, ref, ...props }) {
|
|
|
6638
6746
|
sideOffset: 8,
|
|
6639
6747
|
...props,
|
|
6640
6748
|
children: /* @__PURE__ */ jsx(Menu$1.Popup, {
|
|
6641
|
-
className: "z-99 min-w-[12rem] origin-(--transform-origin) translate-x-[-calc(var(--spacing-xl)/2)] rounded-lg bg-surface-2 px-3xs py-2xs shadow-md transition-[transform,scale,opacity] data-ending-style:scale-90 data-ending-style:opacity-0 data-starting-style:scale-90 data-starting-style:opacity-0",
|
|
6749
|
+
className: "z-99 flex min-w-[12rem] origin-(--transform-origin) translate-x-[-calc(var(--spacing-xl)/2)] flex-col gap-3xs rounded-lg bg-surface-2 px-3xs py-2xs shadow-md transition-[transform,scale,opacity] data-ending-style:scale-90 data-ending-style:opacity-0 data-starting-style:scale-90 data-starting-style:opacity-0",
|
|
6642
6750
|
children
|
|
6643
6751
|
})
|
|
6644
6752
|
}) });
|
|
@@ -6959,17 +7067,17 @@ const navBarVariants = cva("flex h-fit items-center justify-between", {
|
|
|
6959
7067
|
variant: "floating"
|
|
6960
7068
|
},
|
|
6961
7069
|
{
|
|
6962
|
-
className: "[&_[data-nav-bar-item]]:
|
|
7070
|
+
className: "[&_[data-nav-bar-item]]:max-w-2xl [&_[data-nav-bar-item]]:gap-3xs [&_[data-nav-bar-item]]:rounded-xl [&_[data-nav-bar-item]]:p-[min(var(--spacing-2xs),25%)]",
|
|
6963
7071
|
itemOrientation: "vertical",
|
|
6964
7072
|
size: "small"
|
|
6965
7073
|
},
|
|
6966
7074
|
{
|
|
6967
|
-
className: "[&_[data-nav-bar-item]]:
|
|
7075
|
+
className: "[&_[data-nav-bar-item]]:max-w-3xl [&_[data-nav-bar-item]]:gap-3xs [&_[data-nav-bar-item]]:rounded-2xl [&_[data-nav-bar-item]]:p-[min(var(--spacing-sm),25%)]",
|
|
6968
7076
|
itemOrientation: "vertical",
|
|
6969
7077
|
size: "medium"
|
|
6970
7078
|
},
|
|
6971
7079
|
{
|
|
6972
|
-
className: "[&_[data-nav-bar-item]]:
|
|
7080
|
+
className: "[&_[data-nav-bar-item]]:gap-2xs [&_[data-nav-bar-item]]:rounded-3xl [&_[data-nav-bar-item]]:p-[min(var(--spacing-md),25%)]",
|
|
6973
7081
|
itemOrientation: "vertical",
|
|
6974
7082
|
size: "large"
|
|
6975
7083
|
},
|
|
@@ -6997,7 +7105,7 @@ const navBarVariants = cva("flex h-fit items-center justify-between", {
|
|
|
6997
7105
|
variants: {
|
|
6998
7106
|
itemOrientation: {
|
|
6999
7107
|
horizontal: "[&_[data-nav-bar-item]]:flex-row",
|
|
7000
|
-
vertical: "[&_[data-nav-bar-item]]:flex-col"
|
|
7108
|
+
vertical: "grid auto-cols-fr grid-flow-col items-start justify-items-center [&_[data-nav-bar-item]]:min-h-0 [&_[data-nav-bar-item]]:w-full [&_[data-nav-bar-item]]:min-w-0 [&_[data-nav-bar-item]]:flex-col [&_[data-nav-bar-item]]:overflow-hidden [&_[data-nav-bar-item]_span]:max-w-full [&_[data-nav-bar-item]_span]:truncate"
|
|
7001
7109
|
},
|
|
7002
7110
|
size: {
|
|
7003
7111
|
large: "gap-sm p-md [&_span]:style-text-default-0 [&_svg]:size-lg",
|
|
@@ -7132,7 +7240,7 @@ const navigationMenuTriggerVariants = cva("flex items-center justify-center roun
|
|
|
7132
7240
|
}
|
|
7133
7241
|
}
|
|
7134
7242
|
});
|
|
7135
|
-
const navigationMenuLinkVariants = cva("rounded-
|
|
7243
|
+
const navigationMenuLinkVariants = cva("rounded-xl px-sm py-xs transition-colors hover:cursor-pointer", {
|
|
7136
7244
|
defaultVariants: { tone: "neutral" },
|
|
7137
7245
|
variants: { tone: {
|
|
7138
7246
|
accent: "text-accent-on-container hover:bg-accent-container",
|
|
@@ -7387,7 +7495,7 @@ function ProfileAction({ className, ref, ...props }) {
|
|
|
7387
7495
|
//#region src/components/profile/profile-content.tsx
|
|
7388
7496
|
function ProfileContent({ compact, className, ref, ...props }) {
|
|
7389
7497
|
return /* @__PURE__ */ jsx("div", {
|
|
7390
|
-
className: cn("flex flex-col items-start justify-start
|
|
7498
|
+
className: cn("flex flex-col items-start justify-start", compact && "hidden", className),
|
|
7391
7499
|
ref,
|
|
7392
7500
|
...props
|
|
7393
7501
|
});
|
|
@@ -7485,7 +7593,7 @@ function ProgressIndicator({ className, children, ref, ...props }) {
|
|
|
7485
7593
|
return /* @__PURE__ */ jsxs("div", {
|
|
7486
7594
|
className: "relative flex shrink-0 flex-col items-center",
|
|
7487
7595
|
children: [/* @__PURE__ */ jsx("div", {
|
|
7488
|
-
className: cn("flex size-md shrink-0 flex-col items-center justify-center rounded-full border border-neutral-border bg-neutral-container text-center
|
|
7596
|
+
className: cn("flex size-md shrink-0 flex-col items-center justify-center rounded-full border border-neutral-border bg-neutral-container text-center font-body text-xs leading-none font-medium text-accent-default transition-colors ease-in-out [&_svg]:size-xs", className),
|
|
7489
7597
|
ref,
|
|
7490
7598
|
...props,
|
|
7491
7599
|
children: inner
|
|
@@ -7666,7 +7774,7 @@ function useMediaQuery(deviceName) {
|
|
|
7666
7774
|
}
|
|
7667
7775
|
//#endregion
|
|
7668
7776
|
//#region src/hooks/theme/theme.constants.ts
|
|
7669
|
-
const THEME_STORAGE_KEY = "
|
|
7777
|
+
const THEME_STORAGE_KEY = "ixia-ui-theme";
|
|
7670
7778
|
const DEFAULT_THEME = "light";
|
|
7671
7779
|
const getThemeByValue = (value, themes) => themes.find((themeItem) => themeItem.value === value);
|
|
7672
7780
|
//#endregion
|
|
@@ -7893,7 +8001,7 @@ function SidebarMenuButton({ isActive, className, ref, ...props }) {
|
|
|
7893
8001
|
return /* @__PURE__ */ jsx("button", {
|
|
7894
8002
|
type: "button",
|
|
7895
8003
|
"data-active": String(Boolean(isActive)),
|
|
7896
|
-
className: cn("inline-flex cursor-pointer items-center gap-2xs rounded-
|
|
8004
|
+
className: cn("inline-flex cursor-pointer items-center gap-2xs rounded-full border border-transparent style-text-default-0 whitespace-nowrap transition-all duration-200 ease-out select-none active:scale-95 disabled:pointer-events-none disabled:opacity-50 [&>svg]:shrink-0", isActive && "pointer-events-none bg-surface text-on-surface shadow-2xs", !isActive && "text-neutral-default hover:bg-neutral-container hover:text-neutral-on-container", isActive && !open && "bg-neutral-container", !(collapsible === "none" || open) && "mx-auto", !open && "size-xl justify-center *:hidden [&>svg]:block", open && "h-xl w-full pl-sm", collapsible !== "none" && open && "animate-in fade-in-0 slide-in-from-left-2", className),
|
|
7897
8005
|
ref,
|
|
7898
8006
|
...props
|
|
7899
8007
|
});
|
|
@@ -8218,6 +8326,13 @@ const SliderGroup = Object.assign(SliderGroup$1, {
|
|
|
8218
8326
|
});
|
|
8219
8327
|
//#endregion
|
|
8220
8328
|
//#region src/components/table/table.types.ts
|
|
8329
|
+
const tableContainerVariants = cva("group/table flex min-w-0 flex-col gap-md", {
|
|
8330
|
+
defaultVariants: { variant: "outline" },
|
|
8331
|
+
variants: { variant: {
|
|
8332
|
+
ghost: "",
|
|
8333
|
+
outline: "overflow-hidden rounded-2xl border border-border"
|
|
8334
|
+
} }
|
|
8335
|
+
});
|
|
8221
8336
|
const stringFilterOperators = [
|
|
8222
8337
|
"equals",
|
|
8223
8338
|
"notEquals",
|
|
@@ -8275,7 +8390,7 @@ function getColumnHeaderLabel(column) {
|
|
|
8275
8390
|
function asFilterValue(value) {
|
|
8276
8391
|
return value;
|
|
8277
8392
|
}
|
|
8278
|
-
const ZERO = 0;
|
|
8393
|
+
const ZERO$1 = 0;
|
|
8279
8394
|
const FIRST_RANGE_INDEX$1 = 0;
|
|
8280
8395
|
const SECOND_RANGE_INDEX = 1;
|
|
8281
8396
|
const getDateTimestamp = (date) => Date.UTC(date.getFullYear(), date.getMonth(), date.getDate());
|
|
@@ -8292,8 +8407,8 @@ const parseToTimestamp = (value) => {
|
|
|
8292
8407
|
const normalizeDataValue = (value) => {
|
|
8293
8408
|
if (value instanceof Date) return getDateTimestamp(value);
|
|
8294
8409
|
if (typeof value === "number") return getDateTimestamp(new Date(value));
|
|
8295
|
-
if (typeof value === "string") return parseToTimestamp(value) ?? ZERO;
|
|
8296
|
-
return ZERO;
|
|
8410
|
+
if (typeof value === "string") return parseToTimestamp(value) ?? ZERO$1;
|
|
8411
|
+
return ZERO$1;
|
|
8297
8412
|
};
|
|
8298
8413
|
const dateFilterFn = constructFilterFn({
|
|
8299
8414
|
autoRemove: (value) => !value || !value.date[FIRST_RANGE_INDEX$1] && !value.date[SECOND_RANGE_INDEX],
|
|
@@ -8376,6 +8491,25 @@ const features = tableFeatures({
|
|
|
8376
8491
|
columnMeta: metaHelper(),
|
|
8377
8492
|
columnSizingFeature,
|
|
8378
8493
|
columnVisibilityFeature,
|
|
8494
|
+
datasetPlugin: {
|
|
8495
|
+
constructTableAPIs: (table) => {
|
|
8496
|
+
const options = table.options;
|
|
8497
|
+
assignTableAPIs("datasetPlugin", table, { table_setCurrentDataset: { fn: (updater) => {
|
|
8498
|
+
const safeUpdater = (old) => functionalUpdate(updater, old);
|
|
8499
|
+
return options.onCurrentDatasetChange?.(safeUpdater);
|
|
8500
|
+
} } });
|
|
8501
|
+
},
|
|
8502
|
+
getDefaultTableOptions: (table) => ({ onCurrentDatasetChange: makeStateUpdater("currentDataset", table) }),
|
|
8503
|
+
getInitialState: (initialState) => ({
|
|
8504
|
+
currentDataset: {
|
|
8505
|
+
data: [],
|
|
8506
|
+
id: "",
|
|
8507
|
+
name: ""
|
|
8508
|
+
},
|
|
8509
|
+
datasets: [],
|
|
8510
|
+
...initialState
|
|
8511
|
+
})
|
|
8512
|
+
},
|
|
8379
8513
|
facetedRowModel: createFacetedRowModel(),
|
|
8380
8514
|
facetedUniqueValues: createFacetedUniqueValues(),
|
|
8381
8515
|
filterFns: {
|
|
@@ -8447,6 +8581,21 @@ const features = tableFeatures({
|
|
|
8447
8581
|
}
|
|
8448
8582
|
}), { tableContext, cellContext, headerContext, useTableContext: useTableContext$2, useCellContext: useCellContext$2, useHeaderContext: useHeaderContext$2 } = createTableHookContexts();
|
|
8449
8583
|
//#endregion
|
|
8584
|
+
//#region src/components/table/table-avatar-cell.tsx
|
|
8585
|
+
function TableAvatarCell({ fallback, className, children, ref, ...props }) {
|
|
8586
|
+
const value = useCellContext$2().getValue();
|
|
8587
|
+
return /* @__PURE__ */ jsxs(Avatar, {
|
|
8588
|
+
className: cn("", className),
|
|
8589
|
+
ref,
|
|
8590
|
+
...props,
|
|
8591
|
+
children: [
|
|
8592
|
+
/* @__PURE__ */ jsx(Avatar.Image, { src: value }),
|
|
8593
|
+
fallback && /* @__PURE__ */ jsx(Avatar.Fallback, { children: fallback }),
|
|
8594
|
+
children
|
|
8595
|
+
]
|
|
8596
|
+
});
|
|
8597
|
+
}
|
|
8598
|
+
//#endregion
|
|
8450
8599
|
//#region src/components/table/table-badge-cell.tsx
|
|
8451
8600
|
function resolveTone(tone, value) {
|
|
8452
8601
|
if (typeof tone === "function") return tone(value);
|
|
@@ -8465,17 +8614,13 @@ function TableBadgeCell({ className, children, ref, tone, ...props }) {
|
|
|
8465
8614
|
}
|
|
8466
8615
|
//#endregion
|
|
8467
8616
|
//#region src/components/table/table-body.tsx
|
|
8468
|
-
function getRowBackgroundColor(isSelected) {
|
|
8469
|
-
if (isSelected) return "var(--color-neutral-container-high)";
|
|
8470
|
-
return "transparent";
|
|
8471
|
-
}
|
|
8472
8617
|
function TableBody({ showDivider = true, className, ref, ...props }) {
|
|
8473
8618
|
const table = useTableContext$2();
|
|
8474
8619
|
return /* @__PURE__ */ jsx(table.Subscribe, {
|
|
8475
8620
|
selector: (state) => state,
|
|
8476
8621
|
children: (state) => {
|
|
8477
8622
|
if (state.viewMode === "grid") return /* @__PURE__ */ jsx("ul", {
|
|
8478
|
-
className: cn("grid auto-rows-fr grid-cols-[repeat(auto-fill,minmax(252px,1fr))] gap-sm overflow-y-auto", className),
|
|
8623
|
+
className: cn("grid auto-rows-fr grid-cols-[repeat(auto-fill,minmax(252px,1fr))] gap-sm overflow-y-auto border-border group-data-[variant=outline]/table:border-y group-data-[variant=outline]/table:p-md", className),
|
|
8479
8624
|
children: table.getRowModel().rows.map((row) => /* @__PURE__ */ jsx("li", {
|
|
8480
8625
|
className: "min-w-0",
|
|
8481
8626
|
children: row.getVisibleCells().map((cell) => /* @__PURE__ */ jsx(table.AppCell, {
|
|
@@ -8488,16 +8633,16 @@ function TableBody({ showDivider = true, className, ref, ...props }) {
|
|
|
8488
8633
|
}, row.id))
|
|
8489
8634
|
});
|
|
8490
8635
|
return /* @__PURE__ */ jsx("tbody", {
|
|
8491
|
-
className: cn(showDivider && "divide-y divide-border", "overflow-y-auto", className),
|
|
8636
|
+
className: cn(showDivider && "divide-y divide-border", "overflow-y-auto border-border group-data-[variant=outline]/table:last:border-b", className),
|
|
8492
8637
|
ref,
|
|
8493
8638
|
...props,
|
|
8494
8639
|
children: table.getRowModel().rows.map((row) => /* @__PURE__ */ jsx("tr", {
|
|
8495
|
-
|
|
8640
|
+
className: cn(row.getIsSelected() && "bg-neutral-container-low"),
|
|
8496
8641
|
children: row.getVisibleCells().map((cell) => /* @__PURE__ */ jsx(table.AppCell, {
|
|
8497
8642
|
cell,
|
|
8498
8643
|
children: (renderedCell) => /* @__PURE__ */ jsx("td", {
|
|
8499
8644
|
style: { width: renderedCell.column.getSize() },
|
|
8500
|
-
className: cn("h-
|
|
8645
|
+
className: cn("h-2xl p-xs", className),
|
|
8501
8646
|
children: /* @__PURE__ */ jsx(table.FlexRender, { cell: renderedCell })
|
|
8502
8647
|
})
|
|
8503
8648
|
}, cell.id))
|
|
@@ -8507,24 +8652,70 @@ function TableBody({ showDivider = true, className, ref, ...props }) {
|
|
|
8507
8652
|
});
|
|
8508
8653
|
}
|
|
8509
8654
|
//#endregion
|
|
8655
|
+
//#region src/components/table/table-boolean-cell.tsx
|
|
8656
|
+
function TableBooleanCell({ trueLabel = "Yes", falseLabel = "No", children, ...props }) {
|
|
8657
|
+
const value = useCellContext$2().getValue();
|
|
8658
|
+
if (value === void 0 || value === null) return;
|
|
8659
|
+
return /* @__PURE__ */ jsxs("span", {
|
|
8660
|
+
...props,
|
|
8661
|
+
children: [
|
|
8662
|
+
children,
|
|
8663
|
+
value && trueLabel,
|
|
8664
|
+
!value && falseLabel
|
|
8665
|
+
]
|
|
8666
|
+
});
|
|
8667
|
+
}
|
|
8668
|
+
//#endregion
|
|
8669
|
+
//#region src/components/table/table-bottom-bar.tsx
|
|
8670
|
+
function TableBottomBar({ sticky = false, className, ref, ...props }) {
|
|
8671
|
+
return /* @__PURE__ */ jsx("div", {
|
|
8672
|
+
className: cn("flex w-full flex-wrap items-center justify-between gap-md", "[:where([data-slot=table-container][data-variant=outline]>&)]:px-md [:where([data-slot=table-container][data-variant=outline]>&:first-child)]:pt-md [:where([data-slot=table-container][data-variant=outline]>&:last-child)]:pb-md", sticky && "sticky bottom-0 z-10 bg-inherit", className),
|
|
8673
|
+
"data-slot": "table-bottom-bar",
|
|
8674
|
+
ref,
|
|
8675
|
+
...props
|
|
8676
|
+
});
|
|
8677
|
+
}
|
|
8678
|
+
//#endregion
|
|
8510
8679
|
//#region src/components/table/table-checkbox-cell.tsx
|
|
8511
8680
|
function TableCheckboxCell({ className, ref, ...props }) {
|
|
8512
8681
|
const cell = useCellContext$2(), table = useTableContext$2(), { row } = cell;
|
|
8513
8682
|
return /* @__PURE__ */ jsx(table.Subscribe, {
|
|
8514
8683
|
selector: (state) => state.rowSelection,
|
|
8515
8684
|
children: () => /* @__PURE__ */ jsx(Checkbox, {
|
|
8685
|
+
variant: "outline",
|
|
8516
8686
|
"aria-label": "Select row",
|
|
8517
8687
|
checked: row.getIsSelected() || row.getCanSelectSubRows() && row.getIsAllSubRowsSelected(),
|
|
8518
8688
|
disabled: !row.getCanSelect(),
|
|
8519
8689
|
indeterminate: row.getIsSomeSelected(),
|
|
8520
8690
|
onCheckedChange: (checked) => row.toggleSelected(checked),
|
|
8521
|
-
className: cn("", className),
|
|
8691
|
+
className: cn("mx-auto flex", className),
|
|
8522
8692
|
ref,
|
|
8523
8693
|
...props
|
|
8524
8694
|
})
|
|
8525
8695
|
});
|
|
8526
8696
|
}
|
|
8527
8697
|
//#endregion
|
|
8698
|
+
//#region src/components/table/table-checkbox-header.tsx
|
|
8699
|
+
function TableCheckboxHeader({ className, ref, ...props }) {
|
|
8700
|
+
const table = useTableContext$2();
|
|
8701
|
+
return /* @__PURE__ */ jsx(table.Subscribe, {
|
|
8702
|
+
selector: (state) => state.rowSelection,
|
|
8703
|
+
children: () => {
|
|
8704
|
+
const allRowsSelected = table.getIsAllRowsSelected();
|
|
8705
|
+
return /* @__PURE__ */ jsx(Checkbox, {
|
|
8706
|
+
"aria-label": "Select all rows",
|
|
8707
|
+
variant: "outline",
|
|
8708
|
+
checked: allRowsSelected,
|
|
8709
|
+
indeterminate: !allRowsSelected && table.getIsSomeRowsSelected(),
|
|
8710
|
+
onCheckedChange: (checked) => table.toggleAllRowsSelected(checked),
|
|
8711
|
+
className: cn("mx-auto flex", className),
|
|
8712
|
+
ref,
|
|
8713
|
+
...props
|
|
8714
|
+
});
|
|
8715
|
+
}
|
|
8716
|
+
});
|
|
8717
|
+
}
|
|
8718
|
+
//#endregion
|
|
8528
8719
|
//#region src/components/table/table-column-toggle.tsx
|
|
8529
8720
|
function TableColumnToggle({ className, ref, ...props }) {
|
|
8530
8721
|
const table = useTableContext$2(), handleToggleColumn = (columnId) => {
|
|
@@ -8545,22 +8736,437 @@ function TableColumnToggle({ className, ref, ...props }) {
|
|
|
8545
8736
|
}
|
|
8546
8737
|
//#endregion
|
|
8547
8738
|
//#region src/components/table/table-container.tsx
|
|
8548
|
-
function TableContainer({ className, ref, ...props }) {
|
|
8739
|
+
function TableContainer({ variant = "outline", className, ref, ...props }) {
|
|
8549
8740
|
return /* @__PURE__ */ jsx("div", {
|
|
8550
|
-
|
|
8741
|
+
"data-slot": "table-container",
|
|
8742
|
+
"data-variant": variant,
|
|
8743
|
+
className: cn(tableContainerVariants({ variant }), className),
|
|
8551
8744
|
ref,
|
|
8552
8745
|
...props
|
|
8553
8746
|
});
|
|
8554
8747
|
}
|
|
8555
8748
|
//#endregion
|
|
8556
|
-
//#region src/components/table/table-
|
|
8557
|
-
function
|
|
8558
|
-
const
|
|
8749
|
+
//#region src/components/table/table-currency-cell.tsx
|
|
8750
|
+
function TableCurrencyCell({ currency, locale, options, children, ...props }) {
|
|
8751
|
+
const value = useCellContext$2().getValue();
|
|
8752
|
+
if (value === void 0 || value === null) return;
|
|
8753
|
+
return /* @__PURE__ */ jsxs("span", {
|
|
8754
|
+
...props,
|
|
8755
|
+
children: [children, new Intl.NumberFormat(locale, {
|
|
8756
|
+
...options,
|
|
8757
|
+
currency,
|
|
8758
|
+
style: "currency"
|
|
8759
|
+
}).format(value)]
|
|
8760
|
+
});
|
|
8761
|
+
}
|
|
8762
|
+
//#endregion
|
|
8763
|
+
//#region node_modules/.pnpm/use-sync-external-store@1.7.0_react@19.3.1/node_modules/use-sync-external-store/cjs/use-sync-external-store-shim.production.js
|
|
8764
|
+
/**
|
|
8765
|
+
* @license React
|
|
8766
|
+
* use-sync-external-store-shim.production.js
|
|
8767
|
+
*
|
|
8768
|
+
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
8769
|
+
*
|
|
8770
|
+
* This source code is licensed under the MIT license found in the
|
|
8771
|
+
* LICENSE file in the root directory of this source tree.
|
|
8772
|
+
*/
|
|
8773
|
+
var require_use_sync_external_store_shim_production = /* @__PURE__ */ __commonJSMin(((exports) => {
|
|
8774
|
+
var React = __require("react");
|
|
8775
|
+
function is(x, y) {
|
|
8776
|
+
return x === y && (0 !== x || 1 / x === 1 / y) || x !== x && y !== y;
|
|
8777
|
+
}
|
|
8778
|
+
var objectIs = "function" === typeof Object.is ? Object.is : is;
|
|
8779
|
+
var useState = React.useState;
|
|
8780
|
+
var useEffect = React.useEffect;
|
|
8781
|
+
var useLayoutEffect = React.useLayoutEffect;
|
|
8782
|
+
var useDebugValue = React.useDebugValue;
|
|
8783
|
+
function useSyncExternalStore$2(subscribe, getSnapshot) {
|
|
8784
|
+
var value = getSnapshot(), _useState = useState({ inst: {
|
|
8785
|
+
value,
|
|
8786
|
+
getSnapshot
|
|
8787
|
+
} }), inst = _useState[0].inst, forceUpdate = _useState[1];
|
|
8788
|
+
useLayoutEffect(function() {
|
|
8789
|
+
inst.value = value;
|
|
8790
|
+
inst.getSnapshot = getSnapshot;
|
|
8791
|
+
checkIfSnapshotChanged(inst) && forceUpdate({ inst });
|
|
8792
|
+
}, [
|
|
8793
|
+
subscribe,
|
|
8794
|
+
value,
|
|
8795
|
+
getSnapshot
|
|
8796
|
+
]);
|
|
8797
|
+
useEffect(function() {
|
|
8798
|
+
checkIfSnapshotChanged(inst) && forceUpdate({ inst });
|
|
8799
|
+
return subscribe(function() {
|
|
8800
|
+
checkIfSnapshotChanged(inst) && forceUpdate({ inst });
|
|
8801
|
+
});
|
|
8802
|
+
}, [subscribe]);
|
|
8803
|
+
useDebugValue(value);
|
|
8804
|
+
return value;
|
|
8805
|
+
}
|
|
8806
|
+
function checkIfSnapshotChanged(inst) {
|
|
8807
|
+
var latestGetSnapshot = inst.getSnapshot;
|
|
8808
|
+
inst = inst.value;
|
|
8809
|
+
try {
|
|
8810
|
+
var nextValue = latestGetSnapshot();
|
|
8811
|
+
return !objectIs(inst, nextValue);
|
|
8812
|
+
} catch (error) {
|
|
8813
|
+
return !0;
|
|
8814
|
+
}
|
|
8815
|
+
}
|
|
8816
|
+
function useSyncExternalStore$1(subscribe, getSnapshot) {
|
|
8817
|
+
return getSnapshot();
|
|
8818
|
+
}
|
|
8819
|
+
var shim = "undefined" === typeof window || "undefined" === typeof window.document || "undefined" === typeof window.document.createElement ? useSyncExternalStore$1 : useSyncExternalStore$2;
|
|
8820
|
+
exports.useSyncExternalStore = void 0 !== React.useSyncExternalStore ? React.useSyncExternalStore : shim;
|
|
8821
|
+
}));
|
|
8822
|
+
//#endregion
|
|
8823
|
+
//#region node_modules/.pnpm/use-sync-external-store@1.7.0_react@19.3.1/node_modules/use-sync-external-store/cjs/use-sync-external-store-shim.development.js
|
|
8824
|
+
/**
|
|
8825
|
+
* @license React
|
|
8826
|
+
* use-sync-external-store-shim.development.js
|
|
8827
|
+
*
|
|
8828
|
+
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
8829
|
+
*
|
|
8830
|
+
* This source code is licensed under the MIT license found in the
|
|
8831
|
+
* LICENSE file in the root directory of this source tree.
|
|
8832
|
+
*/
|
|
8833
|
+
var require_use_sync_external_store_shim_development = /* @__PURE__ */ __commonJSMin(((exports) => {
|
|
8834
|
+
"production" !== process.env.NODE_ENV && (function() {
|
|
8835
|
+
function is(x, y) {
|
|
8836
|
+
return x === y && (0 !== x || 1 / x === 1 / y) || x !== x && y !== y;
|
|
8837
|
+
}
|
|
8838
|
+
function useSyncExternalStore$2(subscribe, getSnapshot) {
|
|
8839
|
+
didWarnOld18Alpha || void 0 === React.startTransition || (didWarnOld18Alpha = !0, console.error("You are using an outdated, pre-release alpha of React 18 that does not support useSyncExternalStore. The use-sync-external-store shim will not work correctly. Upgrade to a newer pre-release."));
|
|
8840
|
+
var value = getSnapshot();
|
|
8841
|
+
if (!didWarnUncachedGetSnapshot) {
|
|
8842
|
+
var cachedValue = getSnapshot();
|
|
8843
|
+
objectIs(value, cachedValue) || (console.error("The result of getSnapshot should be cached to avoid an infinite loop"), didWarnUncachedGetSnapshot = !0);
|
|
8844
|
+
}
|
|
8845
|
+
cachedValue = useState({ inst: {
|
|
8846
|
+
value,
|
|
8847
|
+
getSnapshot
|
|
8848
|
+
} });
|
|
8849
|
+
var inst = cachedValue[0].inst, forceUpdate = cachedValue[1];
|
|
8850
|
+
useLayoutEffect(function() {
|
|
8851
|
+
inst.value = value;
|
|
8852
|
+
inst.getSnapshot = getSnapshot;
|
|
8853
|
+
checkIfSnapshotChanged(inst) && forceUpdate({ inst });
|
|
8854
|
+
}, [
|
|
8855
|
+
subscribe,
|
|
8856
|
+
value,
|
|
8857
|
+
getSnapshot
|
|
8858
|
+
]);
|
|
8859
|
+
useEffect(function() {
|
|
8860
|
+
checkIfSnapshotChanged(inst) && forceUpdate({ inst });
|
|
8861
|
+
return subscribe(function() {
|
|
8862
|
+
checkIfSnapshotChanged(inst) && forceUpdate({ inst });
|
|
8863
|
+
});
|
|
8864
|
+
}, [subscribe]);
|
|
8865
|
+
useDebugValue(value);
|
|
8866
|
+
return value;
|
|
8867
|
+
}
|
|
8868
|
+
function checkIfSnapshotChanged(inst) {
|
|
8869
|
+
var latestGetSnapshot = inst.getSnapshot;
|
|
8870
|
+
inst = inst.value;
|
|
8871
|
+
try {
|
|
8872
|
+
var nextValue = latestGetSnapshot();
|
|
8873
|
+
return !objectIs(inst, nextValue);
|
|
8874
|
+
} catch (error) {
|
|
8875
|
+
return !0;
|
|
8876
|
+
}
|
|
8877
|
+
}
|
|
8878
|
+
function useSyncExternalStore$1(subscribe, getSnapshot) {
|
|
8879
|
+
return getSnapshot();
|
|
8880
|
+
}
|
|
8881
|
+
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ && "function" === typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(Error());
|
|
8882
|
+
var React = __require("react"), objectIs = "function" === typeof Object.is ? Object.is : is, useState = React.useState, useEffect = React.useEffect, useLayoutEffect = React.useLayoutEffect, useDebugValue = React.useDebugValue, didWarnOld18Alpha = !1, didWarnUncachedGetSnapshot = !1, shim = "undefined" === typeof window || "undefined" === typeof window.document || "undefined" === typeof window.document.createElement ? useSyncExternalStore$1 : useSyncExternalStore$2;
|
|
8883
|
+
exports.useSyncExternalStore = void 0 !== React.useSyncExternalStore ? React.useSyncExternalStore : shim;
|
|
8884
|
+
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ && "function" === typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error());
|
|
8885
|
+
})();
|
|
8886
|
+
}));
|
|
8887
|
+
//#endregion
|
|
8888
|
+
//#region node_modules/.pnpm/use-sync-external-store@1.7.0_react@19.3.1/node_modules/use-sync-external-store/shim/index.js
|
|
8889
|
+
var require_shim = /* @__PURE__ */ __commonJSMin(((exports, module) => {
|
|
8890
|
+
if (process.env.NODE_ENV === "production") module.exports = require_use_sync_external_store_shim_production();
|
|
8891
|
+
else module.exports = require_use_sync_external_store_shim_development();
|
|
8892
|
+
}));
|
|
8893
|
+
//#endregion
|
|
8894
|
+
//#region node_modules/.pnpm/use-sync-external-store@1.7.0_react@19.3.1/node_modules/use-sync-external-store/cjs/use-sync-external-store-shim/with-selector.production.js
|
|
8895
|
+
/**
|
|
8896
|
+
* @license React
|
|
8897
|
+
* use-sync-external-store-shim/with-selector.production.js
|
|
8898
|
+
*
|
|
8899
|
+
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
8900
|
+
*
|
|
8901
|
+
* This source code is licensed under the MIT license found in the
|
|
8902
|
+
* LICENSE file in the root directory of this source tree.
|
|
8903
|
+
*/
|
|
8904
|
+
var require_with_selector_production = /* @__PURE__ */ __commonJSMin(((exports) => {
|
|
8905
|
+
var React = __require("react");
|
|
8906
|
+
var shim = require_shim();
|
|
8907
|
+
function is(x, y) {
|
|
8908
|
+
return x === y && (0 !== x || 1 / x === 1 / y) || x !== x && y !== y;
|
|
8909
|
+
}
|
|
8910
|
+
var objectIs = "function" === typeof Object.is ? Object.is : is;
|
|
8911
|
+
var useSyncExternalStore = shim.useSyncExternalStore;
|
|
8912
|
+
var useRef = React.useRef;
|
|
8913
|
+
var useEffect = React.useEffect;
|
|
8914
|
+
var useMemo = React.useMemo;
|
|
8915
|
+
var useDebugValue = React.useDebugValue;
|
|
8916
|
+
exports.useSyncExternalStoreWithSelector = function(subscribe, getSnapshot, getServerSnapshot, selector, isEqual) {
|
|
8917
|
+
var instRef = useRef(null);
|
|
8918
|
+
if (null === instRef.current) {
|
|
8919
|
+
var inst = {
|
|
8920
|
+
hasValue: !1,
|
|
8921
|
+
value: null
|
|
8922
|
+
};
|
|
8923
|
+
instRef.current = inst;
|
|
8924
|
+
} else inst = instRef.current;
|
|
8925
|
+
instRef = useMemo(function() {
|
|
8926
|
+
function memoizedSelector(nextSnapshot) {
|
|
8927
|
+
if (!hasMemo) {
|
|
8928
|
+
hasMemo = !0;
|
|
8929
|
+
memoizedSnapshot = nextSnapshot;
|
|
8930
|
+
nextSnapshot = selector(nextSnapshot);
|
|
8931
|
+
if (void 0 !== isEqual && inst.hasValue) {
|
|
8932
|
+
var currentSelection = inst.value;
|
|
8933
|
+
if (isEqual(currentSelection, nextSnapshot)) return memoizedSelection = currentSelection;
|
|
8934
|
+
}
|
|
8935
|
+
return memoizedSelection = nextSnapshot;
|
|
8936
|
+
}
|
|
8937
|
+
currentSelection = memoizedSelection;
|
|
8938
|
+
if (objectIs(memoizedSnapshot, nextSnapshot)) return currentSelection;
|
|
8939
|
+
var nextSelection = selector(nextSnapshot);
|
|
8940
|
+
if (void 0 !== isEqual && isEqual(currentSelection, nextSelection)) return memoizedSnapshot = nextSnapshot, currentSelection;
|
|
8941
|
+
memoizedSnapshot = nextSnapshot;
|
|
8942
|
+
return memoizedSelection = nextSelection;
|
|
8943
|
+
}
|
|
8944
|
+
var hasMemo = !1, memoizedSnapshot, memoizedSelection, maybeGetServerSnapshot = void 0 === getServerSnapshot ? null : getServerSnapshot;
|
|
8945
|
+
return [function() {
|
|
8946
|
+
return memoizedSelector(getSnapshot());
|
|
8947
|
+
}, null === maybeGetServerSnapshot ? void 0 : function() {
|
|
8948
|
+
return memoizedSelector(maybeGetServerSnapshot());
|
|
8949
|
+
}];
|
|
8950
|
+
}, [
|
|
8951
|
+
getSnapshot,
|
|
8952
|
+
getServerSnapshot,
|
|
8953
|
+
selector,
|
|
8954
|
+
isEqual
|
|
8955
|
+
]);
|
|
8956
|
+
var value = useSyncExternalStore(subscribe, instRef[0], instRef[1]);
|
|
8957
|
+
useEffect(function() {
|
|
8958
|
+
inst.hasValue = !0;
|
|
8959
|
+
inst.value = value;
|
|
8960
|
+
}, [value]);
|
|
8961
|
+
useDebugValue(value);
|
|
8962
|
+
return value;
|
|
8963
|
+
};
|
|
8964
|
+
}));
|
|
8965
|
+
//#endregion
|
|
8966
|
+
//#region node_modules/.pnpm/use-sync-external-store@1.7.0_react@19.3.1/node_modules/use-sync-external-store/cjs/use-sync-external-store-shim/with-selector.development.js
|
|
8967
|
+
/**
|
|
8968
|
+
* @license React
|
|
8969
|
+
* use-sync-external-store-shim/with-selector.development.js
|
|
8970
|
+
*
|
|
8971
|
+
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
8972
|
+
*
|
|
8973
|
+
* This source code is licensed under the MIT license found in the
|
|
8974
|
+
* LICENSE file in the root directory of this source tree.
|
|
8975
|
+
*/
|
|
8976
|
+
var require_with_selector_development = /* @__PURE__ */ __commonJSMin(((exports) => {
|
|
8977
|
+
"production" !== process.env.NODE_ENV && (function() {
|
|
8978
|
+
function is(x, y) {
|
|
8979
|
+
return x === y && (0 !== x || 1 / x === 1 / y) || x !== x && y !== y;
|
|
8980
|
+
}
|
|
8981
|
+
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ && "function" === typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(Error());
|
|
8982
|
+
var React = __require("react"), shim = require_shim(), objectIs = "function" === typeof Object.is ? Object.is : is, useSyncExternalStore = shim.useSyncExternalStore, useRef = React.useRef, useEffect = React.useEffect, useMemo = React.useMemo, useDebugValue = React.useDebugValue;
|
|
8983
|
+
exports.useSyncExternalStoreWithSelector = function(subscribe, getSnapshot, getServerSnapshot, selector, isEqual) {
|
|
8984
|
+
var instRef = useRef(null);
|
|
8985
|
+
if (null === instRef.current) {
|
|
8986
|
+
var inst = {
|
|
8987
|
+
hasValue: !1,
|
|
8988
|
+
value: null
|
|
8989
|
+
};
|
|
8990
|
+
instRef.current = inst;
|
|
8991
|
+
} else inst = instRef.current;
|
|
8992
|
+
instRef = useMemo(function() {
|
|
8993
|
+
function memoizedSelector(nextSnapshot) {
|
|
8994
|
+
if (!hasMemo) {
|
|
8995
|
+
hasMemo = !0;
|
|
8996
|
+
memoizedSnapshot = nextSnapshot;
|
|
8997
|
+
nextSnapshot = selector(nextSnapshot);
|
|
8998
|
+
if (void 0 !== isEqual && inst.hasValue) {
|
|
8999
|
+
var currentSelection = inst.value;
|
|
9000
|
+
if (isEqual(currentSelection, nextSnapshot)) return memoizedSelection = currentSelection;
|
|
9001
|
+
}
|
|
9002
|
+
return memoizedSelection = nextSnapshot;
|
|
9003
|
+
}
|
|
9004
|
+
currentSelection = memoizedSelection;
|
|
9005
|
+
if (objectIs(memoizedSnapshot, nextSnapshot)) return currentSelection;
|
|
9006
|
+
var nextSelection = selector(nextSnapshot);
|
|
9007
|
+
if (void 0 !== isEqual && isEqual(currentSelection, nextSelection)) return memoizedSnapshot = nextSnapshot, currentSelection;
|
|
9008
|
+
memoizedSnapshot = nextSnapshot;
|
|
9009
|
+
return memoizedSelection = nextSelection;
|
|
9010
|
+
}
|
|
9011
|
+
var hasMemo = !1, memoizedSnapshot, memoizedSelection, maybeGetServerSnapshot = void 0 === getServerSnapshot ? null : getServerSnapshot;
|
|
9012
|
+
return [function() {
|
|
9013
|
+
return memoizedSelector(getSnapshot());
|
|
9014
|
+
}, null === maybeGetServerSnapshot ? void 0 : function() {
|
|
9015
|
+
return memoizedSelector(maybeGetServerSnapshot());
|
|
9016
|
+
}];
|
|
9017
|
+
}, [
|
|
9018
|
+
getSnapshot,
|
|
9019
|
+
getServerSnapshot,
|
|
9020
|
+
selector,
|
|
9021
|
+
isEqual
|
|
9022
|
+
]);
|
|
9023
|
+
var value = useSyncExternalStore(subscribe, instRef[0], instRef[1]);
|
|
9024
|
+
useEffect(function() {
|
|
9025
|
+
inst.hasValue = !0;
|
|
9026
|
+
inst.value = value;
|
|
9027
|
+
}, [value]);
|
|
9028
|
+
useDebugValue(value);
|
|
9029
|
+
return value;
|
|
9030
|
+
};
|
|
9031
|
+
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ && "function" === typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error());
|
|
9032
|
+
})();
|
|
9033
|
+
}));
|
|
9034
|
+
//#endregion
|
|
9035
|
+
//#region node_modules/.pnpm/@tanstack+react-store@0.11.2_react-dom@19.3.1_react@19.3.1__react@19.3.1/node_modules/@tanstack/react-store/dist/useSelector.js
|
|
9036
|
+
var import_with_selector = (/* @__PURE__ */ __commonJSMin(((exports, module) => {
|
|
9037
|
+
if (process.env.NODE_ENV === "production") module.exports = require_with_selector_production();
|
|
9038
|
+
else module.exports = require_with_selector_development();
|
|
9039
|
+
})))();
|
|
9040
|
+
function defaultCompare(a, b) {
|
|
9041
|
+
return a === b;
|
|
9042
|
+
}
|
|
9043
|
+
/**
|
|
9044
|
+
* Selects a slice of state from an atom or store and subscribes the component
|
|
9045
|
+
* to that selection.
|
|
9046
|
+
*
|
|
9047
|
+
* This is the primary React read hook for TanStack Store. It works with any
|
|
9048
|
+
* source that exposes `get()` and `subscribe()`, including atoms, readonly
|
|
9049
|
+
* atoms, stores, and readonly stores.
|
|
9050
|
+
*
|
|
9051
|
+
* Omit the selector to subscribe to the whole value.
|
|
9052
|
+
*
|
|
9053
|
+
* @example
|
|
9054
|
+
* ```tsx
|
|
9055
|
+
* const count = useSelector(counterStore, (state) => state.count)
|
|
9056
|
+
* ```
|
|
9057
|
+
*
|
|
9058
|
+
* @example
|
|
9059
|
+
* ```tsx
|
|
9060
|
+
* const value = useSelector(countAtom)
|
|
9061
|
+
* ```
|
|
9062
|
+
*/
|
|
9063
|
+
function useSelector(source, selector = (s) => s, options) {
|
|
9064
|
+
const compare = options?.compare ?? defaultCompare;
|
|
9065
|
+
const subscribe = useCallback((handleStoreChange) => {
|
|
9066
|
+
const { unsubscribe } = source.subscribe(handleStoreChange);
|
|
9067
|
+
return unsubscribe;
|
|
9068
|
+
}, [source]);
|
|
9069
|
+
const getSnapshot = useCallback(() => source.get(), [source]);
|
|
9070
|
+
return (0, import_with_selector.useSyncExternalStoreWithSelector)(subscribe, getSnapshot, getSnapshot, selector, compare);
|
|
9071
|
+
}
|
|
9072
|
+
//#endregion
|
|
9073
|
+
//#region src/components/table/table-dataset-tab.tsx
|
|
9074
|
+
function TableDatasetTab({ className, children, ref, ...props }) {
|
|
9075
|
+
const table = useTableContext$2(), datasets = useSelector(table.atoms.datasets), currentDataset = useSelector(table.atoms.currentDataset), handleTabChange = (datasetId) => {
|
|
9076
|
+
const dataset = datasets.find((candidate) => candidate.id === datasetId);
|
|
9077
|
+
if (!dataset) return;
|
|
9078
|
+
table.setCurrentDataset(dataset);
|
|
9079
|
+
};
|
|
9080
|
+
return /* @__PURE__ */ jsxs(Tabs$2, {
|
|
9081
|
+
value: currentDataset.id,
|
|
9082
|
+
onValueChange: handleTabChange,
|
|
9083
|
+
className: cn("[[data-slot=table-container]>&]:-mb-md", className),
|
|
9084
|
+
ref,
|
|
9085
|
+
...props,
|
|
9086
|
+
"data-slot": "table-dataset-tab",
|
|
9087
|
+
children: [children, /* @__PURE__ */ jsx(TabsList, { children: datasets.map((dataset) => /* @__PURE__ */ jsx(TabsTab, {
|
|
9088
|
+
value: dataset.id,
|
|
9089
|
+
children: dataset.name
|
|
9090
|
+
}, dataset.id)) })]
|
|
9091
|
+
});
|
|
9092
|
+
}
|
|
9093
|
+
//#endregion
|
|
9094
|
+
//#region src/components/table/table-date-time-cell.tsx
|
|
9095
|
+
function TableDateTimeCell({ locale, options, className, children, ref, ...props }) {
|
|
9096
|
+
const date = useCellContext$2().getValue();
|
|
9097
|
+
if (!date) return;
|
|
9098
|
+
if (Number.isNaN(date.getTime())) return "Invalid date";
|
|
8559
9099
|
return /* @__PURE__ */ jsxs("span", {
|
|
8560
9100
|
className: cn("", className),
|
|
8561
9101
|
ref,
|
|
8562
9102
|
...props,
|
|
8563
|
-
children: [children,
|
|
9103
|
+
children: [children, formatDate(date, locale, options)]
|
|
9104
|
+
});
|
|
9105
|
+
}
|
|
9106
|
+
//#endregion
|
|
9107
|
+
//#region src/components/table/table-empty.tsx
|
|
9108
|
+
const EMPTY_LIMIT = 0;
|
|
9109
|
+
function TableEmpty({ className, children, ref, ...props }) {
|
|
9110
|
+
const table = useTableContext$2();
|
|
9111
|
+
return /* @__PURE__ */ jsx(table.Subscribe, {
|
|
9112
|
+
selector: (state) => state.globalFilter,
|
|
9113
|
+
children: () => table.getFilteredRowModel().rows.length <= EMPTY_LIMIT && /* @__PURE__ */ jsx("div", {
|
|
9114
|
+
"data-slot": "table-empty",
|
|
9115
|
+
className: cn("flex w-full min-w-0 flex-col items-center justify-center gap-md px-md py-3xl text-center", className),
|
|
9116
|
+
ref,
|
|
9117
|
+
...props,
|
|
9118
|
+
children
|
|
9119
|
+
})
|
|
9120
|
+
});
|
|
9121
|
+
}
|
|
9122
|
+
//#endregion
|
|
9123
|
+
//#region src/components/table/table-empty-content.tsx
|
|
9124
|
+
function TableEmptyContent({ className, children, ref, ...props }) {
|
|
9125
|
+
return /* @__PURE__ */ jsx("div", {
|
|
9126
|
+
className: cn("flex w-full max-w-[28rem] min-w-0 flex-col items-center gap-2xs", className),
|
|
9127
|
+
ref,
|
|
9128
|
+
...props,
|
|
9129
|
+
children
|
|
9130
|
+
});
|
|
9131
|
+
}
|
|
9132
|
+
//#endregion
|
|
9133
|
+
//#region src/components/table/table-empty-description.tsx
|
|
9134
|
+
function TableEmptyDescription({ className, children, ref, ...props }) {
|
|
9135
|
+
return /* @__PURE__ */ jsx("span", {
|
|
9136
|
+
className: cn("block max-w-[28rem] style-text-default--1 text-pretty wrap-break-word text-on-surface-variant", className),
|
|
9137
|
+
ref,
|
|
9138
|
+
...props,
|
|
9139
|
+
children
|
|
9140
|
+
});
|
|
9141
|
+
}
|
|
9142
|
+
//#endregion
|
|
9143
|
+
//#region src/components/table/table-empty-footer.tsx
|
|
9144
|
+
function TableEmptyFooter({ className, children, ref, ...props }) {
|
|
9145
|
+
return /* @__PURE__ */ jsx("div", {
|
|
9146
|
+
className: cn("flex w-full flex-wrap items-center justify-center gap-xs", className),
|
|
9147
|
+
ref,
|
|
9148
|
+
...props,
|
|
9149
|
+
children
|
|
9150
|
+
});
|
|
9151
|
+
}
|
|
9152
|
+
//#endregion
|
|
9153
|
+
//#region src/components/table/table-empty-header.tsx
|
|
9154
|
+
function TableEmptyHeader({ className, children, ref, ...props }) {
|
|
9155
|
+
return /* @__PURE__ */ jsx("div", {
|
|
9156
|
+
className: cn("flex w-full max-w-[28rem] flex-col items-center gap-sm", className),
|
|
9157
|
+
ref,
|
|
9158
|
+
...props,
|
|
9159
|
+
children
|
|
9160
|
+
});
|
|
9161
|
+
}
|
|
9162
|
+
//#endregion
|
|
9163
|
+
//#region src/components/table/table-empty-title.tsx
|
|
9164
|
+
function TableEmptyTitle({ className, children, ref, ...props }) {
|
|
9165
|
+
return /* @__PURE__ */ jsx("span", {
|
|
9166
|
+
className: cn("block style-text-strong-1 text-balance text-on-surface", className),
|
|
9167
|
+
ref,
|
|
9168
|
+
...props,
|
|
9169
|
+
children
|
|
8564
9170
|
});
|
|
8565
9171
|
}
|
|
8566
9172
|
//#endregion
|
|
@@ -8600,28 +9206,28 @@ function TableDateFilterForm({ column, className, children, ref, ...props }) {
|
|
|
8600
9206
|
...props,
|
|
8601
9207
|
children: /* @__PURE__ */ jsxs(form.AppForm, { children: [
|
|
8602
9208
|
children,
|
|
8603
|
-
/* @__PURE__ */ jsx(form.
|
|
8604
|
-
/* @__PURE__ */ jsx(form.
|
|
9209
|
+
/* @__PURE__ */ jsx(form.Errors, {}),
|
|
9210
|
+
/* @__PURE__ */ jsx(form.Set, { children: /* @__PURE__ */ jsx(form.SetHeading, { children: /* @__PURE__ */ jsx(form.SetContent, { children: /* @__PURE__ */ jsx(Field, { children: /* @__PURE__ */ jsx(form.AppField, {
|
|
8605
9211
|
name: "filterOperator",
|
|
8606
|
-
children: (field) => /* @__PURE__ */ jsxs(Field, { children: [/* @__PURE__ */ jsx(field.
|
|
9212
|
+
children: (field) => /* @__PURE__ */ jsxs(Field, { children: [/* @__PURE__ */ jsx(field.Errors, {}), /* @__PURE__ */ jsx(field.RadioGroup, { children: dateFilterOperators.map((operator) => /* @__PURE__ */ jsxs(field.Set, { children: [/* @__PURE__ */ jsx(Radio, {
|
|
8607
9213
|
value: operator,
|
|
8608
9214
|
variant: "inSurface",
|
|
8609
9215
|
children: filterOperatorLabels?.[operator] ?? defaultFilterOperatorLabels[operator]
|
|
8610
9216
|
}), field.state.value === operator && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(form.AppField, {
|
|
8611
9217
|
name: "filterValueFrom",
|
|
8612
|
-
children: (valueField) => /* @__PURE__ */ jsxs(Field, { children: [/* @__PURE__ */ jsx(valueField.
|
|
9218
|
+
children: (valueField) => /* @__PURE__ */ jsxs(Field, { children: [/* @__PURE__ */ jsx(valueField.Errors, {}), /* @__PURE__ */ jsx(valueField.Input, {
|
|
8613
9219
|
type: "date",
|
|
8614
9220
|
variant: "secondary"
|
|
8615
9221
|
})] })
|
|
8616
9222
|
}), operator === "between" && /* @__PURE__ */ jsx(form.AppField, {
|
|
8617
9223
|
name: "filterValueTo",
|
|
8618
|
-
children: (valueField) => /* @__PURE__ */ jsxs(Field, { children: [/* @__PURE__ */ jsx(valueField.
|
|
9224
|
+
children: (valueField) => /* @__PURE__ */ jsxs(Field, { children: [/* @__PURE__ */ jsx(valueField.Errors, {}), /* @__PURE__ */ jsx(valueField.Input, {
|
|
8619
9225
|
type: "date",
|
|
8620
9226
|
variant: "secondary"
|
|
8621
9227
|
})] })
|
|
8622
9228
|
})] })] }, operator)) })] })
|
|
8623
9229
|
}) }) }) }) }),
|
|
8624
|
-
/* @__PURE__ */ jsxs(form.
|
|
9230
|
+
/* @__PURE__ */ jsxs(form.Footer, { children: [/* @__PURE__ */ jsx(form.Reset, { children: buttonLabels.reset }), /* @__PURE__ */ jsx(form.Submit, { children: buttonLabels.apply })] })
|
|
8625
9231
|
] })
|
|
8626
9232
|
});
|
|
8627
9233
|
}
|
|
@@ -8699,30 +9305,30 @@ function TableNumberFilterForm({ column, className, children, ref, ...props }) {
|
|
|
8699
9305
|
...props,
|
|
8700
9306
|
children: /* @__PURE__ */ jsxs(form.AppForm, { children: [
|
|
8701
9307
|
children,
|
|
8702
|
-
/* @__PURE__ */ jsx(form.
|
|
8703
|
-
/* @__PURE__ */ jsx(form.
|
|
9308
|
+
/* @__PURE__ */ jsx(form.Errors, {}),
|
|
9309
|
+
/* @__PURE__ */ jsx(form.Set, { children: /* @__PURE__ */ jsx(form.SetContent, { children: /* @__PURE__ */ jsx(form.AppField, {
|
|
8704
9310
|
name: "filterOperator",
|
|
8705
|
-
children: (field) => /* @__PURE__ */ jsxs(Field, { children: [/* @__PURE__ */ jsx(field.
|
|
9311
|
+
children: (field) => /* @__PURE__ */ jsxs(Field, { children: [/* @__PURE__ */ jsx(field.Errors, {}), /* @__PURE__ */ jsx(field.RadioGroup, { children: numberFilterOperators.map((operator) => /* @__PURE__ */ jsxs(field.Set, { children: [/* @__PURE__ */ jsx(Radio, {
|
|
8706
9312
|
value: operator,
|
|
8707
9313
|
variant: "inSurface",
|
|
8708
9314
|
children: filterOperatorLabels?.[operator] ?? defaultFilterOperatorLabels[operator]
|
|
8709
9315
|
}), field.state.value === operator && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(form.AppField, {
|
|
8710
9316
|
name: "filterValueFrom",
|
|
8711
|
-
children: (valueField) => /* @__PURE__ */ jsxs(Field, { children: [/* @__PURE__ */ jsx(valueField.
|
|
9317
|
+
children: (valueField) => /* @__PURE__ */ jsxs(Field, { children: [/* @__PURE__ */ jsx(valueField.Errors, {}), /* @__PURE__ */ jsx(valueField.Input, {
|
|
8712
9318
|
"aria-label": `${column.id} filter value`,
|
|
8713
9319
|
type: "number",
|
|
8714
9320
|
variant: "secondary"
|
|
8715
9321
|
})] })
|
|
8716
9322
|
}), operator === "between" && /* @__PURE__ */ jsx(form.AppField, {
|
|
8717
9323
|
name: "filterValueTo",
|
|
8718
|
-
children: (valueField) => /* @__PURE__ */ jsxs(Field, { children: [/* @__PURE__ */ jsx(valueField.
|
|
9324
|
+
children: (valueField) => /* @__PURE__ */ jsxs(Field, { children: [/* @__PURE__ */ jsx(valueField.Errors, {}), /* @__PURE__ */ jsx(valueField.Input, {
|
|
8719
9325
|
"aria-label": `${column.id} maximum filter value`,
|
|
8720
9326
|
type: "number",
|
|
8721
9327
|
variant: "secondary"
|
|
8722
9328
|
})] })
|
|
8723
9329
|
})] })] }, operator)) })] })
|
|
8724
9330
|
}) }) }),
|
|
8725
|
-
/* @__PURE__ */ jsxs(form.
|
|
9331
|
+
/* @__PURE__ */ jsxs(form.Footer, { children: [/* @__PURE__ */ jsx(form.Reset, { children: buttonLabels.reset }), /* @__PURE__ */ jsx(form.Submit, { children: buttonLabels.apply })] })
|
|
8726
9332
|
] })
|
|
8727
9333
|
});
|
|
8728
9334
|
}
|
|
@@ -8834,7 +9440,6 @@ function TableSelectFilterChip({ column, className, children, ref, ...props }) {
|
|
|
8834
9440
|
ref,
|
|
8835
9441
|
...props,
|
|
8836
9442
|
children: /* @__PURE__ */ jsxs(Button, {
|
|
8837
|
-
tone: "neutral",
|
|
8838
9443
|
size: "extraSmall",
|
|
8839
9444
|
variant: "soft",
|
|
8840
9445
|
children: [
|
|
@@ -8886,22 +9491,22 @@ function TableStringFilterForm({ column, className, children, ref, ...props }) {
|
|
|
8886
9491
|
...props,
|
|
8887
9492
|
children: /* @__PURE__ */ jsxs(form.AppForm, { children: [
|
|
8888
9493
|
children,
|
|
8889
|
-
/* @__PURE__ */ jsx(form.
|
|
8890
|
-
/* @__PURE__ */ jsx(form.
|
|
9494
|
+
/* @__PURE__ */ jsx(form.Errors, {}),
|
|
9495
|
+
/* @__PURE__ */ jsx(form.Set, { children: /* @__PURE__ */ jsx(form.SetContent, { children: /* @__PURE__ */ jsx(form.AppField, {
|
|
8891
9496
|
name: "filterOperator",
|
|
8892
|
-
children: (field) => /* @__PURE__ */ jsxs(Field, { children: [/* @__PURE__ */ jsx(field.
|
|
9497
|
+
children: (field) => /* @__PURE__ */ jsxs(Field, { children: [/* @__PURE__ */ jsx(field.Errors, {}), /* @__PURE__ */ jsx(field.RadioGroup, { children: stringFilterOperators.map((operator) => /* @__PURE__ */ jsxs(field.Set, { children: [/* @__PURE__ */ jsx(Radio, {
|
|
8893
9498
|
value: operator,
|
|
8894
9499
|
variant: "inSurface",
|
|
8895
9500
|
children: filterOperatorLabels?.[operator] ?? defaultFilterOperatorLabels[operator]
|
|
8896
9501
|
}), field.state.value === operator && /* @__PURE__ */ jsx(form.AppField, {
|
|
8897
9502
|
name: "filterValue",
|
|
8898
|
-
children: (valueField) => /* @__PURE__ */ jsxs(Field, { children: [/* @__PURE__ */ jsx(valueField.
|
|
9503
|
+
children: (valueField) => /* @__PURE__ */ jsxs(Field, { children: [/* @__PURE__ */ jsx(valueField.Errors, {}), /* @__PURE__ */ jsx(valueField.Input, {
|
|
8899
9504
|
"aria-label": `${column.id} filter value`,
|
|
8900
9505
|
variant: "secondary"
|
|
8901
9506
|
})] })
|
|
8902
9507
|
})] }, operator)) })] })
|
|
8903
9508
|
}) }) }),
|
|
8904
|
-
/* @__PURE__ */ jsxs(form.
|
|
9509
|
+
/* @__PURE__ */ jsxs(form.Footer, { children: [/* @__PURE__ */ jsx(form.Reset, { children: buttonLabels.reset }), /* @__PURE__ */ jsx(form.Submit, { children: buttonLabels.apply })] })
|
|
8905
9510
|
] })
|
|
8906
9511
|
});
|
|
8907
9512
|
}
|
|
@@ -8972,7 +9577,7 @@ function TableFilterMenu({ className, ref, ...props }) {
|
|
|
8972
9577
|
children: table.getAllColumns().filter((column) => column.getCanFilter()).map((column) => {
|
|
8973
9578
|
const { filterVariant } = column.columnDef.meta ?? {};
|
|
8974
9579
|
return /* @__PURE__ */ jsxs(Popover, { children: [/* @__PURE__ */ jsx(PopoverTrigger, {
|
|
8975
|
-
nativeButton:
|
|
9580
|
+
nativeButton: true,
|
|
8976
9581
|
children: /* @__PURE__ */ jsx(MenuItem, {
|
|
8977
9582
|
closeOnClick: false,
|
|
8978
9583
|
children: getColumnHeaderLabel(column)
|
|
@@ -9009,8 +9614,9 @@ function TableFirstPage({ className, children, ref, ...props }) {
|
|
|
9009
9614
|
disabled: !table.getCanPreviousPage(),
|
|
9010
9615
|
onClick: handleClick,
|
|
9011
9616
|
ref,
|
|
9012
|
-
variant: "
|
|
9617
|
+
variant: "outline",
|
|
9013
9618
|
tone: "neutral",
|
|
9619
|
+
size: "iconMedium",
|
|
9014
9620
|
...props,
|
|
9015
9621
|
children: [children, /* @__PURE__ */ jsx(CaretLineLeftIcon, { weight: "bold" })]
|
|
9016
9622
|
});
|
|
@@ -9020,13 +9626,14 @@ function TableFirstPage({ className, children, ref, ...props }) {
|
|
|
9020
9626
|
function TableFooter({ className, children, ref, ...props }) {
|
|
9021
9627
|
const table = useTableContext$2();
|
|
9022
9628
|
return /* @__PURE__ */ jsxs("tfoot", {
|
|
9023
|
-
className: cn("", className),
|
|
9629
|
+
className: cn("border-t border-border bg-neutral-container-low", className),
|
|
9024
9630
|
ref,
|
|
9025
9631
|
...props,
|
|
9026
9632
|
children: [children, table.getFooterGroups().map((footerGroup) => /* @__PURE__ */ jsx("tr", { children: footerGroup.headers.map((header) => /* @__PURE__ */ jsx(table.AppFooter, {
|
|
9027
9633
|
header,
|
|
9028
9634
|
children: (footer) => /* @__PURE__ */ jsx("td", {
|
|
9029
9635
|
style: { width: footer.getSize() },
|
|
9636
|
+
className: "p-xs",
|
|
9030
9637
|
colSpan: footer.colSpan,
|
|
9031
9638
|
children: /* @__PURE__ */ jsx(table.FlexRender, { footer })
|
|
9032
9639
|
})
|
|
@@ -9042,7 +9649,7 @@ function TableHeader({ className, children, ref, ...props }) {
|
|
|
9042
9649
|
children: (state) => {
|
|
9043
9650
|
if (state.viewMode === "grid") return;
|
|
9044
9651
|
return /* @__PURE__ */ jsxs("thead", {
|
|
9045
|
-
className: cn("bg-neutral-container"),
|
|
9652
|
+
className: cn("border-border bg-neutral-container-low group-data-[variant=outline]/table:border-b", className),
|
|
9046
9653
|
ref,
|
|
9047
9654
|
...props,
|
|
9048
9655
|
children: [children, table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx("tr", { children: headerGroup.headers.map((header) => /* @__PURE__ */ jsx(table.AppHeader, {
|
|
@@ -9052,11 +9659,11 @@ function TableHeader({ className, children, ref, ...props }) {
|
|
|
9052
9659
|
const sorting = renderHeader.column.getIsSorted();
|
|
9053
9660
|
return /* @__PURE__ */ jsx("th", {
|
|
9054
9661
|
style: { width: renderHeader.getSize() },
|
|
9055
|
-
className: cn("container p-xs text-left style-text-default-0 text-neutral-on-container-muted transition-colors first:rounded-l-xl last:rounded-r-xl", renderHeader.column.getCanSort() && "hover:cursor-pointer hover:bg-neutral-container
|
|
9662
|
+
className: cn("container p-xs text-left style-text-default-0 text-neutral-on-container-muted transition-colors group-data-[variant=ghost]/table:first:rounded-l-xl group-data-[variant=ghost]/table:last:rounded-r-xl", renderHeader.column.getCanSort() && "hover:cursor-pointer hover:bg-neutral-container hover:*:text-neutral-on-container", renderHeader.isPlaceholder && "cursor-default", renderHeader.column.getIsSorted() && "text-brand-on-container!", className),
|
|
9056
9663
|
colSpan: renderHeader.colSpan,
|
|
9057
9664
|
onClick: renderHeader.column.getToggleSortingHandler(),
|
|
9058
9665
|
children: !renderHeader.isPlaceholder && /* @__PURE__ */ jsxs("div", {
|
|
9059
|
-
className: cn("flex items-center
|
|
9666
|
+
className: cn("flex items-center gap-2xs whitespace-nowrap has-[[role=checkbox]]:justify-center [&_svg]:size-sm", renderHeader.column.getCanSort() && "select-none hover:cursor-pointer"),
|
|
9060
9667
|
children: [
|
|
9061
9668
|
/* @__PURE__ */ jsx("div", {
|
|
9062
9669
|
className: "flex items-center gap-2xs",
|
|
@@ -9099,22 +9706,37 @@ function TableLastPage({ className, children, ref, ...props }) {
|
|
|
9099
9706
|
disabled: !table.getCanNextPage(),
|
|
9100
9707
|
onClick: handleClick,
|
|
9101
9708
|
ref,
|
|
9102
|
-
variant: "
|
|
9709
|
+
variant: "outline",
|
|
9103
9710
|
tone: "neutral",
|
|
9711
|
+
size: "iconMedium",
|
|
9104
9712
|
...props,
|
|
9105
9713
|
children: [children, /* @__PURE__ */ jsx(CaretLineRightIcon, { weight: "bold" })]
|
|
9106
9714
|
});
|
|
9107
9715
|
}
|
|
9108
9716
|
//#endregion
|
|
9109
|
-
//#region src/components/table/table-
|
|
9110
|
-
function
|
|
9717
|
+
//#region src/components/table/table-layout.tsx
|
|
9718
|
+
function TableLayout({ className, ref, ...props }) {
|
|
9111
9719
|
return /* @__PURE__ */ jsx("div", {
|
|
9112
|
-
|
|
9720
|
+
"data-slot": "table-layout",
|
|
9721
|
+
className: cn("flex min-w-0 flex-col gap-md", className),
|
|
9113
9722
|
ref,
|
|
9114
9723
|
...props
|
|
9115
9724
|
});
|
|
9116
9725
|
}
|
|
9117
9726
|
//#endregion
|
|
9727
|
+
//#region src/components/table/table-link-cell.tsx
|
|
9728
|
+
function TableLinkCell({ className, children, ref, ...props }) {
|
|
9729
|
+
const value = useCellContext$2().getValue();
|
|
9730
|
+
return /* @__PURE__ */ jsx(Button, {
|
|
9731
|
+
variant: "link",
|
|
9732
|
+
type: "button",
|
|
9733
|
+
className: cn("", className),
|
|
9734
|
+
ref,
|
|
9735
|
+
...props,
|
|
9736
|
+
children: children ?? value
|
|
9737
|
+
});
|
|
9738
|
+
}
|
|
9739
|
+
//#endregion
|
|
9118
9740
|
//#region src/components/table/table-next-page.tsx
|
|
9119
9741
|
function TableNextPage({ className, children, ref, ...props }) {
|
|
9120
9742
|
const table = useTableContext$2(), handleClick = () => {
|
|
@@ -9126,7 +9748,8 @@ function TableNextPage({ className, children, ref, ...props }) {
|
|
|
9126
9748
|
disabled: !table.getCanNextPage(),
|
|
9127
9749
|
onClick: handleClick,
|
|
9128
9750
|
ref,
|
|
9129
|
-
|
|
9751
|
+
size: "iconMedium",
|
|
9752
|
+
variant: "outline",
|
|
9130
9753
|
tone: "neutral",
|
|
9131
9754
|
...props,
|
|
9132
9755
|
children: [children, /* @__PURE__ */ jsx(CaretRightIcon, { weight: "bold" })]
|
|
@@ -9175,9 +9798,13 @@ function getTrailingPageIndexes(minimumPages, maximumPages, totalPages) {
|
|
|
9175
9798
|
for (let pageIndex = totalPages - maximumPages; pageIndex < totalPages; pageIndex += PAGE_INDEX_INCREMENT) if (pageIndex >= minimumPages) pageIndexes.push(pageIndex);
|
|
9176
9799
|
return pageIndexes;
|
|
9177
9800
|
}
|
|
9801
|
+
function getPageButtonTone(pageIndex, selectedPageIndex) {
|
|
9802
|
+
if (pageIndex === selectedPageIndex) return "brand";
|
|
9803
|
+
return "neutral";
|
|
9804
|
+
}
|
|
9178
9805
|
function getPageButtonVariant(pageIndex, selectedPageIndex) {
|
|
9179
9806
|
if (pageIndex === selectedPageIndex) return "fill";
|
|
9180
|
-
return "
|
|
9807
|
+
return "outline";
|
|
9181
9808
|
}
|
|
9182
9809
|
function TablePaging({ min = DEFAULT_VISIBLE_START_PAGES, max = DEFAULT_VISIBLE_END_PAGES, className, children, ref, ...props }) {
|
|
9183
9810
|
const table = useTableContext$2(), handleClick = (pageIndex) => {
|
|
@@ -9188,14 +9815,13 @@ function TablePaging({ min = DEFAULT_VISIBLE_START_PAGES, max = DEFAULT_VISIBLE_
|
|
|
9188
9815
|
children: (pagination) => {
|
|
9189
9816
|
const totalPages = table.getPageCount(), leadingPageIndexes = getLeadingPageIndexes(min, totalPages), overflowPageIndexes = getOverflowPageIndexes(min, max, totalPages), trailingPageIndexes = getTrailingPageIndexes(min, max, totalPages);
|
|
9190
9817
|
return /* @__PURE__ */ jsxs("div", {
|
|
9191
|
-
className: cn("flex items-center gap-
|
|
9818
|
+
className: cn("flex items-center gap-2xs", className),
|
|
9192
9819
|
ref,
|
|
9193
9820
|
...props,
|
|
9194
9821
|
children: [
|
|
9195
9822
|
children,
|
|
9196
9823
|
leadingPageIndexes.map((pageIndex) => /* @__PURE__ */ jsx(Button, {
|
|
9197
|
-
tone:
|
|
9198
|
-
size: "iconMedium",
|
|
9824
|
+
tone: getPageButtonTone(pageIndex, pagination.pageIndex),
|
|
9199
9825
|
variant: getPageButtonVariant(pageIndex, pagination.pageIndex),
|
|
9200
9826
|
className: "shrink-0",
|
|
9201
9827
|
onClick: () => handleClick(pageIndex),
|
|
@@ -9205,7 +9831,7 @@ function TablePaging({ min = DEFAULT_VISIBLE_START_PAGES, max = DEFAULT_VISIBLE_
|
|
|
9205
9831
|
"aria-label": "Show more pages",
|
|
9206
9832
|
tone: "neutral",
|
|
9207
9833
|
size: "iconMedium",
|
|
9208
|
-
variant: "
|
|
9834
|
+
variant: "outline",
|
|
9209
9835
|
className: "shrink-0",
|
|
9210
9836
|
children: /* @__PURE__ */ jsx(DotsThreeIcon, { weight: "bold" })
|
|
9211
9837
|
}) }), /* @__PURE__ */ jsx(MenuPopup, {
|
|
@@ -9223,8 +9849,7 @@ function TablePaging({ min = DEFAULT_VISIBLE_START_PAGES, max = DEFAULT_VISIBLE_
|
|
|
9223
9849
|
})
|
|
9224
9850
|
})] }),
|
|
9225
9851
|
trailingPageIndexes.map((pageIndex) => /* @__PURE__ */ jsx(Button, {
|
|
9226
|
-
tone:
|
|
9227
|
-
size: "iconMedium",
|
|
9852
|
+
tone: getPageButtonTone(pageIndex, pagination.pageIndex),
|
|
9228
9853
|
variant: getPageButtonVariant(pageIndex, pagination.pageIndex),
|
|
9229
9854
|
className: "shrink-0",
|
|
9230
9855
|
onClick: () => handleClick(pageIndex),
|
|
@@ -9236,6 +9861,19 @@ function TablePaging({ min = DEFAULT_VISIBLE_START_PAGES, max = DEFAULT_VISIBLE_
|
|
|
9236
9861
|
});
|
|
9237
9862
|
}
|
|
9238
9863
|
//#endregion
|
|
9864
|
+
//#region src/components/table/table-percent-cell.tsx
|
|
9865
|
+
function TablePercentCell({ locale, options, children, ...props }) {
|
|
9866
|
+
const value = useCellContext$2().getValue();
|
|
9867
|
+
if (value === void 0 || value === null) return;
|
|
9868
|
+
return /* @__PURE__ */ jsxs("span", {
|
|
9869
|
+
...props,
|
|
9870
|
+
children: [children, new Intl.NumberFormat(locale, {
|
|
9871
|
+
...options,
|
|
9872
|
+
style: "percent"
|
|
9873
|
+
}).format(value)]
|
|
9874
|
+
});
|
|
9875
|
+
}
|
|
9876
|
+
//#endregion
|
|
9239
9877
|
//#region src/components/table/table-previous-page.tsx
|
|
9240
9878
|
function TablePreviousPage({ className, children, ref, ...props }) {
|
|
9241
9879
|
const table = useTableContext$2(), handleClick = () => {
|
|
@@ -9247,13 +9885,88 @@ function TablePreviousPage({ className, children, ref, ...props }) {
|
|
|
9247
9885
|
disabled: !table.getCanPreviousPage(),
|
|
9248
9886
|
onClick: handleClick,
|
|
9249
9887
|
ref,
|
|
9250
|
-
variant: "
|
|
9888
|
+
variant: "outline",
|
|
9251
9889
|
tone: "neutral",
|
|
9890
|
+
size: "iconMedium",
|
|
9252
9891
|
...props,
|
|
9253
9892
|
children: [children, /* @__PURE__ */ jsx(CaretLeftIcon, { weight: "bold" })]
|
|
9254
9893
|
});
|
|
9255
9894
|
}
|
|
9256
9895
|
//#endregion
|
|
9896
|
+
//#region src/components/table/table-progress-cell.tsx
|
|
9897
|
+
function TableProgressCell({ showValue = true, children, ...props }) {
|
|
9898
|
+
const value = useCellContext$2().getValue();
|
|
9899
|
+
if (value === void 0 || value === null) return;
|
|
9900
|
+
return /* @__PURE__ */ jsxs(Meter, {
|
|
9901
|
+
orientation: "horizontal",
|
|
9902
|
+
"aria-label": "Progress",
|
|
9903
|
+
...props,
|
|
9904
|
+
value,
|
|
9905
|
+
children: [
|
|
9906
|
+
/* @__PURE__ */ jsx(Meter.Track, { children: /* @__PURE__ */ jsx(Meter.Indicator, {}) }),
|
|
9907
|
+
showValue && /* @__PURE__ */ jsx(Meter.Value, {}),
|
|
9908
|
+
children
|
|
9909
|
+
]
|
|
9910
|
+
});
|
|
9911
|
+
}
|
|
9912
|
+
//#endregion
|
|
9913
|
+
//#region src/components/table/table-relative-time-cell.tsx
|
|
9914
|
+
const MILLISECONDS_PER_SECOND = 1e3;
|
|
9915
|
+
const ZERO = 0;
|
|
9916
|
+
const SECONDS_PER_SECOND = 1;
|
|
9917
|
+
const RELATIVE_TIME_UNITS = [
|
|
9918
|
+
["year", 31536e3],
|
|
9919
|
+
["month", 2592e3],
|
|
9920
|
+
["week", 604800],
|
|
9921
|
+
["day", 86400],
|
|
9922
|
+
["hour", 3600],
|
|
9923
|
+
["minute", 60],
|
|
9924
|
+
["second", SECONDS_PER_SECOND]
|
|
9925
|
+
];
|
|
9926
|
+
function formatRelativeTime(date, now, { locale, options }) {
|
|
9927
|
+
const seconds = (date.getTime() - now.getTime()) / MILLISECONDS_PER_SECOND, [unit, divisor] = RELATIVE_TIME_UNITS.find(([, duration]) => Math.abs(seconds) >= duration) ?? ["second", SECONDS_PER_SECOND], amount = Math.round(seconds / divisor) || ZERO;
|
|
9928
|
+
return new Intl.RelativeTimeFormat(locale, {
|
|
9929
|
+
numeric: "auto",
|
|
9930
|
+
...options
|
|
9931
|
+
}).format(amount, unit);
|
|
9932
|
+
}
|
|
9933
|
+
function TableRelativeTimeCell({ locale, options, now, children, ...props }) {
|
|
9934
|
+
const date = useCellContext$2().getValue(), [mountedAt] = useState(() => /* @__PURE__ */ new Date()), referenceDate = now ?? mountedAt;
|
|
9935
|
+
if (!date) return;
|
|
9936
|
+
if (Number.isNaN(date.getTime())) return "Invalid date";
|
|
9937
|
+
if (Number.isNaN(referenceDate.getTime())) throw new RangeError("TableRelativeTimeCell requires a valid now date");
|
|
9938
|
+
return /* @__PURE__ */ jsxs("time", {
|
|
9939
|
+
dateTime: date.toISOString(),
|
|
9940
|
+
title: date.toLocaleString(locale),
|
|
9941
|
+
...props,
|
|
9942
|
+
children: [children, formatRelativeTime(date, referenceDate, {
|
|
9943
|
+
locale,
|
|
9944
|
+
options
|
|
9945
|
+
})]
|
|
9946
|
+
});
|
|
9947
|
+
}
|
|
9948
|
+
//#endregion
|
|
9949
|
+
//#region src/components/table/table-results.tsx
|
|
9950
|
+
const EMPTY_ROW_COUNT = 0;
|
|
9951
|
+
const PAGE_NUMBER_OFFSET = 1;
|
|
9952
|
+
function getPageStart(totalRows, pageIndex, pageSize) {
|
|
9953
|
+
if (totalRows === EMPTY_ROW_COUNT) return EMPTY_ROW_COUNT;
|
|
9954
|
+
return pageIndex * pageSize + PAGE_NUMBER_OFFSET;
|
|
9955
|
+
}
|
|
9956
|
+
function getPageEnd(start, pageSize, totalRows) {
|
|
9957
|
+
if (totalRows === EMPTY_ROW_COUNT) return EMPTY_ROW_COUNT;
|
|
9958
|
+
return Math.min(start + pageSize - PAGE_NUMBER_OFFSET, totalRows);
|
|
9959
|
+
}
|
|
9960
|
+
function TableResults({ children, className, ref, ...props }) {
|
|
9961
|
+
const table = useTableContext$2(), { pageIndex } = table.state.pagination, { pageSize } = table.state.pagination, totalRows = table.getFilteredRowModel().rows.length, start = getPageStart(totalRows, pageIndex, pageSize), end = getPageEnd(start, pageSize, totalRows);
|
|
9962
|
+
return /* @__PURE__ */ jsx("div", {
|
|
9963
|
+
className: cn("flex items-center gap-2xs style-text-default--1 text-on-surface-variant", className),
|
|
9964
|
+
ref,
|
|
9965
|
+
...props,
|
|
9966
|
+
children: children(start, end, totalRows)
|
|
9967
|
+
});
|
|
9968
|
+
}
|
|
9969
|
+
//#endregion
|
|
9257
9970
|
//#region src/components/table/table-search.tsx
|
|
9258
9971
|
function TableSearch({ className, ref, ...props }) {
|
|
9259
9972
|
const table = useTableContext$2(), handleChange = (event) => {
|
|
@@ -9261,33 +9974,17 @@ function TableSearch({ className, ref, ...props }) {
|
|
|
9261
9974
|
};
|
|
9262
9975
|
return /* @__PURE__ */ jsx(table.Subscribe, {
|
|
9263
9976
|
selector: (state) => state.globalFilter,
|
|
9264
|
-
children: (globalFilter) => /* @__PURE__ */ jsxs(InputGroup, {
|
|
9265
|
-
|
|
9266
|
-
|
|
9267
|
-
|
|
9268
|
-
value: globalFilter ?? "",
|
|
9269
|
-
...props
|
|
9270
|
-
})] })
|
|
9271
|
-
});
|
|
9272
|
-
}
|
|
9273
|
-
//#endregion
|
|
9274
|
-
//#region src/components/table/table-select-header.tsx
|
|
9275
|
-
function TableSelectHeader({ className, ref, ...props }) {
|
|
9276
|
-
const table = useTableContext$2();
|
|
9277
|
-
return /* @__PURE__ */ jsx(table.Subscribe, {
|
|
9278
|
-
selector: (state) => state.rowSelection,
|
|
9279
|
-
children: () => {
|
|
9280
|
-
const allRowsSelected = table.getIsAllRowsSelected();
|
|
9281
|
-
return /* @__PURE__ */ jsx(Checkbox, {
|
|
9282
|
-
"aria-label": "Select all rows",
|
|
9283
|
-
checked: allRowsSelected,
|
|
9284
|
-
indeterminate: !allRowsSelected && table.getIsSomeRowsSelected(),
|
|
9285
|
-
onCheckedChange: (checked) => table.toggleAllRowsSelected(checked),
|
|
9977
|
+
children: (globalFilter) => /* @__PURE__ */ jsxs(InputGroup, {
|
|
9978
|
+
variant: props.variant ?? "outline",
|
|
9979
|
+
className: "flex-1",
|
|
9980
|
+
children: [/* @__PURE__ */ jsx(InputGroupAddon, { children: /* @__PURE__ */ jsx(MagnifyingGlassIcon, { weight: "bold" }) }), /* @__PURE__ */ jsx(InputGroupInput, {
|
|
9286
9981
|
className: cn("", className),
|
|
9982
|
+
onChange: handleChange,
|
|
9287
9983
|
ref,
|
|
9984
|
+
value: globalFilter ?? "",
|
|
9288
9985
|
...props
|
|
9289
|
-
})
|
|
9290
|
-
}
|
|
9986
|
+
})]
|
|
9987
|
+
})
|
|
9291
9988
|
});
|
|
9292
9989
|
}
|
|
9293
9990
|
//#endregion
|
|
@@ -9324,27 +10021,33 @@ function TableSortMenu({ className, ref, ...props }) {
|
|
|
9324
10021
|
//#endregion
|
|
9325
10022
|
//#region src/components/table/table-sort-chip.tsx
|
|
9326
10023
|
function TableSortChip({ column, className, children, ref, ...props }) {
|
|
9327
|
-
const table = useTableContext$2(),
|
|
9328
|
-
|
|
9329
|
-
|
|
9330
|
-
|
|
9331
|
-
|
|
9332
|
-
|
|
9333
|
-
|
|
9334
|
-
|
|
9335
|
-
|
|
9336
|
-
|
|
9337
|
-
|
|
9338
|
-
|
|
9339
|
-
|
|
9340
|
-
|
|
9341
|
-
|
|
9342
|
-
|
|
9343
|
-
|
|
9344
|
-
|
|
9345
|
-
|
|
9346
|
-
|
|
9347
|
-
|
|
10024
|
+
const table = useTableContext$2(), buttonLabels = table.options.meta?.translations?.buttonLabels ?? {}, ascendingLabel = buttonLabels.ascending ?? "Ascending", descendingLabel = buttonLabels.descending ?? "Descending";
|
|
10025
|
+
return /* @__PURE__ */ jsx(table.Subscribe, {
|
|
10026
|
+
selector: (state) => state.sorting,
|
|
10027
|
+
children: () => {
|
|
10028
|
+
const columnSort = column.getIsSorted();
|
|
10029
|
+
console.log(columnSort);
|
|
10030
|
+
if (!columnSort) return;
|
|
10031
|
+
return /* @__PURE__ */ jsx(TableSortMenu, {
|
|
10032
|
+
className: cn("", className),
|
|
10033
|
+
ref,
|
|
10034
|
+
...props,
|
|
10035
|
+
children: /* @__PURE__ */ jsxs(Button, {
|
|
10036
|
+
size: "extraSmall",
|
|
10037
|
+
variant: "soft",
|
|
10038
|
+
children: [
|
|
10039
|
+
columnSort === "asc" && /* @__PURE__ */ jsx(SortDescendingIcon, {}),
|
|
10040
|
+
columnSort === "desc" && /* @__PURE__ */ jsx(SortAscendingIcon, {}),
|
|
10041
|
+
/* @__PURE__ */ jsx("span", { children: getColumnHeaderLabel(column) }),
|
|
10042
|
+
/* @__PURE__ */ jsxs("span", {
|
|
10043
|
+
className: "font-light lowercase",
|
|
10044
|
+
children: [columnSort === "asc" && ascendingLabel, columnSort === "desc" && descendingLabel]
|
|
10045
|
+
}),
|
|
10046
|
+
children
|
|
10047
|
+
]
|
|
10048
|
+
})
|
|
10049
|
+
});
|
|
10050
|
+
}
|
|
9348
10051
|
});
|
|
9349
10052
|
}
|
|
9350
10053
|
//#endregion
|
|
@@ -9366,6 +10069,21 @@ function TableSortList({ className, children, ref, ...props }) {
|
|
|
9366
10069
|
});
|
|
9367
10070
|
}
|
|
9368
10071
|
//#endregion
|
|
10072
|
+
//#region src/components/table/table-tags-cell.tsx
|
|
10073
|
+
function TableTagsCell({ badgeProps, className, children, ...props }) {
|
|
10074
|
+
const value = useCellContext$2().getValue();
|
|
10075
|
+
if (value === void 0 || value === null) return;
|
|
10076
|
+
return /* @__PURE__ */ jsxs("div", {
|
|
10077
|
+
className: cn("flex flex-wrap gap-3xs", className),
|
|
10078
|
+
...props,
|
|
10079
|
+
children: [children, value.map((tag, index) => /* @__PURE__ */ jsx(Badge, {
|
|
10080
|
+
variant: "soft",
|
|
10081
|
+
...badgeProps,
|
|
10082
|
+
children: tag
|
|
10083
|
+
}, `${index}-${tag}`))]
|
|
10084
|
+
});
|
|
10085
|
+
}
|
|
10086
|
+
//#endregion
|
|
9369
10087
|
//#region src/components/table/table-text-cell.tsx
|
|
9370
10088
|
function TableTextCell({ className, children, ref, ...props }) {
|
|
9371
10089
|
const cell = useCellContext$2();
|
|
@@ -9378,9 +10096,21 @@ function TableTextCell({ className, children, ref, ...props }) {
|
|
|
9378
10096
|
}
|
|
9379
10097
|
//#endregion
|
|
9380
10098
|
//#region src/components/table/table-toolbar.tsx
|
|
9381
|
-
function TableToolbar({
|
|
10099
|
+
function TableToolbar({ className, ref, ...props }) {
|
|
10100
|
+
return /* @__PURE__ */ jsx("div", {
|
|
10101
|
+
"data-slot": "table-toolbar",
|
|
10102
|
+
className: cn("flex w-full min-w-0 flex-wrap items-center gap-2xs", "[:where([data-slot=table-container][data-variant=outline]>&)]:px-md [:where([data-slot=table-container][data-variant=outline]>&:first-child)]:pt-md [:where([data-slot=table-container][data-variant=outline]>&:last-child)]:pb-md", className),
|
|
10103
|
+
ref,
|
|
10104
|
+
...props
|
|
10105
|
+
});
|
|
10106
|
+
}
|
|
10107
|
+
//#endregion
|
|
10108
|
+
//#region src/components/table/table-top-bar.tsx
|
|
10109
|
+
function TableTopBar({ sticky = false, className, ref, ...props }) {
|
|
9382
10110
|
return /* @__PURE__ */ jsx("div", {
|
|
9383
|
-
className: cn("flex
|
|
10111
|
+
className: cn("flex min-w-0 flex-col gap-md", "[:where([data-slot=table-container][data-variant=outline]>&)]:px-md [:where([data-slot=table-container][data-variant=outline]>&:first-child)]:pt-md [:where([data-slot=table-container][data-variant=outline]>&:last-child)]:pb-md", sticky && "sticky top-0 z-10", className),
|
|
10112
|
+
"data-table-top-bar": "",
|
|
10113
|
+
"data-slot": "table-top-bar",
|
|
9384
10114
|
ref,
|
|
9385
10115
|
...props
|
|
9386
10116
|
});
|
|
@@ -9401,15 +10131,17 @@ function TableViewModeToggle({ className, children, ref, ...props }) {
|
|
|
9401
10131
|
}
|
|
9402
10132
|
//#endregion
|
|
9403
10133
|
//#region src/components/table/table-viewport.tsx
|
|
9404
|
-
function TableViewport({ className, children, ref, ...props }) {
|
|
10134
|
+
function TableViewport({ grow, className, children, ref, ...props }) {
|
|
9405
10135
|
if (useTableContext$2().state.viewMode === "grid") return /* @__PURE__ */ jsx("div", {
|
|
10136
|
+
"data-slot": "table-viewport",
|
|
9406
10137
|
className: cn("size-full", className),
|
|
9407
10138
|
ref,
|
|
9408
10139
|
...props,
|
|
9409
10140
|
children
|
|
9410
10141
|
});
|
|
9411
10142
|
return /* @__PURE__ */ jsx("table", {
|
|
9412
|
-
|
|
10143
|
+
"data-slot": "table-viewport",
|
|
10144
|
+
className: cn(grow ? "size-full" : "h-auto w-full", "[[data-slot=table-container][data-variant=outline]>&:not(:first-child):not([data-slot=table-dataset-tab]+&)>thead]:border-t [[data-slot=table-container][data-variant=outline]>&:not(:first-child):not([data-slot=table-dataset-tab]+&)>thead]:border-border", className),
|
|
9413
10145
|
ref,
|
|
9414
10146
|
...props,
|
|
9415
10147
|
children
|
|
@@ -9419,12 +10151,20 @@ function TableViewport({ className, children, ref, ...props }) {
|
|
|
9419
10151
|
//#region src/components/table/table-context.tsx
|
|
9420
10152
|
const { createAppColumnHelper, useAppTable, useTableContext: useTableContext$1, useCellContext, useHeaderContext } = createTableHook({
|
|
9421
10153
|
cellComponents: {
|
|
9422
|
-
|
|
9423
|
-
|
|
9424
|
-
|
|
9425
|
-
|
|
9426
|
-
|
|
9427
|
-
|
|
10154
|
+
AvatarCell: TableAvatarCell,
|
|
10155
|
+
BadgeCell: TableBadgeCell,
|
|
10156
|
+
BooleanCell: TableBooleanCell,
|
|
10157
|
+
CheckboxCell: TableCheckboxCell,
|
|
10158
|
+
CurrencyCell: TableCurrencyCell,
|
|
10159
|
+
DateTimeCell: TableDateTimeCell,
|
|
10160
|
+
ImageCell: TableImageCell,
|
|
10161
|
+
LinkCell: TableLinkCell,
|
|
10162
|
+
NumberCell: TableNumberCell,
|
|
10163
|
+
PercentCell: TablePercentCell,
|
|
10164
|
+
ProgressCell: TableProgressCell,
|
|
10165
|
+
RelativeTimeCell: TableRelativeTimeCell,
|
|
10166
|
+
TagsCell: TableTagsCell,
|
|
10167
|
+
TextCell: TableTextCell
|
|
9428
10168
|
},
|
|
9429
10169
|
cellContext,
|
|
9430
10170
|
features,
|
|
@@ -9433,49 +10173,43 @@ const { createAppColumnHelper, useAppTable, useTableContext: useTableContext$1,
|
|
|
9433
10173
|
if (parent) return `${parent.id}.${index}`;
|
|
9434
10174
|
return String(index);
|
|
9435
10175
|
},
|
|
9436
|
-
headerComponents: {
|
|
10176
|
+
headerComponents: { TableCheckboxHeader },
|
|
9437
10177
|
headerContext,
|
|
9438
10178
|
tableComponents: {
|
|
9439
|
-
TableBody,
|
|
9440
|
-
|
|
9441
|
-
|
|
9442
|
-
|
|
9443
|
-
|
|
9444
|
-
|
|
9445
|
-
|
|
9446
|
-
|
|
9447
|
-
|
|
9448
|
-
|
|
9449
|
-
|
|
9450
|
-
|
|
9451
|
-
|
|
9452
|
-
|
|
9453
|
-
|
|
9454
|
-
|
|
9455
|
-
|
|
9456
|
-
|
|
9457
|
-
|
|
9458
|
-
|
|
10179
|
+
Body: TableBody,
|
|
10180
|
+
BottomBar: TableBottomBar,
|
|
10181
|
+
ColumnToggle: TableColumnToggle,
|
|
10182
|
+
Container: TableContainer,
|
|
10183
|
+
DatasetTab: TableDatasetTab,
|
|
10184
|
+
Empty: TableEmpty,
|
|
10185
|
+
EmptyContent: TableEmptyContent,
|
|
10186
|
+
EmptyDescription: TableEmptyDescription,
|
|
10187
|
+
EmptyFooter: TableEmptyFooter,
|
|
10188
|
+
EmptyHeader: TableEmptyHeader,
|
|
10189
|
+
EmptyTitle: TableEmptyTitle,
|
|
10190
|
+
FilterList: TableFilterList,
|
|
10191
|
+
FilterMenu: TableFilterMenu,
|
|
10192
|
+
FirstPage: TableFirstPage,
|
|
10193
|
+
Footer: TableFooter,
|
|
10194
|
+
Header: TableHeader,
|
|
10195
|
+
LastPage: TableLastPage,
|
|
10196
|
+
Layout: TableLayout,
|
|
10197
|
+
NextPage: TableNextPage,
|
|
10198
|
+
Pagination: TablePagination,
|
|
10199
|
+
Paging: TablePaging,
|
|
10200
|
+
PreviousPage: TablePreviousPage,
|
|
10201
|
+
Results: TableResults,
|
|
10202
|
+
Search: TableSearch,
|
|
10203
|
+
SortList: TableSortList,
|
|
10204
|
+
SortMenu: TableSortMenu,
|
|
10205
|
+
Toolbar: TableToolbar,
|
|
10206
|
+
TopBar: TableTopBar,
|
|
10207
|
+
ViewModeToggle: TableViewModeToggle,
|
|
10208
|
+
Viewport: TableViewport
|
|
9459
10209
|
},
|
|
9460
10210
|
tableContext
|
|
9461
10211
|
});
|
|
9462
10212
|
//#endregion
|
|
9463
|
-
//#region src/components/table/table-results.tsx
|
|
9464
|
-
const EMPTY_ROW_COUNT = 0;
|
|
9465
|
-
const PAGE_NUMBER_OFFSET = 1;
|
|
9466
|
-
function getPageStart(totalRows, pageIndex, pageSize) {
|
|
9467
|
-
if (totalRows === EMPTY_ROW_COUNT) return EMPTY_ROW_COUNT;
|
|
9468
|
-
return pageIndex * pageSize + PAGE_NUMBER_OFFSET;
|
|
9469
|
-
}
|
|
9470
|
-
function getPageEnd(start, pageSize, totalRows) {
|
|
9471
|
-
if (totalRows === EMPTY_ROW_COUNT) return EMPTY_ROW_COUNT;
|
|
9472
|
-
return Math.min(start + pageSize - PAGE_NUMBER_OFFSET, totalRows);
|
|
9473
|
-
}
|
|
9474
|
-
function TableResults({ children }) {
|
|
9475
|
-
const table = useTableContext$2(), { pageIndex } = table.state.pagination, { pageSize } = table.state.pagination, totalRows = table.getFilteredRowModel().rows.length, start = getPageStart(totalRows, pageIndex, pageSize);
|
|
9476
|
-
return children(start, getPageEnd(start, pageSize, totalRows), totalRows);
|
|
9477
|
-
}
|
|
9478
|
-
//#endregion
|
|
9479
10213
|
//#region src/components/toast/anchored-toast-item.tsx
|
|
9480
10214
|
function AnchoredToastItem({ className, ref, toast, ...props }) {
|
|
9481
10215
|
return /* @__PURE__ */ jsxs(Toast$1.Root, {
|
|
@@ -9581,7 +10315,7 @@ function StackToastItem({ className, ref, toast, ...props }) {
|
|
|
9581
10315
|
className: cn("flex aspect-square size-2xl items-center justify-center [&>svg]:size-lg [&>svg]:text-on-surface-inverse", getVariantBgColor(variant)),
|
|
9582
10316
|
children: getVariantIcon(variant, icon)
|
|
9583
10317
|
}), /* @__PURE__ */ jsxs(Toast$1.Content, {
|
|
9584
|
-
className: "flex items-center justify-center gap-
|
|
10318
|
+
className: "flex items-center justify-center gap-3xs overflow-hidden pl-2xs transition-opacity duration-250 data-behind:pointer-events-none data-behind:opacity-0 data-expanded:pointer-events-auto data-expanded:opacity-100",
|
|
9585
10319
|
children: [/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx(Toast$1.Title, { className: "style-text-strong--1" }), /* @__PURE__ */ jsx(Toast$1.Description, { className: "style-text-prose--1 whitespace-nowrap text-on-surface-variant" })] }), /* @__PURE__ */ jsxs("div", {
|
|
9586
10320
|
className: "ml-xl flex h-lg grow items-center justify-center gap-xs",
|
|
9587
10321
|
children: [
|
|
@@ -9732,6 +10466,6 @@ function ToggleGroup({ size = "medium", variant, className, ref, ...props }) {
|
|
|
9732
10466
|
});
|
|
9733
10467
|
}
|
|
9734
10468
|
//#endregion
|
|
9735
|
-
export { Accordion, AccordionHeader, AccordionIcon, AccordionItem, AccordionPanel, AccordionSubtitle, AccordionTitle, Alert, AlertAction, AlertDescription, AlertDialog, AlertDialogClose, AlertDialogConfirm, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogIcon, AlertDialogPopup, AlertDialogTitle, AlertDialogTrigger, AlertIcon, AlertTitle, AnchoredToastItem, AnchoredToasts, Autocomplete, AutocompleteCollection, AutocompleteContent, AutocompleteGridContent, AutocompleteGridItem, AutocompleteGroup, AutocompleteGroupLabel, AutocompleteInputGroup, AutocompleteInputGroupAddon, AutocompleteInputGroupInput, AutocompleteItem, AutocompleteRow, AutocompleteStatus, AutocompleteTrigger, Avatar, AvatarBadge, AvatarFallback, AvatarImage, Badge, BentoBox, BentoBoxAction, BentoBoxContent, BentoBoxDescription, BentoBoxFooter, BentoBoxHeader, BentoBoxTitle, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbSeparator, Button, ButtonGroup, Calendar, CalendarFooter, CalendarHeader, CalendarPanel, CalendarPicker, CalendarSummary, ChartContainer, ChartContainerContext, ChartLegend, ChartLegendContent, ChartLegendIcon, ChartLegendIndicator, ChartLegendLabel, ChartLinearGradient, ChartTooltip, ChartTooltipContent, ChartTooltipIcon, ChartTooltipIndicator, ChartTooltipLabel, ChartTooltipName, ChartTooltipPayload, ChartTooltipValue, Checkbox, CheckboxGroup, CheckboxIndicator, CodeBlock, CodeBlockActions, CodeBlockCopy, CodeBlockDownload, CodeBlockHeader, CodeBlockName, CodeBlockSelect, CodeBlockTabs, CodeBlockWindow, Collapsible, CollapsiblePanel, CollapsibleTrigger, ColorChannelSlider, ColorPicker, ColorPickerArea, ColorPickerGroup, ColorPickerHueSlider, ColorPickerInput, ColorPickerLabel, ColorPickerLightnessSlider, ColorPickerPaletteLimit, ColorPickerPaletteList, ColorPickerPaletteSwatch, ColorPickerRow, ColorPickerTransparencySlider, ColorPickerValueType, Combobox, ComboboxChip, ComboboxChips, ComboboxCollection, ComboboxEmpty, ComboboxGroup, ComboboxGroupLabel, ComboboxInput, ComboboxItem, ComboboxList, ComboboxPopup, ComboboxStatus, ComboboxTrigger, ComboboxValue, ComboboxVirtualizedList, ContextMenu, ContextMenuCheckboxItem, ContextMenuGroup, ContextMenuGroupLabel, ContextMenuItem, ContextMenuPopup, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSubmenu, ContextMenuSubmenuTrigger, ContextMenuTrigger, DEFAULT_THEME, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogHelper, DialogIcon, DialogPopup, DialogTitle, DialogTrigger, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerHeader, DrawerPopup, DrawerProvider, DrawerTitle, DrawerTrigger, Dropzone, DropzoneActions, DropzoneClear, DropzoneConfirm, DropzoneContainer, DropzoneError, DropzoneFilesList as DropzoneFileList, DropzoneFileSizeLimit, DropzoneFiles, DropzoneFilesHeader, DropzoneFilesTitle, DropzoneFormats, DropzoneHeading, DropzoneIcon, DropzoneInfo, DropzoneSubtitle, DropzoneTrigger, Field, FieldCheckbox, FieldDescription, FieldErrors, FieldInput, FieldInputGroup, FieldInputGroupInput, FieldLabel, FieldRadio, FieldRadioGroup, FieldRow, FieldSelect, FieldSet, FieldSlider, FieldSwitch, FieldTextArea, FieldToggle, Form, FormErrors, FormFooter, FormReset, FormSet, FormSetContent, FormSetHeading, FormSubmit, Input, InputGroup, InputGroupAddon, InputGroupInput, InputGroupSeparator, InputOTP, InputOTPSlot, InputOtpSeparator, Kbd, KbdGroup, Label, LayerTree, LayerTreeBody, LayerTreeExpandAll, LayerTreeFooter, LayerTreeIconCell, LayerTreeLockedAll, LayerTreeLockedCell, LayerTreeNodeIcon, LayerTreeRow, LayerTreeSearch, LayerTreeSort, LayerTreeTextCell, LayerTreeTriggerCell, LayerTreeVisibilityAll, LayerTreeVisibilityCell, Menu, MenuCheckboxItem, MenuGroup, MenuGroupLabel, MenuItem, MenuPopup, MenuRadioGroup, MenuRadioItem, MenuSeparator, MenuShortcut, MenuSubmenu, MenuSubmenuTrigger, MenuTrigger, Meter, MeterFooter, MeterHeader, MeterIndicator, MeterLabel, MeterSubtitle, MeterTrack, MeterValue, NavBar, NavBarItem, NavBarItemIcon, NavBarItemLabel, NavigationMenu, NavigationMenuContent, NavigationMenuIcon, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuPopup, NavigationMenuTrigger, NumberField, Popover, PopoverButton, PopoverContent, PopoverDescription, PopoverHeader, PopoverPanel, PopoverTitle, PopoverTrigger, PreviewCard, PreviewCardPopup, PreviewCardTrigger, Profile, ProfileAction, ProfileContent, ProfileName, ProfileSubname, Progress, ProgressBar, ProgressDescription, ProgressIndicator, ProgressLabel, ProgressTitle, RadarPing, Radio, RadioGroup, ResizeableHandle, ResizeablePanel, ResizeablePanelGroup, ScrollArea, Select, SelectDescription, SelectGroup, SelectGroupLabel, SelectIcon, SelectItem, SelectList, SelectPopup, SelectTitle, SelectTrigger, SelectValue, Separator, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarMenu, SidebarMenuBadge, SidebarMenuButton, SidebarMenuCollapsible, SidebarMenuCollapsiblePanel, SidebarMenuCollapsibleTrigger, SidebarMenuItem, SidebarProvider, SidebarToggle, Skeleton, Slider, SliderDescription, SliderGroup, SliderGroupSlider, SliderIcon, SliderInput, SliderLabel, SliderThumb, SliderValue, StackToastItem, StackToasts, Switch, THEME_STORAGE_KEY, TableBadgeCell, TableBody, TableColumnToggle, TableContainer, TableDateFilterChip, TableDateFilterForm, TableFilterList, TableFilterMenu, TableFirstPage, TableFooter, TableHeader, TableImageCell, TableLastPage,
|
|
10469
|
+
export { Accordion, AccordionHeader, AccordionIcon, AccordionItem, AccordionPanel, AccordionSubtitle, AccordionTitle, Alert, AlertAction, AlertDescription, AlertDialog, AlertDialogClose, AlertDialogConfirm, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogIcon, AlertDialogPopup, AlertDialogTitle, AlertDialogTrigger, AlertIcon, AlertTitle, AnchoredToastItem, AnchoredToasts, Autocomplete, AutocompleteCollection, AutocompleteContent, AutocompleteGridContent, AutocompleteGridItem, AutocompleteGroup, AutocompleteGroupLabel, AutocompleteInputGroup, AutocompleteInputGroupAddon, AutocompleteInputGroupInput, AutocompleteItem, AutocompleteRow, AutocompleteStatus, AutocompleteTrigger, Avatar, AvatarBadge, AvatarFallback, AvatarImage, Badge, BentoBox, BentoBoxAction, BentoBoxContent, BentoBoxDescription, BentoBoxFooter, BentoBoxHeader, BentoBoxTitle, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbSeparator, Button, ButtonGroup, Calendar, CalendarFooter, CalendarHeader, CalendarPanel, CalendarPicker, CalendarSummary, ChartContainer, ChartContainerContext, ChartLegend, ChartLegendContent, ChartLegendIcon, ChartLegendIndicator, ChartLegendLabel, ChartLinearGradient, ChartTooltip, ChartTooltipContent, ChartTooltipIcon, ChartTooltipIndicator, ChartTooltipLabel, ChartTooltipName, ChartTooltipPayload, ChartTooltipValue, Checkbox, CheckboxGroup, CheckboxIndicator, CodeBlock, CodeBlockActions, CodeBlockCopy, CodeBlockDownload, CodeBlockHeader, CodeBlockName, CodeBlockSelect, CodeBlockTabs, CodeBlockWindow, Collapsible, CollapsiblePanel, CollapsibleTrigger, ColorChannelSlider, ColorPicker, ColorPickerArea, ColorPickerGroup, ColorPickerHueSlider, ColorPickerInput, ColorPickerLabel, ColorPickerLightnessSlider, ColorPickerPaletteLimit, ColorPickerPaletteList, ColorPickerPaletteSwatch, ColorPickerRow, ColorPickerTransparencySlider, ColorPickerValueType, Combobox, ComboboxChip, ComboboxChips, ComboboxCollection, ComboboxEmpty, ComboboxGroup, ComboboxGroupLabel, ComboboxInput, ComboboxItem, ComboboxList, ComboboxPopup, ComboboxStatus, ComboboxTrigger, ComboboxValue, ComboboxVirtualizedList, ContextMenu, ContextMenuCheckboxItem, ContextMenuGroup, ContextMenuGroupLabel, ContextMenuItem, ContextMenuPopup, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSubmenu, ContextMenuSubmenuTrigger, ContextMenuTrigger, DEFAULT_THEME, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogHelper, DialogIcon, DialogPopup, DialogTitle, DialogTrigger, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerHeader, DrawerPopup, DrawerProvider, DrawerTitle, DrawerTrigger, Dropzone, DropzoneActions, DropzoneClear, DropzoneConfirm, DropzoneContainer, DropzoneError, DropzoneFilesList as DropzoneFileList, DropzoneFileSizeLimit, DropzoneFiles, DropzoneFilesHeader, DropzoneFilesTitle, DropzoneFormats, DropzoneHeading, DropzoneIcon, DropzoneInfo, DropzoneSubtitle, DropzoneTrigger, Field, FieldCheckbox, FieldDescription, FieldErrors, FieldInput, FieldInputGroup, FieldInputGroupInput, FieldLabel, FieldRadio, FieldRadioGroup, FieldRow, FieldSelect, FieldSet, FieldSlider, FieldSwitch, FieldTextArea, FieldToggle, Form, FormErrors, FormFooter, FormReset, FormSet, FormSetContent, FormSetHeading, FormSubmit, IconContainer, Input, InputGroup, InputGroupAddon, InputGroupInput, InputGroupSeparator, InputOTP, InputOTPSlot, InputOtpSeparator, Kbd, KbdGroup, Label, LayerTree, LayerTreeBody, LayerTreeExpandAll, LayerTreeFooter, LayerTreeIconCell, LayerTreeLockedAll, LayerTreeLockedCell, LayerTreeNodeIcon, LayerTreeRow, LayerTreeSearch, LayerTreeSort, LayerTreeTextCell, LayerTreeTriggerCell, LayerTreeVisibilityAll, LayerTreeVisibilityCell, Menu, MenuCheckboxItem, MenuGroup, MenuGroupLabel, MenuItem, MenuPopup, MenuRadioGroup, MenuRadioItem, MenuSeparator, MenuShortcut, MenuSubmenu, MenuSubmenuTrigger, MenuTrigger, Meter, MeterFooter, MeterHeader, MeterIndicator, MeterLabel, MeterSubtitle, MeterTrack, MeterValue, NavBar, NavBarItem, NavBarItemIcon, NavBarItemLabel, NavigationMenu, NavigationMenuContent, NavigationMenuIcon, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuPopup, NavigationMenuTrigger, NumberField, Popover, PopoverButton, PopoverContent, PopoverDescription, PopoverHeader, PopoverPanel, PopoverTitle, PopoverTrigger, PreviewCard, PreviewCardPopup, PreviewCardTrigger, Profile, ProfileAction, ProfileContent, ProfileName, ProfileSubname, Progress, ProgressBar, ProgressDescription, ProgressIndicator, ProgressLabel, ProgressTitle, RadarPing, Radio, RadioGroup, ResizeableHandle, ResizeablePanel, ResizeablePanelGroup, ScrollArea, Select, SelectDescription, SelectGroup, SelectGroupLabel, SelectIcon, SelectItem, SelectList, SelectPopup, SelectTitle, SelectTrigger, SelectValue, Separator, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarMenu, SidebarMenuBadge, SidebarMenuButton, SidebarMenuCollapsible, SidebarMenuCollapsiblePanel, SidebarMenuCollapsibleTrigger, SidebarMenuItem, SidebarProvider, SidebarToggle, Skeleton, Slider, SliderDescription, SliderGroup, SliderGroupSlider, SliderIcon, SliderInput, SliderLabel, SliderThumb, SliderValue, StackToastItem, StackToasts, Switch, THEME_STORAGE_KEY, TableAvatarCell, TableBadgeCell, TableBody, TableBooleanCell, TableBottomBar, TableCheckboxCell, TableCheckboxHeader, TableColumnToggle, TableContainer, TableCurrencyCell, TableDateFilterChip, TableDateFilterForm, TableEmpty as TableEmptyMessage, TableFilterList, TableFilterMenu, TableFirstPage, TableFooter, TableHeader, TableImageCell, TableLastPage, TableLayout, TableLinkCell, TableNextPage, TableNumberCell, TableNumberFilterChip, TableNumberFilterForm, TablePagination, TablePaging, TablePercentCell, TablePreviousPage, TableProgressCell, TableRelativeTimeCell, TableResults, TableSearch, TableSelectFilterChip, TableSelectFilterForm, TableSortChip, TableSortList, TableSortMenu, TableStringFilterChip, TableStringFilterForm, TableTagsCell, TableTextCell, TableToolbar, TableTopBar, TableViewModeToggle, TableViewport, Tabs, TabsIndicator, TabsList, TabsPanel, TabsTab, TextArea, ThemeProvider, Toast, ToastProvider, Toggle, ToggleGroup, Tooltip, TooltipContent, TooltipTrigger, anchoredToastManager, cn, createAppColumnHelper, createAppColumnHelper$1 as createLayerTreeColumnHelper, dateFilterFn, defaultFilterOperatorLabels, features, fieldContext, findLayerTreeNode, formContext, formatDate, getPayloadConfigFromPayload, getStoredSidebarOpen, getThemeByValue, insertLayerTreeNode, features$1 as layerTreeFeatures, moveLayerTreeNode, moveLayerTreeNodeToRoot, numberFilterFn, popoverHandle, removeLayerTreeNode, rowLockedFeature, rowVisibilityFeature, selectFilterFn, stackToastManager, stringFilterFn, useAppForm, useAppTable, useCellContext, useChart, useChartTooltipContent, useChartTooltipPayload, useFieldContext, useFilter, useFilteredItems, useFormContext, useHeaderContext, useLayerTree, useCellContext$1 as useLayerTreeCellContext, useTableContext as useLayerTreeContext, useHeaderContext$1 as useLayerTreeHeaderContext, useAppTable$1 as useLayerTreeTable, useMediaQuery, useSidebar, useSliderGroupContext, useTableContext$1 as useTableContext, useTheme, useToastManager, useTypedAppFormContext, withFieldGroup, withForm };
|
|
9736
10470
|
|
|
9737
10471
|
//# sourceMappingURL=index.mjs.map
|