@hexclave/dashboard-ui-components 1.0.0 → 1.0.2

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 (86) hide show
  1. package/dist/components/alert.js +4 -4
  2. package/dist/components/alert.js.map +1 -1
  3. package/dist/components/analytics-chart/analytics-chart-pie.js +33 -11
  4. package/dist/components/analytics-chart/analytics-chart-pie.js.map +1 -1
  5. package/dist/components/analytics-chart/analytics-chart.js +3 -3
  6. package/dist/components/analytics-chart/analytics-chart.js.map +1 -1
  7. package/dist/components/analytics-chart/default-analytics-chart-tooltip.js +4 -4
  8. package/dist/components/analytics-chart/default-analytics-chart-tooltip.js.map +1 -1
  9. package/dist/components/analytics-chart/types.d.ts +1 -0
  10. package/dist/components/analytics-chart/types.d.ts.map +1 -1
  11. package/dist/components/analytics-chart/types.js.map +1 -1
  12. package/dist/components/badge.js +2 -2
  13. package/dist/components/badge.js.map +1 -1
  14. package/dist/components/button.d.ts +4 -4
  15. package/dist/components/button.js +11 -11
  16. package/dist/components/button.js.map +1 -1
  17. package/dist/components/card.js +7 -7
  18. package/dist/components/card.js.map +1 -1
  19. package/dist/components/chart-card.js +3 -3
  20. package/dist/components/chart-card.js.map +1 -1
  21. package/dist/components/chart-container.js +2 -2
  22. package/dist/components/chart-container.js.map +1 -1
  23. package/dist/components/chart-legend.js +3 -3
  24. package/dist/components/chart-legend.js.map +1 -1
  25. package/dist/components/chart-tooltip.js +7 -7
  26. package/dist/components/chart-tooltip.js.map +1 -1
  27. package/dist/components/data-grid/data-grid-toolbar.js +7 -7
  28. package/dist/components/data-grid/data-grid-toolbar.js.map +1 -1
  29. package/dist/components/data-grid/data-grid.js +16 -16
  30. package/dist/components/data-grid/data-grid.js.map +1 -1
  31. package/dist/components/data-grid/state.js +2 -2
  32. package/dist/components/data-grid/state.js.map +1 -1
  33. package/dist/components/dialog.js +22 -22
  34. package/dist/components/dialog.js.map +1 -1
  35. package/dist/components/empty-state.js +2 -2
  36. package/dist/components/empty-state.js.map +1 -1
  37. package/dist/components/input.js +8 -8
  38. package/dist/components/input.js.map +1 -1
  39. package/dist/components/metric-card.js +5 -5
  40. package/dist/components/metric-card.js.map +1 -1
  41. package/dist/components/pill-toggle.js +11 -10
  42. package/dist/components/pill-toggle.js.map +1 -1
  43. package/dist/components/progress-bar.js +4 -4
  44. package/dist/components/progress-bar.js.map +1 -1
  45. package/dist/components/separator.js +2 -2
  46. package/dist/components/separator.js.map +1 -1
  47. package/dist/components/skeleton.js +2 -2
  48. package/dist/components/skeleton.js.map +1 -1
  49. package/dist/components/table.js +14 -14
  50. package/dist/components/table.js.map +1 -1
  51. package/dist/components/tabs.js +10 -10
  52. package/dist/components/tabs.js.map +1 -1
  53. package/dist/dashboard-ui-components.global.js +1720 -1678
  54. package/dist/dashboard-ui-components.global.js.map +4 -4
  55. package/dist/esm/components/alert.js.map +1 -1
  56. package/dist/esm/components/analytics-chart/analytics-chart-pie.js +33 -11
  57. package/dist/esm/components/analytics-chart/analytics-chart-pie.js.map +1 -1
  58. package/dist/esm/components/analytics-chart/analytics-chart.js.map +1 -1
  59. package/dist/esm/components/analytics-chart/default-analytics-chart-tooltip.js.map +1 -1
  60. package/dist/esm/components/analytics-chart/types.d.ts +1 -0
  61. package/dist/esm/components/analytics-chart/types.d.ts.map +1 -1
  62. package/dist/esm/components/analytics-chart/types.js.map +1 -1
  63. package/dist/esm/components/badge.js.map +1 -1
  64. package/dist/esm/components/button.d.ts +4 -4
  65. package/dist/esm/components/button.js.map +1 -1
  66. package/dist/esm/components/card.js.map +1 -1
  67. package/dist/esm/components/chart-card.js.map +1 -1
  68. package/dist/esm/components/chart-container.js.map +1 -1
  69. package/dist/esm/components/chart-legend.js.map +1 -1
  70. package/dist/esm/components/chart-tooltip.js.map +1 -1
  71. package/dist/esm/components/data-grid/data-grid-toolbar.js.map +1 -1
  72. package/dist/esm/components/data-grid/data-grid.js.map +1 -1
  73. package/dist/esm/components/data-grid/state.js.map +1 -1
  74. package/dist/esm/components/dialog.js.map +1 -1
  75. package/dist/esm/components/empty-state.js.map +1 -1
  76. package/dist/esm/components/input.js.map +1 -1
  77. package/dist/esm/components/metric-card.js.map +1 -1
  78. package/dist/esm/components/pill-toggle.js +1 -0
  79. package/dist/esm/components/pill-toggle.js.map +1 -1
  80. package/dist/esm/components/progress-bar.js.map +1 -1
  81. package/dist/esm/components/separator.js.map +1 -1
  82. package/dist/esm/components/skeleton.js.map +1 -1
  83. package/dist/esm/components/table.js.map +1 -1
  84. package/dist/esm/components/tabs.js +1 -1
  85. package/dist/esm/components/tabs.js.map +1 -1
  86. package/package.json +4 -4
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
4
4
  const require_chunk = require('../chunk-BE-pF4vm.js');
5
- let _stackframe_stack_ui = require("@hexclave/ui");
5
+ let _hexclave_ui = require("@hexclave/ui");
6
6
  let react_jsx_runtime = require("react/jsx-runtime");
7
7
 
8
8
  //#region src/components/skeleton.tsx
@@ -20,7 +20,7 @@ let react_jsx_runtime = require("react/jsx-runtime");
20
20
  */
21
21
  function DesignSkeleton({ className, ...props }) {
22
22
  return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
23
- className: (0, _stackframe_stack_ui.cn)("animate-pulse rounded-md bg-black/[0.06] dark:bg-white/[0.06]", className),
23
+ className: (0, _hexclave_ui.cn)("animate-pulse rounded-md bg-black/[0.06] dark:bg-white/[0.06]", className),
24
24
  ...props
25
25
  });
26
26
  }
@@ -1 +1 @@
1
- {"version":3,"file":"skeleton.js","names":[],"sources":["../../src/components/skeleton.tsx"],"sourcesContent":["\"use client\";\n\nimport { cn } from \"@stackframe/stack-ui\";\nimport type React from \"react\";\n\nexport type DesignSkeletonProps = React.HTMLAttributes<HTMLDivElement>;\n\n/**\n * Animated placeholder block. Use while data is loading — size it via\n * `className` to match the content it's standing in for.\n *\n * ```tsx\n * <DesignSkeleton className=\"h-4 w-[200px]\" />\n * <DesignSkeleton className=\"h-24 w-full rounded-lg\" />\n * ```\n *\n * Rule: always show a skeleton during initial load, not a spinner or\n * \"Loading...\" text. Skeletons preserve layout and feel faster.\n */\nexport function DesignSkeleton({ className, ...props }: DesignSkeletonProps) {\n return (\n <div\n className={cn(\n \"animate-pulse rounded-md bg-black/[0.06] dark:bg-white/[0.06]\",\n className\n )}\n {...props}\n />\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAmBA,SAAgB,eAAe,EAAE,WAAW,GAAG,SAA8B;AAC3E,QACE,2CAAC;EACC,wCACE,iEACA,UACD;EACD,GAAI;GACJ"}
1
+ {"version":3,"file":"skeleton.js","names":[],"sources":["../../src/components/skeleton.tsx"],"sourcesContent":["\"use client\";\n\nimport { cn } from \"@hexclave/ui\";\nimport type React from \"react\";\n\nexport type DesignSkeletonProps = React.HTMLAttributes<HTMLDivElement>;\n\n/**\n * Animated placeholder block. Use while data is loading — size it via\n * `className` to match the content it's standing in for.\n *\n * ```tsx\n * <DesignSkeleton className=\"h-4 w-[200px]\" />\n * <DesignSkeleton className=\"h-24 w-full rounded-lg\" />\n * ```\n *\n * Rule: always show a skeleton during initial load, not a spinner or\n * \"Loading...\" text. Skeletons preserve layout and feel faster.\n */\nexport function DesignSkeleton({ className, ...props }: DesignSkeletonProps) {\n return (\n <div\n className={cn(\n \"animate-pulse rounded-md bg-black/[0.06] dark:bg-white/[0.06]\",\n className\n )}\n {...props}\n />\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAmBA,SAAgB,eAAe,EAAE,WAAW,GAAG,SAA8B;AAC3E,QACE,2CAAC;EACC,gCACE,iEACA,UACD;EACD,GAAI;GACJ"}
@@ -2,9 +2,9 @@
2
2
 
3
3
  Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
4
4
  const require_chunk = require('../chunk-BE-pF4vm.js');
5
- let _stackframe_stack_ui = require("@hexclave/ui");
5
+ let _hexclave_ui = require("@hexclave/ui");
6
6
  let react_jsx_runtime = require("react/jsx-runtime");
7
- let _stackframe_stack_shared_dist_utils_react = require("@hexclave/shared/dist/utils/react");
7
+ let _hexclave_shared_dist_utils_react = require("@hexclave/shared/dist/utils/react");
8
8
  let react = require("react");
9
9
  react = require_chunk.__toESM(react);
10
10
 
@@ -34,42 +34,42 @@ react = require_chunk.__toESM(react);
34
34
  * </DesignTable>
35
35
  * ```
36
36
  */
37
- const DesignTable = (0, _stackframe_stack_shared_dist_utils_react.forwardRefIfNeeded)(({ className, ...props }, ref) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
37
+ const DesignTable = (0, _hexclave_shared_dist_utils_react.forwardRefIfNeeded)(({ className, ...props }, ref) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
38
38
  className: "relative w-full overflow-auto",
39
39
  children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("table", {
40
40
  ref,
41
- className: (0, _stackframe_stack_ui.cn)("w-full caption-bottom text-sm", className),
41
+ className: (0, _hexclave_ui.cn)("w-full caption-bottom text-sm", className),
42
42
  ...props
43
43
  })
44
44
  }));
45
45
  DesignTable.displayName = "DesignTable";
46
- const DesignTableHeader = (0, _stackframe_stack_shared_dist_utils_react.forwardRefIfNeeded)(({ className, ...props }, ref) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("thead", {
46
+ const DesignTableHeader = (0, _hexclave_shared_dist_utils_react.forwardRefIfNeeded)(({ className, ...props }, ref) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("thead", {
47
47
  ref,
48
- className: (0, _stackframe_stack_ui.cn)("bg-foreground/[0.02] [&_tr]:border-b [&_tr]:border-black/[0.06] dark:[&_tr]:border-white/[0.06]", className),
48
+ className: (0, _hexclave_ui.cn)("bg-foreground/[0.02] [&_tr]:border-b [&_tr]:border-black/[0.06] dark:[&_tr]:border-white/[0.06]", className),
49
49
  ...props
50
50
  }));
51
51
  DesignTableHeader.displayName = "DesignTableHeader";
52
- const DesignTableBody = (0, _stackframe_stack_shared_dist_utils_react.forwardRefIfNeeded)(({ className, ...props }, ref) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("tbody", {
52
+ const DesignTableBody = (0, _hexclave_shared_dist_utils_react.forwardRefIfNeeded)(({ className, ...props }, ref) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("tbody", {
53
53
  ref,
54
- className: (0, _stackframe_stack_ui.cn)("[&_tr:last-child]:border-0", className),
54
+ className: (0, _hexclave_ui.cn)("[&_tr:last-child]:border-0", className),
55
55
  ...props
56
56
  }));
57
57
  DesignTableBody.displayName = "DesignTableBody";
58
- const DesignTableRow = (0, _stackframe_stack_shared_dist_utils_react.forwardRefIfNeeded)(({ className, ...props }, ref) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("tr", {
58
+ const DesignTableRow = (0, _hexclave_shared_dist_utils_react.forwardRefIfNeeded)(({ className, ...props }, ref) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("tr", {
59
59
  ref,
60
- className: (0, _stackframe_stack_ui.cn)("border-b border-black/[0.06] dark:border-white/[0.06] transition-colors duration-150 hover:transition-none hover:bg-foreground/[0.04] data-[state=selected]:bg-foreground/[0.06]", className),
60
+ className: (0, _hexclave_ui.cn)("border-b border-black/[0.06] dark:border-white/[0.06] transition-colors duration-150 hover:transition-none hover:bg-foreground/[0.04] data-[state=selected]:bg-foreground/[0.06]", className),
61
61
  ...props
62
62
  }));
63
63
  DesignTableRow.displayName = "DesignTableRow";
64
- const DesignTableHead = (0, _stackframe_stack_shared_dist_utils_react.forwardRefIfNeeded)(({ className, ...props }, ref) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("th", {
64
+ const DesignTableHead = (0, _hexclave_shared_dist_utils_react.forwardRefIfNeeded)(({ className, ...props }, ref) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("th", {
65
65
  ref,
66
- className: (0, _stackframe_stack_ui.cn)("h-10 px-4 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]", className),
66
+ className: (0, _hexclave_ui.cn)("h-10 px-4 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]", className),
67
67
  ...props
68
68
  }));
69
69
  DesignTableHead.displayName = "DesignTableHead";
70
- const DesignTableCell = (0, _stackframe_stack_shared_dist_utils_react.forwardRefIfNeeded)(({ className, ...props }, ref) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("td", {
70
+ const DesignTableCell = (0, _hexclave_shared_dist_utils_react.forwardRefIfNeeded)(({ className, ...props }, ref) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("td", {
71
71
  ref,
72
- className: (0, _stackframe_stack_ui.cn)("p-4 align-middle [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]", className),
72
+ className: (0, _hexclave_ui.cn)("p-4 align-middle [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]", className),
73
73
  ...props
74
74
  }));
75
75
  DesignTableCell.displayName = "DesignTableCell";
@@ -1 +1 @@
1
- {"version":3,"file":"table.js","names":[],"sources":["../../src/components/table.tsx"],"sourcesContent":["\"use client\";\n\nimport { forwardRefIfNeeded } from \"@stackframe/stack-shared/dist/utils/react\";\nimport { cn } from \"@stackframe/stack-ui\";\nimport React from \"react\";\n\n/**\n * Simple static table — header + rows + cells. Use this for small,\n * read-only lists (< 20 rows, no interaction). For anything that needs\n * sorting, filtering, pagination, or virtualization, use `DataGrid` +\n * `useDataSource` instead.\n *\n * ```tsx\n * <DesignTable>\n * <DesignTableHeader>\n * <DesignTableRow>\n * <DesignTableHead>Name</DesignTableHead>\n * <DesignTableHead>Email</DesignTableHead>\n * </DesignTableRow>\n * </DesignTableHeader>\n * <DesignTableBody>\n * {rows.map(row => (\n * <DesignTableRow key={row.id}>\n * <DesignTableCell>{row.name}</DesignTableCell>\n * <DesignTableCell>{row.email}</DesignTableCell>\n * </DesignTableRow>\n * ))}\n * </DesignTableBody>\n * </DesignTable>\n * ```\n */\nexport const DesignTable = forwardRefIfNeeded<\n HTMLTableElement,\n React.HTMLAttributes<HTMLTableElement>\n>(({ className, ...props }, ref) => (\n <div className=\"relative w-full overflow-auto\">\n <table\n ref={ref}\n className={cn(\"w-full caption-bottom text-sm\", className)}\n {...props}\n />\n </div>\n));\nDesignTable.displayName = \"DesignTable\";\n\nexport const DesignTableHeader = forwardRefIfNeeded<\n HTMLTableSectionElement,\n React.HTMLAttributes<HTMLTableSectionElement>\n>(({ className, ...props }, ref) => (\n <thead\n ref={ref}\n className={cn(\"bg-foreground/[0.02] [&_tr]:border-b [&_tr]:border-black/[0.06] dark:[&_tr]:border-white/[0.06]\", className)}\n {...props}\n />\n));\nDesignTableHeader.displayName = \"DesignTableHeader\";\n\nexport const DesignTableBody = forwardRefIfNeeded<\n HTMLTableSectionElement,\n React.HTMLAttributes<HTMLTableSectionElement>\n>(({ className, ...props }, ref) => (\n <tbody\n ref={ref}\n className={cn(\"[&_tr:last-child]:border-0\", className)}\n {...props}\n />\n));\nDesignTableBody.displayName = \"DesignTableBody\";\n\nexport const DesignTableRow = forwardRefIfNeeded<\n HTMLTableRowElement,\n React.HTMLAttributes<HTMLTableRowElement>\n>(({ className, ...props }, ref) => (\n <tr\n ref={ref}\n className={cn(\n \"border-b border-black/[0.06] dark:border-white/[0.06] transition-colors duration-150 hover:transition-none hover:bg-foreground/[0.04] data-[state=selected]:bg-foreground/[0.06]\",\n className\n )}\n {...props}\n />\n));\nDesignTableRow.displayName = \"DesignTableRow\";\n\nexport const DesignTableHead = forwardRefIfNeeded<\n HTMLTableCellElement,\n React.ThHTMLAttributes<HTMLTableCellElement>\n>(({ className, ...props }, ref) => (\n <th\n ref={ref}\n className={cn(\n \"h-10 px-4 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]\",\n className\n )}\n {...props}\n />\n));\nDesignTableHead.displayName = \"DesignTableHead\";\n\nexport const DesignTableCell = forwardRefIfNeeded<\n HTMLTableCellElement,\n React.TdHTMLAttributes<HTMLTableCellElement>\n>(({ className, ...props }, ref) => (\n <td\n ref={ref}\n className={cn(\n \"p-4 align-middle [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]\",\n className\n )}\n {...props}\n />\n));\nDesignTableCell.displayName = \"DesignTableCell\";\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+BA,MAAa,iFAGV,EAAE,WAAW,GAAG,SAAS,QAC1B,2CAAC;CAAI,WAAU;WACb,2CAAC;EACM;EACL,wCAAc,iCAAiC,UAAU;EACzD,GAAI;GACJ;EACE,CACN;AACF,YAAY,cAAc;AAE1B,MAAa,uFAGV,EAAE,WAAW,GAAG,SAAS,QAC1B,2CAAC;CACM;CACL,wCAAc,mGAAmG,UAAU;CAC3H,GAAI;EACJ,CACF;AACF,kBAAkB,cAAc;AAEhC,MAAa,qFAGV,EAAE,WAAW,GAAG,SAAS,QAC1B,2CAAC;CACM;CACL,wCAAc,8BAA8B,UAAU;CACtD,GAAI;EACJ,CACF;AACF,gBAAgB,cAAc;AAE9B,MAAa,oFAGV,EAAE,WAAW,GAAG,SAAS,QAC1B,2CAAC;CACM;CACL,wCACE,oLACA,UACD;CACD,GAAI;EACJ,CACF;AACF,eAAe,cAAc;AAE7B,MAAa,qFAGV,EAAE,WAAW,GAAG,SAAS,QAC1B,2CAAC;CACM;CACL,wCACE,0IACA,UACD;CACD,GAAI;EACJ,CACF;AACF,gBAAgB,cAAc;AAE9B,MAAa,qFAGV,EAAE,WAAW,GAAG,SAAS,QAC1B,2CAAC;CACM;CACL,wCACE,wFACA,UACD;CACD,GAAI;EACJ,CACF;AACF,gBAAgB,cAAc"}
1
+ {"version":3,"file":"table.js","names":[],"sources":["../../src/components/table.tsx"],"sourcesContent":["\"use client\";\n\nimport { forwardRefIfNeeded } from \"@hexclave/shared/dist/utils/react\";\nimport { cn } from \"@hexclave/ui\";\nimport React from \"react\";\n\n/**\n * Simple static table — header + rows + cells. Use this for small,\n * read-only lists (< 20 rows, no interaction). For anything that needs\n * sorting, filtering, pagination, or virtualization, use `DataGrid` +\n * `useDataSource` instead.\n *\n * ```tsx\n * <DesignTable>\n * <DesignTableHeader>\n * <DesignTableRow>\n * <DesignTableHead>Name</DesignTableHead>\n * <DesignTableHead>Email</DesignTableHead>\n * </DesignTableRow>\n * </DesignTableHeader>\n * <DesignTableBody>\n * {rows.map(row => (\n * <DesignTableRow key={row.id}>\n * <DesignTableCell>{row.name}</DesignTableCell>\n * <DesignTableCell>{row.email}</DesignTableCell>\n * </DesignTableRow>\n * ))}\n * </DesignTableBody>\n * </DesignTable>\n * ```\n */\nexport const DesignTable = forwardRefIfNeeded<\n HTMLTableElement,\n React.HTMLAttributes<HTMLTableElement>\n>(({ className, ...props }, ref) => (\n <div className=\"relative w-full overflow-auto\">\n <table\n ref={ref}\n className={cn(\"w-full caption-bottom text-sm\", className)}\n {...props}\n />\n </div>\n));\nDesignTable.displayName = \"DesignTable\";\n\nexport const DesignTableHeader = forwardRefIfNeeded<\n HTMLTableSectionElement,\n React.HTMLAttributes<HTMLTableSectionElement>\n>(({ className, ...props }, ref) => (\n <thead\n ref={ref}\n className={cn(\"bg-foreground/[0.02] [&_tr]:border-b [&_tr]:border-black/[0.06] dark:[&_tr]:border-white/[0.06]\", className)}\n {...props}\n />\n));\nDesignTableHeader.displayName = \"DesignTableHeader\";\n\nexport const DesignTableBody = forwardRefIfNeeded<\n HTMLTableSectionElement,\n React.HTMLAttributes<HTMLTableSectionElement>\n>(({ className, ...props }, ref) => (\n <tbody\n ref={ref}\n className={cn(\"[&_tr:last-child]:border-0\", className)}\n {...props}\n />\n));\nDesignTableBody.displayName = \"DesignTableBody\";\n\nexport const DesignTableRow = forwardRefIfNeeded<\n HTMLTableRowElement,\n React.HTMLAttributes<HTMLTableRowElement>\n>(({ className, ...props }, ref) => (\n <tr\n ref={ref}\n className={cn(\n \"border-b border-black/[0.06] dark:border-white/[0.06] transition-colors duration-150 hover:transition-none hover:bg-foreground/[0.04] data-[state=selected]:bg-foreground/[0.06]\",\n className\n )}\n {...props}\n />\n));\nDesignTableRow.displayName = \"DesignTableRow\";\n\nexport const DesignTableHead = forwardRefIfNeeded<\n HTMLTableCellElement,\n React.ThHTMLAttributes<HTMLTableCellElement>\n>(({ className, ...props }, ref) => (\n <th\n ref={ref}\n className={cn(\n \"h-10 px-4 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]\",\n className\n )}\n {...props}\n />\n));\nDesignTableHead.displayName = \"DesignTableHead\";\n\nexport const DesignTableCell = forwardRefIfNeeded<\n HTMLTableCellElement,\n React.TdHTMLAttributes<HTMLTableCellElement>\n>(({ className, ...props }, ref) => (\n <td\n ref={ref}\n className={cn(\n \"p-4 align-middle [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]\",\n className\n )}\n {...props}\n />\n));\nDesignTableCell.displayName = \"DesignTableCell\";\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+BA,MAAa,yEAGV,EAAE,WAAW,GAAG,SAAS,QAC1B,2CAAC;CAAI,WAAU;WACb,2CAAC;EACM;EACL,gCAAc,iCAAiC,UAAU;EACzD,GAAI;GACJ;EACE,CACN;AACF,YAAY,cAAc;AAE1B,MAAa,+EAGV,EAAE,WAAW,GAAG,SAAS,QAC1B,2CAAC;CACM;CACL,gCAAc,mGAAmG,UAAU;CAC3H,GAAI;EACJ,CACF;AACF,kBAAkB,cAAc;AAEhC,MAAa,6EAGV,EAAE,WAAW,GAAG,SAAS,QAC1B,2CAAC;CACM;CACL,gCAAc,8BAA8B,UAAU;CACtD,GAAI;EACJ,CACF;AACF,gBAAgB,cAAc;AAE9B,MAAa,4EAGV,EAAE,WAAW,GAAG,SAAS,QAC1B,2CAAC;CACM;CACL,gCACE,oLACA,UACD;CACD,GAAI;EACJ,CACF;AACF,eAAe,cAAc;AAE7B,MAAa,6EAGV,EAAE,WAAW,GAAG,SAAS,QAC1B,2CAAC;CACM;CACL,gCACE,0IACA,UACD;CACD,GAAI;EACJ,CACF;AACF,gBAAgB,cAAc;AAE9B,MAAa,6EAGV,EAAE,WAAW,GAAG,SAAS,QAC1B,2CAAC;CACM;CACL,gCACE,wFACA,UACD;CACD,GAAI;EACJ,CACF;AACF,gBAAgB,cAAc"}
@@ -2,10 +2,10 @@
2
2
 
3
3
  Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
4
4
  const require_chunk = require('../chunk-BE-pF4vm.js');
5
- let _stackframe_stack_ui = require("@hexclave/ui");
5
+ let _hexclave_ui = require("@hexclave/ui");
6
6
  let react_jsx_runtime = require("react/jsx-runtime");
7
7
  let react = require("react");
8
- let _stackframe_stack_shared_dist_utils_promises = require("@hexclave/shared/dist/utils/promises");
8
+ let _hexclave_shared_dist_utils_promises = require("@hexclave/shared/dist/utils/promises");
9
9
  let __card_js = require("./card.js");
10
10
 
11
11
  //#region src/components/tabs.tsx
@@ -62,14 +62,14 @@ function DesignCategoryTabs({ categories, selectedCategory, onSelect, showBadge
62
62
  const result = onSelect(categoryId);
63
63
  if (result && typeof result.then === "function") {
64
64
  setLoadingCategoryId(categoryId);
65
- (0, _stackframe_stack_shared_dist_utils_promises.runAsynchronouslyWithAlert)(Promise.resolve(result).finally(() => setLoadingCategoryId(null)));
65
+ (0, _hexclave_shared_dist_utils_promises.runAsynchronouslyWithAlert)(Promise.resolve(result).finally(() => setLoadingCategoryId(null)));
66
66
  }
67
67
  };
68
68
  return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
69
- className: (0, _stackframe_stack_ui.cn)("flex w-full min-w-0 items-center gap-2", glassmorphic ? "rounded-xl bg-black/[0.08] dark:bg-white/[0.04] p-1 backdrop-blur-sm" : "border-b border-gray-300 dark:border-gray-800", className),
69
+ className: (0, _hexclave_ui.cn)("flex w-full min-w-0 items-center gap-2", glassmorphic ? "rounded-xl bg-black/[0.08] dark:bg-white/[0.04] p-1 backdrop-blur-sm" : "border-b border-gray-300 dark:border-gray-800", className),
70
70
  ...props,
71
71
  children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
72
- className: (0, _stackframe_stack_ui.cn)("flex min-h-0 min-w-0 flex-1 items-center gap-1 overflow-x-auto flex-nowrap [&::-webkit-scrollbar]:hidden"),
72
+ className: (0, _hexclave_ui.cn)("flex min-h-0 min-w-0 items-center gap-1 overflow-x-auto flex-nowrap [&::-webkit-scrollbar]:hidden"),
73
73
  children: categories.map((category) => {
74
74
  const isActive = selectedCategory === category.id;
75
75
  const badgeValue = category.badgeCount ?? category.count;
@@ -77,14 +77,14 @@ function DesignCategoryTabs({ categories, selectedCategory, onSelect, showBadge
77
77
  return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
78
78
  onClick: () => handleSelect(category.id),
79
79
  disabled: loadingCategoryId !== null,
80
- className: (0, _stackframe_stack_ui.cn)("font-medium transition-all duration-150 hover:transition-none relative flex flex-shrink-0 items-center justify-center gap-2 whitespace-nowrap", "hover:text-gray-900 dark:hover:text-gray-100", sizeClass.button, glassmorphic ? "rounded-lg" : "", isActive ? (0, _stackframe_stack_ui.cn)(gradientClass.activeText, glassmorphic && "bg-background shadow-sm ring-1 ring-black/[0.12] dark:ring-white/[0.06]") : "text-gray-700 dark:text-gray-400"),
80
+ className: (0, _hexclave_ui.cn)("font-medium transition-all duration-150 hover:transition-none relative flex flex-shrink-0 items-center justify-center gap-2 whitespace-nowrap", "hover:text-gray-900 dark:hover:text-gray-100", sizeClass.button, glassmorphic ? "rounded-lg" : "", isActive ? (0, _hexclave_ui.cn)(gradientClass.activeText, glassmorphic && "bg-background shadow-sm ring-1 ring-black/[0.12] dark:ring-white/[0.06]") : "text-gray-700 dark:text-gray-400"),
81
81
  children: [
82
- loadingCategoryId === category.id && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.Spinner, {
82
+ loadingCategoryId === category.id && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_hexclave_ui.Spinner, {
83
83
  size: 12,
84
84
  className: "absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 pointer-events-none"
85
85
  }),
86
86
  /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
87
- className: (0, _stackframe_stack_ui.cn)("flex items-center gap-2", loadingCategoryId === category.id && "invisible"),
87
+ className: (0, _hexclave_ui.cn)("flex items-center gap-2", loadingCategoryId === category.id && "invisible"),
88
88
  children: [
89
89
  category.icon && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(category.icon, {
90
90
  className: "h-4 w-4 shrink-0",
@@ -92,12 +92,12 @@ function DesignCategoryTabs({ categories, selectedCategory, onSelect, showBadge
92
92
  }),
93
93
  category.label,
94
94
  shouldShowBadge && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
95
- className: (0, _stackframe_stack_ui.cn)("rounded-full", sizeClass.badge, isActive ? gradientClass.activeBadge : "bg-gray-200 dark:bg-gray-800 text-gray-600 dark:text-gray-400"),
95
+ className: (0, _hexclave_ui.cn)("rounded-full", sizeClass.badge, isActive ? gradientClass.activeBadge : "bg-gray-200 dark:bg-gray-800 text-gray-600 dark:text-gray-400"),
96
96
  children: badgeValue
97
97
  })
98
98
  ]
99
99
  }),
100
- !glassmorphic && isActive && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: (0, _stackframe_stack_ui.cn)("absolute bottom-0 left-0 right-0 h-0.5", gradientClass.underline) })
100
+ !glassmorphic && isActive && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: (0, _hexclave_ui.cn)("absolute bottom-0 left-0 right-0 h-0.5", gradientClass.underline) })
101
101
  ]
102
102
  }, category.id);
103
103
  })
@@ -1 +1 @@
1
- {"version":3,"file":"tabs.js","names":["Spinner"],"sources":["../../src/components/tabs.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState, type ReactNode } from \"react\";\nimport { cn, Spinner } from \"@stackframe/stack-ui\";\nimport { runAsynchronouslyWithAlert } from \"@stackframe/stack-shared/dist/utils/promises\";\nimport { useGlassmorphicDefault } from \"./card\";\n\ntype DesignTabsSize = \"sm\" | \"md\";\ntype DesignTabsGradient = \"blue\" | \"cyan\" | \"purple\" | \"green\" | \"orange\" | \"default\";\n\nexport type DesignCategoryTabItem = {\n id: string,\n label: string,\n count?: number,\n badgeCount?: number,\n icon?: React.ComponentType<React.SVGProps<SVGSVGElement>>,\n};\n\nexport type DesignCategoryTabsProps = Omit<React.ComponentProps<\"div\">, \"onSelect\"> & {\n categories: DesignCategoryTabItem[],\n selectedCategory: string,\n onSelect: (id: string) => void | Promise<void>,\n showBadge?: boolean,\n size?: DesignTabsSize,\n glassmorphic?: boolean,\n gradient?: DesignTabsGradient,\n /** Renders inside the tab bar after the tab buttons (not a tab). */\n trailing?: ReactNode,\n};\n\ntype TabSizeClass = {\n button: string,\n badge: string,\n};\n\ntype GradientClass = {\n activeText: string,\n activeBadge: string,\n underline: string,\n};\n\nconst tabSizeClasses = new Map<DesignTabsSize, TabSizeClass>([\n [\"sm\", { button: \"px-3 py-2 text-xs\", badge: \"text-[10px] px-1.5 py-0.5\" }],\n [\"md\", { button: \"px-4 py-3 text-sm\", badge: \"text-xs px-1.5 py-0.5\" }],\n]);\n\nconst gradientClasses = new Map<DesignTabsGradient, GradientClass>([\n [\n \"blue\",\n {\n activeText: \"text-blue-700 dark:text-blue-400\",\n activeBadge: \"bg-blue-100 dark:bg-blue-900/30 text-blue-700 dark:text-blue-400\",\n underline: \"bg-blue-700 dark:bg-blue-400\",\n },\n ],\n [\n \"cyan\",\n {\n activeText: \"text-cyan-700 dark:text-cyan-300\",\n activeBadge: \"bg-cyan-100 dark:bg-cyan-900/30 text-cyan-700 dark:text-cyan-300\",\n underline: \"bg-cyan-600 dark:bg-cyan-400\",\n },\n ],\n [\n \"purple\",\n {\n activeText: \"text-purple-700 dark:text-purple-300\",\n activeBadge: \"bg-purple-100 dark:bg-purple-900/30 text-purple-700 dark:text-purple-300\",\n underline: \"bg-purple-600 dark:bg-purple-400\",\n },\n ],\n [\n \"green\",\n {\n activeText: \"text-emerald-700 dark:text-emerald-300\",\n activeBadge: \"bg-emerald-100 dark:bg-emerald-900/30 text-emerald-700 dark:text-emerald-300\",\n underline: \"bg-emerald-600 dark:bg-emerald-400\",\n },\n ],\n [\n \"orange\",\n {\n activeText: \"text-amber-700 dark:text-amber-300\",\n activeBadge: \"bg-amber-100 dark:bg-amber-900/30 text-amber-700 dark:text-amber-300\",\n underline: \"bg-amber-600 dark:bg-amber-400\",\n },\n ],\n [\n \"default\",\n {\n activeText: \"text-foreground\",\n activeBadge: \"bg-foreground/10 text-foreground\",\n underline: \"bg-foreground/80\",\n },\n ],\n]);\n\nfunction getMapValueOrThrow<TKey, TValue>(map: Map<TKey, TValue>, key: TKey, mapName: string) {\n const value = map.get(key);\n if (!value) {\n throw new Error(`Missing ${mapName} entry for key \"${String(key)}\"`);\n }\n return value;\n}\n\nexport function DesignCategoryTabs({\n categories,\n selectedCategory,\n onSelect,\n showBadge = true,\n size = \"sm\",\n glassmorphic: glassmorphicProp,\n gradient = \"blue\",\n trailing,\n className,\n ...props\n}: DesignCategoryTabsProps) {\n const glassmorphic = useGlassmorphicDefault(glassmorphicProp);\n const sizeClass = getMapValueOrThrow(tabSizeClasses, size, \"tabSizeClasses\");\n const gradientClass = getMapValueOrThrow(gradientClasses, gradient, \"gradientClasses\");\n const [loadingCategoryId, setLoadingCategoryId] = useState<string | null>(null);\n\n const handleSelect = (categoryId: string) => {\n const result = onSelect(categoryId);\n if (result && typeof (result as Promise<void>).then === \"function\") {\n setLoadingCategoryId(categoryId);\n runAsynchronouslyWithAlert(\n Promise.resolve(result).finally(() => setLoadingCategoryId(null))\n );\n }\n };\n\n return (\n <div\n className={cn(\n \"flex w-full min-w-0 items-center gap-2\",\n glassmorphic\n ? \"rounded-xl bg-black/[0.08] dark:bg-white/[0.04] p-1 backdrop-blur-sm\"\n : \"border-b border-gray-300 dark:border-gray-800\",\n className\n )}\n {...props}\n >\n <div\n className={cn(\n \"flex min-h-0 min-w-0 flex-1 items-center gap-1 overflow-x-auto flex-nowrap [&::-webkit-scrollbar]:hidden\",\n )}\n >\n {categories.map((category) => {\n const isActive = selectedCategory === category.id;\n const badgeValue = category.badgeCount ?? category.count;\n const shouldShowBadge = showBadge && badgeValue !== undefined;\n\n return (\n <button\n key={category.id}\n onClick={() => handleSelect(category.id)}\n disabled={loadingCategoryId !== null}\n className={cn(\n \"font-medium transition-all duration-150 hover:transition-none relative flex flex-shrink-0 items-center justify-center gap-2 whitespace-nowrap\",\n \"hover:text-gray-900 dark:hover:text-gray-100\",\n sizeClass.button,\n glassmorphic ? \"rounded-lg\" : \"\",\n isActive\n ? cn(\n gradientClass.activeText,\n glassmorphic && \"bg-background shadow-sm ring-1 ring-black/[0.12] dark:ring-white/[0.06]\"\n )\n : \"text-gray-700 dark:text-gray-400\"\n )}\n >\n {loadingCategoryId === category.id && (\n <Spinner\n size={12}\n className=\"absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 pointer-events-none\"\n />\n )}\n <span className={cn(\n \"flex items-center gap-2\",\n loadingCategoryId === category.id && \"invisible\"\n )}>\n {category.icon && (\n <category.icon className=\"h-4 w-4 shrink-0\" aria-hidden />\n )}\n {category.label}\n {shouldShowBadge && (\n <span\n className={cn(\n \"rounded-full\",\n sizeClass.badge,\n isActive\n ? gradientClass.activeBadge\n : \"bg-gray-200 dark:bg-gray-800 text-gray-600 dark:text-gray-400\"\n )}\n >\n {badgeValue}\n </span>\n )}\n </span>\n {!glassmorphic && isActive && (\n <div className={cn(\"absolute bottom-0 left-0 right-0 h-0.5\", gradientClass.underline)} />\n )}\n </button>\n );\n })}\n </div>\n {trailing != null ? (\n <div className=\"flex shrink-0 items-center\">\n {trailing}\n </div>\n ) : null}\n </div>\n );\n}\n"],"mappings":";;;;;;;;;;;AAyCA,MAAM,iBAAiB,IAAI,IAAkC,CAC3D,CAAC,MAAM;CAAE,QAAQ;CAAqB,OAAO;CAA6B,CAAC,EAC3E,CAAC,MAAM;CAAE,QAAQ;CAAqB,OAAO;CAAyB,CAAC,CACxE,CAAC;AAEF,MAAM,kBAAkB,IAAI,IAAuC;CACjE,CACE,QACA;EACE,YAAY;EACZ,aAAa;EACb,WAAW;EACZ,CACF;CACD,CACE,QACA;EACE,YAAY;EACZ,aAAa;EACb,WAAW;EACZ,CACF;CACD,CACE,UACA;EACE,YAAY;EACZ,aAAa;EACb,WAAW;EACZ,CACF;CACD,CACE,SACA;EACE,YAAY;EACZ,aAAa;EACb,WAAW;EACZ,CACF;CACD,CACE,UACA;EACE,YAAY;EACZ,aAAa;EACb,WAAW;EACZ,CACF;CACD,CACE,WACA;EACE,YAAY;EACZ,aAAa;EACb,WAAW;EACZ,CACF;CACF,CAAC;AAEF,SAAS,mBAAiC,KAAwB,KAAW,SAAiB;CAC5F,MAAM,QAAQ,IAAI,IAAI,IAAI;AAC1B,KAAI,CAAC,MACH,OAAM,IAAI,MAAM,WAAW,QAAQ,kBAAkB,OAAO,IAAI,CAAC,GAAG;AAEtE,QAAO;;AAGT,SAAgB,mBAAmB,EACjC,YACA,kBACA,UACA,YAAY,MACZ,OAAO,MACP,cAAc,kBACd,WAAW,QACX,UACA,WACA,GAAG,SACuB;CAC1B,MAAM,qDAAsC,iBAAiB;CAC7D,MAAM,YAAY,mBAAmB,gBAAgB,MAAM,iBAAiB;CAC5E,MAAM,gBAAgB,mBAAmB,iBAAiB,UAAU,kBAAkB;CACtF,MAAM,CAAC,mBAAmB,4CAAgD,KAAK;CAE/E,MAAM,gBAAgB,eAAuB;EAC3C,MAAM,SAAS,SAAS,WAAW;AACnC,MAAI,UAAU,OAAQ,OAAyB,SAAS,YAAY;AAClE,wBAAqB,WAAW;AAChC,gFACE,QAAQ,QAAQ,OAAO,CAAC,cAAc,qBAAqB,KAAK,CAAC,CAClE;;;AAIL,QACE,4CAAC;EACC,wCACE,0CACA,eACI,yEACA,iDACJ,UACD;EACD,GAAI;aAEJ,2CAAC;GACC,wCACE,2GACD;aAEA,WAAW,KAAK,aAAa;IAC5B,MAAM,WAAW,qBAAqB,SAAS;IAC/C,MAAM,aAAa,SAAS,cAAc,SAAS;IACnD,MAAM,kBAAkB,aAAa,eAAe;AAEpD,WACE,4CAAC;KAEC,eAAe,aAAa,SAAS,GAAG;KACxC,UAAU,sBAAsB;KAChC,wCACE,iJACA,gDACA,UAAU,QACV,eAAe,eAAe,IAC9B,wCAEI,cAAc,YACd,gBAAgB,0EACjB,GACC,mCACL;;MAEA,sBAAsB,SAAS,MAC9B,2CAACA;OACC,MAAM;OACN,WAAU;QACV;MAEJ,4CAAC;OAAK,wCACJ,2BACA,sBAAsB,SAAS,MAAM,YACtC;;QACE,SAAS,QACR,2CAAC,SAAS;SAAK,WAAU;SAAmB;UAAc;QAE3D,SAAS;QACT,mBACC,2CAAC;SACC,wCACE,gBACA,UAAU,OACV,WACI,cAAc,cACd,gEACL;mBAEA;UACI;;QAEJ;MACN,CAAC,gBAAgB,YAChB,2CAAC,SAAI,wCAAc,0CAA0C,cAAc,UAAU,GAAI;;OA7CtF,SAAS,GA+CP;KAEX;IACE,EACL,YAAY,OACX,2CAAC;GAAI,WAAU;aACZ;IACG,GACJ;GACA"}
1
+ {"version":3,"file":"tabs.js","names":["Spinner"],"sources":["../../src/components/tabs.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState, type ReactNode } from \"react\";\nimport { cn, Spinner } from \"@hexclave/ui\";\nimport { runAsynchronouslyWithAlert } from \"@hexclave/shared/dist/utils/promises\";\nimport { useGlassmorphicDefault } from \"./card\";\n\ntype DesignTabsSize = \"sm\" | \"md\";\ntype DesignTabsGradient = \"blue\" | \"cyan\" | \"purple\" | \"green\" | \"orange\" | \"default\";\n\nexport type DesignCategoryTabItem = {\n id: string,\n label: string,\n count?: number,\n badgeCount?: number,\n icon?: React.ComponentType<React.SVGProps<SVGSVGElement>>,\n};\n\nexport type DesignCategoryTabsProps = Omit<React.ComponentProps<\"div\">, \"onSelect\"> & {\n categories: DesignCategoryTabItem[],\n selectedCategory: string,\n onSelect: (id: string) => void | Promise<void>,\n showBadge?: boolean,\n size?: DesignTabsSize,\n glassmorphic?: boolean,\n gradient?: DesignTabsGradient,\n /** Renders inside the tab bar after the tab buttons (not a tab). */\n trailing?: ReactNode,\n};\n\ntype TabSizeClass = {\n button: string,\n badge: string,\n};\n\ntype GradientClass = {\n activeText: string,\n activeBadge: string,\n underline: string,\n};\n\nconst tabSizeClasses = new Map<DesignTabsSize, TabSizeClass>([\n [\"sm\", { button: \"px-3 py-2 text-xs\", badge: \"text-[10px] px-1.5 py-0.5\" }],\n [\"md\", { button: \"px-4 py-3 text-sm\", badge: \"text-xs px-1.5 py-0.5\" }],\n]);\n\nconst gradientClasses = new Map<DesignTabsGradient, GradientClass>([\n [\n \"blue\",\n {\n activeText: \"text-blue-700 dark:text-blue-400\",\n activeBadge: \"bg-blue-100 dark:bg-blue-900/30 text-blue-700 dark:text-blue-400\",\n underline: \"bg-blue-700 dark:bg-blue-400\",\n },\n ],\n [\n \"cyan\",\n {\n activeText: \"text-cyan-700 dark:text-cyan-300\",\n activeBadge: \"bg-cyan-100 dark:bg-cyan-900/30 text-cyan-700 dark:text-cyan-300\",\n underline: \"bg-cyan-600 dark:bg-cyan-400\",\n },\n ],\n [\n \"purple\",\n {\n activeText: \"text-purple-700 dark:text-purple-300\",\n activeBadge: \"bg-purple-100 dark:bg-purple-900/30 text-purple-700 dark:text-purple-300\",\n underline: \"bg-purple-600 dark:bg-purple-400\",\n },\n ],\n [\n \"green\",\n {\n activeText: \"text-emerald-700 dark:text-emerald-300\",\n activeBadge: \"bg-emerald-100 dark:bg-emerald-900/30 text-emerald-700 dark:text-emerald-300\",\n underline: \"bg-emerald-600 dark:bg-emerald-400\",\n },\n ],\n [\n \"orange\",\n {\n activeText: \"text-amber-700 dark:text-amber-300\",\n activeBadge: \"bg-amber-100 dark:bg-amber-900/30 text-amber-700 dark:text-amber-300\",\n underline: \"bg-amber-600 dark:bg-amber-400\",\n },\n ],\n [\n \"default\",\n {\n activeText: \"text-foreground\",\n activeBadge: \"bg-foreground/10 text-foreground\",\n underline: \"bg-foreground/80\",\n },\n ],\n]);\n\nfunction getMapValueOrThrow<TKey, TValue>(map: Map<TKey, TValue>, key: TKey, mapName: string) {\n const value = map.get(key);\n if (!value) {\n throw new Error(`Missing ${mapName} entry for key \"${String(key)}\"`);\n }\n return value;\n}\n\nexport function DesignCategoryTabs({\n categories,\n selectedCategory,\n onSelect,\n showBadge = true,\n size = \"sm\",\n glassmorphic: glassmorphicProp,\n gradient = \"blue\",\n trailing,\n className,\n ...props\n}: DesignCategoryTabsProps) {\n const glassmorphic = useGlassmorphicDefault(glassmorphicProp);\n const sizeClass = getMapValueOrThrow(tabSizeClasses, size, \"tabSizeClasses\");\n const gradientClass = getMapValueOrThrow(gradientClasses, gradient, \"gradientClasses\");\n const [loadingCategoryId, setLoadingCategoryId] = useState<string | null>(null);\n\n const handleSelect = (categoryId: string) => {\n const result = onSelect(categoryId);\n if (result && typeof (result as Promise<void>).then === \"function\") {\n setLoadingCategoryId(categoryId);\n runAsynchronouslyWithAlert(\n Promise.resolve(result).finally(() => setLoadingCategoryId(null))\n );\n }\n };\n\n return (\n <div\n className={cn(\n \"flex w-full min-w-0 items-center gap-2\",\n glassmorphic\n ? \"rounded-xl bg-black/[0.08] dark:bg-white/[0.04] p-1 backdrop-blur-sm\"\n : \"border-b border-gray-300 dark:border-gray-800\",\n className\n )}\n {...props}\n >\n <div\n className={cn(\n \"flex min-h-0 min-w-0 items-center gap-1 overflow-x-auto flex-nowrap [&::-webkit-scrollbar]:hidden\",\n )}\n >\n {categories.map((category) => {\n const isActive = selectedCategory === category.id;\n const badgeValue = category.badgeCount ?? category.count;\n const shouldShowBadge = showBadge && badgeValue !== undefined;\n\n return (\n <button\n key={category.id}\n onClick={() => handleSelect(category.id)}\n disabled={loadingCategoryId !== null}\n className={cn(\n \"font-medium transition-all duration-150 hover:transition-none relative flex flex-shrink-0 items-center justify-center gap-2 whitespace-nowrap\",\n \"hover:text-gray-900 dark:hover:text-gray-100\",\n sizeClass.button,\n glassmorphic ? \"rounded-lg\" : \"\",\n isActive\n ? cn(\n gradientClass.activeText,\n glassmorphic && \"bg-background shadow-sm ring-1 ring-black/[0.12] dark:ring-white/[0.06]\"\n )\n : \"text-gray-700 dark:text-gray-400\"\n )}\n >\n {loadingCategoryId === category.id && (\n <Spinner\n size={12}\n className=\"absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 pointer-events-none\"\n />\n )}\n <span className={cn(\n \"flex items-center gap-2\",\n loadingCategoryId === category.id && \"invisible\"\n )}>\n {category.icon && (\n <category.icon className=\"h-4 w-4 shrink-0\" aria-hidden />\n )}\n {category.label}\n {shouldShowBadge && (\n <span\n className={cn(\n \"rounded-full\",\n sizeClass.badge,\n isActive\n ? gradientClass.activeBadge\n : \"bg-gray-200 dark:bg-gray-800 text-gray-600 dark:text-gray-400\"\n )}\n >\n {badgeValue}\n </span>\n )}\n </span>\n {!glassmorphic && isActive && (\n <div className={cn(\"absolute bottom-0 left-0 right-0 h-0.5\", gradientClass.underline)} />\n )}\n </button>\n );\n })}\n </div>\n {trailing != null ? (\n <div className=\"flex shrink-0 items-center\">\n {trailing}\n </div>\n ) : null}\n </div>\n );\n}\n"],"mappings":";;;;;;;;;;;AAyCA,MAAM,iBAAiB,IAAI,IAAkC,CAC3D,CAAC,MAAM;CAAE,QAAQ;CAAqB,OAAO;CAA6B,CAAC,EAC3E,CAAC,MAAM;CAAE,QAAQ;CAAqB,OAAO;CAAyB,CAAC,CACxE,CAAC;AAEF,MAAM,kBAAkB,IAAI,IAAuC;CACjE,CACE,QACA;EACE,YAAY;EACZ,aAAa;EACb,WAAW;EACZ,CACF;CACD,CACE,QACA;EACE,YAAY;EACZ,aAAa;EACb,WAAW;EACZ,CACF;CACD,CACE,UACA;EACE,YAAY;EACZ,aAAa;EACb,WAAW;EACZ,CACF;CACD,CACE,SACA;EACE,YAAY;EACZ,aAAa;EACb,WAAW;EACZ,CACF;CACD,CACE,UACA;EACE,YAAY;EACZ,aAAa;EACb,WAAW;EACZ,CACF;CACD,CACE,WACA;EACE,YAAY;EACZ,aAAa;EACb,WAAW;EACZ,CACF;CACF,CAAC;AAEF,SAAS,mBAAiC,KAAwB,KAAW,SAAiB;CAC5F,MAAM,QAAQ,IAAI,IAAI,IAAI;AAC1B,KAAI,CAAC,MACH,OAAM,IAAI,MAAM,WAAW,QAAQ,kBAAkB,OAAO,IAAI,CAAC,GAAG;AAEtE,QAAO;;AAGT,SAAgB,mBAAmB,EACjC,YACA,kBACA,UACA,YAAY,MACZ,OAAO,MACP,cAAc,kBACd,WAAW,QACX,UACA,WACA,GAAG,SACuB;CAC1B,MAAM,qDAAsC,iBAAiB;CAC7D,MAAM,YAAY,mBAAmB,gBAAgB,MAAM,iBAAiB;CAC5E,MAAM,gBAAgB,mBAAmB,iBAAiB,UAAU,kBAAkB;CACtF,MAAM,CAAC,mBAAmB,4CAAgD,KAAK;CAE/E,MAAM,gBAAgB,eAAuB;EAC3C,MAAM,SAAS,SAAS,WAAW;AACnC,MAAI,UAAU,OAAQ,OAAyB,SAAS,YAAY;AAClE,wBAAqB,WAAW;AAChC,wEACE,QAAQ,QAAQ,OAAO,CAAC,cAAc,qBAAqB,KAAK,CAAC,CAClE;;;AAIL,QACE,4CAAC;EACC,gCACE,0CACA,eACI,yEACA,iDACJ,UACD;EACD,GAAI;aAEJ,2CAAC;GACC,gCACE,oGACD;aAEA,WAAW,KAAK,aAAa;IAC5B,MAAM,WAAW,qBAAqB,SAAS;IAC/C,MAAM,aAAa,SAAS,cAAc,SAAS;IACnD,MAAM,kBAAkB,aAAa,eAAe;AAEpD,WACE,4CAAC;KAEC,eAAe,aAAa,SAAS,GAAG;KACxC,UAAU,sBAAsB;KAChC,gCACE,iJACA,gDACA,UAAU,QACV,eAAe,eAAe,IAC9B,gCAEI,cAAc,YACd,gBAAgB,0EACjB,GACC,mCACL;;MAEA,sBAAsB,SAAS,MAC9B,2CAACA;OACC,MAAM;OACN,WAAU;QACV;MAEJ,4CAAC;OAAK,gCACJ,2BACA,sBAAsB,SAAS,MAAM,YACtC;;QACE,SAAS,QACR,2CAAC,SAAS;SAAK,WAAU;SAAmB;UAAc;QAE3D,SAAS;QACT,mBACC,2CAAC;SACC,gCACE,gBACA,UAAU,OACV,WACI,cAAc,cACd,gEACL;mBAEA;UACI;;QAEJ;MACN,CAAC,gBAAgB,YAChB,2CAAC,SAAI,gCAAc,0CAA0C,cAAc,UAAU,GAAI;;OA7CtF,SAAS,GA+CP;KAEX;IACE,EACL,YAAY,OACX,2CAAC;GAAI,WAAU;aACZ;IACG,GACJ;GACA"}