jett.admin.npmpackage 2.0.35 → 2.0.38
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/README.md +23 -2
- package/dist/index.css +402 -267
- package/dist/index.js +909 -529
- package/dist/index.mjs +912 -540
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -421,16 +421,7 @@ var CustomUpload = ({
|
|
|
421
421
|
};
|
|
422
422
|
|
|
423
423
|
// src/sideBar/SideBar.jsx
|
|
424
|
-
import {
|
|
425
|
-
ChevronDown as ChevronDown3,
|
|
426
|
-
ChevronRight,
|
|
427
|
-
CircleSlash,
|
|
428
|
-
Globe,
|
|
429
|
-
LogOut as LogOut3,
|
|
430
|
-
Menu,
|
|
431
|
-
X
|
|
432
|
-
} from "lucide-react";
|
|
433
|
-
import React14, { useEffect as useEffect2, useState as useState4, useCallback, useRef as useRef4 } from "react";
|
|
424
|
+
import React14, { useEffect as useEffect3, useState as useState4, useCallback, useRef as useRef4, useMemo as useMemo2 } from "react";
|
|
434
425
|
|
|
435
426
|
// ConstantUI.js
|
|
436
427
|
import {
|
|
@@ -600,10 +591,16 @@ var navItemsConstant = [
|
|
|
600
591
|
window.location.href = "/market/";
|
|
601
592
|
}
|
|
602
593
|
},
|
|
594
|
+
{
|
|
595
|
+
label: "AuthMesh",
|
|
596
|
+
onClick: () => {
|
|
597
|
+
window.location.href = "/settings/authmesh";
|
|
598
|
+
}
|
|
599
|
+
},
|
|
603
600
|
{
|
|
604
601
|
label: "Audit",
|
|
605
602
|
onClick: () => {
|
|
606
|
-
window.location.href = "/
|
|
603
|
+
window.location.href = "/settings/audit";
|
|
607
604
|
}
|
|
608
605
|
},
|
|
609
606
|
{
|
|
@@ -631,102 +628,6 @@ var additionalItemsConstant = [
|
|
|
631
628
|
}
|
|
632
629
|
];
|
|
633
630
|
|
|
634
|
-
// src/sideBar/SideBar.jsx
|
|
635
|
-
import Cookies from "js-cookie";
|
|
636
|
-
|
|
637
|
-
// src/inputs/CustomSelect.jsx
|
|
638
|
-
import React11, { useState as useState2, useRef as useRef3 } from "react";
|
|
639
|
-
import { ChevronDown as ChevronDown2, Search as Search3 } from "lucide-react";
|
|
640
|
-
var CustomSelect = ({
|
|
641
|
-
id = "custom-select",
|
|
642
|
-
label,
|
|
643
|
-
value,
|
|
644
|
-
onChange,
|
|
645
|
-
options,
|
|
646
|
-
placeholder = "Select...",
|
|
647
|
-
isRequired = false,
|
|
648
|
-
error,
|
|
649
|
-
heading,
|
|
650
|
-
disabled = false
|
|
651
|
-
}) => {
|
|
652
|
-
const [open, setOpen] = useState2(false);
|
|
653
|
-
const [search, setSearch] = useState2("");
|
|
654
|
-
const wrapperRef = useRef3(null);
|
|
655
|
-
const handleBlur = (e) => {
|
|
656
|
-
var _a;
|
|
657
|
-
if (!((_a = wrapperRef.current) == null ? void 0 : _a.contains(e.relatedTarget))) {
|
|
658
|
-
setOpen(false);
|
|
659
|
-
}
|
|
660
|
-
};
|
|
661
|
-
const filteredOptions = options.filter(
|
|
662
|
-
(opt) => opt.label.toLowerCase().includes(search.toLowerCase())
|
|
663
|
-
);
|
|
664
|
-
const handleSelect = (val) => {
|
|
665
|
-
onChange(val);
|
|
666
|
-
setOpen(false);
|
|
667
|
-
};
|
|
668
|
-
const selectedOption = options.find((opt) => opt.value === value);
|
|
669
|
-
return /* @__PURE__ */ React11.createElement(
|
|
670
|
-
"div",
|
|
671
|
-
{
|
|
672
|
-
className: "flex flex-col w-full relative",
|
|
673
|
-
ref: wrapperRef,
|
|
674
|
-
tabIndex: disabled ? -1 : 0,
|
|
675
|
-
onBlur: handleBlur,
|
|
676
|
-
id: `${id}-div-1`
|
|
677
|
-
},
|
|
678
|
-
heading && /* @__PURE__ */ React11.createElement("h3", { className: "text-lg font-semibold mb-1", id: `${id}-h3-1` }, heading),
|
|
679
|
-
label && /* @__PURE__ */ React11.createElement(
|
|
680
|
-
"label",
|
|
681
|
-
{
|
|
682
|
-
className: `font-medium text-sm mb-1 ${heading ? "text-[#737373] dark:text-white" : "text-black dark:text-white"}`,
|
|
683
|
-
id: `${id}-label-1`
|
|
684
|
-
},
|
|
685
|
-
label,
|
|
686
|
-
" ",
|
|
687
|
-
isRequired && /* @__PURE__ */ React11.createElement("span", { className: "text-red-500", id: `${id}-span-1` }, "*")
|
|
688
|
-
),
|
|
689
|
-
/* @__PURE__ */ React11.createElement(
|
|
690
|
-
"div",
|
|
691
|
-
{
|
|
692
|
-
onClick: () => !disabled && setOpen((prev) => !prev),
|
|
693
|
-
className: `flex justify-between items-center rounded-md px-3 py-2 text-sm border h-10 cursor-pointer dark:border-[#303036] dark:bg-[#18181b] dark:text-white
|
|
694
|
-
${disabled ? "bg-gray-100 text-gray-400" : "bg-white dark:bg-[#18181b] dark:text-white"}
|
|
695
|
-
${error ? "border-red-500" : "border-gray-300"}
|
|
696
|
-
`,
|
|
697
|
-
id: `${id}-div-2`
|
|
698
|
-
},
|
|
699
|
-
/* @__PURE__ */ React11.createElement("span", { className: `${selectedOption ? "text-black dark:text-white" : "text-gray-400 dark:text-white"}`, id: `${id}-span-2` }, selectedOption ? selectedOption.label : placeholder),
|
|
700
|
-
/* @__PURE__ */ React11.createElement(
|
|
701
|
-
ChevronDown2,
|
|
702
|
-
{
|
|
703
|
-
className: `w-4 h-4 text-gray-500 transition-transform dark:text-white ${open ? "rotate-180" : ""}`
|
|
704
|
-
}
|
|
705
|
-
)
|
|
706
|
-
),
|
|
707
|
-
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", id: `${id}-div-3` }, /* @__PURE__ */ React11.createElement("div", { className: "flex items-center gap-2 p-2 border-b border-gray-200", id: `${id}-div-4` }, /* @__PURE__ */ React11.createElement(Search3, { size: 16, className: "text-gray-400" }), /* @__PURE__ */ React11.createElement(
|
|
708
|
-
"input",
|
|
709
|
-
{
|
|
710
|
-
type: "text",
|
|
711
|
-
value: search,
|
|
712
|
-
onChange: (e) => setSearch(e.target.value),
|
|
713
|
-
placeholder: "Search...",
|
|
714
|
-
className: "flex-1 text-sm focus:outline-none",
|
|
715
|
-
id: `${id}-input-1`
|
|
716
|
-
}
|
|
717
|
-
)), /* @__PURE__ */ React11.createElement("ul", { id: `${id}-ul-1` }, filteredOptions.length > 0 ? filteredOptions.map((opt) => /* @__PURE__ */ React11.createElement(
|
|
718
|
-
"li",
|
|
719
|
-
{
|
|
720
|
-
key: opt.value,
|
|
721
|
-
onClick: () => handleSelect(opt.value),
|
|
722
|
-
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" : ""}`,
|
|
723
|
-
id: `${id}-li-1`
|
|
724
|
-
},
|
|
725
|
-
opt.label
|
|
726
|
-
)) : /* @__PURE__ */ React11.createElement("li", { className: "px-3 py-2 text-sm text-gray-400 dark:text-white", id: `${id}-li-2` }, "No results found")))
|
|
727
|
-
);
|
|
728
|
-
};
|
|
729
|
-
|
|
730
631
|
// src/utils/cookieHelpers.js
|
|
731
632
|
var JETT_ID_COOKIE_NAME = "jett-id";
|
|
732
633
|
function getCookie(name) {
|
|
@@ -867,12 +768,12 @@ var switchProfile = async (profile) => {
|
|
|
867
768
|
};
|
|
868
769
|
|
|
869
770
|
// src/sideBar/SwitchProfileSection.jsx
|
|
870
|
-
import
|
|
771
|
+
import React12, { useEffect, useLayoutEffect, useState as useState2 } from "react";
|
|
871
772
|
import { createPortal as createPortal2 } from "react-dom";
|
|
872
|
-
import { LogOut as LogOut2,
|
|
773
|
+
import { LogOut as LogOut2, UserRound } from "lucide-react";
|
|
873
774
|
|
|
874
775
|
// src/sideBar/LogoutConfirmModal.jsx
|
|
875
|
-
import
|
|
776
|
+
import React11 from "react";
|
|
876
777
|
import { createPortal } from "react-dom";
|
|
877
778
|
import { LogOut } from "lucide-react";
|
|
878
779
|
var LogoutConfirmModal = ({
|
|
@@ -887,14 +788,14 @@ var LogoutConfirmModal = ({
|
|
|
887
788
|
if (e.target === e.currentTarget && !loading) onCancel();
|
|
888
789
|
};
|
|
889
790
|
return createPortal(
|
|
890
|
-
/* @__PURE__ */
|
|
791
|
+
/* @__PURE__ */ React11.createElement(
|
|
891
792
|
"div",
|
|
892
793
|
{
|
|
893
794
|
className: "fixed inset-0 z-[10000] flex items-center justify-center bg-black/50",
|
|
894
795
|
onClick: handleOverlayClick,
|
|
895
796
|
id: `${id}-overlay`
|
|
896
797
|
},
|
|
897
|
-
/* @__PURE__ */
|
|
798
|
+
/* @__PURE__ */ React11.createElement("div", { className: "w-[360px] rounded-2xl bg-white dark:bg-[#18181b] p-6 text-center shadow-2xl", id: `${id}-dialog` }, /* @__PURE__ */ React11.createElement("div", { className: "mx-auto mb-4 flex h-16 w-16 items-center justify-center rounded-full bg-blue-50 dark:bg-blue-950/40", id: `${id}-icon` }, /* @__PURE__ */ React11.createElement(LogOut, { className: "text-blue-600", width: 28, height: 28 })), /* @__PURE__ */ React11.createElement("p", { className: "!text-[22px] !font-semibold text-gray-900 dark:text-white" }, "Are you sure you want to logout?"), /* @__PURE__ */ React11.createElement("div", { className: "mt-6 flex gap-3" }, /* @__PURE__ */ React11.createElement(
|
|
898
799
|
"button",
|
|
899
800
|
{
|
|
900
801
|
type: "button",
|
|
@@ -904,7 +805,7 @@ var LogoutConfirmModal = ({
|
|
|
904
805
|
id: `${id}-cancel-button`
|
|
905
806
|
},
|
|
906
807
|
"No, Keep me in"
|
|
907
|
-
), /* @__PURE__ */
|
|
808
|
+
), /* @__PURE__ */ React11.createElement(
|
|
908
809
|
"button",
|
|
909
810
|
{
|
|
910
811
|
type: "button",
|
|
@@ -929,12 +830,14 @@ var SwitchProfileSection = ({
|
|
|
929
830
|
onManageProfile,
|
|
930
831
|
onProfileSwitch,
|
|
931
832
|
onTmcSettings,
|
|
932
|
-
onLogout
|
|
833
|
+
onLogout,
|
|
834
|
+
collapsed = false,
|
|
835
|
+
scopeLabel = ""
|
|
933
836
|
}) => {
|
|
934
|
-
const [position, setPosition] =
|
|
935
|
-
const [showLogoutConfirm, setShowLogoutConfirm] =
|
|
936
|
-
const [switchingProfileId, setSwitchingProfileId] =
|
|
937
|
-
const [switchError, setSwitchError] =
|
|
837
|
+
const [position, setPosition] = useState2(null);
|
|
838
|
+
const [showLogoutConfirm, setShowLogoutConfirm] = useState2(false);
|
|
839
|
+
const [switchingProfileId, setSwitchingProfileId] = useState2(null);
|
|
840
|
+
const [switchError, setSwitchError] = useState2(null);
|
|
938
841
|
const jettIdData = getJettIdCookieData();
|
|
939
842
|
const userName = (jettIdData == null ? void 0 : jettIdData.UserName) || "";
|
|
940
843
|
const userEmail = (jettIdData == null ? void 0 : jettIdData.UserEmail) || "";
|
|
@@ -971,10 +874,10 @@ var SwitchProfileSection = ({
|
|
|
971
874
|
if (!open || !(anchorRef == null ? void 0 : anchorRef.current)) return;
|
|
972
875
|
const updatePosition = () => {
|
|
973
876
|
const rect = anchorRef.current.getBoundingClientRect();
|
|
974
|
-
|
|
975
|
-
|
|
976
|
-
bottom: window.innerHeight - rect.bottom
|
|
977
|
-
|
|
877
|
+
const width = Math.min(296, window.innerWidth - 16);
|
|
878
|
+
setPosition(
|
|
879
|
+
collapsed ? { left: rect.right + 8, bottom: Math.max(8, window.innerHeight - rect.bottom) } : { left: Math.max(8, Math.min(rect.left + 12, window.innerWidth - width - 8)), bottom: window.innerHeight - rect.top - 4 }
|
|
880
|
+
);
|
|
978
881
|
};
|
|
979
882
|
updatePosition();
|
|
980
883
|
window.addEventListener("resize", updatePosition);
|
|
@@ -983,7 +886,7 @@ var SwitchProfileSection = ({
|
|
|
983
886
|
window.removeEventListener("resize", updatePosition);
|
|
984
887
|
window.removeEventListener("scroll", updatePosition, true);
|
|
985
888
|
};
|
|
986
|
-
}, [open, anchorRef]);
|
|
889
|
+
}, [open, anchorRef, collapsed]);
|
|
987
890
|
useEffect(() => {
|
|
988
891
|
if (!open) setSwitchError(null);
|
|
989
892
|
}, [open]);
|
|
@@ -997,66 +900,65 @@ var SwitchProfileSection = ({
|
|
|
997
900
|
setShowLogoutConfirm(false);
|
|
998
901
|
onLogout == null ? void 0 : onLogout();
|
|
999
902
|
};
|
|
1000
|
-
return /* @__PURE__ */
|
|
1001
|
-
/* @__PURE__ */
|
|
903
|
+
return /* @__PURE__ */ React12.createElement(React12.Fragment, null, open && createPortal2(
|
|
904
|
+
/* @__PURE__ */ React12.createElement("div", { className: "font-jett", "data-jett-shell": true }, /* @__PURE__ */ React12.createElement("div", { className: "fixed inset-0 z-[9999]", onClick: onClose, id: `${id}-backdrop`, "aria-hidden": "true" }), /* @__PURE__ */ React12.createElement(
|
|
1002
905
|
"div",
|
|
1003
906
|
{
|
|
1004
|
-
|
|
907
|
+
role: "dialog",
|
|
908
|
+
"aria-label": "Account",
|
|
909
|
+
className: "fixed z-[9999] flex max-h-[75vh] w-[296px] max-w-[calc(100vw-16px)] flex-col overflow-hidden rounded-[10px] border border-jett-line bg-jett-surface text-jett-ink shadow-jett-pop",
|
|
1005
910
|
style: position ? { left: position.left, bottom: position.bottom } : { left: -9999, bottom: 0 },
|
|
1006
911
|
id: `${id}-panel`
|
|
1007
912
|
},
|
|
1008
|
-
/* @__PURE__ */
|
|
913
|
+
/* @__PURE__ */ React12.createElement("div", { className: "flex items-center gap-3 p-4", id: `${id}-header` }, /* @__PURE__ */ React12.createElement("span", { className: "flex h-11 w-11 shrink-0 items-center justify-center rounded-full bg-jett-ink-800 text-[15px] font-semibold text-white", id: `${id}-avatar` }, userName ? userName.split(/\s+/).filter(Boolean).slice(0, 2).map((p) => p[0]).join("").toUpperCase() : "A"), /* @__PURE__ */ React12.createElement("div", { className: "min-w-0 flex-1", id: `${id}-header-text` }, /* @__PURE__ */ React12.createElement("div", { className: "truncate text-[14px] font-medium text-jett-ink-800" }, userName || "Admin"), userEmail && /* @__PURE__ */ React12.createElement("div", { className: "truncate text-[13px] text-jett-ink-500" }, userEmail), scopeLabel && /* @__PURE__ */ React12.createElement("span", { className: "mt-1.5 inline-flex rounded-full border border-jett-line bg-jett-fill px-[7px] py-px text-[11px] font-semibold text-jett-ink-600" }, scopeLabel))),
|
|
914
|
+
/* @__PURE__ */ React12.createElement("div", { className: "flex flex-col gap-0.5 px-2 pb-2" }, /* @__PURE__ */ React12.createElement(
|
|
1009
915
|
"button",
|
|
1010
916
|
{
|
|
1011
917
|
type: "button",
|
|
1012
918
|
onClick: onManageProfile,
|
|
1013
|
-
className: "
|
|
919
|
+
className: "flex w-full cursor-pointer items-center gap-2.5 rounded-[6px] border-0 bg-transparent p-2 text-left text-[14px] text-jett-ink-700 hover:bg-jett-canvas hover:text-jett-ink",
|
|
1014
920
|
id: `${id}-manage-profile-button`
|
|
1015
921
|
},
|
|
1016
|
-
"
|
|
922
|
+
/* @__PURE__ */ React12.createElement(UserRound, { width: 16, height: 16, strokeWidth: 1.8, className: "text-jett-ink-400", "aria-hidden": "true" }),
|
|
923
|
+
"Manage profile"
|
|
1017
924
|
)),
|
|
1018
|
-
/* @__PURE__ */
|
|
1019
|
-
/* @__PURE__ */ React13.createElement("div", { className: "overflow-y-auto scrollbar-hide", id: `${id}-body` }, /* @__PURE__ */ React13.createElement("p", { className: "pb-4 text-[10px] font-bold tracking-wider text-[#737373] uppercase", id: `${id}-markets-label` }, "Your Markets"), switchError && /* @__PURE__ */ React13.createElement(
|
|
1020
|
-
"div",
|
|
1021
|
-
{
|
|
1022
|
-
className: "mb-3 rounded-lg border border-red-200 dark:border-red-900 bg-red-50 dark:bg-red-950/40 px-3 py-2 text-[12px] font-medium text-red-600",
|
|
1023
|
-
id: `${id}-switch-error`
|
|
1024
|
-
},
|
|
1025
|
-
switchError
|
|
1026
|
-
), /* @__PURE__ */ React13.createElement("div", { className: "flex flex-col gap-2 pb-4", id: `${id}-markets-list` }, markets.length === 0 && /* @__PURE__ */ React13.createElement("p", { className: "px-2 py-2 text-[13px] text-gray-400", id: `${id}-markets-empty` }, "No markets available"), markets.map((profile) => {
|
|
925
|
+
/* @__PURE__ */ React12.createElement("div", { className: "min-h-0 overflow-y-auto border-t border-jett-line-row px-4 py-3 scrollbar-hide", id: `${id}-body` }, /* @__PURE__ */ React12.createElement("div", { className: "text-[11px] font-semibold uppercase tracking-[0.06em] text-jett-ink-400", id: `${id}-markets-label` }, "Your markets"), switchError && /* @__PURE__ */ React12.createElement("div", { role: "alert", className: "mt-2 rounded-[6px] border border-[#fca5a5] bg-jett-danger-soft px-3 py-2 text-[12px] font-medium text-jett-danger", id: `${id}-switch-error` }, switchError), /* @__PURE__ */ React12.createElement("div", { className: "mt-2 flex flex-col gap-1", role: "list", id: `${id}-markets-list` }, markets.length === 0 && /* @__PURE__ */ React12.createElement("p", { className: "!m-0 py-1 text-[13px] text-jett-ink-500", id: `${id}-markets-empty` }, "No markets available"), markets.map((profile) => {
|
|
1027
926
|
const isCurrent = profile.ProfileId === currentProfileId;
|
|
1028
927
|
const isSwitching = switchingProfileId === profile.ProfileId;
|
|
1029
|
-
return /* @__PURE__ */
|
|
1030
|
-
"
|
|
928
|
+
return /* @__PURE__ */ React12.createElement(
|
|
929
|
+
"button",
|
|
1031
930
|
{
|
|
1032
931
|
key: profile.ProfileId,
|
|
932
|
+
type: "button",
|
|
933
|
+
role: "listitem",
|
|
1033
934
|
onClick: () => !isCurrent && handleProfileSwitch(profile),
|
|
1034
|
-
|
|
1035
|
-
|
|
935
|
+
disabled: isSwitching || !!switchingProfileId,
|
|
936
|
+
"aria-current": isCurrent || void 0,
|
|
937
|
+
className: `flex w-full items-center justify-between gap-2 rounded-[6px] border px-2.5 py-2 text-left transition-colors ${isCurrent ? "cursor-default border-jett-line bg-jett-fill" : "cursor-pointer border-transparent bg-transparent hover:bg-jett-canvas"} ${isSwitching ? "opacity-60" : ""}`,
|
|
1036
938
|
id: `${id}-market-${profile.ProfileId}`
|
|
1037
939
|
},
|
|
1038
|
-
/* @__PURE__ */
|
|
1039
|
-
isCurrent && /* @__PURE__ */
|
|
1040
|
-
isSwitching && /* @__PURE__ */
|
|
940
|
+
/* @__PURE__ */ React12.createElement("span", { className: `truncate text-[13px] text-jett-ink ${isCurrent ? "font-semibold" : "font-medium"}` }, profile.EntityName),
|
|
941
|
+
isCurrent && /* @__PURE__ */ React12.createElement("span", { className: "shrink-0 rounded-full bg-jett-brand-soft px-2 py-px text-[11px] font-semibold text-jett-brand-hover" }, "Signed in"),
|
|
942
|
+
isSwitching && /* @__PURE__ */ React12.createElement("span", { className: "shrink-0 text-[11px] text-jett-ink-400" }, "Switching\u2026")
|
|
1041
943
|
);
|
|
1042
944
|
}))),
|
|
1043
|
-
/* @__PURE__ */
|
|
1044
|
-
|
|
1045
|
-
"div",
|
|
945
|
+
/* @__PURE__ */ React12.createElement("div", { className: "border-t border-jett-line-row p-2", id: `${id}-footer` }, /* @__PURE__ */ React12.createElement(
|
|
946
|
+
"button",
|
|
1046
947
|
{
|
|
948
|
+
type: "button",
|
|
1047
949
|
onClick: () => {
|
|
1048
950
|
onClose == null ? void 0 : onClose();
|
|
1049
951
|
setShowLogoutConfirm(true);
|
|
1050
952
|
},
|
|
1051
|
-
className: "flex items-center gap-
|
|
953
|
+
className: "flex w-full cursor-pointer items-center gap-2.5 rounded-[6px] border-0 bg-transparent p-2 text-left text-[14px] font-semibold text-jett-danger hover:bg-jett-danger-soft",
|
|
1052
954
|
id: `${id}-logout`
|
|
1053
955
|
},
|
|
1054
|
-
/* @__PURE__ */
|
|
1055
|
-
|
|
956
|
+
/* @__PURE__ */ React12.createElement(LogOut2, { width: 16, height: 16, strokeWidth: 1.8, "aria-hidden": "true" }),
|
|
957
|
+
"Log out"
|
|
1056
958
|
))
|
|
1057
959
|
)),
|
|
1058
960
|
document.body
|
|
1059
|
-
), /* @__PURE__ */
|
|
961
|
+
), /* @__PURE__ */ React12.createElement(
|
|
1060
962
|
LogoutConfirmModal,
|
|
1061
963
|
{
|
|
1062
964
|
id: `${id}-logout-confirm`,
|
|
@@ -1067,11 +969,339 @@ var SwitchProfileSection = ({
|
|
|
1067
969
|
));
|
|
1068
970
|
};
|
|
1069
971
|
|
|
972
|
+
// src/sideBar/CommandPalette.jsx
|
|
973
|
+
import React13, { useEffect as useEffect2, useMemo, useRef as useRef3, useState as useState3 } from "react";
|
|
974
|
+
import { createPortal as createPortal3 } from "react-dom";
|
|
975
|
+
var Kbd = ({ children, raised }) => /* @__PURE__ */ React13.createElement(
|
|
976
|
+
"span",
|
|
977
|
+
{
|
|
978
|
+
className: `inline-block min-w-[20px] rounded-[4px] border border-jett-line-soft bg-jett-surface px-[5px] text-center text-[11px] leading-[18px] font-medium text-jett-ink-500 ${raised ? "border-b-2 !text-[12px] text-jett-ink-700" : ""}`
|
|
979
|
+
},
|
|
980
|
+
children
|
|
981
|
+
);
|
|
982
|
+
var CommandPalette = ({ id = "command-palette", open, onClose, commands }) => {
|
|
983
|
+
const [q, setQ] = useState3("");
|
|
984
|
+
const [idx, setIdx] = useState3(0);
|
|
985
|
+
const inputRef = useRef3(null);
|
|
986
|
+
const listRef = useRef3(null);
|
|
987
|
+
useEffect2(() => {
|
|
988
|
+
if (!open) return;
|
|
989
|
+
setQ("");
|
|
990
|
+
setIdx(0);
|
|
991
|
+
const opener = document.activeElement;
|
|
992
|
+
const t = setTimeout(() => {
|
|
993
|
+
var _a;
|
|
994
|
+
return (_a = inputRef.current) == null ? void 0 : _a.focus();
|
|
995
|
+
}, 0);
|
|
996
|
+
return () => {
|
|
997
|
+
clearTimeout(t);
|
|
998
|
+
if (opener && opener.focus && document.contains(opener)) opener.focus({ preventScroll: true });
|
|
999
|
+
};
|
|
1000
|
+
}, [open]);
|
|
1001
|
+
const list = useMemo(() => {
|
|
1002
|
+
const s = q.trim().toLowerCase();
|
|
1003
|
+
return s ? commands.filter((c) => (c.label + " " + (c.sub || "")).toLowerCase().includes(s)) : commands;
|
|
1004
|
+
}, [q, commands]);
|
|
1005
|
+
const cur = Math.min(idx, Math.max(0, list.length - 1));
|
|
1006
|
+
useEffect2(() => {
|
|
1007
|
+
var _a, _b;
|
|
1008
|
+
(_b = (_a = listRef.current) == null ? void 0 : _a.querySelector(`[data-idx="${cur}"]`)) == null ? void 0 : _b.scrollIntoView({ block: "nearest" });
|
|
1009
|
+
}, [cur]);
|
|
1010
|
+
if (!open || typeof document === "undefined") return null;
|
|
1011
|
+
const run = (c) => {
|
|
1012
|
+
var _a;
|
|
1013
|
+
onClose();
|
|
1014
|
+
(_a = c == null ? void 0 : c.run) == null ? void 0 : _a.call(c);
|
|
1015
|
+
};
|
|
1016
|
+
const onKey = (e) => {
|
|
1017
|
+
if (e.key === "ArrowDown") {
|
|
1018
|
+
e.preventDefault();
|
|
1019
|
+
setIdx((cur + 1) % Math.max(1, list.length));
|
|
1020
|
+
} else if (e.key === "ArrowUp") {
|
|
1021
|
+
e.preventDefault();
|
|
1022
|
+
setIdx((cur - 1 + list.length) % Math.max(1, list.length));
|
|
1023
|
+
} else if (e.key === "Enter") {
|
|
1024
|
+
e.preventDefault();
|
|
1025
|
+
run(list[cur]);
|
|
1026
|
+
} else if (e.key === "Tab") {
|
|
1027
|
+
e.preventDefault();
|
|
1028
|
+
}
|
|
1029
|
+
};
|
|
1030
|
+
return createPortal3(
|
|
1031
|
+
/* @__PURE__ */ React13.createElement("div", { className: "font-jett", id }, /* @__PURE__ */ React13.createElement("div", { className: "fixed inset-0 z-[95] bg-[rgba(17,24,39,0.4)]", onClick: onClose, "aria-hidden": "true" }), /* @__PURE__ */ React13.createElement(
|
|
1032
|
+
"div",
|
|
1033
|
+
{
|
|
1034
|
+
role: "dialog",
|
|
1035
|
+
"aria-modal": "true",
|
|
1036
|
+
"aria-label": "Command palette",
|
|
1037
|
+
className: "fixed left-1/2 top-[12vh] z-[96] flex w-[calc(100%-32px)] max-w-[560px] -translate-x-1/2 flex-col overflow-hidden rounded-[12px] border border-jett-line bg-jett-surface shadow-jett-pop"
|
|
1038
|
+
},
|
|
1039
|
+
/* @__PURE__ */ React13.createElement("div", { className: "flex h-[52px] items-center gap-2.5 border-b border-jett-line-row px-4" }, /* @__PURE__ */ React13.createElement("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "#9ca3af", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true" }, /* @__PURE__ */ React13.createElement("circle", { cx: "11", cy: "11", r: "7" }), /* @__PURE__ */ React13.createElement("path", { d: "m20 20-3.5-3.5" })), /* @__PURE__ */ React13.createElement(
|
|
1040
|
+
"input",
|
|
1041
|
+
{
|
|
1042
|
+
ref: inputRef,
|
|
1043
|
+
type: "text",
|
|
1044
|
+
role: "combobox",
|
|
1045
|
+
"aria-expanded": "true",
|
|
1046
|
+
"aria-controls": `${id}-list`,
|
|
1047
|
+
"aria-activedescendant": list[cur] ? `${id}-opt-${cur}` : void 0,
|
|
1048
|
+
value: q,
|
|
1049
|
+
onChange: (e) => {
|
|
1050
|
+
setQ(e.target.value);
|
|
1051
|
+
setIdx(0);
|
|
1052
|
+
},
|
|
1053
|
+
onKeyDown: onKey,
|
|
1054
|
+
placeholder: "Search screens and actions",
|
|
1055
|
+
className: "h-full flex-1 border-0 bg-transparent p-0 text-[15px] text-jett-ink outline-none placeholder:text-jett-ink-400"
|
|
1056
|
+
}
|
|
1057
|
+
), /* @__PURE__ */ React13.createElement(Kbd, null, "Esc")),
|
|
1058
|
+
/* @__PURE__ */ React13.createElement("div", { ref: listRef, id: `${id}-list`, role: "listbox", className: "flex max-h-[360px] flex-col gap-0.5 overflow-y-auto p-1.5" }, list.map((c, i) => /* @__PURE__ */ React13.createElement(
|
|
1059
|
+
"button",
|
|
1060
|
+
{
|
|
1061
|
+
key: c.label + (c.sub || ""),
|
|
1062
|
+
id: `${id}-opt-${i}`,
|
|
1063
|
+
"data-idx": i,
|
|
1064
|
+
role: "option",
|
|
1065
|
+
"aria-selected": i === cur,
|
|
1066
|
+
type: "button",
|
|
1067
|
+
tabIndex: -1,
|
|
1068
|
+
onClick: () => run(c),
|
|
1069
|
+
onMouseEnter: () => setIdx(i),
|
|
1070
|
+
className: `flex cursor-pointer items-center gap-3 rounded-[6px] border-0 px-2.5 py-[9px] text-left ${i === cur ? "bg-jett-fill" : "bg-transparent"}`
|
|
1071
|
+
},
|
|
1072
|
+
/* @__PURE__ */ React13.createElement("span", { className: "min-w-0 flex-1 truncate text-[14px] font-medium text-jett-ink" }, c.label),
|
|
1073
|
+
/* @__PURE__ */ React13.createElement("span", { className: "text-[12px] text-jett-ink-500" }, c.sub),
|
|
1074
|
+
/* @__PURE__ */ React13.createElement("span", { className: "flex min-w-[44px] justify-end gap-[3px]" }, (c.keys || []).map((k) => /* @__PURE__ */ React13.createElement(Kbd, { key: k }, k)))
|
|
1075
|
+
)), !list.length && /* @__PURE__ */ React13.createElement("div", { className: "px-2.5 py-6 text-center text-[14px] text-jett-ink-500" }, "No matches")),
|
|
1076
|
+
/* @__PURE__ */ React13.createElement("div", { className: "flex gap-4 border-t border-jett-line-row px-4 py-2.5 text-[12px] text-jett-ink-500" }, /* @__PURE__ */ React13.createElement("span", null, "\u2191 \u2193 to move"), /* @__PURE__ */ React13.createElement("span", null, "\u21B5 to open"), /* @__PURE__ */ React13.createElement("span", null, "? for all shortcuts"))
|
|
1077
|
+
)),
|
|
1078
|
+
document.body
|
|
1079
|
+
);
|
|
1080
|
+
};
|
|
1081
|
+
var ShortcutsSheet = ({ id = "shortcuts-sheet", open, onClose, sections }) => {
|
|
1082
|
+
const closeRef = useRef3(null);
|
|
1083
|
+
useEffect2(() => {
|
|
1084
|
+
if (!open) return;
|
|
1085
|
+
const opener = document.activeElement;
|
|
1086
|
+
const t = setTimeout(() => {
|
|
1087
|
+
var _a;
|
|
1088
|
+
return (_a = closeRef.current) == null ? void 0 : _a.focus();
|
|
1089
|
+
}, 0);
|
|
1090
|
+
return () => {
|
|
1091
|
+
clearTimeout(t);
|
|
1092
|
+
if (opener && opener.focus && document.contains(opener)) opener.focus({ preventScroll: true });
|
|
1093
|
+
};
|
|
1094
|
+
}, [open]);
|
|
1095
|
+
if (!open || typeof document === "undefined") return null;
|
|
1096
|
+
return createPortal3(
|
|
1097
|
+
/* @__PURE__ */ React13.createElement("div", { className: "font-jett", id }, /* @__PURE__ */ React13.createElement("div", { className: "fixed inset-0 z-[95] bg-[rgba(17,24,39,0.4)]", onClick: onClose, "aria-hidden": "true" }), /* @__PURE__ */ React13.createElement(
|
|
1098
|
+
"div",
|
|
1099
|
+
{
|
|
1100
|
+
role: "dialog",
|
|
1101
|
+
"aria-modal": "true",
|
|
1102
|
+
"aria-label": "Keyboard shortcuts",
|
|
1103
|
+
className: "fixed left-1/2 top-1/2 z-[96] max-h-[calc(100vh-64px)] w-[calc(100%-32px)] max-w-[640px] -translate-x-1/2 -translate-y-1/2 overflow-y-auto rounded-[12px] border border-jett-line bg-jett-surface shadow-jett-pop"
|
|
1104
|
+
},
|
|
1105
|
+
/* @__PURE__ */ React13.createElement("div", { className: "flex items-center justify-between border-b border-jett-line-row px-5 py-4" }, /* @__PURE__ */ React13.createElement("h2", { className: "!m-0 !text-[16px] !font-semibold text-jett-ink" }, "Keyboard shortcuts"), /* @__PURE__ */ React13.createElement(
|
|
1106
|
+
"button",
|
|
1107
|
+
{
|
|
1108
|
+
ref: closeRef,
|
|
1109
|
+
type: "button",
|
|
1110
|
+
onClick: onClose,
|
|
1111
|
+
title: "Close",
|
|
1112
|
+
"aria-label": "Close",
|
|
1113
|
+
className: "flex h-8 w-8 cursor-pointer items-center justify-center rounded-[6px] border-0 bg-transparent text-jett-ink-500 hover:bg-jett-fill"
|
|
1114
|
+
},
|
|
1115
|
+
/* @__PURE__ */ React13.createElement("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true" }, /* @__PURE__ */ React13.createElement("path", { d: "M18 6 6 18M6 6l12 12" }))
|
|
1116
|
+
)),
|
|
1117
|
+
/* @__PURE__ */ React13.createElement("div", { className: "grid grid-cols-[repeat(auto-fit,minmax(260px,1fr))] gap-x-8 gap-y-2 px-5 pb-5 pt-2" }, sections.map((sec) => /* @__PURE__ */ React13.createElement("div", { key: sec.title, className: "flex flex-col" }, /* @__PURE__ */ React13.createElement("div", { className: "pb-1.5 pt-3 text-[11px] font-semibold uppercase tracking-[0.06em] text-jett-ink-400" }, sec.title), sec.rows.map((r) => /* @__PURE__ */ React13.createElement("div", { key: r.label, className: "flex items-center justify-between gap-3 border-b border-jett-line-row py-[7px]" }, /* @__PURE__ */ React13.createElement("span", { className: "text-[14px] text-jett-ink-700" }, r.label), /* @__PURE__ */ React13.createElement("span", { className: "flex items-center gap-1" }, r.keys.map((k) => /* @__PURE__ */ React13.createElement(Kbd, { key: k, raised: true }, k))))))))
|
|
1118
|
+
)),
|
|
1119
|
+
document.body
|
|
1120
|
+
);
|
|
1121
|
+
};
|
|
1122
|
+
|
|
1123
|
+
// src/sideBar/navMatch.js
|
|
1124
|
+
var extractUrlFromOnClick = (onClick) => {
|
|
1125
|
+
if (!onClick || typeof onClick !== "function") return null;
|
|
1126
|
+
const funcString = onClick.toString();
|
|
1127
|
+
let match = funcString.match(/window\.location\.href\s*=\s*`([^`]+)`/);
|
|
1128
|
+
if (!match) {
|
|
1129
|
+
match = funcString.match(/window\.location\.href\s*=\s*["']([^"']+)["']/);
|
|
1130
|
+
}
|
|
1131
|
+
if (match && match[1]) {
|
|
1132
|
+
try {
|
|
1133
|
+
if (match[1].startsWith("http://") || match[1].startsWith("https://")) {
|
|
1134
|
+
const url = new URL(match[1]);
|
|
1135
|
+
return {
|
|
1136
|
+
pathname: url.pathname,
|
|
1137
|
+
search: url.search,
|
|
1138
|
+
fullPath: url.pathname + url.search
|
|
1139
|
+
};
|
|
1140
|
+
}
|
|
1141
|
+
if (match[1].startsWith("/")) {
|
|
1142
|
+
const url = new URL(match[1], window.location.origin);
|
|
1143
|
+
return {
|
|
1144
|
+
pathname: url.pathname,
|
|
1145
|
+
search: url.search,
|
|
1146
|
+
fullPath: url.pathname + url.search
|
|
1147
|
+
};
|
|
1148
|
+
}
|
|
1149
|
+
return null;
|
|
1150
|
+
} catch {
|
|
1151
|
+
const pathMatch = match[1].match(/^([^?]+)(\?.*)?$/);
|
|
1152
|
+
if (pathMatch) {
|
|
1153
|
+
return {
|
|
1154
|
+
pathname: pathMatch[1],
|
|
1155
|
+
search: pathMatch[2] || "",
|
|
1156
|
+
fullPath: match[1]
|
|
1157
|
+
};
|
|
1158
|
+
}
|
|
1159
|
+
return null;
|
|
1160
|
+
}
|
|
1161
|
+
}
|
|
1162
|
+
return null;
|
|
1163
|
+
};
|
|
1164
|
+
var currentUrlMatches = (menuUrlData, currentPath, currentSearch) => {
|
|
1165
|
+
if (!menuUrlData || !currentPath) return false;
|
|
1166
|
+
const normalizedMenuPath = menuUrlData.pathname.replace(/\/$/, "") || "/";
|
|
1167
|
+
const normalizedCurrentPath = currentPath.replace(/\/$/, "") || "/";
|
|
1168
|
+
if (normalizedMenuPath === "/users/users" && normalizedCurrentPath === "/users/users") {
|
|
1169
|
+
const menuParams = new URLSearchParams(menuUrlData.search);
|
|
1170
|
+
const currentParams = new URLSearchParams(currentSearch);
|
|
1171
|
+
const menuRole = menuParams.get("role");
|
|
1172
|
+
const currentRole = currentParams.get("role");
|
|
1173
|
+
if (menuRole && currentRole) {
|
|
1174
|
+
return menuRole === currentRole;
|
|
1175
|
+
}
|
|
1176
|
+
if (menuRole && !currentRole || !menuRole && currentRole) {
|
|
1177
|
+
return false;
|
|
1178
|
+
}
|
|
1179
|
+
return true;
|
|
1180
|
+
}
|
|
1181
|
+
if (normalizedMenuPath === "/corporate" && normalizedCurrentPath.startsWith("/org/organizations")) {
|
|
1182
|
+
return true;
|
|
1183
|
+
}
|
|
1184
|
+
if (normalizedMenuPath === "/supplier" && normalizedCurrentPath === "/orgselector") {
|
|
1185
|
+
const currentPathParam = new URLSearchParams(currentSearch).get("path");
|
|
1186
|
+
if (currentPathParam === "supplier-list") {
|
|
1187
|
+
return true;
|
|
1188
|
+
}
|
|
1189
|
+
}
|
|
1190
|
+
if (normalizedMenuPath === "/supplierdeals" && normalizedCurrentPath === "/orgselector") {
|
|
1191
|
+
const currentPathParam = new URLSearchParams(currentSearch).get("path");
|
|
1192
|
+
if (currentPathParam === "supplier-deals") {
|
|
1193
|
+
return true;
|
|
1194
|
+
}
|
|
1195
|
+
}
|
|
1196
|
+
if (normalizedMenuPath === "/corporate/trips") {
|
|
1197
|
+
if (normalizedCurrentPath.startsWith("/tripdetails") || normalizedCurrentPath.startsWith("/offline")) {
|
|
1198
|
+
return true;
|
|
1199
|
+
}
|
|
1200
|
+
}
|
|
1201
|
+
if (normalizedMenuPath === "/orgselector" && menuUrlData.search) {
|
|
1202
|
+
const menuPathParam = new URLSearchParams(menuUrlData.search).get("path");
|
|
1203
|
+
if (menuPathParam) {
|
|
1204
|
+
const pathRouteMap = {
|
|
1205
|
+
"offer": "/offer/offer",
|
|
1206
|
+
"voucher": "/voucher/voucher",
|
|
1207
|
+
"tag": "/tags/tags",
|
|
1208
|
+
"special-requests": "/corporate/special-requests",
|
|
1209
|
+
"pricing-policy": "/policies/pricing-policy",
|
|
1210
|
+
"supplier-list": "/supplier",
|
|
1211
|
+
"users": "/users/users"
|
|
1212
|
+
// Consumer Ecosystem Users (no role param)
|
|
1213
|
+
};
|
|
1214
|
+
const expectedRoute = pathRouteMap[menuPathParam];
|
|
1215
|
+
if (expectedRoute) {
|
|
1216
|
+
if (normalizedCurrentPath === expectedRoute || normalizedCurrentPath.startsWith(expectedRoute + "/")) {
|
|
1217
|
+
if (menuPathParam === "users") {
|
|
1218
|
+
const currentParams = new URLSearchParams(currentSearch);
|
|
1219
|
+
const currentRole = currentParams.get("role");
|
|
1220
|
+
return currentRole !== "admin";
|
|
1221
|
+
}
|
|
1222
|
+
return true;
|
|
1223
|
+
}
|
|
1224
|
+
}
|
|
1225
|
+
}
|
|
1226
|
+
if (normalizedCurrentPath === "/orgselector") {
|
|
1227
|
+
const menuPathParam2 = new URLSearchParams(menuUrlData.search).get("path");
|
|
1228
|
+
const currentPathParam = new URLSearchParams(currentSearch).get("path");
|
|
1229
|
+
if (menuPathParam2 && currentPathParam) {
|
|
1230
|
+
return menuPathParam2 === currentPathParam;
|
|
1231
|
+
}
|
|
1232
|
+
}
|
|
1233
|
+
}
|
|
1234
|
+
if (normalizedMenuPath === normalizedCurrentPath) {
|
|
1235
|
+
if (menuUrlData.search) {
|
|
1236
|
+
const menuParams = new URLSearchParams(menuUrlData.search);
|
|
1237
|
+
const currentParams = new URLSearchParams(currentSearch);
|
|
1238
|
+
for (const [key, value] of menuParams.entries()) {
|
|
1239
|
+
if (key === "auth") {
|
|
1240
|
+
continue;
|
|
1241
|
+
}
|
|
1242
|
+
if (currentParams.get(key) !== value) {
|
|
1243
|
+
return false;
|
|
1244
|
+
}
|
|
1245
|
+
}
|
|
1246
|
+
return true;
|
|
1247
|
+
}
|
|
1248
|
+
return true;
|
|
1249
|
+
}
|
|
1250
|
+
if (normalizedCurrentPath.startsWith(normalizedMenuPath + "/")) {
|
|
1251
|
+
return true;
|
|
1252
|
+
}
|
|
1253
|
+
return false;
|
|
1254
|
+
};
|
|
1255
|
+
|
|
1070
1256
|
// src/sideBar/SideBar.jsx
|
|
1071
1257
|
var SCOPE_LABELS = {
|
|
1072
1258
|
TMC: "TMC Manager",
|
|
1073
1259
|
TMC_ENTITY: "TMC Entity Manager"
|
|
1074
1260
|
};
|
|
1261
|
+
var LS_COLLAPSED = "jett.sidebar.collapsed";
|
|
1262
|
+
var PHONE_MAX = 768;
|
|
1263
|
+
var AUTO_EXPAND = 1280;
|
|
1264
|
+
var GOTO = [
|
|
1265
|
+
["h", "Home"],
|
|
1266
|
+
["c", "Corporate"],
|
|
1267
|
+
["t", "Trips"],
|
|
1268
|
+
["r", "Special Request"],
|
|
1269
|
+
["b", "Booking & Invoices"],
|
|
1270
|
+
["e", "Pricing Engine"],
|
|
1271
|
+
["l", "Credit Management"],
|
|
1272
|
+
["s", "Suppliers List"],
|
|
1273
|
+
["d", "Supplier Deals"],
|
|
1274
|
+
["w", "Whitelabel"],
|
|
1275
|
+
["m", "Markets"],
|
|
1276
|
+
["p", "Users", "Settings"],
|
|
1277
|
+
["i", "AuthMesh"],
|
|
1278
|
+
["a", "Audit"]
|
|
1279
|
+
];
|
|
1280
|
+
var norm = (s) => String(s || "").trim().toLowerCase();
|
|
1281
|
+
var SOON_RX = /\s*\((coming )?soon\)\s*$/i;
|
|
1282
|
+
var cleanLabel = (s) => String(s || "").replace(SOON_RX, "");
|
|
1283
|
+
var isSoon = (o) => !!o.isDisabled || SOON_RX.test(o.label || "");
|
|
1284
|
+
var MAC = typeof navigator !== "undefined" && /Mac|iPhone|iPad/.test(navigator.platform || navigator.userAgent || "");
|
|
1285
|
+
var MOD = MAC ? "\u2318" : "Ctrl";
|
|
1286
|
+
var readPref = () => {
|
|
1287
|
+
try {
|
|
1288
|
+
const v = localStorage.getItem(LS_COLLAPSED);
|
|
1289
|
+
return v === null ? null : v === "1";
|
|
1290
|
+
} catch {
|
|
1291
|
+
return null;
|
|
1292
|
+
}
|
|
1293
|
+
};
|
|
1294
|
+
var initials = (name) => String(name || "A").split(/\s+/).filter(Boolean).slice(0, 2).map((p) => p[0]).join("").toUpperCase() || "A";
|
|
1295
|
+
var Chevron = ({ open }) => /* @__PURE__ */ React14.createElement("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "shrink-0 transition-transform duration-150", style: { transform: open ? "rotate(90deg)" : "none" }, "aria-hidden": "true" }, /* @__PURE__ */ React14.createElement("path", { d: "m9 18 6-6-6-6" }));
|
|
1296
|
+
var LogoTile = ({ size = 28 }) => /* @__PURE__ */ React14.createElement(
|
|
1297
|
+
"div",
|
|
1298
|
+
{
|
|
1299
|
+
className: "flex shrink-0 items-center justify-center rounded-[6px] bg-jett-brand font-bold text-white",
|
|
1300
|
+
style: { width: size, height: size, fontSize: size >= 28 ? 13 : 12 },
|
|
1301
|
+
"aria-hidden": "true"
|
|
1302
|
+
},
|
|
1303
|
+
"J"
|
|
1304
|
+
);
|
|
1075
1305
|
var AppSideBar = ({
|
|
1076
1306
|
id = "side-bar",
|
|
1077
1307
|
username,
|
|
@@ -1088,102 +1318,82 @@ var AppSideBar = ({
|
|
|
1088
1318
|
const [authData, setAuthData] = useState4(null);
|
|
1089
1319
|
const [cookieUserName, setCookieUserName] = useState4(null);
|
|
1090
1320
|
const [scope, setScope] = useState4(null);
|
|
1091
|
-
const [selectedCountry, setSelectedCountry] = useState4("dubai");
|
|
1092
1321
|
const [isMobileMenuOpen, setIsMobileMenuOpen] = useState4(false);
|
|
1093
1322
|
const [isSwitchProfileOpen, setIsSwitchProfileOpen] = useState4(false);
|
|
1094
1323
|
const [openMenus, setOpenMenus] = useState4(/* @__PURE__ */ new Set());
|
|
1095
1324
|
const [activeMenuPath, setActiveMenuPath] = useState4(null);
|
|
1096
|
-
const [
|
|
1097
|
-
|
|
1098
|
-
|
|
1099
|
-
|
|
1100
|
-
const
|
|
1101
|
-
|
|
1102
|
-
|
|
1103
|
-
|
|
1104
|
-
|
|
1105
|
-
|
|
1325
|
+
const [width, setWidth] = useState4(() => typeof window === "undefined" ? 1440 : window.innerWidth);
|
|
1326
|
+
const [pref, setPref] = useState4(readPref);
|
|
1327
|
+
const [fly, setFly] = useState4(null);
|
|
1328
|
+
const [palOpen, setPalOpen] = useState4(false);
|
|
1329
|
+
const [helpOpen, setHelpOpen] = useState4(false);
|
|
1330
|
+
const [ready, setReady] = useState4(false);
|
|
1331
|
+
const gPending = useRef4(false);
|
|
1332
|
+
const gTimer = useRef4(null);
|
|
1333
|
+
const phone = width < PHONE_MAX;
|
|
1334
|
+
const collapsed = !phone && (pref === null ? width < AUTO_EXPAND : pref);
|
|
1106
1335
|
const toggleMenu = (menuKey) => {
|
|
1107
1336
|
setOpenMenus((prev) => {
|
|
1108
|
-
const
|
|
1109
|
-
if (
|
|
1110
|
-
|
|
1111
|
-
|
|
1112
|
-
newSet.add(menuKey);
|
|
1113
|
-
}
|
|
1114
|
-
return newSet;
|
|
1337
|
+
const next = new Set(prev);
|
|
1338
|
+
if (next.has(menuKey)) next.delete(menuKey);
|
|
1339
|
+
else next.add(menuKey);
|
|
1340
|
+
return next;
|
|
1115
1341
|
});
|
|
1116
1342
|
};
|
|
1117
|
-
const isMenuOpen = (menuKey) =>
|
|
1118
|
-
|
|
1119
|
-
};
|
|
1343
|
+
const isMenuOpen = (menuKey) => openMenus.has(menuKey);
|
|
1344
|
+
const closeMobileMenu = () => setIsMobileMenuOpen(false);
|
|
1120
1345
|
const handleMenuClick = (item, index, e) => {
|
|
1121
|
-
if (item.isDropDown) {
|
|
1346
|
+
if (item.isDropDown || item.options && item.options.length) {
|
|
1122
1347
|
e.preventDefault();
|
|
1123
|
-
|
|
1124
|
-
toggleMenu(menuKey);
|
|
1125
|
-
setActiveMenuPath(`menu-${index}`);
|
|
1348
|
+
toggleMenu(`menu-${index}`);
|
|
1126
1349
|
} else {
|
|
1127
1350
|
setActiveMenuPath(`menu-${index}`);
|
|
1128
|
-
if (item.onClick)
|
|
1129
|
-
item.onClick(e);
|
|
1130
|
-
}
|
|
1351
|
+
if (item.onClick) item.onClick(e);
|
|
1131
1352
|
closeMobileMenu();
|
|
1132
1353
|
}
|
|
1133
1354
|
};
|
|
1134
|
-
const handleSubMenuClick = (option, optionsIndex,
|
|
1135
|
-
const parentMenuKey = `menu-${
|
|
1136
|
-
setOpenMenus((prev) =>
|
|
1137
|
-
const newSet = new Set(prev);
|
|
1138
|
-
newSet.add(parentMenuKey);
|
|
1139
|
-
return newSet;
|
|
1140
|
-
});
|
|
1355
|
+
const handleSubMenuClick = (option, optionsIndex, parentIndex2, e) => {
|
|
1356
|
+
const parentMenuKey = `menu-${parentIndex2}`;
|
|
1357
|
+
setOpenMenus((prev) => new Set(prev).add(parentMenuKey));
|
|
1141
1358
|
if (option.isDropDown) {
|
|
1142
1359
|
e.preventDefault();
|
|
1143
|
-
|
|
1144
|
-
|
|
1145
|
-
setActiveMenuPath(`menu-${parentIndex}-option-${optionsIndex}`);
|
|
1146
|
-
} else {
|
|
1147
|
-
setActiveMenuPath(`menu-${parentIndex}-option-${optionsIndex}`);
|
|
1148
|
-
if (option.onClick) {
|
|
1149
|
-
option.onClick();
|
|
1150
|
-
}
|
|
1151
|
-
closeMobileMenu();
|
|
1360
|
+
toggleMenu(`menu-${parentIndex2}-option-${optionsIndex}`);
|
|
1361
|
+
return;
|
|
1152
1362
|
}
|
|
1363
|
+
setActiveMenuPath(`menu-${parentIndex2}-option-${optionsIndex}`);
|
|
1364
|
+
setFly(null);
|
|
1365
|
+
if (option.onClick) option.onClick();
|
|
1366
|
+
closeMobileMenu();
|
|
1153
1367
|
};
|
|
1154
|
-
const handleSubSubMenuClick = (subOption,
|
|
1155
|
-
const parentMenuKey = `menu-${parentIndex}`;
|
|
1156
|
-
const subMenuKey = `menu-${parentIndex}-option-${optionsIndex}`;
|
|
1368
|
+
const handleSubSubMenuClick = (subOption, parentIndex2, optionsIndex) => {
|
|
1157
1369
|
setOpenMenus((prev) => {
|
|
1158
|
-
const
|
|
1159
|
-
|
|
1160
|
-
|
|
1161
|
-
return
|
|
1370
|
+
const next = new Set(prev);
|
|
1371
|
+
next.add(`menu-${parentIndex2}`);
|
|
1372
|
+
next.add(`menu-${parentIndex2}-option-${optionsIndex}`);
|
|
1373
|
+
return next;
|
|
1162
1374
|
});
|
|
1163
|
-
setActiveMenuPath(`menu-${
|
|
1164
|
-
|
|
1165
|
-
|
|
1166
|
-
}
|
|
1375
|
+
setActiveMenuPath(`menu-${parentIndex2}-option-${optionsIndex}-sub-${subOption.label}`);
|
|
1376
|
+
setFly(null);
|
|
1377
|
+
if (subOption.onClick) subOption.onClick();
|
|
1167
1378
|
closeMobileMenu();
|
|
1168
1379
|
};
|
|
1169
|
-
|
|
1380
|
+
useEffect3(() => {
|
|
1170
1381
|
const storedAuthData = localStorage.getItem("authData");
|
|
1171
1382
|
if (storedAuthData) {
|
|
1172
|
-
|
|
1173
|
-
|
|
1383
|
+
try {
|
|
1384
|
+
setAuthData(JSON.parse(storedAuthData));
|
|
1385
|
+
} catch {
|
|
1386
|
+
setAuthData(null);
|
|
1387
|
+
}
|
|
1174
1388
|
}
|
|
1175
|
-
}, [
|
|
1176
|
-
|
|
1389
|
+
}, []);
|
|
1390
|
+
useEffect3(() => {
|
|
1177
1391
|
const jettIdData = getJettIdCookieData();
|
|
1178
|
-
if (jettIdData == null ? void 0 : jettIdData.UserName)
|
|
1179
|
-
setCookieUserName(jettIdData.UserName);
|
|
1180
|
-
}
|
|
1392
|
+
if (jettIdData == null ? void 0 : jettIdData.UserName) setCookieUserName(jettIdData.UserName);
|
|
1181
1393
|
const cookieScope = getScopeFromJettIdCookie();
|
|
1182
|
-
if (cookieScope)
|
|
1183
|
-
setScope(cookieScope);
|
|
1184
|
-
}
|
|
1394
|
+
if (cookieScope) setScope(cookieScope);
|
|
1185
1395
|
}, []);
|
|
1186
|
-
|
|
1396
|
+
useEffect3(() => {
|
|
1187
1397
|
if (hasSwitchedProfileThisSession()) return;
|
|
1188
1398
|
const jettIdData = getJettIdCookieData();
|
|
1189
1399
|
const allProfiles = getProfilesFromJettIdCookie(true);
|
|
@@ -1199,145 +1409,11 @@ var AppSideBar = ({
|
|
|
1199
1409
|
console.error("Auto TMC profile switch failed:", error);
|
|
1200
1410
|
});
|
|
1201
1411
|
}, []);
|
|
1202
|
-
const extractUrlFromOnClick = (onClick) => {
|
|
1203
|
-
if (!onClick || typeof onClick !== "function") return null;
|
|
1204
|
-
const funcString = onClick.toString();
|
|
1205
|
-
let match = funcString.match(/window\.location\.href\s*=\s*`([^`]+)`/);
|
|
1206
|
-
if (!match) {
|
|
1207
|
-
match = funcString.match(/window\.location\.href\s*=\s*["']([^"']+)["']/);
|
|
1208
|
-
}
|
|
1209
|
-
if (match && match[1]) {
|
|
1210
|
-
try {
|
|
1211
|
-
if (match[1].startsWith("http://") || match[1].startsWith("https://")) {
|
|
1212
|
-
const url = new URL(match[1]);
|
|
1213
|
-
return {
|
|
1214
|
-
pathname: url.pathname,
|
|
1215
|
-
search: url.search,
|
|
1216
|
-
fullPath: url.pathname + url.search
|
|
1217
|
-
};
|
|
1218
|
-
}
|
|
1219
|
-
if (match[1].startsWith("/")) {
|
|
1220
|
-
const url = new URL(match[1], window.location.origin);
|
|
1221
|
-
return {
|
|
1222
|
-
pathname: url.pathname,
|
|
1223
|
-
search: url.search,
|
|
1224
|
-
fullPath: url.pathname + url.search
|
|
1225
|
-
};
|
|
1226
|
-
}
|
|
1227
|
-
return null;
|
|
1228
|
-
} catch {
|
|
1229
|
-
const pathMatch = match[1].match(/^([^?]+)(\?.*)?$/);
|
|
1230
|
-
if (pathMatch) {
|
|
1231
|
-
return {
|
|
1232
|
-
pathname: pathMatch[1],
|
|
1233
|
-
search: pathMatch[2] || "",
|
|
1234
|
-
fullPath: match[1]
|
|
1235
|
-
};
|
|
1236
|
-
}
|
|
1237
|
-
return null;
|
|
1238
|
-
}
|
|
1239
|
-
}
|
|
1240
|
-
return null;
|
|
1241
|
-
};
|
|
1242
|
-
const currentUrlMatches = (menuUrlData, currentPath, currentSearch) => {
|
|
1243
|
-
if (!menuUrlData || !currentPath) return false;
|
|
1244
|
-
const normalizedMenuPath = menuUrlData.pathname.replace(/\/$/, "") || "/";
|
|
1245
|
-
const normalizedCurrentPath = currentPath.replace(/\/$/, "") || "/";
|
|
1246
|
-
if (normalizedMenuPath === "/users/users" && normalizedCurrentPath === "/users/users") {
|
|
1247
|
-
const menuParams = new URLSearchParams(menuUrlData.search);
|
|
1248
|
-
const currentParams = new URLSearchParams(currentSearch);
|
|
1249
|
-
const menuRole = menuParams.get("role");
|
|
1250
|
-
const currentRole = currentParams.get("role");
|
|
1251
|
-
if (menuRole && currentRole) {
|
|
1252
|
-
return menuRole === currentRole;
|
|
1253
|
-
}
|
|
1254
|
-
if (menuRole && !currentRole || !menuRole && currentRole) {
|
|
1255
|
-
return false;
|
|
1256
|
-
}
|
|
1257
|
-
return true;
|
|
1258
|
-
}
|
|
1259
|
-
if (normalizedMenuPath === "/corporate" && normalizedCurrentPath.startsWith("/org/organizations")) {
|
|
1260
|
-
return true;
|
|
1261
|
-
}
|
|
1262
|
-
if (normalizedMenuPath === "/supplier" && normalizedCurrentPath === "/orgselector") {
|
|
1263
|
-
const currentPathParam = new URLSearchParams(currentSearch).get("path");
|
|
1264
|
-
if (currentPathParam === "supplier-list") {
|
|
1265
|
-
return true;
|
|
1266
|
-
}
|
|
1267
|
-
}
|
|
1268
|
-
if (normalizedMenuPath === "/supplierdeals" && normalizedCurrentPath === "/orgselector") {
|
|
1269
|
-
const currentPathParam = new URLSearchParams(currentSearch).get("path");
|
|
1270
|
-
if (currentPathParam === "supplier-deals") {
|
|
1271
|
-
return true;
|
|
1272
|
-
}
|
|
1273
|
-
}
|
|
1274
|
-
if (normalizedMenuPath === "/corporate/trips") {
|
|
1275
|
-
if (normalizedCurrentPath.startsWith("/tripdetails") || normalizedCurrentPath.startsWith("/offline")) {
|
|
1276
|
-
return true;
|
|
1277
|
-
}
|
|
1278
|
-
}
|
|
1279
|
-
if (normalizedMenuPath === "/orgselector" && menuUrlData.search) {
|
|
1280
|
-
const menuPathParam = new URLSearchParams(menuUrlData.search).get("path");
|
|
1281
|
-
if (menuPathParam) {
|
|
1282
|
-
const pathRouteMap = {
|
|
1283
|
-
"offer": "/offer/offer",
|
|
1284
|
-
"voucher": "/voucher/voucher",
|
|
1285
|
-
"tag": "/tags/tags",
|
|
1286
|
-
"special-requests": "/corporate/special-requests",
|
|
1287
|
-
"pricing-policy": "/policies/pricing-policy",
|
|
1288
|
-
"supplier-list": "/supplier",
|
|
1289
|
-
"users": "/users/users"
|
|
1290
|
-
// Consumer Ecosystem Users (no role param)
|
|
1291
|
-
};
|
|
1292
|
-
const expectedRoute = pathRouteMap[menuPathParam];
|
|
1293
|
-
if (expectedRoute) {
|
|
1294
|
-
if (normalizedCurrentPath === expectedRoute || normalizedCurrentPath.startsWith(expectedRoute + "/")) {
|
|
1295
|
-
if (menuPathParam === "users") {
|
|
1296
|
-
const currentParams = new URLSearchParams(currentSearch);
|
|
1297
|
-
const currentRole = currentParams.get("role");
|
|
1298
|
-
return currentRole !== "admin";
|
|
1299
|
-
}
|
|
1300
|
-
return true;
|
|
1301
|
-
}
|
|
1302
|
-
}
|
|
1303
|
-
}
|
|
1304
|
-
if (normalizedCurrentPath === "/orgselector") {
|
|
1305
|
-
const menuPathParam2 = new URLSearchParams(menuUrlData.search).get("path");
|
|
1306
|
-
const currentPathParam = new URLSearchParams(currentSearch).get("path");
|
|
1307
|
-
if (menuPathParam2 && currentPathParam) {
|
|
1308
|
-
return menuPathParam2 === currentPathParam;
|
|
1309
|
-
}
|
|
1310
|
-
}
|
|
1311
|
-
}
|
|
1312
|
-
if (normalizedMenuPath === normalizedCurrentPath) {
|
|
1313
|
-
if (menuUrlData.search) {
|
|
1314
|
-
const menuParams = new URLSearchParams(menuUrlData.search);
|
|
1315
|
-
const currentParams = new URLSearchParams(currentSearch);
|
|
1316
|
-
for (const [key, value] of menuParams.entries()) {
|
|
1317
|
-
if (key === "auth") {
|
|
1318
|
-
continue;
|
|
1319
|
-
}
|
|
1320
|
-
if (currentParams.get(key) !== value) {
|
|
1321
|
-
return false;
|
|
1322
|
-
}
|
|
1323
|
-
}
|
|
1324
|
-
return true;
|
|
1325
|
-
}
|
|
1326
|
-
return true;
|
|
1327
|
-
}
|
|
1328
|
-
if (normalizedCurrentPath.startsWith(normalizedMenuPath + "/")) {
|
|
1329
|
-
return true;
|
|
1330
|
-
}
|
|
1331
|
-
return false;
|
|
1332
|
-
};
|
|
1333
1412
|
const navItemsLocal = navItems ?? navItemsConstant;
|
|
1334
|
-
|
|
1413
|
+
void (additionalItems ?? additionalItemsConstant);
|
|
1335
1414
|
const logoFromCookie = getLogoFromJettIdCookie();
|
|
1336
1415
|
const logoUrlFromCookie = logoFromCookie ? buildLogoUrl(logoFromCookie.CDNBasePath, logoFromCookie.logoPath) : null;
|
|
1337
|
-
const logoUrlFromUserInfo = ((_a = authData == null ? void 0 : authData.userInfo) == null ? void 0 : _a.CDNBasePath) && ((_b = authData == null ? void 0 : authData.userInfo) == null ? void 0 : _b.OrgLogo) ? buildLogoUrl(
|
|
1338
|
-
authData.userInfo.CDNBasePath,
|
|
1339
|
-
authData.userInfo.OrgLogo
|
|
1340
|
-
) : null;
|
|
1416
|
+
const logoUrlFromUserInfo = ((_a = authData == null ? void 0 : authData.userInfo) == null ? void 0 : _a.CDNBasePath) && ((_b = authData == null ? void 0 : authData.userInfo) == null ? void 0 : _b.OrgLogo) ? buildLogoUrl(authData.userInfo.CDNBasePath, authData.userInfo.OrgLogo) : null;
|
|
1341
1417
|
const sideBarLogoLocal = sideBarLogo ?? logoUrlFromCookie ?? logoUrlFromUserInfo ?? null;
|
|
1342
1418
|
const detectAndSetActiveMenu = useCallback(() => {
|
|
1343
1419
|
const currentPath = window.location.pathname;
|
|
@@ -1356,15 +1432,13 @@ var AppSideBar = ({
|
|
|
1356
1432
|
if (option.onClick && typeof option.onClick === "function") {
|
|
1357
1433
|
const optionUrlData = extractUrlFromOnClick(option.onClick);
|
|
1358
1434
|
if (optionUrlData && currentUrlMatches(optionUrlData, currentPath, currentSearch)) {
|
|
1359
|
-
|
|
1360
|
-
newOpenMenus.add(menuKey);
|
|
1435
|
+
newOpenMenus.add(`menu-${index}`);
|
|
1361
1436
|
foundActivePath = `menu-${index}-option-${optionsIndex}`;
|
|
1362
1437
|
if (option.options && option.options.length > 0) {
|
|
1363
|
-
option.options.forEach((subOption
|
|
1438
|
+
option.options.forEach((subOption) => {
|
|
1364
1439
|
const subOptionUrlData = extractUrlFromOnClick(subOption.onClick);
|
|
1365
1440
|
if (subOptionUrlData && currentUrlMatches(subOptionUrlData, currentPath, currentSearch)) {
|
|
1366
|
-
|
|
1367
|
-
newOpenMenus.add(subMenuKey);
|
|
1441
|
+
newOpenMenus.add(`menu-${index}-option-${optionsIndex}`);
|
|
1368
1442
|
foundActivePath = `menu-${index}-option-${optionsIndex}-sub-${subOption.label}`;
|
|
1369
1443
|
}
|
|
1370
1444
|
});
|
|
@@ -1379,185 +1453,379 @@ var AppSideBar = ({
|
|
|
1379
1453
|
setActiveMenuPath(foundActivePath);
|
|
1380
1454
|
}
|
|
1381
1455
|
}, [navItemsLocal]);
|
|
1382
|
-
|
|
1383
|
-
() => window.location.pathname + window.location.search
|
|
1384
|
-
);
|
|
1385
|
-
useEffect2(() => {
|
|
1456
|
+
useEffect3(() => {
|
|
1386
1457
|
detectAndSetActiveMenu();
|
|
1387
|
-
setCurrentUrl(window.location.pathname + window.location.search);
|
|
1388
|
-
}, [detectAndSetActiveMenu]);
|
|
1389
|
-
useEffect2(() => {
|
|
1390
1458
|
let lastUrl = window.location.pathname + window.location.search;
|
|
1391
|
-
const
|
|
1459
|
+
const check = () => {
|
|
1392
1460
|
const newUrl = window.location.pathname + window.location.search;
|
|
1393
1461
|
if (newUrl !== lastUrl) {
|
|
1394
1462
|
lastUrl = newUrl;
|
|
1395
|
-
setCurrentUrl(newUrl);
|
|
1396
1463
|
detectAndSetActiveMenu();
|
|
1397
1464
|
}
|
|
1398
1465
|
};
|
|
1399
|
-
window.addEventListener("popstate",
|
|
1400
|
-
const
|
|
1401
|
-
const newUrl = window.location.pathname + window.location.search;
|
|
1402
|
-
if (newUrl !== lastUrl) {
|
|
1403
|
-
handleLocationChange();
|
|
1404
|
-
}
|
|
1405
|
-
}, 250);
|
|
1466
|
+
window.addEventListener("popstate", check);
|
|
1467
|
+
const interval = setInterval(check, 250);
|
|
1406
1468
|
return () => {
|
|
1407
|
-
window.removeEventListener("popstate",
|
|
1408
|
-
clearInterval(
|
|
1469
|
+
window.removeEventListener("popstate", check);
|
|
1470
|
+
clearInterval(interval);
|
|
1409
1471
|
};
|
|
1410
1472
|
}, [detectAndSetActiveMenu]);
|
|
1411
|
-
|
|
1412
|
-
|
|
1413
|
-
|
|
1414
|
-
|
|
1415
|
-
|
|
1416
|
-
|
|
1417
|
-
|
|
1418
|
-
|
|
1473
|
+
useEffect3(() => {
|
|
1474
|
+
const onResize = () => {
|
|
1475
|
+
setWidth(window.innerWidth);
|
|
1476
|
+
setFly(null);
|
|
1477
|
+
};
|
|
1478
|
+
window.addEventListener("resize", onResize);
|
|
1479
|
+
const r = requestAnimationFrame(() => requestAnimationFrame(() => setReady(true)));
|
|
1480
|
+
return () => {
|
|
1481
|
+
window.removeEventListener("resize", onResize);
|
|
1482
|
+
cancelAnimationFrame(r);
|
|
1483
|
+
};
|
|
1484
|
+
}, []);
|
|
1485
|
+
useEffect3(() => {
|
|
1486
|
+
if (!phone) setIsMobileMenuOpen(false);
|
|
1487
|
+
}, [phone]);
|
|
1488
|
+
const toggleCollapsed = useCallback(() => {
|
|
1489
|
+
if (phone) return;
|
|
1490
|
+
const next = !collapsed;
|
|
1491
|
+
try {
|
|
1492
|
+
localStorage.setItem(LS_COLLAPSED, next ? "1" : "0");
|
|
1493
|
+
} catch {
|
|
1494
|
+
}
|
|
1495
|
+
setPref(next);
|
|
1496
|
+
setFly(null);
|
|
1497
|
+
setIsSwitchProfileOpen(false);
|
|
1498
|
+
}, [phone, collapsed]);
|
|
1499
|
+
const screens = useMemo2(() => {
|
|
1500
|
+
const out = [];
|
|
1501
|
+
navItemsLocal.forEach((item) => {
|
|
1502
|
+
if (item.options && item.options.length) {
|
|
1503
|
+
item.options.forEach((o) => {
|
|
1504
|
+
if (!isSoon(o) && o.onClick) out.push({ label: cleanLabel(o.label), group: item.label, run: () => o.onClick() });
|
|
1505
|
+
});
|
|
1506
|
+
} else if (item.onClick) {
|
|
1507
|
+
out.push({ label: cleanLabel(item.label), group: "", run: () => item.onClick() });
|
|
1508
|
+
}
|
|
1509
|
+
});
|
|
1510
|
+
return out;
|
|
1511
|
+
}, [navItemsLocal]);
|
|
1512
|
+
const gotoMap = useMemo2(() => {
|
|
1513
|
+
const m = {};
|
|
1514
|
+
GOTO.forEach(([key, label, group]) => {
|
|
1515
|
+
const s = screens.find((x) => norm(x.label) === norm(label) && (!group || norm(x.group) === norm(group)));
|
|
1516
|
+
if (s) m[key] = s;
|
|
1517
|
+
});
|
|
1518
|
+
return m;
|
|
1519
|
+
}, [screens]);
|
|
1520
|
+
const commands = useMemo2(() => {
|
|
1521
|
+
const keyOf = new Map(Object.entries(gotoMap).map(([k, s]) => [s, k.toUpperCase()]));
|
|
1522
|
+
const cmds = screens.map((s) => ({ label: s.label, sub: s.group, keys: keyOf.has(s) ? ["G", keyOf.get(s)] : [], run: s.run }));
|
|
1523
|
+
if (!phone) cmds.push({ label: collapsed ? "Expand sidebar" : "Collapse sidebar", sub: "Action", keys: ["["], run: toggleCollapsed });
|
|
1524
|
+
cmds.push({ label: "Keyboard shortcuts", sub: "Help", keys: ["?"], run: () => setHelpOpen(true) });
|
|
1525
|
+
return cmds;
|
|
1526
|
+
}, [screens, gotoMap, phone, collapsed, toggleCollapsed]);
|
|
1527
|
+
const helpSections = useMemo2(
|
|
1528
|
+
() => [
|
|
1529
|
+
{
|
|
1530
|
+
title: "Global",
|
|
1531
|
+
rows: [
|
|
1532
|
+
{ label: "Focus search on this page", keys: [MOD, "K"] },
|
|
1533
|
+
{ label: "Focus search (alternative)", keys: ["/"] },
|
|
1534
|
+
{ label: "Jump to any screen or action", keys: [MOD, "\u21E7", "K"] },
|
|
1535
|
+
{ label: "Collapse or expand sidebar", keys: ["["] },
|
|
1536
|
+
{ label: "Close menu, drawer or dialog", keys: ["Esc"] },
|
|
1537
|
+
{ label: "Show this list", keys: ["?"] }
|
|
1538
|
+
]
|
|
1539
|
+
},
|
|
1540
|
+
{ title: "Go to", rows: GOTO.filter(([k]) => gotoMap[k]).map(([k]) => ({ label: gotoMap[k].label, keys: ["G", k.toUpperCase()] })) },
|
|
1541
|
+
{
|
|
1542
|
+
title: "In the palette",
|
|
1543
|
+
rows: [
|
|
1544
|
+
{ label: "Move selection", keys: ["\u2191", "\u2193"] },
|
|
1545
|
+
{ label: "Open selected", keys: ["\u21B5"] }
|
|
1546
|
+
]
|
|
1547
|
+
}
|
|
1548
|
+
],
|
|
1549
|
+
[gotoMap]
|
|
1550
|
+
);
|
|
1551
|
+
const stateRef = useRef4({});
|
|
1552
|
+
stateRef.current = { palOpen, helpOpen, fly, isSwitchProfileOpen, isMobileMenuOpen, phone, gotoMap, toggleCollapsed };
|
|
1553
|
+
useEffect3(() => {
|
|
1554
|
+
const findSearch = () => Array.from(document.querySelectorAll('main input[type="search"], main input[placeholder^="Search"], input[type="search"], input[placeholder^="Search"]')).find(
|
|
1555
|
+
(el) => el.offsetParent !== null && !el.closest("[data-jett-shell]")
|
|
1556
|
+
);
|
|
1557
|
+
const onKey = (e) => {
|
|
1558
|
+
const s = stateRef.current;
|
|
1559
|
+
const t = e.target;
|
|
1560
|
+
const typing = t && (t.isContentEditable || /^(INPUT|TEXTAREA|SELECT)$/.test(t.tagName));
|
|
1561
|
+
const mod = e.metaKey || e.ctrlKey;
|
|
1562
|
+
const key = (e.key || "").toLowerCase();
|
|
1563
|
+
if (mod && key === "k") {
|
|
1564
|
+
e.preventDefault();
|
|
1565
|
+
const el = !e.shiftKey && !s.palOpen ? findSearch() : null;
|
|
1566
|
+
if (el && document.activeElement !== el) {
|
|
1567
|
+
setHelpOpen(false);
|
|
1568
|
+
el.focus();
|
|
1569
|
+
if (el.select) el.select();
|
|
1570
|
+
return;
|
|
1571
|
+
}
|
|
1572
|
+
setHelpOpen(false);
|
|
1573
|
+
setFly(null);
|
|
1574
|
+
setIsSwitchProfileOpen(false);
|
|
1575
|
+
setPalOpen((o) => !o);
|
|
1576
|
+
return;
|
|
1577
|
+
}
|
|
1578
|
+
if (e.key === "Escape") {
|
|
1579
|
+
const close = () => {
|
|
1580
|
+
e.preventDefault();
|
|
1581
|
+
e.stopImmediatePropagation();
|
|
1582
|
+
};
|
|
1583
|
+
if (s.palOpen) return close(), setPalOpen(false);
|
|
1584
|
+
if (s.helpOpen) return close(), setHelpOpen(false);
|
|
1585
|
+
if (s.fly) return close(), setFly(null);
|
|
1586
|
+
if (s.isSwitchProfileOpen) return close(), setIsSwitchProfileOpen(false);
|
|
1587
|
+
if (s.isMobileMenuOpen) return close(), setIsMobileMenuOpen(false);
|
|
1588
|
+
return;
|
|
1589
|
+
}
|
|
1590
|
+
if (typing || mod || e.altKey || s.palOpen) return;
|
|
1591
|
+
if (gPending.current) {
|
|
1592
|
+
gPending.current = false;
|
|
1593
|
+
clearTimeout(gTimer.current);
|
|
1594
|
+
const target = s.gotoMap[key];
|
|
1595
|
+
if (target) {
|
|
1596
|
+
e.preventDefault();
|
|
1597
|
+
target.run();
|
|
1598
|
+
}
|
|
1599
|
+
return;
|
|
1600
|
+
}
|
|
1601
|
+
if (key === "g" && !e.shiftKey) {
|
|
1602
|
+
gPending.current = true;
|
|
1603
|
+
gTimer.current = setTimeout(() => gPending.current = false, 1200);
|
|
1604
|
+
return;
|
|
1605
|
+
}
|
|
1606
|
+
if (e.key === "/") {
|
|
1607
|
+
const el = findSearch();
|
|
1608
|
+
if (el) {
|
|
1609
|
+
e.preventDefault();
|
|
1610
|
+
el.focus();
|
|
1611
|
+
if (el.select) el.select();
|
|
1612
|
+
}
|
|
1613
|
+
return;
|
|
1614
|
+
}
|
|
1615
|
+
if (e.key === "?") {
|
|
1616
|
+
e.preventDefault();
|
|
1617
|
+
setHelpOpen((o) => !o);
|
|
1618
|
+
return;
|
|
1619
|
+
}
|
|
1620
|
+
if (e.key === "[" && !s.phone) {
|
|
1621
|
+
e.preventDefault();
|
|
1622
|
+
s.toggleCollapsed();
|
|
1623
|
+
}
|
|
1624
|
+
};
|
|
1625
|
+
window.addEventListener("keydown", onKey, true);
|
|
1626
|
+
return () => {
|
|
1627
|
+
window.removeEventListener("keydown", onKey, true);
|
|
1628
|
+
clearTimeout(gTimer.current);
|
|
1629
|
+
};
|
|
1630
|
+
}, []);
|
|
1631
|
+
const parentIndex = activeMenuPath ? Number((/^menu-(\d+)/.exec(activeMenuPath) || [])[1]) : -1;
|
|
1632
|
+
const activeLabel = (() => {
|
|
1633
|
+
var _a2, _b2;
|
|
1634
|
+
if (!activeMenuPath) return "JETT Admin";
|
|
1635
|
+
const m = /^menu-(\d+)(?:-option-(\d+))?/.exec(activeMenuPath);
|
|
1636
|
+
const item = navItemsLocal[Number(m == null ? void 0 : m[1])];
|
|
1637
|
+
if (!item) return "JETT Admin";
|
|
1638
|
+
return cleanLabel(m[2] !== void 0 ? (_b2 = (_a2 = item.options) == null ? void 0 : _a2[Number(m[2])]) == null ? void 0 : _b2.label : item.label) || "JETT Admin";
|
|
1639
|
+
})();
|
|
1640
|
+
const displayName = username || cookieUserName || "Admin";
|
|
1641
|
+
const scopeLabel = SCOPE_LABELS[scope] ?? scope ?? "";
|
|
1642
|
+
const expanded = !collapsed;
|
|
1643
|
+
const openFly = (index, e) => {
|
|
1644
|
+
var _a2, _b2;
|
|
1645
|
+
const r = e.currentTarget.getBoundingClientRect();
|
|
1646
|
+
const n = ((_b2 = (_a2 = navItemsLocal[index]) == null ? void 0 : _a2.options) == null ? void 0 : _b2.length) || 1;
|
|
1647
|
+
const top = Math.max(8, Math.min(r.top - 6, window.innerHeight - (n * 36 + 60)));
|
|
1648
|
+
setIsSwitchProfileOpen(false);
|
|
1649
|
+
setFly((f) => f && f.index === index ? null : { index, top });
|
|
1419
1650
|
};
|
|
1420
|
-
|
|
1651
|
+
const subItemClass = (active, soon) => `flex items-center justify-between gap-2 rounded-[6px] border-0 px-3 text-left !text-[14px] whitespace-nowrap w-full ${phone ? "py-[11px]" : "py-[6px]"} ${soon ? "cursor-default bg-transparent text-jett-ink-400" : active ? "cursor-pointer bg-jett-fill !font-semibold text-jett-ink" : "cursor-pointer bg-transparent !font-medium text-jett-ink-500 hover:bg-jett-fill hover:text-jett-ink"}`;
|
|
1652
|
+
const renderOptions = (item, index, inFlyout) => item.options.map((option, optionsIndex) => {
|
|
1653
|
+
const subKey = `menu-${index}-option-${optionsIndex}`;
|
|
1654
|
+
const active = activeMenuPath === subKey || (activeMenuPath == null ? void 0 : activeMenuPath.startsWith(`${subKey}-`));
|
|
1655
|
+
const soon = isSoon(option);
|
|
1656
|
+
const hasKids = option.options && option.options.length > 0;
|
|
1657
|
+
return /* @__PURE__ */ React14.createElement("div", { key: optionsIndex, id: `${id}-opt-${index}-${optionsIndex}` }, /* @__PURE__ */ React14.createElement(
|
|
1658
|
+
"button",
|
|
1659
|
+
{
|
|
1660
|
+
type: "button",
|
|
1661
|
+
disabled: soon,
|
|
1662
|
+
"aria-disabled": soon || void 0,
|
|
1663
|
+
"aria-current": active && !hasKids ? "page" : void 0,
|
|
1664
|
+
"aria-expanded": hasKids ? isMenuOpen(subKey) : void 0,
|
|
1665
|
+
title: soon ? "Not available yet" : void 0,
|
|
1666
|
+
onClick: (e) => soon ? e.preventDefault() : handleSubMenuClick(option, optionsIndex, index, e),
|
|
1667
|
+
className: `${subItemClass(active, soon)} ${inFlyout ? "!py-[7px] !px-2.5" : ""}`
|
|
1668
|
+
},
|
|
1669
|
+
/* @__PURE__ */ React14.createElement("span", { className: "truncate" }, cleanLabel(option.label)),
|
|
1670
|
+
soon && /* @__PURE__ */ React14.createElement("span", { className: "text-[11px] font-semibold text-jett-ink-400" }, "Soon"),
|
|
1671
|
+
hasKids && /* @__PURE__ */ React14.createElement(Chevron, { open: isMenuOpen(subKey) })
|
|
1672
|
+
), hasKids && isMenuOpen(subKey) && /* @__PURE__ */ React14.createElement("div", { className: "ml-3 flex flex-col gap-0.5 border-l border-jett-line pl-2" }, option.options.map((sub, subIndex) => {
|
|
1673
|
+
const subActive = activeMenuPath === `${subKey}-sub-${sub.label}`;
|
|
1674
|
+
return /* @__PURE__ */ React14.createElement("button", { key: subIndex, type: "button", "aria-current": subActive ? "page" : void 0, onClick: () => handleSubSubMenuClick(sub, index, optionsIndex), className: subItemClass(subActive, false) }, /* @__PURE__ */ React14.createElement("span", { className: "truncate" }, cleanLabel(sub.label)));
|
|
1675
|
+
})));
|
|
1676
|
+
});
|
|
1677
|
+
const flyItem = fly ? navItemsLocal[fly.index] : null;
|
|
1678
|
+
return /* @__PURE__ */ React14.createElement(React14.Fragment, null, phone && /* @__PURE__ */ React14.createElement("div", { "data-jett-shell": true, className: "font-jett fixed left-0 top-0 z-50 flex h-14 w-full items-center gap-2.5 border-b border-jett-line bg-jett-surface pl-1 pr-2", id: `${id}-div-1` }, /* @__PURE__ */ React14.createElement(
|
|
1421
1679
|
"button",
|
|
1422
1680
|
{
|
|
1423
|
-
|
|
1424
|
-
|
|
1425
|
-
"aria-label": "
|
|
1681
|
+
type: "button",
|
|
1682
|
+
onClick: () => setIsMobileMenuOpen(true),
|
|
1683
|
+
"aria-label": "Open menu",
|
|
1684
|
+
title: "Open menu",
|
|
1685
|
+
className: "flex h-11 w-11 cursor-pointer items-center justify-center rounded-[8px] border-0 bg-transparent text-jett-ink-700 hover:bg-jett-fill",
|
|
1426
1686
|
id: `${id}-button-1`
|
|
1427
1687
|
},
|
|
1428
|
-
|
|
1429
|
-
), /* @__PURE__ */ React14.createElement("
|
|
1430
|
-
"
|
|
1688
|
+
/* @__PURE__ */ React14.createElement("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true" }, /* @__PURE__ */ React14.createElement("path", { d: "M4 6h16M4 12h16M4 18h16" }))
|
|
1689
|
+
), sideBarLogoLocal ? /* @__PURE__ */ React14.createElement("img", { src: sideBarLogoLocal, alt: "Logo", className: "h-[26px] max-w-[96px] object-contain", id: `${id}-img-1` }) : /* @__PURE__ */ React14.createElement(LogoTile, { size: 26 }), /* @__PURE__ */ React14.createElement("span", { className: "min-w-0 flex-1 truncate text-[15px] font-semibold text-jett-ink" }, activeLabel), /* @__PURE__ */ React14.createElement("button", { type: "button", onClick: () => setIsMobileMenuOpen(true), "aria-label": "Account", title: "Account", className: "flex h-11 w-11 cursor-pointer items-center justify-center border-0 bg-transparent" }, /* @__PURE__ */ React14.createElement("span", { className: "flex h-8 w-8 items-center justify-center rounded-full bg-jett-ink-800 text-[12px] font-semibold text-white" }, initials(displayName)))), phone && isMobileMenuOpen && /* @__PURE__ */ React14.createElement("div", { className: "fixed inset-0 z-[69] bg-[rgba(17,24,39,0.5)]", onClick: closeMobileMenu, "aria-hidden": "true", id: `${id}-div-4` }), /* @__PURE__ */ React14.createElement(
|
|
1690
|
+
"aside",
|
|
1431
1691
|
{
|
|
1432
|
-
|
|
1433
|
-
|
|
1434
|
-
width:
|
|
1435
|
-
|
|
1436
|
-
|
|
1437
|
-
|
|
1438
|
-
|
|
1439
|
-
|
|
1440
|
-
"div",
|
|
1441
|
-
{
|
|
1442
|
-
className: "fixed inset-0 bg-black/80 bg-opacity-50 z-40 md:hidden",
|
|
1443
|
-
onClick: closeMobileMenu,
|
|
1444
|
-
id: `${id}-div-4`
|
|
1445
|
-
}
|
|
1446
|
-
), /* @__PURE__ */ React14.createElement(
|
|
1447
|
-
"div",
|
|
1448
|
-
{
|
|
1449
|
-
className: `fixed top-0 left-0 md:relative w-[320px] transition-all ease-in-out delay-100 bg-white dark:bg-[#18181b] border-r border-gray-200 dark:border-[#303036] flex flex-col p-4 pt-20 md:pt-4 h-full max-h-[100vh] xs:max-md:z-40 md:max-lg:w-[280px] ${isMobileMenuOpen ? "translate-x-0" : "-translate-x-full md:translate-x-0"}`,
|
|
1692
|
+
"data-jett-shell": true,
|
|
1693
|
+
"aria-label": "Main navigation",
|
|
1694
|
+
className: `font-jett flex h-screen flex-col border-r border-jett-line bg-jett-surface text-jett-ink ${phone ? "fixed left-0 top-0 z-[70] max-w-[86vw]" : "relative"} ${ready ? "transition-[width,transform] duration-200 ease-in-out" : ""}`,
|
|
1695
|
+
style: {
|
|
1696
|
+
width: phone ? 280 : collapsed ? 64 : 256,
|
|
1697
|
+
transform: phone && !isMobileMenuOpen ? "translateX(-100%)" : "none",
|
|
1698
|
+
boxShadow: phone && isMobileMenuOpen ? "var(--shadow-jett-drawer)" : "none"
|
|
1699
|
+
},
|
|
1450
1700
|
id: `${id}-div-5`
|
|
1451
1701
|
},
|
|
1452
|
-
/* @__PURE__ */ React14.createElement("div", { className:
|
|
1453
|
-
"
|
|
1702
|
+
/* @__PURE__ */ React14.createElement("div", { className: `flex h-16 shrink-0 items-center gap-2.5 border-b border-jett-line-row ${collapsed ? "justify-center px-0" : "px-6"}`, id: `${id}-div-6` }, expanded && sideBarLogoLocal ? /* @__PURE__ */ React14.createElement("img", { src: sideBarLogoLocal, alt: "Logo", className: "h-8 max-w-[168px] object-contain", id: `${id}-img-2` }) : /* @__PURE__ */ React14.createElement(React14.Fragment, null, /* @__PURE__ */ React14.createElement(LogoTile, null), expanded && /* @__PURE__ */ React14.createElement("span", { className: "flex-1 whitespace-nowrap text-[15px] font-semibold tracking-[-0.01em] text-jett-ink" }, "JETT Admin")), phone && /* @__PURE__ */ React14.createElement(
|
|
1703
|
+
"button",
|
|
1454
1704
|
{
|
|
1455
|
-
|
|
1456
|
-
|
|
1457
|
-
|
|
1458
|
-
|
|
1459
|
-
className: "
|
|
1460
|
-
|
|
1461
|
-
}
|
|
1462
|
-
))
|
|
1463
|
-
/* @__PURE__ */ React14.createElement("
|
|
1464
|
-
|
|
1705
|
+
type: "button",
|
|
1706
|
+
onClick: closeMobileMenu,
|
|
1707
|
+
"aria-label": "Close menu",
|
|
1708
|
+
title: "Close menu",
|
|
1709
|
+
className: "-mr-3 ml-auto flex h-11 w-11 cursor-pointer items-center justify-center rounded-[8px] border-0 bg-transparent text-jett-ink-500 hover:bg-jett-fill"
|
|
1710
|
+
},
|
|
1711
|
+
/* @__PURE__ */ React14.createElement("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true" }, /* @__PURE__ */ React14.createElement("path", { d: "M18 6 6 18M6 6l12 12" }))
|
|
1712
|
+
)),
|
|
1713
|
+
/* @__PURE__ */ React14.createElement("nav", { className: "flex min-h-0 flex-1 flex-col gap-0.5 overflow-y-auto overflow-x-hidden px-3 py-4 scrollbar-hide", id: `${id}-div-9` }, expanded ? /* @__PURE__ */ React14.createElement(
|
|
1714
|
+
"button",
|
|
1715
|
+
{
|
|
1716
|
+
type: "button",
|
|
1717
|
+
onClick: () => {
|
|
1718
|
+
closeMobileMenu();
|
|
1719
|
+
setPalOpen(true);
|
|
1720
|
+
},
|
|
1721
|
+
className: "mb-2.5 flex h-[34px] w-full shrink-0 cursor-pointer items-center gap-2.5 whitespace-nowrap rounded-[6px] border border-jett-line-soft bg-jett-canvas pl-3 pr-2 text-left text-[13px] text-jett-ink-500 hover:border-jett-line-control hover:text-jett-ink-700"
|
|
1722
|
+
},
|
|
1723
|
+
/* @__PURE__ */ React14.createElement("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "shrink-0", "aria-hidden": "true" }, /* @__PURE__ */ React14.createElement("circle", { cx: "11", cy: "11", r: "7" }), /* @__PURE__ */ React14.createElement("path", { d: "m20 20-3.5-3.5" })),
|
|
1724
|
+
/* @__PURE__ */ React14.createElement("span", { className: "flex-1" }, "Jump to\u2026"),
|
|
1725
|
+
!phone && /* @__PURE__ */ React14.createElement(Kbd, null, MAC ? "\u21E7\u2318K" : "Ctrl \u21E7 K")
|
|
1726
|
+
) : /* @__PURE__ */ React14.createElement(
|
|
1727
|
+
"button",
|
|
1728
|
+
{
|
|
1729
|
+
type: "button",
|
|
1730
|
+
onClick: () => setPalOpen(true),
|
|
1731
|
+
title: `Jump to ${MAC ? "\u21E7\u2318K" : "Ctrl \u21E7 K"}`,
|
|
1732
|
+
"aria-label": "Search or jump to",
|
|
1733
|
+
className: "mx-auto mb-2 flex h-10 w-10 shrink-0 cursor-pointer items-center justify-center rounded-[8px] border border-jett-line-soft bg-jett-canvas text-jett-ink-500 hover:border-jett-line-control hover:text-jett-ink-700"
|
|
1734
|
+
},
|
|
1735
|
+
/* @__PURE__ */ React14.createElement("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true" }, /* @__PURE__ */ React14.createElement("circle", { cx: "11", cy: "11", r: "7" }), /* @__PURE__ */ React14.createElement("path", { d: "m20 20-3.5-3.5" }))
|
|
1736
|
+
), navItemsLocal == null ? void 0 : navItemsLocal.map((item, index) => {
|
|
1465
1737
|
const menuKey = `menu-${index}`;
|
|
1738
|
+
const hasOptions = !!(item.options && item.options.length);
|
|
1466
1739
|
const isOpen = isMenuOpen(menuKey);
|
|
1467
|
-
const
|
|
1468
|
-
|
|
1469
|
-
|
|
1740
|
+
const isParent = index === parentIndex;
|
|
1741
|
+
const Icon = item.Icon;
|
|
1742
|
+
const iconEl = Icon ? /* @__PURE__ */ React14.createElement(Icon, { width: 18, height: 18, strokeWidth: 1.8, className: `shrink-0 ${isParent ? "text-jett-brand" : "text-jett-ink-400"}`, "aria-hidden": "true" }) : null;
|
|
1743
|
+
if (collapsed) {
|
|
1744
|
+
const flying = fly && fly.index === index;
|
|
1745
|
+
return /* @__PURE__ */ React14.createElement(
|
|
1746
|
+
"button",
|
|
1747
|
+
{
|
|
1748
|
+
key: index,
|
|
1749
|
+
type: "button",
|
|
1750
|
+
title: item.label,
|
|
1751
|
+
"aria-label": item.label,
|
|
1752
|
+
"aria-haspopup": hasOptions ? "menu" : void 0,
|
|
1753
|
+
"aria-expanded": hasOptions ? !!flying : void 0,
|
|
1754
|
+
onClick: (e) => hasOptions ? openFly(index, e) : handleMenuClick(item, index, e),
|
|
1755
|
+
className: `mx-auto flex h-10 w-10 shrink-0 cursor-pointer items-center justify-center rounded-[8px] border-0 ${isParent ? "bg-jett-brand-soft" : flying ? "bg-jett-fill" : "bg-transparent hover:bg-jett-fill"}`,
|
|
1756
|
+
id: `${id}-div-12-${index}`
|
|
1757
|
+
},
|
|
1758
|
+
iconEl
|
|
1759
|
+
);
|
|
1760
|
+
}
|
|
1761
|
+
return /* @__PURE__ */ React14.createElement("div", { key: index, className: "flex flex-col gap-0.5", id: `${id}-div-11-${index}` }, /* @__PURE__ */ React14.createElement(
|
|
1762
|
+
"button",
|
|
1470
1763
|
{
|
|
1471
|
-
|
|
1764
|
+
type: "button",
|
|
1765
|
+
"aria-expanded": hasOptions ? isOpen : void 0,
|
|
1766
|
+
"aria-current": !hasOptions && isParent ? "page" : void 0,
|
|
1472
1767
|
onClick: (e) => handleMenuClick(item, index, e),
|
|
1473
|
-
|
|
1474
|
-
|
|
1475
|
-
/* @__PURE__ */ React14.createElement("div", { className: "text-primary", id: `${id}-div-13` }, /* @__PURE__ */ React14.createElement(item.Icon, { width: 20, height: 20, id: `${id}-icon-1` })),
|
|
1476
|
-
/* @__PURE__ */ React14.createElement("span", { className: "!font-medium !text-[16px] !text-[#000] dark:text-[#f4f4f5cc]", id: `${id}-span-1` }, item.label),
|
|
1477
|
-
item.isDropDown && /* @__PURE__ */ React14.createElement("div", { className: `ml-auto transition-all delay-75 ${isOpen ? "rotate-180" : ""}`, id: `${id}-div-14` }, /* @__PURE__ */ React14.createElement(ChevronDown3, { width: 20, height: 20, className: "text-gray-500 dark:text-gray-400" }))
|
|
1478
|
-
), item.options && item.options.length > 0 && /* @__PURE__ */ React14.createElement(
|
|
1479
|
-
"div",
|
|
1480
|
-
{
|
|
1481
|
-
className: `ml-[20px] overflow-hidden flex flex-col transition-all duration-200 ${isOpen ? "max-h-[1000px] min-h-[50px]" : "max-h-0"}`,
|
|
1482
|
-
id: `${id}-div-15`
|
|
1768
|
+
className: `flex w-full cursor-pointer items-center gap-3 whitespace-nowrap rounded-[6px] border-0 px-3 text-left !text-[14px] ${phone ? "py-3" : "py-2"} ${isParent ? "bg-jett-brand-soft !font-semibold text-jett-brand" : "bg-transparent !font-medium text-jett-ink-700 hover:bg-jett-fill"}`,
|
|
1769
|
+
id: `${id}-div-12-${index}`
|
|
1483
1770
|
},
|
|
1484
|
-
|
|
1485
|
-
|
|
1486
|
-
|
|
1487
|
-
|
|
1488
|
-
|
|
1489
|
-
|
|
1490
|
-
|
|
1491
|
-
{
|
|
1492
|
-
className: `group flex items-center gap-3 py-2 px-3 ml-4 mr-2 rounded-md transition-colors duration-200 ${isDisabled ? "cursor-not-allowed opacity-70 text-gray-400 dark:text-gray-500" : `hover:bg-[#f4f4f5] dark:hover:bg-[#27272a] text-gray-600 dark:text-[#a1a1aa] cursor-pointer ${isSubActive ? "bg-[#f4f4f5] dark:bg-[#27272a]" : ""}`}`,
|
|
1493
|
-
onClick: (e) => {
|
|
1494
|
-
if (isDisabled) {
|
|
1495
|
-
e.preventDefault();
|
|
1496
|
-
return;
|
|
1497
|
-
}
|
|
1498
|
-
handleSubMenuClick(options, optionsIndex, index, e);
|
|
1499
|
-
},
|
|
1500
|
-
id: `${id}-div-17-${optionsIndex}`
|
|
1501
|
-
},
|
|
1502
|
-
/* @__PURE__ */ React14.createElement("div", { id: `${id}-div-18-${optionsIndex}` }),
|
|
1503
|
-
/* @__PURE__ */ React14.createElement("span", { className: `!font-medium !text-[15px] ${isDisabled ? "!text-[#3f3f46cc] dark:!text-[#a1a1aa]" : "!text-[#3f3f46cc] dark:!text-[#a1a1aa]"}`, id: `${id}-span-2-${optionsIndex}` }, options.label),
|
|
1504
|
-
options.isDropDown && /* @__PURE__ */ React14.createElement(
|
|
1505
|
-
"div",
|
|
1506
|
-
{
|
|
1507
|
-
className: `ml-auto transition-all delay-75 ${isSubMenuOpen ? "rotate-180" : ""}`,
|
|
1508
|
-
id: `${id}-div-19-${optionsIndex}`
|
|
1509
|
-
},
|
|
1510
|
-
/* @__PURE__ */ React14.createElement(ChevronDown3, { width: 18, height: 18, className: "text-gray-400 dark:text-gray-500" })
|
|
1511
|
-
)
|
|
1512
|
-
), options.options && options.options.length > 0 && /* @__PURE__ */ React14.createElement(
|
|
1513
|
-
"div",
|
|
1514
|
-
{
|
|
1515
|
-
className: `ml-[20px] overflow-hidden flex flex-col transition-all duration-200 ${isSubMenuOpen ? "max-h-[1000px] min-h-[50px]" : "max-h-0"}`,
|
|
1516
|
-
id: `${id}-div-20-${optionsIndex}`
|
|
1517
|
-
},
|
|
1518
|
-
options.options.map((subOption, subIndex) => {
|
|
1519
|
-
const isSubSubActive = activeMenuPath === `menu-${index}-option-${optionsIndex}-sub-${subOption.label}`;
|
|
1520
|
-
return /* @__PURE__ */ React14.createElement(
|
|
1521
|
-
"div",
|
|
1522
|
-
{
|
|
1523
|
-
key: subIndex,
|
|
1524
|
-
className: `py-1.5 px-3 rounded-md hover:bg-[#f4f4f5] dark:hover:bg-[#27272a] text-gray-500 dark:text-[#71717a] font-medium text-base cursor-pointer ml-8 mr-2 transition-colors duration-200 ${isSubSubActive ? "bg-[#f4f4f5] dark:bg-[#27272a]" : ""}`,
|
|
1525
|
-
onClick: (e) => handleSubSubMenuClick(subOption, index, optionsIndex, e),
|
|
1526
|
-
id: `${id}-div-21-${subIndex}`
|
|
1527
|
-
},
|
|
1528
|
-
subOption.label
|
|
1529
|
-
);
|
|
1530
|
-
})
|
|
1531
|
-
));
|
|
1532
|
-
})
|
|
1533
|
-
));
|
|
1534
|
-
}))),
|
|
1535
|
-
/* @__PURE__ */ React14.createElement("div", { ref: profileCardRef, className: "relative mt-auto bg-[#fafafa] dark:bg-[#18181b] sticky bottom-0 mt-2", id: `${id}-div-22` }, /* @__PURE__ */ React14.createElement(
|
|
1536
|
-
"div",
|
|
1771
|
+
iconEl,
|
|
1772
|
+
/* @__PURE__ */ React14.createElement("span", { className: "flex-1 truncate" }, item.label),
|
|
1773
|
+
hasOptions && /* @__PURE__ */ React14.createElement("span", { className: isParent ? "text-jett-brand" : "text-jett-ink-400" }, /* @__PURE__ */ React14.createElement(Chevron, { open: isOpen }))
|
|
1774
|
+
), hasOptions && isOpen && /* @__PURE__ */ React14.createElement("div", { className: "mb-1 ml-[27px] mt-0.5 flex flex-col gap-0.5 border-l border-jett-line pl-[13px]", id: `${id}-div-15-${index}` }, renderOptions(item, index, false)));
|
|
1775
|
+
})),
|
|
1776
|
+
!phone && /* @__PURE__ */ React14.createElement("div", { className: `flex shrink-0 flex-wrap gap-1 border-t border-jett-line-row px-3 py-2 ${collapsed ? "justify-center" : ""}` }, /* @__PURE__ */ React14.createElement(
|
|
1777
|
+
"button",
|
|
1537
1778
|
{
|
|
1538
|
-
|
|
1539
|
-
onClick: () =>
|
|
1540
|
-
|
|
1779
|
+
type: "button",
|
|
1780
|
+
onClick: () => setHelpOpen(true),
|
|
1781
|
+
title: "Keyboard shortcuts ?",
|
|
1782
|
+
"aria-label": "Keyboard shortcuts",
|
|
1783
|
+
className: `flex h-9 min-w-10 cursor-pointer items-center justify-center gap-2 whitespace-nowrap rounded-[6px] border-0 bg-transparent text-[13px] font-medium text-jett-ink-500 hover:bg-jett-fill hover:text-jett-ink ${collapsed ? "px-0" : "px-3"}`
|
|
1541
1784
|
},
|
|
1542
|
-
/* @__PURE__ */ React14.createElement("
|
|
1543
|
-
/* @__PURE__ */ React14.createElement(
|
|
1544
|
-
|
|
1545
|
-
|
|
1546
|
-
|
|
1547
|
-
|
|
1785
|
+
/* @__PURE__ */ React14.createElement("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.8", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true" }, /* @__PURE__ */ React14.createElement("rect", { x: "2", y: "6", width: "20", height: "12", rx: "2" }), /* @__PURE__ */ React14.createElement("path", { d: "M6 10h.01M10 10h.01M14 10h.01M18 10h.01M7 14h10" })),
|
|
1786
|
+
expanded && /* @__PURE__ */ React14.createElement(Kbd, null, "?")
|
|
1787
|
+
), /* @__PURE__ */ React14.createElement(
|
|
1788
|
+
"button",
|
|
1789
|
+
{
|
|
1790
|
+
type: "button",
|
|
1791
|
+
onClick: toggleCollapsed,
|
|
1792
|
+
title: collapsed ? "Expand sidebar [" : "Collapse sidebar [",
|
|
1793
|
+
"aria-label": collapsed ? "Expand sidebar" : "Collapse sidebar",
|
|
1794
|
+
"aria-pressed": collapsed,
|
|
1795
|
+
className: `flex h-9 min-w-10 cursor-pointer items-center justify-center gap-2.5 whitespace-nowrap rounded-[6px] border-0 bg-transparent text-[13px] font-medium text-jett-ink-500 hover:bg-jett-fill hover:text-jett-ink ${collapsed ? "px-0" : "flex-1 px-3"}`
|
|
1796
|
+
},
|
|
1797
|
+
/* @__PURE__ */ React14.createElement("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.8", strokeLinecap: "round", strokeLinejoin: "round", style: { transform: collapsed ? "scaleX(-1)" : "none" }, "aria-hidden": "true" }, /* @__PURE__ */ React14.createElement("rect", { x: "3", y: "4", width: "18", height: "16", rx: "2" }), /* @__PURE__ */ React14.createElement("path", { d: "M9 4v16M16 10l-2 2 2 2" })),
|
|
1798
|
+
expanded && /* @__PURE__ */ React14.createElement(React14.Fragment, null, /* @__PURE__ */ React14.createElement("span", { className: "flex-1 text-left" }, "Collapse"), /* @__PURE__ */ React14.createElement(Kbd, null, "["))
|
|
1799
|
+
)),
|
|
1800
|
+
/* @__PURE__ */ React14.createElement("div", { ref: profileCardRef, className: "relative shrink-0 border-t border-jett-line-row px-3 py-3", id: `${id}-div-22` }, /* @__PURE__ */ React14.createElement(
|
|
1801
|
+
"button",
|
|
1802
|
+
{
|
|
1803
|
+
type: "button",
|
|
1804
|
+
onClick: () => {
|
|
1805
|
+
setFly(null);
|
|
1806
|
+
setIsSwitchProfileOpen((prev) => !prev);
|
|
1548
1807
|
},
|
|
1549
|
-
|
|
1550
|
-
|
|
1808
|
+
title: displayName,
|
|
1809
|
+
"aria-haspopup": "dialog",
|
|
1810
|
+
"aria-expanded": isSwitchProfileOpen,
|
|
1811
|
+
className: `flex w-full cursor-pointer items-center gap-3 rounded-[8px] border border-transparent text-left ${collapsed ? "justify-center p-0" : "p-2.5"} ${isSwitchProfileOpen ? "bg-jett-fill" : "bg-transparent hover:bg-jett-fill"}`,
|
|
1812
|
+
id: `${id}-div-23`
|
|
1813
|
+
},
|
|
1814
|
+
/* @__PURE__ */ React14.createElement("span", { className: "flex h-9 w-9 shrink-0 items-center justify-center rounded-full bg-jett-ink-800 text-[13px] font-semibold text-white", id: `${id}-span-3` }, initials(displayName)),
|
|
1815
|
+
expanded && /* @__PURE__ */ React14.createElement(React14.Fragment, null, /* @__PURE__ */ React14.createElement("span", { className: "min-w-0 flex-1 whitespace-nowrap" }, /* @__PURE__ */ React14.createElement("span", { className: "block truncate text-[14px] font-medium text-jett-ink-800", id: `${id}-p-1` }, displayName), scopeLabel && /* @__PURE__ */ React14.createElement("span", { className: "block truncate text-[12px] text-jett-ink-500", id: `${id}-p-2` }, scopeLabel)), /* @__PURE__ */ React14.createElement("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "#9ca3af", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true" }, /* @__PURE__ */ React14.createElement("path", { d: "m7 15 5 5 5-5M7 9l5-5 5 5" })))
|
|
1551
1816
|
), /* @__PURE__ */ React14.createElement(
|
|
1552
1817
|
SwitchProfileSection,
|
|
1553
1818
|
{
|
|
1554
1819
|
id: `${id}-switch-profile`,
|
|
1555
1820
|
open: isSwitchProfileOpen,
|
|
1556
1821
|
anchorRef: profileCardRef,
|
|
1822
|
+
collapsed,
|
|
1823
|
+
scopeLabel,
|
|
1557
1824
|
onClose: () => setIsSwitchProfileOpen(false),
|
|
1558
1825
|
onManageProfile: () => {
|
|
1559
1826
|
setIsSwitchProfileOpen(false);
|
|
1560
|
-
|
|
1827
|
+
if (onManageProfile) onManageProfile();
|
|
1828
|
+
else window.location.href = "/profile";
|
|
1561
1829
|
},
|
|
1562
1830
|
onProfileSwitch: (profile) => {
|
|
1563
1831
|
setIsSwitchProfileOpen(false);
|
|
@@ -1578,11 +1846,22 @@ var AppSideBar = ({
|
|
|
1578
1846
|
}
|
|
1579
1847
|
}
|
|
1580
1848
|
))
|
|
1581
|
-
))
|
|
1849
|
+
), collapsed && flyItem && /* @__PURE__ */ React14.createElement(React14.Fragment, null, /* @__PURE__ */ React14.createElement("div", { className: "fixed inset-0 z-[79]", onClick: () => setFly(null), "aria-hidden": "true" }), /* @__PURE__ */ React14.createElement(
|
|
1850
|
+
"div",
|
|
1851
|
+
{
|
|
1852
|
+
"data-jett-shell": true,
|
|
1853
|
+
role: "menu",
|
|
1854
|
+
"aria-label": flyItem.label,
|
|
1855
|
+
className: "font-jett fixed z-[80] flex w-[220px] flex-col gap-0.5 rounded-[10px] border border-jett-line bg-jett-surface p-1.5 shadow-jett-pop",
|
|
1856
|
+
style: { left: 72, top: fly.top }
|
|
1857
|
+
},
|
|
1858
|
+
/* @__PURE__ */ React14.createElement("div", { className: "px-2.5 pb-2 pt-1.5 text-[11px] font-semibold uppercase tracking-[0.06em] text-jett-ink-400" }, flyItem.label),
|
|
1859
|
+
renderOptions(flyItem, fly.index, true)
|
|
1860
|
+
)), /* @__PURE__ */ React14.createElement(CommandPalette, { id: `${id}-palette`, open: palOpen, onClose: () => setPalOpen(false), commands }), /* @__PURE__ */ React14.createElement(ShortcutsSheet, { id: `${id}-shortcuts`, open: helpOpen, onClose: () => setHelpOpen(false), sections: helpSections }));
|
|
1582
1861
|
};
|
|
1583
1862
|
|
|
1584
1863
|
// src/RightSheet/RightSheet.jsx
|
|
1585
|
-
import React15, { useEffect as
|
|
1864
|
+
import React15, { useEffect as useEffect4, useState as useState5 } from "react";
|
|
1586
1865
|
var RightSheet = ({
|
|
1587
1866
|
id = "right-sheet",
|
|
1588
1867
|
open,
|
|
@@ -1595,7 +1874,7 @@ var RightSheet = ({
|
|
|
1595
1874
|
showFooter = true
|
|
1596
1875
|
}) => {
|
|
1597
1876
|
const [visible, setVisible] = useState5(open);
|
|
1598
|
-
|
|
1877
|
+
useEffect4(() => {
|
|
1599
1878
|
if (open) {
|
|
1600
1879
|
document.body.style.overflow = "hidden";
|
|
1601
1880
|
setVisible(true);
|
|
@@ -1677,8 +1956,101 @@ var CustomTable = ({
|
|
|
1677
1956
|
)), /* @__PURE__ */ React16.createElement("tbody", { id: `${id}-tbody-1` }, children))));
|
|
1678
1957
|
};
|
|
1679
1958
|
|
|
1959
|
+
// src/inputs/CustomSelect.jsx
|
|
1960
|
+
import React17, { useState as useState6, useRef as useRef5 } from "react";
|
|
1961
|
+
import { ChevronDown as ChevronDown2, Search as Search3 } from "lucide-react";
|
|
1962
|
+
var CustomSelect = ({
|
|
1963
|
+
id = "custom-select",
|
|
1964
|
+
label,
|
|
1965
|
+
value,
|
|
1966
|
+
onChange,
|
|
1967
|
+
options,
|
|
1968
|
+
placeholder = "Select...",
|
|
1969
|
+
isRequired = false,
|
|
1970
|
+
error,
|
|
1971
|
+
heading,
|
|
1972
|
+
disabled = false
|
|
1973
|
+
}) => {
|
|
1974
|
+
const [open, setOpen] = useState6(false);
|
|
1975
|
+
const [search, setSearch] = useState6("");
|
|
1976
|
+
const wrapperRef = useRef5(null);
|
|
1977
|
+
const handleBlur = (e) => {
|
|
1978
|
+
var _a;
|
|
1979
|
+
if (!((_a = wrapperRef.current) == null ? void 0 : _a.contains(e.relatedTarget))) {
|
|
1980
|
+
setOpen(false);
|
|
1981
|
+
}
|
|
1982
|
+
};
|
|
1983
|
+
const filteredOptions = options.filter(
|
|
1984
|
+
(opt) => opt.label.toLowerCase().includes(search.toLowerCase())
|
|
1985
|
+
);
|
|
1986
|
+
const handleSelect = (val) => {
|
|
1987
|
+
onChange(val);
|
|
1988
|
+
setOpen(false);
|
|
1989
|
+
};
|
|
1990
|
+
const selectedOption = options.find((opt) => opt.value === value);
|
|
1991
|
+
return /* @__PURE__ */ React17.createElement(
|
|
1992
|
+
"div",
|
|
1993
|
+
{
|
|
1994
|
+
className: "flex flex-col w-full relative",
|
|
1995
|
+
ref: wrapperRef,
|
|
1996
|
+
tabIndex: disabled ? -1 : 0,
|
|
1997
|
+
onBlur: handleBlur,
|
|
1998
|
+
id: `${id}-div-1`
|
|
1999
|
+
},
|
|
2000
|
+
heading && /* @__PURE__ */ React17.createElement("h3", { className: "text-lg font-semibold mb-1", id: `${id}-h3-1` }, heading),
|
|
2001
|
+
label && /* @__PURE__ */ React17.createElement(
|
|
2002
|
+
"label",
|
|
2003
|
+
{
|
|
2004
|
+
className: `font-medium text-sm mb-1 ${heading ? "text-[#737373] dark:text-white" : "text-black dark:text-white"}`,
|
|
2005
|
+
id: `${id}-label-1`
|
|
2006
|
+
},
|
|
2007
|
+
label,
|
|
2008
|
+
" ",
|
|
2009
|
+
isRequired && /* @__PURE__ */ React17.createElement("span", { className: "text-red-500", id: `${id}-span-1` }, "*")
|
|
2010
|
+
),
|
|
2011
|
+
/* @__PURE__ */ React17.createElement(
|
|
2012
|
+
"div",
|
|
2013
|
+
{
|
|
2014
|
+
onClick: () => !disabled && setOpen((prev) => !prev),
|
|
2015
|
+
className: `flex justify-between items-center rounded-md px-3 py-2 text-sm border h-10 cursor-pointer dark:border-[#303036] dark:bg-[#18181b] dark:text-white
|
|
2016
|
+
${disabled ? "bg-gray-100 text-gray-400" : "bg-white dark:bg-[#18181b] dark:text-white"}
|
|
2017
|
+
${error ? "border-red-500" : "border-gray-300"}
|
|
2018
|
+
`,
|
|
2019
|
+
id: `${id}-div-2`
|
|
2020
|
+
},
|
|
2021
|
+
/* @__PURE__ */ React17.createElement("span", { className: `${selectedOption ? "text-black dark:text-white" : "text-gray-400 dark:text-white"}`, id: `${id}-span-2` }, selectedOption ? selectedOption.label : placeholder),
|
|
2022
|
+
/* @__PURE__ */ React17.createElement(
|
|
2023
|
+
ChevronDown2,
|
|
2024
|
+
{
|
|
2025
|
+
className: `w-4 h-4 text-gray-500 transition-transform dark:text-white ${open ? "rotate-180" : ""}`
|
|
2026
|
+
}
|
|
2027
|
+
)
|
|
2028
|
+
),
|
|
2029
|
+
open && !disabled && /* @__PURE__ */ React17.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", id: `${id}-div-3` }, /* @__PURE__ */ React17.createElement("div", { className: "flex items-center gap-2 p-2 border-b border-gray-200", id: `${id}-div-4` }, /* @__PURE__ */ React17.createElement(Search3, { size: 16, className: "text-gray-400" }), /* @__PURE__ */ React17.createElement(
|
|
2030
|
+
"input",
|
|
2031
|
+
{
|
|
2032
|
+
type: "text",
|
|
2033
|
+
value: search,
|
|
2034
|
+
onChange: (e) => setSearch(e.target.value),
|
|
2035
|
+
placeholder: "Search...",
|
|
2036
|
+
className: "flex-1 text-sm focus:outline-none",
|
|
2037
|
+
id: `${id}-input-1`
|
|
2038
|
+
}
|
|
2039
|
+
)), /* @__PURE__ */ React17.createElement("ul", { id: `${id}-ul-1` }, filteredOptions.length > 0 ? filteredOptions.map((opt) => /* @__PURE__ */ React17.createElement(
|
|
2040
|
+
"li",
|
|
2041
|
+
{
|
|
2042
|
+
key: opt.value,
|
|
2043
|
+
onClick: () => handleSelect(opt.value),
|
|
2044
|
+
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" : ""}`,
|
|
2045
|
+
id: `${id}-li-1`
|
|
2046
|
+
},
|
|
2047
|
+
opt.label
|
|
2048
|
+
)) : /* @__PURE__ */ React17.createElement("li", { className: "px-3 py-2 text-sm text-gray-400 dark:text-white", id: `${id}-li-2` }, "No results found")))
|
|
2049
|
+
);
|
|
2050
|
+
};
|
|
2051
|
+
|
|
1680
2052
|
// src/inputs/Dropdown.jsx
|
|
1681
|
-
import
|
|
2053
|
+
import React18, { useId, useMemo as useMemo3 } from "react";
|
|
1682
2054
|
import ReactSelect from "react-select";
|
|
1683
2055
|
var isDarkMode = () => typeof document !== "undefined" && document.documentElement.classList.contains("dark");
|
|
1684
2056
|
function buildStyles(isDark, error) {
|
|
@@ -1759,7 +2131,7 @@ function buildStyles(isDark, error) {
|
|
|
1759
2131
|
valueContainer: (base) => ({ ...base, padding: "2px 16px" })
|
|
1760
2132
|
};
|
|
1761
2133
|
}
|
|
1762
|
-
var Dropdown =
|
|
2134
|
+
var Dropdown = React18.forwardRef(
|
|
1763
2135
|
({
|
|
1764
2136
|
id = "dropdown",
|
|
1765
2137
|
options,
|
|
@@ -1782,7 +2154,7 @@ var Dropdown = React17.forwardRef(
|
|
|
1782
2154
|
}, ref) => {
|
|
1783
2155
|
const reactId = useId();
|
|
1784
2156
|
const isDark = isDarkMode();
|
|
1785
|
-
const styles =
|
|
2157
|
+
const styles = useMemo3(() => buildStyles(isDark, !!error), [isDark, error]);
|
|
1786
2158
|
const selectedValue = isMulti ? options.filter((o) => (value ?? []).includes(o.value)) : options.find((o) => o.value === value) ?? null;
|
|
1787
2159
|
const handleChange = (selected) => {
|
|
1788
2160
|
if (isMulti) {
|
|
@@ -1791,7 +2163,7 @@ var Dropdown = React17.forwardRef(
|
|
|
1791
2163
|
onChange((selected == null ? void 0 : selected.value) ?? null);
|
|
1792
2164
|
}
|
|
1793
2165
|
};
|
|
1794
|
-
return /* @__PURE__ */
|
|
2166
|
+
return /* @__PURE__ */ React18.createElement("div", { className: `flex flex-col gap-1 w-full ${className ?? ""}`, style, id: `${id}-div-1` }, heading && /* @__PURE__ */ React18.createElement("h3", { className: "text-lg font-semibold", id: `${id}-h3-1` }, heading), label && /* @__PURE__ */ React18.createElement(
|
|
1795
2167
|
"label",
|
|
1796
2168
|
{
|
|
1797
2169
|
htmlFor: reactId,
|
|
@@ -1799,8 +2171,8 @@ var Dropdown = React17.forwardRef(
|
|
|
1799
2171
|
id: `${id}-label-1`
|
|
1800
2172
|
},
|
|
1801
2173
|
label,
|
|
1802
|
-
isRequired && /* @__PURE__ */
|
|
1803
|
-
), /* @__PURE__ */
|
|
2174
|
+
isRequired && /* @__PURE__ */ React18.createElement("span", { className: "text-red-500 ml-0.5", id: `${id}-span-1` }, "*")
|
|
2175
|
+
), /* @__PURE__ */ React18.createElement(
|
|
1804
2176
|
ReactSelect,
|
|
1805
2177
|
{
|
|
1806
2178
|
ref,
|
|
@@ -1825,7 +2197,7 @@ var Dropdown = React17.forwardRef(
|
|
|
1825
2197
|
Dropdown.displayName = "Dropdown";
|
|
1826
2198
|
|
|
1827
2199
|
// src/Calendar/Calendar.tsx
|
|
1828
|
-
import
|
|
2200
|
+
import React19, { useEffect as useEffect5, useState as useState7 } from "react";
|
|
1829
2201
|
import {
|
|
1830
2202
|
DatePicker,
|
|
1831
2203
|
DateTimePicker,
|
|
@@ -1853,9 +2225,9 @@ var Calendar = (props) => {
|
|
|
1853
2225
|
datesProviderSettings.locale = locale;
|
|
1854
2226
|
}
|
|
1855
2227
|
const anchorDate = isRange ? ((_a = props.value) == null ? void 0 : _a[0]) ?? ((_b = props.value) == null ? void 0 : _b[1]) ?? ((_c = props.defaultValue) == null ? void 0 : _c[0]) ?? ((_d = props.defaultValue) == null ? void 0 : _d[1]) ?? void 0 : !isDateTime ? props.value ?? props.defaultValue ?? void 0 : void 0;
|
|
1856
|
-
const [displayDate, setDisplayDate] =
|
|
2228
|
+
const [displayDate, setDisplayDate] = useState7(anchorDate ?? void 0);
|
|
1857
2229
|
const anchorTime = isRange ? ((_f = (_e = props.value) == null ? void 0 : _e[0]) == null ? void 0 : _f.getTime()) ?? ((_h = (_g = props.value) == null ? void 0 : _g[1]) == null ? void 0 : _h.getTime()) : !isDateTime ? (_i = props.value) == null ? void 0 : _i.getTime() : void 0;
|
|
1858
|
-
|
|
2230
|
+
useEffect5(() => {
|
|
1859
2231
|
if (anchorTime !== void 0) {
|
|
1860
2232
|
setDisplayDate(new Date(anchorTime));
|
|
1861
2233
|
}
|
|
@@ -1878,7 +2250,7 @@ var Calendar = (props) => {
|
|
|
1878
2250
|
onDateChange: setDisplayDate,
|
|
1879
2251
|
style: weekendColorStyle
|
|
1880
2252
|
};
|
|
1881
|
-
return /* @__PURE__ */
|
|
2253
|
+
return /* @__PURE__ */ React19.createElement(DatesProvider, { settings: datesProviderSettings }, /* @__PURE__ */ React19.createElement(DatePicker, { ...datePickerProps2 }));
|
|
1882
2254
|
}
|
|
1883
2255
|
if (isDateTime) {
|
|
1884
2256
|
const dateTimePickerProps = {
|
|
@@ -1893,7 +2265,7 @@ var Calendar = (props) => {
|
|
|
1893
2265
|
error,
|
|
1894
2266
|
style: weekendColorStyle
|
|
1895
2267
|
};
|
|
1896
|
-
return /* @__PURE__ */
|
|
2268
|
+
return /* @__PURE__ */ React19.createElement(DatesProvider, { settings: datesProviderSettings }, /* @__PURE__ */ React19.createElement(DateTimePicker, { ...dateTimePickerProps }));
|
|
1897
2269
|
}
|
|
1898
2270
|
const datePickerProps = {
|
|
1899
2271
|
value: props.value,
|
|
@@ -1908,12 +2280,12 @@ var Calendar = (props) => {
|
|
|
1908
2280
|
onDateChange: setDisplayDate,
|
|
1909
2281
|
style: weekendColorStyle
|
|
1910
2282
|
};
|
|
1911
|
-
return /* @__PURE__ */
|
|
2283
|
+
return /* @__PURE__ */ React19.createElement(DatesProvider, { settings: datesProviderSettings }, /* @__PURE__ */ React19.createElement(DatePicker, { ...datePickerProps }));
|
|
1912
2284
|
};
|
|
1913
2285
|
|
|
1914
2286
|
// src/Pagination/Pagination.jsx
|
|
1915
|
-
import
|
|
1916
|
-
import { ChevronLeft, ChevronRight
|
|
2287
|
+
import React20, { useMemo as useMemo4, useState as useState8, useEffect as useEffect6 } from "react";
|
|
2288
|
+
import { ChevronLeft, ChevronRight, ChevronsLeft, ChevronsRight } from "lucide-react";
|
|
1917
2289
|
var Pagination = ({
|
|
1918
2290
|
id = "pagination",
|
|
1919
2291
|
data = [],
|
|
@@ -1937,26 +2309,26 @@ var Pagination = ({
|
|
|
1937
2309
|
componentProps = {},
|
|
1938
2310
|
...restProps
|
|
1939
2311
|
}) => {
|
|
1940
|
-
const [internalCurrentPage, setInternalCurrentPage] =
|
|
1941
|
-
const [internalItemsPerPage, setInternalItemsPerPage] =
|
|
2312
|
+
const [internalCurrentPage, setInternalCurrentPage] = useState8(1);
|
|
2313
|
+
const [internalItemsPerPage, setInternalItemsPerPage] = useState8(itemsPerPage);
|
|
1942
2314
|
const isControlled = controlledCurrentPage !== void 0;
|
|
1943
2315
|
const isItemsPerPageControlled = controlledOnItemsPerPageChange !== void 0;
|
|
1944
2316
|
const currentPage = isControlled ? controlledCurrentPage : internalCurrentPage;
|
|
1945
2317
|
const activeItemsPerPage = isItemsPerPageControlled ? itemsPerPage : internalItemsPerPage;
|
|
1946
2318
|
const totalItems = legacyTotalItems !== void 0 ? legacyTotalItems : data.length;
|
|
1947
|
-
const calculatedTotalPages =
|
|
2319
|
+
const calculatedTotalPages = useMemo4(() => {
|
|
1948
2320
|
if (totalItems > 0 && activeItemsPerPage > 0) {
|
|
1949
2321
|
return Math.ceil(totalItems / activeItemsPerPage);
|
|
1950
2322
|
}
|
|
1951
2323
|
return 1;
|
|
1952
2324
|
}, [totalItems, activeItemsPerPage]);
|
|
1953
|
-
const paginatedData =
|
|
2325
|
+
const paginatedData = useMemo4(() => {
|
|
1954
2326
|
if (!data || data.length === 0) return [];
|
|
1955
2327
|
const startIndex = (currentPage - 1) * activeItemsPerPage;
|
|
1956
2328
|
const endIndex = startIndex + activeItemsPerPage;
|
|
1957
2329
|
return data.slice(startIndex, endIndex);
|
|
1958
2330
|
}, [data, currentPage, activeItemsPerPage]);
|
|
1959
|
-
|
|
2331
|
+
useEffect6(() => {
|
|
1960
2332
|
if (!isControlled && currentPage > calculatedTotalPages && calculatedTotalPages > 0) {
|
|
1961
2333
|
setInternalCurrentPage(1);
|
|
1962
2334
|
}
|
|
@@ -1989,11 +2361,11 @@ var Pagination = ({
|
|
|
1989
2361
|
const endItem = totalItems !== void 0 ? Math.min(currentPage * activeItemsPerPage, totalItems) : null;
|
|
1990
2362
|
const renderContent = () => {
|
|
1991
2363
|
if (Component) {
|
|
1992
|
-
if (
|
|
2364
|
+
if (React20.isValidElement(Component)) {
|
|
1993
2365
|
const ComponentType = Component.type;
|
|
1994
2366
|
const elementProps = Component.props;
|
|
1995
2367
|
if (isTable) {
|
|
1996
|
-
return /* @__PURE__ */
|
|
2368
|
+
return /* @__PURE__ */ React20.createElement(
|
|
1997
2369
|
CustomTable,
|
|
1998
2370
|
{
|
|
1999
2371
|
tableHeader,
|
|
@@ -2001,7 +2373,7 @@ var Pagination = ({
|
|
|
2001
2373
|
id: `${id}-custom-table-1`
|
|
2002
2374
|
},
|
|
2003
2375
|
data.map((item, index) => {
|
|
2004
|
-
return /* @__PURE__ */
|
|
2376
|
+
return /* @__PURE__ */ React20.createElement(
|
|
2005
2377
|
ComponentType,
|
|
2006
2378
|
{
|
|
2007
2379
|
key: item.id || item._id || index,
|
|
@@ -2016,7 +2388,7 @@ var Pagination = ({
|
|
|
2016
2388
|
);
|
|
2017
2389
|
} else {
|
|
2018
2390
|
if (isTable) {
|
|
2019
|
-
return /* @__PURE__ */
|
|
2391
|
+
return /* @__PURE__ */ React20.createElement(
|
|
2020
2392
|
CustomTable,
|
|
2021
2393
|
{
|
|
2022
2394
|
tableHeader,
|
|
@@ -2024,7 +2396,7 @@ var Pagination = ({
|
|
|
2024
2396
|
id: `${id}-custom-table-2`
|
|
2025
2397
|
},
|
|
2026
2398
|
paginatedData.map((item, index) => {
|
|
2027
|
-
return /* @__PURE__ */
|
|
2399
|
+
return /* @__PURE__ */ React20.createElement(
|
|
2028
2400
|
ComponentType,
|
|
2029
2401
|
{
|
|
2030
2402
|
key: item.id || item._id || index,
|
|
@@ -2040,7 +2412,7 @@ var Pagination = ({
|
|
|
2040
2412
|
}
|
|
2041
2413
|
}
|
|
2042
2414
|
} else {
|
|
2043
|
-
return /* @__PURE__ */
|
|
2415
|
+
return /* @__PURE__ */ React20.createElement(
|
|
2044
2416
|
CustomTable,
|
|
2045
2417
|
{
|
|
2046
2418
|
tableHeader,
|
|
@@ -2048,7 +2420,7 @@ var Pagination = ({
|
|
|
2048
2420
|
id: `${id}-custom-table-3`
|
|
2049
2421
|
},
|
|
2050
2422
|
paginatedData.map((item, index) => {
|
|
2051
|
-
return /* @__PURE__ */
|
|
2423
|
+
return /* @__PURE__ */ React20.createElement(
|
|
2052
2424
|
Component,
|
|
2053
2425
|
{
|
|
2054
2426
|
key: item.id || item._id || index,
|
|
@@ -2064,7 +2436,7 @@ var Pagination = ({
|
|
|
2064
2436
|
}
|
|
2065
2437
|
return null;
|
|
2066
2438
|
};
|
|
2067
|
-
return /* @__PURE__ */
|
|
2439
|
+
return /* @__PURE__ */ React20.createElement(React20.Fragment, null, /* @__PURE__ */ React20.createElement(React20.Fragment, null, renderContent()), /* @__PURE__ */ React20.createElement("div", { className: "flex flex-col sm:flex-row justify-between items-center gap-4 px-4 py-3 border-t border-[#e5e5e5] dark:border-[#303036] bg-white dark:bg-[#18181b] z-10", id: `${id}-div-1` }, totalItems !== void 0 && /* @__PURE__ */ React20.createElement("div", { className: "text-sm text-[#737373] dark:text-white", id: `${id}-div-2` }, "Showing ", startItem, " to ", endItem, " of ", totalItems, " entries"), /* @__PURE__ */ React20.createElement("div", { className: "flex items-center gap-2", id: `${id}-div-3` }, /* @__PURE__ */ React20.createElement(
|
|
2068
2440
|
"button",
|
|
2069
2441
|
{
|
|
2070
2442
|
onClick: () => handlePageChange(1),
|
|
@@ -2073,8 +2445,8 @@ var Pagination = ({
|
|
|
2073
2445
|
title: "First page",
|
|
2074
2446
|
id: `${id}-button-1`
|
|
2075
2447
|
},
|
|
2076
|
-
/* @__PURE__ */
|
|
2077
|
-
), /* @__PURE__ */
|
|
2448
|
+
/* @__PURE__ */ React20.createElement(ChevronsLeft, { size: 16 })
|
|
2449
|
+
), /* @__PURE__ */ React20.createElement(
|
|
2078
2450
|
"button",
|
|
2079
2451
|
{
|
|
2080
2452
|
onClick: () => handlePageChange(currentPage - 1),
|
|
@@ -2083,8 +2455,8 @@ var Pagination = ({
|
|
|
2083
2455
|
title: "Previous page",
|
|
2084
2456
|
id: `${id}-button-2`
|
|
2085
2457
|
},
|
|
2086
|
-
/* @__PURE__ */
|
|
2087
|
-
), getPageNumbers().map((pageNum) => /* @__PURE__ */
|
|
2458
|
+
/* @__PURE__ */ React20.createElement(ChevronLeft, { size: 16 })
|
|
2459
|
+
), getPageNumbers().map((pageNum) => /* @__PURE__ */ React20.createElement(
|
|
2088
2460
|
"button",
|
|
2089
2461
|
{
|
|
2090
2462
|
key: pageNum,
|
|
@@ -2093,7 +2465,7 @@ var Pagination = ({
|
|
|
2093
2465
|
id: `${id}-button-3`
|
|
2094
2466
|
},
|
|
2095
2467
|
pageNum
|
|
2096
|
-
)), /* @__PURE__ */
|
|
2468
|
+
)), /* @__PURE__ */ React20.createElement(
|
|
2097
2469
|
"button",
|
|
2098
2470
|
{
|
|
2099
2471
|
onClick: () => handlePageChange(currentPage + 1),
|
|
@@ -2102,8 +2474,8 @@ var Pagination = ({
|
|
|
2102
2474
|
title: "Next page",
|
|
2103
2475
|
id: `${id}-button-4`
|
|
2104
2476
|
},
|
|
2105
|
-
/* @__PURE__ */
|
|
2106
|
-
), /* @__PURE__ */
|
|
2477
|
+
/* @__PURE__ */ React20.createElement(ChevronRight, { size: 16 })
|
|
2478
|
+
), /* @__PURE__ */ React20.createElement(
|
|
2107
2479
|
"button",
|
|
2108
2480
|
{
|
|
2109
2481
|
onClick: () => handlePageChange(calculatedTotalPages),
|
|
@@ -2112,7 +2484,7 @@ var Pagination = ({
|
|
|
2112
2484
|
title: "Last page",
|
|
2113
2485
|
id: `${id}-button-5`
|
|
2114
2486
|
},
|
|
2115
|
-
/* @__PURE__ */
|
|
2487
|
+
/* @__PURE__ */ React20.createElement(ChevronsRight, { size: 16 })
|
|
2116
2488
|
))));
|
|
2117
2489
|
};
|
|
2118
2490
|
export {
|