@apexcura/ui-components 0.0.12-Beta17 → 0.0.12-Beta19
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 +75 -23
- package/dist/index.mjs +75 -23
- package/package.json +2 -1
package/dist/index.js
CHANGED
|
@@ -376,34 +376,83 @@ var AddMoreTable = (props) => {
|
|
|
376
376
|
const onHandleRows = () => {
|
|
377
377
|
const lastRow = rows[rows.length - 1];
|
|
378
378
|
const newId = lastRow ? lastRow.id + 1 : 1;
|
|
379
|
-
let newRow
|
|
380
|
-
newRow = {
|
|
379
|
+
let newRow = {
|
|
381
380
|
...lastRow,
|
|
382
381
|
id: newId
|
|
383
|
-
// variable_data: [
|
|
384
|
-
// ...lastRow.variable_data,
|
|
385
|
-
// {
|
|
386
|
-
// id: { id: newVariableId },
|
|
387
|
-
// Route: { label: "Route", element: "single-select", type: "text" },
|
|
388
|
-
// Dose: { label: "Dose", element: "single-select", type: "text" },
|
|
389
|
-
// Frequency: { label: "Frequency", element: "single-select", type: "text" },
|
|
390
|
-
// When: { label: "When", element: "textarea", type: "text" },
|
|
391
|
-
// Duration: { label: "Duration", element: "textarea", type: "text" },
|
|
392
|
-
// Instructions: { label: "Instructions", element: "textarea", type: "text" }
|
|
393
|
-
// }
|
|
394
|
-
// // ],
|
|
395
|
-
// };
|
|
396
|
-
// } else {
|
|
397
|
-
// newRow = {
|
|
398
|
-
// ...lastRow,
|
|
399
|
-
// id: newId,
|
|
400
|
-
// };
|
|
401
382
|
};
|
|
383
|
+
if (newRow.variable_data && newRow.variable_data.length > 0) {
|
|
384
|
+
const updatedVariableData = newRow.variable_data.map((item, index) => {
|
|
385
|
+
const { icons, ...rest } = item;
|
|
386
|
+
return {
|
|
387
|
+
...rest,
|
|
388
|
+
icons: { ...icons, delete: "" }
|
|
389
|
+
};
|
|
390
|
+
});
|
|
391
|
+
updatedVariableData[updatedVariableData.length - 1] = {
|
|
392
|
+
...updatedVariableData[updatedVariableData.length - 1],
|
|
393
|
+
icons: { ...updatedVariableData[updatedVariableData.length - 1].icons, plus: "" }
|
|
394
|
+
};
|
|
395
|
+
newRow.variable_data = updatedVariableData;
|
|
396
|
+
}
|
|
402
397
|
setRows((prevData) => [...prevData, newRow]);
|
|
403
398
|
};
|
|
404
399
|
const onHandleDelete = (index) => {
|
|
405
|
-
|
|
406
|
-
|
|
400
|
+
if (rows.length > 1) {
|
|
401
|
+
const remainingRows = rows.filter((eachRow) => eachRow.id !== index);
|
|
402
|
+
setRows(remainingRows);
|
|
403
|
+
}
|
|
404
|
+
};
|
|
405
|
+
const onHandleVariableData = (rowId) => {
|
|
406
|
+
setRows((prevRows) => prevRows.map((row) => {
|
|
407
|
+
if (row.id === rowId) {
|
|
408
|
+
const newVariableDataId = row.variable_data.length > 0 ? row.variable_data[row.variable_data.length - 1].id + 1 : 1;
|
|
409
|
+
const newVariableData = {
|
|
410
|
+
id: newVariableDataId,
|
|
411
|
+
Route: {
|
|
412
|
+
label: "Route",
|
|
413
|
+
element: "single-select",
|
|
414
|
+
type: "text"
|
|
415
|
+
},
|
|
416
|
+
Dose: {
|
|
417
|
+
label: "Dose",
|
|
418
|
+
element: "single-select",
|
|
419
|
+
type: "text"
|
|
420
|
+
},
|
|
421
|
+
Frequency: {
|
|
422
|
+
label: "Frequency",
|
|
423
|
+
element: "single-select",
|
|
424
|
+
type: "text"
|
|
425
|
+
},
|
|
426
|
+
When: {
|
|
427
|
+
label: "When",
|
|
428
|
+
element: "textarea",
|
|
429
|
+
type: "text"
|
|
430
|
+
},
|
|
431
|
+
Duration: {
|
|
432
|
+
label: "Duration",
|
|
433
|
+
element: "textarea",
|
|
434
|
+
type: "text"
|
|
435
|
+
},
|
|
436
|
+
Instructions: {
|
|
437
|
+
label: "Instructions",
|
|
438
|
+
element: "textarea",
|
|
439
|
+
type: "text"
|
|
440
|
+
},
|
|
441
|
+
icons: { delete: "", plus: "" }
|
|
442
|
+
};
|
|
443
|
+
const updatedVariableData = [...row.variable_data, newVariableData];
|
|
444
|
+
updatedVariableData.forEach((data, index) => {
|
|
445
|
+
if (index === updatedVariableData.length - 1) {
|
|
446
|
+
data.icons.plus = "";
|
|
447
|
+
}
|
|
448
|
+
});
|
|
449
|
+
return {
|
|
450
|
+
...row,
|
|
451
|
+
variable_data: updatedVariableData
|
|
452
|
+
};
|
|
453
|
+
}
|
|
454
|
+
return row;
|
|
455
|
+
}));
|
|
407
456
|
};
|
|
408
457
|
const columns = thead && thead.length > 0 ? thead.map((eachHeadEl) => ({
|
|
409
458
|
title: eachHeadEl.label,
|
|
@@ -426,11 +475,14 @@ var AddMoreTable = (props) => {
|
|
|
426
475
|
rowElements[eachRow.label] = renderInputElement(eachRow);
|
|
427
476
|
}
|
|
428
477
|
if (eachRow.variable_data && Array.isArray(eachRow.variable_data)) {
|
|
429
|
-
eachRow.variable_data.forEach((variable) => {
|
|
478
|
+
eachRow.variable_data.forEach((variable, varIndex) => {
|
|
430
479
|
Object.entries(variable).forEach(([key, value]) => {
|
|
431
480
|
if (value && value.element && value.label) {
|
|
432
481
|
rowElements[value.label] = renderInputElement(value);
|
|
433
482
|
}
|
|
483
|
+
if (key === "icons") {
|
|
484
|
+
rowElements[`icons_${varIndex}`] = /* @__PURE__ */ import_react13.default.createElement(import_react13.default.Fragment, null, /* @__PURE__ */ import_react13.default.createElement("button", { onClick: () => onHandleDelete(eachRow.id) }, /* @__PURE__ */ import_react13.default.createElement(import_icons2.DeleteOutlined, null)), varIndex === eachRow.variable_data.length - 1 && /* @__PURE__ */ import_react13.default.createElement("button", { onClick: () => onHandleVariableData(eachRow.id) }, /* @__PURE__ */ import_react13.default.createElement(import_icons2.PlusOutlined, null)));
|
|
485
|
+
}
|
|
434
486
|
});
|
|
435
487
|
});
|
|
436
488
|
}
|
package/dist/index.mjs
CHANGED
|
@@ -329,34 +329,83 @@ var AddMoreTable = (props) => {
|
|
|
329
329
|
const onHandleRows = () => {
|
|
330
330
|
const lastRow = rows[rows.length - 1];
|
|
331
331
|
const newId = lastRow ? lastRow.id + 1 : 1;
|
|
332
|
-
let newRow
|
|
333
|
-
newRow = {
|
|
332
|
+
let newRow = {
|
|
334
333
|
...lastRow,
|
|
335
334
|
id: newId
|
|
336
|
-
// variable_data: [
|
|
337
|
-
// ...lastRow.variable_data,
|
|
338
|
-
// {
|
|
339
|
-
// id: { id: newVariableId },
|
|
340
|
-
// Route: { label: "Route", element: "single-select", type: "text" },
|
|
341
|
-
// Dose: { label: "Dose", element: "single-select", type: "text" },
|
|
342
|
-
// Frequency: { label: "Frequency", element: "single-select", type: "text" },
|
|
343
|
-
// When: { label: "When", element: "textarea", type: "text" },
|
|
344
|
-
// Duration: { label: "Duration", element: "textarea", type: "text" },
|
|
345
|
-
// Instructions: { label: "Instructions", element: "textarea", type: "text" }
|
|
346
|
-
// }
|
|
347
|
-
// // ],
|
|
348
|
-
// };
|
|
349
|
-
// } else {
|
|
350
|
-
// newRow = {
|
|
351
|
-
// ...lastRow,
|
|
352
|
-
// id: newId,
|
|
353
|
-
// };
|
|
354
335
|
};
|
|
336
|
+
if (newRow.variable_data && newRow.variable_data.length > 0) {
|
|
337
|
+
const updatedVariableData = newRow.variable_data.map((item, index) => {
|
|
338
|
+
const { icons, ...rest } = item;
|
|
339
|
+
return {
|
|
340
|
+
...rest,
|
|
341
|
+
icons: { ...icons, delete: "" }
|
|
342
|
+
};
|
|
343
|
+
});
|
|
344
|
+
updatedVariableData[updatedVariableData.length - 1] = {
|
|
345
|
+
...updatedVariableData[updatedVariableData.length - 1],
|
|
346
|
+
icons: { ...updatedVariableData[updatedVariableData.length - 1].icons, plus: "" }
|
|
347
|
+
};
|
|
348
|
+
newRow.variable_data = updatedVariableData;
|
|
349
|
+
}
|
|
355
350
|
setRows((prevData) => [...prevData, newRow]);
|
|
356
351
|
};
|
|
357
352
|
const onHandleDelete = (index) => {
|
|
358
|
-
|
|
359
|
-
|
|
353
|
+
if (rows.length > 1) {
|
|
354
|
+
const remainingRows = rows.filter((eachRow) => eachRow.id !== index);
|
|
355
|
+
setRows(remainingRows);
|
|
356
|
+
}
|
|
357
|
+
};
|
|
358
|
+
const onHandleVariableData = (rowId) => {
|
|
359
|
+
setRows((prevRows) => prevRows.map((row) => {
|
|
360
|
+
if (row.id === rowId) {
|
|
361
|
+
const newVariableDataId = row.variable_data.length > 0 ? row.variable_data[row.variable_data.length - 1].id + 1 : 1;
|
|
362
|
+
const newVariableData = {
|
|
363
|
+
id: newVariableDataId,
|
|
364
|
+
Route: {
|
|
365
|
+
label: "Route",
|
|
366
|
+
element: "single-select",
|
|
367
|
+
type: "text"
|
|
368
|
+
},
|
|
369
|
+
Dose: {
|
|
370
|
+
label: "Dose",
|
|
371
|
+
element: "single-select",
|
|
372
|
+
type: "text"
|
|
373
|
+
},
|
|
374
|
+
Frequency: {
|
|
375
|
+
label: "Frequency",
|
|
376
|
+
element: "single-select",
|
|
377
|
+
type: "text"
|
|
378
|
+
},
|
|
379
|
+
When: {
|
|
380
|
+
label: "When",
|
|
381
|
+
element: "textarea",
|
|
382
|
+
type: "text"
|
|
383
|
+
},
|
|
384
|
+
Duration: {
|
|
385
|
+
label: "Duration",
|
|
386
|
+
element: "textarea",
|
|
387
|
+
type: "text"
|
|
388
|
+
},
|
|
389
|
+
Instructions: {
|
|
390
|
+
label: "Instructions",
|
|
391
|
+
element: "textarea",
|
|
392
|
+
type: "text"
|
|
393
|
+
},
|
|
394
|
+
icons: { delete: "", plus: "" }
|
|
395
|
+
};
|
|
396
|
+
const updatedVariableData = [...row.variable_data, newVariableData];
|
|
397
|
+
updatedVariableData.forEach((data, index) => {
|
|
398
|
+
if (index === updatedVariableData.length - 1) {
|
|
399
|
+
data.icons.plus = "";
|
|
400
|
+
}
|
|
401
|
+
});
|
|
402
|
+
return {
|
|
403
|
+
...row,
|
|
404
|
+
variable_data: updatedVariableData
|
|
405
|
+
};
|
|
406
|
+
}
|
|
407
|
+
return row;
|
|
408
|
+
}));
|
|
360
409
|
};
|
|
361
410
|
const columns = thead && thead.length > 0 ? thead.map((eachHeadEl) => ({
|
|
362
411
|
title: eachHeadEl.label,
|
|
@@ -379,11 +428,14 @@ var AddMoreTable = (props) => {
|
|
|
379
428
|
rowElements[eachRow.label] = renderInputElement(eachRow);
|
|
380
429
|
}
|
|
381
430
|
if (eachRow.variable_data && Array.isArray(eachRow.variable_data)) {
|
|
382
|
-
eachRow.variable_data.forEach((variable) => {
|
|
431
|
+
eachRow.variable_data.forEach((variable, varIndex) => {
|
|
383
432
|
Object.entries(variable).forEach(([key, value]) => {
|
|
384
433
|
if (value && value.element && value.label) {
|
|
385
434
|
rowElements[value.label] = renderInputElement(value);
|
|
386
435
|
}
|
|
436
|
+
if (key === "icons") {
|
|
437
|
+
rowElements[`icons_${varIndex}`] = /* @__PURE__ */ React12.createElement(React12.Fragment, null, /* @__PURE__ */ React12.createElement("button", { onClick: () => onHandleDelete(eachRow.id) }, /* @__PURE__ */ React12.createElement(DeleteOutlined, null)), varIndex === eachRow.variable_data.length - 1 && /* @__PURE__ */ React12.createElement("button", { onClick: () => onHandleVariableData(eachRow.id) }, /* @__PURE__ */ React12.createElement(PlusOutlined, null)));
|
|
438
|
+
}
|
|
387
439
|
});
|
|
388
440
|
});
|
|
389
441
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@apexcura/ui-components",
|
|
3
|
-
"version": "0.0.12-
|
|
3
|
+
"version": "0.0.12-Beta19",
|
|
4
4
|
"description": "Apex cura React components library",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"apex cura",
|
|
@@ -48,6 +48,7 @@
|
|
|
48
48
|
"node": ">=18.0.0"
|
|
49
49
|
},
|
|
50
50
|
"dependencies": {
|
|
51
|
+
"@apexcura/ui-components": "^0.0.12-Beta17",
|
|
51
52
|
"@tinymce/tinymce-react": "^5.0.1"
|
|
52
53
|
}
|
|
53
54
|
}
|