@apexcura/ui-components 0.0.11-Beta146 → 0.0.11-Beta148
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 -21
- package/dist/index.d.mts +15 -7
- package/dist/index.d.ts +15 -7
- package/dist/index.js +97 -13
- package/dist/index.mjs +96 -14
- package/package.json +4 -1
package/dist/index.css
CHANGED
|
@@ -338,15 +338,6 @@ video {
|
|
|
338
338
|
.m-\[10px\] {
|
|
339
339
|
margin: 10px;
|
|
340
340
|
}
|
|
341
|
-
.ml-\[-7px\] {
|
|
342
|
-
margin-left: -7px;
|
|
343
|
-
}
|
|
344
|
-
.mt-\[-10px\] {
|
|
345
|
-
margin-top: -10px;
|
|
346
|
-
}
|
|
347
|
-
.flex {
|
|
348
|
-
display: flex;
|
|
349
|
-
}
|
|
350
341
|
.table {
|
|
351
342
|
display: table;
|
|
352
343
|
}
|
|
@@ -356,12 +347,6 @@ video {
|
|
|
356
347
|
.w-\[126px\] {
|
|
357
348
|
width: 126px;
|
|
358
349
|
}
|
|
359
|
-
.w-full {
|
|
360
|
-
width: 100%;
|
|
361
|
-
}
|
|
362
|
-
.justify-between {
|
|
363
|
-
justify-content: space-between;
|
|
364
|
-
}
|
|
365
350
|
.rounded-\[8px\] {
|
|
366
351
|
border-radius: 8px;
|
|
367
352
|
}
|
|
@@ -397,15 +382,9 @@ video {
|
|
|
397
382
|
.p-\[6px\] {
|
|
398
383
|
padding: 6px;
|
|
399
384
|
}
|
|
400
|
-
.pl-\[3px\] {
|
|
401
|
-
padding-left: 3px;
|
|
402
|
-
}
|
|
403
385
|
.text-center {
|
|
404
386
|
text-align: center;
|
|
405
387
|
}
|
|
406
|
-
.text-\[10px\] {
|
|
407
|
-
font-size: 10px;
|
|
408
|
-
}
|
|
409
388
|
.italic {
|
|
410
389
|
font-style: italic;
|
|
411
390
|
}
|
package/dist/index.d.mts
CHANGED
|
@@ -11,7 +11,7 @@ type ElementType = {
|
|
|
11
11
|
disabled?: boolean;
|
|
12
12
|
prefix?: React.ReactNode;
|
|
13
13
|
type?: string;
|
|
14
|
-
value?: string | number | boolean | any[] | null;
|
|
14
|
+
value?: string | number | boolean | any[] | null | undefined;
|
|
15
15
|
status?: "error" | "warning";
|
|
16
16
|
styles?: React.CSSProperties;
|
|
17
17
|
variant?: "outlined" | "borderless" | "filled";
|
|
@@ -20,8 +20,9 @@ type ElementType = {
|
|
|
20
20
|
suffix?: React.ReactNode;
|
|
21
21
|
maxLength?: number;
|
|
22
22
|
fieldNames?: any[];
|
|
23
|
+
fields?: any[];
|
|
23
24
|
options?: any[];
|
|
24
|
-
onChange?: (value: string | number | boolean | any[]) => void;
|
|
25
|
+
onChange?: (value: string | number | boolean | object | any[]) => void;
|
|
25
26
|
dropDownOptions?: any[];
|
|
26
27
|
id?: number;
|
|
27
28
|
thead?: any[];
|
|
@@ -44,10 +45,13 @@ type ElementType = {
|
|
|
44
45
|
profileImageClassName?: string;
|
|
45
46
|
profileSubClassName?: string;
|
|
46
47
|
subContainerClassName?: string;
|
|
48
|
+
element?: string;
|
|
49
|
+
secondTextClassName?: string;
|
|
50
|
+
iconsClassName?: string;
|
|
47
51
|
};
|
|
48
52
|
|
|
49
53
|
interface ElementExecuterProps$3 extends ElementType {
|
|
50
|
-
onChange: (value: string | number | boolean | any[]) => void;
|
|
54
|
+
onChange: (value: string | number | boolean | object | any[]) => void;
|
|
51
55
|
}
|
|
52
56
|
declare const TextElement: (props: ElementExecuterProps$3) => React$1.JSX.Element;
|
|
53
57
|
|
|
@@ -64,12 +68,12 @@ interface PasswordProps {
|
|
|
64
68
|
declare const PasswordElement: React$1.FC<PasswordProps>;
|
|
65
69
|
|
|
66
70
|
interface ElementExecuterProps$2 extends ElementType {
|
|
67
|
-
onChange: (value: string | number | boolean | any[]) => void;
|
|
71
|
+
onChange: (value: string | number | object | boolean | any[]) => void;
|
|
68
72
|
}
|
|
69
73
|
declare const NumberElement: (props: ElementExecuterProps$2) => React$1.JSX.Element;
|
|
70
74
|
|
|
71
75
|
interface ElementExecuterProps$1 extends ElementType {
|
|
72
|
-
onChange: (value: string | number | boolean | any[]) => void;
|
|
76
|
+
onChange: (value: string | number | boolean | object | any[]) => void;
|
|
73
77
|
}
|
|
74
78
|
declare const TextareaElement: (props: ElementExecuterProps$1) => React$1.JSX.Element;
|
|
75
79
|
|
|
@@ -80,7 +84,7 @@ declare const RadioElement: (props: ElementType) => React$1.JSX.Element;
|
|
|
80
84
|
declare const CheckboxElement: (props: ElementType) => React$1.JSX.Element;
|
|
81
85
|
|
|
82
86
|
interface ElementExecuterProps extends ElementType {
|
|
83
|
-
onChange: (value: string | number | boolean | any[]) => void;
|
|
87
|
+
onChange: (value: string | number | object | boolean | any[]) => void;
|
|
84
88
|
}
|
|
85
89
|
declare const CkEditor: (props: ElementExecuterProps) => React$1.JSX.Element;
|
|
86
90
|
|
|
@@ -96,4 +100,8 @@ declare const Sidebar: (props: ElementType) => React$1.JSX.Element;
|
|
|
96
100
|
|
|
97
101
|
declare const Navbar: (props: ElementType) => React$1.JSX.Element;
|
|
98
102
|
|
|
99
|
-
|
|
103
|
+
declare const TableElement: (props: ElementType) => React$1.JSX.Element;
|
|
104
|
+
|
|
105
|
+
declare const DatePickerElement: (props: ElementType) => React$1.JSX.Element;
|
|
106
|
+
|
|
107
|
+
export { AddMoreTable, ButtonElement, CheckboxElement, CkEditor, DatePickerElement, MultipleSelectElement, Navbar, NumberElement, PasswordElement, RadioElement, SelectElement, Sidebar, SingleSelectElement, TableElement, TextElement, TextareaElement };
|
package/dist/index.d.ts
CHANGED
|
@@ -11,7 +11,7 @@ type ElementType = {
|
|
|
11
11
|
disabled?: boolean;
|
|
12
12
|
prefix?: React.ReactNode;
|
|
13
13
|
type?: string;
|
|
14
|
-
value?: string | number | boolean | any[] | null;
|
|
14
|
+
value?: string | number | boolean | any[] | null | undefined;
|
|
15
15
|
status?: "error" | "warning";
|
|
16
16
|
styles?: React.CSSProperties;
|
|
17
17
|
variant?: "outlined" | "borderless" | "filled";
|
|
@@ -20,8 +20,9 @@ type ElementType = {
|
|
|
20
20
|
suffix?: React.ReactNode;
|
|
21
21
|
maxLength?: number;
|
|
22
22
|
fieldNames?: any[];
|
|
23
|
+
fields?: any[];
|
|
23
24
|
options?: any[];
|
|
24
|
-
onChange?: (value: string | number | boolean | any[]) => void;
|
|
25
|
+
onChange?: (value: string | number | boolean | object | any[]) => void;
|
|
25
26
|
dropDownOptions?: any[];
|
|
26
27
|
id?: number;
|
|
27
28
|
thead?: any[];
|
|
@@ -44,10 +45,13 @@ type ElementType = {
|
|
|
44
45
|
profileImageClassName?: string;
|
|
45
46
|
profileSubClassName?: string;
|
|
46
47
|
subContainerClassName?: string;
|
|
48
|
+
element?: string;
|
|
49
|
+
secondTextClassName?: string;
|
|
50
|
+
iconsClassName?: string;
|
|
47
51
|
};
|
|
48
52
|
|
|
49
53
|
interface ElementExecuterProps$3 extends ElementType {
|
|
50
|
-
onChange: (value: string | number | boolean | any[]) => void;
|
|
54
|
+
onChange: (value: string | number | boolean | object | any[]) => void;
|
|
51
55
|
}
|
|
52
56
|
declare const TextElement: (props: ElementExecuterProps$3) => React$1.JSX.Element;
|
|
53
57
|
|
|
@@ -64,12 +68,12 @@ interface PasswordProps {
|
|
|
64
68
|
declare const PasswordElement: React$1.FC<PasswordProps>;
|
|
65
69
|
|
|
66
70
|
interface ElementExecuterProps$2 extends ElementType {
|
|
67
|
-
onChange: (value: string | number | boolean | any[]) => void;
|
|
71
|
+
onChange: (value: string | number | object | boolean | any[]) => void;
|
|
68
72
|
}
|
|
69
73
|
declare const NumberElement: (props: ElementExecuterProps$2) => React$1.JSX.Element;
|
|
70
74
|
|
|
71
75
|
interface ElementExecuterProps$1 extends ElementType {
|
|
72
|
-
onChange: (value: string | number | boolean | any[]) => void;
|
|
76
|
+
onChange: (value: string | number | boolean | object | any[]) => void;
|
|
73
77
|
}
|
|
74
78
|
declare const TextareaElement: (props: ElementExecuterProps$1) => React$1.JSX.Element;
|
|
75
79
|
|
|
@@ -80,7 +84,7 @@ declare const RadioElement: (props: ElementType) => React$1.JSX.Element;
|
|
|
80
84
|
declare const CheckboxElement: (props: ElementType) => React$1.JSX.Element;
|
|
81
85
|
|
|
82
86
|
interface ElementExecuterProps extends ElementType {
|
|
83
|
-
onChange: (value: string | number | boolean | any[]) => void;
|
|
87
|
+
onChange: (value: string | number | object | boolean | any[]) => void;
|
|
84
88
|
}
|
|
85
89
|
declare const CkEditor: (props: ElementExecuterProps) => React$1.JSX.Element;
|
|
86
90
|
|
|
@@ -96,4 +100,8 @@ declare const Sidebar: (props: ElementType) => React$1.JSX.Element;
|
|
|
96
100
|
|
|
97
101
|
declare const Navbar: (props: ElementType) => React$1.JSX.Element;
|
|
98
102
|
|
|
99
|
-
|
|
103
|
+
declare const TableElement: (props: ElementType) => React$1.JSX.Element;
|
|
104
|
+
|
|
105
|
+
declare const DatePickerElement: (props: ElementType) => React$1.JSX.Element;
|
|
106
|
+
|
|
107
|
+
export { AddMoreTable, ButtonElement, CheckboxElement, CkEditor, DatePickerElement, MultipleSelectElement, Navbar, NumberElement, PasswordElement, RadioElement, SelectElement, Sidebar, SingleSelectElement, TableElement, TextElement, TextareaElement };
|
package/dist/index.js
CHANGED
|
@@ -34,6 +34,7 @@ __export(src_exports, {
|
|
|
34
34
|
ButtonElement: () => ButtonElement,
|
|
35
35
|
CheckboxElement: () => CheckboxElement,
|
|
36
36
|
CkEditor: () => CkEditor,
|
|
37
|
+
DatePickerElement: () => DatePickerElement,
|
|
37
38
|
MultipleSelectElement: () => MultipleSelectElement,
|
|
38
39
|
Navbar: () => Navbar,
|
|
39
40
|
NumberElement: () => NumberElement,
|
|
@@ -42,6 +43,7 @@ __export(src_exports, {
|
|
|
42
43
|
SelectElement: () => SelectElement,
|
|
43
44
|
Sidebar: () => Sidebar,
|
|
44
45
|
SingleSelectElement: () => SingleSelectElement,
|
|
46
|
+
TableElement: () => TableElement,
|
|
45
47
|
TextElement: () => TextElement,
|
|
46
48
|
TextareaElement: () => TextareaElement
|
|
47
49
|
});
|
|
@@ -195,9 +197,10 @@ var RadioElement = (props) => {
|
|
|
195
197
|
const [selectedValue, setSelectedValue] = (0, import_react6.useState)(props.value);
|
|
196
198
|
const optionType = props.optionType === "button" ? "button" : void 0;
|
|
197
199
|
const handleChange = (e) => {
|
|
200
|
+
console.log(e);
|
|
198
201
|
const selectedVal = e.target.value;
|
|
199
|
-
const selectedLabel =
|
|
200
|
-
const selectedOptions =
|
|
202
|
+
const selectedLabel = props.options ? props.options.find((f) => f.value === selectedVal)?.label : "";
|
|
203
|
+
const selectedOptions = { label: selectedLabel, value: selectedVal };
|
|
201
204
|
setSelectedValue(selectedVal);
|
|
202
205
|
setIsDisabled(true);
|
|
203
206
|
if (props.onChange) {
|
|
@@ -542,29 +545,108 @@ var Sidebar = (props) => {
|
|
|
542
545
|
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) => {
|
|
543
546
|
return /* @__PURE__ */ import_react14.default.createElement("li", { onClick: () => {
|
|
544
547
|
handleChange(item);
|
|
545
|
-
}, key: item.label, className: `${props.listItemClassName} ${item.active && props.activeClassName}` }, /* @__PURE__ */ import_react14.default.createElement("
|
|
548
|
+
}, key: item.label, className: `${props.listItemClassName} ${item.active && props.activeClassName}` }, /* @__PURE__ */ import_react14.default.createElement("p", null, item.icon), /* @__PURE__ */ import_react14.default.createElement("p", null, item.label));
|
|
546
549
|
})));
|
|
547
550
|
};
|
|
548
551
|
|
|
549
552
|
// src/Components/Navbar.tsx
|
|
550
|
-
var
|
|
553
|
+
var import_react18 = __toESM(require("react"));
|
|
551
554
|
|
|
552
|
-
// src/Components/
|
|
555
|
+
// src/Components/Notification.tsx
|
|
553
556
|
var import_react15 = __toESM(require("react"));
|
|
554
557
|
var import_antd12 = require("antd");
|
|
555
|
-
var
|
|
556
|
-
|
|
557
|
-
|
|
558
|
+
var import_io = require("react-icons/io");
|
|
559
|
+
var popoverContentStyle = {
|
|
560
|
+
minWidth: "300px",
|
|
561
|
+
maxWidth: "100%"
|
|
562
|
+
};
|
|
563
|
+
var Notification = (props) => /* @__PURE__ */ import_react15.default.createElement(
|
|
564
|
+
import_antd12.Popover,
|
|
565
|
+
{
|
|
566
|
+
className: props.className,
|
|
567
|
+
content: /* @__PURE__ */ import_react15.default.createElement("div", { style: popoverContentStyle }, " ", /* @__PURE__ */ import_react15.default.createElement(
|
|
568
|
+
import_antd12.List,
|
|
569
|
+
{
|
|
570
|
+
itemLayout: "horizontal",
|
|
571
|
+
dataSource: props.items,
|
|
572
|
+
renderItem: (item, index) => /* @__PURE__ */ import_react15.default.createElement(import_antd12.List.Item, { key: item.text }, /* @__PURE__ */ import_react15.default.createElement(
|
|
573
|
+
import_antd12.List.Item.Meta,
|
|
574
|
+
{
|
|
575
|
+
avatar: /* @__PURE__ */ import_react15.default.createElement(import_antd12.Avatar, { src: `https://api.dicebear.com/7.x/miniavs/svg?seed=${index}` }),
|
|
576
|
+
title: item.text,
|
|
577
|
+
description: item.time
|
|
578
|
+
}
|
|
579
|
+
))
|
|
580
|
+
}
|
|
581
|
+
)),
|
|
582
|
+
trigger: "focus",
|
|
583
|
+
placement: "bottomRight"
|
|
584
|
+
},
|
|
585
|
+
/* @__PURE__ */ import_react15.default.createElement(import_antd12.Button, { className: props.buttonClassName }, /* @__PURE__ */ import_react15.default.createElement(import_antd12.Badge, { size: "small", count: props.count }, /* @__PURE__ */ import_react15.default.createElement("span", { className: props.iconsClassName }, /* @__PURE__ */ import_react15.default.createElement(import_io.IoIosNotifications, null))))
|
|
586
|
+
);
|
|
558
587
|
|
|
559
|
-
// src/Components/
|
|
588
|
+
// src/Components/SpanElement.tsx
|
|
560
589
|
var import_react16 = __toESM(require("react"));
|
|
561
|
-
var
|
|
590
|
+
var SpanElement = (props) => /* @__PURE__ */ import_react16.default.createElement("span", { className: props.className }, props.label);
|
|
591
|
+
|
|
592
|
+
// src/Components/Profile.tsx
|
|
593
|
+
var import_react17 = __toESM(require("react"));
|
|
594
|
+
var import_antd13 = require("antd");
|
|
595
|
+
var import_icons3 = require("@ant-design/icons");
|
|
596
|
+
var Profile = (props) => /* @__PURE__ */ import_react17.default.createElement("div", { className: props.className }, /* @__PURE__ */ import_react17.default.createElement(import_antd13.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)));
|
|
562
597
|
|
|
563
598
|
// src/Components/Navbar.tsx
|
|
564
599
|
var Navbar = (props) => {
|
|
565
|
-
|
|
566
|
-
|
|
567
|
-
|
|
600
|
+
return /* @__PURE__ */ import_react18.default.createElement("div", { className: `${props.className}`, key: props.name }, props.items && props.items.map((item) => {
|
|
601
|
+
if (item.element === "span") {
|
|
602
|
+
return /* @__PURE__ */ import_react18.default.createElement(SpanElement, { ...item });
|
|
603
|
+
} else if (item.element === "notifications") {
|
|
604
|
+
return /* @__PURE__ */ import_react18.default.createElement(Notification, { ...item });
|
|
605
|
+
} else if (item.name === "profile") {
|
|
606
|
+
return /* @__PURE__ */ import_react18.default.createElement(Profile, { ...item });
|
|
607
|
+
}
|
|
608
|
+
return null;
|
|
609
|
+
}));
|
|
610
|
+
};
|
|
611
|
+
|
|
612
|
+
// src/Components/TableElement.tsx
|
|
613
|
+
var import_react19 = __toESM(require("react"));
|
|
614
|
+
var import_antd14 = require("antd");
|
|
615
|
+
var TableElement = (props) => {
|
|
616
|
+
const { thead, tbody } = props;
|
|
617
|
+
console.log("thead-----", thead);
|
|
618
|
+
console.log("tbody------", tbody);
|
|
619
|
+
const columns = thead && thead.map((col) => ({
|
|
620
|
+
title: col.label,
|
|
621
|
+
dataIndex: col.name,
|
|
622
|
+
key: col.key
|
|
623
|
+
}));
|
|
624
|
+
return /* @__PURE__ */ import_react19.default.createElement(import_antd14.Table, { dataSource: tbody, columns, bordered: true, pagination: false });
|
|
625
|
+
};
|
|
626
|
+
|
|
627
|
+
// src/Components/DatePicker.tsx
|
|
628
|
+
var import_react20 = __toESM(require("react"));
|
|
629
|
+
var import_antd15 = require("antd");
|
|
630
|
+
var import_icons4 = require("@ant-design/icons");
|
|
631
|
+
var import_date_fns = require("date-fns");
|
|
632
|
+
var DatePickerElement = (props) => {
|
|
633
|
+
const [date, setDate] = (0, import_react20.useState)(void 0);
|
|
634
|
+
const handleChange = (value) => {
|
|
635
|
+
setDate(value);
|
|
636
|
+
if (props.onChange) {
|
|
637
|
+
props.onChange(value);
|
|
638
|
+
}
|
|
639
|
+
};
|
|
640
|
+
console.log(date);
|
|
641
|
+
const onHandleDecrement = () => {
|
|
642
|
+
setDate(
|
|
643
|
+
(prev) => console.log("prev", prev)
|
|
644
|
+
);
|
|
645
|
+
};
|
|
646
|
+
const onHandleIncrement = () => {
|
|
647
|
+
setDate((prevDate) => prevDate ? (0, import_date_fns.addDays)(prevDate, 1) : void 0);
|
|
648
|
+
};
|
|
649
|
+
return /* @__PURE__ */ import_react20.default.createElement("div", null, /* @__PURE__ */ import_react20.default.createElement("button", { onClick: onHandleDecrement }, /* @__PURE__ */ import_react20.default.createElement(import_icons4.LeftOutlined, null)), /* @__PURE__ */ import_react20.default.createElement(import_antd15.DatePicker, { placeholder: props.placeholder, variant: "borderless", value: props.value, defaultValue: true, onChange: handleChange }), /* @__PURE__ */ import_react20.default.createElement("button", { onClick: onHandleIncrement }, /* @__PURE__ */ import_react20.default.createElement(import_icons4.RightOutlined, null)));
|
|
568
650
|
};
|
|
569
651
|
// Annotate the CommonJS export names for ESM import in node:
|
|
570
652
|
0 && (module.exports = {
|
|
@@ -572,6 +654,7 @@ var Navbar = (props) => {
|
|
|
572
654
|
ButtonElement,
|
|
573
655
|
CheckboxElement,
|
|
574
656
|
CkEditor,
|
|
657
|
+
DatePickerElement,
|
|
575
658
|
MultipleSelectElement,
|
|
576
659
|
Navbar,
|
|
577
660
|
NumberElement,
|
|
@@ -580,6 +663,7 @@ var Navbar = (props) => {
|
|
|
580
663
|
SelectElement,
|
|
581
664
|
Sidebar,
|
|
582
665
|
SingleSelectElement,
|
|
666
|
+
TableElement,
|
|
583
667
|
TextElement,
|
|
584
668
|
TextareaElement
|
|
585
669
|
});
|
package/dist/index.mjs
CHANGED
|
@@ -146,9 +146,10 @@ var RadioElement = (props) => {
|
|
|
146
146
|
const [selectedValue, setSelectedValue] = useState2(props.value);
|
|
147
147
|
const optionType = props.optionType === "button" ? "button" : void 0;
|
|
148
148
|
const handleChange = (e) => {
|
|
149
|
+
console.log(e);
|
|
149
150
|
const selectedVal = e.target.value;
|
|
150
|
-
const selectedLabel =
|
|
151
|
-
const selectedOptions =
|
|
151
|
+
const selectedLabel = props.options ? props.options.find((f) => f.value === selectedVal)?.label : "";
|
|
152
|
+
const selectedOptions = { label: selectedLabel, value: selectedVal };
|
|
152
153
|
setSelectedValue(selectedVal);
|
|
153
154
|
setIsDisabled(true);
|
|
154
155
|
if (props.onChange) {
|
|
@@ -493,35 +494,115 @@ var Sidebar = (props) => {
|
|
|
493
494
|
return /* @__PURE__ */ React13.createElement("div", { className: props.className, key: props.name }, /* @__PURE__ */ React13.createElement("div", null, /* @__PURE__ */ React13.createElement("img", { src: props.img, alt: "logo" })), /* @__PURE__ */ React13.createElement("ul", { className: props.listClassName }, props.items?.map((item) => {
|
|
494
495
|
return /* @__PURE__ */ React13.createElement("li", { onClick: () => {
|
|
495
496
|
handleChange(item);
|
|
496
|
-
}, key: item.label, className: `${props.listItemClassName} ${item.active && props.activeClassName}` }, /* @__PURE__ */ React13.createElement("
|
|
497
|
+
}, key: item.label, className: `${props.listItemClassName} ${item.active && props.activeClassName}` }, /* @__PURE__ */ React13.createElement("p", null, item.icon), /* @__PURE__ */ React13.createElement("p", null, item.label));
|
|
497
498
|
})));
|
|
498
499
|
};
|
|
499
500
|
|
|
500
501
|
// src/Components/Navbar.tsx
|
|
501
|
-
import
|
|
502
|
+
import React17 from "react";
|
|
502
503
|
|
|
503
|
-
// src/Components/
|
|
504
|
+
// src/Components/Notification.tsx
|
|
504
505
|
import React14 from "react";
|
|
505
|
-
import { Popover, Badge } from "antd";
|
|
506
|
-
|
|
507
|
-
|
|
508
|
-
|
|
506
|
+
import { Popover, Badge, Button as Button4, Avatar, List } from "antd";
|
|
507
|
+
import { IoIosNotifications } from "react-icons/io";
|
|
508
|
+
var popoverContentStyle = {
|
|
509
|
+
minWidth: "300px",
|
|
510
|
+
maxWidth: "100%"
|
|
511
|
+
};
|
|
512
|
+
var Notification = (props) => /* @__PURE__ */ React14.createElement(
|
|
513
|
+
Popover,
|
|
514
|
+
{
|
|
515
|
+
className: props.className,
|
|
516
|
+
content: /* @__PURE__ */ React14.createElement("div", { style: popoverContentStyle }, " ", /* @__PURE__ */ React14.createElement(
|
|
517
|
+
List,
|
|
518
|
+
{
|
|
519
|
+
itemLayout: "horizontal",
|
|
520
|
+
dataSource: props.items,
|
|
521
|
+
renderItem: (item, index) => /* @__PURE__ */ React14.createElement(List.Item, { key: item.text }, /* @__PURE__ */ React14.createElement(
|
|
522
|
+
List.Item.Meta,
|
|
523
|
+
{
|
|
524
|
+
avatar: /* @__PURE__ */ React14.createElement(Avatar, { src: `https://api.dicebear.com/7.x/miniavs/svg?seed=${index}` }),
|
|
525
|
+
title: item.text,
|
|
526
|
+
description: item.time
|
|
527
|
+
}
|
|
528
|
+
))
|
|
529
|
+
}
|
|
530
|
+
)),
|
|
531
|
+
trigger: "focus",
|
|
532
|
+
placement: "bottomRight"
|
|
533
|
+
},
|
|
534
|
+
/* @__PURE__ */ React14.createElement(Button4, { className: props.buttonClassName }, /* @__PURE__ */ React14.createElement(Badge, { size: "small", count: props.count }, /* @__PURE__ */ React14.createElement("span", { className: props.iconsClassName }, /* @__PURE__ */ React14.createElement(IoIosNotifications, null))))
|
|
535
|
+
);
|
|
509
536
|
|
|
510
|
-
// src/Components/
|
|
537
|
+
// src/Components/SpanElement.tsx
|
|
511
538
|
import React15 from "react";
|
|
512
|
-
var
|
|
539
|
+
var SpanElement = (props) => /* @__PURE__ */ React15.createElement("span", { className: props.className }, props.label);
|
|
540
|
+
|
|
541
|
+
// src/Components/Profile.tsx
|
|
542
|
+
import React16 from "react";
|
|
543
|
+
import { Avatar as Avatar2 } from "antd";
|
|
544
|
+
import { UserOutlined } from "@ant-design/icons";
|
|
545
|
+
var Profile = (props) => /* @__PURE__ */ React16.createElement("div", { className: props.className }, /* @__PURE__ */ React16.createElement(Avatar2, { style: { backgroundColor: "#87d068", marginRight: "10px" }, icon: /* @__PURE__ */ React16.createElement(UserOutlined, null) }), /* @__PURE__ */ React16.createElement("div", { className: props.profileSubClassName }, /* @__PURE__ */ React16.createElement("p", null, props.primaryText), /* @__PURE__ */ React16.createElement("p", { className: props.secondTextClassName }, " ", props.secondaryText)));
|
|
513
546
|
|
|
514
547
|
// src/Components/Navbar.tsx
|
|
515
548
|
var Navbar = (props) => {
|
|
516
|
-
|
|
517
|
-
|
|
518
|
-
|
|
549
|
+
return /* @__PURE__ */ React17.createElement("div", { className: `${props.className}`, key: props.name }, props.items && props.items.map((item) => {
|
|
550
|
+
if (item.element === "span") {
|
|
551
|
+
return /* @__PURE__ */ React17.createElement(SpanElement, { ...item });
|
|
552
|
+
} else if (item.element === "notifications") {
|
|
553
|
+
return /* @__PURE__ */ React17.createElement(Notification, { ...item });
|
|
554
|
+
} else if (item.name === "profile") {
|
|
555
|
+
return /* @__PURE__ */ React17.createElement(Profile, { ...item });
|
|
556
|
+
}
|
|
557
|
+
return null;
|
|
558
|
+
}));
|
|
559
|
+
};
|
|
560
|
+
|
|
561
|
+
// src/Components/TableElement.tsx
|
|
562
|
+
import React18 from "react";
|
|
563
|
+
import { Table as Table2 } from "antd";
|
|
564
|
+
var TableElement = (props) => {
|
|
565
|
+
const { thead, tbody } = props;
|
|
566
|
+
console.log("thead-----", thead);
|
|
567
|
+
console.log("tbody------", tbody);
|
|
568
|
+
const columns = thead && thead.map((col) => ({
|
|
569
|
+
title: col.label,
|
|
570
|
+
dataIndex: col.name,
|
|
571
|
+
key: col.key
|
|
572
|
+
}));
|
|
573
|
+
return /* @__PURE__ */ React18.createElement(Table2, { dataSource: tbody, columns, bordered: true, pagination: false });
|
|
574
|
+
};
|
|
575
|
+
|
|
576
|
+
// src/Components/DatePicker.tsx
|
|
577
|
+
import React19, { useState as useState5 } from "react";
|
|
578
|
+
import { DatePicker } from "antd";
|
|
579
|
+
import { LeftOutlined, RightOutlined } from "@ant-design/icons";
|
|
580
|
+
import { addDays } from "date-fns";
|
|
581
|
+
var DatePickerElement = (props) => {
|
|
582
|
+
const [date, setDate] = useState5(void 0);
|
|
583
|
+
const handleChange = (value) => {
|
|
584
|
+
setDate(value);
|
|
585
|
+
if (props.onChange) {
|
|
586
|
+
props.onChange(value);
|
|
587
|
+
}
|
|
588
|
+
};
|
|
589
|
+
console.log(date);
|
|
590
|
+
const onHandleDecrement = () => {
|
|
591
|
+
setDate(
|
|
592
|
+
(prev) => console.log("prev", prev)
|
|
593
|
+
);
|
|
594
|
+
};
|
|
595
|
+
const onHandleIncrement = () => {
|
|
596
|
+
setDate((prevDate) => prevDate ? addDays(prevDate, 1) : void 0);
|
|
597
|
+
};
|
|
598
|
+
return /* @__PURE__ */ React19.createElement("div", null, /* @__PURE__ */ React19.createElement("button", { onClick: onHandleDecrement }, /* @__PURE__ */ React19.createElement(LeftOutlined, null)), /* @__PURE__ */ React19.createElement(DatePicker, { placeholder: props.placeholder, variant: "borderless", value: props.value, defaultValue: true, onChange: handleChange }), /* @__PURE__ */ React19.createElement("button", { onClick: onHandleIncrement }, /* @__PURE__ */ React19.createElement(RightOutlined, null)));
|
|
519
599
|
};
|
|
520
600
|
export {
|
|
521
601
|
AddMoreTable,
|
|
522
602
|
ButtonElement,
|
|
523
603
|
CheckboxElement,
|
|
524
604
|
CkEditor,
|
|
605
|
+
DatePickerElement,
|
|
525
606
|
MultipleSelectElement,
|
|
526
607
|
Navbar,
|
|
527
608
|
NumberElement,
|
|
@@ -530,6 +611,7 @@ export {
|
|
|
530
611
|
SelectElement,
|
|
531
612
|
Sidebar,
|
|
532
613
|
SingleSelectElement,
|
|
614
|
+
TableElement,
|
|
533
615
|
TextElement,
|
|
534
616
|
TextareaElement
|
|
535
617
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@apexcura/ui-components",
|
|
3
|
-
"version": "0.0.11-
|
|
3
|
+
"version": "0.0.11-Beta148",
|
|
4
4
|
"description": "Apex cura React components library",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"apex cura",
|
|
@@ -50,9 +50,12 @@
|
|
|
50
50
|
"dependencies": {
|
|
51
51
|
"@tinymce/tinymce-react": "^5.0.1",
|
|
52
52
|
"autoprefixer": "^10.4.19",
|
|
53
|
+
"date-fns": "^3.6.0",
|
|
53
54
|
"esbuild": "^0.21.4",
|
|
55
|
+
"moment": "^2.30.1",
|
|
54
56
|
"postcss": "^8.4.38",
|
|
55
57
|
"postcss-import": "^16.1.0",
|
|
58
|
+
"react-icons": "^5.2.1",
|
|
56
59
|
"tailwindcss": "^3.4.3"
|
|
57
60
|
}
|
|
58
61
|
}
|