@splpi/estore-shared-components 0.0.5 → 0.0.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/dist/index.js +299 -104
  2. package/dist/index.js.map +1 -1
  3. package/dist/index.mjs +377 -189
  4. package/dist/index.mjs.map +1 -1
  5. package/package.json +1 -1
package/dist/index.mjs CHANGED
@@ -2983,39 +2983,51 @@ var createLifePlanSteps = (confirmationProps) => [
2983
2983
  ];
2984
2984
 
2985
2985
  // src/NewSaleForm/ui/horizontal-stepper.tsx
2986
- import { useState as useState10 } from "react";
2987
- import {
2988
- Box as Box13,
2989
- ButtonGroup,
2990
- Flex as Flex7,
2991
- IconButton as IconButton2,
2992
- Separator as Separator3,
2993
- Steps
2994
- } from "@chakra-ui/react";
2995
- import { NextButton, PrimaryMdButton as PrimaryMdButton2, SecondaryMdButton as SecondaryMdButton2 } from "st-peter-ui";
2996
- import { LuChevronLeft, LuChevronRight } from "react-icons/lu";
2986
+ import { useRef, useState as useState10 } from "react";
2987
+ import { Box as Box13, ButtonGroup, Flex as Flex7, Steps, Text as Text8 } from "@chakra-ui/react";
2988
+ import { PrimaryMdButton as PrimaryMdButton2, SecondaryMdButton as SecondaryMdButton2 } from "st-peter-ui";
2989
+ import { LuChevronLeft, LuChevronRight, LuCheck as LuCheck2 } from "react-icons/lu";
2997
2990
  import { jsx as jsx15, jsxs as jsxs14 } from "react/jsx-runtime";
2991
+ var PRIMARY = "var(--chakra-colors-primary)";
2992
+ var PRIMARY_HOVER = "var(--chakra-colors-primary-hover)";
2993
+ var PRIMARY_DISABLED = "var(--chakra-colors-primary-disabled)";
2998
2994
  var HorizontalStepper = ({
2999
2995
  steps,
2996
+ title,
2997
+ description,
3000
2998
  onStepChange,
3001
2999
  onSubmit,
3002
3000
  submitDisabled,
3003
3001
  activeStep: controlledActiveStep,
3004
- nextDisabled
3002
+ nextDisabled,
3003
+ submitButtonText = "Proceed To Payment"
3005
3004
  }) => {
3006
3005
  const [localActiveStep, setLocalActiveStep] = useState10(0);
3007
3006
  const activeStep = controlledActiveStep !== void 0 ? controlledActiveStep : localActiveStep;
3007
+ const formTopRef = useRef(null);
3008
+ const isCompact = steps.length < 3;
3009
+ const isLastStep = activeStep === steps.length - 1;
3010
+ const nextStepTitle = steps[activeStep + 1]?.title;
3011
+ const scrollToTop = () => {
3012
+ requestAnimationFrame(() => {
3013
+ formTopRef.current?.scrollIntoView({
3014
+ behavior: "smooth",
3015
+ block: "start"
3016
+ });
3017
+ });
3018
+ };
3008
3019
  const handleStepChange = (index) => {
3009
3020
  if (controlledActiveStep === void 0) {
3010
3021
  setLocalActiveStep(index);
3011
3022
  }
3012
3023
  onStepChange?.(index);
3024
+ scrollToTop();
3013
3025
  };
3014
3026
  const handleNext = () => {
3015
3027
  if (nextDisabled) return;
3016
3028
  handleStepChange(Math.min(activeStep + 1, steps.length - 1));
3017
3029
  };
3018
- return /* @__PURE__ */ jsx15(
3030
+ return /* @__PURE__ */ jsxs14(
3019
3031
  Flex7,
3020
3032
  {
3021
3033
  direction: "column",
@@ -3024,108 +3036,284 @@ var HorizontalStepper = ({
3024
3036
  w: "full",
3025
3037
  overflow: "visible",
3026
3038
  pb: { base: "12px", md: "0px" },
3027
- children: /* @__PURE__ */ jsx15(Box13, { w: "full", colorPalette: "green", rounded: "2xl", p: 1, children: /* @__PURE__ */ jsxs14(
3028
- Steps.Root,
3029
- {
3030
- step: activeStep,
3031
- onStepChange: (index) => {
3032
- handleStepChange(index.step);
3033
- },
3034
- defaultStep: 0,
3035
- count: steps.length,
3036
- colorPalette: "green",
3037
- children: [
3038
- /* @__PURE__ */ jsx15(
3039
- Steps.List,
3040
- {
3041
- flexDirection: "row",
3042
- w: "full",
3043
- py: 2,
3044
- alignItems: "flex-start",
3045
- children: steps.map((step, index) => /* @__PURE__ */ jsxs14(
3046
- Steps.Item,
3047
- {
3048
- index,
3049
- title: step.title,
3050
- minW: { base: "0px", md: "auto" },
3051
- children: [
3052
- /* @__PURE__ */ jsxs14(
3053
- Steps.Trigger,
3054
- {
3055
- flexDirection: "column",
3056
- alignItems: "center",
3057
- gap: 1,
3058
- children: [
3059
- /* @__PURE__ */ jsx15(Steps.Indicator, { children: step.icon ? /* @__PURE__ */ jsx15(Box13, { as: step.icon, w: 4, h: 4 }) : null }),
3060
- /* @__PURE__ */ jsx15(
3061
- Steps.Title,
3062
- {
3063
- fontSize: { base: "xs", md: "sm" },
3064
- textAlign: "center",
3065
- whiteSpace: "normal",
3066
- wordBreak: "break-word",
3067
- children: step.title
3068
- }
3069
- )
3070
- ]
3071
- }
3072
- ),
3073
- /* @__PURE__ */ jsx15(Steps.Separator, { display: { base: "none", md: "block" } })
3074
- ]
3075
- },
3076
- index
3077
- ))
3078
- }
3079
- ),
3080
- /* @__PURE__ */ jsx15(Separator3, { variant: "solid", mb: 3 }),
3081
- steps.map((step, index) => /* @__PURE__ */ jsx15(Steps.Content, { index, children: step.component ?? step.description }, index)),
3082
- /* @__PURE__ */ jsxs14(
3083
- Flex7,
3084
- {
3085
- w: "full",
3086
- justify: "space-between",
3087
- align: "center",
3088
- mb: 1,
3089
- display: { base: "flex", md: "none" },
3090
- children: [
3091
- /* @__PURE__ */ jsx15(Steps.PrevTrigger, { asChild: true, children: /* @__PURE__ */ jsx15(
3092
- IconButton2,
3093
- {
3094
- "aria-label": "Previous step",
3095
- size: "sm",
3096
- variant: "outline",
3097
- children: /* @__PURE__ */ jsx15(LuChevronLeft, {})
3098
- }
3099
- ) }),
3100
- activeStep < steps.length - 1 ? /* @__PURE__ */ jsx15(
3101
- IconButton2,
3102
- {
3103
- "aria-label": "Next step",
3104
- size: "sm",
3105
- variant: "outline",
3106
- disabled: !!nextDisabled,
3107
- onClick: handleNext,
3108
- children: /* @__PURE__ */ jsx15(LuChevronRight, {})
3109
- }
3110
- ) : /* @__PURE__ */ jsx15(PrimaryMdButton2, { disabled: !!submitDisabled, onClick: onSubmit, children: "Proceed To Payment" })
3111
- ]
3112
- }
3113
- ),
3114
- /* @__PURE__ */ jsx15(
3115
- ButtonGroup,
3116
- {
3117
- size: "sm",
3118
- variant: "outline",
3119
- display: { base: "none", md: "flex" },
3120
- children: /* @__PURE__ */ jsxs14(Flex7, { mt: 4, w: "full", align: "center", justify: "space-between", children: [
3121
- /* @__PURE__ */ jsx15(Steps.PrevTrigger, { asChild: true, children: /* @__PURE__ */ jsx15(SecondaryMdButton2, { children: "Previous" }) }),
3122
- activeStep < steps.length - 1 ? /* @__PURE__ */ jsx15(NextButton, { disabled: !!nextDisabled, onClick: handleNext }) : /* @__PURE__ */ jsx15(PrimaryMdButton2, { disabled: !!submitDisabled, onClick: onSubmit, children: "Proceed To Payment" })
3123
- ] })
3124
- }
3125
- )
3126
- ]
3127
- }
3128
- ) })
3039
+ children: [
3040
+ (title || description) && /* @__PURE__ */ jsxs14(Box13, { mb: 4, ref: formTopRef, children: [
3041
+ title && /* @__PURE__ */ jsx15(
3042
+ Box13,
3043
+ {
3044
+ as: "h1",
3045
+ m: "0",
3046
+ fontFamily: "var(--font-dm-sans), system-ui, sans-serif",
3047
+ fontWeight: description ? 600 : 500,
3048
+ color: "gray.900",
3049
+ lineHeight: "1.1",
3050
+ letterSpacing: description ? "-0.025em" : "-0.015em",
3051
+ fontSize: {
3052
+ base: description ? "22px" : "24px",
3053
+ lg: description ? "28px" : "32px"
3054
+ },
3055
+ children: title
3056
+ }
3057
+ ),
3058
+ description && /* @__PURE__ */ jsx15(Text8, { fontSize: "sm", color: "gray.500", mt: 1, children: description })
3059
+ ] }),
3060
+ /* @__PURE__ */ jsx15(Box13, { w: "full", rounded: "2xl", children: /* @__PURE__ */ jsxs14(
3061
+ Steps.Root,
3062
+ {
3063
+ step: activeStep,
3064
+ onStepChange: (index) => handleStepChange(index.step),
3065
+ defaultStep: 0,
3066
+ count: steps.length,
3067
+ colorPalette: "green",
3068
+ children: [
3069
+ /* @__PURE__ */ jsxs14(
3070
+ Box13,
3071
+ {
3072
+ position: "sticky",
3073
+ top: 0,
3074
+ zIndex: 10,
3075
+ bg: "white",
3076
+ pt: 2,
3077
+ pb: 3,
3078
+ mx: -1,
3079
+ px: 1,
3080
+ borderBottomWidth: "1px",
3081
+ borderColor: "gray.100",
3082
+ boxShadow: "0 2px 8px -2px rgba(0,0,0,0.06)",
3083
+ children: [
3084
+ /* @__PURE__ */ jsx15(
3085
+ Steps.List,
3086
+ {
3087
+ py: 0,
3088
+ flexDirection: "row",
3089
+ alignItems: "center",
3090
+ w: "full",
3091
+ justifyContent: "space-evenly",
3092
+ children: steps.map((step, index) => {
3093
+ const isCompleted = index < activeStep;
3094
+ const isActive = index === activeStep;
3095
+ return /* @__PURE__ */ jsxs14(
3096
+ Steps.Item,
3097
+ {
3098
+ index,
3099
+ title: step.title,
3100
+ minW: { base: "0px", md: "auto" },
3101
+ flex: isCompact ? "0 0 auto" : "1",
3102
+ children: [
3103
+ /* @__PURE__ */ jsxs14(
3104
+ Steps.Trigger,
3105
+ {
3106
+ flexDirection: isCompact ? "row" : "column",
3107
+ alignItems: "center",
3108
+ gap: isCompact ? 2 : 1,
3109
+ px: isCompact ? 3 : 2,
3110
+ py: isCompact ? 2 : 1,
3111
+ borderRadius: "lg",
3112
+ transition: "background 0.2s",
3113
+ _hover: { bg: "gray.50" },
3114
+ children: [
3115
+ /* @__PURE__ */ jsx15(
3116
+ Steps.Indicator,
3117
+ {
3118
+ borderWidth: "2px",
3119
+ transition: "all 0.25s",
3120
+ style: {
3121
+ borderColor: isCompleted || isActive ? PRIMARY : void 0,
3122
+ background: isCompleted ? PRIMARY : void 0,
3123
+ color: isCompleted ? "white" : isActive ? PRIMARY : void 0,
3124
+ boxShadow: isActive ? `0 0 0 3px ${PRIMARY_DISABLED}` : "none"
3125
+ },
3126
+ children: isCompleted ? /* @__PURE__ */ jsx15(LuCheck2, { size: 14 }) : step.icon ? /* @__PURE__ */ jsx15(Box13, { as: step.icon, w: 4, h: 4 }) : null
3127
+ }
3128
+ ),
3129
+ /* @__PURE__ */ jsx15(
3130
+ Steps.Title,
3131
+ {
3132
+ fontSize: { base: "xs", md: "sm" },
3133
+ textAlign: isCompact ? "left" : "center",
3134
+ whiteSpace: "normal",
3135
+ wordBreak: "break-word",
3136
+ fontWeight: isActive ? 600 : 400,
3137
+ color: isActive ? "gray.900" : isCompleted ? "gray.600" : "gray.400",
3138
+ transition: "color 0.2s",
3139
+ children: step.title
3140
+ }
3141
+ )
3142
+ ]
3143
+ }
3144
+ ),
3145
+ !isCompact && /* @__PURE__ */ jsx15(
3146
+ Steps.Separator,
3147
+ {
3148
+ display: { base: "none", md: "block" }
3149
+ }
3150
+ )
3151
+ ]
3152
+ },
3153
+ index
3154
+ );
3155
+ })
3156
+ }
3157
+ ),
3158
+ /* @__PURE__ */ jsx15(
3159
+ Box13,
3160
+ {
3161
+ w: "full",
3162
+ h: "3px",
3163
+ bg: "gray.100",
3164
+ borderRadius: "full",
3165
+ overflow: "hidden",
3166
+ mt: 1,
3167
+ children: /* @__PURE__ */ jsx15(
3168
+ Box13,
3169
+ {
3170
+ h: "full",
3171
+ bg: PRIMARY,
3172
+ transition: "width 0.4s ease",
3173
+ w: `${(activeStep + 1) / steps.length * 100}%`
3174
+ }
3175
+ )
3176
+ }
3177
+ )
3178
+ ]
3179
+ }
3180
+ ),
3181
+ steps.map((step, index) => /* @__PURE__ */ jsx15(Steps.Content, { index, children: step.component ?? step.description }, index)),
3182
+ /* @__PURE__ */ jsxs14(
3183
+ Flex7,
3184
+ {
3185
+ w: "full",
3186
+ justify: "space-between",
3187
+ align: "center",
3188
+ mt: 4,
3189
+ gap: 2,
3190
+ display: { base: "flex", md: "none" },
3191
+ children: [
3192
+ /* @__PURE__ */ jsx15(Steps.PrevTrigger, { asChild: true, children: /* @__PURE__ */ jsxs14(
3193
+ Box13,
3194
+ {
3195
+ as: "button",
3196
+ display: "flex",
3197
+ alignItems: "center",
3198
+ gap: 1,
3199
+ px: 3,
3200
+ py: 2,
3201
+ borderRadius: "lg",
3202
+ border: "1.5px solid",
3203
+ borderColor: "gray.200",
3204
+ bg: "white",
3205
+ color: "gray.700",
3206
+ fontSize: "sm",
3207
+ fontWeight: 500,
3208
+ cursor: "pointer",
3209
+ _hover: { bg: "gray.50" },
3210
+ _disabled: { opacity: 0.4, cursor: "not-allowed" },
3211
+ transition: "all 0.15s",
3212
+ children: [
3213
+ /* @__PURE__ */ jsx15(LuChevronLeft, { size: 14 }),
3214
+ "Back"
3215
+ ]
3216
+ }
3217
+ ) }),
3218
+ !isLastStep ? /* @__PURE__ */ jsxs14(
3219
+ Box13,
3220
+ {
3221
+ as: "button",
3222
+ display: "flex",
3223
+ alignItems: "center",
3224
+ gap: 1,
3225
+ px: 3,
3226
+ py: 2,
3227
+ borderRadius: "lg",
3228
+ color: "white",
3229
+ fontSize: "sm",
3230
+ fontWeight: 500,
3231
+ cursor: nextDisabled ? "not-allowed" : "pointer",
3232
+ opacity: nextDisabled ? 0.5 : 1,
3233
+ pointerEvents: nextDisabled ? "none" : "auto",
3234
+ transition: "all 0.15s",
3235
+ onClick: handleNext,
3236
+ bg: PRIMARY,
3237
+ _hover: { bg: PRIMARY_HOVER },
3238
+ children: [
3239
+ nextStepTitle ? `Next: ${nextStepTitle}` : "Next",
3240
+ /* @__PURE__ */ jsx15(LuChevronRight, { size: 14 })
3241
+ ]
3242
+ }
3243
+ ) : /* @__PURE__ */ jsxs14(
3244
+ Box13,
3245
+ {
3246
+ as: "button",
3247
+ display: "flex",
3248
+ alignItems: "center",
3249
+ gap: 1,
3250
+ px: 3,
3251
+ py: 2,
3252
+ borderRadius: "lg",
3253
+ color: "white",
3254
+ fontSize: "sm",
3255
+ fontWeight: 500,
3256
+ cursor: submitDisabled ? "not-allowed" : "pointer",
3257
+ opacity: submitDisabled ? 0.5 : 1,
3258
+ pointerEvents: submitDisabled ? "none" : "auto",
3259
+ transition: "all 0.15s",
3260
+ onClick: onSubmit,
3261
+ bg: PRIMARY,
3262
+ _hover: { bg: PRIMARY_HOVER },
3263
+ children: [
3264
+ submitButtonText,
3265
+ /* @__PURE__ */ jsx15(LuCheck2, { size: 14 })
3266
+ ]
3267
+ }
3268
+ )
3269
+ ]
3270
+ }
3271
+ ),
3272
+ /* @__PURE__ */ jsx15(
3273
+ ButtonGroup,
3274
+ {
3275
+ size: "sm",
3276
+ variant: "outline",
3277
+ display: { base: "none", md: "flex" },
3278
+ children: /* @__PURE__ */ jsxs14(Flex7, { mt: 5, w: "full", align: "center", justify: "space-between", children: [
3279
+ /* @__PURE__ */ jsx15(Steps.PrevTrigger, { asChild: true, children: /* @__PURE__ */ jsxs14(SecondaryMdButton2, { children: [
3280
+ /* @__PURE__ */ jsx15(LuChevronLeft, {}),
3281
+ "Previous"
3282
+ ] }) }),
3283
+ !isLastStep ? /* @__PURE__ */ jsxs14(
3284
+ Box13,
3285
+ {
3286
+ as: "button",
3287
+ display: "flex",
3288
+ alignItems: "center",
3289
+ gap: 1.5,
3290
+ px: 4,
3291
+ py: 2,
3292
+ borderRadius: "lg",
3293
+ color: "white",
3294
+ fontSize: "sm",
3295
+ fontWeight: 600,
3296
+ cursor: nextDisabled ? "not-allowed" : "pointer",
3297
+ opacity: nextDisabled ? 0.5 : 1,
3298
+ pointerEvents: nextDisabled ? "none" : "auto",
3299
+ transition: "all 0.15s",
3300
+ onClick: handleNext,
3301
+ boxShadow: "0 1px 3px 0 rgba(0,0,0,0.12)",
3302
+ bg: PRIMARY,
3303
+ _hover: { bg: PRIMARY_HOVER },
3304
+ children: [
3305
+ nextStepTitle ? `Next: ${nextStepTitle}` : "Next",
3306
+ /* @__PURE__ */ jsx15(LuChevronRight, { size: 15 })
3307
+ ]
3308
+ }
3309
+ ) : /* @__PURE__ */ jsx15(PrimaryMdButton2, { disabled: !!submitDisabled, onClick: onSubmit, children: submitButtonText })
3310
+ ] })
3311
+ }
3312
+ )
3313
+ ]
3314
+ }
3315
+ ) })
3316
+ ]
3129
3317
  }
3130
3318
  );
3131
3319
  };
@@ -3192,7 +3380,7 @@ import {
3192
3380
  Flex as Flex8,
3193
3381
  Icon as Icon4,
3194
3382
  CloseButton as CloseButton3,
3195
- Text as Text8
3383
+ Text as Text9
3196
3384
  } from "@chakra-ui/react";
3197
3385
  import { LuChevronRight as LuChevronRight2 } from "react-icons/lu";
3198
3386
  import Link from "next/link";
@@ -3272,7 +3460,7 @@ var QuickActionsHeaderCard = React5.memo(
3272
3460
  justify: "center",
3273
3461
  flexShrink: 0,
3274
3462
  children: /* @__PURE__ */ jsx18(
3275
- Text8,
3463
+ Text9,
3276
3464
  {
3277
3465
  fontSize: "14px",
3278
3466
  fontWeight: "700",
@@ -3285,7 +3473,7 @@ var QuickActionsHeaderCard = React5.memo(
3285
3473
  ),
3286
3474
  /* @__PURE__ */ jsxs15(Box15, { flex: "1", minW: 0, children: [
3287
3475
  /* @__PURE__ */ jsx18(
3288
- Text8,
3476
+ Text9,
3289
3477
  {
3290
3478
  fontSize: "15px",
3291
3479
  fontWeight: "700",
@@ -3298,7 +3486,7 @@ var QuickActionsHeaderCard = React5.memo(
3298
3486
  }
3299
3487
  ),
3300
3488
  meta && /* @__PURE__ */ jsx18(
3301
- Text8,
3489
+ Text9,
3302
3490
  {
3303
3491
  fontSize: "12px",
3304
3492
  color: SUBTITLE_COLOR,
@@ -3360,7 +3548,7 @@ var ActionItem = React5.memo(({ action }) => {
3360
3548
  ),
3361
3549
  /* @__PURE__ */ jsxs15(Box15, { flex: "1", minW: 0, children: [
3362
3550
  /* @__PURE__ */ jsx18(
3363
- Text8,
3551
+ Text9,
3364
3552
  {
3365
3553
  fontSize: "15px",
3366
3554
  fontWeight: "600",
@@ -3370,7 +3558,7 @@ var ActionItem = React5.memo(({ action }) => {
3370
3558
  }
3371
3559
  ),
3372
3560
  action.description && /* @__PURE__ */ jsx18(
3373
- Text8,
3561
+ Text9,
3374
3562
  {
3375
3563
  fontSize: "12px",
3376
3564
  color: DESC_COLOR,
@@ -3464,7 +3652,7 @@ var BottomQuickActions = ({
3464
3652
  }
3465
3653
  ),
3466
3654
  subtitle && /* @__PURE__ */ jsx18(
3467
- Text8,
3655
+ Text9,
3468
3656
  {
3469
3657
  fontSize: "13px",
3470
3658
  color: SUBTITLE_COLOR,
@@ -3510,7 +3698,7 @@ var BottomQuickActions_default = BottomQuickActions;
3510
3698
 
3511
3699
  // src/Generic/NotifyInstall.tsx
3512
3700
  import { useEffect as useEffect8, useState as useState13 } from "react";
3513
- import { Button as Button3, Flex as Flex9, HStack as HStack5, Icon as Icon5, Text as Text9, VStack as VStack8 } from "@chakra-ui/react";
3701
+ import { Button as Button3, Flex as Flex9, HStack as HStack5, Icon as Icon5, Text as Text10, VStack as VStack8 } from "@chakra-ui/react";
3514
3702
  import { AnimatePresence, motion } from "motion/react";
3515
3703
  import { FiDownload, FiPlusSquare, FiShare, FiX } from "react-icons/fi";
3516
3704
 
@@ -3653,7 +3841,7 @@ function NotifyInstall({
3653
3841
  ),
3654
3842
  /* @__PURE__ */ jsxs16(VStack8, { gap: 2, children: [
3655
3843
  /* @__PURE__ */ jsxs16(
3656
- Text9,
3844
+ Text10,
3657
3845
  {
3658
3846
  fontSize: "lg",
3659
3847
  fontWeight: "bold",
@@ -3665,7 +3853,7 @@ function NotifyInstall({
3665
3853
  ]
3666
3854
  }
3667
3855
  ),
3668
- /* @__PURE__ */ jsx19(Text9, { fontSize: "sm", color: "gray.500", lineHeight: "tall", children: "Add the app to your home screen for a faster, app-like experience before continuing." })
3856
+ /* @__PURE__ */ jsx19(Text10, { fontSize: "sm", color: "gray.500", lineHeight: "tall", children: "Add the app to your home screen for a faster, app-like experience before continuing." })
3669
3857
  ] }),
3670
3858
  canInstall ? /* @__PURE__ */ jsxs16(
3671
3859
  Button3,
@@ -3707,7 +3895,7 @@ function NotifyInstall({
3707
3895
  children: /* @__PURE__ */ jsx19(Icon5, { as: step.icon, boxSize: 4 })
3708
3896
  }
3709
3897
  ),
3710
- /* @__PURE__ */ jsx19(Text9, { fontSize: "sm", color: "gray.700", textAlign: "left", children: step.label })
3898
+ /* @__PURE__ */ jsx19(Text10, { fontSize: "sm", color: "gray.700", textAlign: "left", children: step.label })
3711
3899
  ] }, i))
3712
3900
  }
3713
3901
  )
@@ -3729,11 +3917,11 @@ import {
3729
3917
  Button as Button4,
3730
3918
  Flex as Flex10,
3731
3919
  HStack as HStack6,
3732
- IconButton as IconButton3,
3920
+ IconButton as IconButton2,
3733
3921
  Input as Input4,
3734
3922
  InputGroup,
3735
- Separator as Separator4,
3736
- Text as Text10,
3923
+ Separator as Separator3,
3924
+ Text as Text11,
3737
3925
  useBreakpointValue as useBreakpointValue2,
3738
3926
  VStack as VStack9
3739
3927
  } from "@chakra-ui/react";
@@ -4264,7 +4452,7 @@ function ReusableProfile({
4264
4452
  }
4265
4453
  ),
4266
4454
  /* @__PURE__ */ jsx20(
4267
- Text10,
4455
+ Text11,
4268
4456
  {
4269
4457
  color: "white",
4270
4458
  fontWeight: "bold",
@@ -4274,7 +4462,7 @@ function ReusableProfile({
4274
4462
  children: user.displayName
4275
4463
  }
4276
4464
  ),
4277
- user.email && /* @__PURE__ */ jsx20(Text10, { color: "rgba(255,255,255,0.75)", fontSize: "sm", mb: 2, children: user.email }),
4465
+ user.email && /* @__PURE__ */ jsx20(Text11, { color: "rgba(255,255,255,0.75)", fontSize: "sm", mb: 2, children: user.email }),
4278
4466
  roleLabel && /* @__PURE__ */ jsx20(Box16, { display: "inline-flex", children: /* @__PURE__ */ jsx20(
4279
4467
  Badge2,
4280
4468
  {
@@ -4294,7 +4482,7 @@ function ReusableProfile({
4294
4482
  ),
4295
4483
  /* @__PURE__ */ jsxs17(Box16, { px: 4, pt: 5, pb: 1, children: [
4296
4484
  /* @__PURE__ */ jsx20(
4297
- Text10,
4485
+ Text11,
4298
4486
  {
4299
4487
  fontSize: "xs",
4300
4488
  fontWeight: "bold",
@@ -4341,8 +4529,8 @@ function ReusableProfile({
4341
4529
  }
4342
4530
  ),
4343
4531
  /* @__PURE__ */ jsxs17(Box16, { children: [
4344
- /* @__PURE__ */ jsx20(Text10, { fontSize: "sm", fontWeight: "semibold", children: "Edit Account" }),
4345
- /* @__PURE__ */ jsx20(Text10, { fontSize: "xs", color: "gray.500", children: "Update your display name and contact details" })
4532
+ /* @__PURE__ */ jsx20(Text11, { fontSize: "sm", fontWeight: "semibold", children: "Edit Account" }),
4533
+ /* @__PURE__ */ jsx20(Text11, { fontSize: "xs", color: "gray.500", children: "Update your display name and contact details" })
4346
4534
  ] })
4347
4535
  ] }),
4348
4536
  /* @__PURE__ */ jsx20(LuChevronRight3, { size: 16, color: "var(--chakra-colors-gray-400)" })
@@ -4351,7 +4539,7 @@ function ReusableProfile({
4351
4539
  )
4352
4540
  }
4353
4541
  ),
4354
- /* @__PURE__ */ jsx20(Separator4, {}),
4542
+ /* @__PURE__ */ jsx20(Separator3, {}),
4355
4543
  /* @__PURE__ */ jsx20(
4356
4544
  Box16,
4357
4545
  {
@@ -4391,8 +4579,8 @@ function ReusableProfile({
4391
4579
  }
4392
4580
  ),
4393
4581
  /* @__PURE__ */ jsxs17(Box16, { children: [
4394
- /* @__PURE__ */ jsx20(Text10, { fontSize: "sm", fontWeight: "semibold", children: "Change Password" }),
4395
- /* @__PURE__ */ jsx20(Text10, { fontSize: "xs", color: "gray.500", children: "Test locally through the callback prop" })
4582
+ /* @__PURE__ */ jsx20(Text11, { fontSize: "sm", fontWeight: "semibold", children: "Change Password" }),
4583
+ /* @__PURE__ */ jsx20(Text11, { fontSize: "xs", color: "gray.500", children: "Test locally through the callback prop" })
4396
4584
  ] })
4397
4585
  ] }),
4398
4586
  /* @__PURE__ */ jsx20(LuChevronRight3, { size: 16, color: "var(--chakra-colors-gray-400)" })
@@ -4401,7 +4589,7 @@ function ReusableProfile({
4401
4589
  )
4402
4590
  }
4403
4591
  ),
4404
- /* @__PURE__ */ jsx20(Separator4, {}),
4592
+ /* @__PURE__ */ jsx20(Separator3, {}),
4405
4593
  /* @__PURE__ */ jsxs17(Flex10, { justify: "space-between", align: "center", py: 3, children: [
4406
4594
  /* @__PURE__ */ jsxs17(Flex10, { align: "center", gap: 3, children: [
4407
4595
  /* @__PURE__ */ jsx20(
@@ -4420,8 +4608,8 @@ function ReusableProfile({
4420
4608
  }
4421
4609
  ),
4422
4610
  /* @__PURE__ */ jsxs17(Box16, { children: [
4423
- /* @__PURE__ */ jsx20(Text10, { fontSize: "sm", fontWeight: "semibold", children: "Two Factor Authentication" }),
4424
- /* @__PURE__ */ jsx20(Text10, { fontSize: "xs", color: "gray.500", children: twoFactorEnabled ? "Enabled" : "Disabled" })
4611
+ /* @__PURE__ */ jsx20(Text11, { fontSize: "sm", fontWeight: "semibold", children: "Two Factor Authentication" }),
4612
+ /* @__PURE__ */ jsx20(Text11, { fontSize: "xs", color: "gray.500", children: twoFactorEnabled ? "Enabled" : "Disabled" })
4425
4613
  ] })
4426
4614
  ] }),
4427
4615
  /* @__PURE__ */ jsx20(
@@ -4467,7 +4655,7 @@ function ReusableProfile({
4467
4655
  ] }),
4468
4656
  /* @__PURE__ */ jsxs17(Box16, { px: 4, pt: 4, pb: 2, children: [
4469
4657
  /* @__PURE__ */ jsx20(
4470
- Text10,
4658
+ Text11,
4471
4659
  {
4472
4660
  fontSize: "xs",
4473
4661
  fontWeight: "bold",
@@ -4496,8 +4684,8 @@ function ReusableProfile({
4496
4684
  }
4497
4685
  ),
4498
4686
  /* @__PURE__ */ jsxs17(Box16, { children: [
4499
- /* @__PURE__ */ jsx20(Text10, { fontSize: "sm", fontWeight: "semibold", children: "Appearance" }),
4500
- /* @__PURE__ */ jsx20(Text10, { fontSize: "xs", color: "gray.500", children: colorMode === "light" ? "Light mode" : "Dark mode" })
4687
+ /* @__PURE__ */ jsx20(Text11, { fontSize: "sm", fontWeight: "semibold", children: "Appearance" }),
4688
+ /* @__PURE__ */ jsx20(Text11, { fontSize: "xs", color: "gray.500", children: colorMode === "light" ? "Light mode" : "Dark mode" })
4501
4689
  ] })
4502
4690
  ] }),
4503
4691
  /* @__PURE__ */ jsx20(HStack6, { gap: 1.5, children: ["light", "dark"].map((mode) => {
@@ -4520,7 +4708,7 @@ function ReusableProfile({
4520
4708
  children: [
4521
4709
  mode === "light" ? /* @__PURE__ */ jsx20(LuSun, { size: 13 }) : /* @__PURE__ */ jsx20(LuMoon, { size: 13 }),
4522
4710
  /* @__PURE__ */ jsx20(
4523
- Text10,
4711
+ Text11,
4524
4712
  {
4525
4713
  fontSize: "xs",
4526
4714
  textTransform: "capitalize",
@@ -4534,7 +4722,7 @@ function ReusableProfile({
4534
4722
  );
4535
4723
  }) })
4536
4724
  ] }),
4537
- /* @__PURE__ */ jsx20(Separator4, {}),
4725
+ /* @__PURE__ */ jsx20(Separator3, {}),
4538
4726
  /* @__PURE__ */ jsxs17(Flex10, { justify: "space-between", align: "center", py: 3, children: [
4539
4727
  /* @__PURE__ */ jsxs17(Flex10, { align: "center", gap: 3, children: [
4540
4728
  /* @__PURE__ */ jsx20(
@@ -4555,8 +4743,8 @@ function ReusableProfile({
4555
4743
  }
4556
4744
  ),
4557
4745
  /* @__PURE__ */ jsxs17(Box16, { children: [
4558
- /* @__PURE__ */ jsx20(Text10, { fontSize: "sm", fontWeight: "semibold", children: "Text Size" }),
4559
- /* @__PURE__ */ jsx20(Text10, { fontSize: "xs", color: "gray.500", children: fontSizeLabel })
4746
+ /* @__PURE__ */ jsx20(Text11, { fontSize: "sm", fontWeight: "semibold", children: "Text Size" }),
4747
+ /* @__PURE__ */ jsx20(Text11, { fontSize: "xs", color: "gray.500", children: fontSizeLabel })
4560
4748
  ] })
4561
4749
  ] }),
4562
4750
  /* @__PURE__ */ jsx20(HStack6, { gap: 1, children: FONT_SIZES.map((option) => {
@@ -4578,7 +4766,7 @@ function ReusableProfile({
4578
4766
  onClick: () => handleFontSize(option.value),
4579
4767
  title: option.title,
4580
4768
  children: /* @__PURE__ */ jsx20(
4581
- Text10,
4769
+ Text11,
4582
4770
  {
4583
4771
  fontWeight: isActive ? "bold" : "normal",
4584
4772
  style: { fontSize: `${option.scale * 13}px` },
@@ -4590,7 +4778,7 @@ function ReusableProfile({
4590
4778
  );
4591
4779
  }) })
4592
4780
  ] }),
4593
- /* @__PURE__ */ jsx20(Separator4, {}),
4781
+ /* @__PURE__ */ jsx20(Separator3, {}),
4594
4782
  /* @__PURE__ */ jsx20(
4595
4783
  Box16,
4596
4784
  {
@@ -4618,8 +4806,8 @@ function ReusableProfile({
4618
4806
  }
4619
4807
  ),
4620
4808
  /* @__PURE__ */ jsxs17(Box16, { children: [
4621
- /* @__PURE__ */ jsx20(Text10, { fontSize: "sm", fontWeight: "semibold", children: "Quick Navigation" }),
4622
- /* @__PURE__ */ jsxs17(Text10, { fontSize: "xs", color: "gray.500", children: [
4809
+ /* @__PURE__ */ jsx20(Text11, { fontSize: "sm", fontWeight: "semibold", children: "Quick Navigation" }),
4810
+ /* @__PURE__ */ jsxs17(Text11, { fontSize: "xs", color: "gray.500", children: [
4623
4811
  quickNavHrefs.length,
4624
4812
  " of ",
4625
4813
  maxQuickNavItems,
@@ -4648,7 +4836,7 @@ function ReusableProfile({
4648
4836
  const editAccountContent = /* @__PURE__ */ jsxs17(Fragment4, { children: [
4649
4837
  /* @__PURE__ */ jsx20(Box16, { px: 4, pt: 4, pb: 3, borderBottomWidth: "1px", borderColor: "gray.200", children: /* @__PURE__ */ jsxs17(Flex10, { align: "center", gap: 2, pr: 10, children: [
4650
4838
  /* @__PURE__ */ jsx20(
4651
- IconButton3,
4839
+ IconButton2,
4652
4840
  {
4653
4841
  size: "sm",
4654
4842
  variant: "ghost",
@@ -4658,7 +4846,7 @@ function ReusableProfile({
4658
4846
  children: /* @__PURE__ */ jsx20(LuChevronLeft2, {})
4659
4847
  }
4660
4848
  ),
4661
- /* @__PURE__ */ jsx20(Text10, { fontWeight: "bold", fontSize: "md", children: "Edit Account" })
4849
+ /* @__PURE__ */ jsx20(Text11, { fontWeight: "bold", fontSize: "md", children: "Edit Account" })
4662
4850
  ] }) }),
4663
4851
  /* @__PURE__ */ jsx20(Box16, { textAlign: "center", pt: 5, pb: 4, children: /* @__PURE__ */ jsxs17(Avatar.Root, { size: "xl", mx: "auto", mb: 1, children: [
4664
4852
  user.avatarSrc && /* @__PURE__ */ jsx20(Avatar.Image, { src: user.avatarSrc, alt: editName }),
@@ -4666,7 +4854,7 @@ function ReusableProfile({
4666
4854
  ] }) }),
4667
4855
  /* @__PURE__ */ jsxs17(VStack9, { gap: 4, px: 4, pb: 10, align: "stretch", children: [
4668
4856
  /* @__PURE__ */ jsxs17(Box16, { w: "full", children: [
4669
- /* @__PURE__ */ jsx20(Text10, { fontSize: "xs", fontWeight: "semibold", color: "gray.500", mb: 1.5, children: "Display Name" }),
4857
+ /* @__PURE__ */ jsx20(Text11, { fontSize: "xs", fontWeight: "semibold", color: "gray.500", mb: 1.5, children: "Display Name" }),
4670
4858
  /* @__PURE__ */ jsx20(
4671
4859
  Input4,
4672
4860
  {
@@ -4678,7 +4866,7 @@ function ReusableProfile({
4678
4866
  )
4679
4867
  ] }),
4680
4868
  /* @__PURE__ */ jsxs17(Box16, { w: "full", children: [
4681
- /* @__PURE__ */ jsx20(Text10, { fontSize: "xs", fontWeight: "semibold", color: "gray.500", mb: 1.5, children: "Email" }),
4869
+ /* @__PURE__ */ jsx20(Text11, { fontSize: "xs", fontWeight: "semibold", color: "gray.500", mb: 1.5, children: "Email" }),
4682
4870
  /* @__PURE__ */ jsx20(
4683
4871
  Input4,
4684
4872
  {
@@ -4691,7 +4879,7 @@ function ReusableProfile({
4691
4879
  )
4692
4880
  ] }),
4693
4881
  /* @__PURE__ */ jsxs17(Box16, { w: "full", children: [
4694
- /* @__PURE__ */ jsx20(Text10, { fontSize: "xs", fontWeight: "semibold", color: "gray.500", mb: 1.5, children: "Mobile Number" }),
4882
+ /* @__PURE__ */ jsx20(Text11, { fontSize: "xs", fontWeight: "semibold", color: "gray.500", mb: 1.5, children: "Mobile Number" }),
4695
4883
  /* @__PURE__ */ jsx20(
4696
4884
  Input4,
4697
4885
  {
@@ -4721,7 +4909,7 @@ function ReusableProfile({
4721
4909
  const changePasswordContent = /* @__PURE__ */ jsxs17(Fragment4, { children: [
4722
4910
  /* @__PURE__ */ jsx20(Box16, { px: 4, pt: 4, pb: 3, borderBottomWidth: "1px", borderColor: "gray.200", children: /* @__PURE__ */ jsxs17(Flex10, { align: "center", gap: 2, pr: 10, children: [
4723
4911
  /* @__PURE__ */ jsx20(
4724
- IconButton3,
4912
+ IconButton2,
4725
4913
  {
4726
4914
  size: "sm",
4727
4915
  variant: "ghost",
@@ -4731,16 +4919,16 @@ function ReusableProfile({
4731
4919
  children: /* @__PURE__ */ jsx20(LuChevronLeft2, {})
4732
4920
  }
4733
4921
  ),
4734
- /* @__PURE__ */ jsx20(Text10, { fontWeight: "bold", fontSize: "md", children: "Change Password" })
4922
+ /* @__PURE__ */ jsx20(Text11, { fontWeight: "bold", fontSize: "md", children: "Change Password" })
4735
4923
  ] }) }),
4736
4924
  /* @__PURE__ */ jsxs17(VStack9, { gap: 5, px: 4, pt: 6, pb: 10, children: [
4737
4925
  /* @__PURE__ */ jsxs17(Box16, { w: "full", children: [
4738
- /* @__PURE__ */ jsx20(Text10, { fontSize: "xs", fontWeight: "semibold", color: "gray.500", mb: 1.5, children: "Current Password" }),
4926
+ /* @__PURE__ */ jsx20(Text11, { fontSize: "xs", fontWeight: "semibold", color: "gray.500", mb: 1.5, children: "Current Password" }),
4739
4927
  /* @__PURE__ */ jsx20(
4740
4928
  InputGroup,
4741
4929
  {
4742
4930
  endElement: /* @__PURE__ */ jsx20(
4743
- IconButton3,
4931
+ IconButton2,
4744
4932
  {
4745
4933
  size: "xs",
4746
4934
  variant: "ghost",
@@ -4764,12 +4952,12 @@ function ReusableProfile({
4764
4952
  )
4765
4953
  ] }),
4766
4954
  /* @__PURE__ */ jsxs17(Box16, { w: "full", children: [
4767
- /* @__PURE__ */ jsx20(Text10, { fontSize: "xs", fontWeight: "semibold", color: "gray.500", mb: 1.5, children: "New Password" }),
4955
+ /* @__PURE__ */ jsx20(Text11, { fontSize: "xs", fontWeight: "semibold", color: "gray.500", mb: 1.5, children: "New Password" }),
4768
4956
  /* @__PURE__ */ jsx20(
4769
4957
  InputGroup,
4770
4958
  {
4771
4959
  endElement: /* @__PURE__ */ jsx20(
4772
- IconButton3,
4960
+ IconButton2,
4773
4961
  {
4774
4962
  size: "xs",
4775
4963
  variant: "ghost",
@@ -4803,16 +4991,16 @@ function ReusableProfile({
4803
4991
  },
4804
4992
  i
4805
4993
  )) }),
4806
- /* @__PURE__ */ jsx20(Text10, { fontSize: "xs", color: pwMeta.color, fontWeight: "medium", children: pwMeta.label })
4994
+ /* @__PURE__ */ jsx20(Text11, { fontSize: "xs", color: pwMeta.color, fontWeight: "medium", children: pwMeta.label })
4807
4995
  ] })
4808
4996
  ] }),
4809
4997
  /* @__PURE__ */ jsxs17(Box16, { w: "full", children: [
4810
- /* @__PURE__ */ jsx20(Text10, { fontSize: "xs", fontWeight: "semibold", color: "gray.500", mb: 1.5, children: "Confirm New Password" }),
4998
+ /* @__PURE__ */ jsx20(Text11, { fontSize: "xs", fontWeight: "semibold", color: "gray.500", mb: 1.5, children: "Confirm New Password" }),
4811
4999
  /* @__PURE__ */ jsx20(
4812
5000
  InputGroup,
4813
5001
  {
4814
5002
  endElement: /* @__PURE__ */ jsx20(
4815
- IconButton3,
5003
+ IconButton2,
4816
5004
  {
4817
5005
  size: "xs",
4818
5006
  variant: "ghost",
@@ -4834,7 +5022,7 @@ function ReusableProfile({
4834
5022
  )
4835
5023
  }
4836
5024
  ),
4837
- confirmPw && confirmPw !== newPw && /* @__PURE__ */ jsx20(Text10, { fontSize: "xs", color: "red.500", mt: 1, children: "Passwords do not match" })
5025
+ confirmPw && confirmPw !== newPw && /* @__PURE__ */ jsx20(Text11, { fontSize: "xs", color: "red.500", mt: 1, children: "Passwords do not match" })
4838
5026
  ] }),
4839
5027
  /* @__PURE__ */ jsx20(
4840
5028
  Button4,
@@ -4867,7 +5055,7 @@ function ReusableProfile({
4867
5055
  zIndex: 1,
4868
5056
  children: /* @__PURE__ */ jsxs17(Flex10, { align: "center", gap: 2, pr: 10, children: [
4869
5057
  /* @__PURE__ */ jsx20(
4870
- IconButton3,
5058
+ IconButton2,
4871
5059
  {
4872
5060
  size: "sm",
4873
5061
  variant: "ghost",
@@ -4881,8 +5069,8 @@ function ReusableProfile({
4881
5069
  }
4882
5070
  ),
4883
5071
  /* @__PURE__ */ jsxs17(Box16, { children: [
4884
- /* @__PURE__ */ jsx20(Text10, { fontWeight: "bold", fontSize: "md", children: "Quick Navigation" }),
4885
- /* @__PURE__ */ jsxs17(Text10, { fontSize: "xs", color: "gray.500", children: [
5072
+ /* @__PURE__ */ jsx20(Text11, { fontWeight: "bold", fontSize: "md", children: "Quick Navigation" }),
5073
+ /* @__PURE__ */ jsxs17(Text11, { fontSize: "xs", color: "gray.500", children: [
4886
5074
  "Choose up to ",
4887
5075
  maxQuickNavItems,
4888
5076
  " shortcuts for the bottom bar"
@@ -4894,7 +5082,7 @@ function ReusableProfile({
4894
5082
  /* @__PURE__ */ jsxs17(Box16, { px: 4, pt: 5, pb: 2, children: [
4895
5083
  /* @__PURE__ */ jsxs17(Flex10, { align: "center", justify: "space-between", mb: 3, children: [
4896
5084
  /* @__PURE__ */ jsx20(
4897
- Text10,
5085
+ Text11,
4898
5086
  {
4899
5087
  fontSize: "xs",
4900
5088
  fontWeight: "bold",
@@ -4905,7 +5093,7 @@ function ReusableProfile({
4905
5093
  }
4906
5094
  ),
4907
5095
  /* @__PURE__ */ jsxs17(
4908
- Text10,
5096
+ Text11,
4909
5097
  {
4910
5098
  fontSize: "xs",
4911
5099
  color: quickNavHrefs.length >= maxQuickNavItems ? "orange.500" : "gray.400",
@@ -4928,7 +5116,7 @@ function ReusableProfile({
4928
5116
  borderWidth: "1px",
4929
5117
  borderStyle: "dashed",
4930
5118
  borderColor: "gray.200",
4931
- children: /* @__PURE__ */ jsx20(Text10, { fontSize: "sm", color: "gray.400", children: "No items pinned \u2014 add from below" })
5119
+ children: /* @__PURE__ */ jsx20(Text11, { fontSize: "sm", color: "gray.400", children: "No items pinned \u2014 add from below" })
4932
5120
  }
4933
5121
  ) : /* @__PURE__ */ jsx20(VStack9, { gap: 0, children: quickNavHrefs.map((href, idx) => {
4934
5122
  const option = availableOptions.find((item) => item.key === href);
@@ -4968,9 +5156,9 @@ function ReusableProfile({
4968
5156
  }
4969
5157
  ),
4970
5158
  /* @__PURE__ */ jsxs17(Box16, { children: [
4971
- /* @__PURE__ */ jsx20(Text10, { fontSize: "sm", fontWeight: "medium", children: option.title }),
5159
+ /* @__PURE__ */ jsx20(Text11, { fontSize: "sm", fontWeight: "medium", children: option.title }),
4972
5160
  isReplacing && /* @__PURE__ */ jsx20(
4973
- Text10,
5161
+ Text11,
4974
5162
  {
4975
5163
  fontSize: "xs",
4976
5164
  color: "orange.500",
@@ -4982,7 +5170,7 @@ function ReusableProfile({
4982
5170
  ] }),
4983
5171
  /* @__PURE__ */ jsxs17(HStack6, { gap: 0.5, children: [
4984
5172
  /* @__PURE__ */ jsx20(
4985
- IconButton3,
5173
+ IconButton2,
4986
5174
  {
4987
5175
  size: "xs",
4988
5176
  variant: "ghost",
@@ -4994,7 +5182,7 @@ function ReusableProfile({
4994
5182
  }
4995
5183
  ),
4996
5184
  /* @__PURE__ */ jsx20(
4997
- IconButton3,
5185
+ IconButton2,
4998
5186
  {
4999
5187
  size: "xs",
5000
5188
  variant: "ghost",
@@ -5006,7 +5194,7 @@ function ReusableProfile({
5006
5194
  }
5007
5195
  ),
5008
5196
  /* @__PURE__ */ jsx20(
5009
- IconButton3,
5197
+ IconButton2,
5010
5198
  {
5011
5199
  size: "xs",
5012
5200
  variant: isReplacing ? "solid" : "ghost",
@@ -5019,7 +5207,7 @@ function ReusableProfile({
5019
5207
  }
5020
5208
  ),
5021
5209
  /* @__PURE__ */ jsx20(
5022
- IconButton3,
5210
+ IconButton2,
5023
5211
  {
5024
5212
  size: "xs",
5025
5213
  variant: "ghost",
@@ -5035,16 +5223,16 @@ function ReusableProfile({
5035
5223
  ]
5036
5224
  }
5037
5225
  ),
5038
- !isLast && /* @__PURE__ */ jsx20(Separator4, {})
5226
+ !isLast && /* @__PURE__ */ jsx20(Separator3, {})
5039
5227
  ] }, href);
5040
5228
  }) })
5041
5229
  ] }),
5042
- /* @__PURE__ */ jsx20(Separator4, { mx: 4, my: 1 }),
5230
+ /* @__PURE__ */ jsx20(Separator3, { mx: 4, my: 1 }),
5043
5231
  /* @__PURE__ */ jsxs17(Box16, { px: 4, pt: 4, pb: 10, children: [
5044
5232
  /* @__PURE__ */ jsxs17(Flex10, { align: "center", justify: "space-between", mb: 3, children: [
5045
5233
  replacingIdx !== null ? /* @__PURE__ */ jsxs17(Box16, { children: [
5046
5234
  /* @__PURE__ */ jsx20(
5047
- Text10,
5235
+ Text11,
5048
5236
  {
5049
5237
  fontSize: "xs",
5050
5238
  fontWeight: "bold",
@@ -5054,7 +5242,7 @@ function ReusableProfile({
5054
5242
  children: "Select Replacement"
5055
5243
  }
5056
5244
  ),
5057
- /* @__PURE__ */ jsxs17(Text10, { fontSize: "xs", color: "gray.500", mt: 0.5, children: [
5245
+ /* @__PURE__ */ jsxs17(Text11, { fontSize: "xs", color: "gray.500", mt: 0.5, children: [
5058
5246
  'for "',
5059
5247
  availableOptions.find(
5060
5248
  (item) => item.key === quickNavHrefs[replacingIdx]
@@ -5062,7 +5250,7 @@ function ReusableProfile({
5062
5250
  '"'
5063
5251
  ] })
5064
5252
  ] }) : /* @__PURE__ */ jsx20(
5065
- Text10,
5253
+ Text11,
5066
5254
  {
5067
5255
  fontSize: "xs",
5068
5256
  fontWeight: "bold",
@@ -5083,7 +5271,7 @@ function ReusableProfile({
5083
5271
  }
5084
5272
  )
5085
5273
  ] }),
5086
- unpinnedOptions.length === 0 ? /* @__PURE__ */ jsx20(Text10, { fontSize: "sm", color: "gray.400", py: 3, textAlign: "center", children: "All available items are pinned" }) : /* @__PURE__ */ jsx20(VStack9, { gap: 0, children: unpinnedOptions.map((option, idx) => {
5274
+ unpinnedOptions.length === 0 ? /* @__PURE__ */ jsx20(Text11, { fontSize: "sm", color: "gray.400", py: 3, textAlign: "center", children: "All available items are pinned" }) : /* @__PURE__ */ jsx20(VStack9, { gap: 0, children: unpinnedOptions.map((option, idx) => {
5087
5275
  const ItemIcon = option.Icon;
5088
5276
  const isLast = idx === unpinnedOptions.length - 1;
5089
5277
  const isReplacingMode = replacingIdx !== null;
@@ -5108,7 +5296,7 @@ function ReusableProfile({
5108
5296
  }
5109
5297
  ),
5110
5298
  /* @__PURE__ */ jsx20(
5111
- Text10,
5299
+ Text11,
5112
5300
  {
5113
5301
  fontSize: "sm",
5114
5302
  fontWeight: "medium",
@@ -5118,7 +5306,7 @@ function ReusableProfile({
5118
5306
  )
5119
5307
  ] }),
5120
5308
  isReplacingMode ? /* @__PURE__ */ jsx20(
5121
- IconButton3,
5309
+ IconButton2,
5122
5310
  {
5123
5311
  size: "xs",
5124
5312
  variant: "outline",
@@ -5130,7 +5318,7 @@ function ReusableProfile({
5130
5318
  children: /* @__PURE__ */ jsx20(LuArrowLeftRight, { size: 13 })
5131
5319
  }
5132
5320
  ) : /* @__PURE__ */ jsx20(
5133
- IconButton3,
5321
+ IconButton2,
5134
5322
  {
5135
5323
  size: "xs",
5136
5324
  variant: "outline",
@@ -5144,7 +5332,7 @@ function ReusableProfile({
5144
5332
  }
5145
5333
  )
5146
5334
  ] }),
5147
- !isLast && /* @__PURE__ */ jsx20(Separator4, {})
5335
+ !isLast && /* @__PURE__ */ jsx20(Separator3, {})
5148
5336
  ] }, option.key);
5149
5337
  }) })
5150
5338
  ] })
@@ -5213,7 +5401,7 @@ function ReusableProfile({
5213
5401
  children: /* @__PURE__ */ jsx20(LuUser, { size: 24 })
5214
5402
  }
5215
5403
  ),
5216
- /* @__PURE__ */ jsx20(Text10, { fontSize: "sm", mt: 1, maxW: "280px", children: "Choose Edit Account, Change Password, or Quick Navigation from the menu to update your details here." })
5404
+ /* @__PURE__ */ jsx20(Text11, { fontSize: "sm", mt: 1, maxW: "280px", children: "Choose Edit Account, Change Password, or Quick Navigation from the menu to update your details here." })
5217
5405
  ]
5218
5406
  }
5219
5407
  )