jett.admin.npmpackage 1.0.9 → 1.0.11

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.
Files changed (5) hide show
  1. package/dist/index.css +51 -3
  2. package/dist/index.js +67 -38
  3. package/dist/index.mjs +68 -39
  4. package/dist/sidebarLogo-S4TNJORM.webp +0 -0
  5. package/package.json +1 -1
package/dist/index.css CHANGED
@@ -52,6 +52,7 @@
52
52
  --radius-sm: 0.25rem;
53
53
  --radius-md: 0.375rem;
54
54
  --radius-lg: 0.5rem;
55
+ --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
55
56
  --default-transition-duration: 150ms;
56
57
  --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
57
58
  --default-font-family: var(--font-sans);
@@ -302,12 +303,12 @@
302
303
  .mb-6 {
303
304
  margin-bottom: calc(var(--spacing) * 6);
304
305
  }
306
+ .ml-2 {
307
+ margin-left: calc(var(--spacing) * 2);
308
+ }
305
309
  .ml-\[20px\] {
306
310
  margin-left: 20px;
307
311
  }
308
- .ml-\[40px\] {
309
- margin-left: 40px;
310
- }
311
312
  .ml-auto {
312
313
  margin-left: auto;
313
314
  }
@@ -356,6 +357,9 @@
356
357
  .max-h-60 {
357
358
  max-height: calc(var(--spacing) * 60);
358
359
  }
360
+ .max-h-\[100vh\] {
361
+ max-height: 100vh;
362
+ }
359
363
  .min-h-10 {
360
364
  min-height: calc(var(--spacing) * 10);
361
365
  }
@@ -547,6 +551,9 @@
547
551
  .border-red-500 {
548
552
  border-color: var(--color-red-500);
549
553
  }
554
+ .bg-\[\#ef4444\] {
555
+ background-color: #ef4444;
556
+ }
550
557
  .bg-\[\#fafafa\] {
551
558
  background-color: #fafafa;
552
559
  }
@@ -679,6 +686,9 @@
679
686
  .text-\[\#3f3f46cc\] {
680
687
  color: #3f3f46cc;
681
688
  }
689
+ .text-\[\#18181b\] {
690
+ color: #18181b;
691
+ }
682
692
  .text-\[\#737373\] {
683
693
  color: #737373;
684
694
  }
@@ -796,6 +806,9 @@
796
806
  .delay-75 {
797
807
  transition-delay: 75ms;
798
808
  }
809
+ .delay-100 {
810
+ transition-delay: 100ms;
811
+ }
799
812
  .duration-200 {
800
813
  --tw-duration: 200ms;
801
814
  transition-duration: 200ms;
@@ -804,6 +817,10 @@
804
817
  --tw-duration: 300ms;
805
818
  transition-duration: 300ms;
806
819
  }
820
+ .ease-in-out {
821
+ --tw-ease: var(--ease-in-out);
822
+ transition-timing-function: var(--ease-in-out);
823
+ }
807
824
  .select-none {
808
825
  -webkit-user-select: none;
809
826
  user-select: none;
@@ -942,6 +959,35 @@
942
959
  min-width: 576px;
943
960
  }
944
961
  }
962
+ .dark\:bg-transparent {
963
+ &:where(.dark, .dark *) {
964
+ background-color: transparent;
965
+ }
966
+ }
967
+ .dark\:text-\[\#f4f4f5b3\] {
968
+ &:where(.dark, .dark *) {
969
+ color: #f4f4f5b3;
970
+ }
971
+ }
972
+ .dark\:text-black {
973
+ &:where(.dark, .dark *) {
974
+ color: var(--color-black);
975
+ }
976
+ }
977
+ .dark\:text-white {
978
+ &:where(.dark, .dark *) {
979
+ color: var(--color-white);
980
+ }
981
+ }
982
+ .dark\:hover\:bg-\[\#27272a\] {
983
+ &:where(.dark, .dark *) {
984
+ &:hover {
985
+ @media (hover: hover) {
986
+ background-color: #27272a;
987
+ }
988
+ }
989
+ }
990
+ }
945
991
  }
946
992
  @property --tw-translate-x { syntax: "*"; inherits: false; initial-value: 0; }
947
993
  @property --tw-translate-y { syntax: "*"; inherits: false; initial-value: 0; }
@@ -969,6 +1015,7 @@
969
1015
  @property --tw-ring-offset-color { syntax: "*"; inherits: false; initial-value: #fff; }
970
1016
  @property --tw-ring-offset-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }
971
1017
  @property --tw-duration { syntax: "*"; inherits: false; }
1018
+ @property --tw-ease { syntax: "*"; inherits: false; }
972
1019
  @property --tw-outline-style { syntax: "*"; inherits: false; initial-value: solid; }
973
1020
  @property --tw-space-x-reverse { syntax: "*"; inherits: false; initial-value: 0; }
974
1021
  @layer properties {
@@ -1003,6 +1050,7 @@
1003
1050
  --tw-ring-offset-color: #fff;
1004
1051
  --tw-ring-offset-shadow: 0 0 #0000;
1005
1052
  --tw-duration: initial;
1053
+ --tw-ease: initial;
1006
1054
  --tw-outline-style: solid;
1007
1055
  --tw-space-x-reverse: 0;
1008
1056
  }
package/dist/index.js CHANGED
@@ -57,26 +57,29 @@ var import_react = __toESM(require("react"));
57
57
  var variantStyles = {
58
58
  PRIMARY: "bg-white",
59
59
  SECONDARY: "bg-black text-white",
60
- DEFAULT: "bg-white text-black hover:bg-gray-100"
60
+ DEFAULT: "bg-white text-black hover:bg-gray-100",
61
+ DANGER: "bg-[#ef4444] text-white"
61
62
  };
62
63
  var CustomButton = ({
63
64
  variant,
64
65
  children,
65
66
  className,
66
67
  onClick,
67
- disabled = false
68
+ disabled = false,
69
+ icon
68
70
  }) => {
69
71
  console.log(disabled);
70
72
  return /* @__PURE__ */ import_react.default.createElement(
71
73
  "div",
72
74
  {
73
75
  className: cn(
74
- `cursor-pointer flex items-center py-2 px-3 min-h-10 justify-center border rounded-[6px] border-[#e5e5e5]`,
76
+ `cursor-pointer flex items-center py-2 px-3 min-h-10 justify-center border rounded-[6px] border-[#e5e5e5] gap-2`,
75
77
  variantStyles[variant],
76
78
  className
77
79
  ),
78
80
  onClick
79
81
  },
82
+ icon && /* @__PURE__ */ import_react.default.createElement("div", null, icon),
80
83
  children
81
84
  );
82
85
  };
@@ -296,7 +299,7 @@ var CustomInput = ({
296
299
  ), /* @__PURE__ */ import_react6.default.createElement(
297
300
  "input",
298
301
  {
299
- className: `border border-gray-200 rounded-md h-10 px-4 py-2 w-full text-[14px]
302
+ className: `border dark:text-black border-gray-200 rounded-md h-10 px-4 py-2 w-full text-[14px]
300
303
  focus:outline-2 outline-black outline-offset-2
301
304
  ${disabled ? "bg-gray-100 cursor-not-allowed text-gray-500 border-gray-300" : error ? "border-red-500 bg-red-50" : "bg-white border-[hsl(0_0%_89.8%)]"}
302
305
  `,
@@ -443,39 +446,48 @@ var import_lucide_react4 = require("lucide-react");
443
446
  var navItemsConstant = [
444
447
  { Icon: import_lucide_react4.Home, label: "Home", onClick: () => {
445
448
  }, isDropDown: false },
446
- { Icon: import_lucide_react4.BaggageClaim, label: "Trips", onClick: () => {
447
- }, isDropDown: false },
448
- { Icon: import_lucide_react4.Users, label: "Admin Users", onClick: () => {
449
- }, isDropDown: true, options: [{ label: "Users", onclick: () => {
450
- } }, { label: "Role", onclick: () => {
449
+ { Icon: import_lucide_react4.Handshake, label: "Supplier Ecosystem", onClick: () => {
450
+ }, isDropDown: true, options: [{ label: "Suppliers", onClick: () => {
451
451
  } }] },
452
- { Icon: import_lucide_react4.Banknote, label: "Corporate", onClick: () => {
453
- }, isDropDown: false },
454
- { Icon: import_lucide_react4.Globe, label: "TMC Entities", onClick: () => {
455
- }, isDropDown: false },
456
- { Icon: import_lucide_react4.Globe, label: "Reports", onClick: () => {
457
- }, isDropDown: false },
458
- { Icon: import_lucide_react4.TrendingUp, label: "Revenue Management", onClick: () => {
459
- }, isDropDown: true, options: [{ label: "Users", onclick: () => {
460
- } }, { label: "Role", onclick: () => {
452
+ { Icon: import_lucide_react4.Building, label: "Consumer Ecosystem", onClick: () => {
453
+ }, options: [{ label: "Corporate", onClick: () => {
454
+ } }, { label: "Trips", onClick: () => {
455
+ } }, { label: "Reports", onClick: () => {
456
+ } }, { label: "Tags", onClick: () => {
457
+ } }], isDropDown: true },
458
+ { Icon: import_lucide_react4.Banknote, label: "Finance", onClick: () => {
459
+ }, isDropDown: true, options: [{ label: "Invoices", onClick: () => {
460
+ } }, { label: "Ledger", onClick: () => {
461
+ } }, { label: "Payments", onClick: () => {
461
462
  } }] },
462
- { Icon: import_lucide_react4.FileText, label: "Finance", onClick: () => {
463
- }, isDropDown: true },
464
- { Icon: import_lucide_react4.FileKey2, label: "Master Configuration", onClick: () => {
465
- }, isDropDown: true, options: [{ label: "Users", onclick: () => {
466
- } }, { label: "Role", onclick: () => {
463
+ { Icon: import_lucide_react4.DollarSign, label: "Revenue Management", onClick: () => {
464
+ }, isDropDown: true, options: [{ label: "Pricing Policy", onClick: () => {
465
+ } }, { label: "Offers", onClick: () => {
466
+ } }, { label: "Vouchers", onClick: () => {
467
+ } }, { label: "Supplier Deals", onClick: () => {
468
+ } }, { label: "Subscription Plans", onClick: () => {
469
+ } }] },
470
+ { Icon: import_lucide_react4.Cog, label: "Settings", onClick: () => {
471
+ }, isDropDown: true, options: [{ label: "Admin user Management", isDropDown: true, onClick: () => {
472
+ }, options: [{ label: "Admin Users", onClick: () => {
473
+ } }, { label: "Admin User Attributes", onClick: () => {
474
+ } }] }, { label: "TMC Markets", onClick: () => {
475
+ } }, { label: "Permissions", onClick: () => {
476
+ } }, { label: "Report Configurations", onClick: () => {
477
+ } }, { label: "Whitelabelling", onClick: () => {
467
478
  } }] }
468
479
  ];
469
480
  var additionalItemsConstant = [
470
- { Icon: import_lucide_react4.LifeBuoy, label: "Support", onclick: () => {
471
- } },
472
- { Icon: import_lucide_react4.Cog, label: "Settings", onclick: () => {
481
+ { Icon: import_lucide_react4.LifeBuoy, label: "Help", onclick: () => {
473
482
  } }
474
483
  ];
475
484
 
485
+ // src/assests/logo/sidebarlogo.webp
486
+ var sidebarlogo_default = "./sidebarlogo-S4TNJORM.webp";
487
+
476
488
  // src/sideBar/SideBar.jsx
477
489
  var AppSideBar = ({ username, role, navItems, additionalItems, sideBarLogo }) => {
478
- const handleIconRotate = (e, index) => {
490
+ const handleIconRotate = (e, index, additionalKey) => {
479
491
  let dropDownIcon = e.currentTarget.children[2];
480
492
  if (!dropDownIcon) return;
481
493
  if (dropDownIcon.classList.contains("rotate-180")) {
@@ -484,7 +496,7 @@ var AppSideBar = ({ username, role, navItems, additionalItems, sideBarLogo }) =>
484
496
  dropDownIcon.classList.add("transition-all");
485
497
  dropDownIcon.classList.add("rotate-180");
486
498
  }
487
- const optionsContainer = document.getElementById(`dropDownOptions-${index}`);
499
+ const optionsContainer = document.getElementById(`dropDownOptions-${index}${additionalKey ? `-${additionalKey}` : ""}`);
488
500
  if (!optionsContainer) return;
489
501
  optionsContainer.classList.add("transition-all");
490
502
  if (optionsContainer.classList.contains("max-h-0")) {
@@ -497,23 +509,40 @@ var AppSideBar = ({ username, role, navItems, additionalItems, sideBarLogo }) =>
497
509
  };
498
510
  const navItemsLocal = navItems ?? navItemsConstant;
499
511
  const additionalItemsLocal = additionalItems ?? additionalItemsConstant;
500
- return /* @__PURE__ */ import_react11.default.createElement("div", { className: "w-72 bg-[#fafafa] border-r border-gray-200 flex flex-col p-4 h-full" }, /* @__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: sideBarLogo, 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" }, /* @__PURE__ */ import_react11.default.createElement(import_lucide_react5.Globe, { width: 20, height: 20, color: "#18181b" }), /* @__PURE__ */ import_react11.default.createElement("h3", { className: "text-[#3f3f46cc] font-medium" }, "Data Centers")), /* @__PURE__ */ import_react11.default.createElement("div", null, /* @__PURE__ */ import_react11.default.createElement(CustomAutocomplete, { options: [] }))), /* @__PURE__ */ import_react11.default.createElement("div", null, navItemsLocal == null ? void 0 : navItemsLocal.map((item, index) => {
501
- 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-[#f3f4f6] cursor-pointer", onClick: (e) => {
512
+ const sideBarLogoLocal = sideBarLogo ?? sidebarlogo_default;
513
+ return /* @__PURE__ */ import_react11.default.createElement("div", { className: "w-72 transition-all ease-in-out delay-100 bg-transparent border-r border-gray-200 flex flex-col p-4 h-full max-h-[100vh]" }, /* @__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-white" }, /* @__PURE__ */ import_react11.default.createElement(import_lucide_react5.Globe, { width: 20, height: 20 }), /* @__PURE__ */ import_react11.default.createElement("h3", { className: "text-[#3f3f46cc] dark:text-white 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) => {
514
+ 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-[#f3f4f6] dark:hover:bg-[#27272a] dark:text-white cursor-pointer rounded-lg ml-2", onClick: (e) => {
502
515
  item.onClick && item.onClick(e);
503
516
  handleIconRotate(e, index);
504
- } }, /* @__PURE__ */ import_react11.default.createElement(item.Icon, { width: 20, height: 20, color: "#18181b" }), /* @__PURE__ */ import_react11.default.createElement("span", { className: "font-medium text-[#3f3f46cc]" }, 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-[40px] max-h-0 overflow-hidden flex flex-col", id: `dropDownOptions-${index}` }, item.options.map((options) => {
505
- return /* @__PURE__ */ import_react11.default.createElement(
517
+ } }, /* @__PURE__ */ import_react11.default.createElement(item.Icon, { width: 20, height: 20 }), /* @__PURE__ */ import_react11.default.createElement("span", { className: "font-medium text-[#3f3f46cc] dark:text-white" }, 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) => {
518
+ return /* @__PURE__ */ import_react11.default.createElement("div", { className: "" }, /* @__PURE__ */ import_react11.default.createElement(
506
519
  "div",
507
520
  {
508
- className: "p-2 rounded-lg hover:bg-gray-100 text-[#3f3f46cc] font-medium text-sm",
509
- onClick: () => options.onclick && options.onclick()
521
+ className: "flex items-center gap-3 p-2 hover:bg-[#f3f4f6] cursor-pointer",
522
+ onClick: (e) => {
523
+ options.onclick && options.onclick();
524
+ options.isDropDown && handleIconRotate(e, optionsIndex, "subOption");
525
+ }
510
526
  },
511
- options.label
512
- );
527
+ /* @__PURE__ */ import_react11.default.createElement("div", null),
528
+ /* @__PURE__ */ import_react11.default.createElement("span", { className: "font-medium text-sm text-[#3f3f46cc]" }, options.label),
529
+ 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 }))
530
+ ), 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` }, options.options.map((subOption) => {
531
+ return /* @__PURE__ */ import_react11.default.createElement(
532
+ "div",
533
+ {
534
+ className: "p-2 rounded-lg hover:bg-gray-100 text-[#3f3f46cc] font-medium text-sm",
535
+ onClick: (e) => {
536
+ subOption.onclick && options.onclick();
537
+ }
538
+ },
539
+ subOption.label
540
+ );
541
+ })));
513
542
  })));
514
543
  })), /* @__PURE__ */ import_react11.default.createElement("div", { className: "border-t border-[#e5e5e5] mt-4" }, (additionalItemsLocal == null ? void 0 : additionalItemsLocal.length) > 0 && additionalItemsLocal.map((item, index) => {
515
- return /* @__PURE__ */ import_react11.default.createElement("div", { key: index, className: "flex items-center gap-3 p-2 hover:bg-[#f3f4f6] cursor-pointer", onClick: () => item.onClick && item.onClick() }, /* @__PURE__ */ import_react11.default.createElement(item.Icon, { width: 20, height: 20, color: "#18181b" }), /* @__PURE__ */ import_react11.default.createElement("span", { className: "font-medium text-[#3f3f46cc]" }, item.label));
516
- })), /* @__PURE__ */ import_react11.default.createElement("div", { className: "mt-auto bg-[#fafafa] border-t border-[#e5e5e5] sticky bottom-0 pt-2" }, /* @__PURE__ */ import_react11.default.createElement("div", { className: "flex items-center justify-between p-2 rounded-lg hover:bg-[#f4f4f5] cursor-pointer" }, /* @__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 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" }, username && username.split("")[0])), /* @__PURE__ */ import_react11.default.createElement("div", null, /* @__PURE__ */ import_react11.default.createElement("p", { className: "font-semibold" }, username), /* @__PURE__ */ import_react11.default.createElement("p", { className: "text-sm text-[#3f3f46cc]" }, role))), /* @__PURE__ */ import_react11.default.createElement(import_lucide_react5.LogOut, { color: "#18181b" }))));
544
+ return /* @__PURE__ */ import_react11.default.createElement("div", { key: index, className: "flex items-center gap-3 p-2 hover:bg-[#f3f4f6] dark:hover:bg-[#27272a] dark:text-white cursor-pointer", onClick: () => item.onClick && item.onClick() }, /* @__PURE__ */ import_react11.default.createElement(item.Icon, { width: 20, height: 20 }), /* @__PURE__ */ import_react11.default.createElement("span", { className: "font-medium text-[#3f3f46cc] dark:text-white" }, item.label));
545
+ }))), /* @__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-[#f4f4f5] dark:hover:bg-[#27272a] cursor-pointer" }, /* @__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 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" }, username && username.split("")[0])), /* @__PURE__ */ import_react11.default.createElement("div", null, /* @__PURE__ */ import_react11.default.createElement("p", { className: "font-semibold" }, username), /* @__PURE__ */ import_react11.default.createElement("p", { className: "text-sm text-[#3f3f46cc] dark:text-[#f4f4f5b3]" }, role))), /* @__PURE__ */ import_react11.default.createElement("div", { className: "text-[#18181b] dark:text-white" }, /* @__PURE__ */ import_react11.default.createElement(import_lucide_react5.LogOut, null)))));
517
546
  };
518
547
 
519
548
  // src/RightSheet/RightSheet.jsx
package/dist/index.mjs CHANGED
@@ -10,26 +10,29 @@ import React from "react";
10
10
  var variantStyles = {
11
11
  PRIMARY: "bg-white",
12
12
  SECONDARY: "bg-black text-white",
13
- DEFAULT: "bg-white text-black hover:bg-gray-100"
13
+ DEFAULT: "bg-white text-black hover:bg-gray-100",
14
+ DANGER: "bg-[#ef4444] text-white"
14
15
  };
15
16
  var CustomButton = ({
16
17
  variant,
17
18
  children,
18
19
  className,
19
20
  onClick,
20
- disabled = false
21
+ disabled = false,
22
+ icon
21
23
  }) => {
22
24
  console.log(disabled);
23
25
  return /* @__PURE__ */ React.createElement(
24
26
  "div",
25
27
  {
26
28
  className: cn(
27
- `cursor-pointer flex items-center py-2 px-3 min-h-10 justify-center border rounded-[6px] border-[#e5e5e5]`,
29
+ `cursor-pointer flex items-center py-2 px-3 min-h-10 justify-center border rounded-[6px] border-[#e5e5e5] gap-2`,
28
30
  variantStyles[variant],
29
31
  className
30
32
  ),
31
33
  onClick
32
34
  },
35
+ icon && /* @__PURE__ */ React.createElement("div", null, icon),
33
36
  children
34
37
  );
35
38
  };
@@ -249,7 +252,7 @@ var CustomInput = ({
249
252
  ), /* @__PURE__ */ React6.createElement(
250
253
  "input",
251
254
  {
252
- className: `border border-gray-200 rounded-md h-10 px-4 py-2 w-full text-[14px]
255
+ className: `border dark:text-black border-gray-200 rounded-md h-10 px-4 py-2 w-full text-[14px]
253
256
  focus:outline-2 outline-black outline-offset-2
254
257
  ${disabled ? "bg-gray-100 cursor-not-allowed text-gray-500 border-gray-300" : error ? "border-red-500 bg-red-50" : "bg-white border-[hsl(0_0%_89.8%)]"}
255
258
  `,
@@ -392,43 +395,52 @@ import { ChevronDown as ChevronDown2, Globe as Globe2, LogOut } from "lucide-rea
392
395
  import React11 from "react";
393
396
 
394
397
  // ConstantUI.js
395
- import { Home, BaggageClaim, Users, Banknote, Globe, TrendingUp, FileText, FileKey2, LifeBuoy, Cog } from "lucide-react";
398
+ import { Home, BaggageClaim, Users, Banknote, Globe, TrendingUp, FileText, FileKey2, LifeBuoy, Cog, Building, Handshake, DollarSign } from "lucide-react";
396
399
  var navItemsConstant = [
397
400
  { Icon: Home, label: "Home", onClick: () => {
398
401
  }, isDropDown: false },
399
- { Icon: BaggageClaim, label: "Trips", onClick: () => {
400
- }, isDropDown: false },
401
- { Icon: Users, label: "Admin Users", onClick: () => {
402
- }, isDropDown: true, options: [{ label: "Users", onclick: () => {
403
- } }, { label: "Role", onclick: () => {
402
+ { Icon: Handshake, label: "Supplier Ecosystem", onClick: () => {
403
+ }, isDropDown: true, options: [{ label: "Suppliers", onClick: () => {
404
404
  } }] },
405
- { Icon: Banknote, label: "Corporate", onClick: () => {
406
- }, isDropDown: false },
407
- { Icon: Globe, label: "TMC Entities", onClick: () => {
408
- }, isDropDown: false },
409
- { Icon: Globe, label: "Reports", onClick: () => {
410
- }, isDropDown: false },
411
- { Icon: TrendingUp, label: "Revenue Management", onClick: () => {
412
- }, isDropDown: true, options: [{ label: "Users", onclick: () => {
413
- } }, { label: "Role", onclick: () => {
405
+ { Icon: Building, label: "Consumer Ecosystem", onClick: () => {
406
+ }, options: [{ label: "Corporate", onClick: () => {
407
+ } }, { label: "Trips", onClick: () => {
408
+ } }, { label: "Reports", onClick: () => {
409
+ } }, { label: "Tags", onClick: () => {
410
+ } }], isDropDown: true },
411
+ { Icon: Banknote, label: "Finance", onClick: () => {
412
+ }, isDropDown: true, options: [{ label: "Invoices", onClick: () => {
413
+ } }, { label: "Ledger", onClick: () => {
414
+ } }, { label: "Payments", onClick: () => {
414
415
  } }] },
415
- { Icon: FileText, label: "Finance", onClick: () => {
416
- }, isDropDown: true },
417
- { Icon: FileKey2, label: "Master Configuration", onClick: () => {
418
- }, isDropDown: true, options: [{ label: "Users", onclick: () => {
419
- } }, { label: "Role", onclick: () => {
416
+ { Icon: DollarSign, label: "Revenue Management", onClick: () => {
417
+ }, isDropDown: true, options: [{ label: "Pricing Policy", onClick: () => {
418
+ } }, { label: "Offers", onClick: () => {
419
+ } }, { label: "Vouchers", onClick: () => {
420
+ } }, { label: "Supplier Deals", onClick: () => {
421
+ } }, { label: "Subscription Plans", onClick: () => {
422
+ } }] },
423
+ { Icon: Cog, label: "Settings", onClick: () => {
424
+ }, isDropDown: true, options: [{ label: "Admin user Management", isDropDown: true, onClick: () => {
425
+ }, options: [{ label: "Admin Users", onClick: () => {
426
+ } }, { label: "Admin User Attributes", onClick: () => {
427
+ } }] }, { label: "TMC Markets", onClick: () => {
428
+ } }, { label: "Permissions", onClick: () => {
429
+ } }, { label: "Report Configurations", onClick: () => {
430
+ } }, { label: "Whitelabelling", onClick: () => {
420
431
  } }] }
421
432
  ];
422
433
  var additionalItemsConstant = [
423
- { Icon: LifeBuoy, label: "Support", onclick: () => {
424
- } },
425
- { Icon: Cog, label: "Settings", onclick: () => {
434
+ { Icon: LifeBuoy, label: "Help", onclick: () => {
426
435
  } }
427
436
  ];
428
437
 
438
+ // src/assests/logo/sidebarlogo.webp
439
+ var sidebarlogo_default = "./sidebarlogo-S4TNJORM.webp";
440
+
429
441
  // src/sideBar/SideBar.jsx
430
442
  var AppSideBar = ({ username, role, navItems, additionalItems, sideBarLogo }) => {
431
- const handleIconRotate = (e, index) => {
443
+ const handleIconRotate = (e, index, additionalKey) => {
432
444
  let dropDownIcon = e.currentTarget.children[2];
433
445
  if (!dropDownIcon) return;
434
446
  if (dropDownIcon.classList.contains("rotate-180")) {
@@ -437,7 +449,7 @@ var AppSideBar = ({ username, role, navItems, additionalItems, sideBarLogo }) =>
437
449
  dropDownIcon.classList.add("transition-all");
438
450
  dropDownIcon.classList.add("rotate-180");
439
451
  }
440
- const optionsContainer = document.getElementById(`dropDownOptions-${index}`);
452
+ const optionsContainer = document.getElementById(`dropDownOptions-${index}${additionalKey ? `-${additionalKey}` : ""}`);
441
453
  if (!optionsContainer) return;
442
454
  optionsContainer.classList.add("transition-all");
443
455
  if (optionsContainer.classList.contains("max-h-0")) {
@@ -450,23 +462,40 @@ var AppSideBar = ({ username, role, navItems, additionalItems, sideBarLogo }) =>
450
462
  };
451
463
  const navItemsLocal = navItems ?? navItemsConstant;
452
464
  const additionalItemsLocal = additionalItems ?? additionalItemsConstant;
453
- return /* @__PURE__ */ React11.createElement("div", { className: "w-72 bg-[#fafafa] border-r border-gray-200 flex flex-col p-4 h-full" }, /* @__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: sideBarLogo, 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" }, /* @__PURE__ */ React11.createElement(Globe2, { width: 20, height: 20, color: "#18181b" }), /* @__PURE__ */ React11.createElement("h3", { className: "text-[#3f3f46cc] font-medium" }, "Data Centers")), /* @__PURE__ */ React11.createElement("div", null, /* @__PURE__ */ React11.createElement(CustomAutocomplete, { options: [] }))), /* @__PURE__ */ React11.createElement("div", null, navItemsLocal == null ? void 0 : navItemsLocal.map((item, index) => {
454
- return /* @__PURE__ */ React11.createElement("div", { key: index, className: "" }, /* @__PURE__ */ React11.createElement("div", { className: "flex items-center gap-3 p-2 hover:bg-[#f3f4f6] cursor-pointer", onClick: (e) => {
465
+ const sideBarLogoLocal = sideBarLogo ?? sidebarlogo_default;
466
+ return /* @__PURE__ */ React11.createElement("div", { className: "w-72 transition-all ease-in-out delay-100 bg-transparent border-r border-gray-200 flex flex-col p-4 h-full max-h-[100vh]" }, /* @__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-white" }, /* @__PURE__ */ React11.createElement(Globe2, { width: 20, height: 20 }), /* @__PURE__ */ React11.createElement("h3", { className: "text-[#3f3f46cc] dark:text-white 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) => {
467
+ return /* @__PURE__ */ React11.createElement("div", { key: index, className: "" }, /* @__PURE__ */ React11.createElement("div", { className: "flex items-center gap-3 p-2 hover:bg-[#f3f4f6] dark:hover:bg-[#27272a] dark:text-white cursor-pointer rounded-lg ml-2", onClick: (e) => {
455
468
  item.onClick && item.onClick(e);
456
469
  handleIconRotate(e, index);
457
- } }, /* @__PURE__ */ React11.createElement(item.Icon, { width: 20, height: 20, color: "#18181b" }), /* @__PURE__ */ React11.createElement("span", { className: "font-medium text-[#3f3f46cc]" }, 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-[40px] max-h-0 overflow-hidden flex flex-col", id: `dropDownOptions-${index}` }, item.options.map((options) => {
458
- return /* @__PURE__ */ React11.createElement(
470
+ } }, /* @__PURE__ */ React11.createElement(item.Icon, { width: 20, height: 20 }), /* @__PURE__ */ React11.createElement("span", { className: "font-medium text-[#3f3f46cc] dark:text-white" }, 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) => {
471
+ return /* @__PURE__ */ React11.createElement("div", { className: "" }, /* @__PURE__ */ React11.createElement(
459
472
  "div",
460
473
  {
461
- className: "p-2 rounded-lg hover:bg-gray-100 text-[#3f3f46cc] font-medium text-sm",
462
- onClick: () => options.onclick && options.onclick()
474
+ className: "flex items-center gap-3 p-2 hover:bg-[#f3f4f6] cursor-pointer",
475
+ onClick: (e) => {
476
+ options.onclick && options.onclick();
477
+ options.isDropDown && handleIconRotate(e, optionsIndex, "subOption");
478
+ }
463
479
  },
464
- options.label
465
- );
480
+ /* @__PURE__ */ React11.createElement("div", null),
481
+ /* @__PURE__ */ React11.createElement("span", { className: "font-medium text-sm text-[#3f3f46cc]" }, options.label),
482
+ options.isDropDown && /* @__PURE__ */ React11.createElement("div", { className: `ml-auto transition-all delay-75` }, /* @__PURE__ */ React11.createElement(ChevronDown2, { width: 20, height: 20 }))
483
+ ), 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` }, options.options.map((subOption) => {
484
+ return /* @__PURE__ */ React11.createElement(
485
+ "div",
486
+ {
487
+ className: "p-2 rounded-lg hover:bg-gray-100 text-[#3f3f46cc] font-medium text-sm",
488
+ onClick: (e) => {
489
+ subOption.onclick && options.onclick();
490
+ }
491
+ },
492
+ subOption.label
493
+ );
494
+ })));
466
495
  })));
467
496
  })), /* @__PURE__ */ React11.createElement("div", { className: "border-t border-[#e5e5e5] mt-4" }, (additionalItemsLocal == null ? void 0 : additionalItemsLocal.length) > 0 && additionalItemsLocal.map((item, index) => {
468
- return /* @__PURE__ */ React11.createElement("div", { key: index, className: "flex items-center gap-3 p-2 hover:bg-[#f3f4f6] cursor-pointer", onClick: () => item.onClick && item.onClick() }, /* @__PURE__ */ React11.createElement(item.Icon, { width: 20, height: 20, color: "#18181b" }), /* @__PURE__ */ React11.createElement("span", { className: "font-medium text-[#3f3f46cc]" }, item.label));
469
- })), /* @__PURE__ */ React11.createElement("div", { className: "mt-auto bg-[#fafafa] border-t border-[#e5e5e5] sticky bottom-0 pt-2" }, /* @__PURE__ */ React11.createElement("div", { className: "flex items-center justify-between p-2 rounded-lg hover:bg-[#f4f4f5] cursor-pointer" }, /* @__PURE__ */ React11.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React11.createElement("span", { className: "relative flex shrink-0 overflow-hidden rounded-full h-10 w-10" }, /* @__PURE__ */ React11.createElement("span", { className: "flex h-full w-full items-center justify-center rounded-full bg-muted" }, username && username.split("")[0])), /* @__PURE__ */ React11.createElement("div", null, /* @__PURE__ */ React11.createElement("p", { className: "font-semibold" }, username), /* @__PURE__ */ React11.createElement("p", { className: "text-sm text-[#3f3f46cc]" }, role))), /* @__PURE__ */ React11.createElement(LogOut, { color: "#18181b" }))));
497
+ return /* @__PURE__ */ React11.createElement("div", { key: index, className: "flex items-center gap-3 p-2 hover:bg-[#f3f4f6] dark:hover:bg-[#27272a] dark:text-white cursor-pointer", onClick: () => item.onClick && item.onClick() }, /* @__PURE__ */ React11.createElement(item.Icon, { width: 20, height: 20 }), /* @__PURE__ */ React11.createElement("span", { className: "font-medium text-[#3f3f46cc] dark:text-white" }, item.label));
498
+ }))), /* @__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-[#f4f4f5] dark:hover:bg-[#27272a] cursor-pointer" }, /* @__PURE__ */ React11.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React11.createElement("span", { className: "relative flex shrink-0 overflow-hidden rounded-full h-10 w-10" }, /* @__PURE__ */ React11.createElement("span", { className: "flex h-full w-full items-center justify-center rounded-full bg-muted" }, username && username.split("")[0])), /* @__PURE__ */ React11.createElement("div", null, /* @__PURE__ */ React11.createElement("p", { className: "font-semibold" }, username), /* @__PURE__ */ React11.createElement("p", { className: "text-sm text-[#3f3f46cc] dark:text-[#f4f4f5b3]" }, role))), /* @__PURE__ */ React11.createElement("div", { className: "text-[#18181b] dark:text-white" }, /* @__PURE__ */ React11.createElement(LogOut, null)))));
470
499
  };
471
500
 
472
501
  // src/RightSheet/RightSheet.jsx
package/dist/sidebarLogo-S4TNJORM.webp ADDED
Binary file
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "jett.admin.npmpackage",
3
- "version": "1.0.9",
3
+ "version": "1.0.11",
4
4
  "main": "dist/index.js",
5
5
  "module": "dist/index.mjs",
6
6
  "exports": {