@wealthx/shadcn 0.0.2 → 1.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.turbo/turbo-build.log +135 -11
- package/CHANGELOG.md +12 -0
- package/CHANGES.md +345 -0
- package/README.md +128 -0
- package/dist/chunk-2WZVSBAY.mjs +232 -0
- package/dist/chunk-2Y7YJKPE.mjs +47 -0
- package/dist/chunk-3U7SD3MS.mjs +55 -0
- package/dist/chunk-3VQNJ235.mjs +114 -0
- package/dist/chunk-55CEW76V.mjs +35 -0
- package/dist/chunk-6AFMNC42.mjs +146 -0
- package/dist/chunk-6OJF6XRN.mjs +117 -0
- package/dist/chunk-7LDIMXGM.mjs +181 -0
- package/dist/chunk-AMJ23O53.mjs +122 -0
- package/dist/chunk-BBJBJSXQ.mjs +44 -0
- package/dist/chunk-BGP2N52Z.mjs +126 -0
- package/dist/chunk-BMFN37JH.mjs +41 -0
- package/dist/chunk-CGOKTPXU.mjs +79 -0
- package/dist/chunk-CZ3BW5GL.mjs +81 -0
- package/dist/chunk-DBHJ5KC3.mjs +55 -0
- package/dist/chunk-DDPA2XXS.mjs +97 -0
- package/dist/chunk-DS2AMHN2.mjs +30 -0
- package/dist/chunk-E3K6O4FZ.mjs +57 -0
- package/dist/chunk-FWCSY2DS.mjs +37 -0
- package/dist/chunk-GPRJQ24C.mjs +28 -0
- package/dist/chunk-HS7TFG7V.mjs +24 -0
- package/dist/chunk-HUVTPUV2.mjs +256 -0
- package/dist/chunk-IAOOZCUY.mjs +90 -0
- package/dist/chunk-JF4PHPD5.mjs +111 -0
- package/dist/chunk-JU2RUWHF.mjs +123 -0
- package/dist/chunk-KKHTJNMM.mjs +86 -0
- package/dist/chunk-MJIEMGRD.mjs +266 -0
- package/dist/chunk-MKFL5MNH.mjs +372 -0
- package/dist/chunk-MQ72DIBH.mjs +105 -0
- package/dist/chunk-NGYG2EA6.mjs +148 -0
- package/dist/chunk-NWZ46DJL.mjs +213 -0
- package/dist/chunk-OXQQNQZI.mjs +75 -0
- package/dist/chunk-PMKODV6M.mjs +161 -0
- package/dist/chunk-QOJ2DQD6.mjs +57 -0
- package/dist/chunk-RL772EH7.mjs +126 -0
- package/dist/chunk-SLWCCURD.mjs +99 -0
- package/dist/chunk-V7CNWJT3.mjs +10 -0
- package/dist/chunk-VG6UF6UT.mjs +68 -0
- package/dist/chunk-VYMHBV6D.mjs +123 -0
- package/dist/chunk-VZ2NR7L3.mjs +195 -0
- package/dist/chunk-YN5SYTOO.mjs +117 -0
- package/dist/chunk-Z3MK2KKZ.mjs +83 -0
- package/dist/chunk-ZN2QKLF6.mjs +187 -0
- package/dist/chunk-ZZV5JVNW.mjs +34 -0
- package/dist/components/ui/accordion.js +142 -0
- package/dist/components/ui/accordion.mjs +14 -0
- package/dist/components/ui/alert-dialog.js +413 -0
- package/dist/components/ui/alert-dialog.mjs +34 -0
- package/dist/components/ui/alert.js +134 -0
- package/dist/components/ui/alert.mjs +12 -0
- package/dist/components/ui/avatar.js +173 -0
- package/dist/components/ui/avatar.mjs +18 -0
- package/dist/components/ui/badge.js +163 -0
- package/dist/components/ui/badge.mjs +11 -0
- package/dist/components/ui/button.js +198 -0
- package/dist/components/ui/button.mjs +11 -0
- package/dist/components/ui/calendar.js +408 -0
- package/dist/components/ui/calendar.mjs +12 -0
- package/dist/components/ui/card.js +156 -0
- package/dist/components/ui/card.mjs +20 -0
- package/dist/components/ui/checkbox.js +166 -0
- package/dist/components/ui/checkbox.mjs +11 -0
- package/dist/components/ui/chip.js +199 -0
- package/dist/components/ui/chip.mjs +10 -0
- package/dist/components/ui/data-table.js +925 -0
- package/dist/components/ui/data-table.mjs +29 -0
- package/dist/components/ui/date-picker.js +561 -0
- package/dist/components/ui/date-picker.mjs +15 -0
- package/dist/components/ui/dialog.js +378 -0
- package/dist/components/ui/dialog.mjs +30 -0
- package/dist/components/ui/drawer.js +213 -0
- package/dist/components/ui/drawer.mjs +28 -0
- package/dist/components/ui/dropdown-menu.js +338 -0
- package/dist/components/ui/dropdown-menu.mjs +38 -0
- package/dist/components/ui/empty.js +173 -0
- package/dist/components/ui/empty.mjs +18 -0
- package/dist/components/ui/field.js +359 -0
- package/dist/components/ui/field.mjs +28 -0
- package/dist/components/ui/input-group.js +406 -0
- package/dist/components/ui/input-group.mjs +22 -0
- package/dist/components/ui/input-otp.js +149 -0
- package/dist/components/ui/input-otp.mjs +14 -0
- package/dist/components/ui/input.js +81 -0
- package/dist/components/ui/input.mjs +8 -0
- package/dist/components/ui/label.js +85 -0
- package/dist/components/ui/label.mjs +8 -0
- package/dist/components/ui/pagination.js +333 -0
- package/dist/components/ui/pagination.mjs +22 -0
- package/dist/components/ui/popover.js +167 -0
- package/dist/components/ui/popover.mjs +22 -0
- package/dist/components/ui/progress.js +97 -0
- package/dist/components/ui/progress.mjs +8 -0
- package/dist/components/ui/radio-group.js +178 -0
- package/dist/components/ui/radio-group.mjs +12 -0
- package/dist/components/ui/select.js +262 -0
- package/dist/components/ui/select.mjs +28 -0
- package/dist/components/ui/separator.js +86 -0
- package/dist/components/ui/separator.mjs +8 -0
- package/dist/components/ui/sheet.js +227 -0
- package/dist/components/ui/sheet.mjs +26 -0
- package/dist/components/ui/skeleton.js +75 -0
- package/dist/components/ui/skeleton.mjs +8 -0
- package/dist/components/ui/sonner.js +86 -0
- package/dist/components/ui/sonner.mjs +7 -0
- package/dist/components/ui/spinner.js +93 -0
- package/dist/components/ui/spinner.mjs +10 -0
- package/dist/components/ui/switch.js +178 -0
- package/dist/components/ui/switch.mjs +11 -0
- package/dist/components/ui/table.js +184 -0
- package/dist/components/ui/table.mjs +22 -0
- package/dist/components/ui/tabs.js +181 -0
- package/dist/components/ui/tabs.mjs +16 -0
- package/dist/components/ui/textarea.js +79 -0
- package/dist/components/ui/textarea.mjs +8 -0
- package/dist/components/ui/toggle-group.js +184 -0
- package/dist/components/ui/toggle-group.mjs +12 -0
- package/dist/components/ui/toggle.js +108 -0
- package/dist/components/ui/toggle.mjs +11 -0
- package/dist/components/ui/tooltip.js +140 -0
- package/dist/components/ui/tooltip.mjs +16 -0
- package/dist/index.js +4312 -90
- package/dist/index.mjs +459 -158
- package/dist/lib/colors.js +84 -0
- package/dist/lib/colors.mjs +13 -0
- package/dist/lib/theme-provider.js +150 -0
- package/dist/lib/theme-provider.mjs +13 -0
- package/dist/lib/typography.js +157 -0
- package/dist/lib/typography.mjs +25 -0
- package/dist/lib/utils.js +34 -0
- package/dist/lib/utils.mjs +7 -0
- package/dist/styles.css +1 -1
- package/package.json +228 -11
- package/scripts/build-css.ts +15 -9
- package/src/components/index.tsx +443 -0
- package/src/components/ui/accordion.tsx +99 -0
- package/src/components/ui/alert-dialog.tsx +239 -0
- package/src/components/ui/alert.tsx +81 -0
- package/src/components/ui/avatar.tsx +130 -0
- package/src/components/ui/badge.tsx +57 -0
- package/src/components/ui/button.tsx +69 -37
- package/src/components/ui/calendar.tsx +252 -0
- package/src/components/ui/card.tsx +106 -0
- package/src/components/ui/checkbox.tsx +111 -0
- package/src/components/ui/chip.tsx +65 -0
- package/src/components/ui/data-table.tsx +490 -0
- package/src/components/ui/date-picker.tsx +133 -0
- package/src/components/ui/dialog.tsx +195 -0
- package/src/components/ui/drawer.tsx +169 -0
- package/src/components/ui/dropdown-menu.tsx +315 -0
- package/src/components/ui/empty.tsx +128 -0
- package/src/components/ui/field.tsx +273 -0
- package/src/components/ui/input-group.tsx +190 -0
- package/src/components/ui/input-otp.tsx +90 -0
- package/src/components/ui/input.tsx +28 -0
- package/src/components/ui/label.tsx +24 -0
- package/src/components/ui/pagination.tsx +148 -0
- package/src/components/ui/popover.tsx +112 -0
- package/src/components/ui/progress.tsx +40 -0
- package/src/components/ui/radio-group.tsx +129 -0
- package/src/components/ui/select.tsx +201 -0
- package/src/components/ui/separator.tsx +26 -0
- package/src/components/ui/sheet.tsx +182 -0
- package/src/components/ui/skeleton.tsx +22 -0
- package/src/components/ui/sonner.tsx +48 -0
- package/src/components/ui/spinner.tsx +41 -0
- package/src/components/ui/switch.tsx +126 -0
- package/src/components/ui/table.tsx +143 -0
- package/src/components/ui/tabs.tsx +119 -0
- package/src/components/ui/textarea.tsx +28 -0
- package/src/components/ui/toggle-group.tsx +94 -0
- package/src/components/ui/toggle.tsx +59 -0
- package/src/components/ui/tooltip.tsx +80 -0
- package/src/index.ts +15 -3
- package/src/lib/colors.ts +74 -0
- package/src/lib/slot.tsx +68 -0
- package/src/lib/theme-provider.tsx +134 -0
- package/src/lib/typography.ts +153 -0
- package/src/lib/utils.ts +1 -1
- package/src/styles/globals.css +377 -107
- package/src/styles/styles-css.ts +1 -1
- package/tsup.config.ts +48 -2
- package/dist/index.d.mts +0 -27
- package/dist/index.d.ts +0 -27
- package/src/provider/ShadcnProvider.tsx +0 -89
- package/src/provider/index.ts +0 -2
|
@@ -0,0 +1,925 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
"use client";
|
|
3
|
+
var __create = Object.create;
|
|
4
|
+
var __defProp = Object.defineProperty;
|
|
5
|
+
var __defProps = Object.defineProperties;
|
|
6
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
7
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
8
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
9
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
10
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
11
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
12
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
13
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
14
|
+
var __spreadValues = (a, b) => {
|
|
15
|
+
for (var prop in b || (b = {}))
|
|
16
|
+
if (__hasOwnProp.call(b, prop))
|
|
17
|
+
__defNormalProp(a, prop, b[prop]);
|
|
18
|
+
if (__getOwnPropSymbols)
|
|
19
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
20
|
+
if (__propIsEnum.call(b, prop))
|
|
21
|
+
__defNormalProp(a, prop, b[prop]);
|
|
22
|
+
}
|
|
23
|
+
return a;
|
|
24
|
+
};
|
|
25
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
26
|
+
var __objRest = (source, exclude) => {
|
|
27
|
+
var target = {};
|
|
28
|
+
for (var prop in source)
|
|
29
|
+
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
30
|
+
target[prop] = source[prop];
|
|
31
|
+
if (source != null && __getOwnPropSymbols)
|
|
32
|
+
for (var prop of __getOwnPropSymbols(source)) {
|
|
33
|
+
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
34
|
+
target[prop] = source[prop];
|
|
35
|
+
}
|
|
36
|
+
return target;
|
|
37
|
+
};
|
|
38
|
+
var __export = (target, all) => {
|
|
39
|
+
for (var name in all)
|
|
40
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
41
|
+
};
|
|
42
|
+
var __copyProps = (to, from, except, desc) => {
|
|
43
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
44
|
+
for (let key of __getOwnPropNames(from))
|
|
45
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
46
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
47
|
+
}
|
|
48
|
+
return to;
|
|
49
|
+
};
|
|
50
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
51
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
52
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
53
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
54
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
55
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
56
|
+
mod
|
|
57
|
+
));
|
|
58
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
59
|
+
|
|
60
|
+
// src/components/ui/data-table.tsx
|
|
61
|
+
var data_table_exports = {};
|
|
62
|
+
__export(data_table_exports, {
|
|
63
|
+
DataTable: () => DataTable,
|
|
64
|
+
DataTableColumnHeader: () => DataTableColumnHeader,
|
|
65
|
+
DataTablePagination: () => DataTablePagination,
|
|
66
|
+
DataTableSkeleton: () => DataTableSkeleton,
|
|
67
|
+
DataTableToolbar: () => DataTableToolbar,
|
|
68
|
+
getSelectionColumn: () => getSelectionColumn
|
|
69
|
+
});
|
|
70
|
+
module.exports = __toCommonJS(data_table_exports);
|
|
71
|
+
var React3 = __toESM(require("react"));
|
|
72
|
+
var import_react_table = require("@tanstack/react-table");
|
|
73
|
+
var import_lucide_react5 = require("lucide-react");
|
|
74
|
+
|
|
75
|
+
// src/lib/utils.ts
|
|
76
|
+
var import_clsx = require("clsx");
|
|
77
|
+
var import_tailwind_merge = require("tailwind-merge");
|
|
78
|
+
function cn(...inputs) {
|
|
79
|
+
return (0, import_tailwind_merge.twMerge)((0, import_clsx.clsx)(inputs));
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
// src/components/ui/table.tsx
|
|
83
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
84
|
+
function Table(_a) {
|
|
85
|
+
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
86
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
87
|
+
"div",
|
|
88
|
+
{
|
|
89
|
+
className: "relative w-full overflow-x-auto",
|
|
90
|
+
"data-slot": "table-container",
|
|
91
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
92
|
+
"table",
|
|
93
|
+
__spreadValues({
|
|
94
|
+
className: cn("w-full caption-bottom text-sm", className),
|
|
95
|
+
"data-slot": "table"
|
|
96
|
+
}, props)
|
|
97
|
+
)
|
|
98
|
+
}
|
|
99
|
+
);
|
|
100
|
+
}
|
|
101
|
+
function TableHeader(_a) {
|
|
102
|
+
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
103
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
104
|
+
"thead",
|
|
105
|
+
__spreadValues({
|
|
106
|
+
className: cn("[&_tr]:border-b", className),
|
|
107
|
+
"data-slot": "table-header"
|
|
108
|
+
}, props)
|
|
109
|
+
);
|
|
110
|
+
}
|
|
111
|
+
function TableBody(_a) {
|
|
112
|
+
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
113
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
114
|
+
"tbody",
|
|
115
|
+
__spreadValues({
|
|
116
|
+
className: cn("[&_tr:last-child]:border-0", className),
|
|
117
|
+
"data-slot": "table-body"
|
|
118
|
+
}, props)
|
|
119
|
+
);
|
|
120
|
+
}
|
|
121
|
+
function TableRow(_a) {
|
|
122
|
+
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
123
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
124
|
+
"tr",
|
|
125
|
+
__spreadValues({
|
|
126
|
+
className: cn(
|
|
127
|
+
"border-b transition-[background-color,opacity] hover:bg-muted/50 data-[state=selected]:bg-primary/10",
|
|
128
|
+
className
|
|
129
|
+
),
|
|
130
|
+
"data-slot": "table-row"
|
|
131
|
+
}, props)
|
|
132
|
+
);
|
|
133
|
+
}
|
|
134
|
+
function TableHead(_a) {
|
|
135
|
+
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
136
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
137
|
+
"th",
|
|
138
|
+
__spreadValues({
|
|
139
|
+
className: cn(
|
|
140
|
+
"h-10 px-4 text-left align-middle font-medium whitespace-nowrap text-muted-foreground",
|
|
141
|
+
"[&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",
|
|
142
|
+
className
|
|
143
|
+
),
|
|
144
|
+
"data-slot": "table-head"
|
|
145
|
+
}, props)
|
|
146
|
+
);
|
|
147
|
+
}
|
|
148
|
+
function TableCell(_a) {
|
|
149
|
+
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
150
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
151
|
+
"td",
|
|
152
|
+
__spreadValues({
|
|
153
|
+
className: cn(
|
|
154
|
+
"px-4 py-3 align-middle whitespace-nowrap",
|
|
155
|
+
"[&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",
|
|
156
|
+
className
|
|
157
|
+
),
|
|
158
|
+
"data-slot": "table-cell"
|
|
159
|
+
}, props)
|
|
160
|
+
);
|
|
161
|
+
}
|
|
162
|
+
|
|
163
|
+
// src/components/ui/input.tsx
|
|
164
|
+
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
165
|
+
function Input(_a) {
|
|
166
|
+
var _b = _a, { className, type } = _b, props = __objRest(_b, ["className", "type"]);
|
|
167
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
168
|
+
"input",
|
|
169
|
+
__spreadValues({
|
|
170
|
+
className: cn(
|
|
171
|
+
"h-9 w-full min-w-0 border border-input bg-transparent px-3 py-1 text-base font-sans shadow-xs transition-[color,box-shadow] outline-none selection:bg-primary selection:text-primary-foreground file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm dark:bg-input/30",
|
|
172
|
+
"focus-visible:border-primary focus-visible:ring-[3px] focus-visible:ring-primary/20",
|
|
173
|
+
"aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40",
|
|
174
|
+
className
|
|
175
|
+
),
|
|
176
|
+
"data-slot": "input",
|
|
177
|
+
type
|
|
178
|
+
}, props)
|
|
179
|
+
);
|
|
180
|
+
}
|
|
181
|
+
|
|
182
|
+
// src/components/ui/button.tsx
|
|
183
|
+
var import_react = require("react");
|
|
184
|
+
var import_class_variance_authority = require("class-variance-authority");
|
|
185
|
+
var import_lucide_react = require("lucide-react");
|
|
186
|
+
|
|
187
|
+
// src/lib/slot.tsx
|
|
188
|
+
var React = __toESM(require("react"));
|
|
189
|
+
function mergeRefs(...refs) {
|
|
190
|
+
return (value) => {
|
|
191
|
+
for (const ref of refs) {
|
|
192
|
+
if (typeof ref === "function") ref(value);
|
|
193
|
+
else if (ref !== null)
|
|
194
|
+
ref.current = value;
|
|
195
|
+
}
|
|
196
|
+
};
|
|
197
|
+
}
|
|
198
|
+
var Slot = React.forwardRef(
|
|
199
|
+
(_a, forwardedRef) => {
|
|
200
|
+
var _b = _a, { children } = _b, props = __objRest(_b, ["children"]);
|
|
201
|
+
const child = React.Children.only(children);
|
|
202
|
+
if (!React.isValidElement(child)) return null;
|
|
203
|
+
const childProps = child.props;
|
|
204
|
+
const merged = __spreadValues({}, props);
|
|
205
|
+
for (const key of Object.keys(childProps)) {
|
|
206
|
+
if (key === "className") {
|
|
207
|
+
merged.className = [props.className, childProps.className].filter(Boolean).join(" ");
|
|
208
|
+
} else if (key === "style") {
|
|
209
|
+
merged.style = __spreadValues(__spreadValues({}, props.style), childProps.style);
|
|
210
|
+
} else if (key.startsWith("on") && typeof childProps[key] === "function") {
|
|
211
|
+
const parentHandler = props[key];
|
|
212
|
+
if (typeof parentHandler === "function") {
|
|
213
|
+
merged[key] = (...args) => {
|
|
214
|
+
childProps[key](...args);
|
|
215
|
+
parentHandler(...args);
|
|
216
|
+
};
|
|
217
|
+
} else {
|
|
218
|
+
merged[key] = childProps[key];
|
|
219
|
+
}
|
|
220
|
+
} else {
|
|
221
|
+
merged[key] = childProps[key];
|
|
222
|
+
}
|
|
223
|
+
}
|
|
224
|
+
const childRef = child.ref;
|
|
225
|
+
merged.ref = forwardedRef ? mergeRefs(forwardedRef, childRef) : childRef;
|
|
226
|
+
return React.cloneElement(
|
|
227
|
+
child,
|
|
228
|
+
merged
|
|
229
|
+
);
|
|
230
|
+
}
|
|
231
|
+
);
|
|
232
|
+
Slot.displayName = "Slot";
|
|
233
|
+
|
|
234
|
+
// src/components/ui/button.tsx
|
|
235
|
+
var import_jsx_runtime3 = require("react/jsx-runtime");
|
|
236
|
+
var buttonVariants = (0, import_class_variance_authority.cva)(
|
|
237
|
+
"inline-flex shrink-0 cursor-pointer items-center justify-center gap-2 font-sans text-sm font-medium whitespace-nowrap transition-all active:scale-[0.98] outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
|
238
|
+
{
|
|
239
|
+
variants: {
|
|
240
|
+
variant: {
|
|
241
|
+
default: "bg-primary text-primary-foreground shadow-xs hover:bg-primary/90",
|
|
242
|
+
secondary: "bg-brand-secondary text-brand-secondary-foreground shadow-xs hover:bg-brand-secondary/80 focus-visible:ring-brand-secondary/30",
|
|
243
|
+
destructive: "bg-destructive text-destructive-foreground shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:bg-destructive/60 dark:focus-visible:ring-destructive/40",
|
|
244
|
+
outline: "border border-input bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
|
|
245
|
+
"outline-primary": "border border-primary text-foreground bg-transparent shadow-xs hover:bg-primary/5 focus-visible:ring-primary/50",
|
|
246
|
+
"outline-secondary": "border border-brand-secondary text-brand-secondary bg-transparent shadow-xs hover:bg-brand-secondary/10 focus-visible:ring-brand-secondary/30",
|
|
247
|
+
ghost: "hover:bg-accent hover:text-accent-foreground hover:shadow-xs dark:hover:bg-accent/50",
|
|
248
|
+
link: "text-primary underline-offset-4 hover:underline"
|
|
249
|
+
},
|
|
250
|
+
size: {
|
|
251
|
+
default: "h-9 px-4 py-2 has-[>svg]:px-3",
|
|
252
|
+
xs: "h-6 gap-1 px-2 text-xs has-[>svg]:px-1.5 [&_svg:not([class*='size-'])]:size-3",
|
|
253
|
+
sm: "h-8 gap-1.5 px-3 has-[>svg]:px-2.5",
|
|
254
|
+
lg: "h-10 px-6 has-[>svg]:px-4",
|
|
255
|
+
icon: "size-9",
|
|
256
|
+
"icon-xs": "size-6 [&_svg:not([class*='size-'])]:size-3",
|
|
257
|
+
"icon-sm": "size-8",
|
|
258
|
+
"icon-lg": "size-10"
|
|
259
|
+
}
|
|
260
|
+
},
|
|
261
|
+
defaultVariants: {
|
|
262
|
+
variant: "default",
|
|
263
|
+
size: "default"
|
|
264
|
+
}
|
|
265
|
+
}
|
|
266
|
+
);
|
|
267
|
+
var Button = (0, import_react.forwardRef)(function Button2(_a, ref) {
|
|
268
|
+
var _b = _a, {
|
|
269
|
+
className,
|
|
270
|
+
variant,
|
|
271
|
+
size,
|
|
272
|
+
asChild = false,
|
|
273
|
+
loading = false,
|
|
274
|
+
disabled,
|
|
275
|
+
children
|
|
276
|
+
} = _b, props = __objRest(_b, [
|
|
277
|
+
"className",
|
|
278
|
+
"variant",
|
|
279
|
+
"size",
|
|
280
|
+
"asChild",
|
|
281
|
+
"loading",
|
|
282
|
+
"disabled",
|
|
283
|
+
"children"
|
|
284
|
+
]);
|
|
285
|
+
const Comp = asChild ? Slot : "button";
|
|
286
|
+
const isIconOnly = size === "icon" || size === "icon-xs" || size === "icon-sm" || size === "icon-lg";
|
|
287
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
288
|
+
Comp,
|
|
289
|
+
__spreadProps(__spreadValues({
|
|
290
|
+
className: cn(buttonVariants({ variant, size, className })),
|
|
291
|
+
"data-size": size,
|
|
292
|
+
"data-slot": "button",
|
|
293
|
+
"data-variant": variant,
|
|
294
|
+
disabled: loading || disabled,
|
|
295
|
+
ref
|
|
296
|
+
}, props), {
|
|
297
|
+
children: loading ? /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
|
|
298
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_lucide_react.Loader2, { "aria-hidden": "true", className: "animate-spin" }),
|
|
299
|
+
!isIconOnly && children
|
|
300
|
+
] }) : children
|
|
301
|
+
})
|
|
302
|
+
);
|
|
303
|
+
});
|
|
304
|
+
|
|
305
|
+
// src/components/ui/checkbox.tsx
|
|
306
|
+
var import_react2 = require("react");
|
|
307
|
+
var import_lucide_react2 = require("lucide-react");
|
|
308
|
+
var import_checkbox = require("@base-ui/react/checkbox");
|
|
309
|
+
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
310
|
+
function Checkbox(_a) {
|
|
311
|
+
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
312
|
+
return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
313
|
+
import_checkbox.Checkbox.Root,
|
|
314
|
+
__spreadProps(__spreadValues({
|
|
315
|
+
className: cn(
|
|
316
|
+
"peer group inline-flex size-4 shrink-0 rounded-[4px] border border-input shadow-xs transition-all outline-none",
|
|
317
|
+
"focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50",
|
|
318
|
+
"disabled:cursor-not-allowed disabled:opacity-50",
|
|
319
|
+
"aria-invalid:border-destructive aria-invalid:ring-destructive/20",
|
|
320
|
+
"data-checked:border-primary data-checked:bg-primary data-checked:text-primary-foreground",
|
|
321
|
+
"data-indeterminate:border-primary data-indeterminate:bg-primary data-indeterminate:text-primary-foreground",
|
|
322
|
+
// Dark mode (upstream shadcn)
|
|
323
|
+
"dark:bg-input/30 dark:aria-invalid:ring-destructive/40 dark:data-checked:bg-primary",
|
|
324
|
+
// Stacked (2 attr selectors) → wins over single-attr rules above
|
|
325
|
+
"aria-invalid:data-checked:border-destructive aria-invalid:data-checked:bg-destructive aria-invalid:data-checked:text-destructive-foreground",
|
|
326
|
+
"aria-invalid:data-indeterminate:border-destructive aria-invalid:data-indeterminate:bg-destructive aria-invalid:data-indeterminate:text-destructive-foreground",
|
|
327
|
+
className
|
|
328
|
+
),
|
|
329
|
+
"data-slot": "checkbox"
|
|
330
|
+
}, props), {
|
|
331
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
|
|
332
|
+
import_checkbox.Checkbox.Indicator,
|
|
333
|
+
{
|
|
334
|
+
className: "grid place-content-center text-current transition-none",
|
|
335
|
+
"data-slot": "checkbox-indicator",
|
|
336
|
+
children: [
|
|
337
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_lucide_react2.CheckIcon, { className: "size-3.5 group-data-indeterminate:hidden" }),
|
|
338
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_lucide_react2.MinusIcon, { className: "size-3.5 hidden group-data-indeterminate:block" })
|
|
339
|
+
]
|
|
340
|
+
}
|
|
341
|
+
)
|
|
342
|
+
})
|
|
343
|
+
);
|
|
344
|
+
}
|
|
345
|
+
|
|
346
|
+
// src/components/ui/select.tsx
|
|
347
|
+
var import_lucide_react3 = require("lucide-react");
|
|
348
|
+
var import_select = require("@base-ui/react/select");
|
|
349
|
+
|
|
350
|
+
// src/lib/theme-provider.tsx
|
|
351
|
+
var import_react3 = require("react");
|
|
352
|
+
var import_jsx_runtime5 = require("react/jsx-runtime");
|
|
353
|
+
var ThemeVarsContext = (0, import_react3.createContext)({});
|
|
354
|
+
function useThemeVars() {
|
|
355
|
+
return (0, import_react3.useContext)(ThemeVarsContext);
|
|
356
|
+
}
|
|
357
|
+
|
|
358
|
+
// src/components/ui/select.tsx
|
|
359
|
+
var import_jsx_runtime6 = require("react/jsx-runtime");
|
|
360
|
+
function Select(_a) {
|
|
361
|
+
var props = __objRest(_a, []);
|
|
362
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_select.Select.Root, __spreadValues({ "data-slot": "select" }, props));
|
|
363
|
+
}
|
|
364
|
+
function SelectValue(_a) {
|
|
365
|
+
var props = __objRest(_a, []);
|
|
366
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_select.Select.Value, __spreadValues({ "data-slot": "select-value" }, props));
|
|
367
|
+
}
|
|
368
|
+
function SelectTrigger(_a) {
|
|
369
|
+
var _b = _a, {
|
|
370
|
+
className,
|
|
371
|
+
size = "default",
|
|
372
|
+
children
|
|
373
|
+
} = _b, props = __objRest(_b, [
|
|
374
|
+
"className",
|
|
375
|
+
"size",
|
|
376
|
+
"children"
|
|
377
|
+
]);
|
|
378
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
|
|
379
|
+
import_select.Select.Trigger,
|
|
380
|
+
__spreadProps(__spreadValues({
|
|
381
|
+
className: cn(
|
|
382
|
+
"flex w-fit items-center justify-between gap-2 border border-input bg-transparent px-3 py-2 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none focus-visible:border-primary focus-visible:ring-[3px] focus-visible:ring-primary/20 data-popup-open:border-primary data-popup-open:ring-[3px] data-popup-open:ring-primary/20 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 data-placeholder:text-muted-foreground data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground",
|
|
383
|
+
className
|
|
384
|
+
),
|
|
385
|
+
"data-size": size,
|
|
386
|
+
"data-slot": "select-trigger"
|
|
387
|
+
}, props), {
|
|
388
|
+
children: [
|
|
389
|
+
children,
|
|
390
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_select.Select.Icon, { className: "transition-transform duration-200 data-popup-open:rotate-180", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_lucide_react3.ChevronDownIcon, { className: "size-4 opacity-50" }) })
|
|
391
|
+
]
|
|
392
|
+
})
|
|
393
|
+
);
|
|
394
|
+
}
|
|
395
|
+
function SelectContent(_a) {
|
|
396
|
+
var _b = _a, {
|
|
397
|
+
className,
|
|
398
|
+
children,
|
|
399
|
+
style
|
|
400
|
+
} = _b, props = __objRest(_b, [
|
|
401
|
+
"className",
|
|
402
|
+
"children",
|
|
403
|
+
"style"
|
|
404
|
+
]);
|
|
405
|
+
const themeVars = useThemeVars();
|
|
406
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_select.Select.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_select.Select.Positioner, { align: "start", alignItemWithTrigger: false, sideOffset: 4, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
|
|
407
|
+
import_select.Select.Popup,
|
|
408
|
+
__spreadProps(__spreadValues({
|
|
409
|
+
className: cn(
|
|
410
|
+
"relative z-50 max-h-[var(--available-height)] min-w-[8rem] overflow-x-hidden overflow-y-auto border bg-popover p-1 text-popover-foreground shadow-md data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-ending-style:animate-out data-ending-style:fade-out-0 data-ending-style:zoom-out-95 data-ending-style:fill-mode-forwards data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95",
|
|
411
|
+
className
|
|
412
|
+
),
|
|
413
|
+
"data-slot": "select-content",
|
|
414
|
+
style: __spreadValues(__spreadValues({}, themeVars), style)
|
|
415
|
+
}, props), {
|
|
416
|
+
children: [
|
|
417
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(SelectScrollUpButton, {}),
|
|
418
|
+
children,
|
|
419
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(SelectScrollDownButton, {})
|
|
420
|
+
]
|
|
421
|
+
})
|
|
422
|
+
) }) });
|
|
423
|
+
}
|
|
424
|
+
function SelectItem(_a) {
|
|
425
|
+
var _b = _a, {
|
|
426
|
+
className,
|
|
427
|
+
children
|
|
428
|
+
} = _b, props = __objRest(_b, [
|
|
429
|
+
"className",
|
|
430
|
+
"children"
|
|
431
|
+
]);
|
|
432
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
|
|
433
|
+
import_select.Select.Item,
|
|
434
|
+
__spreadProps(__spreadValues({
|
|
435
|
+
className: cn(
|
|
436
|
+
"relative flex w-full cursor-default items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 text-sm outline-hidden select-none data-highlighted:bg-primary/5 data-highlighted:text-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2",
|
|
437
|
+
className
|
|
438
|
+
),
|
|
439
|
+
"data-slot": "select-item"
|
|
440
|
+
}, props), {
|
|
441
|
+
children: [
|
|
442
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
443
|
+
"span",
|
|
444
|
+
{
|
|
445
|
+
className: "absolute right-2 flex size-3.5 items-center justify-center",
|
|
446
|
+
"data-slot": "select-item-indicator",
|
|
447
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_select.Select.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_lucide_react3.CheckIcon, { className: "size-4" }) })
|
|
448
|
+
}
|
|
449
|
+
),
|
|
450
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_select.Select.ItemText, { children })
|
|
451
|
+
]
|
|
452
|
+
})
|
|
453
|
+
);
|
|
454
|
+
}
|
|
455
|
+
function SelectScrollUpButton(_a) {
|
|
456
|
+
var _b = _a, {
|
|
457
|
+
className
|
|
458
|
+
} = _b, props = __objRest(_b, [
|
|
459
|
+
"className"
|
|
460
|
+
]);
|
|
461
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
462
|
+
import_select.Select.ScrollUpArrow,
|
|
463
|
+
__spreadProps(__spreadValues({
|
|
464
|
+
className: cn(
|
|
465
|
+
"flex cursor-default items-center justify-center py-1",
|
|
466
|
+
className
|
|
467
|
+
),
|
|
468
|
+
"data-slot": "select-scroll-up-button"
|
|
469
|
+
}, props), {
|
|
470
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_lucide_react3.ChevronUpIcon, { className: "size-4" })
|
|
471
|
+
})
|
|
472
|
+
);
|
|
473
|
+
}
|
|
474
|
+
function SelectScrollDownButton(_a) {
|
|
475
|
+
var _b = _a, {
|
|
476
|
+
className
|
|
477
|
+
} = _b, props = __objRest(_b, [
|
|
478
|
+
"className"
|
|
479
|
+
]);
|
|
480
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
481
|
+
import_select.Select.ScrollDownArrow,
|
|
482
|
+
__spreadProps(__spreadValues({
|
|
483
|
+
className: cn(
|
|
484
|
+
"flex cursor-default items-center justify-center py-1",
|
|
485
|
+
className
|
|
486
|
+
),
|
|
487
|
+
"data-slot": "select-scroll-down-button"
|
|
488
|
+
}, props), {
|
|
489
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_lucide_react3.ChevronDownIcon, { className: "size-4" })
|
|
490
|
+
})
|
|
491
|
+
);
|
|
492
|
+
}
|
|
493
|
+
|
|
494
|
+
// src/components/ui/dropdown-menu.tsx
|
|
495
|
+
var import_lucide_react4 = require("lucide-react");
|
|
496
|
+
var import_menu = require("@base-ui/react/menu");
|
|
497
|
+
var import_jsx_runtime7 = require("react/jsx-runtime");
|
|
498
|
+
function DropdownMenu(_a) {
|
|
499
|
+
var props = __objRest(_a, []);
|
|
500
|
+
return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_menu.Menu.Root, __spreadValues({ "data-slot": "dropdown-menu" }, props));
|
|
501
|
+
}
|
|
502
|
+
function DropdownMenuTrigger(_a) {
|
|
503
|
+
var props = __objRest(_a, []);
|
|
504
|
+
return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
|
|
505
|
+
import_menu.Menu.Trigger,
|
|
506
|
+
__spreadValues({
|
|
507
|
+
"data-slot": "dropdown-menu-trigger"
|
|
508
|
+
}, props)
|
|
509
|
+
);
|
|
510
|
+
}
|
|
511
|
+
function DropdownMenuContent(_a) {
|
|
512
|
+
var _b = _a, {
|
|
513
|
+
className,
|
|
514
|
+
sideOffset = 4,
|
|
515
|
+
style
|
|
516
|
+
} = _b, props = __objRest(_b, [
|
|
517
|
+
"className",
|
|
518
|
+
"sideOffset",
|
|
519
|
+
"style"
|
|
520
|
+
]);
|
|
521
|
+
const themeVars = useThemeVars();
|
|
522
|
+
return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_menu.Menu.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_menu.Menu.Positioner, { sideOffset, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
|
|
523
|
+
import_menu.Menu.Popup,
|
|
524
|
+
__spreadValues({
|
|
525
|
+
className: cn(
|
|
526
|
+
"z-50 min-w-[8rem] overflow-x-hidden overflow-y-auto rounded-none border bg-popover p-1 text-popover-foreground shadow-md data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-ending-style:animate-out data-ending-style:fade-out-0 data-ending-style:zoom-out-95 data-ending-style:fill-mode-forwards data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95",
|
|
527
|
+
className
|
|
528
|
+
),
|
|
529
|
+
"data-slot": "dropdown-menu-content",
|
|
530
|
+
style: __spreadValues(__spreadValues({}, themeVars), style)
|
|
531
|
+
}, props)
|
|
532
|
+
) }) });
|
|
533
|
+
}
|
|
534
|
+
function DropdownMenuGroup(_a) {
|
|
535
|
+
var props = __objRest(_a, []);
|
|
536
|
+
return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_menu.Menu.Group, __spreadValues({ "data-slot": "dropdown-menu-group" }, props));
|
|
537
|
+
}
|
|
538
|
+
function DropdownMenuCheckboxItem(_a) {
|
|
539
|
+
var _b = _a, {
|
|
540
|
+
className,
|
|
541
|
+
children,
|
|
542
|
+
checked
|
|
543
|
+
} = _b, props = __objRest(_b, [
|
|
544
|
+
"className",
|
|
545
|
+
"children",
|
|
546
|
+
"checked"
|
|
547
|
+
]);
|
|
548
|
+
return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
|
|
549
|
+
import_menu.Menu.CheckboxItem,
|
|
550
|
+
__spreadProps(__spreadValues({
|
|
551
|
+
checked,
|
|
552
|
+
className: cn(
|
|
553
|
+
"relative flex cursor-default items-center gap-2 rounded-none py-1.5 pr-2 pl-8 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50 data-checked:bg-primary/10 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
|
554
|
+
className
|
|
555
|
+
),
|
|
556
|
+
"data-slot": "dropdown-menu-checkbox-item"
|
|
557
|
+
}, props), {
|
|
558
|
+
children: [
|
|
559
|
+
/* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_menu.Menu.CheckboxItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_lucide_react4.CheckIcon, { className: "size-4" }) }) }),
|
|
560
|
+
children
|
|
561
|
+
]
|
|
562
|
+
})
|
|
563
|
+
);
|
|
564
|
+
}
|
|
565
|
+
function DropdownMenuLabel(_a) {
|
|
566
|
+
var _b = _a, {
|
|
567
|
+
className,
|
|
568
|
+
inset
|
|
569
|
+
} = _b, props = __objRest(_b, [
|
|
570
|
+
"className",
|
|
571
|
+
"inset"
|
|
572
|
+
]);
|
|
573
|
+
return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
|
|
574
|
+
import_menu.Menu.GroupLabel,
|
|
575
|
+
__spreadValues({
|
|
576
|
+
className: cn(
|
|
577
|
+
"px-2 py-1.5 text-sm font-medium data-inset:pl-8",
|
|
578
|
+
className
|
|
579
|
+
),
|
|
580
|
+
"data-inset": inset,
|
|
581
|
+
"data-slot": "dropdown-menu-label"
|
|
582
|
+
}, props)
|
|
583
|
+
);
|
|
584
|
+
}
|
|
585
|
+
function DropdownMenuSeparator(_a) {
|
|
586
|
+
var _b = _a, {
|
|
587
|
+
className
|
|
588
|
+
} = _b, props = __objRest(_b, [
|
|
589
|
+
"className"
|
|
590
|
+
]);
|
|
591
|
+
return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
|
|
592
|
+
import_menu.Menu.Separator,
|
|
593
|
+
__spreadValues({
|
|
594
|
+
className: cn("-mx-1 my-1 h-px bg-border", className),
|
|
595
|
+
"data-slot": "dropdown-menu-separator"
|
|
596
|
+
}, props)
|
|
597
|
+
);
|
|
598
|
+
}
|
|
599
|
+
|
|
600
|
+
// src/components/ui/skeleton.tsx
|
|
601
|
+
var import_jsx_runtime8 = require("react/jsx-runtime");
|
|
602
|
+
function Skeleton(_a) {
|
|
603
|
+
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
604
|
+
return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
|
|
605
|
+
"div",
|
|
606
|
+
__spreadValues({
|
|
607
|
+
className: cn("animate-pulse bg-muted", className),
|
|
608
|
+
"data-slot": "skeleton"
|
|
609
|
+
}, props)
|
|
610
|
+
);
|
|
611
|
+
}
|
|
612
|
+
|
|
613
|
+
// src/components/ui/data-table.tsx
|
|
614
|
+
var import_jsx_runtime9 = require("react/jsx-runtime");
|
|
615
|
+
function DataTableColumnHeader({
|
|
616
|
+
column,
|
|
617
|
+
title,
|
|
618
|
+
className
|
|
619
|
+
}) {
|
|
620
|
+
if (!column.getCanSort()) {
|
|
621
|
+
return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className, children: title });
|
|
622
|
+
}
|
|
623
|
+
const sorted = column.getIsSorted();
|
|
624
|
+
let sortIcon;
|
|
625
|
+
if (sorted === "asc") {
|
|
626
|
+
sortIcon = /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_lucide_react5.ArrowUp, { className: "ml-1 size-3.5" });
|
|
627
|
+
} else if (sorted === "desc") {
|
|
628
|
+
sortIcon = /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_lucide_react5.ArrowDown, { className: "ml-1 size-3.5" });
|
|
629
|
+
} else {
|
|
630
|
+
sortIcon = /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_lucide_react5.ArrowUpDown, { className: "ml-1 size-3.5" });
|
|
631
|
+
}
|
|
632
|
+
return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
|
|
633
|
+
Button,
|
|
634
|
+
{
|
|
635
|
+
className: cn("-ml-3 h-8 font-medium text-muted-foreground hover:text-foreground", className),
|
|
636
|
+
onClick: () => {
|
|
637
|
+
column.toggleSorting(sorted === "asc");
|
|
638
|
+
},
|
|
639
|
+
size: "sm",
|
|
640
|
+
variant: "ghost",
|
|
641
|
+
children: [
|
|
642
|
+
title,
|
|
643
|
+
sortIcon
|
|
644
|
+
]
|
|
645
|
+
}
|
|
646
|
+
);
|
|
647
|
+
}
|
|
648
|
+
function getSelectionColumn() {
|
|
649
|
+
return {
|
|
650
|
+
id: "select",
|
|
651
|
+
header: ({ table }) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
652
|
+
Checkbox,
|
|
653
|
+
{
|
|
654
|
+
"aria-label": "Select all",
|
|
655
|
+
checked: table.getIsAllPageRowsSelected(),
|
|
656
|
+
indeterminate: table.getIsSomePageRowsSelected() && !table.getIsAllPageRowsSelected(),
|
|
657
|
+
onCheckedChange: (checked) => {
|
|
658
|
+
table.toggleAllPageRowsSelected(Boolean(checked));
|
|
659
|
+
}
|
|
660
|
+
}
|
|
661
|
+
),
|
|
662
|
+
cell: ({ row }) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
663
|
+
Checkbox,
|
|
664
|
+
{
|
|
665
|
+
"aria-label": "Select row",
|
|
666
|
+
checked: row.getIsSelected(),
|
|
667
|
+
onCheckedChange: (checked) => {
|
|
668
|
+
row.toggleSelected(Boolean(checked));
|
|
669
|
+
}
|
|
670
|
+
}
|
|
671
|
+
),
|
|
672
|
+
enableSorting: false,
|
|
673
|
+
enableHiding: false
|
|
674
|
+
};
|
|
675
|
+
}
|
|
676
|
+
function DataTableToolbar({
|
|
677
|
+
table,
|
|
678
|
+
searchKey,
|
|
679
|
+
searchPlaceholder,
|
|
680
|
+
enableColumnVisibility
|
|
681
|
+
}) {
|
|
682
|
+
var _a;
|
|
683
|
+
return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "flex items-center justify-between gap-2 py-4", "data-slot": "data-table-toolbar", children: [
|
|
684
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "flex flex-1 items-center gap-2", children: searchKey ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
685
|
+
Input,
|
|
686
|
+
{
|
|
687
|
+
className: "max-w-xs",
|
|
688
|
+
onChange: (e) => {
|
|
689
|
+
var _a2;
|
|
690
|
+
return (_a2 = table.getColumn(searchKey)) == null ? void 0 : _a2.setFilterValue(e.target.value);
|
|
691
|
+
},
|
|
692
|
+
placeholder: searchPlaceholder != null ? searchPlaceholder : `Filter ${searchKey}...`,
|
|
693
|
+
value: (_a = table.getColumn(searchKey)) == null ? void 0 : _a.getFilterValue()
|
|
694
|
+
}
|
|
695
|
+
) : null }),
|
|
696
|
+
enableColumnVisibility ? /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(DropdownMenu, { children: [
|
|
697
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
|
|
698
|
+
DropdownMenuTrigger,
|
|
699
|
+
{
|
|
700
|
+
render: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Button, { className: "ml-auto h-8 gap-1.5", size: "sm", variant: "outline" }),
|
|
701
|
+
children: [
|
|
702
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_lucide_react5.SlidersHorizontal, { className: "size-3.5" }),
|
|
703
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "hidden sm:inline", children: "Columns" })
|
|
704
|
+
]
|
|
705
|
+
}
|
|
706
|
+
),
|
|
707
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(DropdownMenuContent, { children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(DropdownMenuGroup, { children: [
|
|
708
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(DropdownMenuLabel, { children: "Toggle columns" }),
|
|
709
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(DropdownMenuSeparator, {}),
|
|
710
|
+
table.getAllColumns().filter((col) => col.getCanHide()).map((col) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
711
|
+
DropdownMenuCheckboxItem,
|
|
712
|
+
{
|
|
713
|
+
checked: col.getIsVisible(),
|
|
714
|
+
className: "capitalize",
|
|
715
|
+
onCheckedChange: (value) => {
|
|
716
|
+
col.toggleVisibility(Boolean(value));
|
|
717
|
+
},
|
|
718
|
+
children: col.id
|
|
719
|
+
},
|
|
720
|
+
col.id
|
|
721
|
+
))
|
|
722
|
+
] }) })
|
|
723
|
+
] }) : null
|
|
724
|
+
] });
|
|
725
|
+
}
|
|
726
|
+
function DataTablePagination({
|
|
727
|
+
table,
|
|
728
|
+
pageSizeOptions = [10, 20, 30, 50]
|
|
729
|
+
}) {
|
|
730
|
+
return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
|
|
731
|
+
"div",
|
|
732
|
+
{
|
|
733
|
+
className: "flex items-center justify-between gap-4 py-4",
|
|
734
|
+
"data-slot": "data-table-pagination",
|
|
735
|
+
children: [
|
|
736
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)("p", { className: "text-sm text-muted-foreground", children: table.getFilteredSelectedRowModel().rows.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_jsx_runtime9.Fragment, { children: [
|
|
737
|
+
table.getFilteredSelectedRowModel().rows.length,
|
|
738
|
+
" of",
|
|
739
|
+
" ",
|
|
740
|
+
table.getFilteredRowModel().rows.length,
|
|
741
|
+
" row(s) selected."
|
|
742
|
+
] }) }),
|
|
743
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "flex items-center gap-6", children: [
|
|
744
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "flex items-center gap-2", children: [
|
|
745
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)("p", { className: "text-sm text-muted-foreground whitespace-nowrap", children: "Rows per page" }),
|
|
746
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
|
|
747
|
+
Select,
|
|
748
|
+
{
|
|
749
|
+
onValueChange: (value) => {
|
|
750
|
+
table.setPageSize(Number(value));
|
|
751
|
+
},
|
|
752
|
+
value: `${table.getState().pagination.pageSize}`,
|
|
753
|
+
children: [
|
|
754
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(SelectTrigger, { className: "w-[70px]", size: "sm", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(SelectValue, { placeholder: `${table.getState().pagination.pageSize}` }) }),
|
|
755
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(SelectContent, { children: pageSizeOptions.map((pageSize) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(SelectItem, { value: `${pageSize}`, children: pageSize }, pageSize)) })
|
|
756
|
+
]
|
|
757
|
+
}
|
|
758
|
+
)
|
|
759
|
+
] }),
|
|
760
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("p", { className: "text-sm text-muted-foreground whitespace-nowrap", children: [
|
|
761
|
+
"Page ",
|
|
762
|
+
table.getState().pagination.pageIndex + 1,
|
|
763
|
+
" of ",
|
|
764
|
+
table.getPageCount()
|
|
765
|
+
] }),
|
|
766
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "flex items-center gap-1", children: [
|
|
767
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
768
|
+
Button,
|
|
769
|
+
{
|
|
770
|
+
"aria-label": "Go to first page",
|
|
771
|
+
disabled: !table.getCanPreviousPage(),
|
|
772
|
+
onClick: () => {
|
|
773
|
+
table.setPageIndex(0);
|
|
774
|
+
},
|
|
775
|
+
size: "icon-sm",
|
|
776
|
+
variant: "outline",
|
|
777
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_lucide_react5.ChevronsLeftIcon, { className: "size-4" })
|
|
778
|
+
}
|
|
779
|
+
),
|
|
780
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
781
|
+
Button,
|
|
782
|
+
{
|
|
783
|
+
"aria-label": "Go to previous page",
|
|
784
|
+
disabled: !table.getCanPreviousPage(),
|
|
785
|
+
onClick: () => {
|
|
786
|
+
table.previousPage();
|
|
787
|
+
},
|
|
788
|
+
size: "icon-sm",
|
|
789
|
+
variant: "outline",
|
|
790
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_lucide_react5.ChevronLeftIcon, { className: "size-4" })
|
|
791
|
+
}
|
|
792
|
+
),
|
|
793
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
794
|
+
Button,
|
|
795
|
+
{
|
|
796
|
+
"aria-label": "Go to next page",
|
|
797
|
+
disabled: !table.getCanNextPage(),
|
|
798
|
+
onClick: () => {
|
|
799
|
+
table.nextPage();
|
|
800
|
+
},
|
|
801
|
+
size: "icon-sm",
|
|
802
|
+
variant: "outline",
|
|
803
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_lucide_react5.ChevronRightIcon, { className: "size-4" })
|
|
804
|
+
}
|
|
805
|
+
),
|
|
806
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
807
|
+
Button,
|
|
808
|
+
{
|
|
809
|
+
"aria-label": "Go to last page",
|
|
810
|
+
disabled: !table.getCanNextPage(),
|
|
811
|
+
onClick: () => {
|
|
812
|
+
table.setPageIndex(table.getPageCount() - 1);
|
|
813
|
+
},
|
|
814
|
+
size: "icon-sm",
|
|
815
|
+
variant: "outline",
|
|
816
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_lucide_react5.ChevronsRightIcon, { className: "size-4" })
|
|
817
|
+
}
|
|
818
|
+
)
|
|
819
|
+
] })
|
|
820
|
+
] })
|
|
821
|
+
]
|
|
822
|
+
}
|
|
823
|
+
);
|
|
824
|
+
}
|
|
825
|
+
function DataTableSkeleton({
|
|
826
|
+
columnCount,
|
|
827
|
+
rowCount = 5
|
|
828
|
+
}) {
|
|
829
|
+
return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_jsx_runtime9.Fragment, { children: Array.from({ length: rowCount }).map((_, rowIdx) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(TableRow, { children: Array.from({ length: columnCount }).map((_inner, colIdx) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(TableCell, { children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Skeleton, { className: "h-4 w-3/4" }) }, `skeleton-cell-${String(rowIdx)}-${String(colIdx)}`)) }, `skeleton-row-${String(rowIdx)}`)) });
|
|
830
|
+
}
|
|
831
|
+
function DataTable({
|
|
832
|
+
columns: userColumns,
|
|
833
|
+
data,
|
|
834
|
+
searchKey,
|
|
835
|
+
searchPlaceholder,
|
|
836
|
+
enableRowSelection = false,
|
|
837
|
+
enableColumnVisibility = false,
|
|
838
|
+
pageSizeOptions = [10, 20, 30, 50],
|
|
839
|
+
loading = false,
|
|
840
|
+
skeletonRows = 5,
|
|
841
|
+
onRowSelectionChange,
|
|
842
|
+
className,
|
|
843
|
+
toolbar,
|
|
844
|
+
emptyText = "No results."
|
|
845
|
+
}) {
|
|
846
|
+
const [sorting, setSorting] = React3.useState([]);
|
|
847
|
+
const [columnFilters, setColumnFilters] = React3.useState([]);
|
|
848
|
+
const [columnVisibility, setColumnVisibility] = React3.useState({});
|
|
849
|
+
const [rowSelection, setRowSelection] = React3.useState({});
|
|
850
|
+
const resolvedColumns = React3.useMemo(() => {
|
|
851
|
+
if (!enableRowSelection) return userColumns;
|
|
852
|
+
return [getSelectionColumn(), ...userColumns];
|
|
853
|
+
}, [userColumns, enableRowSelection]);
|
|
854
|
+
const table = (0, import_react_table.useReactTable)({
|
|
855
|
+
data,
|
|
856
|
+
columns: resolvedColumns,
|
|
857
|
+
state: {
|
|
858
|
+
sorting,
|
|
859
|
+
columnFilters,
|
|
860
|
+
columnVisibility,
|
|
861
|
+
rowSelection
|
|
862
|
+
},
|
|
863
|
+
onSortingChange: setSorting,
|
|
864
|
+
onColumnFiltersChange: setColumnFilters,
|
|
865
|
+
onColumnVisibilityChange: setColumnVisibility,
|
|
866
|
+
onRowSelectionChange: (updater) => {
|
|
867
|
+
const next = typeof updater === "function" ? updater(rowSelection) : updater;
|
|
868
|
+
setRowSelection(next);
|
|
869
|
+
onRowSelectionChange == null ? void 0 : onRowSelectionChange(next);
|
|
870
|
+
},
|
|
871
|
+
getCoreRowModel: (0, import_react_table.getCoreRowModel)(),
|
|
872
|
+
getFilteredRowModel: (0, import_react_table.getFilteredRowModel)(),
|
|
873
|
+
getPaginationRowModel: (0, import_react_table.getPaginationRowModel)(),
|
|
874
|
+
getSortedRowModel: (0, import_react_table.getSortedRowModel)(),
|
|
875
|
+
enableRowSelection
|
|
876
|
+
});
|
|
877
|
+
function renderTableBody() {
|
|
878
|
+
if (loading) {
|
|
879
|
+
return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(DataTableSkeleton, { columnCount: resolvedColumns.length, rowCount: skeletonRows });
|
|
880
|
+
}
|
|
881
|
+
if (table.getRowModel().rows.length) {
|
|
882
|
+
return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_jsx_runtime9.Fragment, { children: table.getRowModel().rows.map((row) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
883
|
+
TableRow,
|
|
884
|
+
{
|
|
885
|
+
"data-state": row.getIsSelected() ? "selected" : void 0,
|
|
886
|
+
children: row.getVisibleCells().map((cell) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(TableCell, { children: (0, import_react_table.flexRender)(cell.column.columnDef.cell, cell.getContext()) }, cell.id))
|
|
887
|
+
},
|
|
888
|
+
row.id
|
|
889
|
+
)) });
|
|
890
|
+
}
|
|
891
|
+
return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(TableRow, { children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
892
|
+
TableCell,
|
|
893
|
+
{
|
|
894
|
+
className: "h-24 text-center text-muted-foreground",
|
|
895
|
+
colSpan: resolvedColumns.length,
|
|
896
|
+
children: emptyText
|
|
897
|
+
}
|
|
898
|
+
) });
|
|
899
|
+
}
|
|
900
|
+
return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: cn("w-full font-sans", className), "data-slot": "data-table", children: [
|
|
901
|
+
toolbar ? toolbar(table) : (searchKey || enableColumnVisibility) && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
902
|
+
DataTableToolbar,
|
|
903
|
+
{
|
|
904
|
+
enableColumnVisibility,
|
|
905
|
+
searchKey,
|
|
906
|
+
searchPlaceholder,
|
|
907
|
+
table
|
|
908
|
+
}
|
|
909
|
+
),
|
|
910
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "border border-border", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(Table, { children: [
|
|
911
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(TableHeader, { children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(TableRow, { children: headerGroup.headers.map((header) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(TableHead, { children: header.isPlaceholder ? null : (0, import_react_table.flexRender)(header.column.columnDef.header, header.getContext()) }, header.id)) }, headerGroup.id)) }),
|
|
912
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(TableBody, { children: renderTableBody() })
|
|
913
|
+
] }) }),
|
|
914
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(DataTablePagination, { pageSizeOptions, table })
|
|
915
|
+
] });
|
|
916
|
+
}
|
|
917
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
918
|
+
0 && (module.exports = {
|
|
919
|
+
DataTable,
|
|
920
|
+
DataTableColumnHeader,
|
|
921
|
+
DataTablePagination,
|
|
922
|
+
DataTableSkeleton,
|
|
923
|
+
DataTableToolbar,
|
|
924
|
+
getSelectionColumn
|
|
925
|
+
});
|