npm - @caratlogic/design-system - Versions diffs - 0.1.44 → 0.1.46 - Mend

@caratlogic/design-system 0.1.44 → 0.1.46

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 (48) hide show

package/dist/index.esm.js CHANGED Viewed

@@ -2668,12 +2668,12 @@ const createLucideIcon = (iconName, iconNode) => {
  */
-const __iconNode$1x = [
+const __iconNode$1y = [
   ["path", { d: "M15 12H3", key: "6jk70r" }],
   ["path", { d: "M17 18H3", key: "1amg6g" }],
   ["path", { d: "M21 6H3", key: "1jwq7v" }]
 ];
-const AlignLeft = createLucideIcon("align-left", __iconNode$1x);
+const AlignLeft = createLucideIcon("align-left", __iconNode$1y);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -2683,12 +2683,12 @@ const AlignLeft = createLucideIcon("align-left", __iconNode$1x);
  */
-const __iconNode$1w = [
+const __iconNode$1x = [
   ["rect", { width: "20", height: "5", x: "2", y: "3", rx: "1", key: "1wp1u1" }],
   ["path", { d: "M4 8v11a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8", key: "1s80jp" }],
   ["path", { d: "M10 12h4", key: "a56b0p" }]
 ];
-const Archive = createLucideIcon("archive", __iconNode$1w);
+const Archive = createLucideIcon("archive", __iconNode$1x);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -2698,11 +2698,11 @@ const Archive = createLucideIcon("archive", __iconNode$1w);
  */
-const __iconNode$1v = [
+const __iconNode$1w = [
   ["path", { d: "m12 19-7-7 7-7", key: "1l729n" }],
   ["path", { d: "M19 12H5", key: "x3x0zl" }]
 ];
-const ArrowLeft = createLucideIcon("arrow-left", __iconNode$1v);
+const ArrowLeft = createLucideIcon("arrow-left", __iconNode$1w);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -2712,11 +2712,11 @@ const ArrowLeft = createLucideIcon("arrow-left", __iconNode$1v);
  */
-const __iconNode$1u = [
+const __iconNode$1v = [
   ["path", { d: "M5 12h14", key: "1ays0h" }],
   ["path", { d: "m12 5 7 7-7 7", key: "xquz4c" }]
 ];
-const ArrowRight = createLucideIcon("arrow-right", __iconNode$1u);
+const ArrowRight = createLucideIcon("arrow-right", __iconNode$1v);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -2726,11 +2726,11 @@ const ArrowRight = createLucideIcon("arrow-right", __iconNode$1u);
  */
-const __iconNode$1t = [
+const __iconNode$1u = [
   ["path", { d: "M4.929 4.929 19.07 19.071", key: "196cmz" }],
   ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }]
 ];
-const Ban = createLucideIcon("ban", __iconNode$1t);
+const Ban = createLucideIcon("ban", __iconNode$1u);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -2740,7 +2740,7 @@ const Ban = createLucideIcon("ban", __iconNode$1t);
  */
-const __iconNode$1s = [
+const __iconNode$1t = [
   ["path", { d: "M10.268 21a2 2 0 0 0 3.464 0", key: "vwvbt9" }],
   [
     "path",
@@ -2751,7 +2751,7 @@ const __iconNode$1s = [
   ],
   ["circle", { cx: "18", cy: "8", r: "3", key: "1g0gzu" }]
 ];
-const BellDot = createLucideIcon("bell-dot", __iconNode$1s);
+const BellDot = createLucideIcon("bell-dot", __iconNode$1t);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -2761,7 +2761,7 @@ const BellDot = createLucideIcon("bell-dot", __iconNode$1s);
  */
-const __iconNode$1r = [
+const __iconNode$1s = [
   ["path", { d: "M10.268 21a2 2 0 0 0 3.464 0", key: "vwvbt9" }],
   ["path", { d: "M22 8c0-2.3-.8-4.3-2-6", key: "5bb3ad" }],
   [
@@ -2773,7 +2773,7 @@ const __iconNode$1r = [
   ],
   ["path", { d: "M4 2C2.8 3.7 2 5.7 2 8", key: "tap9e0" }]
 ];
-const BellRing = createLucideIcon("bell-ring", __iconNode$1r);
+const BellRing = createLucideIcon("bell-ring", __iconNode$1s);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -2783,7 +2783,7 @@ const BellRing = createLucideIcon("bell-ring", __iconNode$1r);
  */
-const __iconNode$1q = [
+const __iconNode$1r = [
   ["path", { d: "M10.268 21a2 2 0 0 0 3.464 0", key: "vwvbt9" }],
   [
     "path",
@@ -2793,7 +2793,7 @@ const __iconNode$1q = [
     }
   ]
 ];
-const Bell = createLucideIcon("bell", __iconNode$1q);
+const Bell = createLucideIcon("bell", __iconNode$1r);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -2803,13 +2803,13 @@ const Bell = createLucideIcon("bell", __iconNode$1q);
  */
-const __iconNode$1p = [
+const __iconNode$1q = [
   [
     "path",
     { d: "M6 12h9a4 4 0 0 1 0 8H7a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1h7a4 4 0 0 1 0 8", key: "mg9rjx" }
   ]
 ];
-const Bold$1 = createLucideIcon("bold", __iconNode$1p);
+const Bold$1 = createLucideIcon("bold", __iconNode$1q);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -2819,10 +2819,10 @@ const Bold$1 = createLucideIcon("bold", __iconNode$1p);
  */
-const __iconNode$1o = [
+const __iconNode$1p = [
   ["path", { d: "m19 21-7-4-7 4V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2v16z", key: "1fy3hk" }]
 ];
-const Bookmark = createLucideIcon("bookmark", __iconNode$1o);
+const Bookmark = createLucideIcon("bookmark", __iconNode$1p);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -2832,7 +2832,7 @@ const Bookmark = createLucideIcon("bookmark", __iconNode$1o);
  */
-const __iconNode$1n = [
+const __iconNode$1o = [
   [
     "path",
     {
@@ -2843,7 +2843,7 @@ const __iconNode$1n = [
   ["path", { d: "m3.3 7 8.7 5 8.7-5", key: "g66t2b" }],
   ["path", { d: "M12 22V12", key: "d0xqtd" }]
 ];
-const Box = createLucideIcon("box", __iconNode$1n);
+const Box = createLucideIcon("box", __iconNode$1o);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -2853,7 +2853,7 @@ const Box = createLucideIcon("box", __iconNode$1n);
  */
-const __iconNode$1m = [
+const __iconNode$1n = [
   ["path", { d: "M6 22V4a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v18Z", key: "1b4qmf" }],
   ["path", { d: "M6 12H4a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h2", key: "i71pzd" }],
   ["path", { d: "M18 9h2a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-2", key: "10jefs" }],
@@ -2862,7 +2862,7 @@ const __iconNode$1m = [
   ["path", { d: "M10 14h4", key: "kelpxr" }],
   ["path", { d: "M10 18h4", key: "1ulq68" }]
 ];
-const Building2 = createLucideIcon("building-2", __iconNode$1m);
+const Building2 = createLucideIcon("building-2", __iconNode$1n);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -2872,7 +2872,7 @@ const Building2 = createLucideIcon("building-2", __iconNode$1m);
  */
-const __iconNode$1l = [
+const __iconNode$1m = [
   ["path", { d: "M8 2v4", key: "1cmpym" }],
   ["path", { d: "M16 2v4", key: "4m81vk" }],
   ["rect", { width: "18", height: "18", x: "3", y: "4", rx: "2", key: "1hopcy" }],
@@ -2884,7 +2884,7 @@ const __iconNode$1l = [
   ["path", { d: "M12 18h.01", key: "mhygvu" }],
   ["path", { d: "M16 18h.01", key: "kzsmim" }]
 ];
-const CalendarDays = createLucideIcon("calendar-days", __iconNode$1l);
+const CalendarDays = createLucideIcon("calendar-days", __iconNode$1m);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -2894,13 +2894,13 @@ const CalendarDays = createLucideIcon("calendar-days", __iconNode$1l);
  */
-const __iconNode$1k = [
+const __iconNode$1l = [
   ["path", { d: "M8 2v4", key: "1cmpym" }],
   ["path", { d: "M16 2v4", key: "4m81vk" }],
   ["rect", { width: "18", height: "18", x: "3", y: "4", rx: "2", key: "1hopcy" }],
   ["path", { d: "M3 10h18", key: "8toen8" }]
 ];
-const Calendar$1 = createLucideIcon("calendar", __iconNode$1k);
+const Calendar$1 = createLucideIcon("calendar", __iconNode$1l);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -2910,11 +2910,11 @@ const Calendar$1 = createLucideIcon("calendar", __iconNode$1k);
  */
-const __iconNode$1j = [
+const __iconNode$1k = [
   ["path", { d: "M18 6 7 17l-5-5", key: "116fxf" }],
   ["path", { d: "m22 10-7.5 7.5L13 16", key: "ke71qq" }]
 ];
-const CheckCheck = createLucideIcon("check-check", __iconNode$1j);
+const CheckCheck = createLucideIcon("check-check", __iconNode$1k);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -2924,8 +2924,8 @@ const CheckCheck = createLucideIcon("check-check", __iconNode$1j);
  */
-const __iconNode$1i = [["path", { d: "M20 6 9 17l-5-5", key: "1gmf2c" }]];
-const Check = createLucideIcon("check", __iconNode$1i);
+const __iconNode$1j = [["path", { d: "M20 6 9 17l-5-5", key: "1gmf2c" }]];
+const Check = createLucideIcon("check", __iconNode$1j);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -2935,8 +2935,8 @@ const Check = createLucideIcon("check", __iconNode$1i);
  */
-const __iconNode$1h = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]];
-const ChevronDown = createLucideIcon("chevron-down", __iconNode$1h);
+const __iconNode$1i = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]];
+const ChevronDown = createLucideIcon("chevron-down", __iconNode$1i);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -2946,8 +2946,8 @@ const ChevronDown = createLucideIcon("chevron-down", __iconNode$1h);
  */
-const __iconNode$1g = [["path", { d: "m15 18-6-6 6-6", key: "1wnfg3" }]];
-const ChevronLeft = createLucideIcon("chevron-left", __iconNode$1g);
+const __iconNode$1h = [["path", { d: "m15 18-6-6 6-6", key: "1wnfg3" }]];
+const ChevronLeft = createLucideIcon("chevron-left", __iconNode$1h);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -2957,8 +2957,8 @@ const ChevronLeft = createLucideIcon("chevron-left", __iconNode$1g);
  */
-const __iconNode$1f = [["path", { d: "m9 18 6-6-6-6", key: "mthhwq" }]];
-const ChevronRight = createLucideIcon("chevron-right", __iconNode$1f);
+const __iconNode$1g = [["path", { d: "m9 18 6-6-6-6", key: "mthhwq" }]];
+const ChevronRight = createLucideIcon("chevron-right", __iconNode$1g);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -2968,8 +2968,8 @@ const ChevronRight = createLucideIcon("chevron-right", __iconNode$1f);
  */
-const __iconNode$1e = [["path", { d: "m18 15-6-6-6 6", key: "153udz" }]];
-const ChevronUp = createLucideIcon("chevron-up", __iconNode$1e);
+const __iconNode$1f = [["path", { d: "m18 15-6-6-6 6", key: "153udz" }]];
+const ChevronUp = createLucideIcon("chevron-up", __iconNode$1f);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -2979,11 +2979,11 @@ const ChevronUp = createLucideIcon("chevron-up", __iconNode$1e);
  */
-const __iconNode$1d = [
+const __iconNode$1e = [
   ["path", { d: "m11 17-5-5 5-5", key: "13zhaf" }],
   ["path", { d: "m18 17-5-5 5-5", key: "h8a8et" }]
 ];
-const ChevronsLeft = createLucideIcon("chevrons-left", __iconNode$1d);
+const ChevronsLeft = createLucideIcon("chevrons-left", __iconNode$1e);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -2993,11 +2993,11 @@ const ChevronsLeft = createLucideIcon("chevrons-left", __iconNode$1d);
  */
-const __iconNode$1c = [
+const __iconNode$1d = [
   ["path", { d: "m6 17 5-5-5-5", key: "xnjwq" }],
   ["path", { d: "m13 17 5-5-5-5", key: "17xmmf" }]
 ];
-const ChevronsRight = createLucideIcon("chevrons-right", __iconNode$1c);
+const ChevronsRight = createLucideIcon("chevrons-right", __iconNode$1d);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -3007,12 +3007,12 @@ const ChevronsRight = createLucideIcon("chevrons-right", __iconNode$1c);
  */
-const __iconNode$1b = [
+const __iconNode$1c = [
   ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }],
   ["line", { x1: "12", x2: "12", y1: "8", y2: "12", key: "1pkeuh" }],
   ["line", { x1: "12", x2: "12.01", y1: "16", y2: "16", key: "4dfq90" }]
 ];
-const CircleAlert = createLucideIcon("circle-alert", __iconNode$1b);
+const CircleAlert = createLucideIcon("circle-alert", __iconNode$1c);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -3022,11 +3022,11 @@ const CircleAlert = createLucideIcon("circle-alert", __iconNode$1b);
  */
-const __iconNode$1a = [
+const __iconNode$1b = [
   ["path", { d: "M21.801 10A10 10 0 1 1 17 3.335", key: "yps3ct" }],
   ["path", { d: "m9 11 3 3L22 4", key: "1pflzl" }]
 ];
-const CircleCheckBig = createLucideIcon("circle-check-big", __iconNode$1a);
+const CircleCheckBig = createLucideIcon("circle-check-big", __iconNode$1b);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -3036,11 +3036,11 @@ const CircleCheckBig = createLucideIcon("circle-check-big", __iconNode$1a);
  */
-const __iconNode$19 = [
+const __iconNode$1a = [
   ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }],
   ["path", { d: "m9 12 2 2 4-4", key: "dzmm74" }]
 ];
-const CircleCheck = createLucideIcon("circle-check", __iconNode$19);
+const CircleCheck = createLucideIcon("circle-check", __iconNode$1a);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -3050,11 +3050,11 @@ const CircleCheck = createLucideIcon("circle-check", __iconNode$19);
  */
-const __iconNode$18 = [
+const __iconNode$19 = [
   ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }],
   ["path", { d: "m16 10-4 4-4-4", key: "894hmk" }]
 ];
-const CircleChevronDown = createLucideIcon("circle-chevron-down", __iconNode$18);
+const CircleChevronDown = createLucideIcon("circle-chevron-down", __iconNode$19);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -3064,11 +3064,11 @@ const CircleChevronDown = createLucideIcon("circle-chevron-down", __iconNode$18)
  */
-const __iconNode$17 = [
+const __iconNode$18 = [
   ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }],
   ["circle", { cx: "12", cy: "12", r: "1", key: "41hilf" }]
 ];
-const CircleDot = createLucideIcon("circle-dot", __iconNode$17);
+const CircleDot = createLucideIcon("circle-dot", __iconNode$18);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -3078,12 +3078,12 @@ const CircleDot = createLucideIcon("circle-dot", __iconNode$17);
  */
-const __iconNode$16 = [
+const __iconNode$17 = [
   ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }],
   ["path", { d: "m15 9-6 6", key: "1uzhvr" }],
   ["path", { d: "m9 9 6 6", key: "z0biqf" }]
 ];
-const CircleX = createLucideIcon("circle-x", __iconNode$16);
+const CircleX = createLucideIcon("circle-x", __iconNode$17);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -3093,8 +3093,8 @@ const CircleX = createLucideIcon("circle-x", __iconNode$16);
  */
-const __iconNode$15 = [["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }]];
-const Circle = createLucideIcon("circle", __iconNode$15);
+const __iconNode$16 = [["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }]];
+const Circle = createLucideIcon("circle", __iconNode$16);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -3104,11 +3104,11 @@ const Circle = createLucideIcon("circle", __iconNode$15);
  */
-const __iconNode$14 = [
+const __iconNode$15 = [
   ["path", { d: "M12 6v6l4 2", key: "mmk7yg" }],
   ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }]
 ];
-const Clock = createLucideIcon("clock", __iconNode$14);
+const Clock = createLucideIcon("clock", __iconNode$15);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -3118,11 +3118,11 @@ const Clock = createLucideIcon("clock", __iconNode$14);
  */
-const __iconNode$13 = [
+const __iconNode$14 = [
   ["rect", { width: "14", height: "14", x: "8", y: "8", rx: "2", ry: "2", key: "17jyea" }],
   ["path", { d: "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2", key: "zix9uf" }]
 ];
-const Copy = createLucideIcon("copy", __iconNode$13);
+const Copy = createLucideIcon("copy", __iconNode$14);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -3132,11 +3132,11 @@ const Copy = createLucideIcon("copy", __iconNode$13);
  */
-const __iconNode$12 = [
+const __iconNode$13 = [
   ["path", { d: "M6 2v14a2 2 0 0 0 2 2h14", key: "ron5a4" }],
   ["path", { d: "M18 22V8a2 2 0 0 0-2-2H2", key: "7s9ehn" }]
 ];
-const Crop = createLucideIcon("crop", __iconNode$12);
+const Crop = createLucideIcon("crop", __iconNode$13);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -3146,12 +3146,12 @@ const Crop = createLucideIcon("crop", __iconNode$12);
  */
-const __iconNode$11 = [
+const __iconNode$12 = [
   ["path", { d: "M12 15V3", key: "m9g1x1" }],
   ["path", { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4", key: "ih7n3h" }],
   ["path", { d: "m7 10 5 5 5-5", key: "brsn70" }]
 ];
-const Download = createLucideIcon("download", __iconNode$11);
+const Download = createLucideIcon("download", __iconNode$12);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -3161,12 +3161,12 @@ const Download = createLucideIcon("download", __iconNode$11);
  */
-const __iconNode$10 = [
+const __iconNode$11 = [
   ["circle", { cx: "12", cy: "12", r: "1", key: "41hilf" }],
   ["circle", { cx: "12", cy: "5", r: "1", key: "gxeob9" }],
   ["circle", { cx: "12", cy: "19", r: "1", key: "lyex9k" }]
 ];
-const EllipsisVertical = createLucideIcon("ellipsis-vertical", __iconNode$10);
+const EllipsisVertical = createLucideIcon("ellipsis-vertical", __iconNode$11);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -3176,12 +3176,12 @@ const EllipsisVertical = createLucideIcon("ellipsis-vertical", __iconNode$10);
  */
-const __iconNode$$ = [
+const __iconNode$10 = [
   ["circle", { cx: "12", cy: "12", r: "1", key: "41hilf" }],
   ["circle", { cx: "19", cy: "12", r: "1", key: "1wjl8i" }],
   ["circle", { cx: "5", cy: "12", r: "1", key: "1pcz8c" }]
 ];
-const Ellipsis = createLucideIcon("ellipsis", __iconNode$$);
+const Ellipsis = createLucideIcon("ellipsis", __iconNode$10);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -3191,12 +3191,12 @@ const Ellipsis = createLucideIcon("ellipsis", __iconNode$$);
  */
-const __iconNode$_ = [
+const __iconNode$$ = [
   ["path", { d: "M15 3h6v6", key: "1q9fwt" }],
   ["path", { d: "M10 14 21 3", key: "gplh6r" }],
   ["path", { d: "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6", key: "a6xqqp" }]
 ];
-const ExternalLink = createLucideIcon("external-link", __iconNode$_);
+const ExternalLink = createLucideIcon("external-link", __iconNode$$);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -3206,7 +3206,7 @@ const ExternalLink = createLucideIcon("external-link", __iconNode$_);
  */
-const __iconNode$Z = [
+const __iconNode$_ = [
   [
     "path",
     {
@@ -3216,7 +3216,7 @@ const __iconNode$Z = [
   ],
   ["circle", { cx: "12", cy: "12", r: "3", key: "1v7zrd" }]
 ];
-const Eye = createLucideIcon("eye", __iconNode$Z);
+const Eye = createLucideIcon("eye", __iconNode$_);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -3226,13 +3226,13 @@ const Eye = createLucideIcon("eye", __iconNode$Z);
  */
-const __iconNode$Y = [
+const __iconNode$Z = [
   [
     "path",
     { d: "M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z", key: "1jg4f8" }
   ]
 ];
-const Facebook = createLucideIcon("facebook", __iconNode$Y);
+const Facebook = createLucideIcon("facebook", __iconNode$Z);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -3242,7 +3242,7 @@ const Facebook = createLucideIcon("facebook", __iconNode$Y);
  */
-const __iconNode$X = [
+const __iconNode$Y = [
   ["path", { d: "M12 22h6a2 2 0 0 0 2-2V7l-5-5H6a2 2 0 0 0-2 2v3.072", key: "n6s66f" }],
   ["path", { d: "M14 2v4a2 2 0 0 0 2 2h4", key: "tnqrlb" }],
   [
@@ -3254,7 +3254,7 @@ const __iconNode$X = [
   ],
   ["circle", { cx: "5", cy: "14", r: "3", key: "ufru5t" }]
 ];
-const FileBadge = createLucideIcon("file-badge", __iconNode$X);
+const FileBadge = createLucideIcon("file-badge", __iconNode$Y);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -3264,12 +3264,12 @@ const FileBadge = createLucideIcon("file-badge", __iconNode$X);
  */
-const __iconNode$W = [
+const __iconNode$X = [
   ["path", { d: "M4 22h14a2 2 0 0 0 2-2V7l-5-5H6a2 2 0 0 0-2 2v4", key: "1pf5j1" }],
   ["path", { d: "M14 2v4a2 2 0 0 0 2 2h4", key: "tnqrlb" }],
   ["path", { d: "m3 15 2 2 4-4", key: "1lhrkk" }]
 ];
-const FileCheck2 = createLucideIcon("file-check-2", __iconNode$W);
+const FileCheck2 = createLucideIcon("file-check-2", __iconNode$X);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -3279,14 +3279,14 @@ const FileCheck2 = createLucideIcon("file-check-2", __iconNode$W);
  */
-const __iconNode$V = [
+const __iconNode$W = [
   ["path", { d: "M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z", key: "1rqfz7" }],
   ["path", { d: "M14 2v4a2 2 0 0 0 2 2h4", key: "tnqrlb" }],
   ["path", { d: "M10 9H8", key: "b1mrlr" }],
   ["path", { d: "M16 13H8", key: "t4e002" }],
   ["path", { d: "M16 17H8", key: "z1uh3a" }]
 ];
-const FileText = createLucideIcon("file-text", __iconNode$V);
+const FileText = createLucideIcon("file-text", __iconNode$W);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -3296,7 +3296,7 @@ const FileText = createLucideIcon("file-text", __iconNode$V);
  */
-const __iconNode$U = [
+const __iconNode$V = [
   [
     "path",
     {
@@ -3307,7 +3307,7 @@ const __iconNode$U = [
   ["path", { d: "m16.5 3.5 5 5", key: "15e6fa" }],
   ["path", { d: "m21.5 3.5-5 5", key: "m0lwru" }]
 ];
-const FunnelX = createLucideIcon("funnel-x", __iconNode$U);
+const FunnelX = createLucideIcon("funnel-x", __iconNode$V);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -3317,7 +3317,7 @@ const FunnelX = createLucideIcon("funnel-x", __iconNode$U);
  */
-const __iconNode$T = [
+const __iconNode$U = [
   [
     "path",
     {
@@ -3326,7 +3326,7 @@ const __iconNode$T = [
     }
   ]
 ];
-const Funnel = createLucideIcon("funnel", __iconNode$T);
+const Funnel = createLucideIcon("funnel", __iconNode$U);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -3336,7 +3336,7 @@ const Funnel = createLucideIcon("funnel", __iconNode$T);
  */
-const __iconNode$S = [
+const __iconNode$T = [
   ["path", { d: "M10.5 3 8 9l4 13 4-13-2.5-6", key: "b3dvk1" }],
   [
     "path",
@@ -3347,7 +3347,7 @@ const __iconNode$S = [
   ],
   ["path", { d: "M2 9h20", key: "16fsjt" }]
 ];
-const Gem = createLucideIcon("gem", __iconNode$S);
+const Gem = createLucideIcon("gem", __iconNode$T);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -3357,7 +3357,7 @@ const Gem = createLucideIcon("gem", __iconNode$S);
  */
-const __iconNode$R = [
+const __iconNode$S = [
   ["circle", { cx: "12", cy: "9", r: "1", key: "124mty" }],
   ["circle", { cx: "19", cy: "9", r: "1", key: "1ruzo2" }],
   ["circle", { cx: "5", cy: "9", r: "1", key: "1a8b28" }],
@@ -3365,7 +3365,7 @@ const __iconNode$R = [
   ["circle", { cx: "19", cy: "15", r: "1", key: "1a92ep" }],
   ["circle", { cx: "5", cy: "15", r: "1", key: "5r1jwy" }]
 ];
-const GripHorizontal = createLucideIcon("grip-horizontal", __iconNode$R);
+const GripHorizontal = createLucideIcon("grip-horizontal", __iconNode$S);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -3375,7 +3375,7 @@ const GripHorizontal = createLucideIcon("grip-horizontal", __iconNode$R);
  */
-const __iconNode$Q = [
+const __iconNode$R = [
   ["circle", { cx: "9", cy: "12", r: "1", key: "1vctgf" }],
   ["circle", { cx: "9", cy: "5", r: "1", key: "hp0tcf" }],
   ["circle", { cx: "9", cy: "19", r: "1", key: "fkjjf6" }],
@@ -3383,7 +3383,7 @@ const __iconNode$Q = [
   ["circle", { cx: "15", cy: "5", r: "1", key: "19l28e" }],
   ["circle", { cx: "15", cy: "19", r: "1", key: "f4zoj3" }]
 ];
-const GripVertical = createLucideIcon("grip-vertical", __iconNode$Q);
+const GripVertical = createLucideIcon("grip-vertical", __iconNode$R);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -3393,13 +3393,13 @@ const GripVertical = createLucideIcon("grip-vertical", __iconNode$Q);
  */
-const __iconNode$P = [
+const __iconNode$Q = [
   ["line", { x1: "4", x2: "20", y1: "9", y2: "9", key: "4lhtct" }],
   ["line", { x1: "4", x2: "20", y1: "15", y2: "15", key: "vyu0kd" }],
   ["line", { x1: "10", x2: "8", y1: "3", y2: "21", key: "1ggp8o" }],
   ["line", { x1: "16", x2: "14", y1: "3", y2: "21", key: "weycgp" }]
 ];
-const Hash = createLucideIcon("hash", __iconNode$P);
+const Hash = createLucideIcon("hash", __iconNode$Q);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -3409,13 +3409,13 @@ const Hash = createLucideIcon("hash", __iconNode$P);
  */
-const __iconNode$O = [
+const __iconNode$P = [
   ["path", { d: "M4 12h8", key: "17cfdx" }],
   ["path", { d: "M4 18V6", key: "1rz3zl" }],
   ["path", { d: "M12 18V6", key: "zqpxq5" }],
   ["path", { d: "m17 12 3-2v8", key: "1hhhft" }]
 ];
-const Heading1 = createLucideIcon("heading-1", __iconNode$O);
+const Heading1 = createLucideIcon("heading-1", __iconNode$P);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -3425,13 +3425,13 @@ const Heading1 = createLucideIcon("heading-1", __iconNode$O);
  */
-const __iconNode$N = [
+const __iconNode$O = [
   ["path", { d: "M4 12h8", key: "17cfdx" }],
   ["path", { d: "M4 18V6", key: "1rz3zl" }],
   ["path", { d: "M12 18V6", key: "zqpxq5" }],
   ["path", { d: "M21 18h-4c0-4 4-3 4-6 0-1.5-2-2.5-4-1", key: "9jr5yi" }]
 ];
-const Heading2 = createLucideIcon("heading-2", __iconNode$N);
+const Heading2 = createLucideIcon("heading-2", __iconNode$O);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -3441,14 +3441,14 @@ const Heading2 = createLucideIcon("heading-2", __iconNode$N);
  */
-const __iconNode$M = [
+const __iconNode$N = [
   ["path", { d: "M4 12h8", key: "17cfdx" }],
   ["path", { d: "M4 18V6", key: "1rz3zl" }],
   ["path", { d: "M12 18V6", key: "zqpxq5" }],
   ["path", { d: "M17.5 10.5c1.7-1 3.5 0 3.5 1.5a2 2 0 0 1-2 2", key: "68ncm8" }],
   ["path", { d: "M17 17.5c2 1.5 4 .3 4-1.5a2 2 0 0 0-2-2", key: "1ejuhz" }]
 ];
-const Heading3 = createLucideIcon("heading-3", __iconNode$M);
+const Heading3 = createLucideIcon("heading-3", __iconNode$N);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -3458,12 +3458,12 @@ const Heading3 = createLucideIcon("heading-3", __iconNode$M);
  */
-const __iconNode$L = [
+const __iconNode$M = [
   ["path", { d: "M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8", key: "1357e3" }],
   ["path", { d: "M3 3v5h5", key: "1xhq8a" }],
   ["path", { d: "M12 7v5l4 2", key: "1fdv2h" }]
 ];
-const History = createLucideIcon("history", __iconNode$L);
+const History = createLucideIcon("history", __iconNode$M);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -3473,12 +3473,32 @@ const History = createLucideIcon("history", __iconNode$L);
  */
-const __iconNode$K = [
+const __iconNode$L = [
   ["rect", { width: "18", height: "18", x: "3", y: "3", rx: "2", ry: "2", key: "1m3agn" }],
   ["circle", { cx: "9", cy: "9", r: "2", key: "af1f0g" }],
   ["path", { d: "m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21", key: "1xmnt7" }]
 ];
-const Image$1 = createLucideIcon("image", __iconNode$K);
+const Image$1 = createLucideIcon("image", __iconNode$L);
+/**
+ * @license lucide-react v0.539.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const __iconNode$K = [
+  ["polyline", { points: "22 12 16 12 14 15 10 15 8 12 2 12", key: "o97t9d" }],
+  [
+    "path",
+    {
+      d: "M5.45 5.11 2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.45-6.89A2 2 0 0 0 16.76 4H7.24a2 2 0 0 0-1.79 1.11z",
+      key: "oot6mr"
+    }
+  ]
+];
+const Inbox = createLucideIcon("inbox", __iconNode$K);
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -21976,6 +21996,34 @@ function CustomCombobox({ options, placeholder = 'Select option...', value, onCh
     return (jsx(SearchableSelect, { selectedItem: selectedItem, onChange: (opt) => onChange(opt.label), getOptionKey: (o) => o.value, getOptionLabel: (o) => o.label, options: options, searchPlaceholder: placeholder, emptyMessage: emptyMessage, className: className }));
 }
+/** A table's empty title when its page gives none. */
+const DEFAULT_TABLE_EMPTY_TITLE = 'No records yet';
+/** Placeholder rows of the empty list, fading out; the middle one is nudged so the stack reads as loose cards. */
+const EMPTY_STATE_ROWS = [
+    { key: 'first', className: '' },
+    { key: 'second', className: 'translate-x-3 opacity-70' },
+    { key: 'third', className: 'opacity-40' },
+];
+/**
+ * A list or table with nothing to show: a quiet sketch of empty rows with `icon` as a badge, then the
+ * title, description and an optional action.
+ */
+function EmptyState({ icon: Icon, title, description, action, className, }) {
+    return (jsxs("div", { className: cn('flex flex-col items-center py-12 text-center', className), children: [jsxs("div", { "aria-hidden": "true", className: "relative w-44", children: [jsx("div", { className: "space-y-2", children: EMPTY_STATE_ROWS.map((row) => (jsxs("div", { className: cn('flex items-center gap-2 rounded-lg border border-border bg-card px-3 py-2 shadow-xs', row.className), children: [jsx("span", { className: "size-5 shrink-0 rounded-md bg-muted" }), jsx("span", { className: "h-1.5 flex-1 rounded-full bg-muted" }), jsx("span", { className: "h-1.5 w-6 rounded-full bg-muted" })] }, row.key))) }), jsx("span", { className: "absolute -right-3 -top-3 flex size-9 items-center justify-center rounded-full border border-border bg-card text-primary shadow-sm", children: jsx(Icon, { className: "size-4" }) })] }), jsx("p", { className: "mt-5 text-base font-semibold text-foreground", children: title }), description && (jsx("p", { className: "mt-1.5 max-w-md text-sm text-muted-foreground", children: description })), action && jsx("div", { className: "mt-5", children: action })] }));
+}
+/**
+ * A table's empty content: its own `EmptyState` (or other element) as given, a string as the title of the
+ * standard empty state, or the neutral default when the table passes nothing.
+ *
+ * Render it in the table's scroll container, after the `<table>`: it is pinned to the visible width there,
+ * so it stays centered however wide the columns are or however far the table is scrolled sideways.
+ */
+function TableEmptyState({ content, }) {
+    return (jsx("div", { "data-slot": "table-empty-state", className: "sticky left-0 w-full", children: content === undefined || content === null || typeof content === 'string' ? (jsx(EmptyState, { icon: Inbox, title: content || DEFAULT_TABLE_EMPTY_TITLE })) : (content) }));
+}
 function useExpandableRows() {
     const [expanded, setExpanded] = useState(new Set());
     const toggleExpand = (key) => {
@@ -22018,7 +22066,7 @@ function renderCellContent(row, col) {
     return typeof raw === 'number' ? raw.toLocaleString() : raw;
 }
-function CustomTable({ data, columns, expandable, rowKey = (row) => row.id, className = '', columnStyles = {}, comfortableRows = false, compactRows = false, mutedCellFallback = false, pagination, enableSelection = false, selectedRowIds, onSelectionChange, }) {
+function CustomTable({ data, columns, expandable, rowKey = (row) => row.id, className = '', columnStyles = {}, comfortableRows = false, compactRows = false, mutedCellFallback = false, pagination, enableSelection = false, selectedRowIds, onSelectionChange, emptyState, }) {
     const { isExpanded, toggleExpand } = useExpandableRows();
     const selectedIds = selectedRowIds ?? [];
     const allKeys = data.map(rowKey);
@@ -22033,22 +22081,22 @@ function CustomTable({ data, columns, expandable, rowKey = (row) => row.id, clas
             ? selectedIds.filter((id) => id !== key)
             : [...selectedIds, key]);
     };
-    return (jsxs("div", { className: `h-full w-full flex flex-col overflow-hidden rounded-lg border border-border bg-card ${className}`, "data-slot": "table-container", children: [jsx("div", { className: "overflow-auto flex-1 isolate", children: jsxs("table", { "data-slot": "table", className: "min-w-full w-full text-left text-sm", children: [jsx("thead", { className: "sticky top-0 z-40 border-b border-border !bg-table-header", children: jsxs("tr", { children: [expandable && (jsx("th", { className: "h-12 w-[52px] min-w-[52px] whitespace-nowrap px-3 text-left align-middle text-secondary-foreground" })), enableSelection && (jsx("th", { className: "h-12 w-[52px] min-w-[52px] whitespace-nowrap px-3 text-left align-middle", children: jsx(Checkbox, { checked: allSelected
-                                                ? true
-                                                : someSelected
-                                                    ? 'indeterminate'
-                                                    : false, onCheckedChange: toggleSelectAll, "aria-label": "Select all rows" }) })), columns.map((col) => (jsx("th", { className: cn('h-12 whitespace-nowrap px-4 text-left align-middle text-sm font-semibold text-secondary-foreground', alignClass(col.align), col.key === 'actions' && stickyActionsHeaderClass(), col.headerClassName), style: { width: col.width }, children: col.header }, col.key)))] }) }), jsx("tbody", { children: data.length === 0 ? (jsx("tr", { children: jsx("td", { colSpan: columns.length + leadingCols, className: "p-4 text-center text-muted-foreground", children: "No data available" }) })) : (data.map((row, idx) => {
-                                const key = rowKey(row);
-                                const expandedRow = isExpanded(key);
-                                return (jsxs(React__default.Fragment, { children: [jsxs("tr", { className: `cursor-pointer border-b border-border transition-colors hover:bg-muted/30 ${idx % 2 === 0 ? 'bg-card' : 'bg-alternativeTableColor'} ${comfortableRows ? 'h-[76px]' : ''} ${compactRows ? 'h-[52px]' : ''}`, children: [expandable && (jsx("td", { className: "border-b border-border px-3 align-middle whitespace-nowrap", children: jsx("button", { type: "button", onClick: (e) => {
-                                                            e.stopPropagation();
-                                                            toggleExpand(key);
-                                                        }, className: "flex size-8 cursor-pointer items-center justify-center rounded-md text-muted-foreground hover:bg-muted hover:text-foreground", "aria-expanded": expandedRow, "aria-label": expandedRow ? 'Collapse row' : 'Expand row', children: expandedRow ? (jsx(ChevronDown, { className: "size-4" })) : (jsx(ChevronRight, { className: "size-4" })) }) })), enableSelection && (jsx("td", { className: "border-b border-border px-3 align-middle", onClick: (e) => e.stopPropagation(), children: jsx(Checkbox, { checked: selectedIds.includes(key), onCheckedChange: () => toggleRow(key), "aria-label": "Select row" }) })), columns.map((col) => (jsx("td", { className: cn('border-b border-border px-4 align-middle text-foreground', compactRows || comfortableRows ? 'py-0' : 'py-3', col.cellClassName?.(row), columnStyles?.[col.key] ??
-                                                        (mutedCellFallback
-                                                            ? 'text-muted-foreground'
-                                                            : ''), alignClass(col.align), col.key === 'actions' &&
-                                                        stickyActionsCellClass(idx % 2 === 0)), "data-slot": "table-cell", children: renderCellContent(row, col) }, col.key)))] }), expandable && expandedRow && (jsx("tr", { children: jsx("td", { colSpan: columns.length + leadingCols, className: "border-b bg-background p-0", children: expandable.render(row) }) }))] }, key));
-                            })) })] }) }), pagination] }));
+    return (jsxs("div", { className: `h-full w-full flex flex-col overflow-hidden rounded-lg border border-border bg-card ${className}`, "data-slot": "table-container", children: [jsxs("div", { className: "overflow-auto flex-1 isolate", children: [jsxs("table", { "data-slot": "table", className: "min-w-full w-full text-left text-sm", children: [jsx("thead", { className: "sticky top-0 z-40 border-b border-border !bg-table-header", children: jsxs("tr", { children: [expandable && (jsx("th", { className: "h-12 w-[52px] min-w-[52px] whitespace-nowrap px-3 text-left align-middle text-secondary-foreground" })), enableSelection && (jsx("th", { className: "h-12 w-[52px] min-w-[52px] whitespace-nowrap px-3 text-left align-middle", children: jsx(Checkbox, { checked: allSelected
+                                                    ? true
+                                                    : someSelected
+                                                        ? 'indeterminate'
+                                                        : false, onCheckedChange: toggleSelectAll, "aria-label": "Select all rows" }) })), columns.map((col) => (jsx("th", { className: cn('h-12 whitespace-nowrap px-4 text-left align-middle text-sm font-semibold text-secondary-foreground', alignClass(col.align), col.key === 'actions' && stickyActionsHeaderClass(), col.headerClassName), style: { width: col.width }, children: col.header }, col.key)))] }) }), jsx("tbody", { children: data.map((row, idx) => {
+                                    const key = rowKey(row);
+                                    const expandedRow = isExpanded(key);
+                                    return (jsxs(React__default.Fragment, { children: [jsxs("tr", { className: `cursor-pointer border-b border-border transition-colors hover:bg-muted/30 ${idx % 2 === 0 ? 'bg-card' : 'bg-alternativeTableColor'} ${comfortableRows ? 'h-[76px]' : ''} ${compactRows ? 'h-[52px]' : ''}`, children: [expandable && (jsx("td", { className: "border-b border-border px-3 align-middle whitespace-nowrap", children: jsx("button", { type: "button", onClick: (e) => {
+                                                                e.stopPropagation();
+                                                                toggleExpand(key);
+                                                            }, className: "flex size-8 cursor-pointer items-center justify-center rounded-md text-muted-foreground hover:bg-muted hover:text-foreground", "aria-expanded": expandedRow, "aria-label": expandedRow ? 'Collapse row' : 'Expand row', children: expandedRow ? (jsx(ChevronDown, { className: "size-4" })) : (jsx(ChevronRight, { className: "size-4" })) }) })), enableSelection && (jsx("td", { className: "border-b border-border px-3 align-middle", onClick: (e) => e.stopPropagation(), children: jsx(Checkbox, { checked: selectedIds.includes(key), onCheckedChange: () => toggleRow(key), "aria-label": "Select row" }) })), columns.map((col) => (jsx("td", { className: cn('border-b border-border px-4 align-middle text-foreground', compactRows || comfortableRows ? 'py-0' : 'py-3', col.cellClassName?.(row), columnStyles?.[col.key] ??
+                                                            (mutedCellFallback
+                                                                ? 'text-muted-foreground'
+                                                                : ''), alignClass(col.align), col.key === 'actions' &&
+                                                            stickyActionsCellClass(idx % 2 === 0)), "data-slot": "table-cell", children: renderCellContent(row, col) }, col.key)))] }), expandable && expandedRow && (jsx("tr", { children: jsx("td", { colSpan: columns.length + leadingCols, className: "border-b bg-background p-0", children: expandable.render(row) }) }))] }, key));
+                                }) })] }), data.length === 0 && jsx(TableEmptyState, { content: emptyState })] }), pagination] }));
 }
 function useCombinedRefs() {
@@ -27118,7 +27166,7 @@ function DataEditableTable({ data, columns, onRowClick, enableSelection = false,
                             top: overlay.top,
                             width: overlay.width,
                             height: overlay.height,
-                        }, children: jsx("div", { className: "sticky left-0 p-3", style: { width: overlay.visibleWidth }, children: jsx(TableRowsSkeleton, { rows: getSkeletonRowCount(overlay.height) }) }) })) : (loading && (jsx("div", { className: "sticky left-0 w-full p-3", children: jsx(TableRowsSkeleton, { rows: loadingRows }) }))), !loading && data.length === 0 && (jsx("div", { className: "sticky left-0 flex w-full items-center justify-center p-6 text-sm text-muted-foreground", children: emptyState ?? 'No data available' }))] }), loading && pagination ? (jsx(PaginationLoading, { children: pagination })) : (pagination)] }));
+                        }, children: jsx("div", { className: "sticky left-0 p-3", style: { width: overlay.visibleWidth }, children: jsx(TableRowsSkeleton, { rows: getSkeletonRowCount(overlay.height) }) }) })) : (loading && (jsx("div", { className: "sticky left-0 w-full p-3", children: jsx(TableRowsSkeleton, { rows: loadingRows }) }))), !loading && data.length === 0 && (jsx(TableEmptyState, { content: emptyState }))] }), loading && pagination ? (jsx(PaginationLoading, { children: pagination })) : (pagination)] }));
     if (!reorder.enabled)
         return table;
     return (jsx(DndContext, { sensors: reorder.sensors, onDragStart: reorder.onDragStart, onDragMove: reorder.onDragMove, onDragEnd: reorder.onDragEnd, onDragCancel: reorder.onDragCancel, children: table }));
@@ -27130,7 +27178,7 @@ function DataEditableTable({ data, columns, onRowClick, enableSelection = false,
  * `actions` column, and a pagination slot. For editable/resizable grids use
  * `DataEditableTable` instead.
  */
-function DataTable({ data, columns, onRowClick, enableSelection = false, columnStyles = {}, pagination, }) {
+function DataTable({ data, columns, onRowClick, enableSelection = false, columnStyles = {}, pagination, emptyState, }) {
     const [selected, setSelected] = useState([]);
     const allSelected = data.length > 0 && selected.length === data.length;
     const someSelected = selected.length > 0 && selected.length < data.length;
@@ -27143,13 +27191,13 @@ function DataTable({ data, columns, onRowClick, enableSelection = false, columnS
     const toggleRow = (id) => {
         setSelected((prev) => prev.includes(id) ? prev.filter((x) => x !== id) : [...prev, id]);
     };
-    return (jsxs("div", { className: "h-full w-full rounded-lg border border-border bg-card flex flex-col overflow-hidden", children: [jsx("div", { className: "overflow-auto flex-1 isolate", children: jsxs("table", { className: "min-w-[70vh] w-full text-left text-sm", children: [jsx("thead", { className: "sticky top-0 z-50 border-b border-border bg-table-header text-secondary-foreground", children: jsxs("tr", { className: "border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted", children: [enableSelection && (jsx("th", { className: "h-10 whitespace-nowrap p-2 pl-5 text-left align-middle font-semibold text-secondary-foreground", children: jsx(Checkbox, { checked: allSelected ? true : someSelected ? 'indeterminate' : false, onCheckedChange: toggleSelectAll }) })), columns.map((col) => (jsx("th", { className: cn('h-10 cursor-pointer whitespace-nowrap p-2 pl-5 text-left align-middle text-sm text-secondary-foreground', col.key === 'actions' &&
-                                            'sticky !right-0 top-0 z-40 w-[92px] min-w-[92px] max-w-[92px] px-2 text-center bg-table-header before:pointer-events-none before:absolute before:left-0 before:top-0 before:h-full before:w-px before:bg-border before:content-[""] shadow-[-3px_0_6px_-3px_rgba(0,0,0,0.08)]', col.key === 'id' || col.key === 'userId'
-                                            ? 'font-bold'
-                                            : 'font-semibold', col.headerClassName), children: col.header }, col.key.toString())))] }) }), jsx("tbody", { children: data.length === 0 ? (jsx("tr", { children: jsx("td", { colSpan: columns.length + (enableSelection ? 1 : 0), className: "p-0", children: jsx("div", { className: "flex w-full items-center justify-center py-16 text-muted-foreground", children: "No data available" }) }) })) : (data.map((row, idx) => (jsxs("tr", { className: cn('cursor-pointer border-b border-border transition-colors hover:bg-muted/40', idx % 2 === 0 ? 'bg-card' : 'bg-alternativeTableColor'), onClick: () => onRowClick?.(row), children: [enableSelection && (jsx("td", { className: "border-b border-border p-2 pl-5", children: jsx(Checkbox, { checked: selected.includes(row.id), onCheckedChange: () => toggleRow(row.id) }) })), columns.map((col) => (jsx("td", { className: cn('whitespace-nowrap border-b border-border p-2 pl-5 text-foreground', col.key === 'actions' &&
-                                            cn('sticky !right-0 z-30 w-[92px] min-w-[92px] max-w-[92px] px-2 text-center before:pointer-events-none before:absolute before:left-0 before:top-0 before:h-full before:w-px before:bg-border before:content-[""] shadow-[-3px_0_6px_-3px_rgba(0,0,0,0.08)]', idx % 2 === 0 ? 'bg-card' : 'bg-alternativeTableColor'), col.cellClassName?.(row), columnStyles[col.key.toString()] ?? 'text-muted-foreground'), children: col.render
-                                            ? col.render(row)
-                                            : row[col.key] }, col.key.toString())))] }, row.id)))) })] }) }), pagination] }));
+    return (jsxs("div", { className: "h-full w-full rounded-lg border border-border bg-card flex flex-col overflow-hidden", children: [jsxs("div", { className: "overflow-auto flex-1 isolate", children: [jsxs("table", { className: "min-w-[70vh] w-full text-left text-sm", children: [jsx("thead", { className: "sticky top-0 z-50 border-b border-border bg-table-header text-secondary-foreground", children: jsxs("tr", { className: "border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted", children: [enableSelection && (jsx("th", { className: "h-10 whitespace-nowrap p-2 pl-5 text-left align-middle font-semibold text-secondary-foreground", children: jsx(Checkbox, { checked: allSelected ? true : someSelected ? 'indeterminate' : false, onCheckedChange: toggleSelectAll }) })), columns.map((col) => (jsx("th", { className: cn('h-10 cursor-pointer whitespace-nowrap p-2 pl-5 text-left align-middle text-sm text-secondary-foreground', col.key === 'actions' &&
+                                                'sticky !right-0 top-0 z-40 w-[92px] min-w-[92px] max-w-[92px] px-2 text-center bg-table-header before:pointer-events-none before:absolute before:left-0 before:top-0 before:h-full before:w-px before:bg-border before:content-[""] shadow-[-3px_0_6px_-3px_rgba(0,0,0,0.08)]', col.key === 'id' || col.key === 'userId'
+                                                ? 'font-bold'
+                                                : 'font-semibold', col.headerClassName), children: col.header }, col.key.toString())))] }) }), jsx("tbody", { children: data.map((row, idx) => (jsxs("tr", { className: cn('cursor-pointer border-b border-border transition-colors hover:bg-muted/40', idx % 2 === 0 ? 'bg-card' : 'bg-alternativeTableColor'), onClick: () => onRowClick?.(row), children: [enableSelection && (jsx("td", { className: "border-b border-border p-2 pl-5", children: jsx(Checkbox, { checked: selected.includes(row.id), onCheckedChange: () => toggleRow(row.id) }) })), columns.map((col) => (jsx("td", { className: cn('whitespace-nowrap border-b border-border p-2 pl-5 text-foreground', col.key === 'actions' &&
+                                                cn('sticky !right-0 z-30 w-[92px] min-w-[92px] max-w-[92px] px-2 text-center before:pointer-events-none before:absolute before:left-0 before:top-0 before:h-full before:w-px before:bg-border before:content-[""] shadow-[-3px_0_6px_-3px_rgba(0,0,0,0.08)]', idx % 2 === 0 ? 'bg-card' : 'bg-alternativeTableColor'), col.cellClassName?.(row), columnStyles[col.key.toString()] ?? 'text-muted-foreground'), children: col.render
+                                                ? col.render(row)
+                                                : row[col.key] }, col.key.toString())))] }, row.id))) })] }), data.length === 0 && jsx(TableEmptyState, { content: emptyState })] }), pagination] }));
 }
 /**
@@ -43422,7 +43470,7 @@ function getEmptyStateDescription(itemNoun, activeCount) {
 /** Shown in place of rows when the applied column filters match nothing. */
 function FilterEmptyState({ itemNoun, title, description, activeCount, onClearAll, className, }) {
-    return (jsxs("div", { className: cn('flex flex-col items-center py-12 text-center', className), children: [jsx("div", { className: "flex size-10 items-center justify-center rounded-full bg-muted text-primary", children: jsx(FunnelX, { "aria-hidden": "true", className: "size-5" }) }), jsx("p", { className: "mt-4 text-base font-semibold text-foreground", children: title ?? getEmptyStateTitle(itemNoun) }), jsx("p", { className: "mt-1.5 max-w-sm text-sm text-muted-foreground", children: description ?? getEmptyStateDescription(itemNoun, activeCount) }), jsx(Button, { appearance: "outline", color: "primary", size: "md", onClick: onClearAll, leftIcon: jsx(RotateCcw, {}), className: "mt-5", children: "Clear all filters" })] }));
+    return (jsx(EmptyState, { icon: FunnelX, title: title ?? getEmptyStateTitle(itemNoun), description: description ?? getEmptyStateDescription(itemNoun, activeCount), action: jsx(Button, { appearance: "outline", color: "primary", size: "md", onClick: onClearAll, leftIcon: jsx(RotateCcw, {}), children: "Clear all filters" }), className: className }));
 }
 function getScalePosition(options, value, option) {
@@ -43802,6 +43850,154 @@ function TriStateFilter({ value, onChange, ariaLabel, compact = false, }) {
         }) }));
 }
+const SlideOut = ({ open, onOpenChange, ...props }) => {
+    const scheduleLockRelease = useOverlayBodyLockRelease(open);
+    return (jsx(DialogPrimitive.Root, { ...props, open: open, onOpenChange: (next) => {
+            onOpenChange?.(next);
+            if (!next)
+                scheduleLockRelease();
+        } }));
+};
+const SlideOutTrigger = DialogPrimitive.Trigger;
+const SlideOutClose = DialogPrimitive.Close;
+const SlideOutPortal = DialogPrimitive.Portal;
+// Overlay
+const SLIDE_OUT_OVERLAY_CLASS_NAME = 'fixed inset-0 z-40 bg-black/50';
+const SLIDE_OUT_OVERLAY_BLUR_CLASS_NAME = 'backdrop-blur-sm';
+/** The slide-outs' backdrop, dimmed and slightly blurred; other panels over the page reuse it to match. */
+const SLIDE_OUT_BACKDROP_CLASS_NAME = cn(SLIDE_OUT_OVERLAY_CLASS_NAME, SLIDE_OUT_OVERLAY_BLUR_CLASS_NAME);
+const SlideOutOverlay = React.forwardRef(({ className, ...props }, ref) => (jsx(DialogPrimitive.Overlay, { ref: ref, className: cn(SLIDE_OUT_OVERLAY_CLASS_NAME, className), ...props })));
+SlideOutOverlay.displayName = DialogPrimitive.Overlay.displayName;
+// Positional classes per edge. `right` is the historical default and its
+// value is byte-for-byte what SlideOutContent always rendered.
+const slideOutSideClasses = {
+    right: 'right-0 top-0 h-full w-[488px] max-w-full border-l slide-in-from-right',
+    left: 'left-0 top-0 h-full w-[488px] max-w-full border-r slide-in-from-left',
+    top: 'inset-x-0 top-0 h-1/3 w-full border-b slide-in-from-top',
+    bottom: 'inset-x-0 bottom-0 h-1/3 w-full border-t slide-in-from-bottom',
+};
+// Content — slide-out panel. Defaults to a right-anchored 488px drawer;
+// pass `side` to anchor to any edge (absorbs the old sheet/drawer use cases).
+const SlideOutContent = React.forwardRef(({ className, children, overlayClassName, side = 'right', ...props }, ref) => (jsxs(SlideOutPortal, { children: [jsx(SlideOutOverlay, { className: overlayClassName ?? SLIDE_OUT_OVERLAY_BLUR_CLASS_NAME }), jsx(DialogPrimitive.Content, { ref: ref, className: cn('fixed z-50 border-border bg-card text-card-foreground shadow-xl animate-in', slideOutSideClasses[side], className), ...props, children: children })] })));
+SlideOutContent.displayName = DialogPrimitive.Content.displayName;
+// Header — owns the standard 16px padding and bottom border.
+const SlideOutHeader = ({ className, ...props }) => (jsx("div", { className: cn('flex flex-col space-y-1.5 border-b border-border px-4 py-4 text-xs', className), ...props }));
+SlideOutHeader.displayName = 'SlideOutHeader';
+// Title
+const SlideOutTitle = React.forwardRef(({ className, ...props }, ref) => (jsx(DialogPrimitive.Title, { ref: ref, className: cn('text-lg font-semibold', className), ...props })));
+SlideOutTitle.displayName = DialogPrimitive.Title.displayName;
+// Description
+const SlideOutDescription = React.forwardRef(({ className, ...props }, ref) => (jsx(DialogPrimitive.Description, { ref: ref, className: cn('text-sm text-muted-foreground', className), ...props })));
+SlideOutDescription.displayName = DialogPrimitive.Description.displayName;
+/** The app's content area, right of the sidebar; the panel starts at its left edge. */
+const SIDEBAR_INSET_SELECTOR = '[data-slot="sidebar-inset"]';
+/** Dropdowns, menus and listboxes, portaled outside the panel; an outside click first closes them. */
+const OPEN_LAYER_SELECTOR = '[data-slot="popover-content"], [role="menu"], [role="listbox"]';
+/** How long the panel takes to slide out; it stays mounted until then. */
+const SLIDE_OUT_MS = 200;
+/** The top-level element under `<body>` that holds `node`: the app root, for a node in the page. */
+function getBodyChild(node) {
+    let current = node;
+    while (current && current.parentElement !== node.ownerDocument.body)
+        current = current.parentElement;
+    return current;
+}
+/**
+ * Backdrop handlers that call `onClose` on a click outside the panel, unless a dropdown or menu was open
+ * when the press began: that click only closes the dropdown.
+ */
+function useBackdropClose(onClose) {
+    const layerOpenRef = useRef(false);
+    return {
+        onPointerDown: () => {
+            layerOpenRef.current = !!document.querySelector(OPEN_LAYER_SELECTOR);
+        },
+        onClick: () => {
+            if (!layerOpenRef.current)
+                onClose?.();
+            layerOpenRef.current = false;
+        },
+    };
+}
+/** Keeps the panel mounted while it slides out; `closing` is true for that time. */
+function useSlideOverPresence(open) {
+    const [mounted, setMounted] = useState(open);
+    useEffect(() => {
+        if (open) {
+            setMounted(true);
+            return;
+        }
+        const timer = window.setTimeout(() => setMounted(false), SLIDE_OUT_MS);
+        return () => window.clearTimeout(timer);
+    }, [open]);
+    return { mounted: mounted || open, closing: mounted && !open };
+}
+/** Where the content area right of the sidebar starts, in px from the viewport's left; 0 without a sidebar. */
+function useSidebarInsetLeft(active) {
+    const [left, setLeft] = useState(0);
+    useLayoutEffect(() => {
+        if (!active)
+            return;
+        const inset = document.querySelector(SIDEBAR_INSET_SELECTOR);
+        if (!inset)
+            return;
+        const measure = () => setLeft(Math.max(0, inset.getBoundingClientRect().left));
+        measure();
+        // The inset narrows or widens with the window and the sidebar.
+        const observer = new ResizeObserver(measure);
+        observer.observe(inset);
+        window.addEventListener('resize', measure);
+        return () => {
+            observer.disconnect();
+            window.removeEventListener('resize', measure);
+        };
+    }, [active]);
+    return left;
+}
+/**
+ * While `active`, makes the app behind the panel inert (no clicks, focus or screen reader) and moves focus
+ * into `panel`; on close, focus goes back where it was. Popovers and menus portal outside the app root, so
+ * they stay usable.
+ */
+function useModalPanel(anchor, panel, active) {
+    useEffect(() => {
+        const root = anchor.current && getBodyChild(anchor.current);
+        if (!active || !(root instanceof HTMLElement))
+            return;
+        const previousFocus = document.activeElement;
+        const wasInert = root.inert;
+        root.inert = true;
+        panel.current?.focus({ preventScroll: true });
+        return () => {
+            root.inert = wasInert;
+            if (previousFocus instanceof HTMLElement)
+                previousFocus.focus({ preventScroll: true });
+        };
+    }, [anchor, panel, active]);
+}
+/**
+ * A large panel that slides in from the right over the page and covers everything right of the sidebar,
+ * floating with a small gap on every side and rounded corners, on the slide-outs' dimmed, slightly blurred
+ * backdrop. The page behind, sidebar included, can't be used until it closes. A click outside calls
+ * `onClose`; the content closes it otherwise (a close button, Escape).
+ */
+function FloatingSlideOver({ open, title, onClose, className, children, }) {
+    const anchorRef = useRef(null);
+    const panelRef = useRef(null);
+    const { mounted, closing } = useSlideOverPresence(open);
+    const left = useSidebarInsetLeft(mounted);
+    useModalPanel(anchorRef, panelRef, mounted);
+    const backdrop = useBackdropClose(onClose);
+    const state = closing ? 'closed' : 'open';
+    return (jsxs(Fragment$2, { children: [jsx("span", { ref: anchorRef, hidden: true }), mounted &&
+                createPortal(jsxs(Fragment$2, { children: [jsx("div", { "aria-hidden": "true", "data-state": state, className: SLIDE_OUT_BACKDROP_CLASS_NAME, onPointerDown: backdrop.onPointerDown, onClick: backdrop.onClick }), jsx("div", { ref: panelRef, role: "dialog", "aria-modal": "true", "aria-label": title, tabIndex: -1, "data-state": state,
+                            // The same gap from the sidebar's edge as on the other sides.
+                            style: { left: `calc(${left}px + 0.5rem)` }, className: cn('fixed inset-y-2 right-2 z-50 flex flex-col overflow-hidden rounded-xl border border-border bg-background shadow-xl outline-none', 'data-[state=open]:animate-in data-[state=open]:slide-in-from-right data-[state=open]:duration-300 data-[state=open]:ease-out', 'data-[state=closed]:animate-out data-[state=closed]:slide-out-to-right data-[state=closed]:duration-200 data-[state=closed]:ease-in', 'motion-reduce:animate-none', className), children: children })] }), document.body)] }));
+}
 /** Read-only filter summaries of a saved search, as pills; optionally one line ending in "+N more". */
 function SavedSearchChipList({ chips, emptyText = 'No filters', collapsible = false, className, }) {
     const { listRef, expanded, toggle, visibleChips, hiddenCount } = useChipOverflow(chips, collapsible);
@@ -73449,7 +73645,7 @@ const SidebarRail = React.forwardRef(({ className, ...props }, ref) => {
     return (jsx("button", { ref: ref, "data-sidebar": "rail", "aria-label": "Toggle Sidebar", tabIndex: -1, onClick: toggleSidebar, title: "Toggle Sidebar", className: cn('absolute inset-y-0 z-20 hidden w-4 -translate-x-1/2 transition-all ease-linear after:absolute after:inset-y-0 after:left-1/2 after:w-[2px] hover:after:bg-sidebar-border group-data-[side=left]:-right-4 group-data-[side=right]:left-0 sm:flex', '[[data-side=left]_&]:cursor-w-resize [[data-side=right]_&]:cursor-e-resize', '[[data-side=left][data-state=collapsed]_&]:cursor-e-resize [[data-side=right][data-state=collapsed]_&]:cursor-w-resize', 'group-data-[collapsible=offcanvas]:translate-x-0 group-data-[collapsible=offcanvas]:after:left-full group-data-[collapsible=offcanvas]:hover:bg-sidebar', 'group-data-[side=left][data-collapsible=offcanvas]:-right-2', 'group-data-[side=right][data-collapsible=offcanvas]:-left-2', className), ...props }));
 });
 SidebarRail.displayName = 'SidebarRail';
-const SidebarInset = React.forwardRef(({ className, ...props }, ref) => (jsx("main", { ref: ref, className: cn('relative flex min-h-screen flex-1 flex-col bg-background', 'peer-data-[variant=inset]:min-h-[calc(100svh-1rem)] md:peer-data-[state=collapsed]:peer-data-[variant=inset]:ml-2 md:peer-data-[variant=inset]:m-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow', className), ...props })));
+const SidebarInset = React.forwardRef(({ className, ...props }, ref) => (jsx("main", { ref: ref, "data-slot": "sidebar-inset", className: cn('relative flex min-h-screen flex-1 flex-col bg-background', 'peer-data-[variant=inset]:min-h-[calc(100svh-1rem)] md:peer-data-[state=collapsed]:peer-data-[variant=inset]:ml-2 md:peer-data-[variant=inset]:m-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow', className), ...props })));
 SidebarInset.displayName = 'SidebarInset';
 const SidebarInput = React.forwardRef(({ className, ...props }, ref) => (jsx("input", { ref: ref, "data-sidebar": "input", className: cn('h-8 w-full bg-background text-sm shadow-none focus-visible:ring-2 focus-visible:ring-sidebar-ring', className), ...props })));
 SidebarInput.displayName = 'SidebarInput';
@@ -73587,42 +73783,6 @@ const AppSidebar = ({ brand, navGroups = [], footer, className, }) => {
     return (jsxs(Sidebar, { collapsible: "icon", className: className, children: [brand && (jsx(SidebarHeader, { children: jsx(BrandHeader$1, { brand: brand }) })), jsx(SidebarContent, { children: navGroups.map((group) => (jsx(NavGroupSection, { group: group }, group.label ?? 'nav-group'))) }), footer && jsx(SidebarFooter, { children: footer }), jsx(SidebarRail, {})] }));
 };
-const SlideOut = ({ open, onOpenChange, ...props }) => {
-    const scheduleLockRelease = useOverlayBodyLockRelease(open);
-    return (jsx(DialogPrimitive.Root, { ...props, open: open, onOpenChange: (next) => {
-            onOpenChange?.(next);
-            if (!next)
-                scheduleLockRelease();
-        } }));
-};
-const SlideOutTrigger = DialogPrimitive.Trigger;
-const SlideOutClose = DialogPrimitive.Close;
-const SlideOutPortal = DialogPrimitive.Portal;
-// Overlay
-const SlideOutOverlay = React.forwardRef(({ className, ...props }, ref) => (jsx(DialogPrimitive.Overlay, { ref: ref, className: cn('fixed inset-0 z-40 bg-black/50', className), ...props })));
-SlideOutOverlay.displayName = DialogPrimitive.Overlay.displayName;
-// Positional classes per edge. `right` is the historical default and its
-// value is byte-for-byte what SlideOutContent always rendered.
-const slideOutSideClasses = {
-    right: 'right-0 top-0 h-full w-[488px] max-w-full border-l slide-in-from-right',
-    left: 'left-0 top-0 h-full w-[488px] max-w-full border-r slide-in-from-left',
-    top: 'inset-x-0 top-0 h-1/3 w-full border-b slide-in-from-top',
-    bottom: 'inset-x-0 bottom-0 h-1/3 w-full border-t slide-in-from-bottom',
-};
-// Content — slide-out panel. Defaults to a right-anchored 488px drawer;
-// pass `side` to anchor to any edge (absorbs the old sheet/drawer use cases).
-const SlideOutContent = React.forwardRef(({ className, children, overlayClassName, side = 'right', ...props }, ref) => (jsxs(SlideOutPortal, { children: [jsx(SlideOutOverlay, { className: overlayClassName ?? 'backdrop-blur-sm' }), jsx(DialogPrimitive.Content, { ref: ref, className: cn('fixed z-50 border-border bg-card text-card-foreground shadow-xl animate-in', slideOutSideClasses[side], className), ...props, children: children })] })));
-SlideOutContent.displayName = DialogPrimitive.Content.displayName;
-// Header — owns the standard 16px padding and bottom border.
-const SlideOutHeader = ({ className, ...props }) => (jsx("div", { className: cn('flex flex-col space-y-1.5 border-b border-border px-4 py-4 text-xs', className), ...props }));
-SlideOutHeader.displayName = 'SlideOutHeader';
-// Title
-const SlideOutTitle = React.forwardRef(({ className, ...props }, ref) => (jsx(DialogPrimitive.Title, { ref: ref, className: cn('text-lg font-semibold', className), ...props })));
-SlideOutTitle.displayName = DialogPrimitive.Title.displayName;
-// Description
-const SlideOutDescription = React.forwardRef(({ className, ...props }, ref) => (jsx(DialogPrimitive.Description, { ref: ref, className: cn('text-sm text-muted-foreground', className), ...props })));
-SlideOutDescription.displayName = DialogPrimitive.Description.displayName;
 const SpecList = ({ rows, zebra = true, className, }) => {
     const visible = rows.filter((r) => !r.hidden);
     if (visible.length === 0)
@@ -77856,6 +78016,7 @@ function FilterField(props) {
 /** Leaves without applying; the draft is discarded. */
 const BACK_LABEL = 'Back without applying';
+const CLOSE_LABEL = 'Close without applying';
 const LOADING_LABEL = 'Loading filters';
 const ERROR_TITLE = "Couldn't load filters";
 const DEFAULT_ERROR_MESSAGE = 'Something went wrong while loading the filters. Check your connection and try again.';
@@ -78369,11 +78530,11 @@ function FilterCardOverlay({ node, }) {
 }
 /** Full-page filter screen (e.g. an advanced search): one sticky header with every action, then the scrolling card grid. */
-function FilterSurface({ title, headerActions, primaryActions, chips, onClose, status = 'ready', errorMessage, onRetry, skeleton, children, }) {
+function FilterSurface({ title, headerActions, primaryActions, chips, onClose, closeButton = 'back', status = 'ready', errorMessage, onRetry, skeleton, children, }) {
     useCloseOnEscape(onClose);
     const ready = status === 'ready';
     const actions = ready ? primaryActions : undefined;
-    return (jsxs("div", { role: "region", "aria-label": title, className: "flex h-full min-h-0 flex-col bg-background", children: [jsxs("header", { className: "sticky top-0 z-20 flex shrink-0 flex-wrap items-center gap-x-3 gap-y-2 bg-background px-3 py-2.5", children: [jsx(IconButton, { appearance: "ghost", size: "sm", "aria-label": BACK_LABEL, title: BACK_LABEL, onClick: onClose, children: jsx(ArrowLeft, {}) }), jsx("h1", { className: "sr-only", children: title }), jsx("div", { className: "min-w-0 flex-1", children: ready && chips }), jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [headerActions, actions] })] }), jsx("div", { className: "min-h-0 flex-1 overflow-y-auto px-3 pb-3", children: status === 'loading' ? (jsx(FilterSurfaceSkeleton, { children: skeleton })) : status === 'error' ? (jsx(FilterSurfaceError, { message: errorMessage ?? DEFAULT_ERROR_MESSAGE, onRetry: onRetry })) : (jsx("div", { className: "flex flex-col gap-3", children: children })) })] }));
+    return (jsxs("div", { role: "region", "aria-label": title, className: "flex h-full min-h-0 flex-col bg-background", children: [jsxs("header", { className: "sticky top-0 z-20 flex shrink-0 flex-wrap items-center gap-x-3 gap-y-2 bg-background px-3 py-2.5", children: [closeButton === 'back' && (jsx(IconButton, { appearance: "ghost", size: "sm", "aria-label": BACK_LABEL, title: BACK_LABEL, onClick: onClose, children: jsx(ArrowLeft, {}) })), jsx("h1", { className: "sr-only", children: title }), jsx("div", { className: "min-w-0 flex-1", children: ready && chips }), jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [headerActions, actions, closeButton === 'close' && (jsxs(Fragment$2, { children: [jsx("span", { "aria-hidden": "true", className: "mx-1 h-6 w-px bg-border" }), jsx(IconButton, { appearance: "ghost", size: "sm", "aria-label": CLOSE_LABEL, title: CLOSE_LABEL, onClick: onClose, children: jsx(X$2, {}) })] }))] })] }), jsx("div", { className: "min-h-0 flex-1 overflow-y-auto px-3 pb-3", children: status === 'loading' ? (jsx(FilterSurfaceSkeleton, { children: skeleton })) : status === 'error' ? (jsx(FilterSurfaceError, { message: errorMessage ?? DEFAULT_ERROR_MESSAGE, onRetry: onRetry })) : (jsx("div", { className: "flex flex-col gap-3", children: children })) })] }));
 }
 /**
  * Lets the user drag the cards of its `FilterSurfaceGroup`s (those with a `sortableId`) into any order and
@@ -80974,5 +81135,5 @@ var RichTextAreaImpl = /*#__PURE__*/Object.freeze({
   RichTextarea: RichTextarea
 });
-export { ACTIVITY_CATEGORIES, ACTIVITY_CATEGORY_META, ActionBadge, ActionButtonWithTooltip, ActiveFilterChips, ActivityFeed, AdvancedSearchDrawer, Alert, ApiComboBox, AppSidebar, AuditEntryCard, AuditHistoryPanel, AuditTimeline, AuditTimelineShimmer, Badge, BadgeType, BusinessContactStatusFilter, Button, CUSTOMER_AUDIT_CONFIG, CertificateRowList, ChangePill, Collapsible, CollapsibleCard, CollapsibleContent, CollapsibleTrigger, CompanyCard, ConfirmDialog, ContactTypeFilter, ContainsFilter, CopyButton, CountrySelect, CreateFormPageHeader, CreateFormPageShell, CurrencyDisplayTabs, CurrencyInput, CurrencyToggle, CustomCombobox, CustomFieldInput, CustomFieldValue, CustomTable, CustomizeColumnsDrawer, DATE_PRESET_OPTIONS, DIAMOND_AUDIT_CONFIG, DashboardShell, DataEditableTable, DataTable, DateInput, DateRangeFilter, DetailChip, DetailPageLayout, DetailPageSkeleton, DetailSection, DocumentDeleteDialog, DocumentDetailSkeleton, DocumentHero, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyValue, EntityHeader, FILTER_COUNT_BADGE_CLASS_NAME, Field, FieldSkeleton, FileUploader, FilterCardSkeleton, FilterCellPopover, FilterEmptyState, FilterField, FilterFieldCard, FilterFieldCell, FilterFieldControl, FilterMultiSelect, FilterPanel, FilterSelect, FilterSurface, FilterSurfaceGroup, FilterSurfaceMore, FilterSurfaceSortable, FormSectionCard, FormSectionCardSkeleton, GEM_AUDIT_CONFIG, HistoryEntryCard, HistoryTimeline, HistoryTimelineShimmer, INVOICE_AUDIT_CONFIG, IconButton, IdHyperlinkText, IdListInput, InAppNotificationCard, InAppNotificationsPanel, InfoBanner, InventoryComboBox, InventoryItemCard, InventoryItemRow, InvoiceComboBox, KYCStatusFilter, KeyValueGrid, LAYOUT_AUDIT_CONFIG, LabeledToggle, LineItemsCard, LineProductCell, LineProductThumb, LineProductTypeChip, LineRowActionsMenu, LineTable, LineTableEmpty, MEMO_IN_AUDIT_CONFIG, MEMO_OUT_AUDIT_CONFIG, MediaGallery, MemoInComboBox, MetricCard, MetricRow, MetricTile, Modal, MoreInfoPanel, MoreInfoTrigger, NOT_CAPTURED, Navbar, NavbarActions, NavbarAvatar, NavbarIconButton, NavbarSearch, NavbarTitle, NumberExpressionFilter, NumberInput, NumberRangeInputs, NumberedStepCard, OtpInput, OwnershipFilter, OwnershipSplitCard, PROFORMA_AUDIT_CONFIG, PageHeader, PageTabs, Pagination, PaginationSelect, PartnerShareCard, PickListDropdown, PickListFilter, PriceInput, Protected, PurchaseOrderComboBox, QUOTATION_AUDIT_CONFIG, RadioCardGroup, ReadMoreText, RefreshButton, RichTextarea$1 as RichTextarea, SAVED_SEARCH_NAME_MAX_LENGTH, SEARCHABLE_SELECT_PAGE_SIZE, SafeImage, SaveSearchDialog, SavedSearchChipList, SavedSearchDetail, SavedSearchesMenu, ScaleRangeFilter, ScrollFade, SearchBox, SearchInput, SearchableSelect, SectionCard, SectionIcon, SegmentedControl, ShareDialog, ShareMenu, ShimmerTable, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupLabel, SidebarHeader, SidebarInset, SidebarMenu, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, SlideOut, SlideOutClose, SlideOutContent, SlideOutDescription, SlideOutHeader, SlideOutOverlay, SlideOutPortal, SlideOutTitle, SlideOutTrigger, Slider, SpecList, Spinner, SquareSkeleton, StateSelect, StatusBadge$1 as StatusBadge, StatusFilter, Stepper, StockTypeFilter, TablePagination, TableRowsSkeleton, TableSkeleton, Tabs, TabsContent, TabsList, TabsTrigger, TagsInput, TextHyperlink, TimePicker, ToggleSwitch, TriStateFilter, TruncateTooltip, TruncatedLabel, WarehouseComboBox, WarehouseFilter, ZoomSplitViewer, asList, asText, badgeVariants, buildBulkShareMessage, buildBulkShareTitle, buildInventoryPublicUrl, buildInventoryRowProps, buildInventoryShareTitle, buildNumberRuleHelp, buildWhatsappUrl, buttonVariants, cn, countries, countryByCode, createVideoMediaItem, describeFilterValue, dropdownMenuItemDestructiveClass, expandScaleRange, fieldTypeIcon, filterSavedSearches, findRegion, flagEmoji, formatAddressLocation, formatDateRange, formatFileSize, formatNumberRange, formatScaleRange, formatSelectedCount, generateActionDescription, generateTitle, getBadgeTypeForStatus, getChangePills, getCountryName, getInitials, getStatesOfCountry, iconButtonVariants, inAppNotificationCardA11y, inAppNotificationsPanelA11y, isBlank, isDuplicateSearchName, isFilterValueActive, isIndiaCountry, isKnownRegion, isPathActive, isValidAlpha2CountryCode, isValidSearchName, isValueEmpty, notify, parseNumberExpression, releaseStaleOverlayBodyLock, renderBadge, resolveCountryCode, resolveDatePreset, resolveDateRange, richTextChangeText, splitIdList, toAddressFormValues, toBoolValue, toContainsValue, toDateValue, toIdsValue, toListValue, toNumberValue, toScaleValue, useAuditShowMore, useBadge, useButton, useDropdownMenu, useInAppNotificationsPanel, useNavbar, useSidebar, valueOfType, videoThumbnailSrc, watchOverlayBodyLock };
+export { ACTIVITY_CATEGORIES, ACTIVITY_CATEGORY_META, ActionBadge, ActionButtonWithTooltip, ActiveFilterChips, ActivityFeed, AdvancedSearchDrawer, Alert, ApiComboBox, AppSidebar, AuditEntryCard, AuditHistoryPanel, AuditTimeline, AuditTimelineShimmer, Badge, BadgeType, BusinessContactStatusFilter, Button, CUSTOMER_AUDIT_CONFIG, CertificateRowList, ChangePill, Collapsible, CollapsibleCard, CollapsibleContent, CollapsibleTrigger, CompanyCard, ConfirmDialog, ContactTypeFilter, ContainsFilter, CopyButton, CountrySelect, CreateFormPageHeader, CreateFormPageShell, CurrencyDisplayTabs, CurrencyInput, CurrencyToggle, CustomCombobox, CustomFieldInput, CustomFieldValue, CustomTable, CustomizeColumnsDrawer, DATE_PRESET_OPTIONS, DIAMOND_AUDIT_CONFIG, DashboardShell, DataEditableTable, DataTable, DateInput, DateRangeFilter, DetailChip, DetailPageLayout, DetailPageSkeleton, DetailSection, DocumentDeleteDialog, DocumentDetailSkeleton, DocumentHero, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, EmptyValue, EntityHeader, FILTER_COUNT_BADGE_CLASS_NAME, Field, FieldSkeleton, FileUploader, FilterCardSkeleton, FilterCellPopover, FilterEmptyState, FilterField, FilterFieldCard, FilterFieldCell, FilterFieldControl, FilterMultiSelect, FilterPanel, FilterSelect, FilterSurface, FilterSurfaceGroup, FilterSurfaceMore, FilterSurfaceSortable, FloatingSlideOver, FormSectionCard, FormSectionCardSkeleton, GEM_AUDIT_CONFIG, HistoryEntryCard, HistoryTimeline, HistoryTimelineShimmer, INVOICE_AUDIT_CONFIG, IconButton, IdHyperlinkText, IdListInput, InAppNotificationCard, InAppNotificationsPanel, InfoBanner, InventoryComboBox, InventoryItemCard, InventoryItemRow, InvoiceComboBox, KYCStatusFilter, KeyValueGrid, LAYOUT_AUDIT_CONFIG, LabeledToggle, LineItemsCard, LineProductCell, LineProductThumb, LineProductTypeChip, LineRowActionsMenu, LineTable, LineTableEmpty, MEMO_IN_AUDIT_CONFIG, MEMO_OUT_AUDIT_CONFIG, MediaGallery, MemoInComboBox, MetricCard, MetricRow, MetricTile, Modal, MoreInfoPanel, MoreInfoTrigger, NOT_CAPTURED, Navbar, NavbarActions, NavbarAvatar, NavbarIconButton, NavbarSearch, NavbarTitle, NumberExpressionFilter, NumberInput, NumberRangeInputs, NumberedStepCard, OtpInput, OwnershipFilter, OwnershipSplitCard, PROFORMA_AUDIT_CONFIG, PageHeader, PageTabs, Pagination, PaginationSelect, PartnerShareCard, PickListDropdown, PickListFilter, PriceInput, Protected, PurchaseOrderComboBox, QUOTATION_AUDIT_CONFIG, RadioCardGroup, ReadMoreText, RefreshButton, RichTextarea$1 as RichTextarea, SAVED_SEARCH_NAME_MAX_LENGTH, SEARCHABLE_SELECT_PAGE_SIZE, SafeImage, SaveSearchDialog, SavedSearchChipList, SavedSearchDetail, SavedSearchesMenu, ScaleRangeFilter, ScrollFade, SearchBox, SearchInput, SearchableSelect, SectionCard, SectionIcon, SegmentedControl, ShareDialog, ShareMenu, ShimmerTable, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupLabel, SidebarHeader, SidebarInset, SidebarMenu, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, SlideOut, SlideOutClose, SlideOutContent, SlideOutDescription, SlideOutHeader, SlideOutOverlay, SlideOutPortal, SlideOutTitle, SlideOutTrigger, Slider, SpecList, Spinner, SquareSkeleton, StateSelect, StatusBadge$1 as StatusBadge, StatusFilter, Stepper, StockTypeFilter, TableEmptyState, TablePagination, TableRowsSkeleton, TableSkeleton, Tabs, TabsContent, TabsList, TabsTrigger, TagsInput, TextHyperlink, TimePicker, ToggleSwitch, TriStateFilter, TruncateTooltip, TruncatedLabel, WarehouseComboBox, WarehouseFilter, ZoomSplitViewer, asList, asText, badgeVariants, buildBulkShareMessage, buildBulkShareTitle, buildInventoryPublicUrl, buildInventoryRowProps, buildInventoryShareTitle, buildNumberRuleHelp, buildWhatsappUrl, buttonVariants, cn, countries, countryByCode, createVideoMediaItem, describeFilterValue, dropdownMenuItemDestructiveClass, expandScaleRange, fieldTypeIcon, filterSavedSearches, findRegion, flagEmoji, formatAddressLocation, formatDateRange, formatFileSize, formatNumberRange, formatScaleRange, formatSelectedCount, generateActionDescription, generateTitle, getBadgeTypeForStatus, getChangePills, getCountryName, getInitials, getStatesOfCountry, iconButtonVariants, inAppNotificationCardA11y, inAppNotificationsPanelA11y, isBlank, isDuplicateSearchName, isFilterValueActive, isIndiaCountry, isKnownRegion, isPathActive, isValidAlpha2CountryCode, isValidSearchName, isValueEmpty, notify, parseNumberExpression, releaseStaleOverlayBodyLock, renderBadge, resolveCountryCode, resolveDatePreset, resolveDateRange, richTextChangeText, splitIdList, toAddressFormValues, toBoolValue, toContainsValue, toDateValue, toIdsValue, toListValue, toNumberValue, toScaleValue, useAuditShowMore, useBadge, useButton, useDropdownMenu, useInAppNotificationsPanel, useNavbar, useSidebar, valueOfType, videoThumbnailSrc, watchOverlayBodyLock };
 //# sourceMappingURL=index.esm.js.map