next-recomponents 2.0.68 → 2.0.69
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/dist/index.d.mts +2 -1
- package/dist/index.d.ts +2 -1
- package/dist/index.js +237 -142
- package/dist/index.mjs +206 -111
- package/package.json +1 -1
- package/src/doc-viewer/icon.tsx +37 -0
- package/src/doc-viewer/index.tsx +143 -47
- package/src/table-advanced/icons.tsx +1 -1
package/dist/index.js
CHANGED
|
@@ -37509,6 +37509,9 @@ function MyCalendar({
|
|
|
37509
37509
|
] });
|
|
37510
37510
|
}
|
|
37511
37511
|
|
|
37512
|
+
// src/doc-viewer/index.tsx
|
|
37513
|
+
var import_react12 = require("react");
|
|
37514
|
+
|
|
37512
37515
|
// src/doc-viewer/icon.tsx
|
|
37513
37516
|
var import_jsx_runtime21 = require("react/jsx-runtime");
|
|
37514
37517
|
function Icon() {
|
|
@@ -37544,92 +37547,184 @@ function DownloadIcon() {
|
|
|
37544
37547
|
}
|
|
37545
37548
|
);
|
|
37546
37549
|
}
|
|
37550
|
+
function OpenIcon() {
|
|
37551
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
|
|
37552
|
+
"svg",
|
|
37553
|
+
{
|
|
37554
|
+
stroke: "currentColor",
|
|
37555
|
+
fill: "none",
|
|
37556
|
+
strokeWidth: "2",
|
|
37557
|
+
viewBox: "0 0 24 24",
|
|
37558
|
+
strokeLinecap: "round",
|
|
37559
|
+
strokeLinejoin: "round",
|
|
37560
|
+
height: "1em",
|
|
37561
|
+
width: "1em",
|
|
37562
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
37563
|
+
children: [
|
|
37564
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)("polyline", { points: "15 3 21 3 21 9" }),
|
|
37565
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)("polyline", { points: "9 21 3 21 3 15" }),
|
|
37566
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)("line", { x1: "21", y1: "3", x2: "14", y2: "10" }),
|
|
37567
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)("line", { x1: "3", y1: "21", x2: "10", y2: "14" })
|
|
37568
|
+
]
|
|
37569
|
+
}
|
|
37570
|
+
);
|
|
37571
|
+
}
|
|
37572
|
+
function DeleteIcon() {
|
|
37573
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
|
|
37574
|
+
"svg",
|
|
37575
|
+
{
|
|
37576
|
+
stroke: "currentColor",
|
|
37577
|
+
fill: "currentColor",
|
|
37578
|
+
strokeWidth: "0",
|
|
37579
|
+
viewBox: "0 0 24 24",
|
|
37580
|
+
height: "1em",
|
|
37581
|
+
width: "1em",
|
|
37582
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
37583
|
+
children: [
|
|
37584
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)("path", { fill: "none", d: "M0 0h24v24H0z" }),
|
|
37585
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)("path", { d: "M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6zM19 4h-3.5l-1-1h-5l-1 1H5v2h14z" })
|
|
37586
|
+
]
|
|
37587
|
+
}
|
|
37588
|
+
);
|
|
37589
|
+
}
|
|
37547
37590
|
|
|
37548
37591
|
// src/doc-viewer/index.tsx
|
|
37549
37592
|
var import_jsx_runtime22 = require("react/jsx-runtime");
|
|
37550
37593
|
function DocumentViewer({
|
|
37551
37594
|
item,
|
|
37552
37595
|
width = "100%",
|
|
37553
|
-
height = "100%"
|
|
37596
|
+
height = "100%",
|
|
37597
|
+
onDelete
|
|
37554
37598
|
}) {
|
|
37555
37599
|
const { url, name, contentType } = item;
|
|
37556
37600
|
const isImage = contentType.startsWith("image/");
|
|
37557
37601
|
const isPdf = contentType === "application/pdf";
|
|
37558
|
-
const isGoogleDocCompatible =
|
|
37602
|
+
const isGoogleDocCompatible = contentType.includes("msword") || contentType.includes("officedocument") || contentType.includes("presentation");
|
|
37559
37603
|
const viewerUrl = isGoogleDocCompatible ? `https://docs.google.com/gview?url=${encodeURIComponent(
|
|
37560
37604
|
url
|
|
37561
37605
|
)}&embedded=true` : url;
|
|
37562
|
-
|
|
37563
|
-
|
|
37564
|
-
|
|
37565
|
-
|
|
37566
|
-
|
|
37567
|
-
|
|
37568
|
-
|
|
37569
|
-
|
|
37570
|
-
|
|
37571
|
-
|
|
37572
|
-
|
|
37573
|
-
|
|
37574
|
-
|
|
37575
|
-
|
|
37576
|
-
|
|
37577
|
-
|
|
37578
|
-
|
|
37579
|
-
|
|
37580
|
-
|
|
37581
|
-
|
|
37582
|
-
|
|
37583
|
-
|
|
37584
|
-
|
|
37585
|
-
|
|
37586
|
-
|
|
37587
|
-
|
|
37588
|
-
|
|
37589
|
-
|
|
37590
|
-
|
|
37591
|
-
|
|
37592
|
-
|
|
37593
|
-
|
|
37594
|
-
|
|
37595
|
-
|
|
37596
|
-
|
|
37597
|
-
|
|
37598
|
-
|
|
37599
|
-
|
|
37600
|
-
|
|
37601
|
-
|
|
37602
|
-
|
|
37603
|
-
|
|
37604
|
-
|
|
37605
|
-
|
|
37606
|
-
|
|
37607
|
-
|
|
37608
|
-
|
|
37609
|
-
|
|
37610
|
-
|
|
37611
|
-
|
|
37612
|
-
|
|
37613
|
-
|
|
37614
|
-
|
|
37615
|
-
|
|
37616
|
-
|
|
37617
|
-
|
|
37618
|
-
|
|
37619
|
-
|
|
37620
|
-
|
|
37621
|
-
|
|
37622
|
-
|
|
37623
|
-
|
|
37624
|
-
|
|
37625
|
-
|
|
37606
|
+
const [isOpen, setIsOpen] = (0, import_react12.useState)(false);
|
|
37607
|
+
return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
|
|
37608
|
+
"div",
|
|
37609
|
+
{
|
|
37610
|
+
className: "group relative rounded-lg bg-white shadow-md overflow-hidden",
|
|
37611
|
+
style: {
|
|
37612
|
+
width,
|
|
37613
|
+
height
|
|
37614
|
+
},
|
|
37615
|
+
children: [
|
|
37616
|
+
isImage ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
37617
|
+
"img",
|
|
37618
|
+
{
|
|
37619
|
+
src: url,
|
|
37620
|
+
alt: name,
|
|
37621
|
+
className: "w-full h-full rounded object-cover"
|
|
37622
|
+
}
|
|
37623
|
+
) : isPdf ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("iframe", { src: url, title: name, className: "w-full h-full rounded" }) : isGoogleDocCompatible ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
37624
|
+
"iframe",
|
|
37625
|
+
{
|
|
37626
|
+
src: viewerUrl,
|
|
37627
|
+
title: name,
|
|
37628
|
+
className: "w-full h-full rounded",
|
|
37629
|
+
allowFullScreen: true
|
|
37630
|
+
}
|
|
37631
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "w-full h-full rounded flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Icon, {}) }),
|
|
37632
|
+
isOpen && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
37633
|
+
"div",
|
|
37634
|
+
{
|
|
37635
|
+
className: "\r\n fixed inset-0 z-[9999]\r\n bg-black/50\r\n flex items-center justify-center\r\n p-6\r\n ",
|
|
37636
|
+
onClick: () => setIsOpen(false),
|
|
37637
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
|
|
37638
|
+
"div",
|
|
37639
|
+
{
|
|
37640
|
+
className: "\r\n relative\r\n w-full h-full\r\n flex items-center justify-center\r\n ",
|
|
37641
|
+
onClick: (e) => e.stopPropagation(),
|
|
37642
|
+
children: [
|
|
37643
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
37644
|
+
"button",
|
|
37645
|
+
{
|
|
37646
|
+
type: "button",
|
|
37647
|
+
onClick: () => setIsOpen(false),
|
|
37648
|
+
className: "\r\n absolute top-4 right-4 z-10\r\n w-10 h-10\r\n rounded-full\r\n bg-black/70 text-white\r\n hover:bg-black\r\n flex items-center justify-center\r\n text-xl\r\n ",
|
|
37649
|
+
children: "\u2715"
|
|
37650
|
+
}
|
|
37651
|
+
),
|
|
37652
|
+
isImage ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
37653
|
+
"img",
|
|
37654
|
+
{
|
|
37655
|
+
src: url,
|
|
37656
|
+
alt: name,
|
|
37657
|
+
className: "w-full h-full rounded object-cover"
|
|
37658
|
+
}
|
|
37659
|
+
) : isPdf ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
37660
|
+
"iframe",
|
|
37661
|
+
{
|
|
37662
|
+
src: url,
|
|
37663
|
+
title: name,
|
|
37664
|
+
className: "w-full h-full rounded"
|
|
37665
|
+
}
|
|
37666
|
+
) : isGoogleDocCompatible ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
37667
|
+
"iframe",
|
|
37668
|
+
{
|
|
37669
|
+
src: viewerUrl,
|
|
37670
|
+
title: name,
|
|
37671
|
+
className: "w-full h-full rounded",
|
|
37672
|
+
allowFullScreen: true
|
|
37673
|
+
}
|
|
37674
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "w-full h-full rounded flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Icon, {}) })
|
|
37675
|
+
]
|
|
37676
|
+
}
|
|
37677
|
+
)
|
|
37678
|
+
}
|
|
37679
|
+
),
|
|
37680
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
37681
|
+
"div",
|
|
37682
|
+
{
|
|
37683
|
+
className: "\r\n absolute inset-0\r\n bg-white/70\r\n opacity-0\r\n invisible\r\n group-hover:opacity-100\r\n group-hover:visible\r\n transition-all duration-200\r\n flex items-center justify-center\r\n ",
|
|
37684
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex flex-col justify-between h-full p-2 w-full", children: [
|
|
37685
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "w-full bg-transparent h-full flex items-center justify-center", children: item.name }),
|
|
37686
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex justify-end gap-2 mr-10", children: [
|
|
37687
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "border bg-black/50 shadow rounded p-2 hover:bg-black/70 transition-all duration-200 text-white", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
37688
|
+
"a",
|
|
37689
|
+
{
|
|
37690
|
+
href: item.url,
|
|
37691
|
+
download: item.name,
|
|
37692
|
+
target: "_blank",
|
|
37693
|
+
title: "Download",
|
|
37694
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(DownloadIcon, {})
|
|
37695
|
+
}
|
|
37696
|
+
) }),
|
|
37697
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
37698
|
+
"div",
|
|
37699
|
+
{
|
|
37700
|
+
className: "border bg-black/50 shadow rounded p-2 hover:bg-black/70 transition-all duration-200 text-white cursor-pointer",
|
|
37701
|
+
onClick: (e) => {
|
|
37702
|
+
setIsOpen(true);
|
|
37703
|
+
},
|
|
37704
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("a", { title: "Open", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(OpenIcon, {}) })
|
|
37705
|
+
}
|
|
37706
|
+
),
|
|
37707
|
+
onDelete && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "border bg-red-500/50 shadow rounded p-2 hover:bg-red-500/70 transition-all duration-200 text-white cursor-pointer", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("a", { title: "Delete", onClick: () => onDelete == null ? void 0 : onDelete(item), children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(DeleteIcon, {}) }) })
|
|
37708
|
+
] })
|
|
37709
|
+
] })
|
|
37710
|
+
}
|
|
37711
|
+
),
|
|
37712
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
37713
|
+
"div",
|
|
37714
|
+
{
|
|
37715
|
+
className: "\r\n absolute bottom-0 right-0\r\n w-10 h-10\r\n bg-gray-200\r\n transition-all duration-200\r\n group-hover:w-14\r\n group-hover:h-14\r\n [clip-path:polygon(0_100%,100%_0,100%_100%)]\r\n "
|
|
37716
|
+
}
|
|
37717
|
+
)
|
|
37718
|
+
]
|
|
37719
|
+
}
|
|
37720
|
+
);
|
|
37626
37721
|
}
|
|
37627
37722
|
|
|
37628
37723
|
// src/table3/index.tsx
|
|
37629
|
-
var
|
|
37724
|
+
var import_react17 = __toESM(require("react"));
|
|
37630
37725
|
|
|
37631
37726
|
// src/table3/filter.tsx
|
|
37632
|
-
var
|
|
37727
|
+
var import_react13 = require("react");
|
|
37633
37728
|
|
|
37634
37729
|
// src/table3/filters.tsx
|
|
37635
37730
|
var import_jsx_runtime23 = require("react/jsx-runtime");
|
|
@@ -37739,14 +37834,14 @@ function Filter({
|
|
|
37739
37834
|
sort,
|
|
37740
37835
|
setSort
|
|
37741
37836
|
}) {
|
|
37742
|
-
const [visible, setVisible] = (0,
|
|
37743
|
-
const [text, setText] = (0,
|
|
37744
|
-
const items = (0,
|
|
37837
|
+
const [visible, setVisible] = (0, import_react13.useState)(false);
|
|
37838
|
+
const [text, setText] = (0, import_react13.useState)("");
|
|
37839
|
+
const items = (0, import_react13.useMemo)(
|
|
37745
37840
|
() => [...new Set(Object.values(objectData).map((o) => o[h]))],
|
|
37746
37841
|
[objectData]
|
|
37747
37842
|
);
|
|
37748
|
-
const [selected, setSelected] = (0,
|
|
37749
|
-
const itemsFiltered = (0,
|
|
37843
|
+
const [selected, setSelected] = (0, import_react13.useState)(items);
|
|
37844
|
+
const itemsFiltered = (0, import_react13.useMemo)(
|
|
37750
37845
|
() => items.sort((a, b) => `${a}`.localeCompare(b)).filter((item) => {
|
|
37751
37846
|
if (!text) return true;
|
|
37752
37847
|
return `${item}`.toLowerCase().includes(text.toLowerCase());
|
|
@@ -37783,7 +37878,7 @@ function Filter({
|
|
|
37783
37878
|
const hidden = Object.values(objectData).filter(
|
|
37784
37879
|
(d) => d._visible === false
|
|
37785
37880
|
);
|
|
37786
|
-
(0,
|
|
37881
|
+
(0, import_react13.useEffect)(() => {
|
|
37787
37882
|
if (data.length != Object.values(objectData).map((o) => (o == null ? void 0 : o._id) || (o == null ? void 0 : o.id)).length) {
|
|
37788
37883
|
const news = [...new Set(data.map((o) => o[h]))];
|
|
37789
37884
|
setSelected(news);
|
|
@@ -38034,10 +38129,10 @@ function TableHead({
|
|
|
38034
38129
|
}
|
|
38035
38130
|
|
|
38036
38131
|
// src/table3/body.tsx
|
|
38037
|
-
var
|
|
38132
|
+
var import_react15 = require("react");
|
|
38038
38133
|
|
|
38039
38134
|
// src/table3/tr.tsx
|
|
38040
|
-
var
|
|
38135
|
+
var import_react14 = __toESM(require("react"));
|
|
38041
38136
|
var import_jsx_runtime26 = require("react/jsx-runtime");
|
|
38042
38137
|
function TR({
|
|
38043
38138
|
handlers,
|
|
@@ -38099,7 +38194,7 @@ function TR({
|
|
|
38099
38194
|
return null;
|
|
38100
38195
|
} else if (handlers == null ? void 0 : handlers[h]) {
|
|
38101
38196
|
const original = handlers[h];
|
|
38102
|
-
const cloned =
|
|
38197
|
+
const cloned = import_react14.default.cloneElement(original, {
|
|
38103
38198
|
// si es controlado por value → actualiza con row[h]
|
|
38104
38199
|
value: ((_a = original.props) == null ? void 0 : _a.value) !== void 0 ? row[h] : void 0,
|
|
38105
38200
|
// si usa children → actualiza con row[h] también
|
|
@@ -38179,7 +38274,7 @@ function TableBody({
|
|
|
38179
38274
|
symbols,
|
|
38180
38275
|
sort
|
|
38181
38276
|
}) {
|
|
38182
|
-
const [selected, setSelected] = (0,
|
|
38277
|
+
const [selected, setSelected] = (0, import_react15.useState)(-1);
|
|
38183
38278
|
const sorted = Object.entries(objectData).sort(([, a], [, b]) => {
|
|
38184
38279
|
for (const [key, order] of Object.entries(
|
|
38185
38280
|
sort || { id: "desc", _id: "desc" }
|
|
@@ -38355,7 +38450,7 @@ function TableFooter({
|
|
|
38355
38450
|
}
|
|
38356
38451
|
|
|
38357
38452
|
// src/table3/dialog.tsx
|
|
38358
|
-
var
|
|
38453
|
+
var import_react16 = __toESM(require("react"));
|
|
38359
38454
|
var import_jsx_runtime30 = require("react/jsx-runtime");
|
|
38360
38455
|
function Dialog3({
|
|
38361
38456
|
modalRef,
|
|
@@ -38372,9 +38467,9 @@ function Dialog3({
|
|
|
38372
38467
|
var _a;
|
|
38373
38468
|
return (_a = modalRef.current) == null ? void 0 : _a.close();
|
|
38374
38469
|
};
|
|
38375
|
-
const clonedModal = (0,
|
|
38376
|
-
if (dialogRow &&
|
|
38377
|
-
return
|
|
38470
|
+
const clonedModal = (0, import_react16.useMemo)(() => {
|
|
38471
|
+
if (dialogRow && import_react16.default.isValidElement(children)) {
|
|
38472
|
+
return import_react16.default.cloneElement(children, {
|
|
38378
38473
|
key: JSON.stringify(dialogRow),
|
|
38379
38474
|
row: dialogRow,
|
|
38380
38475
|
show,
|
|
@@ -38428,8 +38523,8 @@ function Table3({
|
|
|
38428
38523
|
sortBy,
|
|
38429
38524
|
...props
|
|
38430
38525
|
}) {
|
|
38431
|
-
const [handlers, setHandlers] = (0,
|
|
38432
|
-
const [page, setPage] = (0,
|
|
38526
|
+
const [handlers, setHandlers] = (0, import_react17.useState)({});
|
|
38527
|
+
const [page, setPage] = (0, import_react17.useState)(1);
|
|
38433
38528
|
function dataReducer(a, b) {
|
|
38434
38529
|
if (b == null) return {};
|
|
38435
38530
|
if (Array.isArray(b)) {
|
|
@@ -38450,7 +38545,7 @@ function Table3({
|
|
|
38450
38545
|
};
|
|
38451
38546
|
const newHandlers = { ...handlers };
|
|
38452
38547
|
for (let item in cc) {
|
|
38453
|
-
const isReactComponent =
|
|
38548
|
+
const isReactComponent = import_react17.default.isValidElement(cc[item]);
|
|
38454
38549
|
if (isReactComponent) {
|
|
38455
38550
|
newHandlers[item] = cc[item];
|
|
38456
38551
|
const value = ((_c = (_b = cc[item]) == null ? void 0 : _b.props) == null ? void 0 : _c.value) || (typeof ((_e = (_d = cc[item]) == null ? void 0 : _d.props) == null ? void 0 : _e.children) !== "object" ? (_g = (_f = cc[item]) == null ? void 0 : _f.props) == null ? void 0 : _g.children : "");
|
|
@@ -38470,12 +38565,12 @@ function Table3({
|
|
|
38470
38565
|
return newA;
|
|
38471
38566
|
}
|
|
38472
38567
|
}
|
|
38473
|
-
const [objectData, setObjectData] = (0,
|
|
38474
|
-
(0,
|
|
38568
|
+
const [objectData, setObjectData] = (0, import_react17.useReducer)(dataReducer, null);
|
|
38569
|
+
(0, import_react17.useEffect)(() => {
|
|
38475
38570
|
setObjectData(data);
|
|
38476
38571
|
setPage(1);
|
|
38477
38572
|
}, [data]);
|
|
38478
|
-
const headers = (0,
|
|
38573
|
+
const headers = (0, import_react17.useMemo)(() => {
|
|
38479
38574
|
if (!objectData) return [];
|
|
38480
38575
|
return [
|
|
38481
38576
|
...new Set(
|
|
@@ -38483,13 +38578,13 @@ function Table3({
|
|
|
38483
38578
|
)
|
|
38484
38579
|
];
|
|
38485
38580
|
}, [objectData]);
|
|
38486
|
-
const totalPages = (0,
|
|
38581
|
+
const totalPages = (0, import_react17.useMemo)(() => {
|
|
38487
38582
|
if (!objectData) return 0;
|
|
38488
38583
|
return maxItems ? Math.ceil(Object.keys(objectData).length / maxItems) : 1;
|
|
38489
38584
|
}, [objectData, maxItems]);
|
|
38490
|
-
const [sort, setSort] = (0,
|
|
38491
|
-
const modalRef = (0,
|
|
38492
|
-
const [dialogRow, setDialogRow] = (0,
|
|
38585
|
+
const [sort, setSort] = (0, import_react17.useState)(sortBy);
|
|
38586
|
+
const modalRef = (0, import_react17.useRef)(null);
|
|
38587
|
+
const [dialogRow, setDialogRow] = (0, import_react17.useState)({});
|
|
38493
38588
|
const context = {
|
|
38494
38589
|
objectData,
|
|
38495
38590
|
headers,
|
|
@@ -38516,7 +38611,7 @@ function Table3({
|
|
|
38516
38611
|
setSort,
|
|
38517
38612
|
...props
|
|
38518
38613
|
};
|
|
38519
|
-
(0,
|
|
38614
|
+
(0, import_react17.useEffect)(() => {
|
|
38520
38615
|
if ((dialogRow == null ? void 0 : dialogRow.id) || (dialogRow == null ? void 0 : dialogRow._id)) {
|
|
38521
38616
|
const newDialogRow = objectData[dialogRow == null ? void 0 : dialogRow.id] || objectData[dialogRow == null ? void 0 : dialogRow._id];
|
|
38522
38617
|
setDialogRow(newDialogRow);
|
|
@@ -38546,13 +38641,13 @@ function Table3({
|
|
|
38546
38641
|
}
|
|
38547
38642
|
|
|
38548
38643
|
// src/table-advanced/index.tsx
|
|
38549
|
-
var
|
|
38644
|
+
var import_react22 = require("react");
|
|
38550
38645
|
|
|
38551
38646
|
// src/table-advanced/h.table.tsx
|
|
38552
|
-
var
|
|
38647
|
+
var import_react20 = __toESM(require("react"));
|
|
38553
38648
|
|
|
38554
38649
|
// src/table-advanced/header.tsx
|
|
38555
|
-
var
|
|
38650
|
+
var import_react18 = require("react");
|
|
38556
38651
|
var import_react_dom = require("react-dom");
|
|
38557
38652
|
|
|
38558
38653
|
// src/table-advanced/icons.tsx
|
|
@@ -38611,7 +38706,7 @@ function NextIcon() {
|
|
|
38611
38706
|
height: "1em",
|
|
38612
38707
|
width: "1em",
|
|
38613
38708
|
xmlns: "http://www.w3.org/2000/svg",
|
|
38614
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("polyline", { fill: "none",
|
|
38709
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("polyline", { fill: "none", strokeWidth: "2", points: "7 2 17 12 7 22" })
|
|
38615
38710
|
}
|
|
38616
38711
|
);
|
|
38617
38712
|
}
|
|
@@ -38806,32 +38901,32 @@ function Header({
|
|
|
38806
38901
|
index,
|
|
38807
38902
|
length
|
|
38808
38903
|
}) {
|
|
38809
|
-
const [visible, setVisible] = (0,
|
|
38810
|
-
const [hovered, setHovered] = (0,
|
|
38904
|
+
const [visible, setVisible] = (0, import_react18.useState)(false);
|
|
38905
|
+
const [hovered, setHovered] = (0, import_react18.useState)(false);
|
|
38811
38906
|
const sortIndex = context.sort.findIndex((b) => b.field == header);
|
|
38812
|
-
const [text, setText] = (0,
|
|
38813
|
-
const cellRef = (0,
|
|
38814
|
-
const [coords, setCoords] = (0,
|
|
38907
|
+
const [text, setText] = (0, import_react18.useState)("");
|
|
38908
|
+
const cellRef = (0, import_react18.useRef)(null);
|
|
38909
|
+
const [coords, setCoords] = (0, import_react18.useState)(
|
|
38815
38910
|
null
|
|
38816
38911
|
);
|
|
38817
|
-
const filteredValues = (0,
|
|
38912
|
+
const filteredValues = (0, import_react18.useMemo)(() => {
|
|
38818
38913
|
return [...new Set(context.data.map((d) => d[header]))].filter((d) => {
|
|
38819
38914
|
if (text == "") return true;
|
|
38820
38915
|
return `${d}`.toLowerCase().includes(text.toLowerCase());
|
|
38821
38916
|
});
|
|
38822
38917
|
}, [context.data, header, text]);
|
|
38823
|
-
const [selected, setSelected] = (0,
|
|
38918
|
+
const [selected, setSelected] = (0, import_react18.useState)([]);
|
|
38824
38919
|
const hasFilter = context.filters.find((b) => b.field == header);
|
|
38825
|
-
(0,
|
|
38920
|
+
(0, import_react18.useEffect)(() => {
|
|
38826
38921
|
setSelected(filteredValues);
|
|
38827
38922
|
}, [filteredValues]);
|
|
38828
|
-
(0,
|
|
38923
|
+
(0, import_react18.useEffect)(() => {
|
|
38829
38924
|
if (visible) {
|
|
38830
38925
|
context.setCurrentHeader(header);
|
|
38831
38926
|
}
|
|
38832
38927
|
setText("");
|
|
38833
38928
|
}, [visible]);
|
|
38834
|
-
(0,
|
|
38929
|
+
(0, import_react18.useEffect)(() => {
|
|
38835
38930
|
if (!visible || !cellRef.current) {
|
|
38836
38931
|
setCoords(null);
|
|
38837
38932
|
return;
|
|
@@ -39170,39 +39265,39 @@ function valueFormatter({
|
|
|
39170
39265
|
}
|
|
39171
39266
|
|
|
39172
39267
|
// src/table-advanced/use.pagination.tsx
|
|
39173
|
-
var
|
|
39268
|
+
var import_react19 = require("react");
|
|
39174
39269
|
function usePaginacion({
|
|
39175
39270
|
total,
|
|
39176
39271
|
tamanioPagina = 100,
|
|
39177
39272
|
paginaInicial = 1
|
|
39178
39273
|
}) {
|
|
39179
|
-
const [totalPaginas, setTotalPaginas] = (0,
|
|
39274
|
+
const [totalPaginas, setTotalPaginas] = (0, import_react19.useState)(
|
|
39180
39275
|
Math.max(1, Math.ceil(total / tamanioPagina))
|
|
39181
39276
|
);
|
|
39182
|
-
const [pagina, setPagina] = (0,
|
|
39277
|
+
const [pagina, setPagina] = (0, import_react19.useState)(
|
|
39183
39278
|
Math.min(Math.max(paginaInicial, 1), totalPaginas)
|
|
39184
39279
|
);
|
|
39185
39280
|
const inicio = total === 0 ? 0 : (pagina - 1) * tamanioPagina + 1;
|
|
39186
39281
|
const fin = Math.min(pagina * tamanioPagina, total);
|
|
39187
|
-
const rango = (0,
|
|
39282
|
+
const rango = (0, import_react19.useMemo)(() => {
|
|
39188
39283
|
if (total === 0) return "0 a 0";
|
|
39189
39284
|
return `${inicio} a ${fin}`;
|
|
39190
39285
|
}, [inicio, fin, total]);
|
|
39191
39286
|
const hasNext = pagina < totalPaginas;
|
|
39192
39287
|
const hasPrev = pagina > 1;
|
|
39193
|
-
const next = (0,
|
|
39288
|
+
const next = (0, import_react19.useCallback)(() => {
|
|
39194
39289
|
setPagina((p) => Math.min(p + 1, totalPaginas));
|
|
39195
39290
|
}, [totalPaginas]);
|
|
39196
|
-
const prev = (0,
|
|
39291
|
+
const prev = (0, import_react19.useCallback)(() => {
|
|
39197
39292
|
setPagina((p) => Math.max(p - 1, 1));
|
|
39198
39293
|
}, []);
|
|
39199
|
-
const irAPagina = (0,
|
|
39294
|
+
const irAPagina = (0, import_react19.useCallback)(
|
|
39200
39295
|
(n) => {
|
|
39201
39296
|
setPagina(Math.min(Math.max(n, 1), totalPaginas));
|
|
39202
39297
|
},
|
|
39203
39298
|
[totalPaginas]
|
|
39204
39299
|
);
|
|
39205
|
-
(0,
|
|
39300
|
+
(0, import_react19.useEffect)(() => {
|
|
39206
39301
|
setTotalPaginas(Math.max(1, Math.ceil(total / tamanioPagina)));
|
|
39207
39302
|
setPagina(1);
|
|
39208
39303
|
}, [total]);
|
|
@@ -39227,11 +39322,11 @@ var import_jsx_runtime36 = require("react/jsx-runtime");
|
|
|
39227
39322
|
function HTable({
|
|
39228
39323
|
context
|
|
39229
39324
|
}) {
|
|
39230
|
-
const [isLoading, setIsloading] = (0,
|
|
39325
|
+
const [isLoading, setIsloading] = (0, import_react20.useState)(false);
|
|
39231
39326
|
const { cols, headers } = context;
|
|
39232
|
-
const [currentIndex, setCurrentIndex] = (0,
|
|
39233
|
-
const tableRef = (0,
|
|
39234
|
-
const modalRef = (0,
|
|
39327
|
+
const [currentIndex, setCurrentIndex] = (0, import_react20.useState)(-1);
|
|
39328
|
+
const tableRef = (0, import_react20.useRef)(null);
|
|
39329
|
+
const modalRef = (0, import_react20.useRef)(null);
|
|
39235
39330
|
const catDensities = { confortable: 80, compact: 30, standard: 53 };
|
|
39236
39331
|
const padding = (context == null ? void 0 : context.rowHeight) || (context == null ? void 0 : context.density) ? catDensities[context == null ? void 0 : context.density] : 53;
|
|
39237
39332
|
function useResizableColumns(headers2, defaultWidth = 160, minWidth = 60) {
|
|
@@ -39244,8 +39339,8 @@ function HTable({
|
|
|
39244
39339
|
function resize(headers3) {
|
|
39245
39340
|
return Object.fromEntries(headers3.map((h) => [h, getWidth(h)]));
|
|
39246
39341
|
}
|
|
39247
|
-
const [widths2, setWidths2] = (0,
|
|
39248
|
-
const startDrag2 = (0,
|
|
39342
|
+
const [widths2, setWidths2] = (0, import_react20.useState)({});
|
|
39343
|
+
const startDrag2 = (0, import_react20.useCallback)(
|
|
39249
39344
|
(e, headerKey) => {
|
|
39250
39345
|
var _a;
|
|
39251
39346
|
e.preventDefault();
|
|
@@ -39280,7 +39375,7 @@ function HTable({
|
|
|
39280
39375
|
return { widths: widths2, gridTemplateColumns: gridTemplateColumns2, startDrag: startDrag2, setWidths: setWidths2 };
|
|
39281
39376
|
}
|
|
39282
39377
|
const { gridTemplateColumns, startDrag, widths, setWidths } = useResizableColumns(headers);
|
|
39283
|
-
(0,
|
|
39378
|
+
(0, import_react20.useEffect)(() => {
|
|
39284
39379
|
if (!tableRef.current) return;
|
|
39285
39380
|
const observer = new ResizeObserver(([entry]) => {
|
|
39286
39381
|
const ocultos = headers.filter(
|
|
@@ -39311,7 +39406,7 @@ function HTable({
|
|
|
39311
39406
|
observer.observe(tableRef.current);
|
|
39312
39407
|
return () => observer.disconnect();
|
|
39313
39408
|
}, [headers.length]);
|
|
39314
|
-
const searchedData = (0,
|
|
39409
|
+
const searchedData = (0, import_react20.useMemo)(() => {
|
|
39315
39410
|
return context.filteredData.filter((row) => {
|
|
39316
39411
|
if (context.searchBy === "") return true;
|
|
39317
39412
|
return Object.values(row).some(
|
|
@@ -39531,7 +39626,7 @@ function HTable({
|
|
|
39531
39626
|
context.setEditions(newEditions);
|
|
39532
39627
|
}
|
|
39533
39628
|
}
|
|
39534
|
-
) : ((_c = context.buttons) == null ? void 0 : _c[key]) ?
|
|
39629
|
+
) : ((_c = context.buttons) == null ? void 0 : _c[key]) ? import_react20.default.cloneElement(context.buttons[key], {
|
|
39535
39630
|
// children: context.buttons[key]?.props?.children
|
|
39536
39631
|
// ? item
|
|
39537
39632
|
// : undefined,
|
|
@@ -39575,7 +39670,7 @@ function HTable({
|
|
|
39575
39670
|
}) : ["number", "string"].includes(typeof item) ? valueFormatter({
|
|
39576
39671
|
value: item,
|
|
39577
39672
|
currentCoin: context.currentCoin
|
|
39578
|
-
}) :
|
|
39673
|
+
}) : import_react20.default.isValidElement(item) ? item : JSON.stringify(item)
|
|
39579
39674
|
},
|
|
39580
39675
|
row.id + i
|
|
39581
39676
|
);
|
|
@@ -39710,7 +39805,7 @@ function ModalContent({
|
|
|
39710
39805
|
}
|
|
39711
39806
|
)
|
|
39712
39807
|
] }),
|
|
39713
|
-
|
|
39808
|
+
import_react20.default.cloneElement(context.modal, {
|
|
39714
39809
|
row: searchedData[currentIndex],
|
|
39715
39810
|
hide
|
|
39716
39811
|
})
|
|
@@ -39718,7 +39813,7 @@ function ModalContent({
|
|
|
39718
39813
|
}
|
|
39719
39814
|
|
|
39720
39815
|
// src/table-advanced/context.ts
|
|
39721
|
-
var
|
|
39816
|
+
var import_react21 = require("react");
|
|
39722
39817
|
|
|
39723
39818
|
// src/table-advanced/filter.reducer.ts
|
|
39724
39819
|
var filterReducer = (acc, b) => {
|
|
@@ -39746,19 +39841,19 @@ var sortReducer = (acc, b) => {
|
|
|
39746
39841
|
// src/table-advanced/context.ts
|
|
39747
39842
|
function useContext({ onSelect }) {
|
|
39748
39843
|
const excel = useExcel();
|
|
39749
|
-
const [editions, setEditions] = (0,
|
|
39750
|
-
const [selected, setSelected] = (0,
|
|
39751
|
-
const [data, setData] = (0,
|
|
39844
|
+
const [editions, setEditions] = (0, import_react21.useState)([]);
|
|
39845
|
+
const [selected, setSelected] = (0, import_react21.useState)([]);
|
|
39846
|
+
const [data, setData] = (0, import_react21.useState)([]);
|
|
39752
39847
|
const headers = [...new Set(data.map((b) => Object.keys(b)).flat())];
|
|
39753
|
-
const [currentHeader, setCurrentHeader] = (0,
|
|
39848
|
+
const [currentHeader, setCurrentHeader] = (0, import_react21.useState)(null);
|
|
39754
39849
|
const cols = headers.length;
|
|
39755
|
-
const [filters, setFilters] = (0,
|
|
39850
|
+
const [filters, setFilters] = (0, import_react21.useReducer)(
|
|
39756
39851
|
filterReducer,
|
|
39757
39852
|
new Array()
|
|
39758
39853
|
);
|
|
39759
|
-
const [searchBy, setSearchBy] = (0,
|
|
39760
|
-
const [sort, setSort] = (0,
|
|
39761
|
-
const sortedData = (0,
|
|
39854
|
+
const [searchBy, setSearchBy] = (0, import_react21.useState)("");
|
|
39855
|
+
const [sort, setSort] = (0, import_react21.useReducer)(sortReducer, new Array());
|
|
39856
|
+
const sortedData = (0, import_react21.useMemo)(() => {
|
|
39762
39857
|
return [...data].sort((a, b) => {
|
|
39763
39858
|
for (const { field, type } of sort.reverse()) {
|
|
39764
39859
|
const av = a[field];
|
|
@@ -39788,7 +39883,7 @@ function useContext({ onSelect }) {
|
|
|
39788
39883
|
}
|
|
39789
39884
|
return true;
|
|
39790
39885
|
});
|
|
39791
|
-
(0,
|
|
39886
|
+
(0, import_react21.useEffect)(() => {
|
|
39792
39887
|
if (filters.length == 0) {
|
|
39793
39888
|
setEditions([]);
|
|
39794
39889
|
}
|
|
@@ -39821,7 +39916,7 @@ var import_jsx_runtime37 = require("react/jsx-runtime");
|
|
|
39821
39916
|
function TableAdvanced(tableProps) {
|
|
39822
39917
|
const { data, ...props } = tableProps;
|
|
39823
39918
|
const context = useContext({ onSelect: Boolean(tableProps.onSelect) });
|
|
39824
|
-
(0,
|
|
39919
|
+
(0, import_react22.useEffect)(() => {
|
|
39825
39920
|
context.setData(
|
|
39826
39921
|
Array.isArray(data) ? data.map((d) => {
|
|
39827
39922
|
return {
|
|
@@ -39832,7 +39927,7 @@ function TableAdvanced(tableProps) {
|
|
|
39832
39927
|
}) : data
|
|
39833
39928
|
);
|
|
39834
39929
|
}, [data]);
|
|
39835
|
-
(0,
|
|
39930
|
+
(0, import_react22.useEffect)(() => {
|
|
39836
39931
|
if (tableProps == null ? void 0 : tableProps.sortBy) {
|
|
39837
39932
|
const [k, v] = Object.entries(tableProps.sortBy)[0];
|
|
39838
39933
|
context.setSort({ [k]: v });
|
|
@@ -39851,15 +39946,15 @@ function TableAdvanced(tableProps) {
|
|
|
39851
39946
|
}
|
|
39852
39947
|
|
|
39853
39948
|
// src/tabs/index.tsx
|
|
39854
|
-
var
|
|
39949
|
+
var import_react23 = __toESM(require("react"));
|
|
39855
39950
|
var import_jsx_runtime38 = require("react/jsx-runtime");
|
|
39856
39951
|
function TabContainer({
|
|
39857
39952
|
children,
|
|
39858
39953
|
labelMaxWidth,
|
|
39859
39954
|
currentIndex = 0
|
|
39860
39955
|
}) {
|
|
39861
|
-
const [index, setIndex] = (0,
|
|
39862
|
-
const items =
|
|
39956
|
+
const [index, setIndex] = (0, import_react23.useState)(0);
|
|
39957
|
+
const items = import_react23.default.Children.toArray(
|
|
39863
39958
|
children
|
|
39864
39959
|
);
|
|
39865
39960
|
const labels = items.map((c) => c.props.label);
|
|
@@ -39868,7 +39963,7 @@ function TabContainer({
|
|
|
39868
39963
|
if (e.key === "ArrowLeft")
|
|
39869
39964
|
setIndex((k - 1 + labels.length) % labels.length);
|
|
39870
39965
|
};
|
|
39871
|
-
(0,
|
|
39966
|
+
(0, import_react23.useEffect)(() => {
|
|
39872
39967
|
setIndex(currentIndex);
|
|
39873
39968
|
}, [currentIndex]);
|
|
39874
39969
|
return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "w-full bg-white border shadow rounded-lg ", children: [
|