jett.admin.npmpackage 1.0.41 → 1.0.44

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
@@ -351,6 +351,9 @@
351
351
  .h-\[40px\] {
352
352
  height: 40px;
353
353
  }
354
+ .h-\[60px\] {
355
+ height: 60px;
356
+ }
354
357
  .h-\[90px\] {
355
358
  height: 90px;
356
359
  }
@@ -611,6 +614,9 @@
611
614
  .bg-yellow-100 {
612
615
  background-color: var(--color-yellow-100);
613
616
  }
617
+ .object-contain {
618
+ object-fit: contain;
619
+ }
614
620
  .p-2 {
615
621
  padding: calc(var(--spacing) * 2);
616
622
  }
@@ -984,11 +990,6 @@
984
990
  background-color: #27272a;
985
991
  }
986
992
  }
987
- .dark\:bg-black {
988
- &:where(.dark, .dark *) {
989
- background-color: var(--color-black);
990
- }
991
- }
992
993
  .dark\:bg-gray-800 {
993
994
  &:where(.dark, .dark *) {
994
995
  background-color: var(--color-gray-800);
package/dist/index.js CHANGED
@@ -440,8 +440,8 @@ var CustomUpload = ({
440
440
  };
441
441
 
442
442
  // src/sideBar/SideBar.jsx
443
- var import_lucide_react5 = require("lucide-react");
444
- var import_react11 = __toESM(require("react"));
443
+ var import_lucide_react6 = require("lucide-react");
444
+ var import_react12 = __toESM(require("react"));
445
445
 
446
446
  // ConstantUI.js
447
447
  var import_lucide_react4 = require("lucide-react");
@@ -614,14 +614,114 @@ var additionalItemsConstant = [
614
614
  }
615
615
  ];
616
616
 
617
- // src/assests/logo/sidebarlogo.webp
618
- var sidebarlogo_default = "./sidebarlogo-S4TNJORM.webp";
619
-
620
617
  // src/sideBar/SideBar.jsx
618
+ var import_logo_dark = __toESM(require("https://d2hhcjc4gpirud.cloudfront.net/production/logo-dark.svg"));
621
619
  var import_js_cookie = __toESM(require("js-cookie"));
622
- var AppSideBar = ({ username, role, navItems, additionalItems, sideBarLogo }) => {
620
+
621
+ // src/inputs/CustomSelect.jsx
622
+ var import_react11 = __toESM(require("react"));
623
+ var import_lucide_react5 = require("lucide-react");
624
+ var CustomSelect = ({
625
+ label,
626
+ value,
627
+ onChange,
628
+ options,
629
+ placeholder = "Select...",
630
+ isRequired = false,
631
+ error,
632
+ heading,
633
+ disabled = false
634
+ }) => {
635
+ const [open, setOpen] = (0, import_react11.useState)(false);
636
+ const [search, setSearch] = (0, import_react11.useState)("");
637
+ const wrapperRef = (0, import_react11.useRef)(null);
638
+ const handleBlur = (e) => {
639
+ var _a;
640
+ if (!((_a = wrapperRef.current) == null ? void 0 : _a.contains(e.relatedTarget))) {
641
+ setOpen(false);
642
+ }
643
+ };
644
+ const filteredOptions = options.filter(
645
+ (opt) => opt.label.toLowerCase().includes(search.toLowerCase())
646
+ );
647
+ const handleSelect = (val) => {
648
+ onChange(val);
649
+ setOpen(false);
650
+ };
651
+ const selectedOption = options.find((opt) => opt.value === value);
652
+ return /* @__PURE__ */ import_react11.default.createElement(
653
+ "div",
654
+ {
655
+ className: "flex flex-col w-full relative",
656
+ ref: wrapperRef,
657
+ tabIndex: disabled ? -1 : 0,
658
+ onBlur: handleBlur
659
+ },
660
+ heading && /* @__PURE__ */ import_react11.default.createElement("h3", { className: "text-lg font-semibold mb-1" }, heading),
661
+ label && /* @__PURE__ */ import_react11.default.createElement(
662
+ "label",
663
+ {
664
+ className: `font-medium text-sm mb-1 ${heading ? "text-gray-500" : "text-black"}`
665
+ },
666
+ label,
667
+ " ",
668
+ isRequired && /* @__PURE__ */ import_react11.default.createElement("span", { className: "text-red-500" }, "*")
669
+ ),
670
+ /* @__PURE__ */ import_react11.default.createElement(
671
+ "div",
672
+ {
673
+ onClick: () => !disabled && setOpen((prev) => !prev),
674
+ className: `flex justify-between items-center rounded-md px-3 py-2 text-sm border h-10 cursor-pointer dark:bg-[#18181b] dark:text-white
675
+ ${disabled ? "bg-gray-100 text-gray-400" : "bg-white hover:border-gray-400 dark:bg-[#18181b] dark:text-white"}
676
+ ${error ? "border-red-500" : "border-gray-300"}
677
+ `
678
+ },
679
+ /* @__PURE__ */ import_react11.default.createElement("span", { className: `${selectedOption ? "text-black dark:text-white" : "text-gray-400 dark:text-white"}` }, selectedOption ? selectedOption.label : placeholder),
680
+ /* @__PURE__ */ import_react11.default.createElement(
681
+ import_lucide_react5.ChevronDown,
682
+ {
683
+ className: `w-4 h-4 text-gray-500 transition-transform dark:text-white ${open ? "rotate-180" : ""}`
684
+ }
685
+ )
686
+ ),
687
+ open && !disabled && /* @__PURE__ */ import_react11.default.createElement("div", { className: "absolute top-full mt-1 w-full bg-white border border-gray-200 rounded-lg shadow-lg z-10 max-h-60 overflow-y-auto dark:bg-[#18181b] dark:text-white" }, /* @__PURE__ */ import_react11.default.createElement("div", { className: "flex items-center gap-2 p-2 border-b border-gray-200" }, /* @__PURE__ */ import_react11.default.createElement(import_lucide_react5.Search, { size: 16, className: "text-gray-400" }), /* @__PURE__ */ import_react11.default.createElement(
688
+ "input",
689
+ {
690
+ type: "text",
691
+ value: search,
692
+ onChange: (e) => setSearch(e.target.value),
693
+ placeholder: "Search...",
694
+ className: "flex-1 text-sm focus:outline-none"
695
+ }
696
+ )), /* @__PURE__ */ import_react11.default.createElement("ul", null, filteredOptions.length > 0 ? filteredOptions.map((opt) => /* @__PURE__ */ import_react11.default.createElement(
697
+ "li",
698
+ {
699
+ key: opt.value,
700
+ onClick: () => handleSelect(opt.value),
701
+ className: `px-3 py-2 text-sm cursor-pointer hover:bg-gray-100 dark:hover:bg-[#27272a] ${value === opt.value ? "bg-gray-100 font-medium dark:bg-[#27272a] dark:text-white" : ""}`
702
+ },
703
+ opt.label
704
+ )) : /* @__PURE__ */ import_react11.default.createElement("li", { className: "px-3 py-2 text-sm text-gray-400 dark:text-white" }, "No results found")))
705
+ );
706
+ };
707
+
708
+ // src/sideBar/SideBar.jsx
709
+ var AppSideBar = ({
710
+ username,
711
+ role,
712
+ navItems,
713
+ additionalItems,
714
+ sideBarLogo
715
+ }) => {
623
716
  var _a, _b;
624
- const [authData, setAuthData] = (0, import_react11.useState)(null);
717
+ const [authData, setAuthData] = (0, import_react12.useState)(null);
718
+ const [selectedCountry, setSelectedCountry] = (0, import_react12.useState)("dubai");
719
+ const countryOptions = [
720
+ { label: "India", value: "india" },
721
+ { label: "Dubai", value: "dubai" },
722
+ { label: "Singapore", value: "singapore" },
723
+ { label: "Qatar", value: "qatar" }
724
+ ];
625
725
  const handleIconRotate = (e, index, additionalKey, parentIndex) => {
626
726
  let dropDownIcon = e.currentTarget.children[2];
627
727
  if (!dropDownIcon) return;
@@ -631,7 +731,9 @@ var AppSideBar = ({ username, role, navItems, additionalItems, sideBarLogo }) =>
631
731
  dropDownIcon.classList.add("transition-all");
632
732
  dropDownIcon.classList.add("rotate-180");
633
733
  }
634
- const optionsContainer = document.getElementById(`dropDownOptions-${index}${additionalKey ? `-${additionalKey}` : ""}${parentIndex ? `-${parentIndex}` : ""}`);
734
+ const optionsContainer = document.getElementById(
735
+ `dropDownOptions-${index}${additionalKey ? `-${additionalKey}` : ""}${parentIndex ? `-${parentIndex}` : ""}`
736
+ );
635
737
  if (!optionsContainer) return;
636
738
  optionsContainer.classList.add("transition-all");
637
739
  if (optionsContainer.classList.contains("max-h-0")) {
@@ -642,7 +744,7 @@ var AppSideBar = ({ username, role, navItems, additionalItems, sideBarLogo }) =>
642
744
  optionsContainer.classList.add("max-h-0");
643
745
  }
644
746
  };
645
- (0, import_react11.useEffect)(() => {
747
+ (0, import_react12.useEffect)(() => {
646
748
  const storedAuthData = localStorage.getItem("authData");
647
749
  if (storedAuthData) {
648
750
  let parseData = JSON.parse(storedAuthData);
@@ -651,46 +753,105 @@ var AppSideBar = ({ username, role, navItems, additionalItems, sideBarLogo }) =>
651
753
  }, [localStorage.getItem("authData")]);
652
754
  const navItemsLocal = navItems ?? navItemsConstant;
653
755
  const additionalItemsLocal = additionalItems ?? additionalItemsConstant;
654
- const sideBarLogoLocal = sideBarLogo ?? sidebarlogo_default;
655
- return /* @__PURE__ */ import_react11.default.createElement("div", { className: "w-[320px] transition-all ease-in-out delay-100 bg-transparent border-r border-gray-200 dark:border-[#303036] flex flex-col p-4 h-full max-h-[100vh] dark:bg-[#18181b]" }, /* @__PURE__ */ import_react11.default.createElement("div", { className: "p-2 mb-4" }, /* @__PURE__ */ import_react11.default.createElement("div", { className: "w-[108px] h-[40px] flex items-center \r\n justify-center" }, /* @__PURE__ */ import_react11.default.createElement("img", { src: sideBarLogoLocal, alt: "sidebarLogo", width: 108, height: 40 }))), /* @__PURE__ */ import_react11.default.createElement("div", { className: "mb-6" }, /* @__PURE__ */ import_react11.default.createElement("div", { className: "flex ml-[20px] items-center gap-2 mb-2 dark:text-[#f4f4f5cc]" }, /* @__PURE__ */ import_react11.default.createElement("div", { className: "text-primary" }, /* @__PURE__ */ import_react11.default.createElement(import_lucide_react5.Globe, { width: 20, height: 20 })), /* @__PURE__ */ import_react11.default.createElement("h3", { className: "text-[#3f3f46cc] dark:text-[#f4f4f5cc] font-medium" }, "Data Centers")), /* @__PURE__ */ import_react11.default.createElement("div", null, /* @__PURE__ */ import_react11.default.createElement(CustomAutocomplete, { options: [] }))), /* @__PURE__ */ import_react11.default.createElement("div", { className: "overflow-y-auto" }, /* @__PURE__ */ import_react11.default.createElement("div", null, navItemsLocal == null ? void 0 : navItemsLocal.map((item, index) => {
656
- return /* @__PURE__ */ import_react11.default.createElement("div", { key: index, className: "" }, /* @__PURE__ */ import_react11.default.createElement("div", { className: "flex items-center gap-3 p-2 hover:bg-accent dark:hover:bg-[#27272a] dark:text-[#f4f4f5cc] cursor-pointer rounded-lg ml-2", onClick: (e) => {
657
- item.onClick && item.onClick(e);
658
- handleIconRotate(e, index);
659
- } }, /* @__PURE__ */ import_react11.default.createElement("div", { className: "text-primary" }, /* @__PURE__ */ import_react11.default.createElement(item.Icon, { width: 20, height: 20 })), /* @__PURE__ */ import_react11.default.createElement("span", { className: "font-medium dark:text-[#f4f4f5cc]" }, item.label), item.isDropDown && /* @__PURE__ */ import_react11.default.createElement("div", { className: `ml-auto transition-all delay-75` }, /* @__PURE__ */ import_react11.default.createElement(import_lucide_react5.ChevronDown, { width: 20, height: 20 }))), item.options && item.options.length > 0 && /* @__PURE__ */ import_react11.default.createElement("div", { className: "ml-[20px] max-h-0 overflow-hidden flex flex-col", id: `dropDownOptions-${index}` }, item.options.map((options, optionsIndex) => {
660
- return /* @__PURE__ */ import_react11.default.createElement("div", { className: "" }, /* @__PURE__ */ import_react11.default.createElement(
661
- "div",
662
- {
663
- className: "flex items-center gap-3 p-2 hover:bg-accent dark:hover:bg-[#27272a] cursor-pointer",
664
- onClick: (e) => {
665
- options.onClick && options.onClick();
666
- options.isDropDown && handleIconRotate(e, optionsIndex, "subOption", index);
667
- }
668
- },
669
- /* @__PURE__ */ import_react11.default.createElement("div", null),
670
- /* @__PURE__ */ import_react11.default.createElement("span", { className: "font-medium text-sm dark:text-[#f4f4f5cc]" }, options.label),
671
- options.isDropDown && /* @__PURE__ */ import_react11.default.createElement("div", { className: `ml-auto transition-all delay-75` }, /* @__PURE__ */ import_react11.default.createElement(import_lucide_react5.ChevronDown, { width: 20, height: 20 }))
672
- ), options.options && options.options.length > 1 && /* @__PURE__ */ import_react11.default.createElement("div", { className: "ml-[20px] max-h-0 overflow-hidden flex flex-col", id: `dropDownOptions-${optionsIndex}-subOption-${index}` }, options.options.map((subOption) => {
673
- return /* @__PURE__ */ import_react11.default.createElement(
756
+ const sideBarLogoLocal = sideBarLogo ?? import_logo_dark.default;
757
+ return /* @__PURE__ */ import_react12.default.createElement("div", { className: "w-[320px] transition-all ease-in-out delay-100 bg-transparent border-r border-gray-200 dark:border-[#303036] flex flex-col p-4 h-full max-h-[100vh] dark:bg-[#18181b]" }, /* @__PURE__ */ import_react12.default.createElement("div", { className: "p-2 mb-4" }, /* @__PURE__ */ import_react12.default.createElement("div", { className: "flex items-center justify-center w-full h-[60px] mb-4" }, /* @__PURE__ */ import_react12.default.createElement(
758
+ "img",
759
+ {
760
+ src: sideBarLogoLocal,
761
+ alt: "sidebarLogo",
762
+ width: 108,
763
+ height: 40,
764
+ className: "object-contain"
765
+ }
766
+ ))), /* @__PURE__ */ import_react12.default.createElement("div", { className: "mb-6" }, /* @__PURE__ */ import_react12.default.createElement("div", { className: "flex ml-[20px] items-center gap-2 mb-2 dark:text-[#f4f4f5cc]" }, /* @__PURE__ */ import_react12.default.createElement("div", { className: "text-primary" }, /* @__PURE__ */ import_react12.default.createElement(import_lucide_react6.Globe, { width: 20, height: 20 })), /* @__PURE__ */ import_react12.default.createElement("h3", { className: "text-[#3f3f46cc] dark:text-[#f4f4f5cc] font-medium" }, "Data Centers")), /* @__PURE__ */ import_react12.default.createElement("div", null, /* @__PURE__ */ import_react12.default.createElement(
767
+ CustomSelect,
768
+ {
769
+ heading: "Select Location",
770
+ label: "Country",
771
+ value: selectedCountry,
772
+ onChange: setSelectedCountry,
773
+ options: countryOptions,
774
+ placeholder: "Select country..."
775
+ }
776
+ ))), /* @__PURE__ */ import_react12.default.createElement("div", { className: "overflow-y-auto" }, /* @__PURE__ */ import_react12.default.createElement("div", null, navItemsLocal == null ? void 0 : navItemsLocal.map((item, index) => {
777
+ return /* @__PURE__ */ import_react12.default.createElement("div", { key: index, className: "" }, /* @__PURE__ */ import_react12.default.createElement(
778
+ "div",
779
+ {
780
+ className: "flex items-center gap-3 p-2 hover:bg-accent dark:hover:bg-[#27272a] dark:text-[#f4f4f5cc] cursor-pointer rounded-lg ml-2",
781
+ onClick: (e) => {
782
+ item.onClick && item.onClick(e);
783
+ handleIconRotate(e, index);
784
+ }
785
+ },
786
+ /* @__PURE__ */ import_react12.default.createElement("div", { className: "text-primary" }, /* @__PURE__ */ import_react12.default.createElement(item.Icon, { width: 20, height: 20 })),
787
+ /* @__PURE__ */ import_react12.default.createElement("span", { className: "font-medium dark:text-[#f4f4f5cc]" }, item.label),
788
+ item.isDropDown && /* @__PURE__ */ import_react12.default.createElement("div", { className: `ml-auto transition-all delay-75` }, /* @__PURE__ */ import_react12.default.createElement(import_lucide_react6.ChevronDown, { width: 20, height: 20 }))
789
+ ), item.options && item.options.length > 0 && /* @__PURE__ */ import_react12.default.createElement(
790
+ "div",
791
+ {
792
+ className: "ml-[20px] max-h-0 overflow-hidden flex flex-col",
793
+ id: `dropDownOptions-${index}`
794
+ },
795
+ item.options.map((options, optionsIndex) => {
796
+ return /* @__PURE__ */ import_react12.default.createElement("div", { className: "" }, /* @__PURE__ */ import_react12.default.createElement(
674
797
  "div",
675
798
  {
676
- className: "p-2 rounded-lg hover:bg-accent dark:hover:bg-[#27272a] dark:text-[#f4f4f5cc] font-medium text-sm",
799
+ className: "flex items-center gap-3 p-2 hover:bg-accent dark:hover:bg-[#27272a] cursor-pointer",
677
800
  onClick: (e) => {
678
- subOption.onClick && subOption.onClick();
801
+ options.onClick && options.onClick();
802
+ options.isDropDown && handleIconRotate(
803
+ e,
804
+ optionsIndex,
805
+ "subOption",
806
+ index
807
+ );
679
808
  }
680
809
  },
681
- subOption.label
682
- );
683
- })));
684
- })));
685
- })), /* @__PURE__ */ import_react11.default.createElement("div", { className: "border-t border-[#e5e5e5] dark:border-[#303036] mt-4" }, (additionalItemsLocal == null ? void 0 : additionalItemsLocal.length) > 0 && additionalItemsLocal.map((item, index) => {
686
- return /* @__PURE__ */ import_react11.default.createElement("div", { key: index, className: "flex items-center gap-3 p-2 hover:bg-accent dark:hover:bg-[#27272a] dark:text-[#f4f4f5cc] cursor-pointer", onClick: () => item.onClick && item.onClick() }, /* @__PURE__ */ import_react11.default.createElement("div", { className: "text-primary" }, /* @__PURE__ */ import_react11.default.createElement(item.Icon, { width: 20, height: 20 })), /* @__PURE__ */ import_react11.default.createElement("span", { className: "font-medium dark:text-[#f4f4f5cc]" }, item.label));
687
- }))), /* @__PURE__ */ import_react11.default.createElement("div", { className: "mt-auto bg-[#fafafa] dark:bg-transparent sticky bottom-0 pt-2" }, /* @__PURE__ */ import_react11.default.createElement("div", { className: "flex items-center justify-between p-2 rounded-lg hover:bg-accent dark:hover:bg-[#27272a] cursor-pointer", onClick: () => {
688
- window.location.href = "/profile";
689
- } }, /* @__PURE__ */ import_react11.default.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ import_react11.default.createElement("span", { className: "relative flex shrink-0 overflow-hidden dark:bg-[#27272a] rounded-full h-10 w-10" }, /* @__PURE__ */ import_react11.default.createElement("span", { className: "flex h-full w-full items-center justify-center rounded-full bg-muted dark:text-white" }, ((_a = authData == null ? void 0 : authData.userInfo) == null ? void 0 : _a.UserName) ? authData.userInfo.UserName.split("")[0] : "A")), /* @__PURE__ */ import_react11.default.createElement("div", null, /* @__PURE__ */ import_react11.default.createElement("p", { className: "font-semibold dark:text-white" }, ((_b = authData == null ? void 0 : authData.userInfo) == null ? void 0 : _b.UserName) ? authData.userInfo.UserName : "Admin User"), /* @__PURE__ */ import_react11.default.createElement("p", { className: "text-sm dark:text-[#f4f4f5cc]" }, role))), /* @__PURE__ */ import_react11.default.createElement("div", { className: "dark:text-[#f4f4f5cc]" }, /* @__PURE__ */ import_react11.default.createElement(import_lucide_react5.LogOut, null)))));
810
+ /* @__PURE__ */ import_react12.default.createElement("div", null),
811
+ /* @__PURE__ */ import_react12.default.createElement("span", { className: "font-medium text-sm dark:text-[#f4f4f5cc]" }, options.label),
812
+ options.isDropDown && /* @__PURE__ */ import_react12.default.createElement(
813
+ "div",
814
+ {
815
+ className: `ml-auto transition-all delay-75`
816
+ },
817
+ /* @__PURE__ */ import_react12.default.createElement(import_lucide_react6.ChevronDown, { width: 20, height: 20 })
818
+ )
819
+ ), options.options && options.options.length > 1 && /* @__PURE__ */ import_react12.default.createElement(
820
+ "div",
821
+ {
822
+ className: "ml-[20px] max-h-0 overflow-hidden flex flex-col",
823
+ id: `dropDownOptions-${optionsIndex}-subOption-${index}`
824
+ },
825
+ options.options.map((subOption) => {
826
+ return /* @__PURE__ */ import_react12.default.createElement(
827
+ "div",
828
+ {
829
+ className: "p-2 rounded-lg hover:bg-accent dark:hover:bg-[#27272a] dark:text-[#f4f4f5cc] font-medium text-sm",
830
+ onClick: (e) => {
831
+ subOption.onClick && subOption.onClick();
832
+ }
833
+ },
834
+ subOption.label
835
+ );
836
+ })
837
+ ));
838
+ })
839
+ ));
840
+ }))), /* @__PURE__ */ import_react12.default.createElement("div", { className: "mt-auto bg-[#fafafa] dark:bg-transparent sticky bottom-0 pt-2" }, /* @__PURE__ */ import_react12.default.createElement(
841
+ "div",
842
+ {
843
+ className: "flex items-center justify-between p-2 rounded-lg hover:bg-accent dark:hover:bg-[#27272a] cursor-pointer",
844
+ onClick: () => {
845
+ window.location.href = "/profile";
846
+ }
847
+ },
848
+ /* @__PURE__ */ import_react12.default.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ import_react12.default.createElement("span", { className: "relative flex shrink-0 overflow-hidden dark:bg-[#27272a] rounded-full h-10 w-10" }, /* @__PURE__ */ import_react12.default.createElement("span", { className: "flex h-full w-full items-center justify-center rounded-full bg-muted dark:text-white" }, ((_a = authData == null ? void 0 : authData.userInfo) == null ? void 0 : _a.UserName) ? authData.userInfo.UserName.split("")[0] : "A")), /* @__PURE__ */ import_react12.default.createElement("div", null, /* @__PURE__ */ import_react12.default.createElement("p", { className: "font-semibold dark:text-white" }, ((_b = authData == null ? void 0 : authData.userInfo) == null ? void 0 : _b.UserName) ? authData.userInfo.UserName : "Admin User"), /* @__PURE__ */ import_react12.default.createElement("p", { className: "text-sm dark:text-[#f4f4f5cc]" }, role))),
849
+ /* @__PURE__ */ import_react12.default.createElement("div", { className: "dark:text-[#f4f4f5cc]" }, /* @__PURE__ */ import_react12.default.createElement(import_lucide_react6.LogOut, null))
850
+ )));
690
851
  };
691
852
 
692
853
  // src/RightSheet/RightSheet.jsx
693
- var import_react12 = __toESM(require("react"));
854
+ var import_react13 = __toESM(require("react"));
694
855
  var RightSheet = ({
695
856
  open,
696
857
  setOpen,
@@ -700,8 +861,8 @@ var RightSheet = ({
700
861
  onAction = () => {
701
862
  }
702
863
  }) => {
703
- const [visible, setVisible] = (0, import_react12.useState)(open);
704
- (0, import_react12.useEffect)(() => {
864
+ const [visible, setVisible] = (0, import_react13.useState)(open);
865
+ (0, import_react13.useEffect)(() => {
705
866
  if (open) {
706
867
  document.body.style.overflow = "hidden";
707
868
  setVisible(true);
@@ -722,120 +883,33 @@ var RightSheet = ({
722
883
  handleClose();
723
884
  };
724
885
  if (!visible) return null;
725
- return /* @__PURE__ */ import_react12.default.createElement(
886
+ return /* @__PURE__ */ import_react13.default.createElement(
726
887
  "div",
727
888
  {
728
889
  className: "fixed inset-0 overflow-x-hidden bg-black/80 sheetPopIn h-full overflow-auto ",
729
890
  onClick: handleClose
730
891
  },
731
- /* @__PURE__ */ import_react12.default.createElement(
892
+ /* @__PURE__ */ import_react13.default.createElement(
732
893
  "div",
733
894
  {
734
- className: `absolute flex flex-col right-0 top-0 min-h-full min-w-[100%] md:min-w-[576px] bg-white
895
+ className: `absolute flex flex-col right-0 top-0 min-h-full min-w-[100%] md:min-w-[576px]
735
896
  ${visible ? "sheetRightSlide" : "transition-all duration-200 translate-x-[100%]"} justify-between dark:bg-[#18181b] dark:text-white`,
736
897
  onClick: (e) => e.stopPropagation()
737
898
  },
738
- /* @__PURE__ */ import_react12.default.createElement("div", { className: "bg-white min-h-full " }, children),
739
- /* @__PURE__ */ import_react12.default.createElement("div", { className: "h-[90px] flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2 p-6 border-t sticky bottom-0 bg-white border-[#e6e6e6] dark:border-[#303036] dark:bg-[#18181b] dark:text-white" }, /* @__PURE__ */ import_react12.default.createElement(CustomButton, { variant: "SECONDARY", onClick: () => handleClose() }, "Cancel"), /* @__PURE__ */ import_react12.default.createElement(CustomButton, { variant: "SECONDARY", onClick: handleAction }, actionLabel))
899
+ /* @__PURE__ */ import_react13.default.createElement("div", { className: "dark:[#18181b] min-h-full " }, children),
900
+ /* @__PURE__ */ import_react13.default.createElement("div", { className: "h-[90px] flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2 p-6 border-t sticky bottom-0 bg-white border-[#e6e6e6] dark:border-[#303036] dark:bg-[#18181b] dark:text-white" }, /* @__PURE__ */ import_react13.default.createElement(CustomButton, { variant: "SECONDARY", onClick: () => handleClose() }, "Cancel"), /* @__PURE__ */ import_react13.default.createElement(CustomButton, { variant: "SECONDARY", onClick: handleAction }, actionLabel))
740
901
  )
741
902
  );
742
903
  };
743
904
 
744
905
  // src/Table/CustomTable.jsx
745
- var import_react13 = __toESM(require("react"));
906
+ var import_react14 = __toESM(require("react"));
746
907
  var CustomTable = ({ tableHeader, setIsAllChecked, isAllChecked, children }) => {
747
- return /* @__PURE__ */ import_react13.default.createElement("div", { className: "border border-[#e5e5e5] dark:border-[#303036] rounded-lg overflow-x-auto" }, /* @__PURE__ */ import_react13.default.createElement("div", { className: "w-full relative overflow-x-auto" }, /* @__PURE__ */ import_react13.default.createElement("table", { className: "w-full caption-bottom text-sm overflow-x-auto bg-white dark:bg-[#18181b] table-fixed border-collapse" }, /* @__PURE__ */ import_react13.default.createElement("thead", { className: "border-b border-[#e5e5e5] dark:bg-[#18181b]" }, /* @__PURE__ */ import_react13.default.createElement("tr", { className: "transition-colors text-[#737373] hover:bg-muted/50 \r\n data-[state=selected]:bg-muted" }, /* @__PURE__ */ import_react13.default.createElement("th", { className: "px-4 py-3 text-left w-[50px]" }, /* @__PURE__ */ import_react13.default.createElement(CustomCheckbox, { checked: isAllChecked, onChange: () => {
908
+ return /* @__PURE__ */ import_react14.default.createElement("div", { className: "border border-[#e5e5e5] dark:border-[#303036] rounded-lg overflow-x-auto" }, /* @__PURE__ */ import_react14.default.createElement("div", { className: "w-full relative overflow-x-auto" }, /* @__PURE__ */ import_react14.default.createElement("table", { className: "w-full caption-bottom text-sm overflow-x-auto bg-white dark:bg-[#18181b] table-fixed border-collapse" }, /* @__PURE__ */ import_react14.default.createElement("thead", { className: "border-b border-[#e5e5e5] dark:bg-[#18181b]" }, /* @__PURE__ */ import_react14.default.createElement("tr", { className: "transition-colors text-[#737373] hover:bg-muted/50 \r\n data-[state=selected]:bg-muted" }, /* @__PURE__ */ import_react14.default.createElement("th", { className: "px-4 py-3 text-left w-[50px]" }, /* @__PURE__ */ import_react14.default.createElement(CustomCheckbox, { checked: isAllChecked, onChange: () => {
748
909
  setIsAllChecked(!isAllChecked);
749
910
  } })), tableHeader.map((header, index) => {
750
- return /* @__PURE__ */ import_react13.default.createElement("th", { className: `px-4 py-3 text-sm dark:bg-[#18181b] font-medium ${index == tableHeader.length - 1 ? "text-right" : "text-left"}`, key: header + index }, header);
751
- }))), /* @__PURE__ */ import_react13.default.createElement("tbody", null, children))));
752
- };
753
-
754
- // src/inputs/CustomSelect.jsx
755
- var import_react14 = __toESM(require("react"));
756
- var import_lucide_react6 = require("lucide-react");
757
- var CustomSelect = ({
758
- label,
759
- value,
760
- onChange,
761
- options,
762
- placeholder = "Select...",
763
- isRequired = false,
764
- error,
765
- heading,
766
- disabled = false
767
- }) => {
768
- const [open, setOpen] = (0, import_react14.useState)(false);
769
- const [search, setSearch] = (0, import_react14.useState)("");
770
- const wrapperRef = (0, import_react14.useRef)(null);
771
- const handleBlur = (e) => {
772
- var _a;
773
- if (!((_a = wrapperRef.current) == null ? void 0 : _a.contains(e.relatedTarget))) {
774
- setOpen(false);
775
- }
776
- };
777
- const filteredOptions = options.filter(
778
- (opt) => opt.label.toLowerCase().includes(search.toLowerCase())
779
- );
780
- const handleSelect = (val) => {
781
- onChange(val);
782
- setOpen(false);
783
- };
784
- const selectedOption = options.find((opt) => opt.value === value);
785
- return /* @__PURE__ */ import_react14.default.createElement(
786
- "div",
787
- {
788
- className: "flex flex-col w-full relative",
789
- ref: wrapperRef,
790
- tabIndex: disabled ? -1 : 0,
791
- onBlur: handleBlur
792
- },
793
- heading && /* @__PURE__ */ import_react14.default.createElement("h3", { className: "text-lg font-semibold mb-1" }, heading),
794
- label && /* @__PURE__ */ import_react14.default.createElement(
795
- "label",
796
- {
797
- className: `font-medium text-sm mb-1 ${heading ? "text-gray-500" : "text-black"}`
798
- },
799
- label,
800
- " ",
801
- isRequired && /* @__PURE__ */ import_react14.default.createElement("span", { className: "text-red-500" }, "*")
802
- ),
803
- /* @__PURE__ */ import_react14.default.createElement(
804
- "div",
805
- {
806
- onClick: () => !disabled && setOpen((prev) => !prev),
807
- className: `flex justify-between items-center rounded-md px-3 py-2 text-sm border h-10 cursor-pointer dark:bg-[#18181b] dark:text-white
808
- ${disabled ? "bg-gray-100 text-gray-400" : "bg-white hover:border-gray-400 dark:bg-[#18181b] dark:text-white"}
809
- ${error ? "border-red-500" : "border-gray-300"}
810
- `
811
- },
812
- /* @__PURE__ */ import_react14.default.createElement("span", { className: `${selectedOption ? "text-black dark:text-white" : "text-gray-400 dark:text-white"}` }, selectedOption ? selectedOption.label : placeholder),
813
- /* @__PURE__ */ import_react14.default.createElement(
814
- import_lucide_react6.ChevronDown,
815
- {
816
- className: `w-4 h-4 text-gray-500 transition-transform dark:text-white ${open ? "rotate-180" : ""}`
817
- }
818
- )
819
- ),
820
- open && !disabled && /* @__PURE__ */ import_react14.default.createElement("div", { className: "absolute top-full mt-1 w-full bg-white border border-gray-200 rounded-lg shadow-lg z-10 max-h-60 overflow-y-auto dark:bg-[#18181b] dark:text-white" }, /* @__PURE__ */ import_react14.default.createElement("div", { className: "flex items-center gap-2 p-2 border-b border-gray-200" }, /* @__PURE__ */ import_react14.default.createElement(import_lucide_react6.Search, { size: 16, className: "text-gray-400" }), /* @__PURE__ */ import_react14.default.createElement(
821
- "input",
822
- {
823
- type: "text",
824
- value: search,
825
- onChange: (e) => setSearch(e.target.value),
826
- placeholder: "Search...",
827
- className: "flex-1 text-sm focus:outline-none"
828
- }
829
- )), /* @__PURE__ */ import_react14.default.createElement("ul", null, filteredOptions.length > 0 ? filteredOptions.map((opt) => /* @__PURE__ */ import_react14.default.createElement(
830
- "li",
831
- {
832
- key: opt.value,
833
- onClick: () => handleSelect(opt.value),
834
- className: `px-3 py-2 text-sm cursor-pointer hover:bg-gray-100 dark:hover:bg-[#27272a] ${value === opt.value ? "bg-gray-100 font-medium dark:bg-[#27272a] dark:text-white" : ""}`
835
- },
836
- opt.label
837
- )) : /* @__PURE__ */ import_react14.default.createElement("li", { className: "px-3 py-2 text-sm text-gray-400 dark:text-white" }, "No results found")))
838
- );
911
+ return /* @__PURE__ */ import_react14.default.createElement("th", { className: `px-4 py-3 text-sm dark:bg-[#18181b] font-medium ${index == tableHeader.length - 1 ? "text-right" : "text-left"}`, key: header + index }, header);
912
+ }))), /* @__PURE__ */ import_react14.default.createElement("tbody", null, children))));
839
913
  };
840
914
  // Annotate the CommonJS export names for ESM import in node:
841
915
  0 && (module.exports = {
package/dist/index.mjs CHANGED
@@ -392,8 +392,8 @@ var CustomUpload = ({
392
392
  };
393
393
 
394
394
  // src/sideBar/SideBar.jsx
395
- import { ChevronDown as ChevronDown2, Globe as Globe2, LogOut } from "lucide-react";
396
- import React11, { useEffect, useState as useState2 } from "react";
395
+ import { ChevronDown as ChevronDown3, Globe as Globe2, LogOut } from "lucide-react";
396
+ import React12, { useEffect, useState as useState3 } from "react";
397
397
 
398
398
  // ConstantUI.js
399
399
  import { Home, BaggageClaim, Users, Banknote, Globe, TrendingUp, FileText, FileKey2, LifeBuoy, Cog, Building, Handshake, DollarSign } from "lucide-react";
@@ -566,14 +566,114 @@ var additionalItemsConstant = [
566
566
  }
567
567
  ];
568
568
 
569
- // src/assests/logo/sidebarlogo.webp
570
- var sidebarlogo_default = "./sidebarlogo-S4TNJORM.webp";
571
-
572
569
  // src/sideBar/SideBar.jsx
570
+ import SideBarLogoFallback from "https://d2hhcjc4gpirud.cloudfront.net/production/logo-dark.svg";
573
571
  import Cookies from "js-cookie";
574
- var AppSideBar = ({ username, role, navItems, additionalItems, sideBarLogo }) => {
572
+
573
+ // src/inputs/CustomSelect.jsx
574
+ import React11, { useState as useState2, useRef as useRef3 } from "react";
575
+ import { ChevronDown as ChevronDown2, Search as Search3 } from "lucide-react";
576
+ var CustomSelect = ({
577
+ label,
578
+ value,
579
+ onChange,
580
+ options,
581
+ placeholder = "Select...",
582
+ isRequired = false,
583
+ error,
584
+ heading,
585
+ disabled = false
586
+ }) => {
587
+ const [open, setOpen] = useState2(false);
588
+ const [search, setSearch] = useState2("");
589
+ const wrapperRef = useRef3(null);
590
+ const handleBlur = (e) => {
591
+ var _a;
592
+ if (!((_a = wrapperRef.current) == null ? void 0 : _a.contains(e.relatedTarget))) {
593
+ setOpen(false);
594
+ }
595
+ };
596
+ const filteredOptions = options.filter(
597
+ (opt) => opt.label.toLowerCase().includes(search.toLowerCase())
598
+ );
599
+ const handleSelect = (val) => {
600
+ onChange(val);
601
+ setOpen(false);
602
+ };
603
+ const selectedOption = options.find((opt) => opt.value === value);
604
+ return /* @__PURE__ */ React11.createElement(
605
+ "div",
606
+ {
607
+ className: "flex flex-col w-full relative",
608
+ ref: wrapperRef,
609
+ tabIndex: disabled ? -1 : 0,
610
+ onBlur: handleBlur
611
+ },
612
+ heading && /* @__PURE__ */ React11.createElement("h3", { className: "text-lg font-semibold mb-1" }, heading),
613
+ label && /* @__PURE__ */ React11.createElement(
614
+ "label",
615
+ {
616
+ className: `font-medium text-sm mb-1 ${heading ? "text-gray-500" : "text-black"}`
617
+ },
618
+ label,
619
+ " ",
620
+ isRequired && /* @__PURE__ */ React11.createElement("span", { className: "text-red-500" }, "*")
621
+ ),
622
+ /* @__PURE__ */ React11.createElement(
623
+ "div",
624
+ {
625
+ onClick: () => !disabled && setOpen((prev) => !prev),
626
+ className: `flex justify-between items-center rounded-md px-3 py-2 text-sm border h-10 cursor-pointer dark:bg-[#18181b] dark:text-white
627
+ ${disabled ? "bg-gray-100 text-gray-400" : "bg-white hover:border-gray-400 dark:bg-[#18181b] dark:text-white"}
628
+ ${error ? "border-red-500" : "border-gray-300"}
629
+ `
630
+ },
631
+ /* @__PURE__ */ React11.createElement("span", { className: `${selectedOption ? "text-black dark:text-white" : "text-gray-400 dark:text-white"}` }, selectedOption ? selectedOption.label : placeholder),
632
+ /* @__PURE__ */ React11.createElement(
633
+ ChevronDown2,
634
+ {
635
+ className: `w-4 h-4 text-gray-500 transition-transform dark:text-white ${open ? "rotate-180" : ""}`
636
+ }
637
+ )
638
+ ),
639
+ open && !disabled && /* @__PURE__ */ React11.createElement("div", { className: "absolute top-full mt-1 w-full bg-white border border-gray-200 rounded-lg shadow-lg z-10 max-h-60 overflow-y-auto dark:bg-[#18181b] dark:text-white" }, /* @__PURE__ */ React11.createElement("div", { className: "flex items-center gap-2 p-2 border-b border-gray-200" }, /* @__PURE__ */ React11.createElement(Search3, { size: 16, className: "text-gray-400" }), /* @__PURE__ */ React11.createElement(
640
+ "input",
641
+ {
642
+ type: "text",
643
+ value: search,
644
+ onChange: (e) => setSearch(e.target.value),
645
+ placeholder: "Search...",
646
+ className: "flex-1 text-sm focus:outline-none"
647
+ }
648
+ )), /* @__PURE__ */ React11.createElement("ul", null, filteredOptions.length > 0 ? filteredOptions.map((opt) => /* @__PURE__ */ React11.createElement(
649
+ "li",
650
+ {
651
+ key: opt.value,
652
+ onClick: () => handleSelect(opt.value),
653
+ className: `px-3 py-2 text-sm cursor-pointer hover:bg-gray-100 dark:hover:bg-[#27272a] ${value === opt.value ? "bg-gray-100 font-medium dark:bg-[#27272a] dark:text-white" : ""}`
654
+ },
655
+ opt.label
656
+ )) : /* @__PURE__ */ React11.createElement("li", { className: "px-3 py-2 text-sm text-gray-400 dark:text-white" }, "No results found")))
657
+ );
658
+ };
659
+
660
+ // src/sideBar/SideBar.jsx
661
+ var AppSideBar = ({
662
+ username,
663
+ role,
664
+ navItems,
665
+ additionalItems,
666
+ sideBarLogo
667
+ }) => {
575
668
  var _a, _b;
576
- const [authData, setAuthData] = useState2(null);
669
+ const [authData, setAuthData] = useState3(null);
670
+ const [selectedCountry, setSelectedCountry] = useState3("dubai");
671
+ const countryOptions = [
672
+ { label: "India", value: "india" },
673
+ { label: "Dubai", value: "dubai" },
674
+ { label: "Singapore", value: "singapore" },
675
+ { label: "Qatar", value: "qatar" }
676
+ ];
577
677
  const handleIconRotate = (e, index, additionalKey, parentIndex) => {
578
678
  let dropDownIcon = e.currentTarget.children[2];
579
679
  if (!dropDownIcon) return;
@@ -583,7 +683,9 @@ var AppSideBar = ({ username, role, navItems, additionalItems, sideBarLogo }) =>
583
683
  dropDownIcon.classList.add("transition-all");
584
684
  dropDownIcon.classList.add("rotate-180");
585
685
  }
586
- const optionsContainer = document.getElementById(`dropDownOptions-${index}${additionalKey ? `-${additionalKey}` : ""}${parentIndex ? `-${parentIndex}` : ""}`);
686
+ const optionsContainer = document.getElementById(
687
+ `dropDownOptions-${index}${additionalKey ? `-${additionalKey}` : ""}${parentIndex ? `-${parentIndex}` : ""}`
688
+ );
587
689
  if (!optionsContainer) return;
588
690
  optionsContainer.classList.add("transition-all");
589
691
  if (optionsContainer.classList.contains("max-h-0")) {
@@ -603,46 +705,105 @@ var AppSideBar = ({ username, role, navItems, additionalItems, sideBarLogo }) =>
603
705
  }, [localStorage.getItem("authData")]);
604
706
  const navItemsLocal = navItems ?? navItemsConstant;
605
707
  const additionalItemsLocal = additionalItems ?? additionalItemsConstant;
606
- const sideBarLogoLocal = sideBarLogo ?? sidebarlogo_default;
607
- return /* @__PURE__ */ React11.createElement("div", { className: "w-[320px] transition-all ease-in-out delay-100 bg-transparent border-r border-gray-200 dark:border-[#303036] flex flex-col p-4 h-full max-h-[100vh] dark:bg-[#18181b]" }, /* @__PURE__ */ React11.createElement("div", { className: "p-2 mb-4" }, /* @__PURE__ */ React11.createElement("div", { className: "w-[108px] h-[40px] flex items-center \r\n justify-center" }, /* @__PURE__ */ React11.createElement("img", { src: sideBarLogoLocal, alt: "sidebarLogo", width: 108, height: 40 }))), /* @__PURE__ */ React11.createElement("div", { className: "mb-6" }, /* @__PURE__ */ React11.createElement("div", { className: "flex ml-[20px] items-center gap-2 mb-2 dark:text-[#f4f4f5cc]" }, /* @__PURE__ */ React11.createElement("div", { className: "text-primary" }, /* @__PURE__ */ React11.createElement(Globe2, { width: 20, height: 20 })), /* @__PURE__ */ React11.createElement("h3", { className: "text-[#3f3f46cc] dark:text-[#f4f4f5cc] font-medium" }, "Data Centers")), /* @__PURE__ */ React11.createElement("div", null, /* @__PURE__ */ React11.createElement(CustomAutocomplete, { options: [] }))), /* @__PURE__ */ React11.createElement("div", { className: "overflow-y-auto" }, /* @__PURE__ */ React11.createElement("div", null, navItemsLocal == null ? void 0 : navItemsLocal.map((item, index) => {
608
- return /* @__PURE__ */ React11.createElement("div", { key: index, className: "" }, /* @__PURE__ */ React11.createElement("div", { className: "flex items-center gap-3 p-2 hover:bg-accent dark:hover:bg-[#27272a] dark:text-[#f4f4f5cc] cursor-pointer rounded-lg ml-2", onClick: (e) => {
609
- item.onClick && item.onClick(e);
610
- handleIconRotate(e, index);
611
- } }, /* @__PURE__ */ React11.createElement("div", { className: "text-primary" }, /* @__PURE__ */ React11.createElement(item.Icon, { width: 20, height: 20 })), /* @__PURE__ */ React11.createElement("span", { className: "font-medium dark:text-[#f4f4f5cc]" }, item.label), item.isDropDown && /* @__PURE__ */ React11.createElement("div", { className: `ml-auto transition-all delay-75` }, /* @__PURE__ */ React11.createElement(ChevronDown2, { width: 20, height: 20 }))), item.options && item.options.length > 0 && /* @__PURE__ */ React11.createElement("div", { className: "ml-[20px] max-h-0 overflow-hidden flex flex-col", id: `dropDownOptions-${index}` }, item.options.map((options, optionsIndex) => {
612
- return /* @__PURE__ */ React11.createElement("div", { className: "" }, /* @__PURE__ */ React11.createElement(
613
- "div",
614
- {
615
- className: "flex items-center gap-3 p-2 hover:bg-accent dark:hover:bg-[#27272a] cursor-pointer",
616
- onClick: (e) => {
617
- options.onClick && options.onClick();
618
- options.isDropDown && handleIconRotate(e, optionsIndex, "subOption", index);
619
- }
620
- },
621
- /* @__PURE__ */ React11.createElement("div", null),
622
- /* @__PURE__ */ React11.createElement("span", { className: "font-medium text-sm dark:text-[#f4f4f5cc]" }, options.label),
623
- options.isDropDown && /* @__PURE__ */ React11.createElement("div", { className: `ml-auto transition-all delay-75` }, /* @__PURE__ */ React11.createElement(ChevronDown2, { width: 20, height: 20 }))
624
- ), options.options && options.options.length > 1 && /* @__PURE__ */ React11.createElement("div", { className: "ml-[20px] max-h-0 overflow-hidden flex flex-col", id: `dropDownOptions-${optionsIndex}-subOption-${index}` }, options.options.map((subOption) => {
625
- return /* @__PURE__ */ React11.createElement(
708
+ const sideBarLogoLocal = sideBarLogo ?? SideBarLogoFallback;
709
+ return /* @__PURE__ */ React12.createElement("div", { className: "w-[320px] transition-all ease-in-out delay-100 bg-transparent border-r border-gray-200 dark:border-[#303036] flex flex-col p-4 h-full max-h-[100vh] dark:bg-[#18181b]" }, /* @__PURE__ */ React12.createElement("div", { className: "p-2 mb-4" }, /* @__PURE__ */ React12.createElement("div", { className: "flex items-center justify-center w-full h-[60px] mb-4" }, /* @__PURE__ */ React12.createElement(
710
+ "img",
711
+ {
712
+ src: sideBarLogoLocal,
713
+ alt: "sidebarLogo",
714
+ width: 108,
715
+ height: 40,
716
+ className: "object-contain"
717
+ }
718
+ ))), /* @__PURE__ */ React12.createElement("div", { className: "mb-6" }, /* @__PURE__ */ React12.createElement("div", { className: "flex ml-[20px] items-center gap-2 mb-2 dark:text-[#f4f4f5cc]" }, /* @__PURE__ */ React12.createElement("div", { className: "text-primary" }, /* @__PURE__ */ React12.createElement(Globe2, { width: 20, height: 20 })), /* @__PURE__ */ React12.createElement("h3", { className: "text-[#3f3f46cc] dark:text-[#f4f4f5cc] font-medium" }, "Data Centers")), /* @__PURE__ */ React12.createElement("div", null, /* @__PURE__ */ React12.createElement(
719
+ CustomSelect,
720
+ {
721
+ heading: "Select Location",
722
+ label: "Country",
723
+ value: selectedCountry,
724
+ onChange: setSelectedCountry,
725
+ options: countryOptions,
726
+ placeholder: "Select country..."
727
+ }
728
+ ))), /* @__PURE__ */ React12.createElement("div", { className: "overflow-y-auto" }, /* @__PURE__ */ React12.createElement("div", null, navItemsLocal == null ? void 0 : navItemsLocal.map((item, index) => {
729
+ return /* @__PURE__ */ React12.createElement("div", { key: index, className: "" }, /* @__PURE__ */ React12.createElement(
730
+ "div",
731
+ {
732
+ className: "flex items-center gap-3 p-2 hover:bg-accent dark:hover:bg-[#27272a] dark:text-[#f4f4f5cc] cursor-pointer rounded-lg ml-2",
733
+ onClick: (e) => {
734
+ item.onClick && item.onClick(e);
735
+ handleIconRotate(e, index);
736
+ }
737
+ },
738
+ /* @__PURE__ */ React12.createElement("div", { className: "text-primary" }, /* @__PURE__ */ React12.createElement(item.Icon, { width: 20, height: 20 })),
739
+ /* @__PURE__ */ React12.createElement("span", { className: "font-medium dark:text-[#f4f4f5cc]" }, item.label),
740
+ item.isDropDown && /* @__PURE__ */ React12.createElement("div", { className: `ml-auto transition-all delay-75` }, /* @__PURE__ */ React12.createElement(ChevronDown3, { width: 20, height: 20 }))
741
+ ), item.options && item.options.length > 0 && /* @__PURE__ */ React12.createElement(
742
+ "div",
743
+ {
744
+ className: "ml-[20px] max-h-0 overflow-hidden flex flex-col",
745
+ id: `dropDownOptions-${index}`
746
+ },
747
+ item.options.map((options, optionsIndex) => {
748
+ return /* @__PURE__ */ React12.createElement("div", { className: "" }, /* @__PURE__ */ React12.createElement(
626
749
  "div",
627
750
  {
628
- className: "p-2 rounded-lg hover:bg-accent dark:hover:bg-[#27272a] dark:text-[#f4f4f5cc] font-medium text-sm",
751
+ className: "flex items-center gap-3 p-2 hover:bg-accent dark:hover:bg-[#27272a] cursor-pointer",
629
752
  onClick: (e) => {
630
- subOption.onClick && subOption.onClick();
753
+ options.onClick && options.onClick();
754
+ options.isDropDown && handleIconRotate(
755
+ e,
756
+ optionsIndex,
757
+ "subOption",
758
+ index
759
+ );
631
760
  }
632
761
  },
633
- subOption.label
634
- );
635
- })));
636
- })));
637
- })), /* @__PURE__ */ React11.createElement("div", { className: "border-t border-[#e5e5e5] dark:border-[#303036] mt-4" }, (additionalItemsLocal == null ? void 0 : additionalItemsLocal.length) > 0 && additionalItemsLocal.map((item, index) => {
638
- return /* @__PURE__ */ React11.createElement("div", { key: index, className: "flex items-center gap-3 p-2 hover:bg-accent dark:hover:bg-[#27272a] dark:text-[#f4f4f5cc] cursor-pointer", onClick: () => item.onClick && item.onClick() }, /* @__PURE__ */ React11.createElement("div", { className: "text-primary" }, /* @__PURE__ */ React11.createElement(item.Icon, { width: 20, height: 20 })), /* @__PURE__ */ React11.createElement("span", { className: "font-medium dark:text-[#f4f4f5cc]" }, item.label));
639
- }))), /* @__PURE__ */ React11.createElement("div", { className: "mt-auto bg-[#fafafa] dark:bg-transparent sticky bottom-0 pt-2" }, /* @__PURE__ */ React11.createElement("div", { className: "flex items-center justify-between p-2 rounded-lg hover:bg-accent dark:hover:bg-[#27272a] cursor-pointer", onClick: () => {
640
- window.location.href = "/profile";
641
- } }, /* @__PURE__ */ React11.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React11.createElement("span", { className: "relative flex shrink-0 overflow-hidden dark:bg-[#27272a] rounded-full h-10 w-10" }, /* @__PURE__ */ React11.createElement("span", { className: "flex h-full w-full items-center justify-center rounded-full bg-muted dark:text-white" }, ((_a = authData == null ? void 0 : authData.userInfo) == null ? void 0 : _a.UserName) ? authData.userInfo.UserName.split("")[0] : "A")), /* @__PURE__ */ React11.createElement("div", null, /* @__PURE__ */ React11.createElement("p", { className: "font-semibold dark:text-white" }, ((_b = authData == null ? void 0 : authData.userInfo) == null ? void 0 : _b.UserName) ? authData.userInfo.UserName : "Admin User"), /* @__PURE__ */ React11.createElement("p", { className: "text-sm dark:text-[#f4f4f5cc]" }, role))), /* @__PURE__ */ React11.createElement("div", { className: "dark:text-[#f4f4f5cc]" }, /* @__PURE__ */ React11.createElement(LogOut, null)))));
762
+ /* @__PURE__ */ React12.createElement("div", null),
763
+ /* @__PURE__ */ React12.createElement("span", { className: "font-medium text-sm dark:text-[#f4f4f5cc]" }, options.label),
764
+ options.isDropDown && /* @__PURE__ */ React12.createElement(
765
+ "div",
766
+ {
767
+ className: `ml-auto transition-all delay-75`
768
+ },
769
+ /* @__PURE__ */ React12.createElement(ChevronDown3, { width: 20, height: 20 })
770
+ )
771
+ ), options.options && options.options.length > 1 && /* @__PURE__ */ React12.createElement(
772
+ "div",
773
+ {
774
+ className: "ml-[20px] max-h-0 overflow-hidden flex flex-col",
775
+ id: `dropDownOptions-${optionsIndex}-subOption-${index}`
776
+ },
777
+ options.options.map((subOption) => {
778
+ return /* @__PURE__ */ React12.createElement(
779
+ "div",
780
+ {
781
+ className: "p-2 rounded-lg hover:bg-accent dark:hover:bg-[#27272a] dark:text-[#f4f4f5cc] font-medium text-sm",
782
+ onClick: (e) => {
783
+ subOption.onClick && subOption.onClick();
784
+ }
785
+ },
786
+ subOption.label
787
+ );
788
+ })
789
+ ));
790
+ })
791
+ ));
792
+ }))), /* @__PURE__ */ React12.createElement("div", { className: "mt-auto bg-[#fafafa] dark:bg-transparent sticky bottom-0 pt-2" }, /* @__PURE__ */ React12.createElement(
793
+ "div",
794
+ {
795
+ className: "flex items-center justify-between p-2 rounded-lg hover:bg-accent dark:hover:bg-[#27272a] cursor-pointer",
796
+ onClick: () => {
797
+ window.location.href = "/profile";
798
+ }
799
+ },
800
+ /* @__PURE__ */ React12.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React12.createElement("span", { className: "relative flex shrink-0 overflow-hidden dark:bg-[#27272a] rounded-full h-10 w-10" }, /* @__PURE__ */ React12.createElement("span", { className: "flex h-full w-full items-center justify-center rounded-full bg-muted dark:text-white" }, ((_a = authData == null ? void 0 : authData.userInfo) == null ? void 0 : _a.UserName) ? authData.userInfo.UserName.split("")[0] : "A")), /* @__PURE__ */ React12.createElement("div", null, /* @__PURE__ */ React12.createElement("p", { className: "font-semibold dark:text-white" }, ((_b = authData == null ? void 0 : authData.userInfo) == null ? void 0 : _b.UserName) ? authData.userInfo.UserName : "Admin User"), /* @__PURE__ */ React12.createElement("p", { className: "text-sm dark:text-[#f4f4f5cc]" }, role))),
801
+ /* @__PURE__ */ React12.createElement("div", { className: "dark:text-[#f4f4f5cc]" }, /* @__PURE__ */ React12.createElement(LogOut, null))
802
+ )));
642
803
  };
643
804
 
644
805
  // src/RightSheet/RightSheet.jsx
645
- import React12, { useEffect as useEffect2, useState as useState3 } from "react";
806
+ import React13, { useEffect as useEffect2, useState as useState4 } from "react";
646
807
  var RightSheet = ({
647
808
  open,
648
809
  setOpen,
@@ -652,7 +813,7 @@ var RightSheet = ({
652
813
  onAction = () => {
653
814
  }
654
815
  }) => {
655
- const [visible, setVisible] = useState3(open);
816
+ const [visible, setVisible] = useState4(open);
656
817
  useEffect2(() => {
657
818
  if (open) {
658
819
  document.body.style.overflow = "hidden";
@@ -674,120 +835,33 @@ var RightSheet = ({
674
835
  handleClose();
675
836
  };
676
837
  if (!visible) return null;
677
- return /* @__PURE__ */ React12.createElement(
838
+ return /* @__PURE__ */ React13.createElement(
678
839
  "div",
679
840
  {
680
841
  className: "fixed inset-0 overflow-x-hidden bg-black/80 sheetPopIn h-full overflow-auto ",
681
842
  onClick: handleClose
682
843
  },
683
- /* @__PURE__ */ React12.createElement(
844
+ /* @__PURE__ */ React13.createElement(
684
845
  "div",
685
846
  {
686
- className: `absolute flex flex-col right-0 top-0 min-h-full min-w-[100%] md:min-w-[576px] bg-white
847
+ className: `absolute flex flex-col right-0 top-0 min-h-full min-w-[100%] md:min-w-[576px]
687
848
  ${visible ? "sheetRightSlide" : "transition-all duration-200 translate-x-[100%]"} justify-between dark:bg-[#18181b] dark:text-white`,
688
849
  onClick: (e) => e.stopPropagation()
689
850
  },
690
- /* @__PURE__ */ React12.createElement("div", { className: "bg-white min-h-full " }, children),
691
- /* @__PURE__ */ React12.createElement("div", { className: "h-[90px] flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2 p-6 border-t sticky bottom-0 bg-white border-[#e6e6e6] dark:border-[#303036] dark:bg-[#18181b] dark:text-white" }, /* @__PURE__ */ React12.createElement(CustomButton, { variant: "SECONDARY", onClick: () => handleClose() }, "Cancel"), /* @__PURE__ */ React12.createElement(CustomButton, { variant: "SECONDARY", onClick: handleAction }, actionLabel))
851
+ /* @__PURE__ */ React13.createElement("div", { className: "dark:[#18181b] min-h-full " }, children),
852
+ /* @__PURE__ */ React13.createElement("div", { className: "h-[90px] flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2 p-6 border-t sticky bottom-0 bg-white border-[#e6e6e6] dark:border-[#303036] dark:bg-[#18181b] dark:text-white" }, /* @__PURE__ */ React13.createElement(CustomButton, { variant: "SECONDARY", onClick: () => handleClose() }, "Cancel"), /* @__PURE__ */ React13.createElement(CustomButton, { variant: "SECONDARY", onClick: handleAction }, actionLabel))
692
853
  )
693
854
  );
694
855
  };
695
856
 
696
857
  // src/Table/CustomTable.jsx
697
- import React13 from "react";
858
+ import React14 from "react";
698
859
  var CustomTable = ({ tableHeader, setIsAllChecked, isAllChecked, children }) => {
699
- return /* @__PURE__ */ React13.createElement("div", { className: "border border-[#e5e5e5] dark:border-[#303036] rounded-lg overflow-x-auto" }, /* @__PURE__ */ React13.createElement("div", { className: "w-full relative overflow-x-auto" }, /* @__PURE__ */ React13.createElement("table", { className: "w-full caption-bottom text-sm overflow-x-auto bg-white dark:bg-[#18181b] table-fixed border-collapse" }, /* @__PURE__ */ React13.createElement("thead", { className: "border-b border-[#e5e5e5] dark:bg-[#18181b]" }, /* @__PURE__ */ React13.createElement("tr", { className: "transition-colors text-[#737373] hover:bg-muted/50 \r\n data-[state=selected]:bg-muted" }, /* @__PURE__ */ React13.createElement("th", { className: "px-4 py-3 text-left w-[50px]" }, /* @__PURE__ */ React13.createElement(CustomCheckbox, { checked: isAllChecked, onChange: () => {
860
+ return /* @__PURE__ */ React14.createElement("div", { className: "border border-[#e5e5e5] dark:border-[#303036] rounded-lg overflow-x-auto" }, /* @__PURE__ */ React14.createElement("div", { className: "w-full relative overflow-x-auto" }, /* @__PURE__ */ React14.createElement("table", { className: "w-full caption-bottom text-sm overflow-x-auto bg-white dark:bg-[#18181b] table-fixed border-collapse" }, /* @__PURE__ */ React14.createElement("thead", { className: "border-b border-[#e5e5e5] dark:bg-[#18181b]" }, /* @__PURE__ */ React14.createElement("tr", { className: "transition-colors text-[#737373] hover:bg-muted/50 \r\n data-[state=selected]:bg-muted" }, /* @__PURE__ */ React14.createElement("th", { className: "px-4 py-3 text-left w-[50px]" }, /* @__PURE__ */ React14.createElement(CustomCheckbox, { checked: isAllChecked, onChange: () => {
700
861
  setIsAllChecked(!isAllChecked);
701
862
  } })), tableHeader.map((header, index) => {
702
- return /* @__PURE__ */ React13.createElement("th", { className: `px-4 py-3 text-sm dark:bg-[#18181b] font-medium ${index == tableHeader.length - 1 ? "text-right" : "text-left"}`, key: header + index }, header);
703
- }))), /* @__PURE__ */ React13.createElement("tbody", null, children))));
704
- };
705
-
706
- // src/inputs/CustomSelect.jsx
707
- import React14, { useState as useState4, useRef as useRef3 } from "react";
708
- import { ChevronDown as ChevronDown3, Search as Search3 } from "lucide-react";
709
- var CustomSelect = ({
710
- label,
711
- value,
712
- onChange,
713
- options,
714
- placeholder = "Select...",
715
- isRequired = false,
716
- error,
717
- heading,
718
- disabled = false
719
- }) => {
720
- const [open, setOpen] = useState4(false);
721
- const [search, setSearch] = useState4("");
722
- const wrapperRef = useRef3(null);
723
- const handleBlur = (e) => {
724
- var _a;
725
- if (!((_a = wrapperRef.current) == null ? void 0 : _a.contains(e.relatedTarget))) {
726
- setOpen(false);
727
- }
728
- };
729
- const filteredOptions = options.filter(
730
- (opt) => opt.label.toLowerCase().includes(search.toLowerCase())
731
- );
732
- const handleSelect = (val) => {
733
- onChange(val);
734
- setOpen(false);
735
- };
736
- const selectedOption = options.find((opt) => opt.value === value);
737
- return /* @__PURE__ */ React14.createElement(
738
- "div",
739
- {
740
- className: "flex flex-col w-full relative",
741
- ref: wrapperRef,
742
- tabIndex: disabled ? -1 : 0,
743
- onBlur: handleBlur
744
- },
745
- heading && /* @__PURE__ */ React14.createElement("h3", { className: "text-lg font-semibold mb-1" }, heading),
746
- label && /* @__PURE__ */ React14.createElement(
747
- "label",
748
- {
749
- className: `font-medium text-sm mb-1 ${heading ? "text-gray-500" : "text-black"}`
750
- },
751
- label,
752
- " ",
753
- isRequired && /* @__PURE__ */ React14.createElement("span", { className: "text-red-500" }, "*")
754
- ),
755
- /* @__PURE__ */ React14.createElement(
756
- "div",
757
- {
758
- onClick: () => !disabled && setOpen((prev) => !prev),
759
- className: `flex justify-between items-center rounded-md px-3 py-2 text-sm border h-10 cursor-pointer dark:bg-[#18181b] dark:text-white
760
- ${disabled ? "bg-gray-100 text-gray-400" : "bg-white hover:border-gray-400 dark:bg-[#18181b] dark:text-white"}
761
- ${error ? "border-red-500" : "border-gray-300"}
762
- `
763
- },
764
- /* @__PURE__ */ React14.createElement("span", { className: `${selectedOption ? "text-black dark:text-white" : "text-gray-400 dark:text-white"}` }, selectedOption ? selectedOption.label : placeholder),
765
- /* @__PURE__ */ React14.createElement(
766
- ChevronDown3,
767
- {
768
- className: `w-4 h-4 text-gray-500 transition-transform dark:text-white ${open ? "rotate-180" : ""}`
769
- }
770
- )
771
- ),
772
- open && !disabled && /* @__PURE__ */ React14.createElement("div", { className: "absolute top-full mt-1 w-full bg-white border border-gray-200 rounded-lg shadow-lg z-10 max-h-60 overflow-y-auto dark:bg-[#18181b] dark:text-white" }, /* @__PURE__ */ React14.createElement("div", { className: "flex items-center gap-2 p-2 border-b border-gray-200" }, /* @__PURE__ */ React14.createElement(Search3, { size: 16, className: "text-gray-400" }), /* @__PURE__ */ React14.createElement(
773
- "input",
774
- {
775
- type: "text",
776
- value: search,
777
- onChange: (e) => setSearch(e.target.value),
778
- placeholder: "Search...",
779
- className: "flex-1 text-sm focus:outline-none"
780
- }
781
- )), /* @__PURE__ */ React14.createElement("ul", null, filteredOptions.length > 0 ? filteredOptions.map((opt) => /* @__PURE__ */ React14.createElement(
782
- "li",
783
- {
784
- key: opt.value,
785
- onClick: () => handleSelect(opt.value),
786
- className: `px-3 py-2 text-sm cursor-pointer hover:bg-gray-100 dark:hover:bg-[#27272a] ${value === opt.value ? "bg-gray-100 font-medium dark:bg-[#27272a] dark:text-white" : ""}`
787
- },
788
- opt.label
789
- )) : /* @__PURE__ */ React14.createElement("li", { className: "px-3 py-2 text-sm text-gray-400 dark:text-white" }, "No results found")))
790
- );
863
+ return /* @__PURE__ */ React14.createElement("th", { className: `px-4 py-3 text-sm dark:bg-[#18181b] font-medium ${index == tableHeader.length - 1 ? "text-right" : "text-left"}`, key: header + index }, header);
864
+ }))), /* @__PURE__ */ React14.createElement("tbody", null, children))));
791
865
  };
792
866
  export {
793
867
  AppSideBar,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "jett.admin.npmpackage",
3
- "version": "1.0.41",
3
+ "version": "1.0.44",
4
4
  "main": "dist/index.js",
5
5
  "module": "dist/index.mjs",
6
6
  "exports": {
Binary file