design-zystem 1.0.316 → 1.0.318

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.
Files changed (6) hide show
  1. package/dist/ui/index.d.mts +17 -10
  2. package/dist/ui/index.d.ts +17 -10
  3. package/dist/ui/index.js +76 -25
  4. package/dist/ui/index.mjs +158 -107
  5. package/dist/ui/style.css +1 -1
  6. package/package.json +1 -1
package/dist/ui/index.d.mts CHANGED
@@ -47,7 +47,7 @@ declare const Layout: react.ForwardRefExoticComponent<LayoutProps & react.RefAtt
47
47
  * (DeliverySystem/tailwind.config.ts), jamais un alias sémantique
48
48
  * (primary/secondary/destructive) — cf. CLAUDE.local.md.
49
49
  */
50
- declare const COLOR_TOKENS: readonly ["blue-700", "blue-900", "blue-950", "red-900", "green-700", "grey-600"];
50
+ declare const COLOR_TOKENS: readonly ["blue-700", "blue-900", "blue-950", "red-900", "green-700", "grey-600", "yellow-500"];
51
51
  type ColorToken = (typeof COLOR_TOKENS)[number];
52
52
 
53
53
  declare const boxVariants: (props?: ({
@@ -75,7 +75,7 @@ interface DividerProps extends VariantProps<typeof dividerVariants> {
75
75
  declare const Divider: ({ orientation, className, }: DividerProps) => react.JSX.Element;
76
76
 
77
77
  declare const linkVariants: (props?: ({
78
- color?: "blue-700" | "blue-900" | "blue-950" | "red-900" | "green-700" | "grey-600" | null | undefined;
78
+ color?: "blue-700" | "blue-900" | "blue-950" | "red-900" | "green-700" | "grey-600" | "yellow-500" | null | undefined;
79
79
  size?: "s" | "xs" | "m" | "l" | null | undefined;
80
80
  } & class_variance_authority_types.ClassProp) | undefined) => string;
81
81
  interface LinkProps extends Omit<AnchorHTMLAttributes<HTMLAnchorElement>, 'color'>, VariantProps<typeof linkVariants> {
@@ -86,7 +86,7 @@ declare const Link: react.ForwardRefExoticComponent<LinkProps & react.RefAttribu
86
86
  declare const textVariants: (props?: ({
87
87
  size?: "s" | "xs" | "m" | "l" | "xxs" | "xl" | "xxl" | null | undefined;
88
88
  weight?: "bold" | "normal" | "medium" | "semibold" | null | undefined;
89
- color?: "white" | "blue-700" | "blue-900" | "blue-950" | "red-900" | "green-700" | "grey-600" | "neutral-800" | "grey-500" | null | undefined;
89
+ color?: "white" | "blue-700" | "blue-900" | "blue-950" | "red-900" | "green-700" | "grey-600" | "yellow-500" | "neutral-800" | "grey-500" | null | undefined;
90
90
  align?: "center" | "left" | "right" | null | undefined;
91
91
  lineClamp?: 1 | 2 | 3 | "none" | null | undefined;
92
92
  italic?: boolean | null | undefined;
@@ -236,7 +236,7 @@ declare const IconBadge: react.ForwardRefExoticComponent<IconBadgeProps & react.
236
236
  * `red-900` reste le bordeaux d'état d'erreur. */
237
237
  type ButtonColor = ColorToken | 'red-500';
238
238
  declare const buttonVariants: (props?: ({
239
- color?: "blue-700" | "blue-900" | "blue-950" | "red-900" | "green-700" | "grey-600" | "red-500" | null | undefined;
239
+ color?: "blue-700" | "blue-900" | "blue-950" | "red-900" | "green-700" | "grey-600" | "yellow-500" | "red-500" | null | undefined;
240
240
  look?: "filled" | "outline" | null | undefined;
241
241
  size?: "s" | "m" | "l" | null | undefined;
242
242
  iconOnly?: boolean | null | undefined;
@@ -326,7 +326,7 @@ interface EmailInputProps {
326
326
  declare const EmailInput: ({ label, value, onChange, onInvalidMessage, placeholder, disabled, required, width, className, }: EmailInputProps) => react.JSX.Element;
327
327
 
328
328
  declare const checkboxVariants: (props?: ({
329
- color?: "blue-700" | "blue-900" | "blue-950" | "red-900" | "green-700" | "grey-600" | null | undefined;
329
+ color?: "blue-700" | "blue-900" | "blue-950" | "red-900" | "green-700" | "grey-600" | "yellow-500" | null | undefined;
330
330
  size?: "s" | "m" | "l" | null | undefined;
331
331
  } & class_variance_authority_types.ClassProp) | undefined) => string;
332
332
  interface CheckboxProps extends Omit<React.ComponentPropsWithoutRef<typeof RadixCheckbox.Root>, 'color' | 'onCheckedChange' | 'onChange'>, VariantProps<typeof checkboxVariants> {
@@ -337,7 +337,7 @@ declare const Checkbox: ({ label, color, size, onChange, id, className, ...props
337
337
 
338
338
  declare const trackVariants$1: (props?: ({
339
339
  size?: "s" | "m" | null | undefined;
340
- color?: "blue-700" | "blue-900" | "blue-950" | "red-900" | "green-700" | "grey-600" | null | undefined;
340
+ color?: "blue-700" | "blue-900" | "blue-950" | "red-900" | "green-700" | "grey-600" | "yellow-500" | null | undefined;
341
341
  } & class_variance_authority_types.ClassProp) | undefined) => string;
342
342
  interface SwitchProps extends Omit<React.ComponentPropsWithoutRef<typeof RadixSwitch.Root>, 'color' | 'onCheckedChange' | 'onChange'>, VariantProps<typeof trackVariants$1> {
343
343
  onChange?: (checked: boolean) => void;
@@ -347,7 +347,7 @@ interface SwitchProps extends Omit<React.ComponentPropsWithoutRef<typeof RadixSw
347
347
  declare const Switch: ({ size, color, onChange, label, labelPosition, id, className, ...props }: SwitchProps) => react.JSX.Element;
348
348
 
349
349
  declare const badgeVariants: (props?: ({
350
- color?: "blue-700" | "blue-900" | "blue-950" | "red-900" | "green-700" | "grey-600" | null | undefined;
350
+ color?: "blue-700" | "blue-900" | "blue-950" | "red-900" | "green-700" | "grey-600" | "yellow-500" | null | undefined;
351
351
  size?: "s" | "xs" | "m" | "l" | "xxs" | "xl" | "xxl" | null | undefined;
352
352
  isRound?: boolean | null | undefined;
353
353
  pointer?: boolean | null | undefined;
@@ -509,8 +509,15 @@ interface TableHeaderCellProps {
509
509
  /** Séparateur vertical entre colonnes. */
510
510
  borderLeft?: boolean;
511
511
  className?: string;
512
+ /** Rend la cellule triable — affiche `children` dans un bouton avec une icône
513
+ * de tri (neutre / chevron haut / chevron bas selon `isSort`+`sortOrder`). */
514
+ useSort?: boolean;
515
+ /** Cette colonne est la colonne de tri actuellement active. */
516
+ isSort?: boolean;
517
+ sortOrder?: 'asc' | 'desc' | null;
518
+ onClick?: () => void;
512
519
  }
513
- declare const TableHeaderCell: ({ children, width, sticky, stickyOffset, surface, borderLeft, className, }: TableHeaderCellProps) => react.JSX.Element;
520
+ declare const TableHeaderCell: ({ children, width, sticky, stickyOffset, surface, borderLeft, className, useSort, isSort, sortOrder, onClick, }: TableHeaderCellProps) => react.JSX.Element;
514
521
 
515
522
  interface TableRowProps {
516
523
  children?: ReactNode;
@@ -595,7 +602,7 @@ interface AvatarGroupProps extends HTMLAttributes<HTMLDivElement> {
595
602
  declare const AvatarGroup: ({ size, max, className, children, ...props }: AvatarGroupProps) => react.JSX.Element;
596
603
 
597
604
  declare const radioVariants: (props?: ({
598
- color?: "blue-700" | "blue-900" | "blue-950" | "red-900" | "green-700" | "grey-600" | null | undefined;
605
+ color?: "blue-700" | "blue-900" | "blue-950" | "red-900" | "green-700" | "grey-600" | "yellow-500" | null | undefined;
599
606
  } & class_variance_authority_types.ClassProp) | undefined) => string;
600
607
  interface RadioOption {
601
608
  value: string;
@@ -732,7 +739,7 @@ interface EmptyStateProps {
732
739
  declare const EmptyState: ({ icon, title, description, actionLabel, onAction, className, }: EmptyStateProps) => react.JSX.Element;
733
740
 
734
741
  declare const bannerVariants: (props?: ({
735
- tone?: "blue-700" | "blue-900" | "blue-950" | "red-900" | "green-700" | "grey-600" | null | undefined;
742
+ tone?: "blue-700" | "blue-900" | "blue-950" | "red-900" | "green-700" | "grey-600" | "yellow-500" | null | undefined;
736
743
  } & class_variance_authority_types.ClassProp) | undefined) => string;
737
744
  interface BannerAction {
738
745
  label: string;
package/dist/ui/index.d.ts CHANGED
@@ -47,7 +47,7 @@ declare const Layout: react.ForwardRefExoticComponent<LayoutProps & react.RefAtt
47
47
  * (DeliverySystem/tailwind.config.ts), jamais un alias sémantique
48
48
  * (primary/secondary/destructive) — cf. CLAUDE.local.md.
49
49
  */
50
- declare const COLOR_TOKENS: readonly ["blue-700", "blue-900", "blue-950", "red-900", "green-700", "grey-600"];
50
+ declare const COLOR_TOKENS: readonly ["blue-700", "blue-900", "blue-950", "red-900", "green-700", "grey-600", "yellow-500"];
51
51
  type ColorToken = (typeof COLOR_TOKENS)[number];
52
52
 
53
53
  declare const boxVariants: (props?: ({
@@ -75,7 +75,7 @@ interface DividerProps extends VariantProps<typeof dividerVariants> {
75
75
  declare const Divider: ({ orientation, className, }: DividerProps) => react.JSX.Element;
76
76
 
77
77
  declare const linkVariants: (props?: ({
78
- color?: "blue-700" | "blue-900" | "blue-950" | "red-900" | "green-700" | "grey-600" | null | undefined;
78
+ color?: "blue-700" | "blue-900" | "blue-950" | "red-900" | "green-700" | "grey-600" | "yellow-500" | null | undefined;
79
79
  size?: "s" | "xs" | "m" | "l" | null | undefined;
80
80
  } & class_variance_authority_types.ClassProp) | undefined) => string;
81
81
  interface LinkProps extends Omit<AnchorHTMLAttributes<HTMLAnchorElement>, 'color'>, VariantProps<typeof linkVariants> {
@@ -86,7 +86,7 @@ declare const Link: react.ForwardRefExoticComponent<LinkProps & react.RefAttribu
86
86
  declare const textVariants: (props?: ({
87
87
  size?: "s" | "xs" | "m" | "l" | "xxs" | "xl" | "xxl" | null | undefined;
88
88
  weight?: "bold" | "normal" | "medium" | "semibold" | null | undefined;
89
- color?: "white" | "blue-700" | "blue-900" | "blue-950" | "red-900" | "green-700" | "grey-600" | "neutral-800" | "grey-500" | null | undefined;
89
+ color?: "white" | "blue-700" | "blue-900" | "blue-950" | "red-900" | "green-700" | "grey-600" | "yellow-500" | "neutral-800" | "grey-500" | null | undefined;
90
90
  align?: "center" | "left" | "right" | null | undefined;
91
91
  lineClamp?: 1 | 2 | 3 | "none" | null | undefined;
92
92
  italic?: boolean | null | undefined;
@@ -236,7 +236,7 @@ declare const IconBadge: react.ForwardRefExoticComponent<IconBadgeProps & react.
236
236
  * `red-900` reste le bordeaux d'état d'erreur. */
237
237
  type ButtonColor = ColorToken | 'red-500';
238
238
  declare const buttonVariants: (props?: ({
239
- color?: "blue-700" | "blue-900" | "blue-950" | "red-900" | "green-700" | "grey-600" | "red-500" | null | undefined;
239
+ color?: "blue-700" | "blue-900" | "blue-950" | "red-900" | "green-700" | "grey-600" | "yellow-500" | "red-500" | null | undefined;
240
240
  look?: "filled" | "outline" | null | undefined;
241
241
  size?: "s" | "m" | "l" | null | undefined;
242
242
  iconOnly?: boolean | null | undefined;
@@ -326,7 +326,7 @@ interface EmailInputProps {
326
326
  declare const EmailInput: ({ label, value, onChange, onInvalidMessage, placeholder, disabled, required, width, className, }: EmailInputProps) => react.JSX.Element;
327
327
 
328
328
  declare const checkboxVariants: (props?: ({
329
- color?: "blue-700" | "blue-900" | "blue-950" | "red-900" | "green-700" | "grey-600" | null | undefined;
329
+ color?: "blue-700" | "blue-900" | "blue-950" | "red-900" | "green-700" | "grey-600" | "yellow-500" | null | undefined;
330
330
  size?: "s" | "m" | "l" | null | undefined;
331
331
  } & class_variance_authority_types.ClassProp) | undefined) => string;
332
332
  interface CheckboxProps extends Omit<React.ComponentPropsWithoutRef<typeof RadixCheckbox.Root>, 'color' | 'onCheckedChange' | 'onChange'>, VariantProps<typeof checkboxVariants> {
@@ -337,7 +337,7 @@ declare const Checkbox: ({ label, color, size, onChange, id, className, ...props
337
337
 
338
338
  declare const trackVariants$1: (props?: ({
339
339
  size?: "s" | "m" | null | undefined;
340
- color?: "blue-700" | "blue-900" | "blue-950" | "red-900" | "green-700" | "grey-600" | null | undefined;
340
+ color?: "blue-700" | "blue-900" | "blue-950" | "red-900" | "green-700" | "grey-600" | "yellow-500" | null | undefined;
341
341
  } & class_variance_authority_types.ClassProp) | undefined) => string;
342
342
  interface SwitchProps extends Omit<React.ComponentPropsWithoutRef<typeof RadixSwitch.Root>, 'color' | 'onCheckedChange' | 'onChange'>, VariantProps<typeof trackVariants$1> {
343
343
  onChange?: (checked: boolean) => void;
@@ -347,7 +347,7 @@ interface SwitchProps extends Omit<React.ComponentPropsWithoutRef<typeof RadixSw
347
347
  declare const Switch: ({ size, color, onChange, label, labelPosition, id, className, ...props }: SwitchProps) => react.JSX.Element;
348
348
 
349
349
  declare const badgeVariants: (props?: ({
350
- color?: "blue-700" | "blue-900" | "blue-950" | "red-900" | "green-700" | "grey-600" | null | undefined;
350
+ color?: "blue-700" | "blue-900" | "blue-950" | "red-900" | "green-700" | "grey-600" | "yellow-500" | null | undefined;
351
351
  size?: "s" | "xs" | "m" | "l" | "xxs" | "xl" | "xxl" | null | undefined;
352
352
  isRound?: boolean | null | undefined;
353
353
  pointer?: boolean | null | undefined;
@@ -509,8 +509,15 @@ interface TableHeaderCellProps {
509
509
  /** Séparateur vertical entre colonnes. */
510
510
  borderLeft?: boolean;
511
511
  className?: string;
512
+ /** Rend la cellule triable — affiche `children` dans un bouton avec une icône
513
+ * de tri (neutre / chevron haut / chevron bas selon `isSort`+`sortOrder`). */
514
+ useSort?: boolean;
515
+ /** Cette colonne est la colonne de tri actuellement active. */
516
+ isSort?: boolean;
517
+ sortOrder?: 'asc' | 'desc' | null;
518
+ onClick?: () => void;
512
519
  }
513
- declare const TableHeaderCell: ({ children, width, sticky, stickyOffset, surface, borderLeft, className, }: TableHeaderCellProps) => react.JSX.Element;
520
+ declare const TableHeaderCell: ({ children, width, sticky, stickyOffset, surface, borderLeft, className, useSort, isSort, sortOrder, onClick, }: TableHeaderCellProps) => react.JSX.Element;
514
521
 
515
522
  interface TableRowProps {
516
523
  children?: ReactNode;
@@ -595,7 +602,7 @@ interface AvatarGroupProps extends HTMLAttributes<HTMLDivElement> {
595
602
  declare const AvatarGroup: ({ size, max, className, children, ...props }: AvatarGroupProps) => react.JSX.Element;
596
603
 
597
604
  declare const radioVariants: (props?: ({
598
- color?: "blue-700" | "blue-900" | "blue-950" | "red-900" | "green-700" | "grey-600" | null | undefined;
605
+ color?: "blue-700" | "blue-900" | "blue-950" | "red-900" | "green-700" | "grey-600" | "yellow-500" | null | undefined;
599
606
  } & class_variance_authority_types.ClassProp) | undefined) => string;
600
607
  interface RadioOption {
601
608
  value: string;
@@ -732,7 +739,7 @@ interface EmptyStateProps {
732
739
  declare const EmptyState: ({ icon, title, description, actionLabel, onAction, className, }: EmptyStateProps) => react.JSX.Element;
733
740
 
734
741
  declare const bannerVariants: (props?: ({
735
- tone?: "blue-700" | "blue-900" | "blue-950" | "red-900" | "green-700" | "grey-600" | null | undefined;
742
+ tone?: "blue-700" | "blue-900" | "blue-950" | "red-900" | "green-700" | "grey-600" | "yellow-500" | null | undefined;
736
743
  } & class_variance_authority_types.ClassProp) | undefined) => string;
737
744
  interface BannerAction {
738
745
  label: string;
package/dist/ui/index.js CHANGED
@@ -461,7 +461,8 @@ var ACCENT_CLASS = {
461
461
  "blue-950": "border-l-4 border-l-blue-950",
462
462
  "red-900": "border-l-4 border-l-red-900",
463
463
  "green-700": "border-l-4 border-l-green-700",
464
- "grey-600": "border-l-4 border-l-grey-600"
464
+ "grey-600": "border-l-4 border-l-grey-600",
465
+ "yellow-500": "border-l-4 border-l-yellow-500"
465
466
  };
466
467
  var boxVariants = (0, import_class_variance_authority2.cva)("border border-grey-300 bg-white", {
467
468
  variants: {
@@ -554,7 +555,8 @@ var linkVariants = (0, import_class_variance_authority4.cva)("cursor-pointer fon
554
555
  "blue-950": "text-blue-950",
555
556
  "red-900": "text-red-900",
556
557
  "green-700": "text-green-700",
557
- "grey-600": "text-grey-600"
558
+ "grey-600": "text-grey-600",
559
+ "yellow-500": "text-yellow-500"
558
560
  },
559
561
  size: {
560
562
  xs: "text-[11px]",
@@ -611,7 +613,8 @@ var textVariants = (0, import_class_variance_authority5.cva)("font-sans", {
611
613
  "blue-950": "text-blue-950",
612
614
  "red-900": "text-red-900",
613
615
  "green-700": "text-green-700",
614
- "grey-600": "text-grey-600"
616
+ "grey-600": "text-grey-600",
617
+ "yellow-500": "text-yellow-500"
615
618
  },
616
619
  align: {
617
620
  left: "text-left",
@@ -750,7 +753,8 @@ var COLOR_CLASS = {
750
753
  "grey-500": "text-grey-500",
751
754
  "grey-600": "text-grey-600",
752
755
  "neutral-800": "text-neutral-800",
753
- white: "text-white"
756
+ white: "text-white",
757
+ "yellow-500": "text-yellow-500"
754
758
  };
755
759
  var Icon = (0, import_react7.forwardRef)(
756
760
  (_a, ref) => {
@@ -1014,7 +1018,8 @@ var COLOR_CLASS2 = {
1014
1018
  "blue-950": "text-blue-950",
1015
1019
  "red-900": "text-red-900",
1016
1020
  "green-700": "text-green-700",
1017
- "grey-600": "text-grey-600"
1021
+ "grey-600": "text-grey-600",
1022
+ "yellow-500": "text-yellow-500"
1018
1023
  };
1019
1024
  var Spinner = ({ size = "m", color, className }) => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
1020
1025
  FaIcon,
@@ -1047,7 +1052,8 @@ var buttonVariants = (0, import_class_variance_authority7.cva)(
1047
1052
  "red-500": "",
1048
1053
  "red-900": "",
1049
1054
  "green-700": "",
1050
- "grey-600": ""
1055
+ "grey-600": "",
1056
+ "yellow-500": ""
1051
1057
  },
1052
1058
  look: {
1053
1059
  filled: "border border-transparent text-white",
@@ -1112,6 +1118,12 @@ var buttonVariants = (0, import_class_variance_authority7.cva)(
1112
1118
  color: "grey-600",
1113
1119
  look: "outline",
1114
1120
  class: "border-grey-600 text-grey-600"
1121
+ },
1122
+ { color: "yellow-500", look: "filled", class: "bg-yellow-500" },
1123
+ {
1124
+ color: "yellow-500",
1125
+ look: "outline",
1126
+ class: "border-yellow-500 text-yellow-500"
1115
1127
  }
1116
1128
  ],
1117
1129
  defaultVariants: {
@@ -1552,7 +1564,8 @@ var checkboxVariants = (0, import_class_variance_authority8.cva)(
1552
1564
  "blue-950": "data-[state=checked]:border-blue-950 data-[state=checked]:bg-blue-950",
1553
1565
  "red-900": "data-[state=checked]:border-red-900 data-[state=checked]:bg-red-900",
1554
1566
  "green-700": "data-[state=checked]:border-green-700 data-[state=checked]:bg-green-700",
1555
- "grey-600": "data-[state=checked]:border-grey-600 data-[state=checked]:bg-grey-600"
1567
+ "grey-600": "data-[state=checked]:border-grey-600 data-[state=checked]:bg-grey-600",
1568
+ "yellow-500": "data-[state=checked]:border-yellow-500 data-[state=checked]:bg-yellow-500"
1556
1569
  },
1557
1570
  size: {
1558
1571
  s: "h-3.5 w-3.5",
@@ -1635,7 +1648,8 @@ var trackVariants = (0, import_class_variance_authority9.cva)(
1635
1648
  "blue-950": "bg-grey-600 data-[state=checked]:bg-blue-950",
1636
1649
  "red-900": "bg-grey-600 data-[state=checked]:bg-red-900",
1637
1650
  "green-700": "bg-grey-600 data-[state=checked]:bg-green-700",
1638
- "grey-600": "bg-grey-400 data-[state=checked]:bg-grey-600"
1651
+ "grey-600": "bg-grey-400 data-[state=checked]:bg-grey-600",
1652
+ "yellow-500": "bg-grey-600 data-[state=checked]:bg-yellow-500"
1639
1653
  }
1640
1654
  },
1641
1655
  defaultVariants: { size: "s", color: "blue-950" }
@@ -1712,7 +1726,8 @@ var badgeVariants = (0, import_class_variance_authority10.cva)(
1712
1726
  "blue-950": "bg-blue-50 text-blue-950",
1713
1727
  "red-900": "bg-red-50 text-red-900",
1714
1728
  "green-700": "bg-green-50 text-green-700",
1715
- "grey-600": "bg-grey-100 text-grey-600"
1729
+ "grey-600": "bg-grey-100 text-grey-600",
1730
+ "yellow-500": "bg-yellow-50 text-yellow-500"
1716
1731
  },
1717
1732
  size: {
1718
1733
  xxs: "px-1 py-0.5 text-[9px]",
@@ -2600,7 +2615,11 @@ var TableHeaderCell = ({
2600
2615
  stickyOffset = "0px",
2601
2616
  surface = "grey-100",
2602
2617
  borderLeft = false,
2603
- className
2618
+ className,
2619
+ useSort = false,
2620
+ isSort = false,
2621
+ sortOrder = null,
2622
+ onClick
2604
2623
  }) => /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
2605
2624
  "th",
2606
2625
  {
@@ -2618,7 +2637,25 @@ var TableHeaderCell = ({
2618
2637
  left: sticky === "left" ? stickyOffset : void 0,
2619
2638
  right: sticky === "right" ? stickyOffset : void 0
2620
2639
  },
2621
- children
2640
+ children: useSort ? /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(
2641
+ "button",
2642
+ {
2643
+ type: "button",
2644
+ onClick,
2645
+ className: "inline-flex items-center gap-1",
2646
+ children: [
2647
+ children,
2648
+ /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
2649
+ FaIcon,
2650
+ {
2651
+ name: isSort ? sortOrder === "asc" ? "chevron-up" : "chevron-down" : "sort",
2652
+ size: 10,
2653
+ className: isSort ? "text-neutral-800" : "text-grey-500"
2654
+ }
2655
+ )
2656
+ ]
2657
+ }
2658
+ ) : children
2622
2659
  }
2623
2660
  );
2624
2661
 
@@ -2800,7 +2837,8 @@ var BADGE_BG_CLASS = {
2800
2837
  "blue-950": "bg-blue-950",
2801
2838
  "red-900": "bg-red-900",
2802
2839
  "green-700": "bg-green-700",
2803
- "grey-600": "bg-grey-600"
2840
+ "grey-600": "bg-grey-600",
2841
+ "yellow-500": "bg-yellow-500"
2804
2842
  };
2805
2843
  var BADGE_ICON_COLOR_CLASS = {
2806
2844
  "blue-700": "text-blue-700",
@@ -2808,7 +2846,8 @@ var BADGE_ICON_COLOR_CLASS = {
2808
2846
  "blue-950": "text-blue-950",
2809
2847
  "red-900": "text-red-900",
2810
2848
  "green-700": "text-green-700",
2811
- "grey-600": "text-grey-600"
2849
+ "grey-600": "text-grey-600",
2850
+ "yellow-500": "text-yellow-500"
2812
2851
  };
2813
2852
  var Avatar = (0, import_react23.forwardRef)(
2814
2853
  (_a, ref) => {
@@ -2880,7 +2919,8 @@ var FALLBACK_COLOR_CLASS = {
2880
2919
  "blue-950": "bg-blue-950 text-white",
2881
2920
  "red-900": "bg-red-900 text-white",
2882
2921
  "green-700": "bg-green-700 text-white",
2883
- "grey-600": "bg-grey-300 text-neutral-800"
2922
+ "grey-600": "bg-grey-300 text-neutral-800",
2923
+ "yellow-500": "bg-yellow-500 text-white"
2884
2924
  };
2885
2925
  var AvatarFallback = (0, import_react23.forwardRef)((_a, ref) => {
2886
2926
  var _b = _a, { color = "grey-600", className, style } = _b, props = __objRest(_b, ["color", "className", "style"]);
@@ -2977,7 +3017,8 @@ var radioVariants = (0, import_class_variance_authority11.cva)(
2977
3017
  "blue-950": "data-[state=checked]:border-blue-950",
2978
3018
  "red-900": "data-[state=checked]:border-red-900",
2979
3019
  "green-700": "data-[state=checked]:border-green-700",
2980
- "grey-600": "data-[state=checked]:border-grey-600"
3020
+ "grey-600": "data-[state=checked]:border-grey-600",
3021
+ "yellow-500": "data-[state=checked]:border-yellow-500"
2981
3022
  }
2982
3023
  },
2983
3024
  defaultVariants: { color: "blue-700" }
@@ -2993,7 +3034,8 @@ var indicatorVariants = (0, import_class_variance_authority11.cva)(
2993
3034
  "blue-950": "after:bg-blue-950",
2994
3035
  "red-900": "after:bg-red-900",
2995
3036
  "green-700": "after:bg-green-700",
2996
- "grey-600": "after:bg-grey-600"
3037
+ "grey-600": "after:bg-grey-600",
3038
+ "yellow-500": "after:bg-yellow-500"
2997
3039
  }
2998
3040
  },
2999
3041
  defaultVariants: { color: "blue-700" }
@@ -3070,7 +3112,8 @@ var FILL_CLASS = {
3070
3112
  "blue-950": "bg-blue-950",
3071
3113
  "red-900": "bg-red-900",
3072
3114
  "green-700": "bg-green-700",
3073
- "grey-600": "bg-grey-600"
3115
+ "grey-600": "bg-grey-600",
3116
+ "yellow-500": "bg-yellow-500"
3074
3117
  };
3075
3118
  var THUMB_BORDER_CLASS = {
3076
3119
  "blue-700": "border-blue-700",
@@ -3078,7 +3121,8 @@ var THUMB_BORDER_CLASS = {
3078
3121
  "blue-950": "border-blue-950",
3079
3122
  "red-900": "border-red-900",
3080
3123
  "green-700": "border-green-700",
3081
- "grey-600": "border-grey-600"
3124
+ "grey-600": "border-grey-600",
3125
+ "yellow-500": "border-yellow-500"
3082
3126
  };
3083
3127
  var ProgressBar = ({
3084
3128
  value,
@@ -3639,7 +3683,8 @@ var bannerVariants = (0, import_class_variance_authority14.cva)("rounded-[6px] b
3639
3683
  "blue-950": "border-blue-200 bg-blue-50",
3640
3684
  "red-900": "border-red-200 bg-red-50",
3641
3685
  "green-700": "border-green-100 bg-green-50",
3642
- "grey-600": "border-grey-300 bg-grey-100"
3686
+ "grey-600": "border-grey-300 bg-grey-100",
3687
+ "yellow-500": "border-yellow-200 bg-yellow-50"
3643
3688
  }
3644
3689
  },
3645
3690
  defaultVariants: { tone: "blue-700" }
@@ -3741,7 +3786,8 @@ var MAIN_BG = {
3741
3786
  "blue-950": "bg-blue-950",
3742
3787
  "red-900": "bg-red-900",
3743
3788
  "green-700": "bg-green-700",
3744
- "grey-600": "bg-grey-600"
3789
+ "grey-600": "bg-grey-600",
3790
+ "yellow-500": "bg-yellow-500"
3745
3791
  };
3746
3792
  var SUB_ICON = {
3747
3793
  "blue-700": "text-blue-700",
@@ -3749,7 +3795,8 @@ var SUB_ICON = {
3749
3795
  "blue-950": "text-blue-950",
3750
3796
  "red-900": "text-red-900",
3751
3797
  "green-700": "text-green-700",
3752
- "grey-600": "text-grey-600"
3798
+ "grey-600": "text-grey-600",
3799
+ "yellow-500": "text-yellow-500"
3753
3800
  };
3754
3801
  var FloatingButton = ({
3755
3802
  isOpen,
@@ -3884,7 +3931,8 @@ var ICON_WRAP_CLASS = {
3884
3931
  "blue-950": "bg-blue-50 text-blue-950",
3885
3932
  "red-900": "bg-red-50 text-red-900",
3886
3933
  "green-700": "bg-green-50 text-green-700",
3887
- "grey-600": "bg-grey-100 text-grey-600"
3934
+ "grey-600": "bg-grey-100 text-grey-600",
3935
+ "yellow-500": "bg-yellow-50 text-yellow-500"
3888
3936
  };
3889
3937
  var MetricCard = ({
3890
3938
  icon,
@@ -3973,7 +4021,8 @@ var DOT_CLASS = {
3973
4021
  "blue-950": "bg-blue-950",
3974
4022
  "red-900": "bg-red-900",
3975
4023
  "green-700": "bg-green-700",
3976
- "grey-600": "bg-grey-400"
4024
+ "grey-600": "bg-grey-400",
4025
+ "yellow-500": "bg-yellow-500"
3977
4026
  };
3978
4027
  var TagBubble = ({
3979
4028
  label,
@@ -4185,7 +4234,8 @@ var BG_CLASS = {
4185
4234
  "blue-950": "bg-blue-950",
4186
4235
  "red-900": "bg-red-900",
4187
4236
  "green-700": "bg-green-700",
4188
- "grey-600": "bg-grey-600"
4237
+ "grey-600": "bg-grey-600",
4238
+ "yellow-500": "bg-yellow-500"
4189
4239
  };
4190
4240
  var Bulk = ({
4191
4241
  onClose,
@@ -5167,7 +5217,8 @@ var COLOR_TOKENS = [
5167
5217
  "blue-950",
5168
5218
  "red-900",
5169
5219
  "green-700",
5170
- "grey-600"
5220
+ "grey-600",
5221
+ "yellow-500"
5171
5222
  ];
5172
5223
 
5173
5224
  // src/ui/lib/format.ts