ixia-ui-react 1.2.0 → 1.4.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.
@@ -1,6 +1,6 @@
1
1
  import { Accordion as Accordion$1 } from "@base-ui/react/accordion";
2
2
  import { clsx } from "clsx";
3
- import { twMerge } from "tailwind-merge";
3
+ import { extendTailwindMerge } from "tailwind-merge";
4
4
  import { cva } from "class-variance-authority";
5
5
  import { Fragment, jsx, jsxs } from "react/jsx-runtime";
6
6
  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";
@@ -8,7 +8,7 @@ import { AlertDialog as AlertDialog$1, Button as Button$1, Checkbox as Checkbox$
8
8
  import React, { Children, createContext, createElement, isValidElement, useContext, useEffect, useId, useRef, useState } from "react";
9
9
  import { Autocomplete as Autocomplete$1 } from "@base-ui/react/autocomplete";
10
10
  import { Avatar as Avatar$1 } from "@base-ui/react/avatar";
11
- import { DayPicker, getDefaultClassNames, isDateRange, labelDayButton } from "@daypicker/react";
11
+ import { DayButton, DayPicker, getDefaultClassNames, isDateRange, labelDayButton } from "@daypicker/react";
12
12
  import { Select as Select$1 } from "@base-ui/react/select";
13
13
  import { Legend, ResponsiveContainer, Tooltip as Tooltip$1 } from "recharts";
14
14
  import { Checkbox as Checkbox$2 } from "@base-ui/react/checkbox";
@@ -34,9 +34,30 @@ import { NumberField as NumberField$1 } from "@base-ui/react/number-field";
34
34
  import { Group, Panel, Separator as Separator$2 } from "react-resizable-panels";
35
35
  import { ScrollArea as ScrollArea$1 } from "@base-ui/react/scroll-area";
36
36
  import { z } from "zod";
37
+ import { useSelector } from "@tanstack/react-store";
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";
39
40
  //#region src/utils/cn.ts
41
+ const twMerge = extendTailwindMerge({ extend: { theme: { spacing: [
42
+ "3xs",
43
+ "2xs",
44
+ "xs",
45
+ "sm",
46
+ "md",
47
+ "lg",
48
+ "xl",
49
+ "2xl",
50
+ "3xl",
51
+ "3xs-2xs",
52
+ "2xs-xs",
53
+ "xs-sm",
54
+ "sm-md",
55
+ "md-lg",
56
+ "lg-xl",
57
+ "xl-2xl",
58
+ "2xl-3xl",
59
+ "sm-lg"
60
+ ] } } });
40
61
  function cn(...inputs) {
41
62
  return twMerge(clsx(inputs));
42
63
  }
@@ -171,7 +192,7 @@ const Accordion = Object.assign(Accordion$2, {
171
192
  });
172
193
  //#endregion
173
194
  //#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 p-xs 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", {
195
+ 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
196
  defaultVariants: { tone: "brand" },
176
197
  variants: { tone: {
177
198
  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 +319,7 @@ const buttonVariants = cva("inline-flex cursor-pointer items-center justify-cent
298
319
  variant: "outline"
299
320
  },
300
321
  {
301
- className: "border-neutral-border text-neutral-default hover:bg-neutral-subtle hover:text-neutral-on-container",
322
+ className: "border-border text-neutral-default hover:bg-neutral-subtle hover:text-neutral-on-container",
302
323
  tone: "neutral",
303
324
  variant: "outline"
304
325
  },
@@ -472,12 +493,12 @@ const buttonVariants = cva("inline-flex cursor-pointer items-center justify-cent
472
493
  size: {
473
494
  extraSmall: "h-md gap-3xs px-2xs style-text-default--2 [&>svg]:size-xs",
474
495
  iconExtraSmall: "size-md p-[0px] [&>svg]:size-xs",
475
- iconLarge: "size-2xl p-[0px] [&>svg]:size-md",
476
- iconMedium: "size-xl p-[0px] [&>svg]:size-sm",
477
- iconSmall: "size-lg p-[0px] [&>svg]:size-xs",
478
- large: "h-2xl gap-xs px-md style-text-default-2 [&>svg]:size-md",
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"
496
+ iconLarge: "size-2xl p-[0px] [&>svg]:size-lg",
497
+ iconMedium: "size-xl p-[0px] [&>svg]:size-md",
498
+ iconSmall: "size-lg p-[0px] [&>svg]:size-sm",
499
+ large: "h-2xl min-w-2xl gap-xs px-md style-text-default-1 [&>svg]:size-lg",
500
+ medium: "h-xl min-w-xl gap-2xs px-sm style-text-default-0 [&>svg]:size-md",
501
+ small: "h-lg min-w-lg gap-3xs px-xs style-text-default--1 [&>svg]:size-sm"
481
502
  },
482
503
  tone: {
483
504
  accent: "",
@@ -490,11 +511,11 @@ const buttonVariants = cva("inline-flex cursor-pointer items-center justify-cent
490
511
  },
491
512
  variant: {
492
513
  elevated: "shadow-xs not-active:hover:shadow-md",
493
- fill: "active:scale-[0.98]",
494
- ghost: "active:scale-[0.98]",
514
+ fill: "active:scale-95",
515
+ ghost: "active:scale-95",
495
516
  link: "size-fit! p-0! underline decoration-transparent underline-offset-2 [&>svg]:transition-colors",
496
- outline: "border active:scale-[0.98]",
497
- soft: "border active:scale-[0.98]"
517
+ outline: "border active:scale-95",
518
+ soft: "border active:scale-95"
498
519
  }
499
520
  }
500
521
  });
@@ -714,6 +735,7 @@ const inputVariants = cva("group flex w-full items-center text-ellipsis caret-br
714
735
  },
715
736
  variant: {
716
737
  ghost: "bg-transparent",
738
+ outline: "bg-transparent outline outline-border",
717
739
  primary: "bg-surface shadow-2xs",
718
740
  secondary: "bg-neutral-container"
719
741
  }
@@ -864,9 +886,9 @@ const Autocomplete = Object.assign(Autocomplete$2, {
864
886
  const avatarVariants = cva("group/avatar relative inline-flex shrink-0 items-center justify-center rounded-full", {
865
887
  defaultVariants: { size: "medium" },
866
888
  variants: { size: {
867
- large: "size-2xl style-text-default-1",
868
- medium: "size-xl style-text-default-0",
869
- small: "size-lg style-text-default--1"
889
+ large: "size-3xl style-text-default-1",
890
+ medium: "size-2xl style-text-default-0",
891
+ small: "size-xl style-text-default--1"
870
892
  } }
871
893
  });
872
894
  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 +898,10 @@ const avatarBadgeVariants = cva("absolute right-0 bottom-0 inline-flex items-cen
876
898
  },
877
899
  variants: {
878
900
  position: {
879
- bottomLeft: "bottom-0 left-0",
880
- bottomRight: "right-0 bottom-0",
881
- topLeft: "top-0 left-0",
882
- topRight: "top-0 right-0"
901
+ bottomLeft: "bottom-px left-px",
902
+ bottomRight: "right-px bottom-px",
903
+ topLeft: "top-px left-px",
904
+ topRight: "top-px right-px"
883
905
  },
884
906
  tone: {
885
907
  accent: "bg-accent-default [&>svg]:text-accent-on-default",
@@ -960,7 +982,7 @@ const Avatar = Object.assign(Avatar$2, {
960
982
  });
961
983
  //#endregion
962
984
  //#region src/components/badge/badge.types.ts
963
- const badgeVariants = cva("inline-flex h-md items-center justify-center gap-3xs rounded-full style-text-default--2 whitespace-nowrap transition-all select-none", {
985
+ 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
986
  compoundVariants: [
965
987
  {
966
988
  className: "bg-brand-default text-brand-on-default",
@@ -1078,9 +1100,9 @@ const badgeVariants = cva("inline-flex h-md items-center justify-center gap-3xs
1078
1100
  iconLarge: "size-lg [&>svg]:size-sm",
1079
1101
  iconMedium: "size-md [&>svg]:size-xs",
1080
1102
  iconSmall: "size-sm [&>svg]:size-2xs",
1081
- large: "h-lg px-xs [&>svg]:size-sm",
1082
- medium: "h-md px-xs [&>svg]:size-xs",
1083
- small: "h-sm px-xs [&>svg]:size-2xs"
1103
+ large: "h-lg px-xs [&>svg]:size-[1em]",
1104
+ medium: "h-md px-xs [&>svg]:size-[1em]",
1105
+ small: "h-sm px-xs [&>svg]:size-[1em]"
1084
1106
  },
1085
1107
  tone: {
1086
1108
  accent: "",
@@ -1133,9 +1155,9 @@ const bentoBoxVariants = cva("group/box flex size-full min-h-0 flex-col overflow
1133
1155
  true: "p-0!"
1134
1156
  },
1135
1157
  size: {
1136
- large: "gap-md rounded-3xl p-md",
1137
- medium: "gap-sm rounded-2xl p-sm",
1138
- small: "gap-xs rounded-xl p-xs"
1158
+ large: "gap-md rounded-3xl p-lg",
1159
+ medium: "gap-sm rounded-2xl p-md",
1160
+ small: "gap-xs rounded-xl p-sm"
1139
1161
  }
1140
1162
  }
1141
1163
  });
@@ -1222,7 +1244,7 @@ const BentoBox = Object.assign(BentoBox$1, {
1222
1244
  //#region src/components/breadcrumb/breadcrumb.tsx
1223
1245
  function Breadcrumb$1({ className, ref, ...props }) {
1224
1246
  return /* @__PURE__ */ jsx("nav", {
1225
- className: cn("flex items-center gap-2xs px-sm py-2xs", className),
1247
+ className: cn("flex items-center gap-2xs", className),
1226
1248
  ref,
1227
1249
  ...props
1228
1250
  });
@@ -1241,7 +1263,7 @@ function BreadcrumbEllipsis({ className, children, ref, ...props }) {
1241
1263
  //#region src/components/breadcrumb/breadcrumb-item.tsx
1242
1264
  function BreadcrumbItem({ className, ref, ...props }) {
1243
1265
  return /* @__PURE__ */ jsx("div", {
1244
- className: cn("inline-flex h-md items-center justify-center gap-2xs rounded-full px-2xs style-text-default--1 text-accent-default [&>svg]:size-xs", className),
1266
+ 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
1267
  ref,
1246
1268
  ...props
1247
1269
  });
@@ -1250,7 +1272,7 @@ function BreadcrumbItem({ className, ref, ...props }) {
1250
1272
  //#region src/components/breadcrumb/breadcrumb-link.tsx
1251
1273
  function BreadcrumbLink({ className, ref, ...props }) {
1252
1274
  return /* @__PURE__ */ jsx("div", {
1253
- className: cn("inline-flex h-md 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-xs", className),
1275
+ 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
1276
  ref,
1255
1277
  ...props
1256
1278
  });
@@ -1323,7 +1345,7 @@ const buttonGroupVariants = cva("inline-flex cursor-pointer items-center justify
1323
1345
  variant: "outline"
1324
1346
  },
1325
1347
  {
1326
- className: "border-neutral-border text-neutral-default [&>button:hover]:bg-neutral-subtle [&>button:hover]:text-neutral-on-container",
1348
+ className: "border-border text-neutral-default [&>button:hover]:bg-neutral-subtle [&>button:hover]:text-neutral-on-container",
1327
1349
  tone: "neutral",
1328
1350
  variant: "outline"
1329
1351
  },
@@ -1465,14 +1487,14 @@ const buttonGroupVariants = cva("inline-flex cursor-pointer items-center justify
1465
1487
  vertical: "flex-col [&>*+*]:relative [&>*+*]:before:absolute [&>*+*]:before:top-0 [&>*+*]:before:left-1/2 [&>*+*]:before:h-px [&>*+*]:before:w-1/2 [&>*+*]:before:-translate-x-1/2 [&>*+*]:before:content-[\"\"]"
1466
1488
  },
1467
1489
  size: {
1468
- extraSmall: "*:style-text-default--2 [&>button]:h-md [&>button]:px-2xs [&>button]:[&>svg]:size-2xs",
1469
- iconExtraSmall: "*:size-md [&>button]:size-md [&>button]:p-[0px] [&>button]:[&>svg]:size-2xs",
1470
- iconLarge: "*:size-2xl [&>button]:size-2xl [&>button]:p-[0px] [&>button]:[&>svg]:size-md",
1471
- iconMedium: "*:size-xl [&>button]:size-xl [&>button]:p-[0px] [&>button]:[&>svg]:size-sm",
1472
- iconSmall: "*:size-lg [&>button]:size-lg [&>button]:p-[0px] [&>button]:[&>svg]:size-xs",
1473
- large: "*:style-text-default-2 [&>button]:h-2xl [&>button]:px-md [&>button]:[&>svg]:size-md",
1474
- medium: "*:style-text-default-0 [&>button]:h-xl [&>button]:px-sm [&>button]:[&>svg]:size-sm",
1475
- small: "*:style-text-default--1 [&>button]:h-lg [&>button]:px-xs [&>button]:[&>svg]:size-xs"
1490
+ extraSmall: "*:style-text-default--2 [&>button]:h-md [&>button]:min-w-0 [&>button]:gap-3xs [&>button]:px-2xs [&>button>svg]:size-xs",
1491
+ iconExtraSmall: "*:size-md [&>button]:size-md [&>button]:min-w-0 [&>button]:p-[0px] [&>button>svg]:size-xs",
1492
+ iconLarge: "*:size-2xl [&>button]:size-2xl [&>button]:min-w-0 [&>button]:p-[0px] [&>button>svg]:size-lg",
1493
+ iconMedium: "*:size-xl [&>button]:size-xl [&>button]:min-w-0 [&>button]:p-[0px] [&>button>svg]:size-md",
1494
+ iconSmall: "*:size-lg [&>button]:size-lg [&>button]:min-w-0 [&>button]:p-[0px] [&>button>svg]:size-sm",
1495
+ large: "*:style-text-default-1 [&>button]:h-2xl [&>button]:min-w-2xl [&>button]:gap-xs [&>button]:px-md [&>button>svg]:size-lg",
1496
+ medium: "*:style-text-default-0 [&>button]:h-xl [&>button]:min-w-xl [&>button]:gap-2xs [&>button]:px-sm [&>button>svg]:size-md",
1497
+ small: "*:style-text-default--1 [&>button]:h-lg [&>button]:min-w-lg [&>button]:gap-3xs [&>button]:px-xs [&>button>svg]:size-sm"
1476
1498
  },
1477
1499
  tone: {
1478
1500
  accent: "[&>*+*]:before:bg-accent-border",
@@ -1567,7 +1589,7 @@ const calendarPanelVariants = cva("w-fit", {
1567
1589
  variants: { variant: {
1568
1590
  elevated: "bg-surface shadow-2xs",
1569
1591
  ghost: "bg-transparent",
1570
- outline: "border border-border-strong"
1592
+ outline: "border border-border"
1571
1593
  } }
1572
1594
  });
1573
1595
  //#endregion
@@ -1743,6 +1765,17 @@ const Select = Object.assign(Select$2, {
1743
1765
  });
1744
1766
  //#endregion
1745
1767
  //#region src/components/calendar/calendar-picker.tsx
1768
+ function CalendarDayButton({ className, modifiers, ...props }) {
1769
+ return /* @__PURE__ */ jsx(DayButton, {
1770
+ ...props,
1771
+ modifiers,
1772
+ className: cn(buttonVariants({
1773
+ size: "medium",
1774
+ tone: "neutral",
1775
+ variant: "ghost"
1776
+ }), "text-inherit hover:bg-brand-container hover:text-brand-on-container", modifiers.selected && "hover:bg-brand-default hover:text-brand-on-default", className)
1777
+ });
1778
+ }
1746
1779
  function createSelectTarget(value) {
1747
1780
  const element = document.createElement("select"), option = Object.assign(document.createElement("option"), { value });
1748
1781
  element.append(option);
@@ -1791,7 +1824,8 @@ function CalendarNextMonthButton({ onClick, disabled, ...props }) {
1791
1824
  ...props,
1792
1825
  variant: "ghost",
1793
1826
  tone: "neutral",
1794
- size: "iconSmall",
1827
+ size: "iconMedium",
1828
+ className: cn("hover:bg-neutral-container-high hover:text-neutral-on-container"),
1795
1829
  onClick,
1796
1830
  disabled,
1797
1831
  children: /* @__PURE__ */ jsx(CaretRightIcon, { weight: "bold" })
@@ -1802,7 +1836,8 @@ function CalendarPreviousMonthButton({ onClick, disabled, ...props }) {
1802
1836
  ...props,
1803
1837
  variant: "ghost",
1804
1838
  tone: "neutral",
1805
- size: "iconSmall",
1839
+ size: "iconMedium",
1840
+ className: cn("hover:bg-neutral-container-high hover:text-neutral-on-container"),
1806
1841
  onClick,
1807
1842
  disabled,
1808
1843
  children: /* @__PURE__ */ jsx(CaretLeftIcon, { weight: "bold" })
@@ -1824,20 +1859,23 @@ function labelDayButtonWithVisibleText(...args) {
1824
1859
  const defaultClassNames = getDefaultClassNames();
1825
1860
  const calendarClassNames = {
1826
1861
  caption_label: "style-text-strong-0",
1827
- day: cn("rounded-xl 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),
1862
+ 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),
1863
+ day_button: cn("size-xl! rounded-full", defaultClassNames.day_button),
1828
1864
  disabled: cn("pointer-events-none text-on-surface", defaultClassNames.disabled),
1829
1865
  month_caption: "flex items-center justify-center h-lg",
1830
- month_grid: cn("mt-xs", defaultClassNames.month_grid),
1866
+ month_grid: cn("mt-xs border-separate! border-spacing-3xs", defaultClassNames.month_grid),
1831
1867
  nav: cn("h-lg! w-full justify-between!", defaultClassNames.nav),
1832
- outside: cn("border-none text-on-surface", defaultClassNames.outside),
1868
+ outside: cn("border-none text-on-surface-muted", defaultClassNames.outside),
1833
1869
  range_end: cn("rounded-l-none bg-brand-default text-brand-on-default"),
1834
1870
  range_middle: cn("rounded-none! border-y border-brand-border bg-brand-container! text-brand-on-container! transition-none"),
1835
1871
  range_start: cn("rounded-r-none bg-brand-default text-brand-on-default", "[&.rounded-l-none]:rounded-xl"),
1836
1872
  selected: cn("bg-brand-default text-brand-on-default"),
1837
1873
  today: cn("text-brand-default! data-selected:text-brand-on-default!", defaultClassNames.today),
1838
- weekdays: cn("style-text-default-0 text-on-surface", defaultClassNames.weekdays)
1874
+ week: cn("", defaultClassNames.week),
1875
+ weekdays: cn("style-text-default-0 text-on-surface-muted", defaultClassNames.weekdays)
1839
1876
  };
1840
1877
  const calendarComponents = {
1878
+ DayButton: CalendarDayButton,
1841
1879
  Dropdown: CalendarDropdown,
1842
1880
  NextMonthButton: CalendarNextMonthButton,
1843
1881
  PreviousMonthButton: CalendarPreviousMonthButton
@@ -1939,8 +1977,6 @@ function ChartContainer({ id, config, className, children, initialDimension, ref
1939
1977
  ref,
1940
1978
  ...props,
1941
1979
  children: /* @__PURE__ */ jsx(ResponsiveContainer, {
1942
- width: "100%",
1943
- height: "100%",
1944
1980
  initialDimension,
1945
1981
  children
1946
1982
  })
@@ -2241,34 +2277,28 @@ function CheckboxIndicator({ className, ...props }) {
2241
2277
  }
2242
2278
  //#endregion
2243
2279
  //#region src/components/checkbox/checkbox.types.ts
2244
- const checkboxVariants = cva("group flex size-sm items-center justify-center rounded-sm 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-xs [&:not([data-checked])]:hover:outline-border-strong", {
2280
+ 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
2281
  defaultVariants: { variant: "elevated" },
2246
2282
  variants: { variant: {
2247
2283
  elevated: "bg-surface shadow-2xs",
2248
- inSurface: "bg-surface-low shadow-none inset-shadow-2xs data-checked:inset-shadow-none"
2284
+ inSurface: "bg-surface-low shadow-none inset-shadow-2xs data-checked:inset-shadow-none",
2285
+ outline: "bg-inherit shadow-none outline [&:not([data-checked])]:not-hover:outline-border-strong"
2249
2286
  } }
2250
2287
  });
2251
2288
  //#endregion
2252
2289
  //#region src/components/checkbox/checkbox.tsx
2253
- function Checkbox$3({ variant, className, label, id, ref, ...props }) {
2254
- const generatedId = useId(), hasLabel = label !== void 0 && label !== null;
2255
- let checkboxId = id;
2256
- if (checkboxId === void 0 && hasLabel) checkboxId = generatedId;
2257
- return /* @__PURE__ */ jsxs("div", {
2258
- className: "flex items-center gap-xs",
2290
+ function Checkbox$3({ variant, children, className, ref, ...props }) {
2291
+ return /* @__PURE__ */ jsxs(Label, {
2292
+ className: "flex items-center gap-xs has-disabled:opacity-50",
2259
2293
  children: [/* @__PURE__ */ jsx(Checkbox$1.Root, {
2260
2294
  className: cn(checkboxVariants({
2261
2295
  className,
2262
2296
  variant
2263
2297
  })),
2264
- id: checkboxId,
2265
2298
  ref,
2266
2299
  ...props,
2267
2300
  children: /* @__PURE__ */ jsx(CheckboxIndicator, {})
2268
- }), hasLabel && /* @__PURE__ */ jsx(Label, {
2269
- htmlFor: checkboxId,
2270
- children: label
2271
- })]
2301
+ }), children]
2272
2302
  });
2273
2303
  }
2274
2304
  //#endregion
@@ -2341,6 +2371,7 @@ function CodeBlockCopy({ className, children, ref, ...props }) {
2341
2371
  console.error("Failed to copy text:", error);
2342
2372
  }
2343
2373
  };
2374
+ if (React.isValidElement(currentValue.content)) return;
2344
2375
  return /* @__PURE__ */ jsxs(Button, {
2345
2376
  "aria-label": "Copy code",
2346
2377
  onClick: handleClick,
@@ -2381,6 +2412,7 @@ function CodeBlockDownload({ className, children, ref, ...props }) {
2381
2412
  console.error("Failed to download file:", error);
2382
2413
  }
2383
2414
  };
2415
+ if (React.isValidElement(currentValue.content)) return;
2384
2416
  return /* @__PURE__ */ jsxs(Button, {
2385
2417
  "aria-label": "Download file",
2386
2418
  onClick: handleClick,
@@ -2550,7 +2582,7 @@ const tabsVariants = cva("", {
2550
2582
  variant: "underline"
2551
2583
  },
2552
2584
  {
2553
- class: "[&_[role=presentation]]:rounded-lg [&_[role=tab]]:rounded-lg [&_[role=tablist]]:rounded-lg",
2585
+ class: "[&_[role=presentation]]:rounded-full [&_[role=tab]]:rounded-full [&_[role=tablist]]:rounded-full",
2554
2586
  size: "small",
2555
2587
  variant: "default"
2556
2588
  },
@@ -2560,55 +2592,65 @@ const tabsVariants = cva("", {
2560
2592
  variant: "default"
2561
2593
  },
2562
2594
  {
2563
- class: "[&_[role=presentation]]:rounded-xl [&_[role=tab]]:h-xl [&_[role=tab]]:rounded-xl [&_[role=tab]]:px-md [&_[role=tab]]:style-text-default-0 [&_[role=tablist]]:gap-xs [&_[role=tablist]]:rounded-xl [&_[role=tablist]]:p-2xs",
2595
+ 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
2596
  size: "medium",
2565
2597
  variant: "default"
2566
2598
  },
2567
2599
  {
2568
- class: "[&_[role=presentation]]:rounded-2xl [&_[role=tab]]:h-2xl [&_[role=tab]]:rounded-2xl [&_[role=tab]]:px-lg [&_[role=tab]]:style-text-default-1 [&_[role=tablist]]:gap-sm [&_[role=tablist]]:rounded-2xl [&_[role=tablist]]:p-xs",
2600
+ 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
2601
  size: "large",
2570
2602
  variant: "default"
2571
2603
  },
2572
2604
  {
2573
- class: "[&_[role=presentation]]:rounded-lg [&_[role=tab]]:h-lg [&_[role=tab]]:px-sm [&_[role=tab]]:style-text-default--1 [&_[role=tablist]]:gap-2xs [&_[role=tablist]]:rounded-lg [&_[role=tablist]]:p-3xs",
2605
+ 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
2606
  size: "small",
2575
2607
  variant: "ghost"
2576
2608
  },
2577
2609
  {
2578
- class: "[&_[role=presentation]]:rounded-xl [&_[role=tab]]:h-xl [&_[role=tab]]:px-md [&_[role=tab]]:style-text-default-0 [&_[role=tablist]]:gap-xs [&_[role=tablist]]:rounded-xl [&_[role=tablist]]:p-2xs",
2610
+ 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
2611
  size: "medium",
2580
2612
  variant: "ghost"
2581
2613
  },
2582
2614
  {
2583
- class: "[&_[role=presentation]]:rounded-2xl [&_[role=tab]]:h-2xl [&_[role=tab]]:px-lg [&_[role=tab]]:style-text-default-1 [&_[role=tablist]]:gap-sm [&_[role=tablist]]:rounded-2xl [&_[role=tablist]]:p-xs",
2615
+ 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
2616
  size: "large",
2585
2617
  variant: "ghost"
2586
2618
  },
2587
2619
  {
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-2 **:[[role=presentation]]:bottom-[-3px] **:[[role=presentation]]:h-[2px]",
2620
+ 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
2621
  size: "small",
2590
2622
  variant: "underline"
2591
2623
  },
2592
2624
  {
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-3 **:[[role=presentation]]:bottom-[-4px] **:[[role=presentation]]:h-[3px]",
2625
+ 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
2626
  size: "medium",
2595
2627
  variant: "underline"
2596
2628
  },
2597
2629
  {
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-4 **:[[role=presentation]]:bottom-[-5px] **:[[role=presentation]]:h-[4px]",
2630
+ 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
2631
  size: "large",
2600
2632
  variant: "underline"
2633
+ },
2634
+ {
2635
+ class: "[&_[role=tablist]]:w-fit",
2636
+ fill: false,
2637
+ variant: ["default", "ghost"]
2638
+ },
2639
+ {
2640
+ class: "[&_[role=tablist]]:w-full",
2641
+ fill: false,
2642
+ variant: "underline"
2601
2643
  }
2602
2644
  ],
2603
2645
  defaultVariants: {
2604
- fill: true,
2646
+ fill: false,
2605
2647
  size: "medium",
2606
2648
  tone: "brand",
2607
2649
  variant: "default"
2608
2650
  },
2609
2651
  variants: {
2610
2652
  fill: {
2611
- false: "[&_[role=tablist]]:w-fit",
2653
+ false: "",
2612
2654
  true: "[&_[role=tab]]:grow [&_[role=tablist]]:w-full"
2613
2655
  },
2614
2656
  size: {
@@ -2656,10 +2698,11 @@ function TabsIndicator({ className, ...props }) {
2656
2698
  }
2657
2699
  //#endregion
2658
2700
  //#region src/components/tabs/tabs-list.tsx
2659
- function TabsList({ className, ...props }) {
2660
- return /* @__PURE__ */ jsx(Tabs$1.List, {
2701
+ function TabsList({ children, className, ...props }) {
2702
+ return /* @__PURE__ */ jsxs(Tabs$1.List, {
2661
2703
  className: cn("relative z-0 flex", className),
2662
- ...props
2704
+ ...props,
2705
+ children: [children, /* @__PURE__ */ jsx(TabsIndicator, {})]
2663
2706
  });
2664
2707
  }
2665
2708
  //#endregion
@@ -2851,9 +2894,9 @@ const colorPickerVariants = cva("flex flex-col space-y-sm", {
2851
2894
  const colorPickerSwatchVariants = cva("overflow-hidden border border-border hover:cursor-pointer focus:outline-2 focus:outline-offset-2", {
2852
2895
  defaultVariants: { size: "medium" },
2853
2896
  variants: { size: {
2854
- large: "size-lg rounded-xl",
2855
- medium: "size-md rounded-lg",
2856
- small: "size-sm rounded-md"
2897
+ large: "size-lg rounded-lg",
2898
+ medium: "size-md rounded-md",
2899
+ small: "size-sm rounded-sm"
2857
2900
  } }
2858
2901
  });
2859
2902
  const RGB_CHANNEL_COUNT = 3;
@@ -3557,7 +3600,7 @@ function ColorPickerInput({ showPopover = false, showTransparencyField = true, c
3557
3600
  }) })] }),
3558
3601
  !showPopover && /* @__PURE__ */ jsx(InputGroupAddon, {
3559
3602
  style: { backgroundColor: color.hex() },
3560
- className: "aspect-square size-md rounded-lg"
3603
+ className: "aspect-square size-md rounded-md"
3561
3604
  }),
3562
3605
  /* @__PURE__ */ jsx(InputGroupInput, {
3563
3606
  "aria-label": "Color value",
@@ -4263,7 +4306,7 @@ function Dialog$2({ ...props }) {
4263
4306
  //#region src/components/dialog/dialog-close.tsx
4264
4307
  function DialogClose({ className, ref, ...props }) {
4265
4308
  return /* @__PURE__ */ jsx(Dialog$1.Close, {
4266
- className: cn("absolute top-2xs right-2xs", className),
4309
+ className: cn("absolute top-xs right-xs", className),
4267
4310
  ref,
4268
4311
  ...props,
4269
4312
  render: /* @__PURE__ */ jsx(Button, {
@@ -4332,7 +4375,7 @@ function DialogPopup({ className, children, ref, ...props }) {
4332
4375
  backdropFilter: "blur(16px)"
4333
4376
  }
4334
4377
  }), /* @__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 p-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),
4378
+ 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
4379
  ref,
4337
4380
  ...props,
4338
4381
  children
@@ -4901,7 +4944,7 @@ function MeterSubtitle({ className, ref, ...props }) {
4901
4944
  //#region src/components/meter/meter-track.tsx
4902
4945
  function MeterTrack({ className, ref, ...props }) {
4903
4946
  return /* @__PURE__ */ jsx(Meter$1.Track, {
4904
- className: cn("w-full self-center rounded-full bg-surface-low inset-shadow-2xs", className),
4947
+ className: cn("w-full self-center rounded-full bg-neutral-container", className),
4905
4948
  "data-track": true,
4906
4949
  ref,
4907
4950
  ...props
@@ -5092,20 +5135,15 @@ function Field$1({ className, children, ref, ...props }) {
5092
5135
  const { fieldContext, useFieldContext, formContext, useFormContext } = createFormHookContexts();
5093
5136
  //#endregion
5094
5137
  //#region src/components/field/field-checkbox.tsx
5095
- function FieldCheckbox({ ...props }) {
5138
+ function FieldCheckbox({ children, ...props }) {
5096
5139
  const field = useFieldContext();
5097
- return /* @__PURE__ */ jsxs("div", {
5098
- className: "flex items-center gap-xs",
5099
- children: [/* @__PURE__ */ jsx(Checkbox, {
5100
- checked: field.state.value,
5101
- id: field.name,
5102
- name: field.name,
5103
- onCheckedChange: (checked) => field.handleChange(checked),
5104
- ...props
5105
- }), props.label && /* @__PURE__ */ jsx(Label, {
5106
- htmlFor: field.name,
5107
- children: props.label
5108
- })]
5140
+ return /* @__PURE__ */ jsx(Checkbox, {
5141
+ checked: field.state.value,
5142
+ id: field.name,
5143
+ name: field.name,
5144
+ onCheckedChange: (checked) => field.handleChange(checked),
5145
+ ...props,
5146
+ children
5109
5147
  });
5110
5148
  }
5111
5149
  //#endregion
@@ -5195,7 +5233,7 @@ function Input({ fileUploadButtonIcon = defaultFileUploadButtonIcon, fileUploadB
5195
5233
  onClick: () => inputRef.current?.click(),
5196
5234
  type: "button",
5197
5235
  children: [/* @__PURE__ */ jsx("div", {
5198
- className: cn("size-full", size === "small" && "rounded-lg", size === "medium" && "rounded-xl", size === "large" && "rounded-2xl"),
5236
+ className: cn("size-full", size === "small" && "rounded-md", size === "medium" && "rounded-lg", size === "large" && "rounded-xl"),
5199
5237
  style: { backgroundColor: colorValue }
5200
5238
  }), /* @__PURE__ */ jsx(Input$1, {
5201
5239
  className: "peer pointer-events-none invisible absolute",
@@ -5643,11 +5681,15 @@ function Switch({ children, className, ref, ...props }) {
5643
5681
  return /* @__PURE__ */ jsxs(Label, {
5644
5682
  className: "flex items-center gap-xs",
5645
5683
  children: [/* @__PURE__ */ jsx(Switch$1.Root, {
5646
- className: cn("group relative flex h-md w-xl items-center rounded-full bg-surface-low bg-size-[6.5rem_100%] p-[0.5px] inset-shadow-2xs 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),
5684
+ 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
5685
  ref,
5648
5686
  ...props,
5649
- children: /* @__PURE__ */ jsx(Switch$1.Thumb, { className: "size-xs translate-x-[6px] rounded-full shadow-2xs transition-transform duration-500 ease-[cubic-bezier(0.68,-0.55,0.27,1.55)] data-checked:size-sm data-checked:translate-x-[26px] data-checked:scale-[1.1] data-checked:bg-accent-on-default data-unchecked:bg-accent-default" })
5650
- }), children]
5687
+ 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" })
5688
+ }), children != void 0 && /* @__PURE__ */ jsx("span", {
5689
+ "data-slot": "switch-label",
5690
+ className: "leading-none",
5691
+ children
5692
+ })]
5651
5693
  });
5652
5694
  }
5653
5695
  //#endregion
@@ -5668,6 +5710,8 @@ function FieldSwitch({ children, ...props }) {
5668
5710
  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
5711
  defaultVariants: { variant: "primary" },
5670
5712
  variants: { variant: {
5713
+ ghost: "bg-transparent",
5714
+ outline: "border border-border",
5671
5715
  primary: "bg-surface shadow-2xs",
5672
5716
  secondary: "bg-neutral-container"
5673
5717
  } }
@@ -5955,32 +5999,32 @@ function FormSubmit({ className, children, ref, ...props }) {
5955
5999
  //#region src/components/form/form-context.tsx
5956
6000
  const { useAppForm, withFieldGroup, withForm, useTypedAppFormContext } = createFormHook({
5957
6001
  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
6002
+ Checkbox: FieldCheckbox,
6003
+ Description: FieldDescription,
6004
+ Errors: FieldErrors,
6005
+ Input: FieldInput,
6006
+ InputGroup: FieldInputGroup,
6007
+ InputGroupInput: FieldInputGroupInput,
6008
+ Label: FieldLabel,
6009
+ Radio: FieldRadio,
6010
+ RadioGroup: FieldRadioGroup,
6011
+ Row: FieldRow,
6012
+ Select: FieldSelect,
6013
+ Set: FieldSet,
6014
+ Slider: FieldSlider,
6015
+ Switch: FieldSwitch,
6016
+ TextArea: FieldTextArea,
6017
+ Toggle: FieldToggle
5974
6018
  },
5975
6019
  fieldContext,
5976
6020
  formComponents: {
5977
- FormErrors,
5978
- FormFooter,
5979
- FormReset,
5980
- FormSet,
5981
- FormSetContent,
5982
- FormSetHeading,
5983
- FormSubmit
6021
+ Errors: FormErrors,
6022
+ Footer: FormFooter,
6023
+ Reset: FormReset,
6024
+ Set: FormSet,
6025
+ SetContent: FormSetContent,
6026
+ SetHeading: FormSetHeading,
6027
+ Submit: FormSubmit
5984
6028
  },
5985
6029
  formContext
5986
6030
  });
@@ -5996,6 +6040,66 @@ const Form = Object.assign(Form$1, {
5996
6040
  Submit: FormSubmit
5997
6041
  });
5998
6042
  //#endregion
6043
+ //#region src/components/icon-container/icon-container.types.ts
6044
+ const iconContainerVariants = cva("flex shrink-0 items-center justify-center", {
6045
+ compoundVariants: [
6046
+ {
6047
+ className: "rounded-xl",
6048
+ shape: "square",
6049
+ size: "small"
6050
+ },
6051
+ {
6052
+ className: "rounded-2xl",
6053
+ shape: "square",
6054
+ size: "medium"
6055
+ },
6056
+ {
6057
+ className: "rounded-3xl",
6058
+ shape: "square",
6059
+ size: "large"
6060
+ }
6061
+ ],
6062
+ defaultVariants: {
6063
+ shape: "rounded",
6064
+ size: "medium",
6065
+ tone: "brand"
6066
+ },
6067
+ variants: {
6068
+ shape: {
6069
+ rounded: "rounded-full",
6070
+ square: ""
6071
+ },
6072
+ size: {
6073
+ large: "size-3xl [&>svg]:size-xl",
6074
+ medium: "size-2xl [&>svg]:size-lg",
6075
+ small: "size-xl [&>svg]:size-md"
6076
+ },
6077
+ tone: {
6078
+ accent: "bg-accent-container-high text-accent-on-container",
6079
+ brand: "bg-brand-container-high text-brand-on-container",
6080
+ error: "bg-error-container-high text-error-on-container",
6081
+ info: "bg-info-container-high text-info-on-container",
6082
+ neutral: "bg-neutral-container-high text-neutral-on-container",
6083
+ success: "bg-success-container-high text-success-on-container",
6084
+ warning: "bg-warning-container-high text-warning-on-container"
6085
+ }
6086
+ }
6087
+ });
6088
+ //#endregion
6089
+ //#region src/components/icon-container/icon-container.tsx
6090
+ function IconContainer({ shape, size, tone, className, children, ref, ...props }) {
6091
+ return /* @__PURE__ */ jsx("div", {
6092
+ className: cn(iconContainerVariants({
6093
+ shape,
6094
+ size,
6095
+ tone
6096
+ }), className),
6097
+ ref,
6098
+ ...props,
6099
+ children
6100
+ });
6101
+ }
6102
+ //#endregion
5999
6103
  //#region src/components/input-otp/input-otp.tsx
6000
6104
  function InputOTP$1({ children, className, id, ref, ...props }) {
6001
6105
  const generatedId = useId(), fieldId = id ?? generatedId;
@@ -6589,7 +6693,7 @@ function MenuGroupLabel({ className, ref, ...props }) {
6589
6693
  }
6590
6694
  //#endregion
6591
6695
  //#region src/components/menu/menu.types.ts
6592
- const menuItemVariants = cva("relative z-0 flex h-lg cursor-default items-center px-xs 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", {
6696
+ 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
6697
  defaultVariants: { tone: "neutral" },
6594
6698
  variants: { tone: {
6595
6699
  accent: "text-accent-default data-highlighted:text-accent-on-container data-highlighted:before:bg-accent-container",
@@ -6601,7 +6705,7 @@ const menuItemVariants = cva("relative z-0 flex h-lg cursor-default items-center
6601
6705
  warning: "text-warning-default data-highlighted:text-warning-on-container data-highlighted:before:bg-warning-container"
6602
6706
  } }
6603
6707
  });
6604
- const menuSubmenuTriggerVariants = cva("relative z-0 grid h-lg cursor-default grid-cols-[1fr_2rem] items-center px-xs 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", {
6708
+ 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
6709
  defaultVariants: { tone: "neutral" },
6606
6710
  variants: { tone: {
6607
6711
  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 +6742,7 @@ function MenuPopup({ className, children, ref, ...props }) {
6638
6742
  sideOffset: 8,
6639
6743
  ...props,
6640
6744
  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",
6745
+ 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
6746
  children
6643
6747
  })
6644
6748
  }) });
@@ -6959,17 +7063,17 @@ const navBarVariants = cva("flex h-fit items-center justify-between", {
6959
7063
  variant: "floating"
6960
7064
  },
6961
7065
  {
6962
- className: "[&_[data-nav-bar-item]]:size-xl [&_[data-nav-bar-item]]:gap-3xs [&_[data-nav-bar-item]]:rounded-xl",
7066
+ 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
7067
  itemOrientation: "vertical",
6964
7068
  size: "small"
6965
7069
  },
6966
7070
  {
6967
- className: "[&_[data-nav-bar-item]]:size-2xl [&_[data-nav-bar-item]]:gap-3xs [&_[data-nav-bar-item]]:rounded-2xl",
7071
+ 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
7072
  itemOrientation: "vertical",
6969
7073
  size: "medium"
6970
7074
  },
6971
7075
  {
6972
- className: "[&_[data-nav-bar-item]]:size-3xl [&_[data-nav-bar-item]]:gap-2xs [&_[data-nav-bar-item]]:rounded-3xl",
7076
+ className: "[&_[data-nav-bar-item]]:gap-2xs [&_[data-nav-bar-item]]:rounded-3xl [&_[data-nav-bar-item]]:p-[min(var(--spacing-md),25%)]",
6973
7077
  itemOrientation: "vertical",
6974
7078
  size: "large"
6975
7079
  },
@@ -6997,7 +7101,7 @@ const navBarVariants = cva("flex h-fit items-center justify-between", {
6997
7101
  variants: {
6998
7102
  itemOrientation: {
6999
7103
  horizontal: "[&_[data-nav-bar-item]]:flex-row",
7000
- vertical: "[&_[data-nav-bar-item]]:flex-col"
7104
+ 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
7105
  },
7002
7106
  size: {
7003
7107
  large: "gap-sm p-md [&_span]:style-text-default-0 [&_svg]:size-lg",
@@ -7132,7 +7236,7 @@ const navigationMenuTriggerVariants = cva("flex items-center justify-center roun
7132
7236
  }
7133
7237
  }
7134
7238
  });
7135
- const navigationMenuLinkVariants = cva("rounded-lg px-sm py-xs transition-colors hover:cursor-pointer", {
7239
+ const navigationMenuLinkVariants = cva("rounded-xl px-sm py-xs transition-colors hover:cursor-pointer", {
7136
7240
  defaultVariants: { tone: "neutral" },
7137
7241
  variants: { tone: {
7138
7242
  accent: "text-accent-on-container hover:bg-accent-container",
@@ -7387,7 +7491,7 @@ function ProfileAction({ className, ref, ...props }) {
7387
7491
  //#region src/components/profile/profile-content.tsx
7388
7492
  function ProfileContent({ compact, className, ref, ...props }) {
7389
7493
  return /* @__PURE__ */ jsx("div", {
7390
- className: cn("flex flex-col items-start justify-start gap-3xs", compact && "hidden", className),
7494
+ className: cn("flex flex-col items-start justify-start", compact && "hidden", className),
7391
7495
  ref,
7392
7496
  ...props
7393
7497
  });
@@ -7485,7 +7589,7 @@ function ProgressIndicator({ className, children, ref, ...props }) {
7485
7589
  return /* @__PURE__ */ jsxs("div", {
7486
7590
  className: "relative flex shrink-0 flex-col items-center",
7487
7591
  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 style-text-default--2 text-accent-default transition-colors ease-in-out [&_svg]:size-xs", className),
7592
+ 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
7593
  ref,
7490
7594
  ...props,
7491
7595
  children: inner
@@ -7666,7 +7770,7 @@ function useMediaQuery(deviceName) {
7666
7770
  }
7667
7771
  //#endregion
7668
7772
  //#region src/hooks/theme/theme.constants.ts
7669
- const THEME_STORAGE_KEY = "dawn-ui-theme";
7773
+ const THEME_STORAGE_KEY = "ixia-ui-theme";
7670
7774
  const DEFAULT_THEME = "light";
7671
7775
  const getThemeByValue = (value, themes) => themes.find((themeItem) => themeItem.value === value);
7672
7776
  //#endregion
@@ -7893,7 +7997,7 @@ function SidebarMenuButton({ isActive, className, ref, ...props }) {
7893
7997
  return /* @__PURE__ */ jsx("button", {
7894
7998
  type: "button",
7895
7999
  "data-active": String(Boolean(isActive)),
7896
- className: cn("inline-flex cursor-pointer items-center gap-2xs rounded-xl 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),
8000
+ 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
8001
  ref,
7898
8002
  ...props
7899
8003
  });
@@ -8218,6 +8322,13 @@ const SliderGroup = Object.assign(SliderGroup$1, {
8218
8322
  });
8219
8323
  //#endregion
8220
8324
  //#region src/components/table/table.types.ts
8325
+ const tableContainerVariants = cva("group/table flex min-w-0 flex-col gap-md", {
8326
+ defaultVariants: { variant: "outline" },
8327
+ variants: { variant: {
8328
+ ghost: "",
8329
+ outline: "overflow-hidden rounded-2xl border border-border"
8330
+ } }
8331
+ });
8221
8332
  const stringFilterOperators = [
8222
8333
  "equals",
8223
8334
  "notEquals",
@@ -8275,7 +8386,7 @@ function getColumnHeaderLabel(column) {
8275
8386
  function asFilterValue(value) {
8276
8387
  return value;
8277
8388
  }
8278
- const ZERO = 0;
8389
+ const ZERO$1 = 0;
8279
8390
  const FIRST_RANGE_INDEX$1 = 0;
8280
8391
  const SECOND_RANGE_INDEX = 1;
8281
8392
  const getDateTimestamp = (date) => Date.UTC(date.getFullYear(), date.getMonth(), date.getDate());
@@ -8292,8 +8403,8 @@ const parseToTimestamp = (value) => {
8292
8403
  const normalizeDataValue = (value) => {
8293
8404
  if (value instanceof Date) return getDateTimestamp(value);
8294
8405
  if (typeof value === "number") return getDateTimestamp(new Date(value));
8295
- if (typeof value === "string") return parseToTimestamp(value) ?? ZERO;
8296
- return ZERO;
8406
+ if (typeof value === "string") return parseToTimestamp(value) ?? ZERO$1;
8407
+ return ZERO$1;
8297
8408
  };
8298
8409
  const dateFilterFn = constructFilterFn({
8299
8410
  autoRemove: (value) => !value || !value.date[FIRST_RANGE_INDEX$1] && !value.date[SECOND_RANGE_INDEX],
@@ -8376,6 +8487,25 @@ const features = tableFeatures({
8376
8487
  columnMeta: metaHelper(),
8377
8488
  columnSizingFeature,
8378
8489
  columnVisibilityFeature,
8490
+ datasetPlugin: {
8491
+ constructTableAPIs: (table) => {
8492
+ const options = table.options;
8493
+ assignTableAPIs("datasetPlugin", table, { table_setCurrentDataset: { fn: (updater) => {
8494
+ const safeUpdater = (old) => functionalUpdate(updater, old);
8495
+ return options.onCurrentDatasetChange?.(safeUpdater);
8496
+ } } });
8497
+ },
8498
+ getDefaultTableOptions: (table) => ({ onCurrentDatasetChange: makeStateUpdater("currentDataset", table) }),
8499
+ getInitialState: (initialState) => ({
8500
+ currentDataset: {
8501
+ data: [],
8502
+ id: "",
8503
+ name: ""
8504
+ },
8505
+ datasets: [],
8506
+ ...initialState
8507
+ })
8508
+ },
8379
8509
  facetedRowModel: createFacetedRowModel(),
8380
8510
  facetedUniqueValues: createFacetedUniqueValues(),
8381
8511
  filterFns: {
@@ -8447,6 +8577,21 @@ const features = tableFeatures({
8447
8577
  }
8448
8578
  }), { tableContext, cellContext, headerContext, useTableContext: useTableContext$2, useCellContext: useCellContext$2, useHeaderContext: useHeaderContext$2 } = createTableHookContexts();
8449
8579
  //#endregion
8580
+ //#region src/components/table/table-avatar-cell.tsx
8581
+ function TableAvatarCell({ fallback, className, children, ref, ...props }) {
8582
+ const value = useCellContext$2().getValue();
8583
+ return /* @__PURE__ */ jsxs(Avatar, {
8584
+ className: cn("", className),
8585
+ ref,
8586
+ ...props,
8587
+ children: [
8588
+ /* @__PURE__ */ jsx(Avatar.Image, { src: value }),
8589
+ fallback && /* @__PURE__ */ jsx(Avatar.Fallback, { children: fallback }),
8590
+ children
8591
+ ]
8592
+ });
8593
+ }
8594
+ //#endregion
8450
8595
  //#region src/components/table/table-badge-cell.tsx
8451
8596
  function resolveTone(tone, value) {
8452
8597
  if (typeof tone === "function") return tone(value);
@@ -8465,17 +8610,13 @@ function TableBadgeCell({ className, children, ref, tone, ...props }) {
8465
8610
  }
8466
8611
  //#endregion
8467
8612
  //#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
8613
  function TableBody({ showDivider = true, className, ref, ...props }) {
8473
8614
  const table = useTableContext$2();
8474
8615
  return /* @__PURE__ */ jsx(table.Subscribe, {
8475
8616
  selector: (state) => state,
8476
8617
  children: (state) => {
8477
8618
  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),
8619
+ 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
8620
  children: table.getRowModel().rows.map((row) => /* @__PURE__ */ jsx("li", {
8480
8621
  className: "min-w-0",
8481
8622
  children: row.getVisibleCells().map((cell) => /* @__PURE__ */ jsx(table.AppCell, {
@@ -8488,16 +8629,16 @@ function TableBody({ showDivider = true, className, ref, ...props }) {
8488
8629
  }, row.id))
8489
8630
  });
8490
8631
  return /* @__PURE__ */ jsx("tbody", {
8491
- className: cn(showDivider && "divide-y divide-border", "overflow-y-auto", className),
8632
+ className: cn(showDivider && "divide-y divide-border", "overflow-y-auto border-border group-data-[variant=outline]/table:last:border-b", className),
8492
8633
  ref,
8493
8634
  ...props,
8494
8635
  children: table.getRowModel().rows.map((row) => /* @__PURE__ */ jsx("tr", {
8495
- style: { backgroundColor: getRowBackgroundColor(row.getIsSelected()) },
8636
+ className: cn(row.getIsSelected() && "bg-neutral-container-low"),
8496
8637
  children: row.getVisibleCells().map((cell) => /* @__PURE__ */ jsx(table.AppCell, {
8497
8638
  cell,
8498
8639
  children: (renderedCell) => /* @__PURE__ */ jsx("td", {
8499
8640
  style: { width: renderedCell.column.getSize() },
8500
- className: cn("h-xl px-xs first:rounded-l-xl last:rounded-r-xl", className),
8641
+ className: cn("h-2xl p-xs", className),
8501
8642
  children: /* @__PURE__ */ jsx(table.FlexRender, { cell: renderedCell })
8502
8643
  })
8503
8644
  }, cell.id))
@@ -8507,24 +8648,70 @@ function TableBody({ showDivider = true, className, ref, ...props }) {
8507
8648
  });
8508
8649
  }
8509
8650
  //#endregion
8651
+ //#region src/components/table/table-boolean-cell.tsx
8652
+ function TableBooleanCell({ trueLabel = "Yes", falseLabel = "No", children, ...props }) {
8653
+ const value = useCellContext$2().getValue();
8654
+ if (value === void 0 || value === null) return;
8655
+ return /* @__PURE__ */ jsxs("span", {
8656
+ ...props,
8657
+ children: [
8658
+ children,
8659
+ value && trueLabel,
8660
+ !value && falseLabel
8661
+ ]
8662
+ });
8663
+ }
8664
+ //#endregion
8665
+ //#region src/components/table/table-bottom-bar.tsx
8666
+ function TableBottomBar({ sticky = false, className, ref, ...props }) {
8667
+ return /* @__PURE__ */ jsx("div", {
8668
+ 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),
8669
+ "data-slot": "table-bottom-bar",
8670
+ ref,
8671
+ ...props
8672
+ });
8673
+ }
8674
+ //#endregion
8510
8675
  //#region src/components/table/table-checkbox-cell.tsx
8511
8676
  function TableCheckboxCell({ className, ref, ...props }) {
8512
8677
  const cell = useCellContext$2(), table = useTableContext$2(), { row } = cell;
8513
8678
  return /* @__PURE__ */ jsx(table.Subscribe, {
8514
8679
  selector: (state) => state.rowSelection,
8515
8680
  children: () => /* @__PURE__ */ jsx(Checkbox, {
8681
+ variant: "outline",
8516
8682
  "aria-label": "Select row",
8517
8683
  checked: row.getIsSelected() || row.getCanSelectSubRows() && row.getIsAllSubRowsSelected(),
8518
8684
  disabled: !row.getCanSelect(),
8519
8685
  indeterminate: row.getIsSomeSelected(),
8520
8686
  onCheckedChange: (checked) => row.toggleSelected(checked),
8521
- className: cn("", className),
8687
+ className: cn("mx-auto flex", className),
8522
8688
  ref,
8523
8689
  ...props
8524
8690
  })
8525
8691
  });
8526
8692
  }
8527
8693
  //#endregion
8694
+ //#region src/components/table/table-checkbox-header.tsx
8695
+ function TableCheckboxHeader({ className, ref, ...props }) {
8696
+ const table = useTableContext$2();
8697
+ return /* @__PURE__ */ jsx(table.Subscribe, {
8698
+ selector: (state) => state.rowSelection,
8699
+ children: () => {
8700
+ const allRowsSelected = table.getIsAllRowsSelected();
8701
+ return /* @__PURE__ */ jsx(Checkbox, {
8702
+ "aria-label": "Select all rows",
8703
+ variant: "outline",
8704
+ checked: allRowsSelected,
8705
+ indeterminate: !allRowsSelected && table.getIsSomeRowsSelected(),
8706
+ onCheckedChange: (checked) => table.toggleAllRowsSelected(checked),
8707
+ className: cn("mx-auto flex", className),
8708
+ ref,
8709
+ ...props
8710
+ });
8711
+ }
8712
+ });
8713
+ }
8714
+ //#endregion
8528
8715
  //#region src/components/table/table-column-toggle.tsx
8529
8716
  function TableColumnToggle({ className, ref, ...props }) {
8530
8717
  const table = useTableContext$2(), handleToggleColumn = (columnId) => {
@@ -8545,22 +8732,127 @@ function TableColumnToggle({ className, ref, ...props }) {
8545
8732
  }
8546
8733
  //#endregion
8547
8734
  //#region src/components/table/table-container.tsx
8548
- function TableContainer({ className, ref, ...props }) {
8735
+ function TableContainer({ variant = "outline", className, ref, ...props }) {
8549
8736
  return /* @__PURE__ */ jsx("div", {
8550
- className: cn("flex flex-col gap-xs", className),
8737
+ "data-slot": "table-container",
8738
+ "data-variant": variant,
8739
+ className: cn(tableContainerVariants({ variant }), className),
8551
8740
  ref,
8552
8741
  ...props
8553
8742
  });
8554
8743
  }
8555
8744
  //#endregion
8556
- //#region src/components/table/table-date-cell.tsx
8557
- function TableDateCell({ className, children, ref, ...props }) {
8558
- const cell = useCellContext$2();
8745
+ //#region src/components/table/table-currency-cell.tsx
8746
+ function TableCurrencyCell({ currency, locale, options, children, ...props }) {
8747
+ const value = useCellContext$2().getValue();
8748
+ if (value === void 0 || value === null) return;
8749
+ return /* @__PURE__ */ jsxs("span", {
8750
+ ...props,
8751
+ children: [children, new Intl.NumberFormat(locale, {
8752
+ ...options,
8753
+ currency,
8754
+ style: "currency"
8755
+ }).format(value)]
8756
+ });
8757
+ }
8758
+ //#endregion
8759
+ //#region src/components/table/table-dataset-tab.tsx
8760
+ function TableDatasetTab({ className, children, ref, ...props }) {
8761
+ const table = useTableContext$2(), datasets = useSelector(table.atoms.datasets), currentDataset = useSelector(table.atoms.currentDataset), handleTabChange = (datasetId) => {
8762
+ const dataset = datasets.find((candidate) => candidate.id === datasetId);
8763
+ if (!dataset) return;
8764
+ table.setCurrentDataset(dataset);
8765
+ };
8766
+ return /* @__PURE__ */ jsxs(Tabs$2, {
8767
+ value: currentDataset.id,
8768
+ onValueChange: handleTabChange,
8769
+ className: cn("[[data-slot=table-container]>&]:-mb-md", className),
8770
+ ref,
8771
+ ...props,
8772
+ "data-slot": "table-dataset-tab",
8773
+ children: [children, /* @__PURE__ */ jsx(TabsList, { children: datasets.map((dataset) => /* @__PURE__ */ jsx(TabsTab, {
8774
+ value: dataset.id,
8775
+ children: dataset.name
8776
+ }, dataset.id)) })]
8777
+ });
8778
+ }
8779
+ //#endregion
8780
+ //#region src/components/table/table-date-time-cell.tsx
8781
+ function TableDateTimeCell({ locale, options, className, children, ref, ...props }) {
8782
+ const date = useCellContext$2().getValue();
8783
+ if (!date) return;
8784
+ if (Number.isNaN(date.getTime())) return "Invalid date";
8559
8785
  return /* @__PURE__ */ jsxs("span", {
8560
8786
  className: cn("", className),
8561
8787
  ref,
8562
8788
  ...props,
8563
- children: [children, cell.getValue().toLocaleDateString()]
8789
+ children: [children, formatDate(date, locale, options)]
8790
+ });
8791
+ }
8792
+ //#endregion
8793
+ //#region src/components/table/table-empty.tsx
8794
+ const EMPTY_LIMIT = 0;
8795
+ function TableEmpty({ className, children, ref, ...props }) {
8796
+ const table = useTableContext$2();
8797
+ return /* @__PURE__ */ jsx(table.Subscribe, {
8798
+ selector: (state) => state.globalFilter,
8799
+ children: () => table.getFilteredRowModel().rows.length <= EMPTY_LIMIT && /* @__PURE__ */ jsx("div", {
8800
+ "data-slot": "table-empty",
8801
+ className: cn("flex w-full min-w-0 flex-col items-center justify-center gap-md px-md py-3xl text-center", className),
8802
+ ref,
8803
+ ...props,
8804
+ children
8805
+ })
8806
+ });
8807
+ }
8808
+ //#endregion
8809
+ //#region src/components/table/table-empty-content.tsx
8810
+ function TableEmptyContent({ className, children, ref, ...props }) {
8811
+ return /* @__PURE__ */ jsx("div", {
8812
+ className: cn("flex w-full max-w-[28rem] min-w-0 flex-col items-center gap-2xs", className),
8813
+ ref,
8814
+ ...props,
8815
+ children
8816
+ });
8817
+ }
8818
+ //#endregion
8819
+ //#region src/components/table/table-empty-description.tsx
8820
+ function TableEmptyDescription({ className, children, ref, ...props }) {
8821
+ return /* @__PURE__ */ jsx("span", {
8822
+ className: cn("block max-w-[28rem] style-text-default--1 text-pretty wrap-break-word text-on-surface-variant", className),
8823
+ ref,
8824
+ ...props,
8825
+ children
8826
+ });
8827
+ }
8828
+ //#endregion
8829
+ //#region src/components/table/table-empty-footer.tsx
8830
+ function TableEmptyFooter({ className, children, ref, ...props }) {
8831
+ return /* @__PURE__ */ jsx("div", {
8832
+ className: cn("flex w-full flex-wrap items-center justify-center gap-xs", className),
8833
+ ref,
8834
+ ...props,
8835
+ children
8836
+ });
8837
+ }
8838
+ //#endregion
8839
+ //#region src/components/table/table-empty-header.tsx
8840
+ function TableEmptyHeader({ className, children, ref, ...props }) {
8841
+ return /* @__PURE__ */ jsx("div", {
8842
+ className: cn("flex w-full max-w-[28rem] flex-col items-center gap-sm", className),
8843
+ ref,
8844
+ ...props,
8845
+ children
8846
+ });
8847
+ }
8848
+ //#endregion
8849
+ //#region src/components/table/table-empty-title.tsx
8850
+ function TableEmptyTitle({ className, children, ref, ...props }) {
8851
+ return /* @__PURE__ */ jsx("span", {
8852
+ className: cn("block style-text-strong-1 text-balance text-on-surface", className),
8853
+ ref,
8854
+ ...props,
8855
+ children
8564
8856
  });
8565
8857
  }
8566
8858
  //#endregion
@@ -8600,28 +8892,28 @@ function TableDateFilterForm({ column, className, children, ref, ...props }) {
8600
8892
  ...props,
8601
8893
  children: /* @__PURE__ */ jsxs(form.AppForm, { children: [
8602
8894
  children,
8603
- /* @__PURE__ */ jsx(form.FormErrors, {}),
8604
- /* @__PURE__ */ jsx(form.FormSet, { children: /* @__PURE__ */ jsx(form.FormSetHeading, { children: /* @__PURE__ */ jsx(form.FormSetContent, { children: /* @__PURE__ */ jsx(Field, { children: /* @__PURE__ */ jsx(form.AppField, {
8895
+ /* @__PURE__ */ jsx(form.Errors, {}),
8896
+ /* @__PURE__ */ jsx(form.Set, { children: /* @__PURE__ */ jsx(form.SetHeading, { children: /* @__PURE__ */ jsx(form.SetContent, { children: /* @__PURE__ */ jsx(Field, { children: /* @__PURE__ */ jsx(form.AppField, {
8605
8897
  name: "filterOperator",
8606
- children: (field) => /* @__PURE__ */ jsxs(Field, { children: [/* @__PURE__ */ jsx(field.FieldErrors, {}), /* @__PURE__ */ jsx(field.FieldRadioGroup, { children: dateFilterOperators.map((operator) => /* @__PURE__ */ jsxs(field.FieldSet, { children: [/* @__PURE__ */ jsx(Radio, {
8898
+ 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
8899
  value: operator,
8608
8900
  variant: "inSurface",
8609
8901
  children: filterOperatorLabels?.[operator] ?? defaultFilterOperatorLabels[operator]
8610
8902
  }), field.state.value === operator && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(form.AppField, {
8611
8903
  name: "filterValueFrom",
8612
- children: (valueField) => /* @__PURE__ */ jsxs(Field, { children: [/* @__PURE__ */ jsx(valueField.FieldErrors, {}), /* @__PURE__ */ jsx(valueField.FieldInput, {
8904
+ children: (valueField) => /* @__PURE__ */ jsxs(Field, { children: [/* @__PURE__ */ jsx(valueField.Errors, {}), /* @__PURE__ */ jsx(valueField.Input, {
8613
8905
  type: "date",
8614
8906
  variant: "secondary"
8615
8907
  })] })
8616
8908
  }), operator === "between" && /* @__PURE__ */ jsx(form.AppField, {
8617
8909
  name: "filterValueTo",
8618
- children: (valueField) => /* @__PURE__ */ jsxs(Field, { children: [/* @__PURE__ */ jsx(valueField.FieldErrors, {}), /* @__PURE__ */ jsx(valueField.FieldInput, {
8910
+ children: (valueField) => /* @__PURE__ */ jsxs(Field, { children: [/* @__PURE__ */ jsx(valueField.Errors, {}), /* @__PURE__ */ jsx(valueField.Input, {
8619
8911
  type: "date",
8620
8912
  variant: "secondary"
8621
8913
  })] })
8622
8914
  })] })] }, operator)) })] })
8623
8915
  }) }) }) }) }),
8624
- /* @__PURE__ */ jsxs(form.FormFooter, { children: [/* @__PURE__ */ jsx(form.FormReset, { children: buttonLabels.reset }), /* @__PURE__ */ jsx(form.FormSubmit, { children: buttonLabels.apply })] })
8916
+ /* @__PURE__ */ jsxs(form.Footer, { children: [/* @__PURE__ */ jsx(form.Reset, { children: buttonLabels.reset }), /* @__PURE__ */ jsx(form.Submit, { children: buttonLabels.apply })] })
8625
8917
  ] })
8626
8918
  });
8627
8919
  }
@@ -8699,30 +8991,30 @@ function TableNumberFilterForm({ column, className, children, ref, ...props }) {
8699
8991
  ...props,
8700
8992
  children: /* @__PURE__ */ jsxs(form.AppForm, { children: [
8701
8993
  children,
8702
- /* @__PURE__ */ jsx(form.FormErrors, {}),
8703
- /* @__PURE__ */ jsx(form.FormSet, { children: /* @__PURE__ */ jsx(form.FormSetContent, { children: /* @__PURE__ */ jsx(form.AppField, {
8994
+ /* @__PURE__ */ jsx(form.Errors, {}),
8995
+ /* @__PURE__ */ jsx(form.Set, { children: /* @__PURE__ */ jsx(form.SetContent, { children: /* @__PURE__ */ jsx(form.AppField, {
8704
8996
  name: "filterOperator",
8705
- children: (field) => /* @__PURE__ */ jsxs(Field, { children: [/* @__PURE__ */ jsx(field.FieldErrors, {}), /* @__PURE__ */ jsx(field.FieldRadioGroup, { children: numberFilterOperators.map((operator) => /* @__PURE__ */ jsxs(field.FieldSet, { children: [/* @__PURE__ */ jsx(Radio, {
8997
+ 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
8998
  value: operator,
8707
8999
  variant: "inSurface",
8708
9000
  children: filterOperatorLabels?.[operator] ?? defaultFilterOperatorLabels[operator]
8709
9001
  }), field.state.value === operator && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(form.AppField, {
8710
9002
  name: "filterValueFrom",
8711
- children: (valueField) => /* @__PURE__ */ jsxs(Field, { children: [/* @__PURE__ */ jsx(valueField.FieldErrors, {}), /* @__PURE__ */ jsx(valueField.FieldInput, {
9003
+ children: (valueField) => /* @__PURE__ */ jsxs(Field, { children: [/* @__PURE__ */ jsx(valueField.Errors, {}), /* @__PURE__ */ jsx(valueField.Input, {
8712
9004
  "aria-label": `${column.id} filter value`,
8713
9005
  type: "number",
8714
9006
  variant: "secondary"
8715
9007
  })] })
8716
9008
  }), operator === "between" && /* @__PURE__ */ jsx(form.AppField, {
8717
9009
  name: "filterValueTo",
8718
- children: (valueField) => /* @__PURE__ */ jsxs(Field, { children: [/* @__PURE__ */ jsx(valueField.FieldErrors, {}), /* @__PURE__ */ jsx(valueField.FieldInput, {
9010
+ children: (valueField) => /* @__PURE__ */ jsxs(Field, { children: [/* @__PURE__ */ jsx(valueField.Errors, {}), /* @__PURE__ */ jsx(valueField.Input, {
8719
9011
  "aria-label": `${column.id} maximum filter value`,
8720
9012
  type: "number",
8721
9013
  variant: "secondary"
8722
9014
  })] })
8723
9015
  })] })] }, operator)) })] })
8724
9016
  }) }) }),
8725
- /* @__PURE__ */ jsxs(form.FormFooter, { children: [/* @__PURE__ */ jsx(form.FormReset, { children: buttonLabels.reset }), /* @__PURE__ */ jsx(form.FormSubmit, { children: buttonLabels.apply })] })
9017
+ /* @__PURE__ */ jsxs(form.Footer, { children: [/* @__PURE__ */ jsx(form.Reset, { children: buttonLabels.reset }), /* @__PURE__ */ jsx(form.Submit, { children: buttonLabels.apply })] })
8726
9018
  ] })
8727
9019
  });
8728
9020
  }
@@ -8834,7 +9126,6 @@ function TableSelectFilterChip({ column, className, children, ref, ...props }) {
8834
9126
  ref,
8835
9127
  ...props,
8836
9128
  children: /* @__PURE__ */ jsxs(Button, {
8837
- tone: "neutral",
8838
9129
  size: "extraSmall",
8839
9130
  variant: "soft",
8840
9131
  children: [
@@ -8886,22 +9177,22 @@ function TableStringFilterForm({ column, className, children, ref, ...props }) {
8886
9177
  ...props,
8887
9178
  children: /* @__PURE__ */ jsxs(form.AppForm, { children: [
8888
9179
  children,
8889
- /* @__PURE__ */ jsx(form.FormErrors, {}),
8890
- /* @__PURE__ */ jsx(form.FormSet, { children: /* @__PURE__ */ jsx(form.FormSetContent, { children: /* @__PURE__ */ jsx(form.AppField, {
9180
+ /* @__PURE__ */ jsx(form.Errors, {}),
9181
+ /* @__PURE__ */ jsx(form.Set, { children: /* @__PURE__ */ jsx(form.SetContent, { children: /* @__PURE__ */ jsx(form.AppField, {
8891
9182
  name: "filterOperator",
8892
- children: (field) => /* @__PURE__ */ jsxs(Field, { children: [/* @__PURE__ */ jsx(field.FieldErrors, {}), /* @__PURE__ */ jsx(field.FieldRadioGroup, { children: stringFilterOperators.map((operator) => /* @__PURE__ */ jsxs(field.FieldSet, { children: [/* @__PURE__ */ jsx(Radio, {
9183
+ 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
9184
  value: operator,
8894
9185
  variant: "inSurface",
8895
9186
  children: filterOperatorLabels?.[operator] ?? defaultFilterOperatorLabels[operator]
8896
9187
  }), field.state.value === operator && /* @__PURE__ */ jsx(form.AppField, {
8897
9188
  name: "filterValue",
8898
- children: (valueField) => /* @__PURE__ */ jsxs(Field, { children: [/* @__PURE__ */ jsx(valueField.FieldErrors, {}), /* @__PURE__ */ jsx(valueField.FieldInput, {
9189
+ children: (valueField) => /* @__PURE__ */ jsxs(Field, { children: [/* @__PURE__ */ jsx(valueField.Errors, {}), /* @__PURE__ */ jsx(valueField.Input, {
8899
9190
  "aria-label": `${column.id} filter value`,
8900
9191
  variant: "secondary"
8901
9192
  })] })
8902
9193
  })] }, operator)) })] })
8903
9194
  }) }) }),
8904
- /* @__PURE__ */ jsxs(form.FormFooter, { children: [/* @__PURE__ */ jsx(form.FormReset, { children: buttonLabels.reset }), /* @__PURE__ */ jsx(form.FormSubmit, { children: buttonLabels.apply })] })
9195
+ /* @__PURE__ */ jsxs(form.Footer, { children: [/* @__PURE__ */ jsx(form.Reset, { children: buttonLabels.reset }), /* @__PURE__ */ jsx(form.Submit, { children: buttonLabels.apply })] })
8905
9196
  ] })
8906
9197
  });
8907
9198
  }
@@ -8972,7 +9263,7 @@ function TableFilterMenu({ className, ref, ...props }) {
8972
9263
  children: table.getAllColumns().filter((column) => column.getCanFilter()).map((column) => {
8973
9264
  const { filterVariant } = column.columnDef.meta ?? {};
8974
9265
  return /* @__PURE__ */ jsxs(Popover, { children: [/* @__PURE__ */ jsx(PopoverTrigger, {
8975
- nativeButton: false,
9266
+ nativeButton: true,
8976
9267
  children: /* @__PURE__ */ jsx(MenuItem, {
8977
9268
  closeOnClick: false,
8978
9269
  children: getColumnHeaderLabel(column)
@@ -9009,8 +9300,9 @@ function TableFirstPage({ className, children, ref, ...props }) {
9009
9300
  disabled: !table.getCanPreviousPage(),
9010
9301
  onClick: handleClick,
9011
9302
  ref,
9012
- variant: "ghost",
9303
+ variant: "outline",
9013
9304
  tone: "neutral",
9305
+ size: "iconMedium",
9014
9306
  ...props,
9015
9307
  children: [children, /* @__PURE__ */ jsx(CaretLineLeftIcon, { weight: "bold" })]
9016
9308
  });
@@ -9020,13 +9312,14 @@ function TableFirstPage({ className, children, ref, ...props }) {
9020
9312
  function TableFooter({ className, children, ref, ...props }) {
9021
9313
  const table = useTableContext$2();
9022
9314
  return /* @__PURE__ */ jsxs("tfoot", {
9023
- className: cn("", className),
9315
+ className: cn("border-t border-border bg-neutral-container-low", className),
9024
9316
  ref,
9025
9317
  ...props,
9026
9318
  children: [children, table.getFooterGroups().map((footerGroup) => /* @__PURE__ */ jsx("tr", { children: footerGroup.headers.map((header) => /* @__PURE__ */ jsx(table.AppFooter, {
9027
9319
  header,
9028
9320
  children: (footer) => /* @__PURE__ */ jsx("td", {
9029
9321
  style: { width: footer.getSize() },
9322
+ className: "p-xs",
9030
9323
  colSpan: footer.colSpan,
9031
9324
  children: /* @__PURE__ */ jsx(table.FlexRender, { footer })
9032
9325
  })
@@ -9042,7 +9335,7 @@ function TableHeader({ className, children, ref, ...props }) {
9042
9335
  children: (state) => {
9043
9336
  if (state.viewMode === "grid") return;
9044
9337
  return /* @__PURE__ */ jsxs("thead", {
9045
- className: cn("bg-neutral-container"),
9338
+ className: cn("border-border bg-neutral-container-low group-data-[variant=outline]/table:border-b", className),
9046
9339
  ref,
9047
9340
  ...props,
9048
9341
  children: [children, table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx("tr", { children: headerGroup.headers.map((header) => /* @__PURE__ */ jsx(table.AppHeader, {
@@ -9052,11 +9345,11 @@ function TableHeader({ className, children, ref, ...props }) {
9052
9345
  const sorting = renderHeader.column.getIsSorted();
9053
9346
  return /* @__PURE__ */ jsx("th", {
9054
9347
  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-high hover:*:text-neutral-on-container", renderHeader.isPlaceholder && "cursor-default", className),
9348
+ 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
9349
  colSpan: renderHeader.colSpan,
9057
9350
  onClick: renderHeader.column.getToggleSortingHandler(),
9058
9351
  children: !renderHeader.isPlaceholder && /* @__PURE__ */ jsxs("div", {
9059
- className: cn("flex items-center justify-between gap-2xs whitespace-nowrap [&_svg]:size-sm", renderHeader.column.getCanSort() && "select-none hover:cursor-pointer"),
9352
+ 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
9353
  children: [
9061
9354
  /* @__PURE__ */ jsx("div", {
9062
9355
  className: "flex items-center gap-2xs",
@@ -9099,22 +9392,37 @@ function TableLastPage({ className, children, ref, ...props }) {
9099
9392
  disabled: !table.getCanNextPage(),
9100
9393
  onClick: handleClick,
9101
9394
  ref,
9102
- variant: "ghost",
9395
+ variant: "outline",
9103
9396
  tone: "neutral",
9397
+ size: "iconMedium",
9104
9398
  ...props,
9105
9399
  children: [children, /* @__PURE__ */ jsx(CaretLineRightIcon, { weight: "bold" })]
9106
9400
  });
9107
9401
  }
9108
9402
  //#endregion
9109
- //#region src/components/table/table-nav.tsx
9110
- function TableNav({ sticky = false, className, ref, ...props }) {
9403
+ //#region src/components/table/table-layout.tsx
9404
+ function TableLayout({ className, ref, ...props }) {
9111
9405
  return /* @__PURE__ */ jsx("div", {
9112
- className: cn("flex w-full items-center justify-between gap-md", sticky && "sticky bottom-0 z-10 bg-inherit", className),
9406
+ "data-slot": "table-layout",
9407
+ className: cn("flex min-w-0 flex-col gap-md", className),
9113
9408
  ref,
9114
9409
  ...props
9115
9410
  });
9116
9411
  }
9117
9412
  //#endregion
9413
+ //#region src/components/table/table-link-cell.tsx
9414
+ function TableLinkCell({ className, children, ref, ...props }) {
9415
+ const value = useCellContext$2().getValue();
9416
+ return /* @__PURE__ */ jsx(Button, {
9417
+ variant: "link",
9418
+ type: "button",
9419
+ className: cn("", className),
9420
+ ref,
9421
+ ...props,
9422
+ children: children ?? value
9423
+ });
9424
+ }
9425
+ //#endregion
9118
9426
  //#region src/components/table/table-next-page.tsx
9119
9427
  function TableNextPage({ className, children, ref, ...props }) {
9120
9428
  const table = useTableContext$2(), handleClick = () => {
@@ -9126,7 +9434,8 @@ function TableNextPage({ className, children, ref, ...props }) {
9126
9434
  disabled: !table.getCanNextPage(),
9127
9435
  onClick: handleClick,
9128
9436
  ref,
9129
- variant: "ghost",
9437
+ size: "iconMedium",
9438
+ variant: "outline",
9130
9439
  tone: "neutral",
9131
9440
  ...props,
9132
9441
  children: [children, /* @__PURE__ */ jsx(CaretRightIcon, { weight: "bold" })]
@@ -9175,9 +9484,13 @@ function getTrailingPageIndexes(minimumPages, maximumPages, totalPages) {
9175
9484
  for (let pageIndex = totalPages - maximumPages; pageIndex < totalPages; pageIndex += PAGE_INDEX_INCREMENT) if (pageIndex >= minimumPages) pageIndexes.push(pageIndex);
9176
9485
  return pageIndexes;
9177
9486
  }
9487
+ function getPageButtonTone(pageIndex, selectedPageIndex) {
9488
+ if (pageIndex === selectedPageIndex) return "brand";
9489
+ return "neutral";
9490
+ }
9178
9491
  function getPageButtonVariant(pageIndex, selectedPageIndex) {
9179
9492
  if (pageIndex === selectedPageIndex) return "fill";
9180
- return "ghost";
9493
+ return "outline";
9181
9494
  }
9182
9495
  function TablePaging({ min = DEFAULT_VISIBLE_START_PAGES, max = DEFAULT_VISIBLE_END_PAGES, className, children, ref, ...props }) {
9183
9496
  const table = useTableContext$2(), handleClick = (pageIndex) => {
@@ -9188,14 +9501,13 @@ function TablePaging({ min = DEFAULT_VISIBLE_START_PAGES, max = DEFAULT_VISIBLE_
9188
9501
  children: (pagination) => {
9189
9502
  const totalPages = table.getPageCount(), leadingPageIndexes = getLeadingPageIndexes(min, totalPages), overflowPageIndexes = getOverflowPageIndexes(min, max, totalPages), trailingPageIndexes = getTrailingPageIndexes(min, max, totalPages);
9190
9503
  return /* @__PURE__ */ jsxs("div", {
9191
- className: cn("flex items-center gap-3xs", className),
9504
+ className: cn("flex items-center gap-2xs", className),
9192
9505
  ref,
9193
9506
  ...props,
9194
9507
  children: [
9195
9508
  children,
9196
9509
  leadingPageIndexes.map((pageIndex) => /* @__PURE__ */ jsx(Button, {
9197
- tone: "neutral",
9198
- size: "iconMedium",
9510
+ tone: getPageButtonTone(pageIndex, pagination.pageIndex),
9199
9511
  variant: getPageButtonVariant(pageIndex, pagination.pageIndex),
9200
9512
  className: "shrink-0",
9201
9513
  onClick: () => handleClick(pageIndex),
@@ -9205,7 +9517,7 @@ function TablePaging({ min = DEFAULT_VISIBLE_START_PAGES, max = DEFAULT_VISIBLE_
9205
9517
  "aria-label": "Show more pages",
9206
9518
  tone: "neutral",
9207
9519
  size: "iconMedium",
9208
- variant: "ghost",
9520
+ variant: "outline",
9209
9521
  className: "shrink-0",
9210
9522
  children: /* @__PURE__ */ jsx(DotsThreeIcon, { weight: "bold" })
9211
9523
  }) }), /* @__PURE__ */ jsx(MenuPopup, {
@@ -9223,8 +9535,7 @@ function TablePaging({ min = DEFAULT_VISIBLE_START_PAGES, max = DEFAULT_VISIBLE_
9223
9535
  })
9224
9536
  })] }),
9225
9537
  trailingPageIndexes.map((pageIndex) => /* @__PURE__ */ jsx(Button, {
9226
- tone: "neutral",
9227
- size: "iconMedium",
9538
+ tone: getPageButtonTone(pageIndex, pagination.pageIndex),
9228
9539
  variant: getPageButtonVariant(pageIndex, pagination.pageIndex),
9229
9540
  className: "shrink-0",
9230
9541
  onClick: () => handleClick(pageIndex),
@@ -9236,6 +9547,19 @@ function TablePaging({ min = DEFAULT_VISIBLE_START_PAGES, max = DEFAULT_VISIBLE_
9236
9547
  });
9237
9548
  }
9238
9549
  //#endregion
9550
+ //#region src/components/table/table-percent-cell.tsx
9551
+ function TablePercentCell({ locale, options, children, ...props }) {
9552
+ const value = useCellContext$2().getValue();
9553
+ if (value === void 0 || value === null) return;
9554
+ return /* @__PURE__ */ jsxs("span", {
9555
+ ...props,
9556
+ children: [children, new Intl.NumberFormat(locale, {
9557
+ ...options,
9558
+ style: "percent"
9559
+ }).format(value)]
9560
+ });
9561
+ }
9562
+ //#endregion
9239
9563
  //#region src/components/table/table-previous-page.tsx
9240
9564
  function TablePreviousPage({ className, children, ref, ...props }) {
9241
9565
  const table = useTableContext$2(), handleClick = () => {
@@ -9247,13 +9571,88 @@ function TablePreviousPage({ className, children, ref, ...props }) {
9247
9571
  disabled: !table.getCanPreviousPage(),
9248
9572
  onClick: handleClick,
9249
9573
  ref,
9250
- variant: "ghost",
9574
+ variant: "outline",
9251
9575
  tone: "neutral",
9576
+ size: "iconMedium",
9252
9577
  ...props,
9253
9578
  children: [children, /* @__PURE__ */ jsx(CaretLeftIcon, { weight: "bold" })]
9254
9579
  });
9255
9580
  }
9256
9581
  //#endregion
9582
+ //#region src/components/table/table-progress-cell.tsx
9583
+ function TableProgressCell({ showValue = true, children, ...props }) {
9584
+ const value = useCellContext$2().getValue();
9585
+ if (value === void 0 || value === null) return;
9586
+ return /* @__PURE__ */ jsxs(Meter, {
9587
+ orientation: "horizontal",
9588
+ "aria-label": "Progress",
9589
+ ...props,
9590
+ value,
9591
+ children: [
9592
+ /* @__PURE__ */ jsx(Meter.Track, { children: /* @__PURE__ */ jsx(Meter.Indicator, {}) }),
9593
+ showValue && /* @__PURE__ */ jsx(Meter.Value, {}),
9594
+ children
9595
+ ]
9596
+ });
9597
+ }
9598
+ //#endregion
9599
+ //#region src/components/table/table-relative-time-cell.tsx
9600
+ const MILLISECONDS_PER_SECOND = 1e3;
9601
+ const ZERO = 0;
9602
+ const SECONDS_PER_SECOND = 1;
9603
+ const RELATIVE_TIME_UNITS = [
9604
+ ["year", 31536e3],
9605
+ ["month", 2592e3],
9606
+ ["week", 604800],
9607
+ ["day", 86400],
9608
+ ["hour", 3600],
9609
+ ["minute", 60],
9610
+ ["second", SECONDS_PER_SECOND]
9611
+ ];
9612
+ function formatRelativeTime(date, now, { locale, options }) {
9613
+ 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;
9614
+ return new Intl.RelativeTimeFormat(locale, {
9615
+ numeric: "auto",
9616
+ ...options
9617
+ }).format(amount, unit);
9618
+ }
9619
+ function TableRelativeTimeCell({ locale, options, now, children, ...props }) {
9620
+ const date = useCellContext$2().getValue(), [mountedAt] = useState(() => /* @__PURE__ */ new Date()), referenceDate = now ?? mountedAt;
9621
+ if (!date) return;
9622
+ if (Number.isNaN(date.getTime())) return "Invalid date";
9623
+ if (Number.isNaN(referenceDate.getTime())) throw new RangeError("TableRelativeTimeCell requires a valid now date");
9624
+ return /* @__PURE__ */ jsxs("time", {
9625
+ dateTime: date.toISOString(),
9626
+ title: date.toLocaleString(locale),
9627
+ ...props,
9628
+ children: [children, formatRelativeTime(date, referenceDate, {
9629
+ locale,
9630
+ options
9631
+ })]
9632
+ });
9633
+ }
9634
+ //#endregion
9635
+ //#region src/components/table/table-results.tsx
9636
+ const EMPTY_ROW_COUNT = 0;
9637
+ const PAGE_NUMBER_OFFSET = 1;
9638
+ function getPageStart(totalRows, pageIndex, pageSize) {
9639
+ if (totalRows === EMPTY_ROW_COUNT) return EMPTY_ROW_COUNT;
9640
+ return pageIndex * pageSize + PAGE_NUMBER_OFFSET;
9641
+ }
9642
+ function getPageEnd(start, pageSize, totalRows) {
9643
+ if (totalRows === EMPTY_ROW_COUNT) return EMPTY_ROW_COUNT;
9644
+ return Math.min(start + pageSize - PAGE_NUMBER_OFFSET, totalRows);
9645
+ }
9646
+ function TableResults({ children, className, ref, ...props }) {
9647
+ 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);
9648
+ return /* @__PURE__ */ jsx("div", {
9649
+ className: cn("flex items-center gap-2xs style-text-default--1 text-on-surface-variant", className),
9650
+ ref,
9651
+ ...props,
9652
+ children: children(start, end, totalRows)
9653
+ });
9654
+ }
9655
+ //#endregion
9257
9656
  //#region src/components/table/table-search.tsx
9258
9657
  function TableSearch({ className, ref, ...props }) {
9259
9658
  const table = useTableContext$2(), handleChange = (event) => {
@@ -9261,33 +9660,17 @@ function TableSearch({ className, ref, ...props }) {
9261
9660
  };
9262
9661
  return /* @__PURE__ */ jsx(table.Subscribe, {
9263
9662
  selector: (state) => state.globalFilter,
9264
- children: (globalFilter) => /* @__PURE__ */ jsxs(InputGroup, { children: [/* @__PURE__ */ jsx(InputGroupAddon, { children: /* @__PURE__ */ jsx(MagnifyingGlassIcon, { weight: "bold" }) }), /* @__PURE__ */ jsx(InputGroupInput, {
9265
- className: cn("", className),
9266
- onChange: handleChange,
9267
- ref,
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),
9663
+ children: (globalFilter) => /* @__PURE__ */ jsxs(InputGroup, {
9664
+ variant: props.variant ?? "outline",
9665
+ className: "flex-1",
9666
+ children: [/* @__PURE__ */ jsx(InputGroupAddon, { children: /* @__PURE__ */ jsx(MagnifyingGlassIcon, { weight: "bold" }) }), /* @__PURE__ */ jsx(InputGroupInput, {
9286
9667
  className: cn("", className),
9668
+ onChange: handleChange,
9287
9669
  ref,
9670
+ value: globalFilter ?? "",
9288
9671
  ...props
9289
- });
9290
- }
9672
+ })]
9673
+ })
9291
9674
  });
9292
9675
  }
9293
9676
  //#endregion
@@ -9324,27 +9707,33 @@ function TableSortMenu({ className, ref, ...props }) {
9324
9707
  //#endregion
9325
9708
  //#region src/components/table/table-sort-chip.tsx
9326
9709
  function TableSortChip({ column, className, children, ref, ...props }) {
9327
- const table = useTableContext$2(), columnSort = column.getIsSorted(), buttonLabels = table.options.meta?.translations?.buttonLabels ?? {}, ascendingLabel = buttonLabels.ascending ?? "Ascending", descendingLabel = buttonLabels.descending ?? "Descending";
9328
- if (!columnSort) return;
9329
- return /* @__PURE__ */ jsx(TableSortMenu, {
9330
- className: cn("", className),
9331
- ref,
9332
- ...props,
9333
- children: /* @__PURE__ */ jsxs(Button, {
9334
- tone: "neutral",
9335
- size: "extraSmall",
9336
- variant: "soft",
9337
- children: [
9338
- columnSort === "asc" && /* @__PURE__ */ jsx(SortDescendingIcon, {}),
9339
- columnSort === "desc" && /* @__PURE__ */ jsx(SortAscendingIcon, {}),
9340
- /* @__PURE__ */ jsx("span", { children: getColumnHeaderLabel(column) }),
9341
- /* @__PURE__ */ jsxs("span", {
9342
- className: "font-light lowercase",
9343
- children: [columnSort === "asc" && ascendingLabel, columnSort === "desc" && descendingLabel]
9344
- }),
9345
- children
9346
- ]
9347
- })
9710
+ const table = useTableContext$2(), buttonLabels = table.options.meta?.translations?.buttonLabels ?? {}, ascendingLabel = buttonLabels.ascending ?? "Ascending", descendingLabel = buttonLabels.descending ?? "Descending";
9711
+ return /* @__PURE__ */ jsx(table.Subscribe, {
9712
+ selector: (state) => state.sorting,
9713
+ children: () => {
9714
+ const columnSort = column.getIsSorted();
9715
+ console.log(columnSort);
9716
+ if (!columnSort) return;
9717
+ return /* @__PURE__ */ jsx(TableSortMenu, {
9718
+ className: cn("", className),
9719
+ ref,
9720
+ ...props,
9721
+ children: /* @__PURE__ */ jsxs(Button, {
9722
+ size: "extraSmall",
9723
+ variant: "soft",
9724
+ children: [
9725
+ columnSort === "asc" && /* @__PURE__ */ jsx(SortDescendingIcon, {}),
9726
+ columnSort === "desc" && /* @__PURE__ */ jsx(SortAscendingIcon, {}),
9727
+ /* @__PURE__ */ jsx("span", { children: getColumnHeaderLabel(column) }),
9728
+ /* @__PURE__ */ jsxs("span", {
9729
+ className: "font-light lowercase",
9730
+ children: [columnSort === "asc" && ascendingLabel, columnSort === "desc" && descendingLabel]
9731
+ }),
9732
+ children
9733
+ ]
9734
+ })
9735
+ });
9736
+ }
9348
9737
  });
9349
9738
  }
9350
9739
  //#endregion
@@ -9366,6 +9755,21 @@ function TableSortList({ className, children, ref, ...props }) {
9366
9755
  });
9367
9756
  }
9368
9757
  //#endregion
9758
+ //#region src/components/table/table-tags-cell.tsx
9759
+ function TableTagsCell({ badgeProps, className, children, ...props }) {
9760
+ const value = useCellContext$2().getValue();
9761
+ if (value === void 0 || value === null) return;
9762
+ return /* @__PURE__ */ jsxs("div", {
9763
+ className: cn("flex flex-wrap gap-3xs", className),
9764
+ ...props,
9765
+ children: [children, value.map((tag, index) => /* @__PURE__ */ jsx(Badge, {
9766
+ variant: "soft",
9767
+ ...badgeProps,
9768
+ children: tag
9769
+ }, `${index}-${tag}`))]
9770
+ });
9771
+ }
9772
+ //#endregion
9369
9773
  //#region src/components/table/table-text-cell.tsx
9370
9774
  function TableTextCell({ className, children, ref, ...props }) {
9371
9775
  const cell = useCellContext$2();
@@ -9378,9 +9782,21 @@ function TableTextCell({ className, children, ref, ...props }) {
9378
9782
  }
9379
9783
  //#endregion
9380
9784
  //#region src/components/table/table-toolbar.tsx
9381
- function TableToolbar({ sticky = false, className, ref, ...props }) {
9785
+ function TableToolbar({ className, ref, ...props }) {
9382
9786
  return /* @__PURE__ */ jsx("div", {
9383
- className: cn("flex items-center gap-3xs", sticky && "sticky top-0 z-10", className),
9787
+ "data-slot": "table-toolbar",
9788
+ 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),
9789
+ ref,
9790
+ ...props
9791
+ });
9792
+ }
9793
+ //#endregion
9794
+ //#region src/components/table/table-top-bar.tsx
9795
+ function TableTopBar({ sticky = false, className, ref, ...props }) {
9796
+ return /* @__PURE__ */ jsx("div", {
9797
+ 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),
9798
+ "data-table-top-bar": "",
9799
+ "data-slot": "table-top-bar",
9384
9800
  ref,
9385
9801
  ...props
9386
9802
  });
@@ -9401,15 +9817,17 @@ function TableViewModeToggle({ className, children, ref, ...props }) {
9401
9817
  }
9402
9818
  //#endregion
9403
9819
  //#region src/components/table/table-viewport.tsx
9404
- function TableViewport({ className, children, ref, ...props }) {
9820
+ function TableViewport({ grow, className, children, ref, ...props }) {
9405
9821
  if (useTableContext$2().state.viewMode === "grid") return /* @__PURE__ */ jsx("div", {
9822
+ "data-slot": "table-viewport",
9406
9823
  className: cn("size-full", className),
9407
9824
  ref,
9408
9825
  ...props,
9409
9826
  children
9410
9827
  });
9411
9828
  return /* @__PURE__ */ jsx("table", {
9412
- className: cn("size-full", className),
9829
+ "data-slot": "table-viewport",
9830
+ 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
9831
  ref,
9414
9832
  ...props,
9415
9833
  children
@@ -9419,12 +9837,20 @@ function TableViewport({ className, children, ref, ...props }) {
9419
9837
  //#region src/components/table/table-context.tsx
9420
9838
  const { createAppColumnHelper, useAppTable, useTableContext: useTableContext$1, useCellContext, useHeaderContext } = createTableHook({
9421
9839
  cellComponents: {
9422
- TableBadgeCell,
9423
- TableCheckboxCell,
9424
- TableDateCell,
9425
- TableImageCell,
9426
- TableNumberCell,
9427
- TableTextCell
9840
+ AvatarCell: TableAvatarCell,
9841
+ BadgeCell: TableBadgeCell,
9842
+ BooleanCell: TableBooleanCell,
9843
+ CheckboxCell: TableCheckboxCell,
9844
+ CurrencyCell: TableCurrencyCell,
9845
+ DateTimeCell: TableDateTimeCell,
9846
+ ImageCell: TableImageCell,
9847
+ LinkCell: TableLinkCell,
9848
+ NumberCell: TableNumberCell,
9849
+ PercentCell: TablePercentCell,
9850
+ ProgressCell: TableProgressCell,
9851
+ RelativeTimeCell: TableRelativeTimeCell,
9852
+ TagsCell: TableTagsCell,
9853
+ TextCell: TableTextCell
9428
9854
  },
9429
9855
  cellContext,
9430
9856
  features,
@@ -9433,49 +9859,43 @@ const { createAppColumnHelper, useAppTable, useTableContext: useTableContext$1,
9433
9859
  if (parent) return `${parent.id}.${index}`;
9434
9860
  return String(index);
9435
9861
  },
9436
- headerComponents: { TableSelectHeader },
9862
+ headerComponents: { TableCheckboxHeader },
9437
9863
  headerContext,
9438
9864
  tableComponents: {
9439
- TableBody,
9440
- TableColumnToggle,
9441
- TableContainer,
9442
- TableFilterList,
9443
- TableFilterMenu,
9444
- TableFirstPage,
9445
- TableFooter,
9446
- TableHeader,
9447
- TableLastPage,
9448
- TableNav,
9449
- TableNextPage,
9450
- TablePagination,
9451
- TablePaging,
9452
- TablePreviousPage,
9453
- TableSearch,
9454
- TableSortList,
9455
- TableSortMenu,
9456
- TableToolbar,
9457
- TableViewModeToggle,
9458
- TableViewport
9865
+ Body: TableBody,
9866
+ BottomBar: TableBottomBar,
9867
+ ColumnToggle: TableColumnToggle,
9868
+ Container: TableContainer,
9869
+ DatasetTab: TableDatasetTab,
9870
+ Empty: TableEmpty,
9871
+ EmptyContent: TableEmptyContent,
9872
+ EmptyDescription: TableEmptyDescription,
9873
+ EmptyFooter: TableEmptyFooter,
9874
+ EmptyHeader: TableEmptyHeader,
9875
+ EmptyTitle: TableEmptyTitle,
9876
+ FilterList: TableFilterList,
9877
+ FilterMenu: TableFilterMenu,
9878
+ FirstPage: TableFirstPage,
9879
+ Footer: TableFooter,
9880
+ Header: TableHeader,
9881
+ LastPage: TableLastPage,
9882
+ Layout: TableLayout,
9883
+ NextPage: TableNextPage,
9884
+ Pagination: TablePagination,
9885
+ Paging: TablePaging,
9886
+ PreviousPage: TablePreviousPage,
9887
+ Results: TableResults,
9888
+ Search: TableSearch,
9889
+ SortList: TableSortList,
9890
+ SortMenu: TableSortMenu,
9891
+ Toolbar: TableToolbar,
9892
+ TopBar: TableTopBar,
9893
+ ViewModeToggle: TableViewModeToggle,
9894
+ Viewport: TableViewport
9459
9895
  },
9460
9896
  tableContext
9461
9897
  });
9462
9898
  //#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
9899
  //#region src/components/toast/anchored-toast-item.tsx
9480
9900
  function AnchoredToastItem({ className, ref, toast, ...props }) {
9481
9901
  return /* @__PURE__ */ jsxs(Toast$1.Root, {
@@ -9581,7 +10001,7 @@ function StackToastItem({ className, ref, toast, ...props }) {
9581
10001
  className: cn("flex aspect-square size-2xl items-center justify-center [&>svg]:size-lg [&>svg]:text-on-surface-inverse", getVariantBgColor(variant)),
9582
10002
  children: getVariantIcon(variant, icon)
9583
10003
  }), /* @__PURE__ */ jsxs(Toast$1.Content, {
9584
- className: "flex items-center justify-center gap-xs 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",
10004
+ 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
10005
  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
10006
  className: "ml-xl flex h-lg grow items-center justify-center gap-xs",
9587
10007
  children: [
@@ -9732,6 +10152,6 @@ function ToggleGroup({ size = "medium", variant, className, ref, ...props }) {
9732
10152
  });
9733
10153
  }
9734
10154
  //#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, TableNav, TableNextPage, TableNumberCell, TableNumberFilterChip, TableNumberFilterForm, TablePagination, TablePaging, TablePreviousPage, TableResults, TableSearch, TableCheckboxCell as TableSelectCell, TableSelectFilterChip, TableSelectFilterForm, TableSelectHeader, TableSortChip, TableSortList, TableSortMenu, TableStringFilterChip, TableStringFilterForm, TableTextCell, TableToolbar, 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 };
10155
+ 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
10156
 
9737
- //# sourceMappingURL=index.mjs.map
10157
+ //# sourceMappingURL=index.js.map