@apexcura/ui-components 0.0.13-Beta49 → 0.0.13-Beta5
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 +0 -4
- package/dist/index.d.mts +27 -18
- package/dist/index.d.ts +27 -18
- package/dist/index.js +146 -302
- package/dist/index.mjs +99 -251
- package/package.json +1 -2
package/dist/index.mjs
CHANGED
|
@@ -2,12 +2,7 @@
|
|
|
2
2
|
import React from "react";
|
|
3
3
|
import { Input as AntInput } from "antd";
|
|
4
4
|
var TextElement = (props) => {
|
|
5
|
-
|
|
6
|
-
if (props.onChange) {
|
|
7
|
-
props.onChange(e.target.value);
|
|
8
|
-
}
|
|
9
|
-
};
|
|
10
|
-
return /* @__PURE__ */ React.createElement("div", { className: props.containerClassName }, props.label && /* @__PURE__ */ React.createElement("label", { htmlFor: props.name, className: props.labelClassName }, props.label), /* @__PURE__ */ React.createElement(
|
|
5
|
+
return /* @__PURE__ */ React.createElement(React.Fragment, null, props.label && /* @__PURE__ */ React.createElement("label", { htmlFor: props.name }, props.label), /* @__PURE__ */ React.createElement(
|
|
11
6
|
AntInput,
|
|
12
7
|
{
|
|
13
8
|
placeholder: props.placeholder,
|
|
@@ -23,9 +18,7 @@ var TextElement = (props) => {
|
|
|
23
18
|
className: props.className,
|
|
24
19
|
variant: props.variant,
|
|
25
20
|
name: props.name,
|
|
26
|
-
onChange: (e) =>
|
|
27
|
-
handleChange(e);
|
|
28
|
-
}
|
|
21
|
+
onChange: (e) => props.onChange(e.target.value)
|
|
29
22
|
}
|
|
30
23
|
));
|
|
31
24
|
};
|
|
@@ -33,47 +26,37 @@ var TextElement = (props) => {
|
|
|
33
26
|
// src/Components/PasswordElement.tsx
|
|
34
27
|
import React2, { useState } from "react";
|
|
35
28
|
import { EyeInvisibleOutlined, EyeTwoTone } from "@ant-design/icons";
|
|
36
|
-
import { Input } from "antd";
|
|
37
|
-
var PasswordElement = (
|
|
29
|
+
import { Button, Input, Space } from "antd";
|
|
30
|
+
var PasswordElement = ({ inputData }) => {
|
|
38
31
|
const [passwordVisible, setPasswordVisible] = useState(false);
|
|
39
32
|
const handleVisibilityToggle = () => {
|
|
40
33
|
setPasswordVisible((prev) => !prev);
|
|
41
34
|
};
|
|
42
|
-
const handleChange = (e) => {
|
|
43
|
-
if (props.onChange) {
|
|
44
|
-
props.onChange(e.target.value);
|
|
45
|
-
}
|
|
46
|
-
};
|
|
47
35
|
const renderVisibilityIcon = (visible) => visible ? /* @__PURE__ */ React2.createElement(EyeTwoTone, null) : /* @__PURE__ */ React2.createElement(EyeInvisibleOutlined, null);
|
|
48
|
-
|
|
36
|
+
const renderPasswordInput = () => /* @__PURE__ */ React2.createElement(
|
|
49
37
|
Input.Password,
|
|
50
38
|
{
|
|
51
|
-
placeholder:
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
},
|
|
39
|
+
placeholder: inputData.placeholder,
|
|
40
|
+
id: inputData.id,
|
|
41
|
+
prefix: inputData.prefix,
|
|
42
|
+
addonBefore: inputData.addonBefore,
|
|
43
|
+
type: inputData.type,
|
|
57
44
|
iconRender: renderVisibilityIcon,
|
|
58
|
-
visibilityToggle: {
|
|
59
|
-
visible: passwordVisible,
|
|
60
|
-
onVisibleChange: handleVisibilityToggle
|
|
61
|
-
}
|
|
45
|
+
visibilityToggle: { visible: passwordVisible, onVisibleChange: handleVisibilityToggle }
|
|
62
46
|
}
|
|
63
|
-
)
|
|
47
|
+
);
|
|
48
|
+
return /* @__PURE__ */ React2.createElement(Space, { direction: "vertical" }, renderPasswordInput(), /* @__PURE__ */ React2.createElement(Space, { direction: "horizontal" }, renderPasswordInput(), /* @__PURE__ */ React2.createElement(Button, { style: { width: 80 }, onClick: handleVisibilityToggle }, passwordVisible ? "Hide" : "Show")));
|
|
64
49
|
};
|
|
65
50
|
|
|
66
51
|
// src/Components/NumberElement.tsx
|
|
67
52
|
import React3 from "react";
|
|
68
53
|
import { Input as AntInput2 } from "antd";
|
|
69
54
|
var NumberElement = (props) => {
|
|
70
|
-
const
|
|
55
|
+
const handleInputChange = (e) => {
|
|
71
56
|
const newValue = e.target.value.replace(/[^0-9]/g, "");
|
|
72
|
-
|
|
73
|
-
props.onChange(newValue);
|
|
74
|
-
}
|
|
57
|
+
props.onChange(newValue);
|
|
75
58
|
};
|
|
76
|
-
return /* @__PURE__ */ React3.createElement(
|
|
59
|
+
return /* @__PURE__ */ React3.createElement(
|
|
77
60
|
AntInput2,
|
|
78
61
|
{
|
|
79
62
|
placeholder: props.placeholder,
|
|
@@ -88,24 +71,17 @@ var NumberElement = (props) => {
|
|
|
88
71
|
className: props.className,
|
|
89
72
|
variant: props.variant,
|
|
90
73
|
name: props.name,
|
|
91
|
-
onChange:
|
|
92
|
-
handleChange(e);
|
|
93
|
-
}
|
|
74
|
+
onChange: handleInputChange
|
|
94
75
|
}
|
|
95
|
-
)
|
|
76
|
+
);
|
|
96
77
|
};
|
|
97
78
|
|
|
98
79
|
// src/Components/TextareaElement.tsx
|
|
99
80
|
import React4 from "react";
|
|
100
|
-
import { Input as Input2 } from "antd";
|
|
81
|
+
import { Flex, Input as Input2 } from "antd";
|
|
101
82
|
var { TextArea } = Input2;
|
|
102
83
|
var TextareaElement = (props) => {
|
|
103
|
-
|
|
104
|
-
if (props.onChange) {
|
|
105
|
-
props.onChange(e.target.value);
|
|
106
|
-
}
|
|
107
|
-
};
|
|
108
|
-
return /* @__PURE__ */ React4.createElement("div", { className: props.containerClassName }, props.label && /* @__PURE__ */ React4.createElement("label", { htmlFor: props.name, className: props.labelClassName }, props.label), /* @__PURE__ */ React4.createElement(
|
|
84
|
+
return /* @__PURE__ */ React4.createElement(Flex, null, /* @__PURE__ */ React4.createElement(
|
|
109
85
|
TextArea,
|
|
110
86
|
{
|
|
111
87
|
placeholder: props.placeholder,
|
|
@@ -119,9 +95,7 @@ var TextareaElement = (props) => {
|
|
|
119
95
|
name: props.name,
|
|
120
96
|
showCount: true,
|
|
121
97
|
maxLength: props.maxLength,
|
|
122
|
-
onChange: (e) =>
|
|
123
|
-
handleChange(e);
|
|
124
|
-
}
|
|
98
|
+
onChange: (e) => props.onChange(e.target.value)
|
|
125
99
|
}
|
|
126
100
|
));
|
|
127
101
|
};
|
|
@@ -129,18 +103,24 @@ var TextareaElement = (props) => {
|
|
|
129
103
|
// src/Components/SelectElement.tsx
|
|
130
104
|
import React5 from "react";
|
|
131
105
|
import { Select } from "antd";
|
|
106
|
+
var labelRender = (props) => {
|
|
107
|
+
const { label, value } = props;
|
|
108
|
+
if (label) {
|
|
109
|
+
return value;
|
|
110
|
+
}
|
|
111
|
+
return /* @__PURE__ */ React5.createElement("span", null, "select gender");
|
|
112
|
+
};
|
|
132
113
|
var SelectElement = (props) => {
|
|
133
114
|
const handleChange = (value) => {
|
|
134
|
-
console.log("sigleselectvalue----", value);
|
|
135
115
|
if (props.onChange) {
|
|
136
|
-
|
|
137
|
-
props.onChange(filterOption2);
|
|
116
|
+
props.onChange(value);
|
|
138
117
|
}
|
|
139
118
|
};
|
|
140
|
-
return /* @__PURE__ */ React5.createElement(
|
|
119
|
+
return /* @__PURE__ */ React5.createElement(
|
|
141
120
|
Select,
|
|
142
121
|
{
|
|
143
|
-
|
|
122
|
+
labelRender,
|
|
123
|
+
options: props.fieldNames,
|
|
144
124
|
placeholder: props.placeholder,
|
|
145
125
|
allowClear: true,
|
|
146
126
|
defaultValue: props.defaultValue,
|
|
@@ -152,7 +132,7 @@ var SelectElement = (props) => {
|
|
|
152
132
|
variant: props.variant,
|
|
153
133
|
onChange: handleChange
|
|
154
134
|
}
|
|
155
|
-
)
|
|
135
|
+
);
|
|
156
136
|
};
|
|
157
137
|
|
|
158
138
|
// src/Components/RadioElement.tsx
|
|
@@ -203,21 +183,24 @@ var RadioElement = (props) => {
|
|
|
203
183
|
|
|
204
184
|
// src/Components/Checkbox.tsx
|
|
205
185
|
import React7, { useState as useState3 } from "react";
|
|
206
|
-
import { Checkbox } from "antd";
|
|
186
|
+
import { Checkbox, Divider } from "antd";
|
|
207
187
|
var CheckboxGroup = Checkbox.Group;
|
|
188
|
+
var plainOptions = ["Apple", "Pear", "Orange"];
|
|
208
189
|
var defaultCheckedList = [];
|
|
209
190
|
var CheckboxElement = (props) => {
|
|
210
191
|
const [checkedList, setCheckedList] = useState3(defaultCheckedList);
|
|
211
|
-
const checkAll =
|
|
192
|
+
const checkAll = plainOptions.length === checkedList.length;
|
|
212
193
|
const handleChange = (list) => {
|
|
213
194
|
setCheckedList(list);
|
|
214
195
|
if (props.onChange) {
|
|
215
|
-
const selectedOptions =
|
|
196
|
+
const selectedOptions = list.map((value) => {
|
|
197
|
+
return { id: list.indexOf(value), value };
|
|
198
|
+
});
|
|
216
199
|
props.onChange(selectedOptions);
|
|
217
200
|
}
|
|
218
201
|
};
|
|
219
202
|
const onHandleAllChanges = (e) => {
|
|
220
|
-
const newList = e.target.checked ?
|
|
203
|
+
const newList = e.target.checked ? plainOptions : [];
|
|
221
204
|
setCheckedList(newList);
|
|
222
205
|
if (props.onChange) {
|
|
223
206
|
props.onChange(newList);
|
|
@@ -234,13 +217,13 @@ var CheckboxElement = (props) => {
|
|
|
234
217
|
checked: checkAll
|
|
235
218
|
},
|
|
236
219
|
"Check all"
|
|
237
|
-
), /* @__PURE__ */ React7.createElement(
|
|
220
|
+
), /* @__PURE__ */ React7.createElement(Divider, null), /* @__PURE__ */ React7.createElement(
|
|
238
221
|
CheckboxGroup,
|
|
239
222
|
{
|
|
240
223
|
disabled: props.disabled,
|
|
241
224
|
style: props.styles,
|
|
242
225
|
className: props.className,
|
|
243
|
-
options:
|
|
226
|
+
options: plainOptions,
|
|
244
227
|
value: checkedList,
|
|
245
228
|
onChange: handleChange
|
|
246
229
|
}
|
|
@@ -248,9 +231,55 @@ var CheckboxElement = (props) => {
|
|
|
248
231
|
};
|
|
249
232
|
|
|
250
233
|
// src/Components/CkEditor.tsx
|
|
234
|
+
import { useRef } from "react";
|
|
235
|
+
import { Editor } from "@tinymce/tinymce-react";
|
|
251
236
|
import React8 from "react";
|
|
252
237
|
var CkEditor = (props) => {
|
|
253
|
-
|
|
238
|
+
const editorRef = useRef(null);
|
|
239
|
+
const log = () => {
|
|
240
|
+
if (editorRef.current) {
|
|
241
|
+
let content = editorRef.current.getContent();
|
|
242
|
+
if (props.onChange) {
|
|
243
|
+
props.onChange(content);
|
|
244
|
+
}
|
|
245
|
+
}
|
|
246
|
+
};
|
|
247
|
+
return /* @__PURE__ */ React8.createElement("div", null, /* @__PURE__ */ React8.createElement(
|
|
248
|
+
Editor,
|
|
249
|
+
{
|
|
250
|
+
apiKey: "rwpgt7maa54n0pe5mglhkl686p7h57sg6z636n6gf2mio1b9",
|
|
251
|
+
onInit: (_evt, editor) => {
|
|
252
|
+
if (editor) editorRef.current = editor;
|
|
253
|
+
},
|
|
254
|
+
initialValue: "<p>This is the initial content of the editor.</p>",
|
|
255
|
+
init: {
|
|
256
|
+
height: 500,
|
|
257
|
+
menubar: false,
|
|
258
|
+
plugins: [
|
|
259
|
+
"advlist",
|
|
260
|
+
"autolink",
|
|
261
|
+
"lists",
|
|
262
|
+
"link",
|
|
263
|
+
"image",
|
|
264
|
+
"charmap",
|
|
265
|
+
"preview",
|
|
266
|
+
"anchor",
|
|
267
|
+
"searchreplace",
|
|
268
|
+
"visualblocks",
|
|
269
|
+
"code",
|
|
270
|
+
"fullscreen",
|
|
271
|
+
"insertdatetime",
|
|
272
|
+
"media",
|
|
273
|
+
"table",
|
|
274
|
+
"code",
|
|
275
|
+
"help",
|
|
276
|
+
"wordcount"
|
|
277
|
+
],
|
|
278
|
+
toolbar: "undo redo | blocks | bold italic forecolor | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | removeformat | help",
|
|
279
|
+
content_style: "body { font-family:Helvetica,Arial,sans-serif; font-size:14px }"
|
|
280
|
+
}
|
|
281
|
+
}
|
|
282
|
+
), /* @__PURE__ */ React8.createElement("button", { onClick: log }, "Log editor content"));
|
|
254
283
|
};
|
|
255
284
|
|
|
256
285
|
// src/Components/Select/SingleSelectElement.tsx
|
|
@@ -263,9 +292,7 @@ var filterOption = (input, option) => (option?.label ?? "").toLowerCase().includ
|
|
|
263
292
|
var SingleSelectElement = (props) => {
|
|
264
293
|
const handleChange = (values) => {
|
|
265
294
|
if (props.onChange) {
|
|
266
|
-
const option = props.dropDownOptions?.find(
|
|
267
|
-
(option2) => String(option2.title) === values
|
|
268
|
-
);
|
|
295
|
+
const option = props.dropDownOptions?.find((option2) => String(option2.title) === values);
|
|
269
296
|
const selectedOption = { id: option?.id, value: values };
|
|
270
297
|
props.onChange([selectedOption]);
|
|
271
298
|
}
|
|
@@ -279,11 +306,7 @@ var SingleSelectElement = (props) => {
|
|
|
279
306
|
onChange: handleChange,
|
|
280
307
|
onSearch,
|
|
281
308
|
filterOption,
|
|
282
|
-
options: props.dropDownOptions?.map((eachOption) => ({
|
|
283
|
-
label: String(eachOption.title),
|
|
284
|
-
value: String(eachOption.title),
|
|
285
|
-
id: String(eachOption.id)
|
|
286
|
-
}))
|
|
309
|
+
options: props.dropDownOptions?.map((eachOption) => ({ label: String(eachOption.title), value: String(eachOption.title), id: String(eachOption.id) }))
|
|
287
310
|
}
|
|
288
311
|
);
|
|
289
312
|
};
|
|
@@ -328,7 +351,7 @@ var ButtonElement = (props) => {
|
|
|
328
351
|
|
|
329
352
|
// src/Components/AddMoreTable.tsx
|
|
330
353
|
import React12, { useEffect, useState as useState4 } from "react";
|
|
331
|
-
import { Table, Button } from "antd";
|
|
354
|
+
import { Table, Button as Button2 } from "antd";
|
|
332
355
|
import { PlusOutlined, DeleteOutlined } from "@ant-design/icons";
|
|
333
356
|
var AddMoreTable = (props) => {
|
|
334
357
|
const { thead, tbody } = props;
|
|
@@ -423,13 +446,13 @@ var AddMoreTable = (props) => {
|
|
|
423
446
|
eachRow.variable_data.forEach((variable, subIndex) => {
|
|
424
447
|
Object.keys(variable).forEach((key) => {
|
|
425
448
|
if (key === "SubRows") {
|
|
426
|
-
rowData[`${key}`] = /* @__PURE__ */ React12.createElement("div", { key: subIndex }, eachRow.variable_data.length > 1 && /* @__PURE__ */ React12.createElement(
|
|
449
|
+
rowData[`${key}`] = /* @__PURE__ */ React12.createElement("div", { key: subIndex }, eachRow.variable_data.length > 1 && /* @__PURE__ */ React12.createElement(Button2, { onClick: () => onHandleSubRowsDelete(rowIndex, subIndex) }, /* @__PURE__ */ React12.createElement(DeleteOutlined, null)), subIndex === eachRow.variable_data.length - 1 && /* @__PURE__ */ React12.createElement(Button2, { onClick: () => onHandleSubRowsAdd(rowIndex) }, /* @__PURE__ */ React12.createElement(PlusOutlined, null)));
|
|
427
450
|
} else {
|
|
428
451
|
rowData[`${key}`] = renderInputElement(variable[key]);
|
|
429
452
|
}
|
|
430
453
|
});
|
|
431
454
|
});
|
|
432
|
-
rowData.actions = /* @__PURE__ */ React12.createElement("div", null, /* @__PURE__ */ React12.createElement(
|
|
455
|
+
rowData.actions = /* @__PURE__ */ React12.createElement("div", null, /* @__PURE__ */ React12.createElement(Button2, { onClick: () => onHandleDelete(eachRow.id) }, /* @__PURE__ */ React12.createElement(DeleteOutlined, null)), rowIndex === rows.length - 1 && /* @__PURE__ */ React12.createElement(Button2, { onClick: onHandleRows }, /* @__PURE__ */ React12.createElement(PlusOutlined, null)));
|
|
433
456
|
console.log("=====rowdata", rowData);
|
|
434
457
|
return rowData;
|
|
435
458
|
});
|
|
@@ -476,7 +499,7 @@ import React17 from "react";
|
|
|
476
499
|
|
|
477
500
|
// src/Components/Notification.tsx
|
|
478
501
|
import React14 from "react";
|
|
479
|
-
import { Popover, Badge, Button as
|
|
502
|
+
import { Popover, Badge, Button as Button3, Avatar, List } from "antd";
|
|
480
503
|
import { IoIosNotifications } from "react-icons/io";
|
|
481
504
|
var popoverContentStyle = {
|
|
482
505
|
minWidth: "300px",
|
|
@@ -504,7 +527,7 @@ var Notification = (props) => /* @__PURE__ */ React14.createElement(
|
|
|
504
527
|
trigger: "focus",
|
|
505
528
|
placement: "bottomRight"
|
|
506
529
|
},
|
|
507
|
-
/* @__PURE__ */ React14.createElement(
|
|
530
|
+
/* @__PURE__ */ React14.createElement(Button3, { className: props.buttonClassName }, /* @__PURE__ */ React14.createElement(Badge, { size: "small", count: props.count }, /* @__PURE__ */ React14.createElement("span", { className: props.iconsClassName }, /* @__PURE__ */ React14.createElement(IoIosNotifications, null))))
|
|
508
531
|
);
|
|
509
532
|
|
|
510
533
|
// src/Components/SpanElement.tsx
|
|
@@ -706,7 +729,7 @@ var DatePickerElement = (props) => {
|
|
|
706
729
|
|
|
707
730
|
// src/Components/DateRangePickerElement.tsx
|
|
708
731
|
import React22 from "react";
|
|
709
|
-
import { DatePicker as DatePicker2, Space } from "antd";
|
|
732
|
+
import { DatePicker as DatePicker2, Space as Space2 } from "antd";
|
|
710
733
|
import dayjs from "dayjs";
|
|
711
734
|
var DateRangePickerElement = (props) => {
|
|
712
735
|
const { RangePicker } = DatePicker2;
|
|
@@ -723,178 +746,7 @@ var DateRangePickerElement = (props) => {
|
|
|
723
746
|
{ label: "Last 30 Days", value: [dayjs().add(-30, "d"), dayjs()] },
|
|
724
747
|
{ label: "Last 90 Days", value: [dayjs().add(-90, "d"), dayjs()] }
|
|
725
748
|
];
|
|
726
|
-
return /* @__PURE__ */ React22.createElement(
|
|
727
|
-
};
|
|
728
|
-
|
|
729
|
-
// src/Components/UploadElement.tsx
|
|
730
|
-
import React23, { useState as useState7 } from "react";
|
|
731
|
-
import { Upload, Button as Button3, Modal as Modal2, Tooltip } from "antd";
|
|
732
|
-
import { UploadOutlined, PlusOutlined as PlusOutlined2, CloseOutlined } from "@ant-design/icons";
|
|
733
|
-
var UploadElement = (props) => {
|
|
734
|
-
const [previewTitle, setPreviewTitle] = useState7(null);
|
|
735
|
-
const [previewOpen, setPreviewOpen] = useState7(false);
|
|
736
|
-
const [previewType, setPreviewType] = useState7(null);
|
|
737
|
-
const [previewImage, setPreviewImage] = useState7(null);
|
|
738
|
-
const uploadChange = (fileList) => {
|
|
739
|
-
console.log(fileList);
|
|
740
|
-
if (!fileList || fileList.length === 0) return;
|
|
741
|
-
const fileArray = Array.from(fileList);
|
|
742
|
-
const selectedFile = fileArray[0];
|
|
743
|
-
if (!selectedFile) return;
|
|
744
|
-
const isCorrectFile = ["image/png", "image/jpg", "image/jpeg"].includes(selectedFile.type);
|
|
745
|
-
if (!isCorrectFile) {
|
|
746
|
-
Modal2.error({
|
|
747
|
-
title: `(${selectedFile.name}) is an invalid file.`,
|
|
748
|
-
content: `Please upload files with the following extensions only (.png/.jpg/.jpeg)`,
|
|
749
|
-
zIndex: 1022
|
|
750
|
-
});
|
|
751
|
-
return;
|
|
752
|
-
}
|
|
753
|
-
const newFile = {
|
|
754
|
-
uid: `id${Math.random().toString(16).slice(2)}`,
|
|
755
|
-
name: selectedFile.name,
|
|
756
|
-
status: "done",
|
|
757
|
-
type: selectedFile.type,
|
|
758
|
-
size: selectedFile.size,
|
|
759
|
-
url: URL.createObjectURL(selectedFile),
|
|
760
|
-
originFileObj: selectedFile
|
|
761
|
-
};
|
|
762
|
-
const reader = new FileReader();
|
|
763
|
-
reader.onload = (e) => {
|
|
764
|
-
if (e.target?.result) {
|
|
765
|
-
newFile.thumbUrl = e.target.result.toString();
|
|
766
|
-
}
|
|
767
|
-
};
|
|
768
|
-
reader.readAsDataURL(selectedFile);
|
|
769
|
-
const newFileList = props.value ? [...props.value, newFile] : [newFile];
|
|
770
|
-
props.onChange && props.onChange({
|
|
771
|
-
name: props.name,
|
|
772
|
-
value: newFileList
|
|
773
|
-
});
|
|
774
|
-
};
|
|
775
|
-
const uploadChange2 = ({ file, fileList }) => {
|
|
776
|
-
const newFileList = fileList.filter((f) => f.name !== file.name);
|
|
777
|
-
console.log(newFileList);
|
|
778
|
-
props.onChange && props.onChange({
|
|
779
|
-
name: props.name,
|
|
780
|
-
value: newFileList
|
|
781
|
-
});
|
|
782
|
-
};
|
|
783
|
-
const handlePreview = async (file) => {
|
|
784
|
-
if (!file.url && !file.preview) {
|
|
785
|
-
file.preview = await URL.createObjectURL(file.originFileObj);
|
|
786
|
-
}
|
|
787
|
-
setPreviewType(file.type || file.name.substring(file.name.lastIndexOf(".") + 1));
|
|
788
|
-
setPreviewTitle(file.name || (file.url || "").substring((file.url || "").lastIndexOf("/") + 1));
|
|
789
|
-
setPreviewOpen(true);
|
|
790
|
-
};
|
|
791
|
-
const handleCancel = () => {
|
|
792
|
-
setPreviewImage(null);
|
|
793
|
-
setPreviewType(null);
|
|
794
|
-
setPreviewOpen(false);
|
|
795
|
-
setPreviewTitle(null);
|
|
796
|
-
};
|
|
797
|
-
return /* @__PURE__ */ React23.createElement(React23.Fragment, null, /* @__PURE__ */ React23.createElement("span", { className: "native-camera-lib" }, /* @__PURE__ */ React23.createElement("p", { className: "flat-label text-capitalize" }, props.label), /* @__PURE__ */ React23.createElement("label", { className: "native-camera-button" }, /* @__PURE__ */ React23.createElement("div", { className: "ant-btn" }, /* @__PURE__ */ React23.createElement(UploadOutlined, null), " ", props.max_count ? `Upload (Max:${props.max_count})` : "Upload"), /* @__PURE__ */ React23.createElement(
|
|
798
|
-
"input",
|
|
799
|
-
{
|
|
800
|
-
id: "upload",
|
|
801
|
-
type: "file",
|
|
802
|
-
accept: "image/*;capture=camera",
|
|
803
|
-
onChange: (e) => uploadChange(e.target.files)
|
|
804
|
-
}
|
|
805
|
-
)), /* @__PURE__ */ React23.createElement(
|
|
806
|
-
Upload,
|
|
807
|
-
{
|
|
808
|
-
accept: props.accept,
|
|
809
|
-
listType: props.list_type,
|
|
810
|
-
maxCount: props.max_count,
|
|
811
|
-
multiple: true,
|
|
812
|
-
fileList: props.value,
|
|
813
|
-
onChange: uploadChange2,
|
|
814
|
-
onPreview: handlePreview,
|
|
815
|
-
showUploadList: true
|
|
816
|
-
},
|
|
817
|
-
props.list_type === "picture-card" && /* @__PURE__ */ React23.createElement("div", null, /* @__PURE__ */ React23.createElement(PlusOutlined2, null), /* @__PURE__ */ React23.createElement("div", { style: { marginTop: 8 } }, "Upload ", /* @__PURE__ */ React23.createElement("small", { className: "d-flex" }, "(Max:", props.max_count, ")"))),
|
|
818
|
-
props.list_type === "picture" && /* @__PURE__ */ React23.createElement(Button3, { icon: /* @__PURE__ */ React23.createElement(UploadOutlined, null) }, props.max_count ? `Upload (Max:${props.max_count})` : "Upload")
|
|
819
|
-
), props.errors && props.errors.length > 0 && props.errors.map((error, eKey) => /* @__PURE__ */ React23.createElement("small", { key: eKey, className: "text-danger animated flash" }, error.message)), /* @__PURE__ */ React23.createElement(
|
|
820
|
-
Modal2,
|
|
821
|
-
{
|
|
822
|
-
open: previewOpen,
|
|
823
|
-
width: "100%",
|
|
824
|
-
zIndex: 1025,
|
|
825
|
-
centered: true,
|
|
826
|
-
maskClosable: false,
|
|
827
|
-
title: previewTitle,
|
|
828
|
-
footer: null,
|
|
829
|
-
onCancel: handleCancel,
|
|
830
|
-
destroyOnClose: true
|
|
831
|
-
},
|
|
832
|
-
/* @__PURE__ */ React23.createElement(Tooltip, { title: "Close", placement: "bottom" }, /* @__PURE__ */ React23.createElement(CloseOutlined, { className: "border popup-close", onClick: handleCancel })),
|
|
833
|
-
previewType === "application/pdf" || previewType === "pdf" ? /* @__PURE__ */ React23.createElement(
|
|
834
|
-
"iframe",
|
|
835
|
-
{
|
|
836
|
-
title: "document",
|
|
837
|
-
style: { width: "95vw", height: "40vw" },
|
|
838
|
-
src: `${previewImage}#toolbar=0`
|
|
839
|
-
}
|
|
840
|
-
) : /* @__PURE__ */ React23.createElement("img", { alt: "image", src: previewImage || void 0, className: "d-flex mx-auto w-100" })
|
|
841
|
-
)));
|
|
842
|
-
};
|
|
843
|
-
|
|
844
|
-
// src/Components/Image.tsx
|
|
845
|
-
import React24 from "react";
|
|
846
|
-
var Image = (props) => {
|
|
847
|
-
return /* @__PURE__ */ React24.createElement("div", null, /* @__PURE__ */ React24.createElement("img", { className: props.className, src: props.img, alt: "image" }));
|
|
848
|
-
};
|
|
849
|
-
|
|
850
|
-
// src/Components/SingleCheckbox.tsx
|
|
851
|
-
import React25 from "react";
|
|
852
|
-
import { Checkbox as Checkbox2 } from "antd";
|
|
853
|
-
var SingleCheckbox = (props) => {
|
|
854
|
-
const handleChange = (e) => {
|
|
855
|
-
if (props.onChange) {
|
|
856
|
-
props.onChange(e.target.checked);
|
|
857
|
-
}
|
|
858
|
-
};
|
|
859
|
-
return /* @__PURE__ */ React25.createElement(Checkbox2, { onChange: (e) => handleChange(e), className: props.className }, props.label);
|
|
860
|
-
};
|
|
861
|
-
|
|
862
|
-
// src/Components/MultiSelect.tsx
|
|
863
|
-
import React26, { useState as useState8 } from "react";
|
|
864
|
-
import { Select as Select4 } from "antd";
|
|
865
|
-
var MultiSelect = (props) => {
|
|
866
|
-
const [selectedValue, setSelectedValue] = useState8({ firstValue: {}, secondValue: {} });
|
|
867
|
-
const handleFirstChange = (value) => {
|
|
868
|
-
if (props.onChange) {
|
|
869
|
-
const filterOption2 = props.options && props.options.find((eachOption) => eachOption.value === value);
|
|
870
|
-
console.log("filterOption1--------", filterOption2);
|
|
871
|
-
setSelectedValue((prev) => ({ ...prev, firstValue: filterOption2 && filterOption2 }));
|
|
872
|
-
props.onChange(selectedValue.firstValue && selectedValue);
|
|
873
|
-
}
|
|
874
|
-
};
|
|
875
|
-
const handleSecondChange = (value) => {
|
|
876
|
-
if (props.onChange) {
|
|
877
|
-
const filterOption2 = props.options && props.options.find((eachOption) => eachOption.value === value);
|
|
878
|
-
console.log("filterOption2--------", filterOption2);
|
|
879
|
-
setSelectedValue((prev) => ({ ...prev, secondValue: filterOption2 && filterOption2 }));
|
|
880
|
-
props.onChange(selectedValue.secondValue && selectedValue);
|
|
881
|
-
}
|
|
882
|
-
};
|
|
883
|
-
return /* @__PURE__ */ React26.createElement("div", { className: props.className, style: { display: "flex", flexDirection: "row", backgroundColor: "white", borderRadius: 10, border: "1px solid gray", width: "100px" } }, /* @__PURE__ */ React26.createElement(
|
|
884
|
-
Select4,
|
|
885
|
-
{
|
|
886
|
-
onChange: handleFirstChange,
|
|
887
|
-
variant: props.variant,
|
|
888
|
-
options: props.options
|
|
889
|
-
}
|
|
890
|
-
), /* @__PURE__ */ React26.createElement("div", { style: { borderLeft: "1px solid gray", height: "33px" } }), /* @__PURE__ */ React26.createElement(
|
|
891
|
-
Select4,
|
|
892
|
-
{
|
|
893
|
-
onChange: handleSecondChange,
|
|
894
|
-
variant: props.variant,
|
|
895
|
-
options: props.options
|
|
896
|
-
}
|
|
897
|
-
));
|
|
749
|
+
return /* @__PURE__ */ React22.createElement(Space2, { direction: "vertical", size: 12 }, /* @__PURE__ */ React22.createElement(RangePicker, { presets: rangePresets, onChange: handleChange }));
|
|
898
750
|
};
|
|
899
751
|
export {
|
|
900
752
|
AddMoreTable,
|
|
@@ -903,8 +755,6 @@ export {
|
|
|
903
755
|
CkEditor,
|
|
904
756
|
DatePickerElement,
|
|
905
757
|
DateRangePickerElement,
|
|
906
|
-
Image,
|
|
907
|
-
MultiSelect,
|
|
908
758
|
MultipleSelectElement,
|
|
909
759
|
Navbar,
|
|
910
760
|
NumberElement,
|
|
@@ -912,10 +762,8 @@ export {
|
|
|
912
762
|
RadioElement,
|
|
913
763
|
SelectElement,
|
|
914
764
|
Sidebar,
|
|
915
|
-
SingleCheckbox,
|
|
916
765
|
SingleSelectElement,
|
|
917
766
|
TableElement,
|
|
918
767
|
TextElement,
|
|
919
|
-
TextareaElement
|
|
920
|
-
UploadElement
|
|
768
|
+
TextareaElement
|
|
921
769
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@apexcura/ui-components",
|
|
3
|
-
"version": "0.0.13-
|
|
3
|
+
"version": "0.0.13-Beta5",
|
|
4
4
|
"description": "Apex cura React components library",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"apex cura",
|
|
@@ -48,7 +48,6 @@
|
|
|
48
48
|
"node": ">=18.0.0"
|
|
49
49
|
},
|
|
50
50
|
"dependencies": {
|
|
51
|
-
"@apexcura/core": "^0.0.15-Beta34",
|
|
52
51
|
"@apexcura/ui-components": "^0.0.11-Beta256",
|
|
53
52
|
"@tinymce/tinymce-react": "^5.0.1",
|
|
54
53
|
"autoprefixer": "^10.4.19",
|