next-recomponents 1.3.5 → 1.3.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/dist/index.d.mts +11 -5
- package/dist/index.d.ts +11 -5
- package/dist/index.js +292 -278
- package/dist/index.mjs +284 -270
- package/package.json +1 -1
- package/src/table/filter.menu.tsx +5 -8
- package/src/table/filters.tsx +16 -0
- package/src/table/h.tsx +72 -29
- package/src/table/index.tsx +9 -40
- package/src/table/td.tsx +48 -57
package/dist/index.js
CHANGED
|
@@ -11120,9 +11120,6 @@ var regularExpresions = {
|
|
|
11120
11120
|
};
|
|
11121
11121
|
var regular_expresions_default = regularExpresions;
|
|
11122
11122
|
|
|
11123
|
-
// src/table/index.tsx
|
|
11124
|
-
var import_react26 = require("react");
|
|
11125
|
-
|
|
11126
11123
|
// src/table/h.tsx
|
|
11127
11124
|
var import_react25 = __toESM(require("react"));
|
|
11128
11125
|
|
|
@@ -11136,7 +11133,6 @@ function TD(_a) {
|
|
|
11136
11133
|
index,
|
|
11137
11134
|
color: color2,
|
|
11138
11135
|
symbols,
|
|
11139
|
-
handlers,
|
|
11140
11136
|
mapedData,
|
|
11141
11137
|
setMapedData
|
|
11142
11138
|
} = _b, props = __objRest(_b, [
|
|
@@ -11145,11 +11141,10 @@ function TD(_a) {
|
|
|
11145
11141
|
"index",
|
|
11146
11142
|
"color",
|
|
11147
11143
|
"symbols",
|
|
11148
|
-
"handlers",
|
|
11149
11144
|
"mapedData",
|
|
11150
11145
|
"setMapedData"
|
|
11151
11146
|
]);
|
|
11152
|
-
var _a2, _b2
|
|
11147
|
+
var _a2, _b2;
|
|
11153
11148
|
const [isHidded, setIsHidded] = (0, import_react23.useState)(false);
|
|
11154
11149
|
const newProps = symbols && import_react23.default.isValidElement(symbols[item == null ? void 0 : item.name]) && ((_b2 = Object.keys((_a2 = symbols[item == null ? void 0 : item.name]) == null ? void 0 : _a2.props)) == null ? void 0 : _b2.reduce(
|
|
11155
11150
|
(acc, i) => {
|
|
@@ -11169,59 +11164,52 @@ function TD(_a) {
|
|
|
11169
11164
|
},
|
|
11170
11165
|
{ defaultValue: item == null ? void 0 : item.content }
|
|
11171
11166
|
));
|
|
11172
|
-
const newProps2 = handlers && import_react23.default.isValidElement(handlers[item == null ? void 0 : item.name]) && ((_d = Object.keys((_c = handlers[item == null ? void 0 : item.name]) == null ? void 0 : _c.props)) == null ? void 0 : _d.reduce(
|
|
11173
|
-
(acc, i) => {
|
|
11174
|
-
try {
|
|
11175
|
-
const newAcc = __spreadValues({}, acc);
|
|
11176
|
-
const hasEvent = `${i}`.startsWith("on");
|
|
11177
|
-
if (hasEvent) {
|
|
11178
|
-
newAcc[i] = (e) => {
|
|
11179
|
-
var _a3, _b3;
|
|
11180
|
-
e.item = item;
|
|
11181
|
-
(_b3 = (_a3 = handlers[item == null ? void 0 : item.name].props)[i]) == null ? void 0 : _b3.call(_a3, e);
|
|
11182
|
-
if (i == "onChange") {
|
|
11183
|
-
const newData = [...mapedData];
|
|
11184
|
-
newData[index][item == null ? void 0 : item.name].content = e.target.value;
|
|
11185
|
-
setMapedData == null ? void 0 : setMapedData(newData);
|
|
11186
|
-
}
|
|
11187
|
-
};
|
|
11188
|
-
}
|
|
11189
|
-
return newAcc;
|
|
11190
|
-
} catch (error) {
|
|
11191
|
-
}
|
|
11192
|
-
},
|
|
11193
|
-
{ value: item == null ? void 0 : item.content }
|
|
11194
|
-
));
|
|
11195
11167
|
return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
11196
11168
|
"td",
|
|
11197
11169
|
{
|
|
11198
11170
|
onDoubleClick: (e) => setIsHidded(!isHidded),
|
|
11199
|
-
title: item == null ? void 0 : item.title,
|
|
11200
11171
|
className: [
|
|
11201
11172
|
isHidded && color2,
|
|
11202
11173
|
!isHidded && "whitespace-nowrap overflow-hidden text-ellipsis ",
|
|
11203
|
-
"border-b max-w-[200px] p-5 "
|
|
11204
|
-
["number", "money"].includes(item
|
|
11174
|
+
"border-b max-w-[200px] p-5 "
|
|
11175
|
+
// ["number", "money"].includes(item?.cellTypeOf) && "text-right",
|
|
11205
11176
|
].join(" "),
|
|
11206
|
-
children:
|
|
11207
|
-
|
|
11208
|
-
|
|
11209
|
-
|
|
11210
|
-
|
|
11211
|
-
|
|
11212
|
-
|
|
11213
|
-
|
|
11214
|
-
|
|
11215
|
-
|
|
11216
|
-
|
|
11217
|
-
|
|
11177
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: symbols && symbols[item == null ? void 0 : item.name] && "flex justify-between", children: [
|
|
11178
|
+
symbols && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { children: import_react23.default.Children.map(symbols[item == null ? void 0 : item.name], (child) => {
|
|
11179
|
+
if (import_react23.default.isValidElement(child)) {
|
|
11180
|
+
return import_react23.default.cloneElement(child, __spreadValues({}, newProps));
|
|
11181
|
+
}
|
|
11182
|
+
return child;
|
|
11183
|
+
}) }),
|
|
11184
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { children: (item == null ? void 0 : item.handler) ? import_react23.default.Children.map(item.handler, (handler) => {
|
|
11185
|
+
if (import_react23.default.isValidElement(handler)) {
|
|
11186
|
+
return import_react23.default.cloneElement(handler, {
|
|
11187
|
+
value: mapedData[index][item.name].content,
|
|
11188
|
+
onChange: (e) => {
|
|
11189
|
+
var _a3, _b3;
|
|
11190
|
+
const nmd = [...mapedData];
|
|
11191
|
+
nmd[index][item.name].content = e.target.value;
|
|
11192
|
+
e.item = Object.assign(
|
|
11193
|
+
{},
|
|
11194
|
+
...nmd.map(
|
|
11195
|
+
(d) => Object.keys(d).map((k) => ({ [k]: d[k].content }))
|
|
11196
|
+
)[index]
|
|
11197
|
+
);
|
|
11198
|
+
e.setData = (data) => {
|
|
11199
|
+
const nmd2 = [...mapedData];
|
|
11200
|
+
for (let datum in data) {
|
|
11201
|
+
nmd2[index][datum].content = data[datum];
|
|
11202
|
+
}
|
|
11203
|
+
setMapedData == null ? void 0 : setMapedData(nmd2);
|
|
11204
|
+
};
|
|
11205
|
+
setMapedData == null ? void 0 : setMapedData(nmd);
|
|
11206
|
+
(_b3 = (_a3 = handler == null ? void 0 : handler.props) == null ? void 0 : _a3.onChange) == null ? void 0 : _b3.call(_a3, e);
|
|
11218
11207
|
}
|
|
11219
|
-
|
|
11220
|
-
|
|
11221
|
-
|
|
11222
|
-
|
|
11223
|
-
|
|
11224
|
-
)
|
|
11208
|
+
});
|
|
11209
|
+
}
|
|
11210
|
+
return handler;
|
|
11211
|
+
}) : item.content })
|
|
11212
|
+
] })
|
|
11225
11213
|
}
|
|
11226
11214
|
);
|
|
11227
11215
|
}
|
|
@@ -11243,6 +11231,24 @@ function FilterOffIcon() {
|
|
|
11243
11231
|
}
|
|
11244
11232
|
);
|
|
11245
11233
|
}
|
|
11234
|
+
function SaveIcon() {
|
|
11235
|
+
return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
|
|
11236
|
+
"svg",
|
|
11237
|
+
{
|
|
11238
|
+
stroke: "currentColor",
|
|
11239
|
+
fill: "currentColor",
|
|
11240
|
+
strokeWidth: "0",
|
|
11241
|
+
viewBox: "0 0 512 512",
|
|
11242
|
+
height: "20px",
|
|
11243
|
+
width: "20px",
|
|
11244
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
11245
|
+
children: [
|
|
11246
|
+
/* @__PURE__ */ (0, import_jsx_runtime10.jsx)("path", { d: "M272 64h-16c-4.4 0-8 3.6-8 8v72c0 4.4 7.6 8 12 8h12c4.4 0 8-3.6 8-8V72c0-4.4-3.6-8-8-8z" }),
|
|
11247
|
+
/* @__PURE__ */ (0, import_jsx_runtime10.jsx)("path", { d: "M433.9 130.1L382 78.2c-9-9-21.3-14.2-34.1-14.2h-28c-8.8 0-16 7.3-16 16.2v80c0 8.8-7.2 16-16 16H160c-8.8 0-16-7.2-16-16v-80c0-8.8-7.2-16.2-16-16.2H96c-17.6 0-32 14.4-32 32v320c0 17.6 14.4 32 32 32h320c17.6 0 32-14.4 32-32V164c0-12.7-5.1-24.9-14.1-33.9zM322 400.1c0 8.8-8 16-17.8 16H143.8c-9.8 0-17.8-7.2-17.8-16v-96c0-8.8 8-16 17.8-16h160.4c9.8 0 17.8 7.2 17.8 16v96z" })
|
|
11248
|
+
]
|
|
11249
|
+
}
|
|
11250
|
+
);
|
|
11251
|
+
}
|
|
11246
11252
|
function ExcelIcon() {
|
|
11247
11253
|
return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
|
|
11248
11254
|
"svg",
|
|
@@ -11274,11 +11280,7 @@ function FilterMenu({
|
|
|
11274
11280
|
const [newMapedData, setNewMapedData] = (0, import_react24.useState)([]);
|
|
11275
11281
|
(0, import_react24.useEffect)(() => {
|
|
11276
11282
|
setNewMapedData(
|
|
11277
|
-
[
|
|
11278
|
-
...new Set(
|
|
11279
|
-
mapedData.filter((md) => md.__visible__ === true).map((md) => md[h])
|
|
11280
|
-
)
|
|
11281
|
-
].filter((item) => {
|
|
11283
|
+
[...new Set(mapedData.map((md) => md[h]))].filter((item) => {
|
|
11282
11284
|
return item && `${item}`.toLowerCase().includes(text.toLowerCase());
|
|
11283
11285
|
})
|
|
11284
11286
|
);
|
|
@@ -11341,10 +11343,11 @@ function FilterMenu({
|
|
|
11341
11343
|
checked: mapedData.map((d) => d[h].exclude).every((d) => d === false),
|
|
11342
11344
|
onChange: (e) => {
|
|
11343
11345
|
const nmd = [...mapedData];
|
|
11346
|
+
const all = nmd.map((d) => d[h].exclude).every((d) => d === false);
|
|
11344
11347
|
setMapedData(
|
|
11345
11348
|
nmd.map((d) => {
|
|
11346
11349
|
const newd = __spreadValues({}, d);
|
|
11347
|
-
newd[h].exclude =
|
|
11350
|
+
newd[h].exclude = all;
|
|
11348
11351
|
return newd;
|
|
11349
11352
|
})
|
|
11350
11353
|
);
|
|
@@ -11424,167 +11427,6 @@ function FilterMenu({
|
|
|
11424
11427
|
] });
|
|
11425
11428
|
}
|
|
11426
11429
|
|
|
11427
|
-
// src/table/h.tsx
|
|
11428
|
-
var import_jsx_runtime12 = require("react/jsx-runtime");
|
|
11429
|
-
function HTable(_a) {
|
|
11430
|
-
var _b = _a, {
|
|
11431
|
-
data,
|
|
11432
|
-
mapedData,
|
|
11433
|
-
setMapedData,
|
|
11434
|
-
symbols,
|
|
11435
|
-
totals,
|
|
11436
|
-
exportName
|
|
11437
|
-
} = _b, props = __objRest(_b, [
|
|
11438
|
-
"data",
|
|
11439
|
-
"mapedData",
|
|
11440
|
-
"setMapedData",
|
|
11441
|
-
"symbols",
|
|
11442
|
-
"totals",
|
|
11443
|
-
"exportName"
|
|
11444
|
-
]);
|
|
11445
|
-
const [selected, setSelected] = (0, import_react25.useState)(null);
|
|
11446
|
-
const [selectedFilter, setSelectedFilter] = (0, import_react25.useState)(null);
|
|
11447
|
-
const modalRef = (0, import_react25.useRef)(null);
|
|
11448
|
-
const head = (0, import_react25.useMemo)(() => {
|
|
11449
|
-
return [...new Set(data.map((d) => Object.keys(d)).flat())];
|
|
11450
|
-
}, [data]);
|
|
11451
|
-
const mapedTotals = (0, import_react25.useMemo)(() => {
|
|
11452
|
-
return mapedData == null ? void 0 : mapedData.reduce((acc, md) => {
|
|
11453
|
-
head.forEach((h) => {
|
|
11454
|
-
var _a2, _b2;
|
|
11455
|
-
const value = isNaN(+((_a2 = md[h]) == null ? void 0 : _a2.content)) ? 0 : +((_b2 = md[h]) == null ? void 0 : _b2.content);
|
|
11456
|
-
if (acc[h]) {
|
|
11457
|
-
acc[h] += value;
|
|
11458
|
-
} else {
|
|
11459
|
-
acc[h] = value;
|
|
11460
|
-
}
|
|
11461
|
-
});
|
|
11462
|
-
return acc;
|
|
11463
|
-
}, {});
|
|
11464
|
-
}, [mapedData]);
|
|
11465
|
-
(0, import_react25.useEffect)(() => {
|
|
11466
|
-
const newData = data.map((d, trkey) => {
|
|
11467
|
-
const obj = { __visible__: true };
|
|
11468
|
-
for (let key in d) {
|
|
11469
|
-
const typeOf = typeof d[key];
|
|
11470
|
-
const isObject2 = typeOf == "object";
|
|
11471
|
-
const isDate = typeOf == "string" && d[key].includes("T");
|
|
11472
|
-
const cellTypeOf = isDate ? "date" : isObject2 ? "object" : typeOf;
|
|
11473
|
-
const content = cellTypeOf == "date" ? d[key].split("T").join(" ").split(".")[0] : cellTypeOf == "object" ? import_react25.default.isValidElement(d[key]) ? d[key] : JSON.stringify(d[key]) : d[key];
|
|
11474
|
-
obj[key] = {
|
|
11475
|
-
index: trkey,
|
|
11476
|
-
originalData: content,
|
|
11477
|
-
cellTypeOf,
|
|
11478
|
-
title: content,
|
|
11479
|
-
content,
|
|
11480
|
-
name: key,
|
|
11481
|
-
exclude: false
|
|
11482
|
-
};
|
|
11483
|
-
}
|
|
11484
|
-
return obj;
|
|
11485
|
-
});
|
|
11486
|
-
setMapedData(newData);
|
|
11487
|
-
}, [data]);
|
|
11488
|
-
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_jsx_runtime12.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("table", __spreadProps(__spreadValues({}, props), { className: "w-full border-collapse table-auto", children: [
|
|
11489
|
-
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)("thead", { className: "bg-gray-800 text-white", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("tr", { children: head.map((h, key) => {
|
|
11490
|
-
var _a2;
|
|
11491
|
-
return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
|
|
11492
|
-
"th",
|
|
11493
|
-
{
|
|
11494
|
-
className: "whitespace-nowrap overflow-hidden text-ellipsis max-w-[200px] border-b p-5",
|
|
11495
|
-
children: [
|
|
11496
|
-
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
11497
|
-
"div",
|
|
11498
|
-
{
|
|
11499
|
-
className: "cursor-pointer flex ",
|
|
11500
|
-
onClick: (e) => {
|
|
11501
|
-
setSelectedFilter(key == selectedFilter ? null : key);
|
|
11502
|
-
},
|
|
11503
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "text-white w-full bg-black rounded p-1 flex justify-center", children: [
|
|
11504
|
-
h,
|
|
11505
|
-
" ",
|
|
11506
|
-
!((_a2 = mapedData == null ? void 0 : mapedData.map((d) => {
|
|
11507
|
-
var _a3;
|
|
11508
|
-
return (_a3 = d[h]) == null ? void 0 : _a3.exclude;
|
|
11509
|
-
})) == null ? void 0 : _a2.every((d) => d === false)) && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "text-red-300", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(FilterOffIcon, {}) })
|
|
11510
|
-
] })
|
|
11511
|
-
}
|
|
11512
|
-
),
|
|
11513
|
-
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
11514
|
-
FilterMenu,
|
|
11515
|
-
{
|
|
11516
|
-
h,
|
|
11517
|
-
mapedData,
|
|
11518
|
-
setMapedData,
|
|
11519
|
-
index: key,
|
|
11520
|
-
selectedFilter,
|
|
11521
|
-
setSelectedFilter
|
|
11522
|
-
}
|
|
11523
|
-
)
|
|
11524
|
-
]
|
|
11525
|
-
},
|
|
11526
|
-
h
|
|
11527
|
-
);
|
|
11528
|
-
}) }) }),
|
|
11529
|
-
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)("tbody", { className: "divide-y divide-gray-200", children: mapedData.map((md, trKey) => {
|
|
11530
|
-
var _a2;
|
|
11531
|
-
const color2 = trKey % 2 == 0 ? "bg-white" : "bg-gray-100";
|
|
11532
|
-
for (let d in md) {
|
|
11533
|
-
if (md[d].exclude === true) {
|
|
11534
|
-
return null;
|
|
11535
|
-
}
|
|
11536
|
-
}
|
|
11537
|
-
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
11538
|
-
"tr",
|
|
11539
|
-
{
|
|
11540
|
-
onDoubleClick: (e) => {
|
|
11541
|
-
var _a3;
|
|
11542
|
-
(_a3 = modalRef.current) == null ? void 0 : _a3.showModal();
|
|
11543
|
-
},
|
|
11544
|
-
onClick: (e) => setSelected(trKey),
|
|
11545
|
-
className: [
|
|
11546
|
-
"hover:bg-green-100 ",
|
|
11547
|
-
color2,
|
|
11548
|
-
selected == trKey && "bg-green-200 hover:bg-green-300"
|
|
11549
|
-
].join(" "),
|
|
11550
|
-
children: head.map((h, tdKey) => {
|
|
11551
|
-
var _a3;
|
|
11552
|
-
const item = md[h];
|
|
11553
|
-
const id3 = trKey + "-" + (((_a3 = md == null ? void 0 : md.id) == null ? void 0 : _a3.content) || tdKey) + "-" + h;
|
|
11554
|
-
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
11555
|
-
TD,
|
|
11556
|
-
{
|
|
11557
|
-
index: trKey,
|
|
11558
|
-
symbols,
|
|
11559
|
-
handlers: props.handlers,
|
|
11560
|
-
item,
|
|
11561
|
-
color: color2,
|
|
11562
|
-
mapedData,
|
|
11563
|
-
setMapedData
|
|
11564
|
-
},
|
|
11565
|
-
id3
|
|
11566
|
-
);
|
|
11567
|
-
})
|
|
11568
|
-
},
|
|
11569
|
-
((_a2 = md == null ? void 0 : md.id) == null ? void 0 : _a2.content) || trKey
|
|
11570
|
-
);
|
|
11571
|
-
}) }),
|
|
11572
|
-
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)("tfoot", { className: "bg-gray-800 text-white", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("tr", { children: head.map((h, fkey) => {
|
|
11573
|
-
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
11574
|
-
"th",
|
|
11575
|
-
{
|
|
11576
|
-
className: "text-right border-b max-w-[200px] p-5 ",
|
|
11577
|
-
children: totals && totals.includes(h) && /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "flex justify-between text-white w-full bg-black rounded p-1", children: [
|
|
11578
|
-
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "p-1", children: symbols && symbols[h] && symbols[h] }),
|
|
11579
|
-
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "p-1", children: mapedTotals[h] })
|
|
11580
|
-
] })
|
|
11581
|
-
},
|
|
11582
|
-
fkey
|
|
11583
|
-
);
|
|
11584
|
-
}) }) })
|
|
11585
|
-
] })) });
|
|
11586
|
-
}
|
|
11587
|
-
|
|
11588
11430
|
// ../../node_modules/xlsx/xlsx.mjs
|
|
11589
11431
|
var XLSX = {};
|
|
11590
11432
|
XLSX.version = "0.18.5";
|
|
@@ -32086,45 +31928,217 @@ function useExportdata() {
|
|
|
32086
31928
|
};
|
|
32087
31929
|
}
|
|
32088
31930
|
|
|
32089
|
-
// src/table/
|
|
32090
|
-
var
|
|
32091
|
-
function
|
|
32092
|
-
|
|
32093
|
-
|
|
31931
|
+
// src/table/h.tsx
|
|
31932
|
+
var import_jsx_runtime12 = require("react/jsx-runtime");
|
|
31933
|
+
function HTable(_a) {
|
|
31934
|
+
var _b = _a, {
|
|
31935
|
+
data,
|
|
31936
|
+
symbols,
|
|
31937
|
+
totals,
|
|
31938
|
+
exportName,
|
|
31939
|
+
onSave
|
|
31940
|
+
} = _b, props = __objRest(_b, [
|
|
31941
|
+
"data",
|
|
31942
|
+
"symbols",
|
|
31943
|
+
"totals",
|
|
31944
|
+
"exportName",
|
|
31945
|
+
"onSave"
|
|
31946
|
+
]);
|
|
31947
|
+
if (!Array.isArray(data)) return null;
|
|
31948
|
+
const [mapedData, setMapedData] = (0, import_react25.useState)([...data]);
|
|
32094
31949
|
const exported = useExportdata();
|
|
32095
|
-
|
|
32096
|
-
|
|
32097
|
-
|
|
32098
|
-
|
|
32099
|
-
|
|
32100
|
-
|
|
32101
|
-
|
|
32102
|
-
|
|
32103
|
-
|
|
32104
|
-
|
|
32105
|
-
|
|
32106
|
-
|
|
32107
|
-
|
|
32108
|
-
|
|
32109
|
-
|
|
32110
|
-
|
|
32111
|
-
|
|
32112
|
-
|
|
32113
|
-
|
|
31950
|
+
const [selected, setSelected] = (0, import_react25.useState)(null);
|
|
31951
|
+
const [selectedFilter, setSelectedFilter] = (0, import_react25.useState)(null);
|
|
31952
|
+
const modalRef = (0, import_react25.useRef)(null);
|
|
31953
|
+
const head = (0, import_react25.useMemo)(() => {
|
|
31954
|
+
return [...new Set(data.map((d) => Object.keys(d)).flat())];
|
|
31955
|
+
}, [data]);
|
|
31956
|
+
const mapedTotals = (0, import_react25.useMemo)(() => {
|
|
31957
|
+
return mapedData == null ? void 0 : mapedData.reduce((acc, md) => {
|
|
31958
|
+
head.forEach((h) => {
|
|
31959
|
+
var _a2, _b2;
|
|
31960
|
+
const value = isNaN(+((_a2 = md[h]) == null ? void 0 : _a2.content)) ? 0 : +((_b2 = md[h]) == null ? void 0 : _b2.content);
|
|
31961
|
+
if (acc[h]) {
|
|
31962
|
+
acc[h] += value;
|
|
31963
|
+
} else {
|
|
31964
|
+
acc[h] = value;
|
|
31965
|
+
}
|
|
31966
|
+
});
|
|
31967
|
+
return acc;
|
|
31968
|
+
}, {});
|
|
31969
|
+
}, [mapedData]);
|
|
31970
|
+
(0, import_react25.useEffect)(() => {
|
|
31971
|
+
setMapedData(data);
|
|
31972
|
+
}, [data]);
|
|
31973
|
+
(0, import_react25.useEffect)(() => {
|
|
31974
|
+
const newData = data.map((d, trkey) => {
|
|
31975
|
+
var _a2, _b2;
|
|
31976
|
+
const obj = {};
|
|
31977
|
+
for (let key in d) {
|
|
31978
|
+
const item = {};
|
|
31979
|
+
for (let key2 in d) {
|
|
31980
|
+
item[key2] = ((_a2 = d[key2]) == null ? void 0 : _a2.content) || d[key2];
|
|
31981
|
+
}
|
|
31982
|
+
const typeOf = typeof d[key];
|
|
31983
|
+
const isObject2 = typeOf == "object";
|
|
31984
|
+
const isDate = typeOf == "string" && d[key].toString().includes("T");
|
|
31985
|
+
const cellTypeOf = isDate ? "date" : isObject2 ? "object" : typeOf;
|
|
31986
|
+
const content = cellTypeOf == "date" ? d[key].split("T").join(" ").split(".")[0] : cellTypeOf == "object" ? import_react25.default.isValidElement(d[key]) ? ((_b2 = d[key]) == null ? void 0 : _b2.props).defaultValue : JSON.stringify(d[key]) : d[key];
|
|
31987
|
+
const handler = import_react25.default.isValidElement(d[key]) ? d[key] : null;
|
|
31988
|
+
obj[key] = {
|
|
31989
|
+
index: trkey,
|
|
31990
|
+
originalData: content,
|
|
31991
|
+
cellTypeOf,
|
|
31992
|
+
title: content,
|
|
31993
|
+
content,
|
|
31994
|
+
name: key,
|
|
31995
|
+
exclude: false,
|
|
31996
|
+
handler
|
|
31997
|
+
};
|
|
32114
31998
|
}
|
|
32115
|
-
|
|
32116
|
-
|
|
32117
|
-
|
|
32118
|
-
|
|
32119
|
-
|
|
32120
|
-
|
|
32121
|
-
|
|
32122
|
-
|
|
31999
|
+
return obj;
|
|
32000
|
+
});
|
|
32001
|
+
setMapedData(newData);
|
|
32002
|
+
}, [data]);
|
|
32003
|
+
const values = (0, import_react25.useMemo)(() => {
|
|
32004
|
+
return mapedData.map((d) => Object.keys(d).map((k) => ({ [k]: d[k].content }))).map((d) => Object.assign({}, ...d));
|
|
32005
|
+
}, [mapedData]);
|
|
32006
|
+
return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_jsx_runtime12.Fragment, { children: [
|
|
32007
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "flex gap-2", children: [
|
|
32008
|
+
onSave && /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
|
|
32009
|
+
"button",
|
|
32010
|
+
{
|
|
32011
|
+
className: "p-2 border rounded shadow bg-blue-800 text-white flex gap-1",
|
|
32012
|
+
onClick: (e) => {
|
|
32013
|
+
onSave({ data: values });
|
|
32014
|
+
},
|
|
32015
|
+
children: [
|
|
32016
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SaveIcon, {}),
|
|
32017
|
+
" Guardar"
|
|
32018
|
+
]
|
|
32019
|
+
}
|
|
32020
|
+
),
|
|
32021
|
+
exportName && mapedData.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_jsx_runtime12.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
|
|
32022
|
+
"button",
|
|
32023
|
+
{
|
|
32024
|
+
className: "p-2 border rounded shadow bg-green-800 text-white flex gap-1",
|
|
32025
|
+
onClick: (e) => exported.export(values, exportName),
|
|
32026
|
+
children: [
|
|
32027
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)(ExcelIcon, {}),
|
|
32028
|
+
" Exportar"
|
|
32029
|
+
]
|
|
32030
|
+
}
|
|
32031
|
+
) })
|
|
32032
|
+
] }),
|
|
32033
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("table", __spreadProps(__spreadValues({}, props), { className: "w-full border-collapse table-auto", children: [
|
|
32034
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)("thead", { className: "bg-gray-800 text-white", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("tr", { children: head.map((h, key) => {
|
|
32035
|
+
var _a2;
|
|
32036
|
+
return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
|
|
32037
|
+
"th",
|
|
32038
|
+
{
|
|
32039
|
+
className: "whitespace-nowrap overflow-hidden text-ellipsis max-w-[200px] border-b p-2",
|
|
32040
|
+
children: [
|
|
32041
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
32042
|
+
"div",
|
|
32043
|
+
{
|
|
32044
|
+
className: "cursor-pointer flex ",
|
|
32045
|
+
onClick: (e) => {
|
|
32046
|
+
setSelectedFilter(key == selectedFilter ? null : key);
|
|
32047
|
+
},
|
|
32048
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "text-white w-full bg-black rounded flex justify-center", children: [
|
|
32049
|
+
h,
|
|
32050
|
+
" ",
|
|
32051
|
+
!((_a2 = mapedData == null ? void 0 : mapedData.map((d) => {
|
|
32052
|
+
var _a3;
|
|
32053
|
+
return (_a3 = d[h]) == null ? void 0 : _a3.exclude;
|
|
32054
|
+
})) == null ? void 0 : _a2.every((d) => d === false)) && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "text-red-300", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(FilterOffIcon, {}) })
|
|
32055
|
+
] })
|
|
32056
|
+
}
|
|
32057
|
+
),
|
|
32058
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
32059
|
+
FilterMenu,
|
|
32060
|
+
{
|
|
32061
|
+
h,
|
|
32062
|
+
mapedData,
|
|
32063
|
+
setMapedData,
|
|
32064
|
+
index: key,
|
|
32065
|
+
selectedFilter,
|
|
32066
|
+
setSelectedFilter
|
|
32067
|
+
}
|
|
32068
|
+
)
|
|
32069
|
+
]
|
|
32070
|
+
},
|
|
32071
|
+
h
|
|
32072
|
+
);
|
|
32073
|
+
}) }) }),
|
|
32074
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)("tbody", { className: "divide-y divide-gray-200", children: mapedData.map((md, trKey) => {
|
|
32075
|
+
var _a2;
|
|
32076
|
+
const color2 = trKey % 2 == 0 ? "bg-white" : "bg-gray-100";
|
|
32077
|
+
for (let d in md) {
|
|
32078
|
+
if (md[d].exclude === true) {
|
|
32079
|
+
return null;
|
|
32080
|
+
}
|
|
32081
|
+
}
|
|
32082
|
+
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
32083
|
+
"tr",
|
|
32084
|
+
{
|
|
32085
|
+
onDoubleClick: (e) => {
|
|
32086
|
+
var _a3;
|
|
32087
|
+
(_a3 = modalRef.current) == null ? void 0 : _a3.showModal();
|
|
32088
|
+
},
|
|
32089
|
+
onClick: (e) => setSelected(trKey),
|
|
32090
|
+
className: [
|
|
32091
|
+
"hover:bg-green-100 ",
|
|
32092
|
+
color2,
|
|
32093
|
+
selected == trKey && "bg-green-200 hover:bg-green-300"
|
|
32094
|
+
].join(" "),
|
|
32095
|
+
children: head.map((h, tdKey) => {
|
|
32096
|
+
var _a3;
|
|
32097
|
+
const item = md[h];
|
|
32098
|
+
const id3 = trKey + "-" + (((_a3 = md == null ? void 0 : md.id) == null ? void 0 : _a3.content) || tdKey) + "-" + h;
|
|
32099
|
+
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
32100
|
+
TD,
|
|
32101
|
+
{
|
|
32102
|
+
index: trKey,
|
|
32103
|
+
symbols,
|
|
32104
|
+
item,
|
|
32105
|
+
color: color2,
|
|
32106
|
+
mapedData,
|
|
32107
|
+
setMapedData
|
|
32108
|
+
},
|
|
32109
|
+
id3
|
|
32110
|
+
);
|
|
32111
|
+
})
|
|
32112
|
+
},
|
|
32113
|
+
((_a2 = md == null ? void 0 : md.id) == null ? void 0 : _a2.content) || trKey
|
|
32114
|
+
);
|
|
32115
|
+
}) }),
|
|
32116
|
+
totals && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("tfoot", { className: "bg-gray-800 text-white", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("tr", { children: head.map((h, fkey) => {
|
|
32117
|
+
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
32118
|
+
"th",
|
|
32119
|
+
{
|
|
32120
|
+
className: "text-right border-b max-w-[200px] p-2 ",
|
|
32121
|
+
children: totals.includes(h) && /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "flex justify-between text-white w-full bg-black rounded ", children: [
|
|
32122
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "p-1", children: symbols && symbols[h] && symbols[h] }),
|
|
32123
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "p-1", children: mapedTotals[h] })
|
|
32124
|
+
] })
|
|
32125
|
+
},
|
|
32126
|
+
fkey
|
|
32127
|
+
);
|
|
32128
|
+
}) }) })
|
|
32129
|
+
] }))
|
|
32123
32130
|
] });
|
|
32124
32131
|
}
|
|
32125
32132
|
|
|
32133
|
+
// src/table/index.tsx
|
|
32134
|
+
var import_jsx_runtime13 = require("react/jsx-runtime");
|
|
32135
|
+
function Table(_a) {
|
|
32136
|
+
var props = __objRest(_a, []);
|
|
32137
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "bg-gray-200 border rounded shadow p-1", children: Array.isArray(props.data) ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(HTable, __spreadValues({}, props)) : /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: " p-5 border rounded shadow bg-yellw-500", children: "No es un array" }) });
|
|
32138
|
+
}
|
|
32139
|
+
|
|
32126
32140
|
// src/text-area/index.tsx
|
|
32127
|
-
var
|
|
32141
|
+
var import_react26 = require("react");
|
|
32128
32142
|
var import_jsx_runtime14 = require("react/jsx-runtime");
|
|
32129
32143
|
function TextArea(_a) {
|
|
32130
32144
|
var _b = _a, {
|
|
@@ -32140,7 +32154,7 @@ function TextArea(_a) {
|
|
|
32140
32154
|
"onChange",
|
|
32141
32155
|
"children"
|
|
32142
32156
|
]);
|
|
32143
|
-
const [value, setValue] = (0,
|
|
32157
|
+
const [value, setValue] = (0, import_react26.useState)(children);
|
|
32144
32158
|
return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "w-full", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("label", { className: "flex flex-col gap-1", children: [
|
|
32145
32159
|
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "font-bold ", children: label }),
|
|
32146
32160
|
/* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { children: [
|
|
@@ -32170,12 +32184,12 @@ function TextArea(_a) {
|
|
|
32170
32184
|
}
|
|
32171
32185
|
|
|
32172
32186
|
// src/use-resources/index.ts
|
|
32173
|
-
var
|
|
32187
|
+
var import_react28 = require("react");
|
|
32174
32188
|
|
|
32175
32189
|
// src/use-resources/get.token.tsx
|
|
32176
|
-
var
|
|
32190
|
+
var import_react27 = require("react");
|
|
32177
32191
|
function useToken() {
|
|
32178
|
-
const token = (0,
|
|
32192
|
+
const token = (0, import_react27.useMemo)(() => {
|
|
32179
32193
|
if (typeof window != "undefined") {
|
|
32180
32194
|
const t = window.localStorage.getItem("token");
|
|
32181
32195
|
if (t) return t;
|
|
@@ -32268,8 +32282,8 @@ function useResources({
|
|
|
32268
32282
|
onError
|
|
32269
32283
|
}) {
|
|
32270
32284
|
const token = useToken();
|
|
32271
|
-
const [info, setInfo] = (0,
|
|
32272
|
-
const result = (0,
|
|
32285
|
+
const [info, setInfo] = (0, import_react28.useState)({});
|
|
32286
|
+
const result = (0, import_react28.useMemo)(() => {
|
|
32273
32287
|
var _c, _d, _e, _f, _g, _h, _i;
|
|
32274
32288
|
const r = {};
|
|
32275
32289
|
for (const key in endpoints) {
|
|
@@ -32504,7 +32518,7 @@ function useResources({
|
|
|
32504
32518
|
}
|
|
32505
32519
|
return r;
|
|
32506
32520
|
}, [info, token, endpoints]);
|
|
32507
|
-
(0,
|
|
32521
|
+
(0, import_react28.useEffect)(() => {
|
|
32508
32522
|
var _a, _b;
|
|
32509
32523
|
for (let item in result) {
|
|
32510
32524
|
if ((_a = result[item]) == null ? void 0 : _a.id) {
|
|
@@ -32518,7 +32532,7 @@ function useResources({
|
|
|
32518
32532
|
}
|
|
32519
32533
|
|
|
32520
32534
|
// src/select/index.tsx
|
|
32521
|
-
var
|
|
32535
|
+
var import_react29 = __toESM(require("react"));
|
|
32522
32536
|
|
|
32523
32537
|
// src/select/icon.tsx
|
|
32524
32538
|
var import_jsx_runtime15 = require("react/jsx-runtime");
|
|
@@ -32570,21 +32584,21 @@ function Select(_a) {
|
|
|
32570
32584
|
"children",
|
|
32571
32585
|
"strictMode"
|
|
32572
32586
|
]);
|
|
32573
|
-
const [isOpen, setIsOpen] = (0,
|
|
32574
|
-
const [inputValue, setInputValue] = (0,
|
|
32575
|
-
const [options, setOptions] = (0,
|
|
32587
|
+
const [isOpen, setIsOpen] = (0, import_react29.useState)(false);
|
|
32588
|
+
const [inputValue, setInputValue] = (0, import_react29.useState)((props == null ? void 0 : props.value) || "");
|
|
32589
|
+
const [options, setOptions] = (0, import_react29.useState)(
|
|
32576
32590
|
[]
|
|
32577
32591
|
);
|
|
32578
|
-
const [filtered, setFiltered] = (0,
|
|
32592
|
+
const [filtered, setFiltered] = (0, import_react29.useState)(
|
|
32579
32593
|
[]
|
|
32580
32594
|
);
|
|
32581
|
-
const [highlightedIndex, setHighlightedIndex] = (0,
|
|
32582
|
-
const inputRef = (0,
|
|
32595
|
+
const [highlightedIndex, setHighlightedIndex] = (0, import_react29.useState)(-1);
|
|
32596
|
+
const inputRef = (0, import_react29.useRef)(null);
|
|
32583
32597
|
const validOption = (value) => {
|
|
32584
32598
|
return options.find((opt) => opt.label == value);
|
|
32585
32599
|
};
|
|
32586
|
-
(0,
|
|
32587
|
-
const parsedOptions =
|
|
32600
|
+
(0, import_react29.useEffect)(() => {
|
|
32601
|
+
const parsedOptions = import_react29.default.Children.toArray(children).filter((child) => {
|
|
32588
32602
|
return child.type === "option";
|
|
32589
32603
|
}).map((child) => {
|
|
32590
32604
|
const el = child;
|
|
@@ -32596,7 +32610,7 @@ function Select(_a) {
|
|
|
32596
32610
|
setOptions(parsedOptions);
|
|
32597
32611
|
setFiltered(parsedOptions);
|
|
32598
32612
|
}, [children]);
|
|
32599
|
-
(0,
|
|
32613
|
+
(0, import_react29.useEffect)(() => {
|
|
32600
32614
|
setFiltered(
|
|
32601
32615
|
options.filter(
|
|
32602
32616
|
(opt) => {
|
|
@@ -32625,9 +32639,9 @@ function Select(_a) {
|
|
|
32625
32639
|
setInputValue(opt.label);
|
|
32626
32640
|
setIsOpen(false);
|
|
32627
32641
|
};
|
|
32628
|
-
const containerRef = (0,
|
|
32629
|
-
const [openUpwards, setOpenUpwards] = (0,
|
|
32630
|
-
(0,
|
|
32642
|
+
const containerRef = (0, import_react29.useRef)(null);
|
|
32643
|
+
const [openUpwards, setOpenUpwards] = (0, import_react29.useState)(false);
|
|
32644
|
+
(0, import_react29.useEffect)(() => {
|
|
32631
32645
|
if (isOpen && containerRef.current) {
|
|
32632
32646
|
const rect = containerRef.current.getBoundingClientRect();
|
|
32633
32647
|
const spaceBelow = window.innerHeight - rect.bottom;
|
|
@@ -32743,10 +32757,10 @@ function Select(_a) {
|
|
|
32743
32757
|
}
|
|
32744
32758
|
|
|
32745
32759
|
// src/modal/index.tsx
|
|
32746
|
-
var
|
|
32760
|
+
var import_react30 = __toESM(require("react"));
|
|
32747
32761
|
var import_jsx_runtime18 = require("react/jsx-runtime");
|
|
32748
32762
|
function Modal({ button, children, ref }) {
|
|
32749
|
-
const modalRef = ref || (0,
|
|
32763
|
+
const modalRef = ref || (0, import_react30.useRef)(null);
|
|
32750
32764
|
function show() {
|
|
32751
32765
|
var _a;
|
|
32752
32766
|
typeof modalRef == "object" && ((_a = modalRef.current) == null ? void 0 : _a.showModal());
|
|
@@ -32756,9 +32770,9 @@ function Modal({ button, children, ref }) {
|
|
|
32756
32770
|
typeof modalRef == "object" && ((_a = modalRef.current) == null ? void 0 : _a.close());
|
|
32757
32771
|
}
|
|
32758
32772
|
return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_jsx_runtime18.Fragment, { children: [
|
|
32759
|
-
|
|
32760
|
-
if (
|
|
32761
|
-
return
|
|
32773
|
+
import_react30.default.Children.map(button, (child) => {
|
|
32774
|
+
if (import_react30.default.isValidElement(child)) {
|
|
32775
|
+
return import_react30.default.cloneElement(child, {
|
|
32762
32776
|
onClick: (e) => {
|
|
32763
32777
|
var _a, _b;
|
|
32764
32778
|
show();
|
|
@@ -32777,9 +32791,9 @@ function Modal({ button, children, ref }) {
|
|
|
32777
32791
|
children: "X"
|
|
32778
32792
|
}
|
|
32779
32793
|
),
|
|
32780
|
-
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "flex flex-col gap-3 pt-6", children:
|
|
32781
|
-
if (
|
|
32782
|
-
return
|
|
32794
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "flex flex-col gap-3 pt-6", children: import_react30.default.Children.map(children, (child) => {
|
|
32795
|
+
if (import_react30.default.isValidElement(child)) {
|
|
32796
|
+
return import_react30.default.cloneElement(child, { hide });
|
|
32783
32797
|
}
|
|
32784
32798
|
return child;
|
|
32785
32799
|
}) })
|