@apexcura/ui-components 0.0.11-Beta20 → 0.0.11-Beta201
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.css +437 -0
- package/dist/index.d.mts +46 -9
- package/dist/index.d.ts +46 -9
- package/dist/index.js +352 -83
- package/dist/index.mjs +352 -87
- package/package.json +11 -3
- package/postcss.config.js +6 -0
- package/tailwind.config.js +10 -0
package/dist/index.js
CHANGED
|
@@ -34,12 +34,16 @@ __export(src_exports, {
|
|
|
34
34
|
ButtonElement: () => ButtonElement,
|
|
35
35
|
CheckboxElement: () => CheckboxElement,
|
|
36
36
|
CkEditor: () => CkEditor,
|
|
37
|
+
DatePickerElement: () => DatePickerElement,
|
|
37
38
|
MultipleSelectElement: () => MultipleSelectElement,
|
|
39
|
+
Navbar: () => Navbar,
|
|
38
40
|
NumberElement: () => NumberElement,
|
|
39
41
|
PasswordElement: () => PasswordElement,
|
|
40
42
|
RadioElement: () => RadioElement,
|
|
41
43
|
SelectElement: () => SelectElement,
|
|
44
|
+
Sidebar: () => Sidebar,
|
|
42
45
|
SingleSelectElement: () => SingleSelectElement,
|
|
46
|
+
TableElement: () => TableElement,
|
|
43
47
|
TextElement: () => TextElement,
|
|
44
48
|
TextareaElement: () => TextareaElement
|
|
45
49
|
});
|
|
@@ -49,7 +53,7 @@ module.exports = __toCommonJS(src_exports);
|
|
|
49
53
|
var import_react = __toESM(require("react"));
|
|
50
54
|
var import_antd = require("antd");
|
|
51
55
|
var TextElement = (props) => {
|
|
52
|
-
return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement("label", { htmlFor: props.name }, props.label), /* @__PURE__ */ import_react.default.createElement(
|
|
56
|
+
return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, props.label && /* @__PURE__ */ import_react.default.createElement("label", { htmlFor: props.name }, props.label), /* @__PURE__ */ import_react.default.createElement(
|
|
53
57
|
import_antd.Input,
|
|
54
58
|
{
|
|
55
59
|
placeholder: props.placeholder,
|
|
@@ -62,7 +66,7 @@ var TextElement = (props) => {
|
|
|
62
66
|
type: props.type,
|
|
63
67
|
status: props.status,
|
|
64
68
|
style: props.styles,
|
|
65
|
-
className: props.
|
|
69
|
+
className: props.className,
|
|
66
70
|
variant: props.variant,
|
|
67
71
|
name: props.name,
|
|
68
72
|
onChange: (e) => props.onChange(e.target.value)
|
|
@@ -103,7 +107,7 @@ var NumberElement = (props) => {
|
|
|
103
107
|
const newValue = e.target.value.replace(/[^0-9]/g, "");
|
|
104
108
|
props.onChange(newValue);
|
|
105
109
|
};
|
|
106
|
-
return /* @__PURE__ */ import_react3.default.createElement(
|
|
110
|
+
return /* @__PURE__ */ import_react3.default.createElement(
|
|
107
111
|
import_antd3.Input,
|
|
108
112
|
{
|
|
109
113
|
placeholder: props.placeholder,
|
|
@@ -115,13 +119,12 @@ var NumberElement = (props) => {
|
|
|
115
119
|
prefix: props.prefix,
|
|
116
120
|
type: props.type,
|
|
117
121
|
status: props.status,
|
|
118
|
-
|
|
119
|
-
className: props.classNames,
|
|
122
|
+
className: props.className,
|
|
120
123
|
variant: props.variant,
|
|
121
124
|
name: props.name,
|
|
122
125
|
onChange: handleInputChange
|
|
123
126
|
}
|
|
124
|
-
)
|
|
127
|
+
);
|
|
125
128
|
};
|
|
126
129
|
|
|
127
130
|
// src/Components/TextareaElement.tsx
|
|
@@ -129,7 +132,7 @@ var import_react4 = __toESM(require("react"));
|
|
|
129
132
|
var import_antd4 = require("antd");
|
|
130
133
|
var { TextArea } = import_antd4.Input;
|
|
131
134
|
var TextareaElement = (props) => {
|
|
132
|
-
return /* @__PURE__ */ import_react4.default.createElement(import_antd4.Flex,
|
|
135
|
+
return /* @__PURE__ */ import_react4.default.createElement(import_antd4.Flex, null, /* @__PURE__ */ import_react4.default.createElement(
|
|
133
136
|
TextArea,
|
|
134
137
|
{
|
|
135
138
|
placeholder: props.placeholder,
|
|
@@ -138,8 +141,7 @@ var TextareaElement = (props) => {
|
|
|
138
141
|
disabled: props.disabled,
|
|
139
142
|
id: props.name,
|
|
140
143
|
status: props.status,
|
|
141
|
-
|
|
142
|
-
className: props.classNames,
|
|
144
|
+
className: props.className,
|
|
143
145
|
variant: props.variant,
|
|
144
146
|
name: props.name,
|
|
145
147
|
showCount: true,
|
|
@@ -177,7 +179,7 @@ var SelectElement = (props) => {
|
|
|
177
179
|
id: props.name,
|
|
178
180
|
status: props.status,
|
|
179
181
|
style: props.styles,
|
|
180
|
-
className: props.
|
|
182
|
+
className: props.className,
|
|
181
183
|
variant: props.variant,
|
|
182
184
|
onChange: handleChange
|
|
183
185
|
}
|
|
@@ -187,15 +189,46 @@ var SelectElement = (props) => {
|
|
|
187
189
|
// src/Components/RadioElement.tsx
|
|
188
190
|
var import_react6 = __toESM(require("react"));
|
|
189
191
|
var import_antd6 = require("antd");
|
|
192
|
+
var radioDefaultStyle = "bg-[#F2F2F2] border border-[#919191] rounded-[8px] m-[10px] hover:bg-[#F2F2F2] text-center text-black shadow-[0px_0px_1px_1px_#919191]";
|
|
193
|
+
var radioSelectedDefaultStyle = "bg-[#E2D6F8] border border-[#B8A4DE] rounded-[8px] p-[6px] m-[10px] shadow-[0px_0px_1px_1px_#B8A4DE] text-center text-black shadow-[0px_0px_1px_1px_#919191]";
|
|
190
194
|
var RadioElement = (props) => {
|
|
195
|
+
const [isDisabled, setIsDisabled] = (0, import_react6.useState)(props.disabled);
|
|
196
|
+
const [selectedValue, setSelectedValue] = (0, import_react6.useState)(props.value);
|
|
197
|
+
const optionType = props.optionType === "button" ? "button" : void 0;
|
|
191
198
|
const handleChange = (e) => {
|
|
199
|
+
console.log(e);
|
|
200
|
+
const selectedVal = e.target.value;
|
|
201
|
+
const selectedLabel = props.options ? props.options.find((f) => f.value === selectedVal)?.label : "";
|
|
202
|
+
const selectedOptions = { label: selectedLabel, value: selectedVal };
|
|
203
|
+
setSelectedValue(selectedVal);
|
|
204
|
+
setIsDisabled(true);
|
|
192
205
|
if (props.onChange) {
|
|
193
|
-
const selectedVal = e.target.value;
|
|
194
|
-
const selectedOptions = [{ id: selectedVal, value: selectedVal }];
|
|
195
206
|
props.onChange(selectedOptions);
|
|
196
207
|
}
|
|
197
208
|
};
|
|
198
|
-
|
|
209
|
+
const getButtonStyle = (option) => {
|
|
210
|
+
return selectedValue === option.value ? `${radioSelectedDefaultStyle} ${props.activeClassName}` : `${radioDefaultStyle} ${props.className}`;
|
|
211
|
+
};
|
|
212
|
+
return /* @__PURE__ */ import_react6.default.createElement("div", { className: props.containerClassName }, props.label && /* @__PURE__ */ import_react6.default.createElement("p", { className: props.labelClassName }, props.label), /* @__PURE__ */ import_react6.default.createElement(
|
|
213
|
+
import_antd6.Radio.Group,
|
|
214
|
+
{
|
|
215
|
+
onChange: handleChange,
|
|
216
|
+
optionType,
|
|
217
|
+
className: props.radioGroupClassName,
|
|
218
|
+
value: selectedValue
|
|
219
|
+
},
|
|
220
|
+
props.options && props.options.map((option) => /* @__PURE__ */ import_react6.default.createElement(
|
|
221
|
+
import_antd6.Radio,
|
|
222
|
+
{
|
|
223
|
+
key: option.value,
|
|
224
|
+
value: option.value,
|
|
225
|
+
disabled: isDisabled && selectedValue !== option.value,
|
|
226
|
+
className: getButtonStyle(option),
|
|
227
|
+
style: { pointerEvents: isDisabled && selectedValue !== option.value ? "none" : "auto" }
|
|
228
|
+
},
|
|
229
|
+
option.label
|
|
230
|
+
))
|
|
231
|
+
));
|
|
199
232
|
};
|
|
200
233
|
|
|
201
234
|
// src/Components/Checkbox.tsx
|
|
@@ -229,7 +262,7 @@ var CheckboxElement = (props) => {
|
|
|
229
262
|
disabled: props.disabled,
|
|
230
263
|
id: props.name,
|
|
231
264
|
style: props.styles,
|
|
232
|
-
className: props.
|
|
265
|
+
className: props.className,
|
|
233
266
|
onChange: onHandleAllChanges,
|
|
234
267
|
checked: checkAll
|
|
235
268
|
},
|
|
@@ -239,7 +272,7 @@ var CheckboxElement = (props) => {
|
|
|
239
272
|
{
|
|
240
273
|
disabled: props.disabled,
|
|
241
274
|
style: props.styles,
|
|
242
|
-
className: props.
|
|
275
|
+
className: props.className,
|
|
243
276
|
options: plainOptions,
|
|
244
277
|
value: checkedList,
|
|
245
278
|
onChange: handleChange
|
|
@@ -266,8 +299,7 @@ var CkEditor = (props) => {
|
|
|
266
299
|
{
|
|
267
300
|
apiKey: "rwpgt7maa54n0pe5mglhkl686p7h57sg6z636n6gf2mio1b9",
|
|
268
301
|
onInit: (_evt, editor) => {
|
|
269
|
-
if (editor)
|
|
270
|
-
editorRef.current = editor;
|
|
302
|
+
if (editor) editorRef.current = editor;
|
|
271
303
|
},
|
|
272
304
|
initialValue: "<p>This is the initial content of the editor.</p>",
|
|
273
305
|
init: {
|
|
@@ -355,102 +387,335 @@ var MultipleSelectElement = (props) => {
|
|
|
355
387
|
|
|
356
388
|
// src/Components/Button.tsx
|
|
357
389
|
var import_react12 = __toESM(require("react"));
|
|
358
|
-
var
|
|
359
|
-
|
|
390
|
+
var ButtonElement = (props) => {
|
|
391
|
+
const handleClick = typeof props.action === "string" ? () => {
|
|
392
|
+
console.log("Performing action:", props.action);
|
|
393
|
+
} : props.action;
|
|
394
|
+
return /* @__PURE__ */ import_react12.default.createElement(
|
|
395
|
+
"button",
|
|
396
|
+
{
|
|
397
|
+
onClick: handleClick,
|
|
398
|
+
className: `${props.className ? props.className : ""}`
|
|
399
|
+
},
|
|
400
|
+
props.icon && /* @__PURE__ */ import_react12.default.createElement("img", { src: props.icon }),
|
|
401
|
+
props.label
|
|
402
|
+
);
|
|
403
|
+
};
|
|
360
404
|
|
|
361
405
|
// src/Components/AddMoreTable.tsx
|
|
362
406
|
var import_react13 = __toESM(require("react"));
|
|
363
|
-
var
|
|
407
|
+
var import_antd10 = require("antd");
|
|
364
408
|
var import_icons2 = require("@ant-design/icons");
|
|
365
409
|
var AddMoreTable = (props) => {
|
|
366
410
|
const { thead, tbody } = props;
|
|
367
|
-
const [tableData, setTableData] = (0, import_react13.useState)({});
|
|
368
411
|
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
412
|
const onHandleRows = () => {
|
|
377
|
-
const
|
|
378
|
-
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
|
|
413
|
+
const newId = rows.length > 0 ? rows[rows.length - 1].id + 1 : 1;
|
|
414
|
+
let newRow = {
|
|
415
|
+
id: newId,
|
|
416
|
+
label: "Medicine",
|
|
417
|
+
name: "Medicine",
|
|
418
|
+
type: "text",
|
|
419
|
+
element: "single-select",
|
|
420
|
+
variable_data: [
|
|
421
|
+
{
|
|
422
|
+
id: 1,
|
|
423
|
+
Route: { label: "Route", element: "single-select", type: "text" },
|
|
424
|
+
Dose: { label: "Dose", element: "single-select", type: "text" },
|
|
425
|
+
Frequency: { label: "Frequency", element: "single-select", type: "text" },
|
|
426
|
+
When: { label: "When", element: "textarea", type: "text" },
|
|
427
|
+
Duration: { label: "Duration", element: "textarea", type: "text" },
|
|
428
|
+
Instructions: { label: "Instructions", element: "textarea", type: "text" },
|
|
429
|
+
SubRows: { delete: "delete", add: "plus" }
|
|
430
|
+
}
|
|
431
|
+
]
|
|
382
432
|
};
|
|
383
433
|
setRows((prevData) => [...prevData, newRow]);
|
|
384
434
|
};
|
|
385
|
-
const onHandleDelete = (
|
|
386
|
-
|
|
387
|
-
setRows(remainingRows);
|
|
435
|
+
const onHandleDelete = (id) => {
|
|
436
|
+
setRows((prevRows) => prevRows.filter((row) => row.id !== id));
|
|
388
437
|
};
|
|
389
|
-
const
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
438
|
+
const onHandleSubRowsAdd = (rowIndex) => {
|
|
439
|
+
setRows((prevRows) => {
|
|
440
|
+
return prevRows.map((row, index) => {
|
|
441
|
+
if (index === rowIndex) {
|
|
442
|
+
const newSubRow = {
|
|
443
|
+
id: row.variable_data.length + 1,
|
|
444
|
+
Route: { label: "Route", element: "single-select", type: "text" },
|
|
445
|
+
Dose: { label: "Dose", element: "single-select", type: "text" },
|
|
446
|
+
Frequency: { label: "Frequency", element: "single-select", type: "text" },
|
|
447
|
+
When: { label: "When", element: "textarea", type: "text" },
|
|
448
|
+
Duration: { label: "Duration", element: "textarea", type: "text" },
|
|
449
|
+
Instructions: { label: "Instructions", element: "textarea", type: "text" },
|
|
450
|
+
SubRows: { delete: "delete", add: "plus" }
|
|
451
|
+
};
|
|
452
|
+
const updatedVariableData = [...row.variable_data, newSubRow];
|
|
453
|
+
return {
|
|
454
|
+
...row,
|
|
455
|
+
variable_data: updatedVariableData
|
|
456
|
+
};
|
|
457
|
+
}
|
|
458
|
+
return row;
|
|
459
|
+
});
|
|
460
|
+
});
|
|
461
|
+
};
|
|
462
|
+
const onHandleSubRowsDelete = (rowIndex, subIndex) => {
|
|
463
|
+
setRows((prevRows) => {
|
|
464
|
+
return prevRows.map((row, index) => {
|
|
465
|
+
if (index === rowIndex) {
|
|
466
|
+
const updatedVariableData = row.variable_data.filter((_, i) => i !== subIndex);
|
|
467
|
+
return {
|
|
468
|
+
...row,
|
|
469
|
+
variable_data: updatedVariableData
|
|
470
|
+
};
|
|
471
|
+
}
|
|
472
|
+
return row;
|
|
473
|
+
});
|
|
474
|
+
});
|
|
475
|
+
};
|
|
476
|
+
(0, import_react13.useEffect)(() => {
|
|
477
|
+
console.log(rows);
|
|
478
|
+
}, [rows]);
|
|
479
|
+
const renderInputElement = (element, value) => {
|
|
480
|
+
if (!element) return null;
|
|
395
481
|
const { element: type, label } = element;
|
|
396
482
|
if (type === "single-select") {
|
|
397
|
-
return /* @__PURE__ */ import_react13.default.createElement(SingleSelectElement, { onChange: (
|
|
483
|
+
return /* @__PURE__ */ import_react13.default.createElement(SingleSelectElement, { onChange: (value2) => console.log(label, value2), optionType: "", className: void 0, selectedStyle: false, style: false });
|
|
398
484
|
} else if (type === "textarea") {
|
|
399
|
-
return /* @__PURE__ */ import_react13.default.createElement(TextareaElement, { onChange: (
|
|
485
|
+
return /* @__PURE__ */ import_react13.default.createElement(TextareaElement, { onChange: (value2) => console.log(label, value2), optionType: "", className: void 0, selectedStyle: false, style: false });
|
|
400
486
|
} else {
|
|
401
487
|
return null;
|
|
402
488
|
}
|
|
403
489
|
};
|
|
404
|
-
const dataSource = rows.map((eachRow,
|
|
405
|
-
const
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
if (value && value.element && value.label) {
|
|
413
|
-
rowElements[value.label] = renderInputElement(value);
|
|
414
|
-
}
|
|
415
|
-
});
|
|
416
|
-
});
|
|
417
|
-
if (eachRow.variable_data.length > 0) {
|
|
418
|
-
const addIconObject = {
|
|
419
|
-
id: { id: eachRow.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
|
-
addIcon: /* @__PURE__ */ import_react13.default.createElement("button", { onClick: () => console.log("Add more clicked") }, /* @__PURE__ */ import_react13.default.createElement(import_icons2.PlusOutlined, null))
|
|
427
|
-
};
|
|
428
|
-
rowElements["AddMoreIcon"] = addIconObject.addIcon;
|
|
429
|
-
}
|
|
430
|
-
}
|
|
431
|
-
return {
|
|
432
|
-
key: index.toString(),
|
|
433
|
-
"#": index + 1,
|
|
434
|
-
...eachRow,
|
|
435
|
-
...rowElements,
|
|
436
|
-
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)))
|
|
490
|
+
const dataSource = rows.map((eachRow, rowIndex) => {
|
|
491
|
+
const rowData = {
|
|
492
|
+
key: eachRow.id,
|
|
493
|
+
"#": rowIndex + 1,
|
|
494
|
+
"Medicine": renderInputElement({
|
|
495
|
+
element: eachRow.element,
|
|
496
|
+
label: eachRow.label
|
|
497
|
+
})
|
|
437
498
|
};
|
|
499
|
+
eachRow.variable_data.forEach((variable, subIndex) => {
|
|
500
|
+
Object.keys(variable).forEach((key) => {
|
|
501
|
+
if (key === "SubRows") {
|
|
502
|
+
rowData[`${key}`] = /* @__PURE__ */ import_react13.default.createElement("div", { key: subIndex }, eachRow.variable_data.length > 1 && /* @__PURE__ */ import_react13.default.createElement(import_antd10.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_antd10.Button, { onClick: () => onHandleSubRowsAdd(rowIndex) }, /* @__PURE__ */ import_react13.default.createElement(import_icons2.PlusOutlined, null)));
|
|
503
|
+
} else {
|
|
504
|
+
rowData[`${key}`] = renderInputElement(variable[key]);
|
|
505
|
+
}
|
|
506
|
+
});
|
|
507
|
+
});
|
|
508
|
+
rowData.actions = /* @__PURE__ */ import_react13.default.createElement("div", null, /* @__PURE__ */ import_react13.default.createElement(import_antd10.Button, { onClick: () => onHandleDelete(eachRow.id) }, /* @__PURE__ */ import_react13.default.createElement(import_icons2.DeleteOutlined, null)), rowIndex === rows.length - 1 && /* @__PURE__ */ import_react13.default.createElement(import_antd10.Button, { onClick: onHandleRows }, /* @__PURE__ */ import_react13.default.createElement(import_icons2.PlusOutlined, null)));
|
|
509
|
+
console.log("=====rowdata", rowData);
|
|
510
|
+
return rowData;
|
|
438
511
|
});
|
|
439
|
-
|
|
512
|
+
const columns = thead && thead.length > 0 ? thead.map((eachHeadEl) => ({
|
|
513
|
+
title: eachHeadEl.label,
|
|
514
|
+
dataIndex: eachHeadEl.name,
|
|
515
|
+
key: eachHeadEl.id
|
|
516
|
+
})) : [];
|
|
517
|
+
if (!columns.some((col) => col.dataIndex === "actions")) {
|
|
440
518
|
columns.push({
|
|
441
519
|
title: "Actions",
|
|
442
520
|
dataIndex: "actions",
|
|
443
521
|
key: "actions"
|
|
444
522
|
});
|
|
445
523
|
}
|
|
446
|
-
return /* @__PURE__ */ import_react13.default.createElement(
|
|
447
|
-
|
|
524
|
+
return /* @__PURE__ */ import_react13.default.createElement(
|
|
525
|
+
import_antd10.Table,
|
|
448
526
|
{
|
|
449
527
|
columns,
|
|
450
|
-
|
|
451
|
-
|
|
528
|
+
dataSource,
|
|
529
|
+
pagination: false,
|
|
530
|
+
bordered: true
|
|
452
531
|
}
|
|
453
|
-
)
|
|
532
|
+
);
|
|
533
|
+
};
|
|
534
|
+
|
|
535
|
+
// src/Components/Sidebar.tsx
|
|
536
|
+
var import_react14 = __toESM(require("react"));
|
|
537
|
+
var Sidebar = (props) => {
|
|
538
|
+
const handleChange = (item) => {
|
|
539
|
+
if (props.onChange) {
|
|
540
|
+
props.onChange(item);
|
|
541
|
+
}
|
|
542
|
+
};
|
|
543
|
+
return /* @__PURE__ */ import_react14.default.createElement("div", { className: props.className, key: props.name }, /* @__PURE__ */ import_react14.default.createElement("div", null, /* @__PURE__ */ import_react14.default.createElement("img", { src: props.img, alt: "logo" })), /* @__PURE__ */ import_react14.default.createElement("ul", { className: props.listClassName }, props.items?.map((item) => {
|
|
544
|
+
return /* @__PURE__ */ import_react14.default.createElement("li", { onClick: () => {
|
|
545
|
+
handleChange(item);
|
|
546
|
+
}, key: item.label, className: `${props.listItemClassName} ${item.active && props.activeClassName}` }, /* @__PURE__ */ import_react14.default.createElement("img", { src: item.icon, className: props.className }), /* @__PURE__ */ import_react14.default.createElement("p", null, item.label));
|
|
547
|
+
})));
|
|
548
|
+
};
|
|
549
|
+
|
|
550
|
+
// src/Components/Navbar.tsx
|
|
551
|
+
var import_react18 = __toESM(require("react"));
|
|
552
|
+
|
|
553
|
+
// src/Components/Notification.tsx
|
|
554
|
+
var import_react15 = __toESM(require("react"));
|
|
555
|
+
var import_antd11 = require("antd");
|
|
556
|
+
var import_io = require("react-icons/io");
|
|
557
|
+
var popoverContentStyle = {
|
|
558
|
+
minWidth: "300px",
|
|
559
|
+
maxWidth: "100%"
|
|
560
|
+
};
|
|
561
|
+
var Notification = (props) => /* @__PURE__ */ import_react15.default.createElement(
|
|
562
|
+
import_antd11.Popover,
|
|
563
|
+
{
|
|
564
|
+
className: props.className,
|
|
565
|
+
content: /* @__PURE__ */ import_react15.default.createElement("div", { style: popoverContentStyle }, " ", /* @__PURE__ */ import_react15.default.createElement(
|
|
566
|
+
import_antd11.List,
|
|
567
|
+
{
|
|
568
|
+
itemLayout: "horizontal",
|
|
569
|
+
dataSource: props.items,
|
|
570
|
+
renderItem: (item, index) => /* @__PURE__ */ import_react15.default.createElement(import_antd11.List.Item, { key: item.text }, /* @__PURE__ */ import_react15.default.createElement(
|
|
571
|
+
import_antd11.List.Item.Meta,
|
|
572
|
+
{
|
|
573
|
+
avatar: /* @__PURE__ */ import_react15.default.createElement(import_antd11.Avatar, { src: `https://api.dicebear.com/7.x/miniavs/svg?seed=${index}` }),
|
|
574
|
+
title: item.text,
|
|
575
|
+
description: item.time
|
|
576
|
+
}
|
|
577
|
+
))
|
|
578
|
+
}
|
|
579
|
+
)),
|
|
580
|
+
trigger: "focus",
|
|
581
|
+
placement: "bottomRight"
|
|
582
|
+
},
|
|
583
|
+
/* @__PURE__ */ import_react15.default.createElement(import_antd11.Button, { className: props.buttonClassName }, /* @__PURE__ */ import_react15.default.createElement(import_antd11.Badge, { size: "small", count: props.count }, /* @__PURE__ */ import_react15.default.createElement("span", { className: props.iconsClassName }, /* @__PURE__ */ import_react15.default.createElement(import_io.IoIosNotifications, null))))
|
|
584
|
+
);
|
|
585
|
+
|
|
586
|
+
// src/Components/SpanElement.tsx
|
|
587
|
+
var import_react16 = __toESM(require("react"));
|
|
588
|
+
var SpanElement = (props) => /* @__PURE__ */ import_react16.default.createElement("span", { className: props.className }, props.label);
|
|
589
|
+
|
|
590
|
+
// src/Components/Profile.tsx
|
|
591
|
+
var import_react17 = __toESM(require("react"));
|
|
592
|
+
var import_antd12 = require("antd");
|
|
593
|
+
var import_icons3 = require("@ant-design/icons");
|
|
594
|
+
var Profile = (props) => /* @__PURE__ */ import_react17.default.createElement("div", { className: props.className }, /* @__PURE__ */ import_react17.default.createElement(import_antd12.Avatar, { style: { backgroundColor: "#87d068", marginRight: "10px" }, icon: /* @__PURE__ */ import_react17.default.createElement(import_icons3.UserOutlined, null) }), /* @__PURE__ */ import_react17.default.createElement("div", { className: props.profileSubClassName }, /* @__PURE__ */ import_react17.default.createElement("p", null, props.primaryText), /* @__PURE__ */ import_react17.default.createElement("p", { className: props.secondTextClassName }, " ", props.secondaryText)));
|
|
595
|
+
|
|
596
|
+
// src/Components/Navbar.tsx
|
|
597
|
+
var Navbar = (props) => {
|
|
598
|
+
return /* @__PURE__ */ import_react18.default.createElement("div", { className: `${props.className}`, key: props.name }, props.items && props.items.map((item) => {
|
|
599
|
+
if (item.element === "span") {
|
|
600
|
+
return /* @__PURE__ */ import_react18.default.createElement(SpanElement, { ...item });
|
|
601
|
+
} else if (item.element === "notifications") {
|
|
602
|
+
return /* @__PURE__ */ import_react18.default.createElement(Notification, { ...item });
|
|
603
|
+
} else if (item.name === "profile") {
|
|
604
|
+
return /* @__PURE__ */ import_react18.default.createElement(Profile, { ...item });
|
|
605
|
+
}
|
|
606
|
+
return null;
|
|
607
|
+
}));
|
|
608
|
+
};
|
|
609
|
+
|
|
610
|
+
// src/Components/TableElement.tsx
|
|
611
|
+
var import_react20 = __toESM(require("react"));
|
|
612
|
+
var import_antd14 = require("antd");
|
|
613
|
+
|
|
614
|
+
// src/Components/Model.tsx
|
|
615
|
+
var import_react19 = __toESM(require("react"));
|
|
616
|
+
var import_antd13 = require("antd");
|
|
617
|
+
var ModelElement = (props) => {
|
|
618
|
+
const { onCancel, model } = props;
|
|
619
|
+
return /* @__PURE__ */ import_react19.default.createElement(import_antd13.Modal, { open: model, onCancel }, /* @__PURE__ */ import_react19.default.createElement("p", null, "Model opened"));
|
|
620
|
+
};
|
|
621
|
+
|
|
622
|
+
// src/Components/TableElement.tsx
|
|
623
|
+
var TableElement = (props) => {
|
|
624
|
+
const { thead, tbody } = props;
|
|
625
|
+
const [selectedRecord, setSelectedRecord] = (0, import_react20.useState)({});
|
|
626
|
+
const [model, setModel] = (0, import_react20.useState)(false);
|
|
627
|
+
let columns = [];
|
|
628
|
+
if (thead) {
|
|
629
|
+
columns = [
|
|
630
|
+
{
|
|
631
|
+
title: "#",
|
|
632
|
+
dataIndex: "#",
|
|
633
|
+
key: "#"
|
|
634
|
+
},
|
|
635
|
+
...thead.map((col, ind) => ({
|
|
636
|
+
title: col.label,
|
|
637
|
+
dataIndex: col.name,
|
|
638
|
+
key: col.key,
|
|
639
|
+
sorter: {
|
|
640
|
+
compare: (a, b) => a[col.key] - b[col.key],
|
|
641
|
+
multiple: thead.length - ind
|
|
642
|
+
}
|
|
643
|
+
}))
|
|
644
|
+
];
|
|
645
|
+
}
|
|
646
|
+
const dataSource = tbody && tbody.map((row, index) => ({
|
|
647
|
+
...row,
|
|
648
|
+
[columns[0].key]: index + 1
|
|
649
|
+
}));
|
|
650
|
+
return /* @__PURE__ */ import_react20.default.createElement(import_react20.default.Fragment, null, /* @__PURE__ */ import_react20.default.createElement(
|
|
651
|
+
import_antd14.Table,
|
|
652
|
+
{
|
|
653
|
+
dataSource,
|
|
654
|
+
columns,
|
|
655
|
+
bordered: true,
|
|
656
|
+
size: props.size && props.size,
|
|
657
|
+
onRow: (record, rowIndex) => {
|
|
658
|
+
return {
|
|
659
|
+
onClick: () => {
|
|
660
|
+
setSelectedRecord(record);
|
|
661
|
+
setModel(true);
|
|
662
|
+
}
|
|
663
|
+
};
|
|
664
|
+
}
|
|
665
|
+
}
|
|
666
|
+
), model && /* @__PURE__ */ import_react20.default.createElement(ModelElement, { selectedStyle: false, style: false, className: void 0, ...selectedRecord, model, onCancel: () => setModel(false) }));
|
|
667
|
+
};
|
|
668
|
+
|
|
669
|
+
// src/Components/DatePicker.tsx
|
|
670
|
+
var import_react21 = __toESM(require("react"));
|
|
671
|
+
var import_antd15 = require("antd");
|
|
672
|
+
var import_icons4 = require("@ant-design/icons");
|
|
673
|
+
var import_moment = __toESM(require("moment"));
|
|
674
|
+
var DatePickerElement = (props) => {
|
|
675
|
+
const [date, setDate] = (0, import_react21.useState)(null);
|
|
676
|
+
const handleChange = (date2, dateString) => {
|
|
677
|
+
console.log("date---------", date2);
|
|
678
|
+
console.log("datestring", dateString);
|
|
679
|
+
if (date2) {
|
|
680
|
+
const formattedDate = dateString;
|
|
681
|
+
console.log("formattedDate-----------------", formattedDate);
|
|
682
|
+
setDate(date2);
|
|
683
|
+
console.log("changedDate------------", date2);
|
|
684
|
+
if (props.onChange) {
|
|
685
|
+
props.onChange(formattedDate);
|
|
686
|
+
}
|
|
687
|
+
} else {
|
|
688
|
+
setDate(null);
|
|
689
|
+
if (props.onChange) {
|
|
690
|
+
props.onChange("");
|
|
691
|
+
}
|
|
692
|
+
}
|
|
693
|
+
};
|
|
694
|
+
const onHandleDecrement = () => {
|
|
695
|
+
const currentDate = date || (0, import_moment.default)();
|
|
696
|
+
const newDate = (0, import_moment.default)(currentDate).subtract(1, "days");
|
|
697
|
+
setDate(newDate);
|
|
698
|
+
if (props.onChange) {
|
|
699
|
+
props.onChange(newDate.format("lll"));
|
|
700
|
+
}
|
|
701
|
+
};
|
|
702
|
+
const onHandleIncrement = () => {
|
|
703
|
+
const currentDate = date || (0, import_moment.default)();
|
|
704
|
+
const newDate = (0, import_moment.default)(currentDate).add(1, "days");
|
|
705
|
+
setDate(newDate);
|
|
706
|
+
if (props.onChange) {
|
|
707
|
+
props.onChange(newDate.format("lll"));
|
|
708
|
+
}
|
|
709
|
+
};
|
|
710
|
+
return /* @__PURE__ */ import_react21.default.createElement("div", null, /* @__PURE__ */ import_react21.default.createElement("button", { onClick: onHandleDecrement }, /* @__PURE__ */ import_react21.default.createElement(import_icons4.LeftOutlined, null)), /* @__PURE__ */ import_react21.default.createElement(
|
|
711
|
+
import_antd15.DatePicker,
|
|
712
|
+
{
|
|
713
|
+
placeholder: props.placeholder,
|
|
714
|
+
value: date,
|
|
715
|
+
variant: "borderless",
|
|
716
|
+
onChange: handleChange
|
|
717
|
+
}
|
|
718
|
+
), /* @__PURE__ */ import_react21.default.createElement("button", { onClick: onHandleIncrement }, /* @__PURE__ */ import_react21.default.createElement(import_icons4.RightOutlined, null)));
|
|
454
719
|
};
|
|
455
720
|
// Annotate the CommonJS export names for ESM import in node:
|
|
456
721
|
0 && (module.exports = {
|
|
@@ -458,12 +723,16 @@ var AddMoreTable = (props) => {
|
|
|
458
723
|
ButtonElement,
|
|
459
724
|
CheckboxElement,
|
|
460
725
|
CkEditor,
|
|
726
|
+
DatePickerElement,
|
|
461
727
|
MultipleSelectElement,
|
|
728
|
+
Navbar,
|
|
462
729
|
NumberElement,
|
|
463
730
|
PasswordElement,
|
|
464
731
|
RadioElement,
|
|
465
732
|
SelectElement,
|
|
733
|
+
Sidebar,
|
|
466
734
|
SingleSelectElement,
|
|
735
|
+
TableElement,
|
|
467
736
|
TextElement,
|
|
468
737
|
TextareaElement
|
|
469
738
|
});
|