@apexcura/ui-components 0.0.12-Beta4 → 0.0.12-Beta6
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.js +28 -6
- package/dist/index.mjs +28 -6
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -361,13 +361,31 @@ var ButtonElement = () => /* @__PURE__ */ import_react12.default.createElement(i
|
|
|
361
361
|
// src/Components/AddMoreTable.tsx
|
|
362
362
|
var import_react13 = __toESM(require("react"));
|
|
363
363
|
var import_antd11 = require("antd");
|
|
364
|
+
var import_icons2 = require("@ant-design/icons");
|
|
364
365
|
var AddMoreTable = (props) => {
|
|
365
366
|
const { thead, tbody } = props;
|
|
366
367
|
const [tableData, setTableData] = (0, import_react13.useState)({});
|
|
368
|
+
const [rows, setRows] = (0, import_react13.useState)(tbody || []);
|
|
369
|
+
function isColumnType(column) {
|
|
370
|
+
return column.dataIndex !== void 0;
|
|
371
|
+
}
|
|
367
372
|
const onHandleChange = (name, value) => {
|
|
368
373
|
setTableData((prev) => ({ ...prev, [name]: value }));
|
|
369
374
|
console.log(tableData);
|
|
370
375
|
};
|
|
376
|
+
const onHandleRows = () => {
|
|
377
|
+
const lastRow = rows[rows.length - 1];
|
|
378
|
+
const newId = lastRow ? lastRow.id + 1 : lastRow.id;
|
|
379
|
+
const newRow = {
|
|
380
|
+
...lastRow,
|
|
381
|
+
id: newId
|
|
382
|
+
};
|
|
383
|
+
setRows((prevData) => [...prevData, newRow]);
|
|
384
|
+
};
|
|
385
|
+
const onHandleDelete = (index) => {
|
|
386
|
+
const remainingRows = rows.filter((eachRow) => eachRow.id !== index);
|
|
387
|
+
setRows(remainingRows);
|
|
388
|
+
};
|
|
371
389
|
const columns = thead && thead.length > 0 ? thead.map((eachHeadEl) => ({
|
|
372
390
|
title: eachHeadEl.label,
|
|
373
391
|
dataIndex: eachHeadEl.name,
|
|
@@ -384,7 +402,7 @@ var AddMoreTable = (props) => {
|
|
|
384
402
|
return null;
|
|
385
403
|
}
|
|
386
404
|
};
|
|
387
|
-
const dataSource =
|
|
405
|
+
const dataSource = rows.map((eachRow, index) => {
|
|
388
406
|
const rowElements = {};
|
|
389
407
|
if (eachRow.element && eachRow.label) {
|
|
390
408
|
rowElements[eachRow.label] = renderInputElement(eachRow);
|
|
@@ -402,12 +420,16 @@ var AddMoreTable = (props) => {
|
|
|
402
420
|
"#": index + 1,
|
|
403
421
|
...eachRow,
|
|
404
422
|
...rowElements,
|
|
405
|
-
...variableData
|
|
423
|
+
...variableData,
|
|
424
|
+
actions: /* @__PURE__ */ import_react13.default.createElement(import_react13.default.Fragment, null, /* @__PURE__ */ import_react13.default.createElement("button", { onClick: () => onHandleDelete(index) }, /* @__PURE__ */ import_react13.default.createElement(import_icons2.DeleteOutlined, null)), index === rows.length - 1 && /* @__PURE__ */ import_react13.default.createElement("button", { onClick: onHandleRows }, /* @__PURE__ */ import_react13.default.createElement(import_icons2.PlusOutlined, null)))
|
|
406
425
|
};
|
|
407
|
-
})
|
|
408
|
-
if (!columns.some(
|
|
409
|
-
|
|
410
|
-
|
|
426
|
+
});
|
|
427
|
+
if (!columns.some((col) => isColumnType(col) && col.dataIndex === "actions")) {
|
|
428
|
+
columns.push({
|
|
429
|
+
title: "Actions",
|
|
430
|
+
dataIndex: "actions",
|
|
431
|
+
key: "actions"
|
|
432
|
+
});
|
|
411
433
|
}
|
|
412
434
|
return /* @__PURE__ */ import_react13.default.createElement(import_react13.default.Fragment, null, /* @__PURE__ */ import_react13.default.createElement(
|
|
413
435
|
import_antd11.Table,
|
package/dist/index.mjs
CHANGED
|
@@ -314,13 +314,31 @@ var ButtonElement = () => /* @__PURE__ */ React11.createElement(Flex2, { gap: "s
|
|
|
314
314
|
// src/Components/AddMoreTable.tsx
|
|
315
315
|
import React12, { useState as useState3 } from "react";
|
|
316
316
|
import { Table } from "antd";
|
|
317
|
+
import { PlusOutlined, DeleteOutlined } from "@ant-design/icons";
|
|
317
318
|
var AddMoreTable = (props) => {
|
|
318
319
|
const { thead, tbody } = props;
|
|
319
320
|
const [tableData, setTableData] = useState3({});
|
|
321
|
+
const [rows, setRows] = useState3(tbody || []);
|
|
322
|
+
function isColumnType(column) {
|
|
323
|
+
return column.dataIndex !== void 0;
|
|
324
|
+
}
|
|
320
325
|
const onHandleChange = (name, value) => {
|
|
321
326
|
setTableData((prev) => ({ ...prev, [name]: value }));
|
|
322
327
|
console.log(tableData);
|
|
323
328
|
};
|
|
329
|
+
const onHandleRows = () => {
|
|
330
|
+
const lastRow = rows[rows.length - 1];
|
|
331
|
+
const newId = lastRow ? lastRow.id + 1 : lastRow.id;
|
|
332
|
+
const newRow = {
|
|
333
|
+
...lastRow,
|
|
334
|
+
id: newId
|
|
335
|
+
};
|
|
336
|
+
setRows((prevData) => [...prevData, newRow]);
|
|
337
|
+
};
|
|
338
|
+
const onHandleDelete = (index) => {
|
|
339
|
+
const remainingRows = rows.filter((eachRow) => eachRow.id !== index);
|
|
340
|
+
setRows(remainingRows);
|
|
341
|
+
};
|
|
324
342
|
const columns = thead && thead.length > 0 ? thead.map((eachHeadEl) => ({
|
|
325
343
|
title: eachHeadEl.label,
|
|
326
344
|
dataIndex: eachHeadEl.name,
|
|
@@ -337,7 +355,7 @@ var AddMoreTable = (props) => {
|
|
|
337
355
|
return null;
|
|
338
356
|
}
|
|
339
357
|
};
|
|
340
|
-
const dataSource =
|
|
358
|
+
const dataSource = rows.map((eachRow, index) => {
|
|
341
359
|
const rowElements = {};
|
|
342
360
|
if (eachRow.element && eachRow.label) {
|
|
343
361
|
rowElements[eachRow.label] = renderInputElement(eachRow);
|
|
@@ -355,12 +373,16 @@ var AddMoreTable = (props) => {
|
|
|
355
373
|
"#": index + 1,
|
|
356
374
|
...eachRow,
|
|
357
375
|
...rowElements,
|
|
358
|
-
...variableData
|
|
376
|
+
...variableData,
|
|
377
|
+
actions: /* @__PURE__ */ React12.createElement(React12.Fragment, null, /* @__PURE__ */ React12.createElement("button", { onClick: () => onHandleDelete(index) }, /* @__PURE__ */ React12.createElement(DeleteOutlined, null)), index === rows.length - 1 && /* @__PURE__ */ React12.createElement("button", { onClick: onHandleRows }, /* @__PURE__ */ React12.createElement(PlusOutlined, null)))
|
|
359
378
|
};
|
|
360
|
-
})
|
|
361
|
-
if (!columns.some(
|
|
362
|
-
|
|
363
|
-
|
|
379
|
+
});
|
|
380
|
+
if (!columns.some((col) => isColumnType(col) && col.dataIndex === "actions")) {
|
|
381
|
+
columns.push({
|
|
382
|
+
title: "Actions",
|
|
383
|
+
dataIndex: "actions",
|
|
384
|
+
key: "actions"
|
|
385
|
+
});
|
|
364
386
|
}
|
|
365
387
|
return /* @__PURE__ */ React12.createElement(React12.Fragment, null, /* @__PURE__ */ React12.createElement(
|
|
366
388
|
Table,
|