@apexcura/ui-components 0.0.12-Beta4 → 0.0.12-Beta41
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 +9 -3
- package/dist/index.d.ts +9 -3
- package/dist/index.js +157 -55
- package/dist/index.mjs +162 -60
- package/package.json +1 -1
package/dist/index.d.mts
CHANGED
|
@@ -1,28 +1,34 @@
|
|
|
1
1
|
import React$1 from 'react';
|
|
2
2
|
|
|
3
3
|
type ElementType = {
|
|
4
|
+
selectedStyle: boolean;
|
|
5
|
+
style: boolean;
|
|
6
|
+
className: string | undefined;
|
|
4
7
|
placeholder?: string;
|
|
5
8
|
addonBefore?: React.ReactNode;
|
|
6
9
|
defaultValue?: string;
|
|
7
10
|
disabled?: boolean;
|
|
8
11
|
prefix?: React.ReactNode;
|
|
9
12
|
type?: string;
|
|
10
|
-
value?: string | number | boolean | any[];
|
|
13
|
+
value?: string | number | boolean | any[] | null;
|
|
11
14
|
status?: "error" | "warning";
|
|
12
15
|
styles?: React.CSSProperties;
|
|
13
|
-
classNames?: string;
|
|
14
16
|
variant?: "outlined" | "borderless" | "filled";
|
|
15
17
|
label?: string;
|
|
16
18
|
name?: string;
|
|
17
19
|
suffix?: React.ReactNode;
|
|
18
20
|
maxLength?: number;
|
|
19
21
|
fieldNames?: any[];
|
|
22
|
+
options?: any[];
|
|
20
23
|
onChange?: (value: string | number | boolean | any[]) => void;
|
|
21
24
|
dropDownOptions?: any[];
|
|
22
25
|
id?: number;
|
|
23
26
|
thead?: any[];
|
|
24
27
|
tbody?: any[];
|
|
25
28
|
variable_data?: any[];
|
|
29
|
+
optionType?: string;
|
|
30
|
+
selectedClassName?: string;
|
|
31
|
+
action?: React.MouseEventHandler<HTMLElement> | string;
|
|
26
32
|
};
|
|
27
33
|
|
|
28
34
|
interface ElementExecuterProps$3 extends ElementType {
|
|
@@ -67,7 +73,7 @@ declare const SingleSelectElement: (props: ElementType) => React$1.JSX.Element;
|
|
|
67
73
|
|
|
68
74
|
declare const MultipleSelectElement: (props: ElementType) => React$1.JSX.Element;
|
|
69
75
|
|
|
70
|
-
declare const ButtonElement: () => React$1.JSX.Element;
|
|
76
|
+
declare const ButtonElement: (props: ElementType) => React$1.JSX.Element;
|
|
71
77
|
|
|
72
78
|
declare const AddMoreTable: (props: ElementType) => React$1.JSX.Element;
|
|
73
79
|
|
package/dist/index.d.ts
CHANGED
|
@@ -1,28 +1,34 @@
|
|
|
1
1
|
import React$1 from 'react';
|
|
2
2
|
|
|
3
3
|
type ElementType = {
|
|
4
|
+
selectedStyle: boolean;
|
|
5
|
+
style: boolean;
|
|
6
|
+
className: string | undefined;
|
|
4
7
|
placeholder?: string;
|
|
5
8
|
addonBefore?: React.ReactNode;
|
|
6
9
|
defaultValue?: string;
|
|
7
10
|
disabled?: boolean;
|
|
8
11
|
prefix?: React.ReactNode;
|
|
9
12
|
type?: string;
|
|
10
|
-
value?: string | number | boolean | any[];
|
|
13
|
+
value?: string | number | boolean | any[] | null;
|
|
11
14
|
status?: "error" | "warning";
|
|
12
15
|
styles?: React.CSSProperties;
|
|
13
|
-
classNames?: string;
|
|
14
16
|
variant?: "outlined" | "borderless" | "filled";
|
|
15
17
|
label?: string;
|
|
16
18
|
name?: string;
|
|
17
19
|
suffix?: React.ReactNode;
|
|
18
20
|
maxLength?: number;
|
|
19
21
|
fieldNames?: any[];
|
|
22
|
+
options?: any[];
|
|
20
23
|
onChange?: (value: string | number | boolean | any[]) => void;
|
|
21
24
|
dropDownOptions?: any[];
|
|
22
25
|
id?: number;
|
|
23
26
|
thead?: any[];
|
|
24
27
|
tbody?: any[];
|
|
25
28
|
variable_data?: any[];
|
|
29
|
+
optionType?: string;
|
|
30
|
+
selectedClassName?: string;
|
|
31
|
+
action?: React.MouseEventHandler<HTMLElement> | string;
|
|
26
32
|
};
|
|
27
33
|
|
|
28
34
|
interface ElementExecuterProps$3 extends ElementType {
|
|
@@ -67,7 +73,7 @@ declare const SingleSelectElement: (props: ElementType) => React$1.JSX.Element;
|
|
|
67
73
|
|
|
68
74
|
declare const MultipleSelectElement: (props: ElementType) => React$1.JSX.Element;
|
|
69
75
|
|
|
70
|
-
declare const ButtonElement: () => React$1.JSX.Element;
|
|
76
|
+
declare const ButtonElement: (props: ElementType) => React$1.JSX.Element;
|
|
71
77
|
|
|
72
78
|
declare const AddMoreTable: (props: ElementType) => React$1.JSX.Element;
|
|
73
79
|
|
package/dist/index.js
CHANGED
|
@@ -62,7 +62,7 @@ var TextElement = (props) => {
|
|
|
62
62
|
type: props.type,
|
|
63
63
|
status: props.status,
|
|
64
64
|
style: props.styles,
|
|
65
|
-
className: props.
|
|
65
|
+
className: props.className,
|
|
66
66
|
variant: props.variant,
|
|
67
67
|
name: props.name,
|
|
68
68
|
onChange: (e) => props.onChange(e.target.value)
|
|
@@ -103,7 +103,7 @@ var NumberElement = (props) => {
|
|
|
103
103
|
const newValue = e.target.value.replace(/[^0-9]/g, "");
|
|
104
104
|
props.onChange(newValue);
|
|
105
105
|
};
|
|
106
|
-
return /* @__PURE__ */ import_react3.default.createElement(
|
|
106
|
+
return /* @__PURE__ */ import_react3.default.createElement(
|
|
107
107
|
import_antd3.Input,
|
|
108
108
|
{
|
|
109
109
|
placeholder: props.placeholder,
|
|
@@ -115,13 +115,12 @@ var NumberElement = (props) => {
|
|
|
115
115
|
prefix: props.prefix,
|
|
116
116
|
type: props.type,
|
|
117
117
|
status: props.status,
|
|
118
|
-
|
|
119
|
-
className: props.classNames,
|
|
118
|
+
className: props.className,
|
|
120
119
|
variant: props.variant,
|
|
121
120
|
name: props.name,
|
|
122
121
|
onChange: handleInputChange
|
|
123
122
|
}
|
|
124
|
-
)
|
|
123
|
+
);
|
|
125
124
|
};
|
|
126
125
|
|
|
127
126
|
// src/Components/TextareaElement.tsx
|
|
@@ -129,7 +128,7 @@ var import_react4 = __toESM(require("react"));
|
|
|
129
128
|
var import_antd4 = require("antd");
|
|
130
129
|
var { TextArea } = import_antd4.Input;
|
|
131
130
|
var TextareaElement = (props) => {
|
|
132
|
-
return /* @__PURE__ */ import_react4.default.createElement(import_antd4.Flex,
|
|
131
|
+
return /* @__PURE__ */ import_react4.default.createElement(import_antd4.Flex, null, /* @__PURE__ */ import_react4.default.createElement(
|
|
133
132
|
TextArea,
|
|
134
133
|
{
|
|
135
134
|
placeholder: props.placeholder,
|
|
@@ -138,8 +137,7 @@ var TextareaElement = (props) => {
|
|
|
138
137
|
disabled: props.disabled,
|
|
139
138
|
id: props.name,
|
|
140
139
|
status: props.status,
|
|
141
|
-
|
|
142
|
-
className: props.classNames,
|
|
140
|
+
className: props.className,
|
|
143
141
|
variant: props.variant,
|
|
144
142
|
name: props.name,
|
|
145
143
|
showCount: true,
|
|
@@ -177,7 +175,7 @@ var SelectElement = (props) => {
|
|
|
177
175
|
id: props.name,
|
|
178
176
|
status: props.status,
|
|
179
177
|
style: props.styles,
|
|
180
|
-
className: props.
|
|
178
|
+
className: props.className,
|
|
181
179
|
variant: props.variant,
|
|
182
180
|
onChange: handleChange
|
|
183
181
|
}
|
|
@@ -188,14 +186,44 @@ var SelectElement = (props) => {
|
|
|
188
186
|
var import_react6 = __toESM(require("react"));
|
|
189
187
|
var import_antd6 = require("antd");
|
|
190
188
|
var RadioElement = (props) => {
|
|
189
|
+
const [isDisabled, setIsDisabled] = (0, import_react6.useState)(props.disabled);
|
|
190
|
+
const [selectedValue, setSelectedValue] = (0, import_react6.useState)(props.value);
|
|
191
|
+
let optionType;
|
|
192
|
+
if (props.optionType === "button") {
|
|
193
|
+
optionType = props.optionType;
|
|
194
|
+
}
|
|
191
195
|
const handleChange = (e) => {
|
|
196
|
+
const selectedVal = e.target.value;
|
|
197
|
+
const selectedOptions = [{ id: selectedVal, value: selectedVal }];
|
|
198
|
+
setSelectedValue(selectedVal);
|
|
199
|
+
setIsDisabled(true);
|
|
192
200
|
if (props.onChange) {
|
|
193
|
-
const selectedVal = e.target.value;
|
|
194
|
-
const selectedOptions = [{ id: selectedVal, value: selectedVal }];
|
|
195
201
|
props.onChange(selectedOptions);
|
|
196
202
|
}
|
|
197
203
|
};
|
|
198
|
-
|
|
204
|
+
const getButtonStyle = (option) => {
|
|
205
|
+
return selectedValue === option.value ? option.selectedClassName : option.className;
|
|
206
|
+
};
|
|
207
|
+
return /* @__PURE__ */ import_react6.default.createElement("div", null, /* @__PURE__ */ import_react6.default.createElement(
|
|
208
|
+
import_antd6.Radio.Group,
|
|
209
|
+
{
|
|
210
|
+
onChange: handleChange,
|
|
211
|
+
optionType,
|
|
212
|
+
className: props.className ? props.className : "",
|
|
213
|
+
value: selectedValue
|
|
214
|
+
},
|
|
215
|
+
props.options && props.options.map((option) => /* @__PURE__ */ import_react6.default.createElement(
|
|
216
|
+
import_antd6.Radio,
|
|
217
|
+
{
|
|
218
|
+
key: option.value,
|
|
219
|
+
value: option.value,
|
|
220
|
+
disabled: isDisabled && selectedValue !== option.value,
|
|
221
|
+
className: getButtonStyle(option),
|
|
222
|
+
style: { pointerEvents: isDisabled && selectedValue !== option.value ? "none" : "auto" }
|
|
223
|
+
},
|
|
224
|
+
option.label
|
|
225
|
+
))
|
|
226
|
+
));
|
|
199
227
|
};
|
|
200
228
|
|
|
201
229
|
// src/Components/Checkbox.tsx
|
|
@@ -229,7 +257,7 @@ var CheckboxElement = (props) => {
|
|
|
229
257
|
disabled: props.disabled,
|
|
230
258
|
id: props.name,
|
|
231
259
|
style: props.styles,
|
|
232
|
-
className: props.
|
|
260
|
+
className: props.className,
|
|
233
261
|
onChange: onHandleAllChanges,
|
|
234
262
|
checked: checkAll
|
|
235
263
|
},
|
|
@@ -239,7 +267,7 @@ var CheckboxElement = (props) => {
|
|
|
239
267
|
{
|
|
240
268
|
disabled: props.disabled,
|
|
241
269
|
style: props.styles,
|
|
242
|
-
className: props.
|
|
270
|
+
className: props.className,
|
|
243
271
|
options: plainOptions,
|
|
244
272
|
value: checkedList,
|
|
245
273
|
onChange: handleChange
|
|
@@ -356,67 +384,141 @@ var MultipleSelectElement = (props) => {
|
|
|
356
384
|
// src/Components/Button.tsx
|
|
357
385
|
var import_react12 = __toESM(require("react"));
|
|
358
386
|
var import_antd10 = require("antd");
|
|
359
|
-
var ButtonElement = () =>
|
|
387
|
+
var ButtonElement = (props) => {
|
|
388
|
+
const handleClick = typeof props.action === "string" ? () => {
|
|
389
|
+
console.log("Performing action:", props.action);
|
|
390
|
+
} : props.action;
|
|
391
|
+
return /* @__PURE__ */ import_react12.default.createElement(import_antd10.Flex, null, /* @__PURE__ */ import_react12.default.createElement(import_antd10.Button, { onClick: handleClick, className: props.className }, props.label));
|
|
392
|
+
};
|
|
360
393
|
|
|
361
394
|
// src/Components/AddMoreTable.tsx
|
|
362
395
|
var import_react13 = __toESM(require("react"));
|
|
363
396
|
var import_antd11 = require("antd");
|
|
397
|
+
var import_icons2 = require("@ant-design/icons");
|
|
364
398
|
var AddMoreTable = (props) => {
|
|
365
399
|
const { thead, tbody } = props;
|
|
366
|
-
const [
|
|
367
|
-
const
|
|
368
|
-
|
|
369
|
-
|
|
400
|
+
const [rows, setRows] = (0, import_react13.useState)(tbody || []);
|
|
401
|
+
const onHandleRows = () => {
|
|
402
|
+
const newId = rows.length > 0 ? rows[rows.length - 1].id + 1 : 1;
|
|
403
|
+
let newRow = {
|
|
404
|
+
id: newId,
|
|
405
|
+
label: "Medicine",
|
|
406
|
+
name: "Medicine",
|
|
407
|
+
type: "text",
|
|
408
|
+
variable_data: [
|
|
409
|
+
{
|
|
410
|
+
id: 1,
|
|
411
|
+
Route: { label: "Route", element: "single-select", type: "text" },
|
|
412
|
+
Dose: { label: "Dose", element: "single-select", type: "text" },
|
|
413
|
+
Frequency: { label: "Frequency", element: "single-select", type: "text" },
|
|
414
|
+
When: { label: "When", element: "textarea", type: "text" },
|
|
415
|
+
Duration: { label: "Duration", element: "textarea", type: "text" },
|
|
416
|
+
Instructions: { label: "Instructions", element: "textarea", type: "text" },
|
|
417
|
+
SubRows: { delete: "delete", add: "plus" }
|
|
418
|
+
}
|
|
419
|
+
]
|
|
420
|
+
};
|
|
421
|
+
setRows((prevData) => [...prevData, newRow]);
|
|
370
422
|
};
|
|
371
|
-
const
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
423
|
+
const onHandleDelete = (id) => {
|
|
424
|
+
setRows((prevRows) => prevRows.filter((row) => row.id !== id));
|
|
425
|
+
};
|
|
426
|
+
const onHandleSubRowsAdd = (rowIndex) => {
|
|
427
|
+
setRows((prevRows) => {
|
|
428
|
+
return prevRows.map((row, index) => {
|
|
429
|
+
if (index === rowIndex) {
|
|
430
|
+
const newSubRow = {
|
|
431
|
+
id: row.variable_data.length + 1,
|
|
432
|
+
Route: { label: "Route", element: "single-select", type: "text" },
|
|
433
|
+
Dose: { label: "Dose", element: "single-select", type: "text" },
|
|
434
|
+
Frequency: { label: "Frequency", element: "single-select", type: "text" },
|
|
435
|
+
When: { label: "When", element: "textarea", type: "text" },
|
|
436
|
+
Duration: { label: "Duration", element: "textarea", type: "text" },
|
|
437
|
+
Instructions: { label: "Instructions", element: "textarea", type: "text" },
|
|
438
|
+
SubRows: { delete: "delete", add: "plus" }
|
|
439
|
+
};
|
|
440
|
+
const updatedVariableData = [...row.variable_data, newSubRow];
|
|
441
|
+
return {
|
|
442
|
+
...row,
|
|
443
|
+
variable_data: updatedVariableData
|
|
444
|
+
};
|
|
445
|
+
}
|
|
446
|
+
return row;
|
|
447
|
+
});
|
|
448
|
+
});
|
|
449
|
+
};
|
|
450
|
+
const onHandleSubRowsDelete = (rowIndex, subIndex) => {
|
|
451
|
+
setRows((prevRows) => {
|
|
452
|
+
return prevRows.map((row, index) => {
|
|
453
|
+
if (index === rowIndex) {
|
|
454
|
+
const updatedVariableData = row.variable_data.filter((_, i) => i !== subIndex);
|
|
455
|
+
return {
|
|
456
|
+
...row,
|
|
457
|
+
variable_data: updatedVariableData
|
|
458
|
+
};
|
|
459
|
+
}
|
|
460
|
+
return row;
|
|
461
|
+
});
|
|
462
|
+
});
|
|
463
|
+
};
|
|
464
|
+
(0, import_react13.useEffect)(() => {
|
|
465
|
+
console.log(rows);
|
|
466
|
+
}, [rows]);
|
|
467
|
+
const renderInputElement = (element, value) => {
|
|
468
|
+
if (!element)
|
|
469
|
+
return null;
|
|
377
470
|
const { element: type, label } = element;
|
|
378
|
-
console.log("type....", type);
|
|
379
471
|
if (type === "single-select") {
|
|
380
|
-
return /* @__PURE__ */ import_react13.default.createElement(SingleSelectElement, { onChange: (
|
|
472
|
+
return /* @__PURE__ */ import_react13.default.createElement(SingleSelectElement, { onChange: (value2) => console.log(label, value2), optionType: "", className: void 0, selectedStyle: false, style: false });
|
|
381
473
|
} else if (type === "textarea") {
|
|
382
|
-
return /* @__PURE__ */ import_react13.default.createElement(TextareaElement, { onChange: (
|
|
474
|
+
return /* @__PURE__ */ import_react13.default.createElement(TextareaElement, { onChange: (value2) => console.log(label, value2), optionType: "", className: void 0, selectedStyle: false, style: false });
|
|
383
475
|
} else {
|
|
384
476
|
return null;
|
|
385
477
|
}
|
|
386
478
|
};
|
|
387
|
-
const dataSource =
|
|
388
|
-
const
|
|
389
|
-
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
395
|
-
return acc;
|
|
396
|
-
}
|
|
397
|
-
acc[curr.label] = renderInputElement(curr);
|
|
398
|
-
return acc;
|
|
399
|
-
}, {}) : {};
|
|
400
|
-
return {
|
|
401
|
-
key: index.toString(),
|
|
402
|
-
"#": index + 1,
|
|
403
|
-
...eachRow,
|
|
404
|
-
...rowElements,
|
|
405
|
-
...variableData
|
|
479
|
+
const dataSource = rows.map((eachRow, rowIndex) => {
|
|
480
|
+
const rowData = {
|
|
481
|
+
key: eachRow.id,
|
|
482
|
+
"#": rowIndex + 1,
|
|
483
|
+
"Medicine": renderInputElement({
|
|
484
|
+
element: eachRow.element,
|
|
485
|
+
label: eachRow.label
|
|
486
|
+
})
|
|
406
487
|
};
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
410
|
-
|
|
488
|
+
rowData["Medicine"] = renderInputElement(eachRow.variable_data[0].Medicine);
|
|
489
|
+
eachRow.variable_data.map((variable, subIndex) => {
|
|
490
|
+
Object.keys(variable).forEach((key) => {
|
|
491
|
+
if (key === "SubRows") {
|
|
492
|
+
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)));
|
|
493
|
+
} else {
|
|
494
|
+
rowData[`${key}`] = renderInputElement(variable[key]);
|
|
495
|
+
}
|
|
496
|
+
});
|
|
497
|
+
});
|
|
498
|
+
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)));
|
|
499
|
+
return rowData;
|
|
500
|
+
});
|
|
501
|
+
const columns = thead && thead.length > 0 ? thead.map((eachHeadEl) => ({
|
|
502
|
+
title: eachHeadEl.label,
|
|
503
|
+
dataIndex: eachHeadEl.name,
|
|
504
|
+
key: eachHeadEl.id
|
|
505
|
+
})) : [];
|
|
506
|
+
if (!columns.some((col) => col.dataIndex === "actions")) {
|
|
507
|
+
columns.push({
|
|
508
|
+
title: "Actions",
|
|
509
|
+
dataIndex: "actions",
|
|
510
|
+
key: "actions"
|
|
511
|
+
});
|
|
411
512
|
}
|
|
412
|
-
return /* @__PURE__ */ import_react13.default.createElement(
|
|
513
|
+
return /* @__PURE__ */ import_react13.default.createElement(
|
|
413
514
|
import_antd11.Table,
|
|
414
515
|
{
|
|
415
516
|
columns,
|
|
416
|
-
|
|
417
|
-
|
|
517
|
+
dataSource,
|
|
518
|
+
pagination: false,
|
|
519
|
+
bordered: true
|
|
418
520
|
}
|
|
419
|
-
)
|
|
521
|
+
);
|
|
420
522
|
};
|
|
421
523
|
// Annotate the CommonJS export names for ESM import in node:
|
|
422
524
|
0 && (module.exports = {
|
package/dist/index.mjs
CHANGED
|
@@ -15,7 +15,7 @@ var TextElement = (props) => {
|
|
|
15
15
|
type: props.type,
|
|
16
16
|
status: props.status,
|
|
17
17
|
style: props.styles,
|
|
18
|
-
className: props.
|
|
18
|
+
className: props.className,
|
|
19
19
|
variant: props.variant,
|
|
20
20
|
name: props.name,
|
|
21
21
|
onChange: (e) => props.onChange(e.target.value)
|
|
@@ -56,7 +56,7 @@ var NumberElement = (props) => {
|
|
|
56
56
|
const newValue = e.target.value.replace(/[^0-9]/g, "");
|
|
57
57
|
props.onChange(newValue);
|
|
58
58
|
};
|
|
59
|
-
return /* @__PURE__ */ React3.createElement(
|
|
59
|
+
return /* @__PURE__ */ React3.createElement(
|
|
60
60
|
AntInput2,
|
|
61
61
|
{
|
|
62
62
|
placeholder: props.placeholder,
|
|
@@ -68,13 +68,12 @@ var NumberElement = (props) => {
|
|
|
68
68
|
prefix: props.prefix,
|
|
69
69
|
type: props.type,
|
|
70
70
|
status: props.status,
|
|
71
|
-
|
|
72
|
-
className: props.classNames,
|
|
71
|
+
className: props.className,
|
|
73
72
|
variant: props.variant,
|
|
74
73
|
name: props.name,
|
|
75
74
|
onChange: handleInputChange
|
|
76
75
|
}
|
|
77
|
-
)
|
|
76
|
+
);
|
|
78
77
|
};
|
|
79
78
|
|
|
80
79
|
// src/Components/TextareaElement.tsx
|
|
@@ -82,7 +81,7 @@ import React4 from "react";
|
|
|
82
81
|
import { Flex, Input as Input2 } from "antd";
|
|
83
82
|
var { TextArea } = Input2;
|
|
84
83
|
var TextareaElement = (props) => {
|
|
85
|
-
return /* @__PURE__ */ React4.createElement(Flex,
|
|
84
|
+
return /* @__PURE__ */ React4.createElement(Flex, null, /* @__PURE__ */ React4.createElement(
|
|
86
85
|
TextArea,
|
|
87
86
|
{
|
|
88
87
|
placeholder: props.placeholder,
|
|
@@ -91,8 +90,7 @@ var TextareaElement = (props) => {
|
|
|
91
90
|
disabled: props.disabled,
|
|
92
91
|
id: props.name,
|
|
93
92
|
status: props.status,
|
|
94
|
-
|
|
95
|
-
className: props.classNames,
|
|
93
|
+
className: props.className,
|
|
96
94
|
variant: props.variant,
|
|
97
95
|
name: props.name,
|
|
98
96
|
showCount: true,
|
|
@@ -130,7 +128,7 @@ var SelectElement = (props) => {
|
|
|
130
128
|
id: props.name,
|
|
131
129
|
status: props.status,
|
|
132
130
|
style: props.styles,
|
|
133
|
-
className: props.
|
|
131
|
+
className: props.className,
|
|
134
132
|
variant: props.variant,
|
|
135
133
|
onChange: handleChange
|
|
136
134
|
}
|
|
@@ -138,27 +136,57 @@ var SelectElement = (props) => {
|
|
|
138
136
|
};
|
|
139
137
|
|
|
140
138
|
// src/Components/RadioElement.tsx
|
|
141
|
-
import React6 from "react";
|
|
139
|
+
import React6, { useState as useState2 } from "react";
|
|
142
140
|
import { Radio } from "antd";
|
|
143
141
|
var RadioElement = (props) => {
|
|
142
|
+
const [isDisabled, setIsDisabled] = useState2(props.disabled);
|
|
143
|
+
const [selectedValue, setSelectedValue] = useState2(props.value);
|
|
144
|
+
let optionType;
|
|
145
|
+
if (props.optionType === "button") {
|
|
146
|
+
optionType = props.optionType;
|
|
147
|
+
}
|
|
144
148
|
const handleChange = (e) => {
|
|
149
|
+
const selectedVal = e.target.value;
|
|
150
|
+
const selectedOptions = [{ id: selectedVal, value: selectedVal }];
|
|
151
|
+
setSelectedValue(selectedVal);
|
|
152
|
+
setIsDisabled(true);
|
|
145
153
|
if (props.onChange) {
|
|
146
|
-
const selectedVal = e.target.value;
|
|
147
|
-
const selectedOptions = [{ id: selectedVal, value: selectedVal }];
|
|
148
154
|
props.onChange(selectedOptions);
|
|
149
155
|
}
|
|
150
156
|
};
|
|
151
|
-
|
|
157
|
+
const getButtonStyle = (option) => {
|
|
158
|
+
return selectedValue === option.value ? option.selectedClassName : option.className;
|
|
159
|
+
};
|
|
160
|
+
return /* @__PURE__ */ React6.createElement("div", null, /* @__PURE__ */ React6.createElement(
|
|
161
|
+
Radio.Group,
|
|
162
|
+
{
|
|
163
|
+
onChange: handleChange,
|
|
164
|
+
optionType,
|
|
165
|
+
className: props.className ? props.className : "",
|
|
166
|
+
value: selectedValue
|
|
167
|
+
},
|
|
168
|
+
props.options && props.options.map((option) => /* @__PURE__ */ React6.createElement(
|
|
169
|
+
Radio,
|
|
170
|
+
{
|
|
171
|
+
key: option.value,
|
|
172
|
+
value: option.value,
|
|
173
|
+
disabled: isDisabled && selectedValue !== option.value,
|
|
174
|
+
className: getButtonStyle(option),
|
|
175
|
+
style: { pointerEvents: isDisabled && selectedValue !== option.value ? "none" : "auto" }
|
|
176
|
+
},
|
|
177
|
+
option.label
|
|
178
|
+
))
|
|
179
|
+
));
|
|
152
180
|
};
|
|
153
181
|
|
|
154
182
|
// src/Components/Checkbox.tsx
|
|
155
|
-
import React7, { useState as
|
|
183
|
+
import React7, { useState as useState3 } from "react";
|
|
156
184
|
import { Checkbox, Divider } from "antd";
|
|
157
185
|
var CheckboxGroup = Checkbox.Group;
|
|
158
186
|
var plainOptions = ["Apple", "Pear", "Orange"];
|
|
159
187
|
var defaultCheckedList = [];
|
|
160
188
|
var CheckboxElement = (props) => {
|
|
161
|
-
const [checkedList, setCheckedList] =
|
|
189
|
+
const [checkedList, setCheckedList] = useState3(defaultCheckedList);
|
|
162
190
|
const checkAll = plainOptions.length === checkedList.length;
|
|
163
191
|
const handleChange = (list) => {
|
|
164
192
|
setCheckedList(list);
|
|
@@ -182,7 +210,7 @@ var CheckboxElement = (props) => {
|
|
|
182
210
|
disabled: props.disabled,
|
|
183
211
|
id: props.name,
|
|
184
212
|
style: props.styles,
|
|
185
|
-
className: props.
|
|
213
|
+
className: props.className,
|
|
186
214
|
onChange: onHandleAllChanges,
|
|
187
215
|
checked: checkAll
|
|
188
216
|
},
|
|
@@ -192,7 +220,7 @@ var CheckboxElement = (props) => {
|
|
|
192
220
|
{
|
|
193
221
|
disabled: props.disabled,
|
|
194
222
|
style: props.styles,
|
|
195
|
-
className: props.
|
|
223
|
+
className: props.className,
|
|
196
224
|
options: plainOptions,
|
|
197
225
|
value: checkedList,
|
|
198
226
|
onChange: handleChange
|
|
@@ -309,67 +337,141 @@ var MultipleSelectElement = (props) => {
|
|
|
309
337
|
// src/Components/Button.tsx
|
|
310
338
|
import React11 from "react";
|
|
311
339
|
import { Button as Button2, Flex as Flex2 } from "antd";
|
|
312
|
-
var ButtonElement = () =>
|
|
340
|
+
var ButtonElement = (props) => {
|
|
341
|
+
const handleClick = typeof props.action === "string" ? () => {
|
|
342
|
+
console.log("Performing action:", props.action);
|
|
343
|
+
} : props.action;
|
|
344
|
+
return /* @__PURE__ */ React11.createElement(Flex2, null, /* @__PURE__ */ React11.createElement(Button2, { onClick: handleClick, className: props.className }, props.label));
|
|
345
|
+
};
|
|
313
346
|
|
|
314
347
|
// src/Components/AddMoreTable.tsx
|
|
315
|
-
import React12, { useState as
|
|
316
|
-
import { Table } from "antd";
|
|
348
|
+
import React12, { useEffect, useState as useState4 } from "react";
|
|
349
|
+
import { Table, Button as Button3 } from "antd";
|
|
350
|
+
import { PlusOutlined, DeleteOutlined } from "@ant-design/icons";
|
|
317
351
|
var AddMoreTable = (props) => {
|
|
318
352
|
const { thead, tbody } = props;
|
|
319
|
-
const [
|
|
320
|
-
const
|
|
321
|
-
|
|
322
|
-
|
|
353
|
+
const [rows, setRows] = useState4(tbody || []);
|
|
354
|
+
const onHandleRows = () => {
|
|
355
|
+
const newId = rows.length > 0 ? rows[rows.length - 1].id + 1 : 1;
|
|
356
|
+
let newRow = {
|
|
357
|
+
id: newId,
|
|
358
|
+
label: "Medicine",
|
|
359
|
+
name: "Medicine",
|
|
360
|
+
type: "text",
|
|
361
|
+
variable_data: [
|
|
362
|
+
{
|
|
363
|
+
id: 1,
|
|
364
|
+
Route: { label: "Route", element: "single-select", type: "text" },
|
|
365
|
+
Dose: { label: "Dose", element: "single-select", type: "text" },
|
|
366
|
+
Frequency: { label: "Frequency", element: "single-select", type: "text" },
|
|
367
|
+
When: { label: "When", element: "textarea", type: "text" },
|
|
368
|
+
Duration: { label: "Duration", element: "textarea", type: "text" },
|
|
369
|
+
Instructions: { label: "Instructions", element: "textarea", type: "text" },
|
|
370
|
+
SubRows: { delete: "delete", add: "plus" }
|
|
371
|
+
}
|
|
372
|
+
]
|
|
373
|
+
};
|
|
374
|
+
setRows((prevData) => [...prevData, newRow]);
|
|
323
375
|
};
|
|
324
|
-
const
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
376
|
+
const onHandleDelete = (id) => {
|
|
377
|
+
setRows((prevRows) => prevRows.filter((row) => row.id !== id));
|
|
378
|
+
};
|
|
379
|
+
const onHandleSubRowsAdd = (rowIndex) => {
|
|
380
|
+
setRows((prevRows) => {
|
|
381
|
+
return prevRows.map((row, index) => {
|
|
382
|
+
if (index === rowIndex) {
|
|
383
|
+
const newSubRow = {
|
|
384
|
+
id: row.variable_data.length + 1,
|
|
385
|
+
Route: { label: "Route", element: "single-select", type: "text" },
|
|
386
|
+
Dose: { label: "Dose", element: "single-select", type: "text" },
|
|
387
|
+
Frequency: { label: "Frequency", element: "single-select", type: "text" },
|
|
388
|
+
When: { label: "When", element: "textarea", type: "text" },
|
|
389
|
+
Duration: { label: "Duration", element: "textarea", type: "text" },
|
|
390
|
+
Instructions: { label: "Instructions", element: "textarea", type: "text" },
|
|
391
|
+
SubRows: { delete: "delete", add: "plus" }
|
|
392
|
+
};
|
|
393
|
+
const updatedVariableData = [...row.variable_data, newSubRow];
|
|
394
|
+
return {
|
|
395
|
+
...row,
|
|
396
|
+
variable_data: updatedVariableData
|
|
397
|
+
};
|
|
398
|
+
}
|
|
399
|
+
return row;
|
|
400
|
+
});
|
|
401
|
+
});
|
|
402
|
+
};
|
|
403
|
+
const onHandleSubRowsDelete = (rowIndex, subIndex) => {
|
|
404
|
+
setRows((prevRows) => {
|
|
405
|
+
return prevRows.map((row, index) => {
|
|
406
|
+
if (index === rowIndex) {
|
|
407
|
+
const updatedVariableData = row.variable_data.filter((_, i) => i !== subIndex);
|
|
408
|
+
return {
|
|
409
|
+
...row,
|
|
410
|
+
variable_data: updatedVariableData
|
|
411
|
+
};
|
|
412
|
+
}
|
|
413
|
+
return row;
|
|
414
|
+
});
|
|
415
|
+
});
|
|
416
|
+
};
|
|
417
|
+
useEffect(() => {
|
|
418
|
+
console.log(rows);
|
|
419
|
+
}, [rows]);
|
|
420
|
+
const renderInputElement = (element, value) => {
|
|
421
|
+
if (!element)
|
|
422
|
+
return null;
|
|
330
423
|
const { element: type, label } = element;
|
|
331
|
-
console.log("type....", type);
|
|
332
424
|
if (type === "single-select") {
|
|
333
|
-
return /* @__PURE__ */ React12.createElement(SingleSelectElement, { onChange: (
|
|
425
|
+
return /* @__PURE__ */ React12.createElement(SingleSelectElement, { onChange: (value2) => console.log(label, value2), optionType: "", className: void 0, selectedStyle: false, style: false });
|
|
334
426
|
} else if (type === "textarea") {
|
|
335
|
-
return /* @__PURE__ */ React12.createElement(TextareaElement, { onChange: (
|
|
427
|
+
return /* @__PURE__ */ React12.createElement(TextareaElement, { onChange: (value2) => console.log(label, value2), optionType: "", className: void 0, selectedStyle: false, style: false });
|
|
336
428
|
} else {
|
|
337
429
|
return null;
|
|
338
430
|
}
|
|
339
431
|
};
|
|
340
|
-
const dataSource =
|
|
341
|
-
const
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
return acc;
|
|
349
|
-
}
|
|
350
|
-
acc[curr.label] = renderInputElement(curr);
|
|
351
|
-
return acc;
|
|
352
|
-
}, {}) : {};
|
|
353
|
-
return {
|
|
354
|
-
key: index.toString(),
|
|
355
|
-
"#": index + 1,
|
|
356
|
-
...eachRow,
|
|
357
|
-
...rowElements,
|
|
358
|
-
...variableData
|
|
432
|
+
const dataSource = rows.map((eachRow, rowIndex) => {
|
|
433
|
+
const rowData = {
|
|
434
|
+
key: eachRow.id,
|
|
435
|
+
"#": rowIndex + 1,
|
|
436
|
+
"Medicine": renderInputElement({
|
|
437
|
+
element: eachRow.element,
|
|
438
|
+
label: eachRow.label
|
|
439
|
+
})
|
|
359
440
|
};
|
|
360
|
-
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
|
|
441
|
+
rowData["Medicine"] = renderInputElement(eachRow.variable_data[0].Medicine);
|
|
442
|
+
eachRow.variable_data.map((variable, subIndex) => {
|
|
443
|
+
Object.keys(variable).forEach((key) => {
|
|
444
|
+
if (key === "SubRows") {
|
|
445
|
+
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)));
|
|
446
|
+
} else {
|
|
447
|
+
rowData[`${key}`] = renderInputElement(variable[key]);
|
|
448
|
+
}
|
|
449
|
+
});
|
|
450
|
+
});
|
|
451
|
+
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)));
|
|
452
|
+
return rowData;
|
|
453
|
+
});
|
|
454
|
+
const columns = thead && thead.length > 0 ? thead.map((eachHeadEl) => ({
|
|
455
|
+
title: eachHeadEl.label,
|
|
456
|
+
dataIndex: eachHeadEl.name,
|
|
457
|
+
key: eachHeadEl.id
|
|
458
|
+
})) : [];
|
|
459
|
+
if (!columns.some((col) => col.dataIndex === "actions")) {
|
|
460
|
+
columns.push({
|
|
461
|
+
title: "Actions",
|
|
462
|
+
dataIndex: "actions",
|
|
463
|
+
key: "actions"
|
|
464
|
+
});
|
|
364
465
|
}
|
|
365
|
-
return /* @__PURE__ */ React12.createElement(
|
|
466
|
+
return /* @__PURE__ */ React12.createElement(
|
|
366
467
|
Table,
|
|
367
468
|
{
|
|
368
469
|
columns,
|
|
369
|
-
|
|
370
|
-
|
|
470
|
+
dataSource,
|
|
471
|
+
pagination: false,
|
|
472
|
+
bordered: true
|
|
371
473
|
}
|
|
372
|
-
)
|
|
474
|
+
);
|
|
373
475
|
};
|
|
374
476
|
export {
|
|
375
477
|
AddMoreTable,
|