@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 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
- export { AddMoreTable, ButtonElement, CheckboxElement, CkEditor, MultipleSelectElement, Navbar, NumberElement, PasswordElement, RadioElement, SelectElement, Sidebar, SingleSelectElement, TextElement, TextareaElement };
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
- export { AddMoreTable, ButtonElement, CheckboxElement, CkEditor, MultipleSelectElement, Navbar, NumberElement, PasswordElement, RadioElement, SelectElement, Sidebar, SingleSelectElement, TextElement, TextareaElement };
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 = e.target.label;
200
- const selectedOptions = [{ id: selectedLabel, value: selectedVal }];
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("span", null, item.icon), /* @__PURE__ */ import_react14.default.createElement("span", null, item.label));
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 import_react17 = __toESM(require("react"));
553
+ var import_react18 = __toESM(require("react"));
551
554
 
552
- // src/Components/Notofication.tsx
555
+ // src/Components/Notification.tsx
553
556
  var import_react15 = __toESM(require("react"));
554
557
  var import_antd12 = require("antd");
555
- var Notification = (props) => /* @__PURE__ */ import_react15.default.createElement(import_antd12.Popover, { className: props.notification.className, content: props.notification.items?.map((eachItem) => {
556
- return /* @__PURE__ */ import_react15.default.createElement("div", null, /* @__PURE__ */ import_react15.default.createElement("p", null, eachItem.text), /* @__PURE__ */ import_react15.default.createElement("p", null, eachItem.time));
557
- }), trigger: "focus", placement: "bottomRight" }, /* @__PURE__ */ import_react15.default.createElement(import_antd12.Badge, { count: props.notification.count }, props.notification.icon));
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/Profile.tsx
588
+ // src/Components/SpanElement.tsx
560
589
  var import_react16 = __toESM(require("react"));
561
- var Profile = (props) => /* @__PURE__ */ import_react16.default.createElement("div", { className: props.profile.className }, /* @__PURE__ */ import_react16.default.createElement("img", { src: props.profile.profileImage, alt: "profile", className: props.profile.profileImageClassName }), /* @__PURE__ */ import_react16.default.createElement("div", { className: props.profile.profileSubClassName }, /* @__PURE__ */ import_react16.default.createElement("span", null, props.profile.primaryText), /* @__PURE__ */ import_react16.default.createElement("span", null, props.profile.secondaryText)));
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
- const test = "w-full flex justify-between";
566
- const dashboradClass = "text-xl,text-default-600";
567
- return /* @__PURE__ */ import_react17.default.createElement("div", { className: `${test} ${props.subContainerClassName}` }, /* @__PURE__ */ import_react17.default.createElement("div", { className: `${dashboradClass} ${props.dashboard.className}` }, props.dashboard.label), /* @__PURE__ */ import_react17.default.createElement("div", { className: "flex" }, /* @__PURE__ */ import_react17.default.createElement(Notification, { ...props }), /* @__PURE__ */ import_react17.default.createElement(Profile, { ...props })));
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 = e.target.label;
151
- const selectedOptions = [{ id: selectedLabel, value: selectedVal }];
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("span", null, item.icon), /* @__PURE__ */ React13.createElement("span", null, item.label));
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 React16 from "react";
502
+ import React17 from "react";
502
503
 
503
- // src/Components/Notofication.tsx
504
+ // src/Components/Notification.tsx
504
505
  import React14 from "react";
505
- import { Popover, Badge } from "antd";
506
- var Notification = (props) => /* @__PURE__ */ React14.createElement(Popover, { className: props.notification.className, content: props.notification.items?.map((eachItem) => {
507
- return /* @__PURE__ */ React14.createElement("div", null, /* @__PURE__ */ React14.createElement("p", null, eachItem.text), /* @__PURE__ */ React14.createElement("p", null, eachItem.time));
508
- }), trigger: "focus", placement: "bottomRight" }, /* @__PURE__ */ React14.createElement(Badge, { count: props.notification.count }, props.notification.icon));
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/Profile.tsx
537
+ // src/Components/SpanElement.tsx
511
538
  import React15 from "react";
512
- var Profile = (props) => /* @__PURE__ */ React15.createElement("div", { className: props.profile.className }, /* @__PURE__ */ React15.createElement("img", { src: props.profile.profileImage, alt: "profile", className: props.profile.profileImageClassName }), /* @__PURE__ */ React15.createElement("div", { className: props.profile.profileSubClassName }, /* @__PURE__ */ React15.createElement("span", null, props.profile.primaryText), /* @__PURE__ */ React15.createElement("span", null, props.profile.secondaryText)));
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
- const test = "w-full flex justify-between";
517
- const dashboradClass = "text-xl,text-default-600";
518
- return /* @__PURE__ */ React16.createElement("div", { className: `${test} ${props.subContainerClassName}` }, /* @__PURE__ */ React16.createElement("div", { className: `${dashboradClass} ${props.dashboard.className}` }, props.dashboard.label), /* @__PURE__ */ React16.createElement("div", { className: "flex" }, /* @__PURE__ */ React16.createElement(Notification, { ...props }), /* @__PURE__ */ React16.createElement(Profile, { ...props })));
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-Beta146",
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
  }