@splpi/estore-shared-components 0.0.1 → 0.0.2
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 +1 -0
- package/dist/index.d.mts +9 -4
- package/dist/index.d.ts +9 -4
- package/dist/index.js +473 -272
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +464 -252
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -39,6 +39,7 @@ __export(index_exports, {
|
|
|
39
39
|
LifePlanApplication3: () => LifePlanApplication3_default,
|
|
40
40
|
LifePlanApplicationFormWrapper: () => LifePlanApplicationFormWrapper_default,
|
|
41
41
|
LifePlanApplicationStepWrapper: () => LifePlanApplicationStepWrapper_default,
|
|
42
|
+
NotifyInstall: () => NotifyInstall,
|
|
42
43
|
SharedLifePlanApplication: () => SharedLifePlanApplication_default,
|
|
43
44
|
UserProfile: () => UserProfile_default,
|
|
44
45
|
createEmptyApplicationData: () => createEmptyApplicationData,
|
|
@@ -3148,7 +3149,7 @@ var LifePlanApplicationStepWrapper = () => {
|
|
|
3148
3149
|
};
|
|
3149
3150
|
var LifePlanApplicationStepWrapper_default = LifePlanApplicationStepWrapper;
|
|
3150
3151
|
|
|
3151
|
-
// src/
|
|
3152
|
+
// src/Generic/BottomQuickActions.tsx
|
|
3152
3153
|
var import_react29 = __toESM(require("react"));
|
|
3153
3154
|
var import_react30 = require("@chakra-ui/react");
|
|
3154
3155
|
var import_lu6 = require("react-icons/lu");
|
|
@@ -3182,7 +3183,7 @@ var BRAND_COLORS = {
|
|
|
3182
3183
|
paleGold: "#FFF48E"
|
|
3183
3184
|
};
|
|
3184
3185
|
|
|
3185
|
-
// src/
|
|
3186
|
+
// src/Generic/BottomQuickActions.tsx
|
|
3186
3187
|
var import_jsx_runtime18 = require("react/jsx-runtime");
|
|
3187
3188
|
var SHEET_BG = BRAND_COLORS.white;
|
|
3188
3189
|
var DRAG_COLOR = BRAND_COLORS.neutralBorder;
|
|
@@ -3465,9 +3466,208 @@ var BottomQuickActions = ({
|
|
|
3465
3466
|
};
|
|
3466
3467
|
var BottomQuickActions_default = BottomQuickActions;
|
|
3467
3468
|
|
|
3468
|
-
// src/
|
|
3469
|
+
// src/Generic/NotifyInstall.tsx
|
|
3470
|
+
var import_react32 = require("react");
|
|
3471
|
+
var import_react33 = require("@chakra-ui/react");
|
|
3472
|
+
var import_fi = require("react-icons/fi");
|
|
3473
|
+
|
|
3474
|
+
// src/hooks/useNotifyInstall.ts
|
|
3469
3475
|
var import_react31 = require("react");
|
|
3470
|
-
|
|
3476
|
+
function useNotifyInstall() {
|
|
3477
|
+
const [isInstalled, setIsInstalled] = (0, import_react31.useState)(false);
|
|
3478
|
+
const [isMobile, setIsMobile] = (0, import_react31.useState)(false);
|
|
3479
|
+
const [installPrompt, setInstallPrompt] = (0, import_react31.useState)(null);
|
|
3480
|
+
(0, import_react31.useEffect)(() => {
|
|
3481
|
+
const mobile = /Android|iPhone|iPad|iPod/i.test(navigator.userAgent);
|
|
3482
|
+
setIsMobile(mobile);
|
|
3483
|
+
const installed = window.matchMedia("(display-mode: standalone)").matches || window.navigator.standalone === true;
|
|
3484
|
+
setIsInstalled(installed);
|
|
3485
|
+
const handler = (event) => {
|
|
3486
|
+
event.preventDefault();
|
|
3487
|
+
setInstallPrompt(event);
|
|
3488
|
+
};
|
|
3489
|
+
window.addEventListener("beforeinstallprompt", handler);
|
|
3490
|
+
return () => {
|
|
3491
|
+
window.removeEventListener("beforeinstallprompt", handler);
|
|
3492
|
+
};
|
|
3493
|
+
}, []);
|
|
3494
|
+
const install = async () => {
|
|
3495
|
+
if (!installPrompt) return;
|
|
3496
|
+
installPrompt.prompt();
|
|
3497
|
+
const result = await installPrompt.userChoice;
|
|
3498
|
+
if (result.outcome === "accepted") {
|
|
3499
|
+
setIsInstalled(true);
|
|
3500
|
+
}
|
|
3501
|
+
setInstallPrompt(null);
|
|
3502
|
+
};
|
|
3503
|
+
return {
|
|
3504
|
+
isInstalled,
|
|
3505
|
+
isMobile,
|
|
3506
|
+
canInstall: !!installPrompt,
|
|
3507
|
+
install
|
|
3508
|
+
};
|
|
3509
|
+
}
|
|
3510
|
+
|
|
3511
|
+
// src/Generic/NotifyInstall.tsx
|
|
3512
|
+
var import_jsx_runtime19 = require("react/jsx-runtime");
|
|
3513
|
+
var STEPS = [
|
|
3514
|
+
{
|
|
3515
|
+
icon: import_fi.FiShare,
|
|
3516
|
+
label: "Tap the browser menu or Share button"
|
|
3517
|
+
},
|
|
3518
|
+
{
|
|
3519
|
+
icon: import_fi.FiPlusSquare,
|
|
3520
|
+
label: 'Choose "Add to Home Screen"'
|
|
3521
|
+
}
|
|
3522
|
+
];
|
|
3523
|
+
var INSTALL_DIALOG_DISMISSED_KEY = "estore-install-dialog-dismissed";
|
|
3524
|
+
function NotifyInstall({
|
|
3525
|
+
children
|
|
3526
|
+
}) {
|
|
3527
|
+
const { isInstalled, isMobile, canInstall, install } = useNotifyInstall();
|
|
3528
|
+
const [isDismissed, setIsDismissed] = (0, import_react32.useState)(false);
|
|
3529
|
+
(0, import_react32.useEffect)(() => {
|
|
3530
|
+
const wasDismissed = localStorage.getItem(INSTALL_DIALOG_DISMISSED_KEY);
|
|
3531
|
+
setIsDismissed(wasDismissed === "true");
|
|
3532
|
+
}, []);
|
|
3533
|
+
const handleClose = () => {
|
|
3534
|
+
localStorage.setItem(INSTALL_DIALOG_DISMISSED_KEY, "true");
|
|
3535
|
+
setIsDismissed(true);
|
|
3536
|
+
};
|
|
3537
|
+
const isOpen = !isInstalled && isMobile && !isDismissed;
|
|
3538
|
+
if (!isOpen) {
|
|
3539
|
+
return children;
|
|
3540
|
+
}
|
|
3541
|
+
return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_jsx_runtime19.Fragment, { children: [
|
|
3542
|
+
children,
|
|
3543
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
|
3544
|
+
import_react33.Dialog.Root,
|
|
3545
|
+
{
|
|
3546
|
+
open: isOpen,
|
|
3547
|
+
onOpenChange: (details) => {
|
|
3548
|
+
if (!details.open) {
|
|
3549
|
+
handleClose();
|
|
3550
|
+
}
|
|
3551
|
+
},
|
|
3552
|
+
placement: "center",
|
|
3553
|
+
motionPreset: "slide-in-bottom",
|
|
3554
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_react33.Portal, { children: [
|
|
3555
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react33.Dialog.Backdrop, { bg: "blackAlpha.600", backdropFilter: "blur(2px)" }),
|
|
3556
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
|
3557
|
+
import_react33.Dialog.Positioner,
|
|
3558
|
+
{
|
|
3559
|
+
p: { base: 0, sm: 4 },
|
|
3560
|
+
alignItems: { base: "flex-end", sm: "center" },
|
|
3561
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
|
|
3562
|
+
import_react33.Dialog.Content,
|
|
3563
|
+
{
|
|
3564
|
+
w: "xl",
|
|
3565
|
+
maxW: { base: "full", sm: "sm" },
|
|
3566
|
+
borderRadius: { base: "2xl 2xl 0 0", sm: "2xl" },
|
|
3567
|
+
overflow: "hidden",
|
|
3568
|
+
boxShadow: "2xl",
|
|
3569
|
+
m: 0,
|
|
3570
|
+
children: [
|
|
3571
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react33.Dialog.Body, { px: { base: 6, sm: 8 }, py: { base: 8, sm: 10 }, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_react33.VStack, { gap: 6, textAlign: "center", children: [
|
|
3572
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
|
3573
|
+
import_react33.Flex,
|
|
3574
|
+
{
|
|
3575
|
+
boxSize: { base: 16, sm: 20 },
|
|
3576
|
+
align: "center",
|
|
3577
|
+
justify: "center",
|
|
3578
|
+
rounded: "2xl",
|
|
3579
|
+
bg: "green.50",
|
|
3580
|
+
color: "green.600",
|
|
3581
|
+
shadow: "sm",
|
|
3582
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react33.Icon, { as: import_fi.FiDownload, boxSize: { base: 8, sm: 9 } })
|
|
3583
|
+
}
|
|
3584
|
+
),
|
|
3585
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_react33.VStack, { gap: 2, children: [
|
|
3586
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
|
3587
|
+
import_react33.Heading,
|
|
3588
|
+
{
|
|
3589
|
+
fontSize: { base: "lg", sm: "xl" },
|
|
3590
|
+
fontWeight: "bold",
|
|
3591
|
+
color: "gray.900",
|
|
3592
|
+
children: "Install St. Peter eStore"
|
|
3593
|
+
}
|
|
3594
|
+
),
|
|
3595
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
|
3596
|
+
import_react33.Text,
|
|
3597
|
+
{
|
|
3598
|
+
fontSize: { base: "sm", sm: "md" },
|
|
3599
|
+
color: "gray.600",
|
|
3600
|
+
lineHeight: "tall",
|
|
3601
|
+
children: "Add the app to your home screen for a faster, app-like experience before continuing."
|
|
3602
|
+
}
|
|
3603
|
+
)
|
|
3604
|
+
] }),
|
|
3605
|
+
canInstall ? /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
|
|
3606
|
+
import_react33.Button,
|
|
3607
|
+
{
|
|
3608
|
+
onClick: install,
|
|
3609
|
+
colorPalette: "green",
|
|
3610
|
+
size: "lg",
|
|
3611
|
+
w: "full",
|
|
3612
|
+
rounded: "xl",
|
|
3613
|
+
children: [
|
|
3614
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react33.Icon, { as: import_fi.FiDownload }),
|
|
3615
|
+
"Add to Home Screen"
|
|
3616
|
+
]
|
|
3617
|
+
}
|
|
3618
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
|
3619
|
+
import_react33.Box,
|
|
3620
|
+
{
|
|
3621
|
+
w: "full",
|
|
3622
|
+
bg: "gray.50",
|
|
3623
|
+
borderWidth: "1px",
|
|
3624
|
+
borderColor: "gray.100",
|
|
3625
|
+
rounded: "xl",
|
|
3626
|
+
p: 4,
|
|
3627
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react33.VStack, { gap: 4, align: "stretch", children: STEPS.map((step, index) => /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_react33.HStack, { gap: 3, align: "center", children: [
|
|
3628
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
|
3629
|
+
import_react33.Flex,
|
|
3630
|
+
{
|
|
3631
|
+
boxSize: 9,
|
|
3632
|
+
flexShrink: 0,
|
|
3633
|
+
align: "center",
|
|
3634
|
+
justify: "center",
|
|
3635
|
+
rounded: "lg",
|
|
3636
|
+
bg: "white",
|
|
3637
|
+
borderWidth: "1px",
|
|
3638
|
+
borderColor: "gray.200",
|
|
3639
|
+
color: "green.600",
|
|
3640
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react33.Icon, { as: step.icon, boxSize: 4 })
|
|
3641
|
+
}
|
|
3642
|
+
),
|
|
3643
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
|
3644
|
+
import_react33.Text,
|
|
3645
|
+
{
|
|
3646
|
+
fontSize: "sm",
|
|
3647
|
+
color: "gray.700",
|
|
3648
|
+
textAlign: "left",
|
|
3649
|
+
children: step.label
|
|
3650
|
+
}
|
|
3651
|
+
)
|
|
3652
|
+
] }, index)) })
|
|
3653
|
+
}
|
|
3654
|
+
)
|
|
3655
|
+
] }) }),
|
|
3656
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react33.Dialog.CloseTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react33.CloseButton, { size: "sm", onClick: handleClose }) })
|
|
3657
|
+
]
|
|
3658
|
+
}
|
|
3659
|
+
)
|
|
3660
|
+
}
|
|
3661
|
+
)
|
|
3662
|
+
] })
|
|
3663
|
+
}
|
|
3664
|
+
)
|
|
3665
|
+
] });
|
|
3666
|
+
}
|
|
3667
|
+
|
|
3668
|
+
// src/UserProfile/UserProfile.tsx
|
|
3669
|
+
var import_react34 = require("react");
|
|
3670
|
+
var import_react35 = require("@chakra-ui/react");
|
|
3471
3671
|
var import_ri = require("react-icons/ri");
|
|
3472
3672
|
var import_lu7 = require("react-icons/lu");
|
|
3473
3673
|
var import_hi2 = require("react-icons/hi2");
|
|
@@ -3476,7 +3676,7 @@ var import_lia = require("react-icons/lia");
|
|
|
3476
3676
|
var import_fa5 = require("react-icons/fa");
|
|
3477
3677
|
var import_md = require("react-icons/md");
|
|
3478
3678
|
var import_io5 = require("react-icons/io5");
|
|
3479
|
-
var
|
|
3679
|
+
var import_jsx_runtime20 = require("react/jsx-runtime");
|
|
3480
3680
|
var NAVBAR_STORAGE_KEY = "profile-navbar-quick-items";
|
|
3481
3681
|
var FONT_SIZE_STORAGE_KEY = "profile-font-size-pref";
|
|
3482
3682
|
var DEFAULT_NAV_HREFS = ["/", "/plans", "/pay-my-plan", "/claims"];
|
|
@@ -3774,28 +3974,28 @@ function ReusableProfile({
|
|
|
3774
3974
|
onTwoFactorChange,
|
|
3775
3975
|
onToast = noopToast
|
|
3776
3976
|
}) {
|
|
3777
|
-
const [profileView, setProfileView] = (0,
|
|
3778
|
-
const [fallbackColorMode, setFallbackColorMode] = (0,
|
|
3977
|
+
const [profileView, setProfileView] = (0, import_react34.useState)("main");
|
|
3978
|
+
const [fallbackColorMode, setFallbackColorMode] = (0, import_react34.useState)("light");
|
|
3779
3979
|
const colorMode = controlledColorMode ?? fallbackColorMode;
|
|
3780
|
-
const [fontSize, setFontSizeLocal] = (0,
|
|
3781
|
-
const [quickNavHrefs, setQuickNavHrefs] = (0,
|
|
3782
|
-
const [replacingIdx, setReplacingIdx] = (0,
|
|
3783
|
-
const [editName, setEditName] = (0,
|
|
3784
|
-
const [editLoading, setEditLoading] = (0,
|
|
3785
|
-
const [currentPw, setCurrentPw] = (0,
|
|
3786
|
-
const [newPw, setNewPw] = (0,
|
|
3787
|
-
const [confirmPw, setConfirmPw] = (0,
|
|
3788
|
-
const [showCurrentPw, setShowCurrentPw] = (0,
|
|
3789
|
-
const [showNewPw, setShowNewPw] = (0,
|
|
3790
|
-
const [showConfirmPw, setShowConfirmPw] = (0,
|
|
3791
|
-
const [pwLoading, setPwLoading] = (0,
|
|
3792
|
-
const [twoFactorEnabled, setTwoFactorEnabled] = (0,
|
|
3980
|
+
const [fontSize, setFontSizeLocal] = (0, import_react34.useState)("md");
|
|
3981
|
+
const [quickNavHrefs, setQuickNavHrefs] = (0, import_react34.useState)(initialQuickNavHrefs);
|
|
3982
|
+
const [replacingIdx, setReplacingIdx] = (0, import_react34.useState)(null);
|
|
3983
|
+
const [editName, setEditName] = (0, import_react34.useState)(user.displayName);
|
|
3984
|
+
const [editLoading, setEditLoading] = (0, import_react34.useState)(false);
|
|
3985
|
+
const [currentPw, setCurrentPw] = (0, import_react34.useState)("");
|
|
3986
|
+
const [newPw, setNewPw] = (0, import_react34.useState)("");
|
|
3987
|
+
const [confirmPw, setConfirmPw] = (0, import_react34.useState)("");
|
|
3988
|
+
const [showCurrentPw, setShowCurrentPw] = (0, import_react34.useState)(false);
|
|
3989
|
+
const [showNewPw, setShowNewPw] = (0, import_react34.useState)(false);
|
|
3990
|
+
const [showConfirmPw, setShowConfirmPw] = (0, import_react34.useState)(false);
|
|
3991
|
+
const [pwLoading, setPwLoading] = (0, import_react34.useState)(false);
|
|
3992
|
+
const [twoFactorEnabled, setTwoFactorEnabled] = (0, import_react34.useState)(
|
|
3793
3993
|
initialTwoFactorEnabled
|
|
3794
3994
|
);
|
|
3795
|
-
const [isMounted, setIsMounted] = (0,
|
|
3796
|
-
const isDesktopRaw = (0,
|
|
3995
|
+
const [isMounted, setIsMounted] = (0, import_react34.useState)(false);
|
|
3996
|
+
const isDesktopRaw = (0, import_react35.useBreakpointValue)({ base: false, md: true });
|
|
3797
3997
|
const isDesktop = isMounted ? isDesktopRaw ?? false : false;
|
|
3798
|
-
(0,
|
|
3998
|
+
(0, import_react34.useEffect)(() => {
|
|
3799
3999
|
setIsMounted(true);
|
|
3800
4000
|
if (!enableLocalStorage || typeof window === "undefined") return;
|
|
3801
4001
|
setFontSizeLocal(localStorage.getItem(FONT_SIZE_STORAGE_KEY) ?? "md");
|
|
@@ -3806,10 +4006,10 @@ function ReusableProfile({
|
|
|
3806
4006
|
setQuickNavHrefs(initialQuickNavHrefs);
|
|
3807
4007
|
}
|
|
3808
4008
|
}, [enableLocalStorage, initialQuickNavHrefs, storageKey]);
|
|
3809
|
-
(0,
|
|
4009
|
+
(0, import_react34.useEffect)(() => {
|
|
3810
4010
|
setEditName(user.displayName);
|
|
3811
4011
|
}, [user.displayName]);
|
|
3812
|
-
const availableOptions = (0,
|
|
4012
|
+
const availableOptions = (0, import_react34.useMemo)(
|
|
3813
4013
|
() => availableNavOptions.filter(
|
|
3814
4014
|
(option) => !user.role || option.roles.includes(user.role)
|
|
3815
4015
|
),
|
|
@@ -3937,9 +4137,9 @@ function ReusableProfile({
|
|
|
3937
4137
|
}
|
|
3938
4138
|
};
|
|
3939
4139
|
const roleLabel = user.role ? ROLE_LABELS[user.role] ?? user.role : "";
|
|
3940
|
-
const mainContent = /* @__PURE__ */ (0,
|
|
3941
|
-
/* @__PURE__ */ (0,
|
|
3942
|
-
|
|
4140
|
+
const mainContent = /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_jsx_runtime20.Fragment, { children: [
|
|
4141
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
|
|
4142
|
+
import_react35.Box,
|
|
3943
4143
|
{
|
|
3944
4144
|
bg: "var(--chakra-colors-primary)",
|
|
3945
4145
|
pt: 12,
|
|
@@ -3947,21 +4147,21 @@ function ReusableProfile({
|
|
|
3947
4147
|
px: 4,
|
|
3948
4148
|
textAlign: "center",
|
|
3949
4149
|
children: [
|
|
3950
|
-
/* @__PURE__ */ (0,
|
|
3951
|
-
|
|
4150
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
|
|
4151
|
+
import_react35.Avatar.Root,
|
|
3952
4152
|
{
|
|
3953
4153
|
size: "2xl",
|
|
3954
4154
|
mx: "auto",
|
|
3955
4155
|
mb: 4,
|
|
3956
4156
|
colorPalette: pickPalette(user.displayName || "U"),
|
|
3957
4157
|
children: [
|
|
3958
|
-
user.avatarSrc && /* @__PURE__ */ (0,
|
|
3959
|
-
/* @__PURE__ */ (0,
|
|
4158
|
+
user.avatarSrc && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Avatar.Image, { src: user.avatarSrc, alt: user.displayName }),
|
|
4159
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Avatar.Fallback, { name: user.displayName })
|
|
3960
4160
|
]
|
|
3961
4161
|
}
|
|
3962
4162
|
),
|
|
3963
|
-
/* @__PURE__ */ (0,
|
|
3964
|
-
|
|
4163
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4164
|
+
import_react35.Text,
|
|
3965
4165
|
{
|
|
3966
4166
|
color: "white",
|
|
3967
4167
|
fontWeight: "bold",
|
|
@@ -3971,9 +4171,9 @@ function ReusableProfile({
|
|
|
3971
4171
|
children: user.displayName
|
|
3972
4172
|
}
|
|
3973
4173
|
),
|
|
3974
|
-
user.email && /* @__PURE__ */ (0,
|
|
3975
|
-
roleLabel && /* @__PURE__ */ (0,
|
|
3976
|
-
|
|
4174
|
+
user.email && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Text, { color: "rgba(255,255,255,0.75)", fontSize: "sm", mb: 2, children: user.email }),
|
|
4175
|
+
roleLabel && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Box, { display: "inline-flex", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4176
|
+
import_react35.Badge,
|
|
3977
4177
|
{
|
|
3978
4178
|
bg: "rgba(255,255,255,0.15)",
|
|
3979
4179
|
color: "white",
|
|
@@ -3989,9 +4189,9 @@ function ReusableProfile({
|
|
|
3989
4189
|
]
|
|
3990
4190
|
}
|
|
3991
4191
|
),
|
|
3992
|
-
/* @__PURE__ */ (0,
|
|
3993
|
-
/* @__PURE__ */ (0,
|
|
3994
|
-
|
|
4192
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Box, { px: 4, pt: 5, pb: 1, children: [
|
|
4193
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4194
|
+
import_react35.Text,
|
|
3995
4195
|
{
|
|
3996
4196
|
fontSize: "xs",
|
|
3997
4197
|
fontWeight: "bold",
|
|
@@ -4002,8 +4202,8 @@ function ReusableProfile({
|
|
|
4002
4202
|
children: "Account"
|
|
4003
4203
|
}
|
|
4004
4204
|
),
|
|
4005
|
-
/* @__PURE__ */ (0,
|
|
4006
|
-
|
|
4205
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4206
|
+
import_react35.Box,
|
|
4007
4207
|
{
|
|
4008
4208
|
as: "button",
|
|
4009
4209
|
w: "full",
|
|
@@ -4011,8 +4211,8 @@ function ReusableProfile({
|
|
|
4011
4211
|
_hover: { opacity: 0.7 },
|
|
4012
4212
|
transition: "opacity 0.15s",
|
|
4013
4213
|
onClick: () => setProfileView("edit-account"),
|
|
4014
|
-
children: /* @__PURE__ */ (0,
|
|
4015
|
-
|
|
4214
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
|
|
4215
|
+
import_react35.Flex,
|
|
4016
4216
|
{
|
|
4017
4217
|
justify: "space-between",
|
|
4018
4218
|
align: "center",
|
|
@@ -4021,9 +4221,9 @@ function ReusableProfile({
|
|
|
4021
4221
|
borderRadius: "lg",
|
|
4022
4222
|
bg: isDesktop && profileView === "edit-account" ? "gray.100" : void 0,
|
|
4023
4223
|
children: [
|
|
4024
|
-
/* @__PURE__ */ (0,
|
|
4025
|
-
/* @__PURE__ */ (0,
|
|
4026
|
-
|
|
4224
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Flex, { align: "center", gap: 3, children: [
|
|
4225
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4226
|
+
import_react35.Box,
|
|
4027
4227
|
{
|
|
4028
4228
|
w: "38px",
|
|
4029
4229
|
h: "38px",
|
|
@@ -4034,23 +4234,23 @@ function ReusableProfile({
|
|
|
4034
4234
|
justifyContent: "center",
|
|
4035
4235
|
color: "gray.600",
|
|
4036
4236
|
flexShrink: 0,
|
|
4037
|
-
children: /* @__PURE__ */ (0,
|
|
4237
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lu7.LuUser, { size: 16 })
|
|
4038
4238
|
}
|
|
4039
4239
|
),
|
|
4040
|
-
/* @__PURE__ */ (0,
|
|
4041
|
-
/* @__PURE__ */ (0,
|
|
4042
|
-
/* @__PURE__ */ (0,
|
|
4240
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Box, { children: [
|
|
4241
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Text, { fontSize: "sm", fontWeight: "semibold", children: "Edit Account" }),
|
|
4242
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Text, { fontSize: "xs", color: "gray.500", children: "Update your display name and contact details" })
|
|
4043
4243
|
] })
|
|
4044
4244
|
] }),
|
|
4045
|
-
/* @__PURE__ */ (0,
|
|
4245
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lu7.LuChevronRight, { size: 16, color: "var(--chakra-colors-gray-400)" })
|
|
4046
4246
|
]
|
|
4047
4247
|
}
|
|
4048
4248
|
)
|
|
4049
4249
|
}
|
|
4050
4250
|
),
|
|
4051
|
-
/* @__PURE__ */ (0,
|
|
4052
|
-
/* @__PURE__ */ (0,
|
|
4053
|
-
|
|
4251
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Separator, {}),
|
|
4252
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4253
|
+
import_react35.Box,
|
|
4054
4254
|
{
|
|
4055
4255
|
as: "button",
|
|
4056
4256
|
w: "full",
|
|
@@ -4061,8 +4261,8 @@ function ReusableProfile({
|
|
|
4061
4261
|
resetPasswordForm();
|
|
4062
4262
|
setProfileView("change-password");
|
|
4063
4263
|
},
|
|
4064
|
-
children: /* @__PURE__ */ (0,
|
|
4065
|
-
|
|
4264
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
|
|
4265
|
+
import_react35.Flex,
|
|
4066
4266
|
{
|
|
4067
4267
|
justify: "space-between",
|
|
4068
4268
|
align: "center",
|
|
@@ -4071,9 +4271,9 @@ function ReusableProfile({
|
|
|
4071
4271
|
borderRadius: "lg",
|
|
4072
4272
|
bg: isDesktop && profileView === "change-password" ? "gray.100" : void 0,
|
|
4073
4273
|
children: [
|
|
4074
|
-
/* @__PURE__ */ (0,
|
|
4075
|
-
/* @__PURE__ */ (0,
|
|
4076
|
-
|
|
4274
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Flex, { align: "center", gap: 3, children: [
|
|
4275
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4276
|
+
import_react35.Box,
|
|
4077
4277
|
{
|
|
4078
4278
|
w: "38px",
|
|
4079
4279
|
h: "38px",
|
|
@@ -4084,25 +4284,25 @@ function ReusableProfile({
|
|
|
4084
4284
|
justifyContent: "center",
|
|
4085
4285
|
color: "gray.600",
|
|
4086
4286
|
flexShrink: 0,
|
|
4087
|
-
children: /* @__PURE__ */ (0,
|
|
4287
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lu7.LuLock, { size: 16 })
|
|
4088
4288
|
}
|
|
4089
4289
|
),
|
|
4090
|
-
/* @__PURE__ */ (0,
|
|
4091
|
-
/* @__PURE__ */ (0,
|
|
4092
|
-
/* @__PURE__ */ (0,
|
|
4290
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Box, { children: [
|
|
4291
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Text, { fontSize: "sm", fontWeight: "semibold", children: "Change Password" }),
|
|
4292
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Text, { fontSize: "xs", color: "gray.500", children: "Test locally through the callback prop" })
|
|
4093
4293
|
] })
|
|
4094
4294
|
] }),
|
|
4095
|
-
/* @__PURE__ */ (0,
|
|
4295
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lu7.LuChevronRight, { size: 16, color: "var(--chakra-colors-gray-400)" })
|
|
4096
4296
|
]
|
|
4097
4297
|
}
|
|
4098
4298
|
)
|
|
4099
4299
|
}
|
|
4100
4300
|
),
|
|
4101
|
-
/* @__PURE__ */ (0,
|
|
4102
|
-
/* @__PURE__ */ (0,
|
|
4103
|
-
/* @__PURE__ */ (0,
|
|
4104
|
-
/* @__PURE__ */ (0,
|
|
4105
|
-
|
|
4301
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Separator, {}),
|
|
4302
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Flex, { justify: "space-between", align: "center", py: 3, children: [
|
|
4303
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Flex, { align: "center", gap: 3, children: [
|
|
4304
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4305
|
+
import_react35.Box,
|
|
4106
4306
|
{
|
|
4107
4307
|
w: "38px",
|
|
4108
4308
|
h: "38px",
|
|
@@ -4113,16 +4313,16 @@ function ReusableProfile({
|
|
|
4113
4313
|
justifyContent: "center",
|
|
4114
4314
|
color: "gray.600",
|
|
4115
4315
|
flexShrink: 0,
|
|
4116
|
-
children: /* @__PURE__ */ (0,
|
|
4316
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lu7.LuShield, { size: 16 })
|
|
4117
4317
|
}
|
|
4118
4318
|
),
|
|
4119
|
-
/* @__PURE__ */ (0,
|
|
4120
|
-
/* @__PURE__ */ (0,
|
|
4121
|
-
/* @__PURE__ */ (0,
|
|
4319
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Box, { children: [
|
|
4320
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Text, { fontSize: "sm", fontWeight: "semibold", children: "Two Factor Authentication" }),
|
|
4321
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Text, { fontSize: "xs", color: "gray.500", children: twoFactorEnabled ? "Enabled" : "Disabled" })
|
|
4122
4322
|
] })
|
|
4123
4323
|
] }),
|
|
4124
|
-
/* @__PURE__ */ (0,
|
|
4125
|
-
|
|
4324
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4325
|
+
import_react35.Box,
|
|
4126
4326
|
{
|
|
4127
4327
|
role: "switch",
|
|
4128
4328
|
"aria-checked": twoFactorEnabled,
|
|
@@ -4144,8 +4344,8 @@ function ReusableProfile({
|
|
|
4144
4344
|
cursor: "pointer",
|
|
4145
4345
|
flexShrink: 0,
|
|
4146
4346
|
outline: "none",
|
|
4147
|
-
children: /* @__PURE__ */ (0,
|
|
4148
|
-
|
|
4347
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4348
|
+
import_react35.Box,
|
|
4149
4349
|
{
|
|
4150
4350
|
position: "absolute",
|
|
4151
4351
|
top: "3px",
|
|
@@ -4162,9 +4362,9 @@ function ReusableProfile({
|
|
|
4162
4362
|
)
|
|
4163
4363
|
] })
|
|
4164
4364
|
] }),
|
|
4165
|
-
/* @__PURE__ */ (0,
|
|
4166
|
-
/* @__PURE__ */ (0,
|
|
4167
|
-
|
|
4365
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Box, { px: 4, pt: 4, pb: 2, children: [
|
|
4366
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4367
|
+
import_react35.Text,
|
|
4168
4368
|
{
|
|
4169
4369
|
fontSize: "xs",
|
|
4170
4370
|
fontWeight: "bold",
|
|
@@ -4175,10 +4375,10 @@ function ReusableProfile({
|
|
|
4175
4375
|
children: "Preferences"
|
|
4176
4376
|
}
|
|
4177
4377
|
),
|
|
4178
|
-
/* @__PURE__ */ (0,
|
|
4179
|
-
/* @__PURE__ */ (0,
|
|
4180
|
-
/* @__PURE__ */ (0,
|
|
4181
|
-
|
|
4378
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Flex, { justify: "space-between", align: "center", py: 3, children: [
|
|
4379
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Flex, { align: "center", gap: 3, children: [
|
|
4380
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4381
|
+
import_react35.Box,
|
|
4182
4382
|
{
|
|
4183
4383
|
w: "38px",
|
|
4184
4384
|
h: "38px",
|
|
@@ -4189,18 +4389,18 @@ function ReusableProfile({
|
|
|
4189
4389
|
justifyContent: "center",
|
|
4190
4390
|
color: "gray.600",
|
|
4191
4391
|
flexShrink: 0,
|
|
4192
|
-
children: colorMode === "dark" ? /* @__PURE__ */ (0,
|
|
4392
|
+
children: colorMode === "dark" ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lu7.LuMoon, { size: 16 }) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lu7.LuSun, { size: 16 })
|
|
4193
4393
|
}
|
|
4194
4394
|
),
|
|
4195
|
-
/* @__PURE__ */ (0,
|
|
4196
|
-
/* @__PURE__ */ (0,
|
|
4197
|
-
/* @__PURE__ */ (0,
|
|
4395
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Box, { children: [
|
|
4396
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Text, { fontSize: "sm", fontWeight: "semibold", children: "Appearance" }),
|
|
4397
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Text, { fontSize: "xs", color: "gray.500", children: colorMode === "light" ? "Light mode" : "Dark mode" })
|
|
4198
4398
|
] })
|
|
4199
4399
|
] }),
|
|
4200
|
-
/* @__PURE__ */ (0,
|
|
4400
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.HStack, { gap: 1.5, children: ["light", "dark"].map((mode) => {
|
|
4201
4401
|
const isActive = colorMode === mode;
|
|
4202
|
-
return /* @__PURE__ */ (0,
|
|
4203
|
-
|
|
4402
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
|
|
4403
|
+
import_react35.Button,
|
|
4204
4404
|
{
|
|
4205
4405
|
size: "sm",
|
|
4206
4406
|
variant: "outline",
|
|
@@ -4215,9 +4415,9 @@ function ReusableProfile({
|
|
|
4215
4415
|
},
|
|
4216
4416
|
onClick: () => handleColorMode(mode),
|
|
4217
4417
|
children: [
|
|
4218
|
-
mode === "light" ? /* @__PURE__ */ (0,
|
|
4219
|
-
/* @__PURE__ */ (0,
|
|
4220
|
-
|
|
4418
|
+
mode === "light" ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lu7.LuSun, { size: 13 }) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lu7.LuMoon, { size: 13 }),
|
|
4419
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4420
|
+
import_react35.Text,
|
|
4221
4421
|
{
|
|
4222
4422
|
fontSize: "xs",
|
|
4223
4423
|
textTransform: "capitalize",
|
|
@@ -4231,11 +4431,11 @@ function ReusableProfile({
|
|
|
4231
4431
|
);
|
|
4232
4432
|
}) })
|
|
4233
4433
|
] }),
|
|
4234
|
-
/* @__PURE__ */ (0,
|
|
4235
|
-
/* @__PURE__ */ (0,
|
|
4236
|
-
/* @__PURE__ */ (0,
|
|
4237
|
-
/* @__PURE__ */ (0,
|
|
4238
|
-
|
|
4434
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Separator, {}),
|
|
4435
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Flex, { justify: "space-between", align: "center", py: 3, children: [
|
|
4436
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Flex, { align: "center", gap: 3, children: [
|
|
4437
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4438
|
+
import_react35.Box,
|
|
4239
4439
|
{
|
|
4240
4440
|
w: "38px",
|
|
4241
4441
|
h: "38px",
|
|
@@ -4251,15 +4451,15 @@ function ReusableProfile({
|
|
|
4251
4451
|
children: "A"
|
|
4252
4452
|
}
|
|
4253
4453
|
),
|
|
4254
|
-
/* @__PURE__ */ (0,
|
|
4255
|
-
/* @__PURE__ */ (0,
|
|
4256
|
-
/* @__PURE__ */ (0,
|
|
4454
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Box, { children: [
|
|
4455
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Text, { fontSize: "sm", fontWeight: "semibold", children: "Text Size" }),
|
|
4456
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Text, { fontSize: "xs", color: "gray.500", children: fontSizeLabel })
|
|
4257
4457
|
] })
|
|
4258
4458
|
] }),
|
|
4259
|
-
/* @__PURE__ */ (0,
|
|
4459
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.HStack, { gap: 1, children: FONT_SIZES.map((option) => {
|
|
4260
4460
|
const isActive = fontSize === option.value;
|
|
4261
|
-
return /* @__PURE__ */ (0,
|
|
4262
|
-
|
|
4461
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4462
|
+
import_react35.Button,
|
|
4263
4463
|
{
|
|
4264
4464
|
size: "sm",
|
|
4265
4465
|
variant: "outline",
|
|
@@ -4274,8 +4474,8 @@ function ReusableProfile({
|
|
|
4274
4474
|
},
|
|
4275
4475
|
onClick: () => handleFontSize(option.value),
|
|
4276
4476
|
title: option.title,
|
|
4277
|
-
children: /* @__PURE__ */ (0,
|
|
4278
|
-
|
|
4477
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4478
|
+
import_react35.Text,
|
|
4279
4479
|
{
|
|
4280
4480
|
fontWeight: isActive ? "bold" : "normal",
|
|
4281
4481
|
style: { fontSize: `${option.scale * 13}px` },
|
|
@@ -4287,9 +4487,9 @@ function ReusableProfile({
|
|
|
4287
4487
|
);
|
|
4288
4488
|
}) })
|
|
4289
4489
|
] }),
|
|
4290
|
-
/* @__PURE__ */ (0,
|
|
4291
|
-
/* @__PURE__ */ (0,
|
|
4292
|
-
|
|
4490
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Separator, {}),
|
|
4491
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4492
|
+
import_react35.Box,
|
|
4293
4493
|
{
|
|
4294
4494
|
as: "button",
|
|
4295
4495
|
w: "full",
|
|
@@ -4297,10 +4497,10 @@ function ReusableProfile({
|
|
|
4297
4497
|
_hover: { opacity: 0.7 },
|
|
4298
4498
|
transition: "opacity 0.15s",
|
|
4299
4499
|
onClick: () => setProfileView("navbar-customize"),
|
|
4300
|
-
children: /* @__PURE__ */ (0,
|
|
4301
|
-
/* @__PURE__ */ (0,
|
|
4302
|
-
/* @__PURE__ */ (0,
|
|
4303
|
-
|
|
4500
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Flex, { justify: "space-between", align: "center", py: 3, children: [
|
|
4501
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Flex, { align: "center", gap: 3, children: [
|
|
4502
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4503
|
+
import_react35.Box,
|
|
4304
4504
|
{
|
|
4305
4505
|
w: "38px",
|
|
4306
4506
|
h: "38px",
|
|
@@ -4311,12 +4511,12 @@ function ReusableProfile({
|
|
|
4311
4511
|
justifyContent: "center",
|
|
4312
4512
|
color: "gray.600",
|
|
4313
4513
|
flexShrink: 0,
|
|
4314
|
-
children: /* @__PURE__ */ (0,
|
|
4514
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lu7.LuArrowLeftRight, { size: 16 })
|
|
4315
4515
|
}
|
|
4316
4516
|
),
|
|
4317
|
-
/* @__PURE__ */ (0,
|
|
4318
|
-
/* @__PURE__ */ (0,
|
|
4319
|
-
/* @__PURE__ */ (0,
|
|
4517
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Box, { children: [
|
|
4518
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Text, { fontSize: "sm", fontWeight: "semibold", children: "Quick Navigation" }),
|
|
4519
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Text, { fontSize: "xs", color: "gray.500", children: [
|
|
4320
4520
|
quickNavHrefs.length,
|
|
4321
4521
|
" of ",
|
|
4322
4522
|
maxQuickNavItems,
|
|
@@ -4324,13 +4524,13 @@ function ReusableProfile({
|
|
|
4324
4524
|
] })
|
|
4325
4525
|
] })
|
|
4326
4526
|
] }),
|
|
4327
|
-
/* @__PURE__ */ (0,
|
|
4527
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lu7.LuChevronRight, { size: 16, color: "var(--chakra-colors-gray-400)" })
|
|
4328
4528
|
] })
|
|
4329
4529
|
}
|
|
4330
4530
|
)
|
|
4331
4531
|
] }),
|
|
4332
|
-
/* @__PURE__ */ (0,
|
|
4333
|
-
|
|
4532
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Box, { px: 4, pt: 4, pb: 10, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.VStack, { gap: 2.5, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4533
|
+
import_react35.Button,
|
|
4334
4534
|
{
|
|
4335
4535
|
w: "full",
|
|
4336
4536
|
variant: "outline",
|
|
@@ -4342,30 +4542,30 @@ function ReusableProfile({
|
|
|
4342
4542
|
}
|
|
4343
4543
|
) }) })
|
|
4344
4544
|
] });
|
|
4345
|
-
const editAccountContent = /* @__PURE__ */ (0,
|
|
4346
|
-
/* @__PURE__ */ (0,
|
|
4347
|
-
/* @__PURE__ */ (0,
|
|
4348
|
-
|
|
4545
|
+
const editAccountContent = /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_jsx_runtime20.Fragment, { children: [
|
|
4546
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Box, { px: 4, pt: 4, pb: 3, borderBottomWidth: "1px", borderColor: "gray.200", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Flex, { align: "center", gap: 2, pr: 10, children: [
|
|
4547
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4548
|
+
import_react35.IconButton,
|
|
4349
4549
|
{
|
|
4350
4550
|
size: "sm",
|
|
4351
4551
|
variant: "ghost",
|
|
4352
4552
|
"aria-label": "Back",
|
|
4353
4553
|
color: "gray.600",
|
|
4354
4554
|
onClick: () => setProfileView("main"),
|
|
4355
|
-
children: /* @__PURE__ */ (0,
|
|
4555
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lu7.LuChevronLeft, {})
|
|
4356
4556
|
}
|
|
4357
4557
|
),
|
|
4358
|
-
/* @__PURE__ */ (0,
|
|
4558
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Text, { fontWeight: "bold", fontSize: "md", children: "Edit Account" })
|
|
4359
4559
|
] }) }),
|
|
4360
|
-
/* @__PURE__ */ (0,
|
|
4361
|
-
user.avatarSrc && /* @__PURE__ */ (0,
|
|
4362
|
-
/* @__PURE__ */ (0,
|
|
4560
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Box, { textAlign: "center", pt: 5, pb: 4, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Avatar.Root, { size: "xl", mx: "auto", mb: 1, children: [
|
|
4561
|
+
user.avatarSrc && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Avatar.Image, { src: user.avatarSrc, alt: editName }),
|
|
4562
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Avatar.Fallback, { name: editName })
|
|
4363
4563
|
] }) }),
|
|
4364
|
-
/* @__PURE__ */ (0,
|
|
4365
|
-
/* @__PURE__ */ (0,
|
|
4366
|
-
/* @__PURE__ */ (0,
|
|
4367
|
-
/* @__PURE__ */ (0,
|
|
4368
|
-
|
|
4564
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.VStack, { gap: 4, px: 4, pb: 10, align: "stretch", children: [
|
|
4565
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Box, { w: "full", children: [
|
|
4566
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Text, { fontSize: "xs", fontWeight: "semibold", color: "gray.500", mb: 1.5, children: "Display Name" }),
|
|
4567
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4568
|
+
import_react35.Input,
|
|
4369
4569
|
{
|
|
4370
4570
|
value: editName,
|
|
4371
4571
|
onChange: (event) => setEditName(event.target.value),
|
|
@@ -4374,10 +4574,10 @@ function ReusableProfile({
|
|
|
4374
4574
|
}
|
|
4375
4575
|
)
|
|
4376
4576
|
] }),
|
|
4377
|
-
/* @__PURE__ */ (0,
|
|
4378
|
-
/* @__PURE__ */ (0,
|
|
4379
|
-
/* @__PURE__ */ (0,
|
|
4380
|
-
|
|
4577
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Box, { w: "full", children: [
|
|
4578
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Text, { fontSize: "xs", fontWeight: "semibold", color: "gray.500", mb: 1.5, children: "Email" }),
|
|
4579
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4580
|
+
import_react35.Input,
|
|
4381
4581
|
{
|
|
4382
4582
|
value: user.email ?? "",
|
|
4383
4583
|
readOnly: true,
|
|
@@ -4387,10 +4587,10 @@ function ReusableProfile({
|
|
|
4387
4587
|
}
|
|
4388
4588
|
)
|
|
4389
4589
|
] }),
|
|
4390
|
-
/* @__PURE__ */ (0,
|
|
4391
|
-
/* @__PURE__ */ (0,
|
|
4392
|
-
/* @__PURE__ */ (0,
|
|
4393
|
-
|
|
4590
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Box, { w: "full", children: [
|
|
4591
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Text, { fontSize: "xs", fontWeight: "semibold", color: "gray.500", mb: 1.5, children: "Mobile Number" }),
|
|
4592
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4593
|
+
import_react35.Input,
|
|
4394
4594
|
{
|
|
4395
4595
|
value: user.mobileNumber ?? "",
|
|
4396
4596
|
readOnly: true,
|
|
@@ -4400,8 +4600,8 @@ function ReusableProfile({
|
|
|
4400
4600
|
}
|
|
4401
4601
|
)
|
|
4402
4602
|
] }),
|
|
4403
|
-
/* @__PURE__ */ (0,
|
|
4404
|
-
|
|
4603
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4604
|
+
import_react35.Button,
|
|
4405
4605
|
{
|
|
4406
4606
|
w: "full",
|
|
4407
4607
|
mt: 2,
|
|
@@ -4415,40 +4615,40 @@ function ReusableProfile({
|
|
|
4415
4615
|
)
|
|
4416
4616
|
] })
|
|
4417
4617
|
] });
|
|
4418
|
-
const changePasswordContent = /* @__PURE__ */ (0,
|
|
4419
|
-
/* @__PURE__ */ (0,
|
|
4420
|
-
/* @__PURE__ */ (0,
|
|
4421
|
-
|
|
4618
|
+
const changePasswordContent = /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_jsx_runtime20.Fragment, { children: [
|
|
4619
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Box, { px: 4, pt: 4, pb: 3, borderBottomWidth: "1px", borderColor: "gray.200", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Flex, { align: "center", gap: 2, pr: 10, children: [
|
|
4620
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4621
|
+
import_react35.IconButton,
|
|
4422
4622
|
{
|
|
4423
4623
|
size: "sm",
|
|
4424
4624
|
variant: "ghost",
|
|
4425
4625
|
"aria-label": "Back",
|
|
4426
4626
|
color: "gray.600",
|
|
4427
4627
|
onClick: () => setProfileView("main"),
|
|
4428
|
-
children: /* @__PURE__ */ (0,
|
|
4628
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lu7.LuChevronLeft, {})
|
|
4429
4629
|
}
|
|
4430
4630
|
),
|
|
4431
|
-
/* @__PURE__ */ (0,
|
|
4631
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Text, { fontWeight: "bold", fontSize: "md", children: "Change Password" })
|
|
4432
4632
|
] }) }),
|
|
4433
|
-
/* @__PURE__ */ (0,
|
|
4434
|
-
/* @__PURE__ */ (0,
|
|
4435
|
-
/* @__PURE__ */ (0,
|
|
4436
|
-
/* @__PURE__ */ (0,
|
|
4437
|
-
|
|
4633
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.VStack, { gap: 5, px: 4, pt: 6, pb: 10, children: [
|
|
4634
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Box, { w: "full", children: [
|
|
4635
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Text, { fontSize: "xs", fontWeight: "semibold", color: "gray.500", mb: 1.5, children: "Current Password" }),
|
|
4636
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4637
|
+
import_react35.InputGroup,
|
|
4438
4638
|
{
|
|
4439
|
-
endElement: /* @__PURE__ */ (0,
|
|
4440
|
-
|
|
4639
|
+
endElement: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4640
|
+
import_react35.IconButton,
|
|
4441
4641
|
{
|
|
4442
4642
|
size: "xs",
|
|
4443
4643
|
variant: "ghost",
|
|
4444
4644
|
color: "gray.500",
|
|
4445
4645
|
"aria-label": "Toggle current password visibility",
|
|
4446
4646
|
onClick: () => setShowCurrentPw(!showCurrentPw),
|
|
4447
|
-
children: showCurrentPw ? /* @__PURE__ */ (0,
|
|
4647
|
+
children: showCurrentPw ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lu7.LuEyeOff, { size: 15 }) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lu7.LuEye, { size: 15 })
|
|
4448
4648
|
}
|
|
4449
4649
|
),
|
|
4450
|
-
children: /* @__PURE__ */ (0,
|
|
4451
|
-
|
|
4650
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4651
|
+
import_react35.Input,
|
|
4452
4652
|
{
|
|
4453
4653
|
type: showCurrentPw ? "text" : "password",
|
|
4454
4654
|
value: currentPw,
|
|
@@ -4460,24 +4660,24 @@ function ReusableProfile({
|
|
|
4460
4660
|
}
|
|
4461
4661
|
)
|
|
4462
4662
|
] }),
|
|
4463
|
-
/* @__PURE__ */ (0,
|
|
4464
|
-
/* @__PURE__ */ (0,
|
|
4465
|
-
/* @__PURE__ */ (0,
|
|
4466
|
-
|
|
4663
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Box, { w: "full", children: [
|
|
4664
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Text, { fontSize: "xs", fontWeight: "semibold", color: "gray.500", mb: 1.5, children: "New Password" }),
|
|
4665
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4666
|
+
import_react35.InputGroup,
|
|
4467
4667
|
{
|
|
4468
|
-
endElement: /* @__PURE__ */ (0,
|
|
4469
|
-
|
|
4668
|
+
endElement: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4669
|
+
import_react35.IconButton,
|
|
4470
4670
|
{
|
|
4471
4671
|
size: "xs",
|
|
4472
4672
|
variant: "ghost",
|
|
4473
4673
|
color: "gray.500",
|
|
4474
4674
|
"aria-label": "Toggle new password visibility",
|
|
4475
4675
|
onClick: () => setShowNewPw(!showNewPw),
|
|
4476
|
-
children: showNewPw ? /* @__PURE__ */ (0,
|
|
4676
|
+
children: showNewPw ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lu7.LuEyeOff, { size: 15 }) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lu7.LuEye, { size: 15 })
|
|
4477
4677
|
}
|
|
4478
4678
|
),
|
|
4479
|
-
children: /* @__PURE__ */ (0,
|
|
4480
|
-
|
|
4679
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4680
|
+
import_react35.Input,
|
|
4481
4681
|
{
|
|
4482
4682
|
type: showNewPw ? "text" : "password",
|
|
4483
4683
|
value: newPw,
|
|
@@ -4488,9 +4688,9 @@ function ReusableProfile({
|
|
|
4488
4688
|
)
|
|
4489
4689
|
}
|
|
4490
4690
|
),
|
|
4491
|
-
newPw && /* @__PURE__ */ (0,
|
|
4492
|
-
/* @__PURE__ */ (0,
|
|
4493
|
-
|
|
4691
|
+
newPw && /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Box, { mt: 2, children: [
|
|
4692
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Flex, { gap: 1, mb: 1, children: [1, 2, 3, 4, 5].map((i) => /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4693
|
+
import_react35.Box,
|
|
4494
4694
|
{
|
|
4495
4695
|
flex: 1,
|
|
4496
4696
|
h: "3px",
|
|
@@ -4500,27 +4700,27 @@ function ReusableProfile({
|
|
|
4500
4700
|
},
|
|
4501
4701
|
i
|
|
4502
4702
|
)) }),
|
|
4503
|
-
/* @__PURE__ */ (0,
|
|
4703
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Text, { fontSize: "xs", color: pwMeta.color, fontWeight: "medium", children: pwMeta.label })
|
|
4504
4704
|
] })
|
|
4505
4705
|
] }),
|
|
4506
|
-
/* @__PURE__ */ (0,
|
|
4507
|
-
/* @__PURE__ */ (0,
|
|
4508
|
-
/* @__PURE__ */ (0,
|
|
4509
|
-
|
|
4706
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Box, { w: "full", children: [
|
|
4707
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Text, { fontSize: "xs", fontWeight: "semibold", color: "gray.500", mb: 1.5, children: "Confirm New Password" }),
|
|
4708
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4709
|
+
import_react35.InputGroup,
|
|
4510
4710
|
{
|
|
4511
|
-
endElement: /* @__PURE__ */ (0,
|
|
4512
|
-
|
|
4711
|
+
endElement: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4712
|
+
import_react35.IconButton,
|
|
4513
4713
|
{
|
|
4514
4714
|
size: "xs",
|
|
4515
4715
|
variant: "ghost",
|
|
4516
4716
|
color: "gray.500",
|
|
4517
4717
|
"aria-label": "Toggle confirm password visibility",
|
|
4518
4718
|
onClick: () => setShowConfirmPw(!showConfirmPw),
|
|
4519
|
-
children: showConfirmPw ? /* @__PURE__ */ (0,
|
|
4719
|
+
children: showConfirmPw ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lu7.LuEyeOff, { size: 15 }) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lu7.LuEye, { size: 15 })
|
|
4520
4720
|
}
|
|
4521
4721
|
),
|
|
4522
|
-
children: /* @__PURE__ */ (0,
|
|
4523
|
-
|
|
4722
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4723
|
+
import_react35.Input,
|
|
4524
4724
|
{
|
|
4525
4725
|
type: showConfirmPw ? "text" : "password",
|
|
4526
4726
|
value: confirmPw,
|
|
@@ -4531,10 +4731,10 @@ function ReusableProfile({
|
|
|
4531
4731
|
)
|
|
4532
4732
|
}
|
|
4533
4733
|
),
|
|
4534
|
-
confirmPw && confirmPw !== newPw && /* @__PURE__ */ (0,
|
|
4734
|
+
confirmPw && confirmPw !== newPw && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Text, { fontSize: "xs", color: "red.500", mt: 1, children: "Passwords do not match" })
|
|
4535
4735
|
] }),
|
|
4536
|
-
/* @__PURE__ */ (0,
|
|
4537
|
-
|
|
4736
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4737
|
+
import_react35.Button,
|
|
4538
4738
|
{
|
|
4539
4739
|
w: "full",
|
|
4540
4740
|
mt: 1,
|
|
@@ -4549,9 +4749,9 @@ function ReusableProfile({
|
|
|
4549
4749
|
)
|
|
4550
4750
|
] })
|
|
4551
4751
|
] });
|
|
4552
|
-
const navbarCustomizeContent = /* @__PURE__ */ (0,
|
|
4553
|
-
/* @__PURE__ */ (0,
|
|
4554
|
-
|
|
4752
|
+
const navbarCustomizeContent = /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_jsx_runtime20.Fragment, { children: [
|
|
4753
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4754
|
+
import_react35.Box,
|
|
4555
4755
|
{
|
|
4556
4756
|
px: 4,
|
|
4557
4757
|
pt: 4,
|
|
@@ -4562,9 +4762,9 @@ function ReusableProfile({
|
|
|
4562
4762
|
top: 0,
|
|
4563
4763
|
bg: "bg",
|
|
4564
4764
|
zIndex: 1,
|
|
4565
|
-
children: /* @__PURE__ */ (0,
|
|
4566
|
-
/* @__PURE__ */ (0,
|
|
4567
|
-
|
|
4765
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Flex, { align: "center", gap: 2, pr: 10, children: [
|
|
4766
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4767
|
+
import_react35.IconButton,
|
|
4568
4768
|
{
|
|
4569
4769
|
size: "sm",
|
|
4570
4770
|
variant: "ghost",
|
|
@@ -4574,12 +4774,12 @@ function ReusableProfile({
|
|
|
4574
4774
|
setReplacingIdx(null);
|
|
4575
4775
|
setProfileView("main");
|
|
4576
4776
|
},
|
|
4577
|
-
children: /* @__PURE__ */ (0,
|
|
4777
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lu7.LuChevronLeft, {})
|
|
4578
4778
|
}
|
|
4579
4779
|
),
|
|
4580
|
-
/* @__PURE__ */ (0,
|
|
4581
|
-
/* @__PURE__ */ (0,
|
|
4582
|
-
/* @__PURE__ */ (0,
|
|
4780
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Box, { children: [
|
|
4781
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Text, { fontWeight: "bold", fontSize: "md", children: "Quick Navigation" }),
|
|
4782
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Text, { fontSize: "xs", color: "gray.500", children: [
|
|
4583
4783
|
"Choose up to ",
|
|
4584
4784
|
maxQuickNavItems,
|
|
4585
4785
|
" shortcuts for the bottom bar"
|
|
@@ -4588,10 +4788,10 @@ function ReusableProfile({
|
|
|
4588
4788
|
] })
|
|
4589
4789
|
}
|
|
4590
4790
|
),
|
|
4591
|
-
/* @__PURE__ */ (0,
|
|
4592
|
-
/* @__PURE__ */ (0,
|
|
4593
|
-
/* @__PURE__ */ (0,
|
|
4594
|
-
|
|
4791
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Box, { px: 4, pt: 5, pb: 2, children: [
|
|
4792
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Flex, { align: "center", justify: "space-between", mb: 3, children: [
|
|
4793
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4794
|
+
import_react35.Text,
|
|
4595
4795
|
{
|
|
4596
4796
|
fontSize: "xs",
|
|
4597
4797
|
fontWeight: "bold",
|
|
@@ -4601,8 +4801,8 @@ function ReusableProfile({
|
|
|
4601
4801
|
children: "Pinned"
|
|
4602
4802
|
}
|
|
4603
4803
|
),
|
|
4604
|
-
/* @__PURE__ */ (0,
|
|
4605
|
-
|
|
4804
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
|
|
4805
|
+
import_react35.Text,
|
|
4606
4806
|
{
|
|
4607
4807
|
fontSize: "xs",
|
|
4608
4808
|
color: quickNavHrefs.length >= maxQuickNavItems ? "orange.500" : "gray.400",
|
|
@@ -4615,8 +4815,8 @@ function ReusableProfile({
|
|
|
4615
4815
|
}
|
|
4616
4816
|
)
|
|
4617
4817
|
] }),
|
|
4618
|
-
quickNavHrefs.length === 0 ? /* @__PURE__ */ (0,
|
|
4619
|
-
|
|
4818
|
+
quickNavHrefs.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4819
|
+
import_react35.Flex,
|
|
4620
4820
|
{
|
|
4621
4821
|
align: "center",
|
|
4622
4822
|
justify: "center",
|
|
@@ -4625,18 +4825,18 @@ function ReusableProfile({
|
|
|
4625
4825
|
borderWidth: "1px",
|
|
4626
4826
|
borderStyle: "dashed",
|
|
4627
4827
|
borderColor: "gray.200",
|
|
4628
|
-
children: /* @__PURE__ */ (0,
|
|
4828
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Text, { fontSize: "sm", color: "gray.400", children: "No items pinned \u2014 add from below" })
|
|
4629
4829
|
}
|
|
4630
|
-
) : /* @__PURE__ */ (0,
|
|
4830
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.VStack, { gap: 0, children: quickNavHrefs.map((href, idx) => {
|
|
4631
4831
|
const option = availableOptions.find((item) => item.key === href);
|
|
4632
4832
|
if (!option) return null;
|
|
4633
4833
|
const ItemIcon = option.Icon;
|
|
4634
4834
|
const isFirst = idx === 0;
|
|
4635
4835
|
const isLast = idx === quickNavHrefs.length - 1;
|
|
4636
4836
|
const isReplacing = replacingIdx === idx;
|
|
4637
|
-
return /* @__PURE__ */ (0,
|
|
4638
|
-
/* @__PURE__ */ (0,
|
|
4639
|
-
|
|
4837
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Box, { w: "full", children: [
|
|
4838
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
|
|
4839
|
+
import_react35.Flex,
|
|
4640
4840
|
{
|
|
4641
4841
|
justify: "space-between",
|
|
4642
4842
|
align: "center",
|
|
@@ -4648,9 +4848,9 @@ function ReusableProfile({
|
|
|
4648
4848
|
borderColor: isReplacing ? "orange.200" : void 0,
|
|
4649
4849
|
transition: "all 0.15s",
|
|
4650
4850
|
children: [
|
|
4651
|
-
/* @__PURE__ */ (0,
|
|
4652
|
-
/* @__PURE__ */ (0,
|
|
4653
|
-
|
|
4851
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Flex, { align: "center", gap: 3, children: [
|
|
4852
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4853
|
+
import_react35.Box,
|
|
4654
4854
|
{
|
|
4655
4855
|
w: "36px",
|
|
4656
4856
|
h: "36px",
|
|
@@ -4661,13 +4861,13 @@ function ReusableProfile({
|
|
|
4661
4861
|
justifyContent: "center",
|
|
4662
4862
|
color: "white",
|
|
4663
4863
|
flexShrink: 0,
|
|
4664
|
-
children: /* @__PURE__ */ (0,
|
|
4864
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(ItemIcon, { size: 15 })
|
|
4665
4865
|
}
|
|
4666
4866
|
),
|
|
4667
|
-
/* @__PURE__ */ (0,
|
|
4668
|
-
/* @__PURE__ */ (0,
|
|
4669
|
-
isReplacing && /* @__PURE__ */ (0,
|
|
4670
|
-
|
|
4867
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Box, { children: [
|
|
4868
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Text, { fontSize: "sm", fontWeight: "medium", children: option.title }),
|
|
4869
|
+
isReplacing && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4870
|
+
import_react35.Text,
|
|
4671
4871
|
{
|
|
4672
4872
|
fontSize: "xs",
|
|
4673
4873
|
color: "orange.500",
|
|
@@ -4677,9 +4877,9 @@ function ReusableProfile({
|
|
|
4677
4877
|
)
|
|
4678
4878
|
] })
|
|
4679
4879
|
] }),
|
|
4680
|
-
/* @__PURE__ */ (0,
|
|
4681
|
-
/* @__PURE__ */ (0,
|
|
4682
|
-
|
|
4880
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.HStack, { gap: 0.5, children: [
|
|
4881
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4882
|
+
import_react35.IconButton,
|
|
4683
4883
|
{
|
|
4684
4884
|
size: "xs",
|
|
4685
4885
|
variant: "ghost",
|
|
@@ -4687,11 +4887,11 @@ function ReusableProfile({
|
|
|
4687
4887
|
color: "gray.500",
|
|
4688
4888
|
disabled: isFirst || isReplacing,
|
|
4689
4889
|
onClick: () => moveNavItem(idx, -1),
|
|
4690
|
-
children: /* @__PURE__ */ (0,
|
|
4890
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lu7.LuChevronUp, { size: 14 })
|
|
4691
4891
|
}
|
|
4692
4892
|
),
|
|
4693
|
-
/* @__PURE__ */ (0,
|
|
4694
|
-
|
|
4893
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4894
|
+
import_react35.IconButton,
|
|
4695
4895
|
{
|
|
4696
4896
|
size: "xs",
|
|
4697
4897
|
variant: "ghost",
|
|
@@ -4699,11 +4899,11 @@ function ReusableProfile({
|
|
|
4699
4899
|
color: "gray.500",
|
|
4700
4900
|
disabled: isLast || isReplacing,
|
|
4701
4901
|
onClick: () => moveNavItem(idx, 1),
|
|
4702
|
-
children: /* @__PURE__ */ (0,
|
|
4902
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lu7.LuChevronDown, { size: 14 })
|
|
4703
4903
|
}
|
|
4704
4904
|
),
|
|
4705
|
-
/* @__PURE__ */ (0,
|
|
4706
|
-
|
|
4905
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4906
|
+
import_react35.IconButton,
|
|
4707
4907
|
{
|
|
4708
4908
|
size: "xs",
|
|
4709
4909
|
variant: isReplacing ? "solid" : "ghost",
|
|
@@ -4712,11 +4912,11 @@ function ReusableProfile({
|
|
|
4712
4912
|
color: isReplacing ? "white" : "gray.500",
|
|
4713
4913
|
_hover: { bg: isReplacing ? "orange.500" : "gray.100" },
|
|
4714
4914
|
onClick: () => setReplacingIdx(isReplacing ? null : idx),
|
|
4715
|
-
children: /* @__PURE__ */ (0,
|
|
4915
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lu7.LuArrowLeftRight, { size: 13 })
|
|
4716
4916
|
}
|
|
4717
4917
|
),
|
|
4718
|
-
/* @__PURE__ */ (0,
|
|
4719
|
-
|
|
4918
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4919
|
+
import_react35.IconButton,
|
|
4720
4920
|
{
|
|
4721
4921
|
size: "xs",
|
|
4722
4922
|
variant: "ghost",
|
|
@@ -4725,23 +4925,23 @@ function ReusableProfile({
|
|
|
4725
4925
|
_hover: { bg: "red.50" },
|
|
4726
4926
|
disabled: isReplacing,
|
|
4727
4927
|
onClick: () => removeNavItem(href),
|
|
4728
|
-
children: /* @__PURE__ */ (0,
|
|
4928
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lu7.LuX, { size: 14 })
|
|
4729
4929
|
}
|
|
4730
4930
|
)
|
|
4731
4931
|
] })
|
|
4732
4932
|
]
|
|
4733
4933
|
}
|
|
4734
4934
|
),
|
|
4735
|
-
!isLast && /* @__PURE__ */ (0,
|
|
4935
|
+
!isLast && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Separator, {})
|
|
4736
4936
|
] }, href);
|
|
4737
4937
|
}) })
|
|
4738
4938
|
] }),
|
|
4739
|
-
/* @__PURE__ */ (0,
|
|
4740
|
-
/* @__PURE__ */ (0,
|
|
4741
|
-
/* @__PURE__ */ (0,
|
|
4742
|
-
replacingIdx !== null ? /* @__PURE__ */ (0,
|
|
4743
|
-
/* @__PURE__ */ (0,
|
|
4744
|
-
|
|
4939
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Separator, { mx: 4, my: 1 }),
|
|
4940
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Box, { px: 4, pt: 4, pb: 10, children: [
|
|
4941
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Flex, { align: "center", justify: "space-between", mb: 3, children: [
|
|
4942
|
+
replacingIdx !== null ? /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Box, { children: [
|
|
4943
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4944
|
+
import_react35.Text,
|
|
4745
4945
|
{
|
|
4746
4946
|
fontSize: "xs",
|
|
4747
4947
|
fontWeight: "bold",
|
|
@@ -4751,15 +4951,15 @@ function ReusableProfile({
|
|
|
4751
4951
|
children: "Select Replacement"
|
|
4752
4952
|
}
|
|
4753
4953
|
),
|
|
4754
|
-
/* @__PURE__ */ (0,
|
|
4954
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Text, { fontSize: "xs", color: "gray.500", mt: 0.5, children: [
|
|
4755
4955
|
'for "',
|
|
4756
4956
|
availableOptions.find(
|
|
4757
4957
|
(item) => item.key === quickNavHrefs[replacingIdx]
|
|
4758
4958
|
)?.title,
|
|
4759
4959
|
'"'
|
|
4760
4960
|
] })
|
|
4761
|
-
] }) : /* @__PURE__ */ (0,
|
|
4762
|
-
|
|
4961
|
+
] }) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4962
|
+
import_react35.Text,
|
|
4763
4963
|
{
|
|
4764
4964
|
fontSize: "xs",
|
|
4765
4965
|
fontWeight: "bold",
|
|
@@ -4769,8 +4969,8 @@ function ReusableProfile({
|
|
|
4769
4969
|
children: "Available"
|
|
4770
4970
|
}
|
|
4771
4971
|
),
|
|
4772
|
-
replacingIdx !== null && /* @__PURE__ */ (0,
|
|
4773
|
-
|
|
4972
|
+
replacingIdx !== null && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4973
|
+
import_react35.Button,
|
|
4774
4974
|
{
|
|
4775
4975
|
size: "xs",
|
|
4776
4976
|
variant: "ghost",
|
|
@@ -4780,17 +4980,17 @@ function ReusableProfile({
|
|
|
4780
4980
|
}
|
|
4781
4981
|
)
|
|
4782
4982
|
] }),
|
|
4783
|
-
unpinnedOptions.length === 0 ? /* @__PURE__ */ (0,
|
|
4983
|
+
unpinnedOptions.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Text, { fontSize: "sm", color: "gray.400", py: 3, textAlign: "center", children: "All available items are pinned" }) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.VStack, { gap: 0, children: unpinnedOptions.map((option, idx) => {
|
|
4784
4984
|
const ItemIcon = option.Icon;
|
|
4785
4985
|
const isLast = idx === unpinnedOptions.length - 1;
|
|
4786
4986
|
const isReplacingMode = replacingIdx !== null;
|
|
4787
4987
|
const canAdd = quickNavHrefs.length < maxQuickNavItems;
|
|
4788
4988
|
const actionEnabled = isReplacingMode || canAdd;
|
|
4789
|
-
return /* @__PURE__ */ (0,
|
|
4790
|
-
/* @__PURE__ */ (0,
|
|
4791
|
-
/* @__PURE__ */ (0,
|
|
4792
|
-
/* @__PURE__ */ (0,
|
|
4793
|
-
|
|
4989
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Box, { w: "full", children: [
|
|
4990
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Flex, { justify: "space-between", align: "center", py: 2.5, children: [
|
|
4991
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react35.Flex, { align: "center", gap: 3, children: [
|
|
4992
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
4993
|
+
import_react35.Box,
|
|
4794
4994
|
{
|
|
4795
4995
|
w: "36px",
|
|
4796
4996
|
h: "36px",
|
|
@@ -4801,11 +5001,11 @@ function ReusableProfile({
|
|
|
4801
5001
|
justifyContent: "center",
|
|
4802
5002
|
color: isReplacingMode ? "orange.500" : "gray.500",
|
|
4803
5003
|
flexShrink: 0,
|
|
4804
|
-
children: /* @__PURE__ */ (0,
|
|
5004
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(ItemIcon, { size: 15 })
|
|
4805
5005
|
}
|
|
4806
5006
|
),
|
|
4807
|
-
/* @__PURE__ */ (0,
|
|
4808
|
-
|
|
5007
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
5008
|
+
import_react35.Text,
|
|
4809
5009
|
{
|
|
4810
5010
|
fontSize: "sm",
|
|
4811
5011
|
fontWeight: "medium",
|
|
@@ -4814,8 +5014,8 @@ function ReusableProfile({
|
|
|
4814
5014
|
}
|
|
4815
5015
|
)
|
|
4816
5016
|
] }),
|
|
4817
|
-
isReplacingMode ? /* @__PURE__ */ (0,
|
|
4818
|
-
|
|
5017
|
+
isReplacingMode ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
5018
|
+
import_react35.IconButton,
|
|
4819
5019
|
{
|
|
4820
5020
|
size: "xs",
|
|
4821
5021
|
variant: "outline",
|
|
@@ -4824,10 +5024,10 @@ function ReusableProfile({
|
|
|
4824
5024
|
color: "orange.500",
|
|
4825
5025
|
_hover: { bg: "orange.50" },
|
|
4826
5026
|
onClick: () => replaceNavItem(replacingIdx, option.key),
|
|
4827
|
-
children: /* @__PURE__ */ (0,
|
|
5027
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lu7.LuArrowLeftRight, { size: 13 })
|
|
4828
5028
|
}
|
|
4829
|
-
) : /* @__PURE__ */ (0,
|
|
4830
|
-
|
|
5029
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
5030
|
+
import_react35.IconButton,
|
|
4831
5031
|
{
|
|
4832
5032
|
size: "xs",
|
|
4833
5033
|
variant: "outline",
|
|
@@ -4837,19 +5037,19 @@ function ReusableProfile({
|
|
|
4837
5037
|
color: canAdd ? "var(--chakra-colors-primary)" : "gray.300",
|
|
4838
5038
|
_hover: { bg: canAdd ? "blue.50" : "transparent" },
|
|
4839
5039
|
onClick: () => addNavItem(option.key),
|
|
4840
|
-
children: /* @__PURE__ */ (0,
|
|
5040
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lu7.LuPlus, { size: 13 })
|
|
4841
5041
|
}
|
|
4842
5042
|
)
|
|
4843
5043
|
] }),
|
|
4844
|
-
!isLast && /* @__PURE__ */ (0,
|
|
5044
|
+
!isLast && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Separator, {})
|
|
4845
5045
|
] }, option.key);
|
|
4846
5046
|
}) })
|
|
4847
5047
|
] })
|
|
4848
5048
|
] });
|
|
4849
5049
|
const subViewContent = profileView === "edit-account" ? editAccountContent : profileView === "change-password" ? changePasswordContent : profileView === "navbar-customize" ? navbarCustomizeContent : null;
|
|
4850
5050
|
if (isDesktop) {
|
|
4851
|
-
return /* @__PURE__ */ (0,
|
|
4852
|
-
|
|
5051
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
|
|
5052
|
+
import_react35.Flex,
|
|
4853
5053
|
{
|
|
4854
5054
|
maxW: "6xl",
|
|
4855
5055
|
mx: "auto",
|
|
@@ -4859,8 +5059,8 @@ function ReusableProfile({
|
|
|
4859
5059
|
p: { md: 6, lg: 8 },
|
|
4860
5060
|
align: "start",
|
|
4861
5061
|
children: [
|
|
4862
|
-
/* @__PURE__ */ (0,
|
|
4863
|
-
|
|
5062
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
5063
|
+
import_react35.Box,
|
|
4864
5064
|
{
|
|
4865
5065
|
w: { md: "300px", lg: "340px" },
|
|
4866
5066
|
flexShrink: 0,
|
|
@@ -4874,8 +5074,8 @@ function ReusableProfile({
|
|
|
4874
5074
|
children: mainContent
|
|
4875
5075
|
}
|
|
4876
5076
|
),
|
|
4877
|
-
/* @__PURE__ */ (0,
|
|
4878
|
-
|
|
5077
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
5078
|
+
import_react35.Box,
|
|
4879
5079
|
{
|
|
4880
5080
|
flex: "1",
|
|
4881
5081
|
minW: 0,
|
|
@@ -4885,8 +5085,8 @@ function ReusableProfile({
|
|
|
4885
5085
|
overflow: "hidden",
|
|
4886
5086
|
bg: "bg",
|
|
4887
5087
|
minH: "540px",
|
|
4888
|
-
children: subViewContent ?? /* @__PURE__ */ (0,
|
|
4889
|
-
|
|
5088
|
+
children: subViewContent ?? /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
|
|
5089
|
+
import_react35.Flex,
|
|
4890
5090
|
{
|
|
4891
5091
|
direction: "column",
|
|
4892
5092
|
align: "center",
|
|
@@ -4896,8 +5096,8 @@ function ReusableProfile({
|
|
|
4896
5096
|
textAlign: "center",
|
|
4897
5097
|
color: "gray.400",
|
|
4898
5098
|
children: [
|
|
4899
|
-
/* @__PURE__ */ (0,
|
|
4900
|
-
|
|
5099
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
5100
|
+
import_react35.Box,
|
|
4901
5101
|
{
|
|
4902
5102
|
w: "56px",
|
|
4903
5103
|
h: "56px",
|
|
@@ -4907,10 +5107,10 @@ function ReusableProfile({
|
|
|
4907
5107
|
alignItems: "center",
|
|
4908
5108
|
justifyContent: "center",
|
|
4909
5109
|
mb: 4,
|
|
4910
|
-
children: /* @__PURE__ */ (0,
|
|
5110
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lu7.LuUser, { size: 24 })
|
|
4911
5111
|
}
|
|
4912
5112
|
),
|
|
4913
|
-
/* @__PURE__ */ (0,
|
|
5113
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Text, { fontSize: "sm", mt: 1, maxW: "280px", children: "Choose Edit Account, Change Password, or Quick Navigation from the menu to update your details here." })
|
|
4914
5114
|
]
|
|
4915
5115
|
}
|
|
4916
5116
|
)
|
|
@@ -4920,7 +5120,7 @@ function ReusableProfile({
|
|
|
4920
5120
|
}
|
|
4921
5121
|
);
|
|
4922
5122
|
}
|
|
4923
|
-
return /* @__PURE__ */ (0,
|
|
5123
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react35.Box, { maxW: "480px", mx: "auto", w: "full", minH: "100%", bg: "bg", children: profileView === "main" ? mainContent : subViewContent });
|
|
4924
5124
|
}
|
|
4925
5125
|
var UserProfile_default = ReusableProfile;
|
|
4926
5126
|
// Annotate the CommonJS export names for ESM import in node:
|
|
@@ -4934,6 +5134,7 @@ var UserProfile_default = ReusableProfile;
|
|
|
4934
5134
|
LifePlanApplication3,
|
|
4935
5135
|
LifePlanApplicationFormWrapper,
|
|
4936
5136
|
LifePlanApplicationStepWrapper,
|
|
5137
|
+
NotifyInstall,
|
|
4937
5138
|
SharedLifePlanApplication,
|
|
4938
5139
|
UserProfile,
|
|
4939
5140
|
createEmptyApplicationData,
|