@ai-matrx/design-system 0.18.4 → 0.18.6
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/CHANGELOG.md +19 -0
- package/dist/content-transfer.cjs +12 -5
- package/dist/content-transfer.cjs.map +1 -1
- package/dist/content-transfer.d.cts +4 -0
- package/dist/content-transfer.d.ts +4 -0
- package/dist/content-transfer.js +12 -5
- package/dist/content-transfer.js.map +1 -1
- package/dist/data-table/copy-helpers.cjs +53 -0
- package/dist/data-table/copy-helpers.cjs.map +1 -1
- package/dist/data-table/copy-helpers.d.cts +13 -2
- package/dist/data-table/copy-helpers.d.ts +13 -2
- package/dist/data-table/copy-helpers.js +55 -0
- package/dist/data-table/copy-helpers.js.map +1 -1
- package/dist/data-table/copy-types.cjs.map +1 -1
- package/dist/data-table/copy-types.d.cts +5 -0
- package/dist/data-table/copy-types.d.ts +5 -0
- package/dist/data-table/data-row-inspector.cjs +70 -50
- package/dist/data-table/data-row-inspector.cjs.map +1 -1
- package/dist/data-table/data-row-inspector.js +70 -50
- package/dist/data-table/data-row-inspector.js.map +1 -1
- package/dist/data-table/data-row-window.cjs +70 -50
- package/dist/data-table/data-row-window.cjs.map +1 -1
- package/dist/data-table/data-row-window.js +70 -50
- package/dist/data-table/data-row-window.js.map +1 -1
- package/dist/data-table/filter-engine.d.cts +1 -1
- package/dist/data-table/filter-engine.d.ts +1 -1
- package/dist/data-table/index.cjs +621 -422
- package/dist/data-table/index.cjs.map +1 -1
- package/dist/data-table/index.d.cts +2 -2
- package/dist/data-table/index.d.ts +2 -2
- package/dist/data-table/index.js +623 -422
- package/dist/data-table/index.js.map +1 -1
- package/dist/data-table/infer-filter.d.cts +1 -1
- package/dist/data-table/infer-filter.d.ts +1 -1
- package/dist/data-table/layered-filters.d.cts +1 -1
- package/dist/data-table/layered-filters.d.ts +1 -1
- package/dist/data-table/pagination.cjs +148 -90
- package/dist/data-table/pagination.cjs.map +1 -1
- package/dist/data-table/pagination.js +143 -85
- package/dist/data-table/pagination.js.map +1 -1
- package/dist/data-table/query-control.d.cts +1 -1
- package/dist/data-table/query-control.d.ts +1 -1
- package/dist/data-table/types.cjs.map +1 -1
- package/dist/data-table/types.d.cts +1 -1
- package/dist/data-table/types.d.ts +1 -1
- package/dist/data-table/url-state.d.cts +1 -1
- package/dist/data-table/url-state.d.ts +1 -1
- package/dist/data-table/uuid-cell.cjs +58 -45
- package/dist/data-table/uuid-cell.cjs.map +1 -1
- package/dist/data-table/uuid-cell.js +58 -45
- package/dist/data-table/uuid-cell.js.map +1 -1
- package/dist/data-table/xlsx.d.cts +1 -1
- package/dist/data-table/xlsx.d.ts +1 -1
- package/dist/{types-Bx9SfdJM.d.cts → types-0CNCWvdK.d.cts} +2 -2
- package/dist/{types-DyByb6tW.d.ts → types-cH8oLqUx.d.ts} +2 -2
- package/package.json +1 -1
|
@@ -81,19 +81,8 @@ var Button = React.forwardRef(
|
|
|
81
81
|
);
|
|
82
82
|
Button.displayName = "Button";
|
|
83
83
|
|
|
84
|
-
// src/
|
|
85
|
-
import
|
|
86
|
-
function Icon({ children, ...props }) {
|
|
87
|
-
return /* @__PURE__ */ jsx2("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", "aria-hidden": "true", ...props, children });
|
|
88
|
-
}
|
|
89
|
-
var ChevronLeft = (p) => /* @__PURE__ */ jsx2(Icon, { ...p, children: /* @__PURE__ */ jsx2("path", { d: "m15 18-6-6 6-6" }) });
|
|
90
|
-
var ChevronRight = (p) => /* @__PURE__ */ jsx2(Icon, { ...p, children: /* @__PURE__ */ jsx2("path", { d: "m9 18 6-6-6-6" }) });
|
|
91
|
-
var ChevronsLeft = (p) => /* @__PURE__ */ jsx2(Icon, { ...p, children: /* @__PURE__ */ jsx2("path", { d: "m11 18-6-6 6-6m8 12-6-6 6-6" }) });
|
|
92
|
-
var ChevronsRight = (p) => /* @__PURE__ */ jsx2(Icon, { ...p, children: /* @__PURE__ */ jsx2("path", { d: "m5 18 6-6-6-6m8 12 6-6-6-6" }) });
|
|
93
|
-
|
|
94
|
-
// src/select.tsx
|
|
95
|
-
import * as SelectPrimitive from "@radix-ui/react-select";
|
|
96
|
-
import { cva as cva2 } from "class-variance-authority";
|
|
84
|
+
// src/tooltip.tsx
|
|
85
|
+
import * as TooltipPrimitive from "@radix-ui/react-tooltip";
|
|
97
86
|
import * as React3 from "react";
|
|
98
87
|
|
|
99
88
|
// src/motion.ts
|
|
@@ -121,8 +110,61 @@ var ALL_MOTION_CLASSES = [
|
|
|
121
110
|
MOTION_SPIN
|
|
122
111
|
];
|
|
123
112
|
|
|
113
|
+
// src/portal-container.tsx
|
|
114
|
+
import * as React2 from "react";
|
|
115
|
+
import { jsx as jsx2 } from "react/jsx-runtime";
|
|
116
|
+
var CONTEXT_SLOT = /* @__PURE__ */ Symbol.for("ai-matrx.design-system.portal-container-context");
|
|
117
|
+
var contextRegistry = globalThis;
|
|
118
|
+
var PortalContainerContext = contextRegistry[CONTEXT_SLOT] ??= React2.createContext(void 0);
|
|
119
|
+
function usePortalContainer(explicit) {
|
|
120
|
+
const injected = React2.useContext(PortalContainerContext);
|
|
121
|
+
if (explicit !== void 0) {
|
|
122
|
+
return explicit ?? void 0;
|
|
123
|
+
}
|
|
124
|
+
return injected ?? void 0;
|
|
125
|
+
}
|
|
126
|
+
|
|
127
|
+
// src/tooltip.tsx
|
|
128
|
+
import { jsx as jsx3 } from "react/jsx-runtime";
|
|
129
|
+
var TooltipProvider = TooltipPrimitive.Provider;
|
|
130
|
+
var Tooltip = TooltipPrimitive.Root;
|
|
131
|
+
var TooltipTrigger = TooltipPrimitive.Trigger;
|
|
132
|
+
var TooltipContent = React3.forwardRef(({ className, sideOffset = 4, container, animated = true, ...props }, ref) => {
|
|
133
|
+
const resolved = usePortalContainer(container);
|
|
134
|
+
return /* @__PURE__ */ jsx3(TooltipPrimitive.Portal, { container: resolved ?? null, children: /* @__PURE__ */ jsx3(
|
|
135
|
+
TooltipPrimitive.Content,
|
|
136
|
+
{
|
|
137
|
+
ref,
|
|
138
|
+
"data-slot": "tooltip-content",
|
|
139
|
+
sideOffset,
|
|
140
|
+
className: cn(
|
|
141
|
+
"z-[10001] overflow-hidden rounded-md border border-border bg-popover px-3 py-1.5 text-xs text-popover-foreground shadow-md",
|
|
142
|
+
animated && MOTION_POPPER,
|
|
143
|
+
className
|
|
144
|
+
),
|
|
145
|
+
...props
|
|
146
|
+
}
|
|
147
|
+
) });
|
|
148
|
+
});
|
|
149
|
+
TooltipContent.displayName = TooltipPrimitive.Content.displayName;
|
|
150
|
+
|
|
151
|
+
// src/data-table/icons.tsx
|
|
152
|
+
import { jsx as jsx4, jsxs } from "react/jsx-runtime";
|
|
153
|
+
function Icon({ children, ...props }) {
|
|
154
|
+
return /* @__PURE__ */ jsx4("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", "aria-hidden": "true", ...props, children });
|
|
155
|
+
}
|
|
156
|
+
var ChevronLeft = (p) => /* @__PURE__ */ jsx4(Icon, { ...p, children: /* @__PURE__ */ jsx4("path", { d: "m15 18-6-6 6-6" }) });
|
|
157
|
+
var ChevronRight = (p) => /* @__PURE__ */ jsx4(Icon, { ...p, children: /* @__PURE__ */ jsx4("path", { d: "m9 18 6-6-6-6" }) });
|
|
158
|
+
var ChevronsLeft = (p) => /* @__PURE__ */ jsx4(Icon, { ...p, children: /* @__PURE__ */ jsx4("path", { d: "m11 18-6-6 6-6m8 12-6-6 6-6" }) });
|
|
159
|
+
var ChevronsRight = (p) => /* @__PURE__ */ jsx4(Icon, { ...p, children: /* @__PURE__ */ jsx4("path", { d: "m5 18 6-6-6-6m8 12 6-6-6-6" }) });
|
|
160
|
+
|
|
161
|
+
// src/select.tsx
|
|
162
|
+
import * as SelectPrimitive from "@radix-ui/react-select";
|
|
163
|
+
import { cva as cva2 } from "class-variance-authority";
|
|
164
|
+
import * as React4 from "react";
|
|
165
|
+
|
|
124
166
|
// src/icons.tsx
|
|
125
|
-
import { jsx as
|
|
167
|
+
import { jsx as jsx5, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
126
168
|
function radixProps(props) {
|
|
127
169
|
return {
|
|
128
170
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -135,7 +177,7 @@ function radixProps(props) {
|
|
|
135
177
|
};
|
|
136
178
|
}
|
|
137
179
|
function CheckIcon(props) {
|
|
138
|
-
return /* @__PURE__ */
|
|
180
|
+
return /* @__PURE__ */ jsx5("svg", { ...radixProps(props), children: /* @__PURE__ */ jsx5(
|
|
139
181
|
"path",
|
|
140
182
|
{
|
|
141
183
|
d: "M11.4669 3.72684C11.7558 3.91574 11.8369 4.30308 11.648 4.59198L7.39799 11.092C7.29783 11.2452 7.13556 11.3467 6.95402 11.3699C6.77247 11.3931 6.58989 11.3355 6.45446 11.2124L3.70446 8.71241C3.44905 8.48022 3.43023 8.08494 3.66242 7.82953C3.89461 7.57412 4.28989 7.55529 4.5453 7.78749L6.75292 9.79441L10.6018 3.90792C10.7907 3.61902 11.178 3.53795 11.4669 3.72684Z",
|
|
@@ -146,7 +188,7 @@ function CheckIcon(props) {
|
|
|
146
188
|
) });
|
|
147
189
|
}
|
|
148
190
|
function RadixChevronDownIcon(props) {
|
|
149
|
-
return /* @__PURE__ */
|
|
191
|
+
return /* @__PURE__ */ jsx5("svg", { ...radixProps(props), children: /* @__PURE__ */ jsx5(
|
|
150
192
|
"path",
|
|
151
193
|
{
|
|
152
194
|
d: "M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z",
|
|
@@ -157,7 +199,7 @@ function RadixChevronDownIcon(props) {
|
|
|
157
199
|
) });
|
|
158
200
|
}
|
|
159
201
|
function RadixChevronUpIcon(props) {
|
|
160
|
-
return /* @__PURE__ */
|
|
202
|
+
return /* @__PURE__ */ jsx5("svg", { ...radixProps(props), children: /* @__PURE__ */ jsx5(
|
|
161
203
|
"path",
|
|
162
204
|
{
|
|
163
205
|
d: "M3.13523 8.84197C3.3241 9.04343 3.64052 9.05363 3.84197 8.86477L7.5 5.43536L11.158 8.86477C11.3595 9.05363 11.6759 9.04343 11.8648 8.84197C12.0536 8.64051 12.0434 8.32409 11.842 8.13523L7.84197 4.38523C7.64964 4.20492 7.35036 4.20492 7.15803 4.38523L3.15803 8.13523C2.95657 8.32409 2.94637 8.64051 3.13523 8.84197Z",
|
|
@@ -168,22 +210,8 @@ function RadixChevronUpIcon(props) {
|
|
|
168
210
|
) });
|
|
169
211
|
}
|
|
170
212
|
|
|
171
|
-
// src/portal-container.tsx
|
|
172
|
-
import * as React2 from "react";
|
|
173
|
-
import { jsx as jsx4 } from "react/jsx-runtime";
|
|
174
|
-
var CONTEXT_SLOT = /* @__PURE__ */ Symbol.for("ai-matrx.design-system.portal-container-context");
|
|
175
|
-
var contextRegistry = globalThis;
|
|
176
|
-
var PortalContainerContext = contextRegistry[CONTEXT_SLOT] ??= React2.createContext(void 0);
|
|
177
|
-
function usePortalContainer(explicit) {
|
|
178
|
-
const injected = React2.useContext(PortalContainerContext);
|
|
179
|
-
if (explicit !== void 0) {
|
|
180
|
-
return explicit ?? void 0;
|
|
181
|
-
}
|
|
182
|
-
return injected ?? void 0;
|
|
183
|
-
}
|
|
184
|
-
|
|
185
213
|
// src/select.tsx
|
|
186
|
-
import { jsx as
|
|
214
|
+
import { jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
187
215
|
var Select = SelectPrimitive.Root;
|
|
188
216
|
var SelectValue = SelectPrimitive.Value;
|
|
189
217
|
var selectTriggerVariants = cva2(
|
|
@@ -201,7 +229,7 @@ var selectTriggerVariants = cva2(
|
|
|
201
229
|
}
|
|
202
230
|
}
|
|
203
231
|
);
|
|
204
|
-
var SelectTrigger =
|
|
232
|
+
var SelectTrigger = React4.forwardRef(({ className, children, hideArrow = false, size, ...props }, ref) => /* @__PURE__ */ jsxs3(
|
|
205
233
|
SelectPrimitive.Trigger,
|
|
206
234
|
{
|
|
207
235
|
ref,
|
|
@@ -209,12 +237,12 @@ var SelectTrigger = React3.forwardRef(({ className, children, hideArrow = false,
|
|
|
209
237
|
...props,
|
|
210
238
|
children: [
|
|
211
239
|
children,
|
|
212
|
-
!hideArrow && /* @__PURE__ */
|
|
240
|
+
!hideArrow && /* @__PURE__ */ jsx6(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx6(RadixChevronDownIcon, { className: "h-4 w-4 shrink-0 opacity-50" }) })
|
|
213
241
|
]
|
|
214
242
|
}
|
|
215
243
|
));
|
|
216
244
|
SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
|
|
217
|
-
var SelectScrollUpButton =
|
|
245
|
+
var SelectScrollUpButton = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx6(
|
|
218
246
|
SelectPrimitive.ScrollUpButton,
|
|
219
247
|
{
|
|
220
248
|
ref,
|
|
@@ -223,11 +251,11 @@ var SelectScrollUpButton = React3.forwardRef(({ className, ...props }, ref) => /
|
|
|
223
251
|
className
|
|
224
252
|
),
|
|
225
253
|
...props,
|
|
226
|
-
children: /* @__PURE__ */
|
|
254
|
+
children: /* @__PURE__ */ jsx6(RadixChevronUpIcon, {})
|
|
227
255
|
}
|
|
228
256
|
));
|
|
229
257
|
SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
|
|
230
|
-
var SelectScrollDownButton =
|
|
258
|
+
var SelectScrollDownButton = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx6(
|
|
231
259
|
SelectPrimitive.ScrollDownButton,
|
|
232
260
|
{
|
|
233
261
|
ref,
|
|
@@ -236,11 +264,11 @@ var SelectScrollDownButton = React3.forwardRef(({ className, ...props }, ref) =>
|
|
|
236
264
|
className
|
|
237
265
|
),
|
|
238
266
|
...props,
|
|
239
|
-
children: /* @__PURE__ */
|
|
267
|
+
children: /* @__PURE__ */ jsx6(RadixChevronDownIcon, {})
|
|
240
268
|
}
|
|
241
269
|
));
|
|
242
270
|
SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
|
|
243
|
-
var SelectContent =
|
|
271
|
+
var SelectContent = React4.forwardRef(
|
|
244
272
|
({
|
|
245
273
|
className,
|
|
246
274
|
children,
|
|
@@ -250,7 +278,7 @@ var SelectContent = React3.forwardRef(
|
|
|
250
278
|
...props
|
|
251
279
|
}, ref) => {
|
|
252
280
|
const portalContainer = usePortalContainer(container);
|
|
253
|
-
return /* @__PURE__ */
|
|
281
|
+
return /* @__PURE__ */ jsx6(SelectPrimitive.Portal, { container: portalContainer, children: /* @__PURE__ */ jsxs3(
|
|
254
282
|
SelectPrimitive.Content,
|
|
255
283
|
{
|
|
256
284
|
ref,
|
|
@@ -268,8 +296,8 @@ var SelectContent = React3.forwardRef(
|
|
|
268
296
|
position,
|
|
269
297
|
...props,
|
|
270
298
|
children: [
|
|
271
|
-
/* @__PURE__ */
|
|
272
|
-
/* @__PURE__ */
|
|
299
|
+
/* @__PURE__ */ jsx6(SelectScrollUpButton, {}),
|
|
300
|
+
/* @__PURE__ */ jsx6(
|
|
273
301
|
SelectPrimitive.Viewport,
|
|
274
302
|
{
|
|
275
303
|
className: cn(
|
|
@@ -279,14 +307,14 @@ var SelectContent = React3.forwardRef(
|
|
|
279
307
|
children
|
|
280
308
|
}
|
|
281
309
|
),
|
|
282
|
-
/* @__PURE__ */
|
|
310
|
+
/* @__PURE__ */ jsx6(SelectScrollDownButton, {})
|
|
283
311
|
]
|
|
284
312
|
}
|
|
285
313
|
) });
|
|
286
314
|
}
|
|
287
315
|
);
|
|
288
316
|
SelectContent.displayName = SelectPrimitive.Content.displayName;
|
|
289
|
-
var SelectLabel =
|
|
317
|
+
var SelectLabel = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx6(
|
|
290
318
|
SelectPrimitive.Label,
|
|
291
319
|
{
|
|
292
320
|
ref,
|
|
@@ -295,7 +323,7 @@ var SelectLabel = React3.forwardRef(({ className, ...props }, ref) => /* @__PURE
|
|
|
295
323
|
}
|
|
296
324
|
));
|
|
297
325
|
SelectLabel.displayName = SelectPrimitive.Label.displayName;
|
|
298
|
-
var SelectItem =
|
|
326
|
+
var SelectItem = React4.forwardRef(({ className, children, description, ...props }, ref) => /* @__PURE__ */ jsxs3(
|
|
299
327
|
SelectPrimitive.Item,
|
|
300
328
|
{
|
|
301
329
|
ref,
|
|
@@ -306,14 +334,14 @@ var SelectItem = React3.forwardRef(({ className, children, description, ...props
|
|
|
306
334
|
),
|
|
307
335
|
...props,
|
|
308
336
|
children: [
|
|
309
|
-
/* @__PURE__ */
|
|
310
|
-
/* @__PURE__ */
|
|
311
|
-
description ? /* @__PURE__ */
|
|
337
|
+
/* @__PURE__ */ jsx6("span", { className: "absolute right-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx6(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx6(CheckIcon, { className: "h-4 w-4" }) }) }),
|
|
338
|
+
/* @__PURE__ */ jsx6(SelectPrimitive.ItemText, { children }),
|
|
339
|
+
description ? /* @__PURE__ */ jsx6("span", { className: "block text-xs leading-snug text-muted-foreground", children: description }) : null
|
|
312
340
|
]
|
|
313
341
|
}
|
|
314
342
|
));
|
|
315
343
|
SelectItem.displayName = SelectPrimitive.Item.displayName;
|
|
316
|
-
var SelectSeparator =
|
|
344
|
+
var SelectSeparator = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx6(
|
|
317
345
|
SelectPrimitive.Separator,
|
|
318
346
|
{
|
|
319
347
|
ref,
|
|
@@ -324,7 +352,37 @@ var SelectSeparator = React3.forwardRef(({ className, ...props }, ref) => /* @__
|
|
|
324
352
|
SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
|
|
325
353
|
|
|
326
354
|
// src/data-table/pagination.tsx
|
|
327
|
-
import { Fragment, jsx as
|
|
355
|
+
import { Fragment, jsx as jsx7, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
356
|
+
function PageNavigationControl({
|
|
357
|
+
label,
|
|
358
|
+
disabledHint,
|
|
359
|
+
visibilityClassName = "inline-flex",
|
|
360
|
+
disabled,
|
|
361
|
+
className,
|
|
362
|
+
...props
|
|
363
|
+
}) {
|
|
364
|
+
const button = /* @__PURE__ */ jsx7(
|
|
365
|
+
Button,
|
|
366
|
+
{
|
|
367
|
+
...props,
|
|
368
|
+
disabled,
|
|
369
|
+
"aria-label": label,
|
|
370
|
+
className: cn(visibilityClassName, className)
|
|
371
|
+
}
|
|
372
|
+
);
|
|
373
|
+
return /* @__PURE__ */ jsxs4(Tooltip, { children: [
|
|
374
|
+
/* @__PURE__ */ jsx7(TooltipTrigger, { asChild: true, children: disabled ? /* @__PURE__ */ jsx7(
|
|
375
|
+
"span",
|
|
376
|
+
{
|
|
377
|
+
className: cn(visibilityClassName, "rounded-md outline-none focus-visible:ring-2 focus-visible:ring-ring"),
|
|
378
|
+
tabIndex: 0,
|
|
379
|
+
"aria-label": `${label} \u2014 ${disabledHint.toLowerCase()}`,
|
|
380
|
+
children: button
|
|
381
|
+
}
|
|
382
|
+
) : button }),
|
|
383
|
+
/* @__PURE__ */ jsx7(TooltipContent, { children: disabled ? disabledHint : label })
|
|
384
|
+
] });
|
|
385
|
+
}
|
|
328
386
|
function GenericTablePagination({
|
|
329
387
|
totalItems,
|
|
330
388
|
itemsPerPage,
|
|
@@ -383,8 +441,8 @@ function GenericTablePagination({
|
|
|
383
441
|
className,
|
|
384
442
|
containerClassName
|
|
385
443
|
);
|
|
386
|
-
return /* @__PURE__ */ jsxs4("div", { "data-matrx-table-footer": true, className: containerClass, children: [
|
|
387
|
-
showItemsPerPageSelect && /* @__PURE__ */
|
|
444
|
+
return /* @__PURE__ */ jsx7(TooltipProvider, { children: /* @__PURE__ */ jsxs4("div", { "data-matrx-table-footer": true, className: containerClass, children: [
|
|
445
|
+
showItemsPerPageSelect && /* @__PURE__ */ jsx7(
|
|
388
446
|
"div",
|
|
389
447
|
{
|
|
390
448
|
className: cn(
|
|
@@ -398,7 +456,7 @@ function GenericTablePagination({
|
|
|
398
456
|
value: itemsPerPage.toString(),
|
|
399
457
|
onValueChange: (value) => onItemsPerPageChange(parseInt(value)),
|
|
400
458
|
children: [
|
|
401
|
-
/* @__PURE__ */
|
|
459
|
+
/* @__PURE__ */ jsx7(
|
|
402
460
|
SelectTrigger,
|
|
403
461
|
{
|
|
404
462
|
"aria-label": "Rows per page",
|
|
@@ -406,19 +464,19 @@ function GenericTablePagination({
|
|
|
406
464
|
"focus:ring-0",
|
|
407
465
|
compact ? "relative isolate h-11 w-14 border-0 bg-transparent px-2 text-xs before:absolute before:inset-x-1 before:inset-y-1.5 before:z-0 before:rounded-md before:border before:border-border before:bg-card before:content-[''] hover:before:bg-accent [&>*]:relative [&>*]:z-10 lg:h-7 lg:min-h-7 lg:w-16 lg:border lg:border-input lg:bg-background lg:px-2 lg:before:hidden" : "h-8 w-[3.75rem] text-xs sm:w-36 sm:text-sm"
|
|
408
466
|
),
|
|
409
|
-
children: /* @__PURE__ */
|
|
467
|
+
children: /* @__PURE__ */ jsx7(SelectValue, { placeholder: itemsPerPage.toString() })
|
|
410
468
|
}
|
|
411
469
|
),
|
|
412
470
|
/* @__PURE__ */ jsxs4(SelectContent, { children: [
|
|
413
|
-
availablePageSizes.map((size) => /* @__PURE__ */
|
|
414
|
-
showAllOption ? /* @__PURE__ */
|
|
471
|
+
availablePageSizes.map((size) => /* @__PURE__ */ jsx7(SelectItem, { value: size.toString(), children: size }, size)),
|
|
472
|
+
showAllOption ? /* @__PURE__ */ jsx7(SelectItem, { value: allValue.toString(), children: allOptionLabel }) : null
|
|
415
473
|
] })
|
|
416
474
|
]
|
|
417
475
|
}
|
|
418
476
|
)
|
|
419
477
|
}
|
|
420
478
|
),
|
|
421
|
-
/* @__PURE__ */
|
|
479
|
+
/* @__PURE__ */ jsx7(
|
|
422
480
|
"div",
|
|
423
481
|
{
|
|
424
482
|
className: cn("flex min-w-0 justify-center", infoContainerClassName),
|
|
@@ -430,7 +488,7 @@ function GenericTablePagination({
|
|
|
430
488
|
" / ",
|
|
431
489
|
totalItems
|
|
432
490
|
] }),
|
|
433
|
-
/* @__PURE__ */
|
|
491
|
+
/* @__PURE__ */ jsx7(
|
|
434
492
|
"span",
|
|
435
493
|
{
|
|
436
494
|
className: `hidden whitespace-nowrap ${compact ? "text-xs" : "text-sm"} text-muted-foreground sm:inline`,
|
|
@@ -449,40 +507,40 @@ function GenericTablePagination({
|
|
|
449
507
|
controlsContainerClassName
|
|
450
508
|
),
|
|
451
509
|
children: [
|
|
452
|
-
/* @__PURE__ */
|
|
453
|
-
|
|
510
|
+
/* @__PURE__ */ jsx7(
|
|
511
|
+
PageNavigationControl,
|
|
454
512
|
{
|
|
455
513
|
variant: "outline",
|
|
456
514
|
size: buttonSize,
|
|
457
|
-
|
|
458
|
-
|
|
515
|
+
visibilityClassName: "hidden sm:inline-flex",
|
|
516
|
+
label: "First page",
|
|
517
|
+
disabledHint: "Already on the first page",
|
|
459
518
|
onClick: () => onPageChange(1),
|
|
460
519
|
disabled: isFirstPageDisabled,
|
|
461
520
|
className: cn(
|
|
462
|
-
"hidden sm:inline-flex",
|
|
463
521
|
compact ? compactButtonClass : "h-8 w-8 p-0",
|
|
464
522
|
navButtonClassName
|
|
465
523
|
),
|
|
466
|
-
children: /* @__PURE__ */
|
|
524
|
+
children: /* @__PURE__ */ jsx7(ChevronsLeft, { className: compact ? "h-3.5 w-3.5" : "h-4 w-4" })
|
|
467
525
|
}
|
|
468
526
|
),
|
|
469
|
-
/* @__PURE__ */
|
|
470
|
-
|
|
527
|
+
/* @__PURE__ */ jsx7(
|
|
528
|
+
PageNavigationControl,
|
|
471
529
|
{
|
|
472
530
|
variant: "outline",
|
|
473
531
|
size: buttonSize,
|
|
474
|
-
|
|
475
|
-
|
|
532
|
+
label: "Previous page",
|
|
533
|
+
disabledHint: "Already on the first page",
|
|
476
534
|
onClick: () => onPageChange(currentPage - 1),
|
|
477
535
|
disabled: isFirstPageDisabled,
|
|
478
536
|
className: cn(
|
|
479
537
|
compact ? compactButtonClass : "h-8 w-8 p-0",
|
|
480
538
|
navButtonClassName
|
|
481
539
|
),
|
|
482
|
-
children: /* @__PURE__ */
|
|
540
|
+
children: /* @__PURE__ */ jsx7(ChevronLeft, { className: compact ? "h-3.5 w-3.5" : "h-4 w-4" })
|
|
483
541
|
}
|
|
484
542
|
),
|
|
485
|
-
getPageNumbers(3).map((page) => /* @__PURE__ */
|
|
543
|
+
getPageNumbers(3).map((page) => /* @__PURE__ */ jsx7(
|
|
486
544
|
Button,
|
|
487
545
|
{
|
|
488
546
|
variant: currentPage === page ? "default" : "outline",
|
|
@@ -497,11 +555,11 @@ function GenericTablePagination({
|
|
|
497
555
|
compact && page === currentPage && compactActiveButtonClass,
|
|
498
556
|
page === currentPage ? pageActiveButtonClassName : pageButtonClassName
|
|
499
557
|
),
|
|
500
|
-
children: /* @__PURE__ */
|
|
558
|
+
children: /* @__PURE__ */ jsx7("span", { className: "relative z-10", children: page })
|
|
501
559
|
},
|
|
502
560
|
`mobile-${page}`
|
|
503
561
|
)),
|
|
504
|
-
getPageNumbers().map((page) => /* @__PURE__ */
|
|
562
|
+
getPageNumbers().map((page) => /* @__PURE__ */ jsx7(
|
|
505
563
|
Button,
|
|
506
564
|
{
|
|
507
565
|
variant: currentPage === page ? "default" : "outline",
|
|
@@ -515,47 +573,47 @@ function GenericTablePagination({
|
|
|
515
573
|
compact && page === currentPage && compactActiveButtonClass,
|
|
516
574
|
currentPage === page ? pageActiveButtonClassName : pageButtonClassName
|
|
517
575
|
),
|
|
518
|
-
children: /* @__PURE__ */
|
|
576
|
+
children: /* @__PURE__ */ jsx7("span", { className: "relative z-10", children: page })
|
|
519
577
|
},
|
|
520
578
|
`desktop-${page}`
|
|
521
579
|
)),
|
|
522
|
-
/* @__PURE__ */
|
|
523
|
-
|
|
580
|
+
/* @__PURE__ */ jsx7(
|
|
581
|
+
PageNavigationControl,
|
|
524
582
|
{
|
|
525
583
|
variant: "outline",
|
|
526
584
|
size: buttonSize,
|
|
527
|
-
|
|
528
|
-
|
|
585
|
+
label: "Next page",
|
|
586
|
+
disabledHint: "Already on the last page",
|
|
529
587
|
onClick: () => onPageChange(currentPage + 1),
|
|
530
588
|
disabled: isLastPageDisabled,
|
|
531
589
|
className: cn(
|
|
532
590
|
compact ? compactButtonClass : "h-8 w-8 p-0",
|
|
533
591
|
navButtonClassName
|
|
534
592
|
),
|
|
535
|
-
children: /* @__PURE__ */
|
|
593
|
+
children: /* @__PURE__ */ jsx7(ChevronRight, { className: compact ? "h-3.5 w-3.5" : "h-4 w-4" })
|
|
536
594
|
}
|
|
537
595
|
),
|
|
538
|
-
/* @__PURE__ */
|
|
539
|
-
|
|
596
|
+
/* @__PURE__ */ jsx7(
|
|
597
|
+
PageNavigationControl,
|
|
540
598
|
{
|
|
541
599
|
variant: "outline",
|
|
542
600
|
size: buttonSize,
|
|
543
|
-
|
|
544
|
-
|
|
601
|
+
visibilityClassName: "hidden sm:inline-flex",
|
|
602
|
+
label: "Last page",
|
|
603
|
+
disabledHint: "Already on the last page",
|
|
545
604
|
onClick: () => onPageChange(totalPages),
|
|
546
605
|
disabled: isLastPageDisabled,
|
|
547
606
|
className: cn(
|
|
548
|
-
"hidden sm:inline-flex",
|
|
549
607
|
compact ? compactButtonClass : "h-8 w-8 p-0",
|
|
550
608
|
navButtonClassName
|
|
551
609
|
),
|
|
552
|
-
children: /* @__PURE__ */
|
|
610
|
+
children: /* @__PURE__ */ jsx7(ChevronsRight, { className: compact ? "h-3.5 w-3.5" : "h-4 w-4" })
|
|
553
611
|
}
|
|
554
612
|
)
|
|
555
613
|
]
|
|
556
614
|
}
|
|
557
615
|
)
|
|
558
|
-
] });
|
|
616
|
+
] }) });
|
|
559
617
|
}
|
|
560
618
|
export {
|
|
561
619
|
GenericTablePagination as default
|