@apexcura/ui-components 0.0.12-Beta21 → 0.0.12-Beta23

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.
Files changed (5) hide show
  1. package/dist/index.d.mts +5 -1
  2. package/dist/index.d.ts +5 -1
  3. package/dist/index.js +119 -115
  4. package/dist/index.mjs +125 -121
  5. package/package.json +1 -1
package/dist/index.d.mts CHANGED
@@ -1,13 +1,14 @@
1
1
  import React$1 from 'react';
2
2
 
3
3
  type ElementType = {
4
+ className: string | undefined;
4
5
  placeholder?: string;
5
6
  addonBefore?: React.ReactNode;
6
7
  defaultValue?: string;
7
8
  disabled?: boolean;
8
9
  prefix?: React.ReactNode;
9
10
  type?: string;
10
- value?: string | number | boolean | any[];
11
+ value?: string | number | boolean | any[] | null;
11
12
  status?: "error" | "warning";
12
13
  styles?: React.CSSProperties;
13
14
  classNames?: string;
@@ -17,12 +18,15 @@ type ElementType = {
17
18
  suffix?: React.ReactNode;
18
19
  maxLength?: number;
19
20
  fieldNames?: any[];
21
+ options?: any[];
20
22
  onChange?: (value: string | number | boolean | any[]) => void;
21
23
  dropDownOptions?: any[];
22
24
  id?: number;
23
25
  thead?: any[];
24
26
  tbody?: any[];
25
27
  variable_data?: any[];
28
+ optionType?: string;
29
+ selectedClassName?: string;
26
30
  };
27
31
 
28
32
  interface ElementExecuterProps$3 extends ElementType {
package/dist/index.d.ts CHANGED
@@ -1,13 +1,14 @@
1
1
  import React$1 from 'react';
2
2
 
3
3
  type ElementType = {
4
+ className: string | undefined;
4
5
  placeholder?: string;
5
6
  addonBefore?: React.ReactNode;
6
7
  defaultValue?: string;
7
8
  disabled?: boolean;
8
9
  prefix?: React.ReactNode;
9
10
  type?: string;
10
- value?: string | number | boolean | any[];
11
+ value?: string | number | boolean | any[] | null;
11
12
  status?: "error" | "warning";
12
13
  styles?: React.CSSProperties;
13
14
  classNames?: string;
@@ -17,12 +18,15 @@ type ElementType = {
17
18
  suffix?: React.ReactNode;
18
19
  maxLength?: number;
19
20
  fieldNames?: any[];
21
+ options?: any[];
20
22
  onChange?: (value: string | number | boolean | any[]) => void;
21
23
  dropDownOptions?: any[];
22
24
  id?: number;
23
25
  thead?: any[];
24
26
  tbody?: any[];
25
27
  variable_data?: any[];
28
+ optionType?: string;
29
+ selectedClassName?: string;
26
30
  };
27
31
 
28
32
  interface ElementExecuterProps$3 extends ElementType {
package/dist/index.js CHANGED
@@ -188,14 +188,35 @@ var SelectElement = (props) => {
188
188
  var import_react6 = __toESM(require("react"));
189
189
  var import_antd6 = require("antd");
190
190
  var RadioElement = (props) => {
191
+ const [isDisabled, setIsDisabled] = (0, import_react6.useState)(props.disabled);
192
+ const [selectedValue, setSelectedValue] = (0, import_react6.useState)(props.value);
193
+ let optionType;
194
+ if (props.optionType === "button") {
195
+ optionType = props.optionType;
196
+ }
191
197
  const handleChange = (e) => {
198
+ const selectedVal = e.target.value;
199
+ const selectedOptions = [{ id: selectedVal, value: selectedVal }];
200
+ setSelectedValue(selectedVal);
201
+ setIsDisabled(true);
192
202
  if (props.onChange) {
193
- const selectedVal = e.target.value;
194
- const selectedOptions = [{ id: selectedVal, value: selectedVal }];
195
203
  props.onChange(selectedOptions);
196
204
  }
197
205
  };
198
- return /* @__PURE__ */ import_react6.default.createElement(import_antd6.Radio.Group, { name: "radiogroup", defaultValue: 1 }, /* @__PURE__ */ import_react6.default.createElement(import_antd6.Radio, { value: 1, onChange: handleChange }, "A"), /* @__PURE__ */ import_react6.default.createElement(import_antd6.Radio, { value: 2, onChange: handleChange }, "B"), /* @__PURE__ */ import_react6.default.createElement(import_antd6.Radio, { value: 3, onChange: handleChange }, "C"), /* @__PURE__ */ import_react6.default.createElement(import_antd6.Radio, { value: 4, onChange: handleChange }, "D"));
206
+ const radioOptions = props.options && props.options.map((option) => ({
207
+ ...option,
208
+ className: selectedValue === option.value ? option.selectedClassName : option.className,
209
+ disabled: isDisabled
210
+ }));
211
+ return /* @__PURE__ */ import_react6.default.createElement(import_react6.default.Fragment, null, /* @__PURE__ */ import_react6.default.createElement("h6", null, "joikdf"), /* @__PURE__ */ import_react6.default.createElement(
212
+ import_antd6.Radio.Group,
213
+ {
214
+ options: radioOptions,
215
+ onChange: handleChange,
216
+ optionType,
217
+ className: props.className ? props.className : ""
218
+ }
219
+ ));
199
220
  };
200
221
 
201
222
  // src/Components/Checkbox.tsx
@@ -364,145 +385,128 @@ var import_antd11 = require("antd");
364
385
  var import_icons2 = require("@ant-design/icons");
365
386
  var AddMoreTable = (props) => {
366
387
  const { thead, tbody } = props;
367
- const [tableData, setTableData] = (0, import_react13.useState)({});
368
388
  const [rows, setRows] = (0, import_react13.useState)(tbody || []);
369
- function isColumnType(column) {
370
- return column.dataIndex !== void 0;
371
- }
372
- const onHandleChange = (name, value) => {
373
- setTableData((prev) => ({ ...prev, [name]: value }));
374
- console.log(tableData);
375
- };
376
389
  const onHandleRows = () => {
377
- const lastRow = rows[rows.length - 1];
378
- const newId = lastRow ? lastRow.id + 1 : 1;
390
+ const newId = rows.length > 0 ? rows[rows.length - 1].id + 1 : 1;
379
391
  let newRow = {
380
- ...lastRow,
381
- id: newId
392
+ id: newId,
393
+ label: "Medicine",
394
+ name: "Medicine",
395
+ type: "text",
396
+ variable_data: [
397
+ {
398
+ id: 1,
399
+ Route: { label: "Route", element: "single-select", type: "text" },
400
+ Dose: { label: "Dose", element: "single-select", type: "text" },
401
+ Frequency: { label: "Frequency", element: "single-select", type: "text" },
402
+ When: { label: "When", element: "textarea", type: "text" },
403
+ Duration: { label: "Duration", element: "textarea", type: "text" },
404
+ Instructions: { label: "Instructions", element: "textarea", type: "text" },
405
+ SubRows: { delete: "delete", add: "plus" }
406
+ }
407
+ ]
382
408
  };
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: { delete: "", plus: index === newRow.variable_data.length - 1 ? "" : void 0 }
389
- };
390
- });
391
- newRow.variable_data = updatedVariableData;
392
- }
393
409
  setRows((prevData) => [...prevData, newRow]);
394
410
  };
395
- const onHandleDelete = (index) => {
396
- if (rows.length > 1) {
397
- const remainingRows = rows.filter((eachRow) => eachRow.id !== index);
398
- setRows(remainingRows);
399
- }
411
+ const onHandleDelete = (id) => {
412
+ setRows((prevRows) => prevRows.filter((row) => row.id !== id));
400
413
  };
401
- const onHandleVariableData = (rowId) => {
402
- setRows((prevRows) => prevRows.map((row) => {
403
- if (row.id === rowId) {
404
- const newVariableDataId = row.variable_data.length > 0 ? row.variable_data[row.variable_data.length - 1].id + 1 : 1;
405
- const newVariableData = {
406
- id: newVariableDataId,
407
- Route: {
408
- label: "Route",
409
- element: "single-select",
410
- type: "text"
411
- },
412
- Dose: {
413
- label: "Dose",
414
- element: "single-select",
415
- type: "text"
416
- },
417
- Frequency: {
418
- label: "Frequency",
419
- element: "single-select",
420
- type: "text"
421
- },
422
- When: {
423
- label: "When",
424
- element: "textarea",
425
- type: "text"
426
- },
427
- Duration: {
428
- label: "Duration",
429
- element: "textarea",
430
- type: "text"
431
- },
432
- Instructions: {
433
- label: "Instructions",
434
- element: "textarea",
435
- type: "text"
436
- },
437
- icons: { delete: "", plus: "" }
438
- };
439
- const updatedVariableData = [...row.variable_data, newVariableData].map((item, index, array) => ({
440
- ...item,
441
- icons: { delete: "", plus: index === array.length - 1 ? "" : void 0 }
442
- }));
443
- return {
444
- ...row,
445
- variable_data: updatedVariableData
446
- };
447
- }
448
- return row;
449
- }));
414
+ const onHandleSubRowsAdd = (rowIndex) => {
415
+ setRows((prevRows) => {
416
+ return prevRows.map((row, index) => {
417
+ if (index === rowIndex) {
418
+ const newSubRow = {
419
+ id: row.variable_data.length + 1,
420
+ Route: { label: "Route", element: "single-select", type: "text" },
421
+ Dose: { label: "Dose", element: "single-select", type: "text" },
422
+ Frequency: { label: "Frequency", element: "single-select", type: "text" },
423
+ When: { label: "When", element: "textarea", type: "text" },
424
+ Duration: { label: "Duration", element: "textarea", type: "text" },
425
+ Instructions: { label: "Instructions", element: "textarea", type: "text" },
426
+ SubRows: { delete: "delete", add: "plus" }
427
+ };
428
+ const updatedVariableData = [...row.variable_data, newSubRow];
429
+ return {
430
+ ...row,
431
+ variable_data: updatedVariableData
432
+ };
433
+ }
434
+ return row;
435
+ });
436
+ });
450
437
  };
451
- const columns = thead && thead.length > 0 ? thead.map((eachHeadEl) => ({
452
- title: eachHeadEl.label,
453
- dataIndex: eachHeadEl.name,
454
- key: eachHeadEl.id
455
- })) : [];
456
- const renderInputElement = (element) => {
438
+ const onHandleSubRowsDelete = (rowIndex, subIndex) => {
439
+ setRows((prevRows) => {
440
+ return prevRows.map((row, index) => {
441
+ if (index === rowIndex) {
442
+ const updatedVariableData = row.variable_data.filter((_, i) => i !== subIndex);
443
+ return {
444
+ ...row,
445
+ variable_data: updatedVariableData
446
+ };
447
+ }
448
+ return row;
449
+ });
450
+ });
451
+ };
452
+ (0, import_react13.useEffect)(() => {
453
+ console.log(rows);
454
+ }, [rows]);
455
+ const renderInputElement = (element, value) => {
456
+ if (!element)
457
+ return null;
457
458
  const { element: type, label } = element;
458
459
  if (type === "single-select") {
459
- return /* @__PURE__ */ import_react13.default.createElement(SingleSelectElement, { onChange: (value) => onHandleChange(label, value) });
460
+ return /* @__PURE__ */ import_react13.default.createElement(SingleSelectElement, { onChange: (value2) => console.log(label, value2), optionType: "", className: void 0 });
460
461
  } else if (type === "textarea") {
461
- return /* @__PURE__ */ import_react13.default.createElement(TextareaElement, { onChange: (value) => onHandleChange(label, value) });
462
+ return /* @__PURE__ */ import_react13.default.createElement(TextareaElement, { onChange: (value2) => console.log(label, value2), optionType: "", className: void 0 });
462
463
  } else {
463
464
  return null;
464
465
  }
465
466
  };
466
- const dataSource = rows.map((eachRow, index) => {
467
- const rowElements = {};
468
- if (eachRow.element && eachRow.label) {
469
- rowElements[eachRow.label] = renderInputElement(eachRow);
470
- }
471
- if (eachRow.variable_data && Array.isArray(eachRow.variable_data)) {
472
- eachRow.variable_data.forEach((variable, varIndex) => {
473
- Object.entries(variable).forEach(([key, value]) => {
474
- if (value && value.element && value.label) {
475
- rowElements[value.label] = renderInputElement(value);
476
- }
477
- if (key === "icons") {
478
- 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)));
479
- }
480
- });
481
- });
482
- }
483
- return {
484
- key: index.toString(),
485
- "#": index + 1,
486
- ...eachRow,
487
- ...rowElements,
488
- actions: /* @__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)), index === rows.length - 1 && /* @__PURE__ */ import_react13.default.createElement("button", { onClick: onHandleRows }, /* @__PURE__ */ import_react13.default.createElement(import_icons2.PlusOutlined, null)))
467
+ const dataSource = rows.map((eachRow, rowIndex) => {
468
+ const rowData = {
469
+ key: eachRow.id,
470
+ "#": rowIndex + 1,
471
+ "Medicine": renderInputElement({
472
+ element: eachRow.element,
473
+ label: eachRow.label
474
+ })
489
475
  };
476
+ rowData["Medicine"] = renderInputElement(eachRow.variable_data[0].Medicine);
477
+ eachRow.variable_data.map((variable, subIndex) => {
478
+ Object.keys(variable).forEach((key) => {
479
+ if (key === "SubRows") {
480
+ rowData[`${key}`] = /* @__PURE__ */ import_react13.default.createElement("div", { key: subIndex }, eachRow.variable_data.length > 1 && /* @__PURE__ */ import_react13.default.createElement(import_antd11.Button, { onClick: () => onHandleSubRowsDelete(rowIndex, subIndex) }, /* @__PURE__ */ import_react13.default.createElement(import_icons2.DeleteOutlined, null)), subIndex === eachRow.variable_data.length - 1 && /* @__PURE__ */ import_react13.default.createElement(import_antd11.Button, { onClick: () => onHandleSubRowsAdd(rowIndex) }, /* @__PURE__ */ import_react13.default.createElement(import_icons2.PlusOutlined, null)));
481
+ } else {
482
+ rowData[`${key}`] = renderInputElement(variable[key]);
483
+ }
484
+ });
485
+ });
486
+ rowData.actions = /* @__PURE__ */ import_react13.default.createElement("div", null, /* @__PURE__ */ import_react13.default.createElement(import_antd11.Button, { onClick: () => onHandleDelete(eachRow.id) }, /* @__PURE__ */ import_react13.default.createElement(import_icons2.DeleteOutlined, null)), rowIndex === rows.length - 1 && /* @__PURE__ */ import_react13.default.createElement(import_antd11.Button, { onClick: onHandleRows }, /* @__PURE__ */ import_react13.default.createElement(import_icons2.PlusOutlined, null)));
487
+ return rowData;
490
488
  });
491
- if (!columns.some((col) => isColumnType(col) && col.dataIndex === "actions")) {
489
+ const columns = thead && thead.length > 0 ? thead.map((eachHeadEl) => ({
490
+ title: eachHeadEl.label,
491
+ dataIndex: eachHeadEl.name,
492
+ key: eachHeadEl.id
493
+ })) : [];
494
+ if (!columns.some((col) => col.dataIndex === "actions")) {
492
495
  columns.push({
493
496
  title: "Actions",
494
497
  dataIndex: "actions",
495
498
  key: "actions"
496
499
  });
497
500
  }
498
- return /* @__PURE__ */ import_react13.default.createElement(import_react13.default.Fragment, null, /* @__PURE__ */ import_react13.default.createElement(
501
+ return /* @__PURE__ */ import_react13.default.createElement(
499
502
  import_antd11.Table,
500
503
  {
501
504
  columns,
502
- expandable: { defaultExpandedRowKeys: ["0"] },
503
- dataSource
505
+ dataSource,
506
+ pagination: false,
507
+ bordered: true
504
508
  }
505
- ));
509
+ );
506
510
  };
507
511
  // Annotate the CommonJS export names for ESM import in node:
508
512
  0 && (module.exports = {
package/dist/index.mjs CHANGED
@@ -138,27 +138,48 @@ var SelectElement = (props) => {
138
138
  };
139
139
 
140
140
  // src/Components/RadioElement.tsx
141
- import React6 from "react";
141
+ import React6, { useState as useState2 } from "react";
142
142
  import { Radio } from "antd";
143
143
  var RadioElement = (props) => {
144
+ const [isDisabled, setIsDisabled] = useState2(props.disabled);
145
+ const [selectedValue, setSelectedValue] = useState2(props.value);
146
+ let optionType;
147
+ if (props.optionType === "button") {
148
+ optionType = props.optionType;
149
+ }
144
150
  const handleChange = (e) => {
151
+ const selectedVal = e.target.value;
152
+ const selectedOptions = [{ id: selectedVal, value: selectedVal }];
153
+ setSelectedValue(selectedVal);
154
+ setIsDisabled(true);
145
155
  if (props.onChange) {
146
- const selectedVal = e.target.value;
147
- const selectedOptions = [{ id: selectedVal, value: selectedVal }];
148
156
  props.onChange(selectedOptions);
149
157
  }
150
158
  };
151
- return /* @__PURE__ */ React6.createElement(Radio.Group, { name: "radiogroup", defaultValue: 1 }, /* @__PURE__ */ React6.createElement(Radio, { value: 1, onChange: handleChange }, "A"), /* @__PURE__ */ React6.createElement(Radio, { value: 2, onChange: handleChange }, "B"), /* @__PURE__ */ React6.createElement(Radio, { value: 3, onChange: handleChange }, "C"), /* @__PURE__ */ React6.createElement(Radio, { value: 4, onChange: handleChange }, "D"));
159
+ const radioOptions = props.options && props.options.map((option) => ({
160
+ ...option,
161
+ className: selectedValue === option.value ? option.selectedClassName : option.className,
162
+ disabled: isDisabled
163
+ }));
164
+ return /* @__PURE__ */ React6.createElement(React6.Fragment, null, /* @__PURE__ */ React6.createElement("h6", null, "joikdf"), /* @__PURE__ */ React6.createElement(
165
+ Radio.Group,
166
+ {
167
+ options: radioOptions,
168
+ onChange: handleChange,
169
+ optionType,
170
+ className: props.className ? props.className : ""
171
+ }
172
+ ));
152
173
  };
153
174
 
154
175
  // src/Components/Checkbox.tsx
155
- import React7, { useState as useState2 } from "react";
176
+ import React7, { useState as useState3 } from "react";
156
177
  import { Checkbox, Divider } from "antd";
157
178
  var CheckboxGroup = Checkbox.Group;
158
179
  var plainOptions = ["Apple", "Pear", "Orange"];
159
180
  var defaultCheckedList = [];
160
181
  var CheckboxElement = (props) => {
161
- const [checkedList, setCheckedList] = useState2(defaultCheckedList);
182
+ const [checkedList, setCheckedList] = useState3(defaultCheckedList);
162
183
  const checkAll = plainOptions.length === checkedList.length;
163
184
  const handleChange = (list) => {
164
185
  setCheckedList(list);
@@ -312,150 +333,133 @@ import { Button as Button2, Flex as Flex2 } from "antd";
312
333
  var ButtonElement = () => /* @__PURE__ */ React11.createElement(Flex2, { gap: "small" }, /* @__PURE__ */ React11.createElement(Button2, { type: "primary" }, "Primary Button"));
313
334
 
314
335
  // src/Components/AddMoreTable.tsx
315
- import React12, { useState as useState3 } from "react";
316
- import { Table } from "antd";
336
+ import React12, { useEffect, useState as useState4 } from "react";
337
+ import { Table, Button as Button3 } from "antd";
317
338
  import { PlusOutlined, DeleteOutlined } from "@ant-design/icons";
318
339
  var AddMoreTable = (props) => {
319
340
  const { thead, tbody } = props;
320
- const [tableData, setTableData] = useState3({});
321
- const [rows, setRows] = useState3(tbody || []);
322
- function isColumnType(column) {
323
- return column.dataIndex !== void 0;
324
- }
325
- const onHandleChange = (name, value) => {
326
- setTableData((prev) => ({ ...prev, [name]: value }));
327
- console.log(tableData);
328
- };
341
+ const [rows, setRows] = useState4(tbody || []);
329
342
  const onHandleRows = () => {
330
- const lastRow = rows[rows.length - 1];
331
- const newId = lastRow ? lastRow.id + 1 : 1;
343
+ const newId = rows.length > 0 ? rows[rows.length - 1].id + 1 : 1;
332
344
  let newRow = {
333
- ...lastRow,
334
- id: newId
345
+ id: newId,
346
+ label: "Medicine",
347
+ name: "Medicine",
348
+ type: "text",
349
+ variable_data: [
350
+ {
351
+ id: 1,
352
+ Route: { label: "Route", element: "single-select", type: "text" },
353
+ Dose: { label: "Dose", element: "single-select", type: "text" },
354
+ Frequency: { label: "Frequency", element: "single-select", type: "text" },
355
+ When: { label: "When", element: "textarea", type: "text" },
356
+ Duration: { label: "Duration", element: "textarea", type: "text" },
357
+ Instructions: { label: "Instructions", element: "textarea", type: "text" },
358
+ SubRows: { delete: "delete", add: "plus" }
359
+ }
360
+ ]
335
361
  };
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: { delete: "", plus: index === newRow.variable_data.length - 1 ? "" : void 0 }
342
- };
343
- });
344
- newRow.variable_data = updatedVariableData;
345
- }
346
362
  setRows((prevData) => [...prevData, newRow]);
347
363
  };
348
- const onHandleDelete = (index) => {
349
- if (rows.length > 1) {
350
- const remainingRows = rows.filter((eachRow) => eachRow.id !== index);
351
- setRows(remainingRows);
352
- }
364
+ const onHandleDelete = (id) => {
365
+ setRows((prevRows) => prevRows.filter((row) => row.id !== id));
353
366
  };
354
- const onHandleVariableData = (rowId) => {
355
- setRows((prevRows) => prevRows.map((row) => {
356
- if (row.id === rowId) {
357
- const newVariableDataId = row.variable_data.length > 0 ? row.variable_data[row.variable_data.length - 1].id + 1 : 1;
358
- const newVariableData = {
359
- id: newVariableDataId,
360
- Route: {
361
- label: "Route",
362
- element: "single-select",
363
- type: "text"
364
- },
365
- Dose: {
366
- label: "Dose",
367
- element: "single-select",
368
- type: "text"
369
- },
370
- Frequency: {
371
- label: "Frequency",
372
- element: "single-select",
373
- type: "text"
374
- },
375
- When: {
376
- label: "When",
377
- element: "textarea",
378
- type: "text"
379
- },
380
- Duration: {
381
- label: "Duration",
382
- element: "textarea",
383
- type: "text"
384
- },
385
- Instructions: {
386
- label: "Instructions",
387
- element: "textarea",
388
- type: "text"
389
- },
390
- icons: { delete: "", plus: "" }
391
- };
392
- const updatedVariableData = [...row.variable_data, newVariableData].map((item, index, array) => ({
393
- ...item,
394
- icons: { delete: "", plus: index === array.length - 1 ? "" : void 0 }
395
- }));
396
- return {
397
- ...row,
398
- variable_data: updatedVariableData
399
- };
400
- }
401
- return row;
402
- }));
367
+ const onHandleSubRowsAdd = (rowIndex) => {
368
+ setRows((prevRows) => {
369
+ return prevRows.map((row, index) => {
370
+ if (index === rowIndex) {
371
+ const newSubRow = {
372
+ id: row.variable_data.length + 1,
373
+ Route: { label: "Route", element: "single-select", type: "text" },
374
+ Dose: { label: "Dose", element: "single-select", type: "text" },
375
+ Frequency: { label: "Frequency", element: "single-select", type: "text" },
376
+ When: { label: "When", element: "textarea", type: "text" },
377
+ Duration: { label: "Duration", element: "textarea", type: "text" },
378
+ Instructions: { label: "Instructions", element: "textarea", type: "text" },
379
+ SubRows: { delete: "delete", add: "plus" }
380
+ };
381
+ const updatedVariableData = [...row.variable_data, newSubRow];
382
+ return {
383
+ ...row,
384
+ variable_data: updatedVariableData
385
+ };
386
+ }
387
+ return row;
388
+ });
389
+ });
403
390
  };
404
- const columns = thead && thead.length > 0 ? thead.map((eachHeadEl) => ({
405
- title: eachHeadEl.label,
406
- dataIndex: eachHeadEl.name,
407
- key: eachHeadEl.id
408
- })) : [];
409
- const renderInputElement = (element) => {
391
+ const onHandleSubRowsDelete = (rowIndex, subIndex) => {
392
+ setRows((prevRows) => {
393
+ return prevRows.map((row, index) => {
394
+ if (index === rowIndex) {
395
+ const updatedVariableData = row.variable_data.filter((_, i) => i !== subIndex);
396
+ return {
397
+ ...row,
398
+ variable_data: updatedVariableData
399
+ };
400
+ }
401
+ return row;
402
+ });
403
+ });
404
+ };
405
+ useEffect(() => {
406
+ console.log(rows);
407
+ }, [rows]);
408
+ const renderInputElement = (element, value) => {
409
+ if (!element)
410
+ return null;
410
411
  const { element: type, label } = element;
411
412
  if (type === "single-select") {
412
- return /* @__PURE__ */ React12.createElement(SingleSelectElement, { onChange: (value) => onHandleChange(label, value) });
413
+ return /* @__PURE__ */ React12.createElement(SingleSelectElement, { onChange: (value2) => console.log(label, value2), optionType: "", className: void 0 });
413
414
  } else if (type === "textarea") {
414
- return /* @__PURE__ */ React12.createElement(TextareaElement, { onChange: (value) => onHandleChange(label, value) });
415
+ return /* @__PURE__ */ React12.createElement(TextareaElement, { onChange: (value2) => console.log(label, value2), optionType: "", className: void 0 });
415
416
  } else {
416
417
  return null;
417
418
  }
418
419
  };
419
- const dataSource = rows.map((eachRow, index) => {
420
- const rowElements = {};
421
- if (eachRow.element && eachRow.label) {
422
- rowElements[eachRow.label] = renderInputElement(eachRow);
423
- }
424
- if (eachRow.variable_data && Array.isArray(eachRow.variable_data)) {
425
- eachRow.variable_data.forEach((variable, varIndex) => {
426
- Object.entries(variable).forEach(([key, value]) => {
427
- if (value && value.element && value.label) {
428
- rowElements[value.label] = renderInputElement(value);
429
- }
430
- if (key === "icons") {
431
- 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)));
432
- }
433
- });
434
- });
435
- }
436
- return {
437
- key: index.toString(),
438
- "#": index + 1,
439
- ...eachRow,
440
- ...rowElements,
441
- actions: /* @__PURE__ */ React12.createElement(React12.Fragment, null, /* @__PURE__ */ React12.createElement("button", { onClick: () => onHandleDelete(eachRow.id) }, /* @__PURE__ */ React12.createElement(DeleteOutlined, null)), index === rows.length - 1 && /* @__PURE__ */ React12.createElement("button", { onClick: onHandleRows }, /* @__PURE__ */ React12.createElement(PlusOutlined, null)))
420
+ const dataSource = rows.map((eachRow, rowIndex) => {
421
+ const rowData = {
422
+ key: eachRow.id,
423
+ "#": rowIndex + 1,
424
+ "Medicine": renderInputElement({
425
+ element: eachRow.element,
426
+ label: eachRow.label
427
+ })
442
428
  };
429
+ rowData["Medicine"] = renderInputElement(eachRow.variable_data[0].Medicine);
430
+ eachRow.variable_data.map((variable, subIndex) => {
431
+ Object.keys(variable).forEach((key) => {
432
+ if (key === "SubRows") {
433
+ rowData[`${key}`] = /* @__PURE__ */ React12.createElement("div", { key: subIndex }, eachRow.variable_data.length > 1 && /* @__PURE__ */ React12.createElement(Button3, { onClick: () => onHandleSubRowsDelete(rowIndex, subIndex) }, /* @__PURE__ */ React12.createElement(DeleteOutlined, null)), subIndex === eachRow.variable_data.length - 1 && /* @__PURE__ */ React12.createElement(Button3, { onClick: () => onHandleSubRowsAdd(rowIndex) }, /* @__PURE__ */ React12.createElement(PlusOutlined, null)));
434
+ } else {
435
+ rowData[`${key}`] = renderInputElement(variable[key]);
436
+ }
437
+ });
438
+ });
439
+ rowData.actions = /* @__PURE__ */ React12.createElement("div", null, /* @__PURE__ */ React12.createElement(Button3, { onClick: () => onHandleDelete(eachRow.id) }, /* @__PURE__ */ React12.createElement(DeleteOutlined, null)), rowIndex === rows.length - 1 && /* @__PURE__ */ React12.createElement(Button3, { onClick: onHandleRows }, /* @__PURE__ */ React12.createElement(PlusOutlined, null)));
440
+ return rowData;
443
441
  });
444
- if (!columns.some((col) => isColumnType(col) && col.dataIndex === "actions")) {
442
+ const columns = thead && thead.length > 0 ? thead.map((eachHeadEl) => ({
443
+ title: eachHeadEl.label,
444
+ dataIndex: eachHeadEl.name,
445
+ key: eachHeadEl.id
446
+ })) : [];
447
+ if (!columns.some((col) => col.dataIndex === "actions")) {
445
448
  columns.push({
446
449
  title: "Actions",
447
450
  dataIndex: "actions",
448
451
  key: "actions"
449
452
  });
450
453
  }
451
- return /* @__PURE__ */ React12.createElement(React12.Fragment, null, /* @__PURE__ */ React12.createElement(
454
+ return /* @__PURE__ */ React12.createElement(
452
455
  Table,
453
456
  {
454
457
  columns,
455
- expandable: { defaultExpandedRowKeys: ["0"] },
456
- dataSource
458
+ dataSource,
459
+ pagination: false,
460
+ bordered: true
457
461
  }
458
- ));
462
+ );
459
463
  };
460
464
  export {
461
465
  AddMoreTable,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@apexcura/ui-components",
3
- "version": "0.0.12-Beta21",
3
+ "version": "0.0.12-Beta23",
4
4
  "description": "Apex cura React components library",
5
5
  "keywords": [
6
6
  "apex cura",