myshell-react-lib 0.2.44 → 0.3.0

package/dist/index.js

@@ -6301,6 +6301,13 @@ var iconVariants = cva("inline-flex shrink-0", {
         color: "default"
     }
 });
+var SMALL_ICON_SIZES = /* @__PURE__ */ new Set([
+    "2xs",
+    "xs",
+    "sm",
+    "md",
+    "lg"
+]);
 var Icon = React.forwardRef(function(props, ref) {
     var children = props.children, component = props.component, size = props.size, color = props.color, rotate = props.rotate, className = props.className, passProps = _object_without_properties(props, [
         "children",
@@ -6311,10 +6318,11 @@ var Icon = React.forwardRef(function(props, ref) {
         "className"
     ]);
     var Com = component || "span";
+    var strokeWidth = SMALL_ICON_SIZES.has(size) ? 1.25 : 1.5;
     return /* @__PURE__ */ jsx(Com, _object_spread_props(_object_spread({
         ref: ref
     }, passProps), {
-        strokeWidth: 1.5,
+        strokeWidth: strokeWidth,
         className: cn(iconVariants({
             size: size,
             color: color,
@@ -6354,21 +6362,27 @@ var lineClampMap = {
     5: "line-clamp-5",
     6: "line-clamp-6"
 };
-var displayVariants = cva2("font-medium display-font-style font-ABCDiatype", {
+var displayVariants = cva2("display-font-style font-ABCDiatype", {
     variants: {
         size: {
-            "2xl": "text-7xl",
+            "3xl": "text-7xl",
+            "2xl": "text-6xl",
             xl: "text-5xl",
             lg: "text-3xl",
             md: "text-2xl",
             sm: "text-xl",
             xs: "text-lg"
         },
+        weight: {
+            medium: "font-medium",
+            semibold: "font-semibold"
+        },
         color: colorMap,
         lineClamp: lineClampMap
     },
     defaultVariants: {
         size: "lg",
+        weight: "medium",
         color: "default"
     }
 });
@@ -6530,9 +6544,10 @@ var Heading = React2.forwardRef(function(props, ref) {
     }));
 });
 var Display = React2.forwardRef(function(props, ref) {
-    var className = props.className, size = props.size, color = props.color, lineClamp = props.lineClamp, underline = props.underline, strikethrough = props.strikethrough, strong = props.strong, italic = props.italic, children = props.children, dangerous = props.dangerous, passProps = _object_without_properties(props, [
+    var className = props.className, size = props.size, weight = props.weight, color = props.color, lineClamp = props.lineClamp, underline = props.underline, strikethrough = props.strikethrough, strong = props.strong, italic = props.italic, children = props.children, dangerous = props.dangerous, passProps = _object_without_properties(props, [
         "className",
         "size",
+        "weight",
         "color",
         "lineClamp",
         "underline",
@@ -6553,6 +6568,7 @@ var Display = React2.forwardRef(function(props, ref) {
         ref: ref,
         className: cn(displayVariants({
             size: size,
+            weight: weight,
             color: color,
             lineClamp: lineClamp
         }), className)
@@ -6720,23 +6736,24 @@ import { jsx as jsx4, jsxs } from "react/jsx-runtime";
 var CircleErrorIcon = React4.forwardRef(function(props, ref) {
     return /* @__PURE__ */ jsx4(Icon, _object_spread_props(_object_spread({}, props), {
         children: /* @__PURE__ */ jsxs("svg", {
-            className: "w-full h-full",
-            viewBox: "0 0 20 20",
-            fill: "currentColor",
             xmlns: "http://www.w3.org/2000/svg",
+            width: "20",
+            height: "20",
+            viewBox: "0 0 20 20",
+            fill: "none",
             children: [
                 /* @__PURE__ */ jsx4("circle", {
                     cx: "10",
                     cy: "10",
                     r: "8",
-                    fill: "#CA4F3A"
+                    fill: "#EF3B2E"
                 }),
                 /* @__PURE__ */ jsx4("path", {
-                    d: "M12 8L8 12M8 8L12 12",
-                    stroke: "#FFFEFD",
-                    strokeWidth: "1.25",
-                    strokeLinecap: "round",
-                    strokeLinejoin: "round"
+                    d: "M12.5 7.5L7.5 12.5M7.5 7.5L12.5 12.5",
+                    stroke: "white",
+                    "stroke-width": "1.04167",
+                    "stroke-linecap": "round",
+                    "stroke-linejoin": "round"
                 })
             ]
         })
@@ -6748,23 +6765,24 @@ import { jsx as jsx5, jsxs as jsxs2 } from "react/jsx-runtime";
 var CircleInfoIcon = React5.forwardRef(function(props, ref) {
     return /* @__PURE__ */ jsx5(Icon, _object_spread_props(_object_spread({}, props), {
         children: /* @__PURE__ */ jsxs2("svg", {
-            className: "w-full h-full",
-            viewBox: "0 0 20 20",
-            fill: "currentColor",
             xmlns: "http://www.w3.org/2000/svg",
+            width: "20",
+            height: "20",
+            viewBox: "0 0 20 20",
+            fill: "none",
             children: [
                 /* @__PURE__ */ jsx5("circle", {
                     cx: "10",
                     cy: "10",
                     r: "8",
-                    fill: "#447BB0"
+                    fill: "#357FE9"
                 }),
                 /* @__PURE__ */ jsx5("path", {
-                    d: "M10 12.3333V9.66667M10 7H10.0067",
-                    stroke: "#FFFEFD",
-                    strokeWidth: "1.25",
-                    strokeLinecap: "round",
-                    strokeLinejoin: "round"
+                    d: "M10.01 13.3333L10.01 9.66666M10.01 6.99999L10.0033 6.99999",
+                    stroke: "white",
+                    "stroke-width": "1.25",
+                    "stroke-linecap": "round",
+                    "stroke-linejoin": "round"
                 })
             ]
         })
@@ -6776,23 +6794,24 @@ import { jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime";
 var CircleWarningIcon = React6.forwardRef(function(props, ref) {
     return /* @__PURE__ */ jsx6(Icon, _object_spread_props(_object_spread({}, props), {
         children: /* @__PURE__ */ jsxs3("svg", {
-            className: "w-full h-full",
-            viewBox: "0 0 20 20",
-            fill: "currentColor",
             xmlns: "http://www.w3.org/2000/svg",
+            width: "20",
+            height: "20",
+            viewBox: "0 0 20 20",
+            fill: "none",
             children: [
                 /* @__PURE__ */ jsx6("circle", {
                     cx: "10",
                     cy: "10",
                     r: "8",
-                    fill: "#AD8D2D"
+                    fill: "#ED9908"
                 }),
                 /* @__PURE__ */ jsx6("path", {
-                    d: "M9.99994 7V9.66667M9.99994 12.3333H10.0066",
-                    stroke: "#FFFEFD",
-                    strokeWidth: "1.25",
-                    strokeLinecap: "round",
-                    strokeLinejoin: "round"
+                    d: "M9.99994 7V10.6667M9.99994 13.3333H10.0066",
+                    stroke: "white",
+                    "stroke-width": "1.25",
+                    "stroke-linecap": "round",
+                    "stroke-linejoin": "round"
                 })
             ]
         })
@@ -6804,23 +6823,24 @@ import { jsx as jsx7, jsxs as jsxs4 } from "react/jsx-runtime";
 var CircleSuccessIcon = React7.forwardRef(function(props, ref) {
     return /* @__PURE__ */ jsx7(Icon, _object_spread_props(_object_spread({}, props), {
         children: /* @__PURE__ */ jsxs4("svg", {
-            className: "w-full h-full",
-            viewBox: "0 0 20 20",
-            fill: "currentColor",
             xmlns: "http://www.w3.org/2000/svg",
+            width: "20",
+            height: "20",
+            viewBox: "0 0 20 20",
+            fill: "none",
             children: [
                 /* @__PURE__ */ jsx7("circle", {
                     cx: "10",
                     cy: "10",
                     r: "8",
-                    fill: "#00876D"
+                    fill: "#17A966"
                 }),
                 /* @__PURE__ */ jsx7("path", {
-                    d: "M8 10.3333L9.33333 11.6667L12 9",
-                    stroke: "#FFFEFD",
-                    strokeWidth: "1.25",
-                    strokeLinecap: "round",
-                    strokeLinejoin: "round"
+                    d: "M7 10.3333L9 12.3333L13 8.33334",
+                    stroke: "white",
+                    "stroke-width": "1.25",
+                    "stroke-linecap": "round",
+                    "stroke-linejoin": "round"
                 })
             ]
         })
@@ -10492,7 +10512,7 @@ var renderIcon2 = function(icon, direction, param) {
 };
 LinkButton.displayName = "LinkButton";
 // src/components/cascader.tsx
-import { useState as useState5, useRef as useRef4, Fragment as Fragment5 } from "react";
+import { useState as useState6, useRef as useRef5, Fragment as Fragment5 } from "react";
 import { Check as Check2, ChevronDown, X } from "lucide-react";
 import { cva as cva8 } from "class-variance-authority";
 // src/components/dropdown-menu.tsx
@@ -10501,7 +10521,107 @@ import { Check, ChevronRight, Circle } from "lucide-react";
 import * as React21 from "react";
 import { jsx as jsx27, jsxs as jsxs16 } from "react/jsx-runtime";
 var DropdownMenu = DropdownMenuPrimitive.Root;
-var DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;
+var DropdownMenuHoverContext = React21.createContext(null);
+var DropdownMenuHover = function(_param) {
+    var children = _param.children, _param_openDelay = _param.openDelay, openDelay = _param_openDelay === void 0 ? 200 : _param_openDelay, _param_closeDelay = _param.closeDelay, closeDelay = _param_closeDelay === void 0 ? 300 : _param_closeDelay, _param_modal = _param.modal, modal = _param_modal === void 0 ? false : _param_modal, props = _object_without_properties(_param, [
+        "children",
+        "openDelay",
+        "closeDelay",
+        "modal"
+    ]);
+    var _React21_useState = _sliced_to_array(React21.useState(false), 2), open = _React21_useState[0], setOpen = _React21_useState[1];
+    var openTimeoutRef = React21.useRef();
+    var closeTimeoutRef = React21.useRef();
+    var openStateRef = React21.useRef(false);
+    React21.useEffect(function() {
+        openStateRef.current = open;
+    }, [
+        open
+    ]);
+    var clearAllTimeouts = React21.useCallback(function() {
+        if (openTimeoutRef.current) {
+            clearTimeout(openTimeoutRef.current);
+            openTimeoutRef.current = void 0;
+        }
+        if (closeTimeoutRef.current) {
+            clearTimeout(closeTimeoutRef.current);
+            closeTimeoutRef.current = void 0;
+        }
+    }, []);
+    var handleMouseEnter = React21.useCallback(function() {
+        if (closeTimeoutRef.current) {
+            clearTimeout(closeTimeoutRef.current);
+            closeTimeoutRef.current = void 0;
+        }
+        if (openTimeoutRef.current || openStateRef.current) {
+            return;
+        }
+        openTimeoutRef.current = setTimeout(function() {
+            setOpen(true);
+            openTimeoutRef.current = void 0;
+        }, openDelay);
+    }, [
+        openDelay
+    ]);
+    var handleMouseLeave = React21.useCallback(function() {
+        if (openTimeoutRef.current) {
+            clearTimeout(openTimeoutRef.current);
+            openTimeoutRef.current = void 0;
+        }
+        if (closeTimeoutRef.current || !openStateRef.current) {
+            return;
+        }
+        closeTimeoutRef.current = setTimeout(function() {
+            setOpen(false);
+            closeTimeoutRef.current = void 0;
+        }, closeDelay);
+    }, [
+        closeDelay
+    ]);
+    React21.useEffect(function() {
+        return function() {
+            clearAllTimeouts();
+        };
+    }, [
+        clearAllTimeouts
+    ]);
+    var contextValue = React21.useMemo(function() {
+        return {
+            handleMouseEnter: handleMouseEnter,
+            handleMouseLeave: handleMouseLeave
+        };
+    }, [
+        handleMouseEnter,
+        handleMouseLeave
+    ]);
+    return /* @__PURE__ */ jsx27(DropdownMenuHoverContext.Provider, {
+        value: contextValue,
+        children: /* @__PURE__ */ jsx27(DropdownMenuPrimitive.Root, _object_spread_props(_object_spread({
+            open: open,
+            modal: modal,
+            onOpenChange: function(newOpen) {
+                if (!newOpen) {
+                    setOpen(false);
+                    clearAllTimeouts();
+                } else {
+                    setOpen(true);
+                }
+            }
+        }, props), {
+            children: children
+        }))
+    });
+};
+var DropdownMenuTriggerPrimitive = DropdownMenuPrimitive.Trigger;
+var DropdownMenuTrigger = React21.forwardRef(function(props, ref) {
+    var hoverContext = React21.useContext(DropdownMenuHoverContext);
+    return /* @__PURE__ */ jsx27(DropdownMenuTriggerPrimitive, _object_spread({
+        ref: ref,
+        onMouseEnter: hoverContext === null || hoverContext === void 0 ? void 0 : hoverContext.handleMouseEnter,
+        onMouseLeave: hoverContext === null || hoverContext === void 0 ? void 0 : hoverContext.handleMouseLeave
+    }, props));
+});
+DropdownMenuTrigger.displayName = DropdownMenuPrimitive.Trigger.displayName;
 var DropdownMenuGroup = DropdownMenuPrimitive.Group;
 var DropdownMenuPortal = DropdownMenuPrimitive.Portal;
 var DropdownMenuSub = DropdownMenuPrimitive.Sub;
@@ -10514,7 +10634,7 @@ var DropdownMenuSubTrigger = React21.forwardRef(function(_param, ref) {
     ]);
     return /* @__PURE__ */ jsxs16(DropdownMenuPrimitive.SubTrigger, _object_spread_props(_object_spread({
         ref: ref,
-        className: cn("flex cursor-pointer select-none items-center rounded-sm px-3 py-2 outline-none focus:bg-Colors-Background-Neutral-Secondary-Hover data-[state=open]:bg-Colors-Background-Neutral-Secondary-Active", inset && "pl-8", className)
+        className: cn("flex cursor-pointer select-none items-center rounded-sm px-3 py-2 outline-none focus:bg-cc-Dropdown-bg-hover data-[state=open]:bg-cc-Dropdown-bg-hover", inset && "pl-8", className)
     }, props), {
         children: [
             children,
@@ -10526,24 +10646,77 @@ var DropdownMenuSubTrigger = React21.forwardRef(function(_param, ref) {
 });
 DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName;
 var DropdownMenuSubContent = React21.forwardRef(function(_param, ref) {
-    var className = _param.className, props = _object_without_properties(_param, [
-        "className"
+    var className = _param.className, _param_sideOffset = _param.sideOffset, sideOffset = _param_sideOffset === void 0 ? 4 : _param_sideOffset, onMouseEnter = _param.onMouseEnter, onMouseLeave = _param.onMouseLeave, props = _object_without_properties(_param, [
+        "className",
+        "sideOffset",
+        "onMouseEnter",
+        "onMouseLeave"
+    ]);
+    var hoverContext = React21.useContext(DropdownMenuHoverContext);
+    var handleMouseEnter = React21.useCallback(function(event) {
+        onMouseEnter === null || onMouseEnter === void 0 ? void 0 : onMouseEnter(event);
+        if (hoverContext) {
+            hoverContext.handleMouseEnter();
+        }
+    }, [
+        hoverContext,
+        onMouseEnter
+    ]);
+    var handleMouseLeave = React21.useCallback(function(event) {
+        onMouseLeave === null || onMouseLeave === void 0 ? void 0 : onMouseLeave(event);
+        if (hoverContext) {
+            hoverContext.handleMouseLeave();
+        }
+    }, [
+        hoverContext,
+        onMouseLeave
     ]);
     return /* @__PURE__ */ jsx27(DropdownMenuPrimitive.SubContent, _object_spread({
         ref: ref,
-        className: cn("z-50 min-w-[8rem] overflow-hidden rounded-sm border border-Colors-Border-Default bg-Colors-Background-Utilities-Modal p-2 text-Colors-Text-Default shadow-modal-default data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2", className)
+        sideOffset: sideOffset,
+        className: cn("z-50 min-w-[8rem] overflow-hidden rounded-sm border border-Colors-Border-Default bg-cc-Dropdown-bg-default p-2 text-Colors-Text-Default shadow-modal-default data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2", className),
+        onMouseEnter: hoverContext ? handleMouseEnter : onMouseEnter,
+        onMouseLeave: hoverContext ? handleMouseLeave : onMouseLeave
     }, props));
 });
 DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;
 var DropdownMenuContent = React21.forwardRef(function(_param, ref) {
-    var className = _param.className, _param_sideOffset = _param.sideOffset, sideOffset = _param_sideOffset === void 0 ? 4 : _param_sideOffset, props = _object_without_properties(_param, [
+    var className = _param.className, _param_sideOffset = _param.sideOffset, sideOffset = _param_sideOffset === void 0 ? 4 : _param_sideOffset, onMouseEnter = _param.onMouseEnter, onMouseLeave = _param.onMouseLeave, props = _object_without_properties(_param, [
         "className",
-        "sideOffset"
+        "sideOffset",
+        "onMouseEnter",
+        "onMouseLeave"
+    ]);
+    var hoverContext = React21.useContext(DropdownMenuHoverContext);
+    var handleMouseEnter = React21.useCallback(function(event) {
+        onMouseEnter === null || onMouseEnter === void 0 ? void 0 : onMouseEnter(event);
+        if (hoverContext) {
+            hoverContext.handleMouseEnter();
+        }
+    }, [
+        hoverContext,
+        onMouseEnter
+    ]);
+    var handleMouseLeave = React21.useCallback(function(event) {
+        onMouseLeave === null || onMouseLeave === void 0 ? void 0 : onMouseLeave(event);
+        var relatedTarget = event.relatedTarget;
+        var currentTarget = event.currentTarget;
+        if (relatedTarget && currentTarget.contains(relatedTarget)) {
+            return;
+        }
+        if (hoverContext) {
+            hoverContext.handleMouseLeave();
+        }
+    }, [
+        hoverContext,
+        onMouseLeave
     ]);
     return /* @__PURE__ */ jsx27(DropdownMenuPrimitive.Content, _object_spread({
         ref: ref,
         sideOffset: sideOffset,
-        className: cn("z-[100] min-w-[8rem] overflow-hidden rounded-sm border border-Colors-Border-Opaque bg-Colors-Background-Utilities-Modal p-1 text-Colors-Text-Default shadow-modal-default data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2", className)
+        className: cn("z-[100] min-w-[8rem] overflow-hidden rounded-sm border border-Colors-Border-Opaque bg-cc-Dropdown-bg-default p-1 text-Colors-Text-Default shadow-modal-default data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2", className),
+        onMouseEnter: hoverContext ? handleMouseEnter : onMouseEnter,
+        onMouseLeave: hoverContext ? handleMouseLeave : onMouseLeave
     }, props));
 });
 DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
@@ -10554,7 +10727,7 @@ var DropdownMenuItem = React21.forwardRef(function(_param, ref) {
     ]);
     return /* @__PURE__ */ jsx27(DropdownMenuPrimitive.Item, _object_spread({
         ref: ref,
-        className: cn("relative flex cursor-default select-none items-center rounded-sm px-2 py-1 outline-none transition-colors focus:bg-Colors-Background-Neutral-Secondary-Hover data-[disabled]:pointer-events-none data-[disabled]:opacity-30", inset && "pl-8", className)
+        className: cn("relative flex cursor-default select-none items-center rounded-sm px-2 py-1 outline-none transition-colors focus:bg-cc-Dropdown-bg-hover data-[disabled]:pointer-events-none data-[disabled]:opacity-30", inset && "pl-8", className)
     }, props));
 });
 DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
@@ -10566,7 +10739,7 @@ var DropdownMenuCheckboxItem = React21.forwardRef(function(_param, ref) {
     ]);
     return /* @__PURE__ */ jsxs16(DropdownMenuPrimitive.CheckboxItem, _object_spread_props(_object_spread({
         ref: ref,
-        className: cn("relative flex cursor-pointer select-none items-center rounded-xs py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-Colors-Background-Neutral-Secondary-Hover data-[disabled]:pointer-events-none data-[disabled]:opacity-30", className),
+        className: cn("relative flex cursor-pointer select-none items-center rounded-xs py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-cc-Dropdown-bg-hover data-[disabled]:pointer-events-none data-[disabled]:opacity-30", className),
         checked: checked
     }, props), {
         children: [
@@ -10707,9 +10880,9 @@ function CascaderContent(param) {
 }
 function Cascader(props) {
     var options = props.options, className = props.className, value1 = props.value, defaultValue = props.defaultValue, onValueChange = props.onValueChange, clearByDefault = props.clearByDefault, showParentLabel = props.showParentLabel, placeholder = props.placeholder, emptyText = props.emptyText, _props_rounded = props.rounded, rounded = _props_rounded === void 0 ? "default" : _props_rounded, _props_size = props.size, size = _props_size === void 0 ? "sm" : _props_size, _props_border = props.border, border = _props_border === void 0 ? "default" : _props_border, _props_outline = props.outline, outline = _props_outline === void 0 ? "default" : _props_outline, _props_background = props.background, background = _props_background === void 0 ? "default" : _props_background, _props_disabled = props.disabled, disabled = _props_disabled === void 0 ? false : _props_disabled;
-    var _useState5 = _sliced_to_array(useState5(false), 2), open = _useState5[0], setOpen = _useState5[1];
-    var conRef = useRef4(null);
-    var buttonRef = useRef4(null);
+    var _useState6 = _sliced_to_array(useState6(false), 2), open = _useState6[0], setOpen = _useState6[1];
+    var conRef = useRef5(null);
+    var buttonRef = useRef5(null);
     var inputVariants = cva8("", {
         variants: {
             rounded: {
@@ -11240,7 +11413,7 @@ var CommandItem = React26.forwardRef(function(_param, ref) {
     ]);
     return /* @__PURE__ */ jsx32(CommandPrimitive.Item, _object_spread({
         ref: ref,
-        className: cn("relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none aria-selected:bg-Colors-Background-Normal-Primary-Hover aria-selected:text-Colors-Text-Default data-[disabled]:pointer-events-none data-[disabled]:opacity-50", className)
+        className: cn("relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none aria-selected:bg-cc-Dropdown-bg-hover aria-selected:text-Colors-Text-Default data-[disabled]:pointer-events-none data-[disabled]:opacity-50", className)
     }, props));
 });
 CommandItem.displayName = CommandPrimitive.Item.displayName;
@@ -11398,7 +11571,7 @@ ContextMenuShortcut.displayName = "ContextMenuShortcut";
 import dayjs from "dayjs";
 import duration from "dayjs/plugin/duration";
 import utc from "dayjs/plugin/utc";
-import { useMemo, useEffect as useEffect5, useState as useState6 } from "react";
+import { useMemo as useMemo2, useEffect as useEffect6, useState as useState7 } from "react";
 import { jsx as jsx34, jsxs as jsxs22 } from "react/jsx-runtime";
 dayjs.extend(duration);
 dayjs.extend(utc);
@@ -11654,12 +11827,12 @@ FormMessage.displayName = "FormMessage";
 import { jsx as jsx38 } from "react/jsx-runtime";
 // src/components/guide.tsx
 import { driver } from "driver.js";
-import { useEffect as useEffect6, useMemo as useMemo2, useRef as useRef5 } from "react";
+import { useEffect as useEffect7, useMemo as useMemo3, useRef as useRef6 } from "react";
 import "driver.js/dist/driver.css";
 var Guide = function(param) {
     var steps = param.steps, _param_showProgress = param.showProgress, showProgress = _param_showProgress === void 0 ? true : _param_showProgress, _param_showOverlay = param.showOverlay, showOverlay = _param_showOverlay === void 0 ? false : _param_showOverlay, _param_hasSkip = param.hasSkip, hasSkip = _param_hasSkip === void 0 ? true : _param_hasSkip, _param_hasCloseBtn = param.hasCloseBtn, hasCloseBtn = _param_hasCloseBtn === void 0 ? true : _param_hasCloseBtn, _param_hasPrevBtn = param.hasPrevBtn, hasPrevBtn = _param_hasPrevBtn === void 0 ? false : _param_hasPrevBtn, _param_hasNextBtn = param.hasNextBtn, hasNextBtn = _param_hasNextBtn === void 0 ? true : _param_hasNextBtn, _param_allowClose = param.allowClose, allowClose = _param_allowClose === void 0 ? false : _param_allowClose, _param_skipText = param.skipText, skipText = _param_skipText === void 0 ? "Skip" : _param_skipText, _param_prevBtnText = param.prevBtnText, prevBtnText = _param_prevBtnText === void 0 ? "Previous" : _param_prevBtnText, _param_nextBtnText = param.nextBtnText, nextBtnText = _param_nextBtnText === void 0 ? "Next" : _param_nextBtnText, _param_doneBtnText = param.doneBtnText, doneBtnText = _param_doneBtnText === void 0 ? "Done" : _param_doneBtnText, className = param.className, onComplete = param.onComplete, onSkip = param.onSkip;
-    var driverRef = useRef5(null);
-    var buttons = useMemo2(function() {
+    var driverRef = useRef6(null);
+    var buttons = useMemo3(function() {
         var buttons2 = [];
         if (hasPrevBtn) {
             buttons2.push("previous");
@@ -11676,7 +11849,7 @@ var Guide = function(param) {
         hasPrevBtn,
         hasCloseBtn
     ]);
-    useEffect6(function() {
+    useEffect7(function() {
         driverRef.current = driver({
             overlayOpacity: showOverlay ? 0.8 : 0,
             animate: true,
@@ -11702,7 +11875,7 @@ var Guide = function(param) {
                 }
                 var content = popover.wrapper;
                 if (content) {
-                    content.className = cn("!bg-Colors-Utility-Lake-Blue-50 !p-3 !shadow-modal-default", content.className);
+                    content.className = cn("!bg-Colors-Background-Info-Alt !p-3 !shadow-modal-default", content.className);
                     var arrow = popover.arrow;
                     if (arrow) {
                         arrow.className = cn("border-t-Colors-Utility-Lake-Blue-50", arrow.className);
@@ -11894,11 +12067,11 @@ var Input = React31.forwardRef(function(_param, ref) {
 Input.displayName = "Input";
 // src/components/link.tsx
 import LinkComponent from "next/link";
-import { useMemo as useMemo3 } from "react";
+import { useMemo as useMemo4 } from "react";
 // src/common/hooks/useNativeBridge.ts
-import { useCallback as useCallback2 } from "react";
+import { useCallback as useCallback3 } from "react";
 function useNativeBridge() {
-    var callNative = useCallback2(function(action, data) {
+    var callNative = useCallback3(function(action, data) {
         var _window_webkit_messageHandlers, _window_webkit;
         if (isIosApp() && ((_window_webkit = window.webkit) === null || _window_webkit === void 0 ? void 0 : (_window_webkit_messageHandlers = _window_webkit.messageHandlers) === null || _window_webkit_messageHandlers === void 0 ? void 0 : _window_webkit_messageHandlers.reactNative)) {
             window.webkit.messageHandlers.reactNative.postMessage({
@@ -11913,10 +12086,10 @@ function useNativeBridge() {
             }));
         }
     }, []);
-    var getIosUrl = useCallback2(function(path) {
+    var getIosUrl = useCallback3(function(path) {
         return path;
     }, []);
-    var nativeGoBack = useCallback2(function() {
+    var nativeGoBack = useCallback3(function() {
         callNative("goBack");
     }, [
         callNative
@@ -11949,7 +12122,7 @@ function Link(_param) {
     var isIos = isClient() && isIosApp();
     var componentIsMobile = useMedia3("(max-width: 768px)");
     var isMob = isMobile2 !== null && isMobile2 !== void 0 ? isMobile2 : componentIsMobile;
-    var pathname = useMemo3(function() {
+    var pathname = useMemo4(function() {
         if (externalLink) return path;
         var formatPath = path;
         var isMobPath = path.startsWith("/m/") || path === "/m";
@@ -11987,7 +12160,7 @@ function Link(_param) {
 var link_default = Link;
 // src/components/masonry.tsx
 import { indexOf, min as min2 } from "lodash-es";
-import { Children, useEffect as useEffect7, useState as useState7 } from "react";
+import { Children, useEffect as useEffect8, useState as useState8 } from "react";
 import { jsx as jsx41 } from "react/jsx-runtime";
 import { createElement } from "react";
 var Masonry = function(param) {
@@ -11998,7 +12171,7 @@ var Masonry = function(param) {
         1439: 3,
         1199: 2
     } : _param_breakpointCols, _param_className = param.className, className = _param_className === void 0 ? "" : _param_className, _param_columnClassName = param.columnClassName, columnClassName = _param_columnClassName === void 0 ? "" : _param_columnClassName, children = param.children, _param_columnAttrs = param.columnAttrs, columnAttrs = _param_columnAttrs === void 0 ? {} : _param_columnAttrs, heights = param.heights;
-    var _useState7 = _sliced_to_array(useState7(typeof breakpointCols === "number" ? breakpointCols : breakpointCols.default), 2), columnCount = _useState7[0], setColumnCount = _useState7[1];
+    var _useState8 = _sliced_to_array(useState8(typeof breakpointCols === "number" ? breakpointCols : breakpointCols.default), 2), columnCount = _useState8[0], setColumnCount = _useState8[1];
     var reCalculateColumnCount = function() {
         var _window;
         var windowWidth = ((_window = window) === null || _window === void 0 ? void 0 : _window.innerWidth) || Infinity;
@@ -12019,7 +12192,7 @@ var Masonry = function(param) {
             setColumnCount(newColumnCount);
         }
     };
-    useEffect7(function() {
+    useEffect8(function() {
         var handleResize = function() {
             reCalculateColumnCount();
         };
@@ -12241,7 +12414,7 @@ var MenubarShortcut = function(_param) {
 };
 MenubarShortcut.displayname = "MenubarShortcut";
 // src/components/modal.tsx
-import { CircleCheckIcon, CircleXIcon, InfoIcon, XIcon, TriangleAlertIcon } from "lucide-react";
+import { CircleCheckIcon, CircleXIcon, InfoIcon, UserPenIcon, XIcon, TriangleAlertIcon } from "lucide-react";
 import * as DialogPrimitive2 from "@radix-ui/react-dialog";
 // node_modules/@radix-ui/react-focus-scope/dist/index.mjs
 import * as React36 from "react";
@@ -12700,7 +12873,7 @@ var modalVariants = cva13("focus-visible:outline-none", {
     }
 });
 var Modal = function(_param) {
-    var title = _param.title, description = _param.description, _param_size = _param.size, size = _param_size === void 0 ? "lg" : _param_size, _param_zIndex = _param.zIndex, zIndex = _param_zIndex === void 0 ? 99 : _param_zIndex, _param_hideClose = _param.hideClose, hideClose = _param_hideClose === void 0 ? false : _param_hideClose, _param_overlayClose = _param.overlayClose, overlayClose = _param_overlayClose === void 0 ? true : _param_overlayClose, _param_modalOnly = _param.modalOnly, modalOnly = _param_modalOnly === void 0 ? true : _param_modalOnly, contentClassName = _param.contentClassName, overlayClassName = _param.overlayClassName, iconClassName = _param.iconClassName, closeClassName = _param.closeClassName, _param_fullScreen = _param.fullScreen, fullScreen = _param_fullScreen === void 0 ? false : _param_fullScreen, focusScopeOptions = _param.focusScopeOptions, _param_isLogin = _param.isLogin, isLogin = _param_isLogin === void 0 ? false : _param_isLogin, _param_isNotification = _param.isNotification, isNotification = _param_isNotification === void 0 ? false : _param_isNotification, _param_isHorizontal = _param.isHorizontal, isHorizontal = _param_isHorizontal === void 0 ? false : _param_isHorizontal, state = _param.state, _param_showCancel = _param.showCancel, showCancel = _param_showCancel === void 0 ? true : _param_showCancel, _param_confirmLoading = _param.confirmLoading, confirmLoading = _param_confirmLoading === void 0 ? false : _param_confirmLoading, cancelText = _param.cancelText, confirmText = _param.confirmText, children = _param.children, _param_autoFocus = _param.autoFocus, autoFocus = _param_autoFocus === void 0 ? false : _param_autoFocus, onClose = _param.onClose, onConfirm = _param.onConfirm, props = _object_without_properties(_param, [
+    var title = _param.title, description = _param.description, _param_size = _param.size, size = _param_size === void 0 ? "lg" : _param_size, _param_zIndex = _param.zIndex, zIndex = _param_zIndex === void 0 ? 99 : _param_zIndex, _param_hideClose = _param.hideClose, hideClose = _param_hideClose === void 0 ? false : _param_hideClose, _param_overlayClose = _param.overlayClose, overlayClose = _param_overlayClose === void 0 ? true : _param_overlayClose, _param_modalOnly = _param.modalOnly, modalOnly = _param_modalOnly === void 0 ? true : _param_modalOnly, contentClassName = _param.contentClassName, overlayClassName = _param.overlayClassName, iconClassName = _param.iconClassName, closeClassName = _param.closeClassName, _param_fullScreen = _param.fullScreen, fullScreen = _param_fullScreen === void 0 ? false : _param_fullScreen, focusScopeOptions = _param.focusScopeOptions, _param_isLogin = _param.isLogin, isLogin = _param_isLogin === void 0 ? false : _param_isLogin, _param_isNotification = _param.isNotification, isNotification = _param_isNotification === void 0 ? false : _param_isNotification, _param_isHorizontal = _param.isHorizontal, isHorizontal = _param_isHorizontal === void 0 ? false : _param_isHorizontal, state = _param.state, icon = _param.icon, _param_showCancel = _param.showCancel, showCancel = _param_showCancel === void 0 ? true : _param_showCancel, _param_confirmLoading = _param.confirmLoading, confirmLoading = _param_confirmLoading === void 0 ? false : _param_confirmLoading, cancelText = _param.cancelText, confirmText = _param.confirmText, children = _param.children, _param_autoFocus = _param.autoFocus, autoFocus = _param_autoFocus === void 0 ? false : _param_autoFocus, onClose = _param.onClose, onConfirm = _param.onConfirm, props = _object_without_properties(_param, [
         "title",
         "description",
         "size",
@@ -12718,6 +12891,7 @@ var Modal = function(_param) {
         "isNotification",
         "isHorizontal",
         "state",
+        "icon",
         "showCancel",
         "confirmLoading",
         "cancelText",
@@ -12730,7 +12904,7 @@ var Modal = function(_param) {
     var isMobile2 = useMedia4("(max-width: 768px)");
     if (isMobile2 && !modalOnly && !isNotification) {
         var drawerContent = /* @__PURE__ */ jsxs27(DrawerPrimitive2.Content, {
-            className: cn("fixed inset-x-0 bottom-0 z-50 h-auto overflow-hidden no-scrollbar border-Colors-Border-Opaque bg-Colors-Background-Utilities-Modal shadow-modal-default focus:outline-none", fullScreen ? "rounded-t-none max-h-full" : "rounded-t-md max-h-[85vh]", contentClassName),
+            className: cn("fixed inset-x-0 bottom-0 z-50 h-auto overflow-hidden no-scrollbar border-Colors-Border-Opaque bg-Colors-Background-Utilities-Modal shadow-modal-default backdrop-blur-xl focus:outline-none", fullScreen ? "rounded-t-none max-h-full" : "rounded-t-md max-h-[85vh]", contentClassName),
             onOpenAutoFocus: function(e) {
                 !autoFocus && e.preventDefault();
             },
@@ -12794,6 +12968,10 @@ var Modal = function(_param) {
     }
     var renderIcon3 = function(state2) {
         switch(state2){
+            case "basic":
+                return /* @__PURE__ */ jsx44(UserPenIcon, {
+                    className: "text-Colors-Foreground-Default w-6 h-6"
+                });
             case "info":
                 return /* @__PURE__ */ jsx44(InfoIcon, {
                     className: "text-cc-Icon-Featured-icon-fg-Info w-6 h-6"
@@ -12814,18 +12992,20 @@ var Modal = function(_param) {
     };
     var getBackgroundColor = function(state2) {
         switch(state2){
+            case "basic":
+                return "bg-Colors-Background-Surface-Subtle";
             case "info":
-                return "bg-Colors-Background-Info-Default";
+                return "bg-cc-Icon-Featured-icon-bg-Info";
             case "success":
-                return "bg-Colors-Background-Success-Default";
+                return "bg-cc-Icon-Featured-icon-bg-Success";
             case "warning":
-                return "bg-Colors-Background-Warning-Default";
+                return "bg-cc-Icon-Featured-icon-bg-Warning";
             case "error":
-                return "bg-Colors-Background-Critical-Default";
+                return "bg-cc-Icon-Featured-icon-bg-Error";
         }
     };
     var dialogContent = /* @__PURE__ */ jsxs27(ModalContent, {
-        className: cn("rounded-md border-Colors-Border-Opaque bg-Colors-Background-Utilities-Modal shadow-modal-default overflow-hidden", !isMobile2 ? modalVariants({
+        className: cn("rounded-md border-Colors-Border-Opaque bg-Colors-Background-Utilities-Modal shadow-modal-default backdrop-blur-xl overflow-hidden", !isMobile2 ? modalVariants({
             size: size,
             zIndex: zIndex
         }) : isLogin ? "w-[90%]" : "w-[80%]", isNotification && "w-[312px] md:w-[380px]", contentClassName),
@@ -12843,7 +13023,7 @@ var Modal = function(_param) {
                         className: cn(isNotification && "border-none !pb-3"),
                         children: state && /* @__PURE__ */ jsx44("div", {
                             className: cn("flex items-center justify-center w-10 h-10 rounded-full flex-shrink-0 flex-grow-0", getBackgroundColor(state)),
-                            children: renderIcon3(state)
+                            children: icon || renderIcon3(state)
                         })
                     }),
                     /* @__PURE__ */ jsxs27("div", {
@@ -12976,7 +13156,7 @@ ModalBody.displayName = "ModalBody";
 import { XIcon as XIcon2, SearchIcon } from "lucide-react";
 import { cva as cva14 } from "class-variance-authority";
 import * as React38 from "react";
-import { useEffect as useEffect10 } from "react";
+import { useEffect as useEffect11 } from "react";
 import { jsx as jsx45, jsxs as jsxs28 } from "react/jsx-runtime";
 var searchBarVariants = cva14("rounded-sm", {
     variants: {
@@ -13005,7 +13185,7 @@ function SearchBar(_param) {
         "defaultSearchByChange"
     ]);
     var _React38_useState = _sliced_to_array(React38.useState(""), 2), value1 = _React38_useState[0], setValue = _React38_useState[1];
-    useEffect10(function() {
+    useEffect11(function() {
         setValue(searchValue || "");
     }, [
         searchValue
@@ -13029,7 +13209,7 @@ function SearchBar(_param) {
                 hasEnter: true,
                 rounded: roundedFill ? "full" : "sm",
                 size: size,
-                className: cn("relative w-full px-9 flex space-x-2 text-base shadow-none placeholder:text-Colors-Text-Subtlest", "bg-cc-Search-Bar-bg-default focus-visible-style", {
+                className: cn("relative w-full px-9 flex space-x-2 text-base shadow-none placeholder:text-Colors-Text-Subtlest", "focus-visible-style", {
                     "focus-visible:ring-transparent": readOnly
                 }, inputClassName),
                 value: value1,
@@ -13375,7 +13555,7 @@ var ScrollBar = React41.forwardRef(function(_param, ref) {
 });
 ScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName;
 // src/components/top-navigation-bar.tsx
-import { useEffect as useEffect11, useRef as useRef8, useState as useState10 } from "react";
+import { useEffect as useEffect12, useRef as useRef9, useState as useState11 } from "react";
 import { useMedia as useMedia5 } from "react-use";
 import { ArrowLeftIcon } from "lucide-react";
 import { jsx as jsx53, jsxs as jsxs35 } from "react/jsx-runtime";
@@ -13383,9 +13563,9 @@ function TopNavigationBar(param) {
     var searchElement = param.searchElement, title = param.title, border = param.border, backUrl = param.backUrl, children = param.children, _param_hasBackground = param.hasBackground, hasBackground = _param_hasBackground === void 0 ? false : _param_hasBackground, avatar = param.avatar, onBack = param.onBack, _param_pageType = param.pageType, pageType = _param_pageType === void 0 ? 2 : _param_pageType, className = param.className, isMobile2 = param.isMobile;
     var componentIsMobile = useMedia5("(max-width: 768px)");
     var isMob = isMobile2 !== null && isMobile2 !== void 0 ? isMobile2 : componentIsMobile;
-    var navbarRef = useRef8(null);
-    var _useState10 = _sliced_to_array(useState10(hasBackground), 2), showBackground = _useState10[0], setShowBackground = _useState10[1];
-    useEffect11(function() {
+    var navbarRef = useRef9(null);
+    var _useState11 = _sliced_to_array(useState11(hasBackground), 2), showBackground = _useState11[0], setShowBackground = _useState11[1];
+    useEffect12(function() {
         if (hasBackground) {
             setShowBackground(true);
             return;
@@ -13611,7 +13791,7 @@ var SelectContent = React42.forwardRef(function(_param, ref) {
     ]);
     var Content13 = /* @__PURE__ */ jsx54(SelectPrimitive.Content, _object_spread_props(_object_spread({
         ref: ref,
-        className: cn("relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-sm border border-Colors-Border-Default bg-Colors-Background-Utilities-Modal text-Colors-Text-Default shadow-modal-default data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2", position === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1", className),
+        className: cn("relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-sm border border-Colors-Border-Default bg-cc-Dropdown-bg-default text-Colors-Text-Default shadow-modal-default data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2", position === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1", className),
         position: position
     }, props), {
         children: /* @__PURE__ */ jsx54(SelectPrimitive.Viewport, {
@@ -13672,7 +13852,7 @@ var SelectItem = React42.forwardRef(function(_param, ref) {
     ]);
     return /* @__PURE__ */ jsxs36(SelectPrimitive.Item, _object_spread_props(_object_spread({
         ref: ref,
-        className: cn("relative flex justify-between w-full cursor-pointer select-none items-center rounded-sm py-1 px-1.5 outline-none text-base", "hover:bg-Colors-Background-Neutral-Secondary-Hover focus:bg-Colors-Background-Neutral-Secondary-Hover data-[disabled]:opacity-30 data-[disabled]:cursor-not-allowed space-x-1.5", critical ? "text-Colors-Text-Critical-Default" : "focus:text-Colors-Text-Default", className)
+        className: cn("relative flex justify-between w-full cursor-pointer select-none items-center rounded-sm py-1 px-1.5 outline-none text-base", "hover:bg-cc-Dropdown-bg-hover focus:bg-cc-Dropdown-bg-hover data-[disabled]:opacity-30 data-[disabled]:cursor-not-allowed space-x-1.5", critical ? "text-Colors-Text-Critical-Default" : "focus:text-Colors-Text-Default", className)
     }, props), {
         children: [
             /* @__PURE__ */ jsxs36("span", {
@@ -13713,11 +13893,11 @@ SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
 import { Command as CommandPrimitive2, useCommandState } from "cmdk";
 import { ChevronDown as ChevronDown3, X as X3 } from "lucide-react";
 import * as React43 from "react";
-import { forwardRef as forwardRef39, useEffect as useEffect12 } from "react";
+import { forwardRef as forwardRef39, useEffect as useEffect13 } from "react";
 import { Fragment as Fragment11, jsx as jsx55, jsxs as jsxs37 } from "react/jsx-runtime";
 function useDebounce(value1, delay) {
     var _React43_useState = _sliced_to_array(React43.useState(value1), 2), debouncedValue = _React43_useState[0], setDebouncedValue = _React43_useState[1];
-    useEffect12(function() {
+    useEffect13(function() {
         var timer = setTimeout(function() {
             return setDebouncedValue(value1);
         }, delay || 500);
@@ -13888,7 +14068,7 @@ var MultipleSelector = React43.forwardRef(function(param, ref) {
         handleUnselect,
         selected
     ]);
-    useEffect12(function() {
+    useEffect13(function() {
         if (open) {
             document.addEventListener("mousedown", handleClickOutside);
             document.addEventListener("touchend", handleClickOutside);
@@ -13903,7 +14083,7 @@ var MultipleSelector = React43.forwardRef(function(param, ref) {
     }, [
         open
     ]);
-    useEffect12(function() {
+    useEffect13(function() {
         if (value1) {
             setSelected((arrayOptions === null || arrayOptions === void 0 ? void 0 : arrayOptions.filter(function(item) {
                 return value1 === null || value1 === void 0 ? void 0 : value1.includes(item.value);
@@ -13912,7 +14092,7 @@ var MultipleSelector = React43.forwardRef(function(param, ref) {
     }, [
         value1
     ]);
-    useEffect12(function() {
+    useEffect13(function() {
         if (!arrayOptions || onSearch) {
             return;
         }
@@ -13926,7 +14106,7 @@ var MultipleSelector = React43.forwardRef(function(param, ref) {
         onSearch,
         options
     ]);
-    useEffect12(function() {
+    useEffect13(function() {
         var doSearchSync = function() {
             var res = onSearchSync === null || onSearchSync === void 0 ? void 0 : onSearchSync(debouncedSearchTerm);
             setOptions(transToGroupOption(res || [], groupBy));
@@ -13956,7 +14136,7 @@ var MultipleSelector = React43.forwardRef(function(param, ref) {
         open,
         triggerSearchOnFocus
     ]);
-    useEffect12(function() {
+    useEffect13(function() {
         var doSearch = function() {
             return _async_to_generator(function() {
                 var res;
@@ -14247,7 +14427,7 @@ var MultipleSelector = React43.forwardRef(function(param, ref) {
                     return e.stopPropagation();
                 },
                 children: open && /* @__PURE__ */ jsx55(CommandList, {
-                    className: "no-scrollbar text-Colors-Text-Default absolute top-1 z-10 max-h-60 w-full min-w-[8rem] rounded-sm border border-cc-Input-bg-default bg-Colors-Background-Normal-Primary-Default shadow-modal-default",
+                    className: "no-scrollbar text-Colors-Text-Default absolute top-1 z-10 max-h-60 w-full min-w-[8rem] rounded-sm border border-cc-Input-bg-default bg-cc-Dropdown-bg-default shadow-modal-default",
                     onMouseLeave: function() {
                         setOnScrollbar(false);
                     },
@@ -14445,7 +14625,7 @@ function Skeleton(_param) {
         "animate"
     ]);
     return /* @__PURE__ */ jsx57("div", _object_spread({
-        className: cn("rounded-sm bg-Colors-Background-Normal-Secondary-Hover", className, animate && "animate-pulse")
+        className: cn("rounded-sm bg-Colors-Background-Surface-Muted", className, animate && "animate-pulse")
     }, props));
 }
 // src/components/slider.tsx
@@ -15329,7 +15509,7 @@ var NoPageState = function(args) {
 // src/components/logo-loading.tsx
 import lottie from "lottie-web";
 import { useTheme } from "next-themes";
-import { useEffect as useEffect13, useRef as useRef10, useState as useState12 } from "react";
+import { useEffect as useEffect14, useRef as useRef11, useState as useState13 } from "react";
 // src/common/assets/animationData.json
 var animationData_default = {
     v: "5.12.1",
@@ -24854,11 +25034,11 @@ var animationDataDark_default = {
 import { jsx as jsx67, jsxs as jsxs45 } from "react/jsx-runtime";
 function LogoLoading(param) {
     var className = param.className, containerClassName = param.containerClassName;
-    var lottieContainer = useRef10(null);
-    var _useState12 = _sliced_to_array(useState12(false), 2), isLottieLoaded = _useState12[0], setIsLottieLoaded = _useState12[1];
+    var lottieContainer = useRef11(null);
+    var _useState13 = _sliced_to_array(useState13(false), 2), isLottieLoaded = _useState13[0], setIsLottieLoaded = _useState13[1];
     var resolvedTheme = useTheme().resolvedTheme;
     var isDark = resolvedTheme === "dark";
-    useEffect13(function() {
+    useEffect14(function() {
         if (!lottieContainer.current) return;
         var anim = lottie.loadAnimation({
             container: lottieContainer.current,
@@ -24931,13 +25111,13 @@ var ToastViewport = React51.forwardRef(function(_param, ref) {
     }, props));
 });
 ToastViewport.displayName = ToastPrimitives.Viewport.displayName;
-var toastVariants = cva21("group pointer-events-auto relative flex w-full items-center justify-between space-x-4 overflow-hidden rounded-sm border border-Colors-Border-Opaque p-6 pr-8 shadow-modal-default transition-all data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=closed]:fade-out-80 max-w-md", {
+var toastVariants = cva21("group pointer-events-auto relative flex w-[286px] min-w-[286px] max-w-[286px] items-start gap-3 overflow-hidden rounded-lg border border-cc-Toast-border bg-cc-Toast-bg-default p-3 backdrop-blur-[20px] shadow-modal-default transition-all data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=closed]:fade-out-80", {
     variants: {
         variant: {
-            info: "bg-Colors-Background-Utilities-Modal p-4",
-            warning: "bg-Colors-Background-Utilities-Modal p-4",
-            error: "bg-Colors-Background-Utilities-Modal p-4",
-            success: "bg-Colors-Background-Utilities-Modal p-4"
+            info: "",
+            warning: "",
+            error: "",
+            success: ""
         },
         position: {
             "top-left": "data-[state=open]:slide-in-from-left-full data-[state=closed]:slide-out-to-left-full",
@@ -24987,11 +25167,11 @@ var ToastClose = React51.forwardRef(function(_param, ref) {
     ]);
     return /* @__PURE__ */ jsx68(ToastPrimitives.Close, _object_spread_props(_object_spread({
         ref: ref,
-        className: cn("absolute right-4 top-4 rounded-sm p-1 text-slate-950/50 transition-opacity hover:text-slate-950 outline-none focus:outline-none focus:ring-2 group-[.destructive]:text-red-300 group-[.destructive]:hover:text-red-50 group-[.destructive]:focus:ring-red-400 group-[.destructive]:focus:ring-offset-red-600 dark:text-slate-50/50 dark:hover:text-slate-50", className),
+        className: cn("absolute size-5 right-3 top-3 rounded-full p-1 text-cc-Button-Tertiary-fg-default hover:text-cc-Button-Tertiary-fg-alt bg-cc-Button-Tertiary-bg-default hover:bg-cc-Button-Tertiary-bg-hover transition-opacity outline-none focus:outline-none focus:ring-2 group-[.destructive]:text-red-300 group-[.destructive]:hover:text-red-50 group-[.destructive]:focus:ring-red-400 group-[.destructive]:focus:ring-offset-red-600 ", className),
         "toast-close": ""
     }, props), {
         children: /* @__PURE__ */ jsx68(XIcon3, {
-            className: "h-5 w-5"
+            className: "h-3 w-3 text-cc-Button-Tertiary-fg-default"
         })
     }));
 });
@@ -25224,37 +25404,37 @@ function Toaster() {
         position
     ]);
     var renderToast = function(toast4) {
-        var id = toast4.id, title = toast4.title, description = toast4.description, action = toast4.action, variant = toast4.variant, toastPosition = toast4.position;
+        var id = toast4.id, title = toast4.title, description = toast4.description, action = toast4.action, variant = toast4.variant, icon = toast4.icon, toastPosition = toast4.position;
         var renderIcon3 = function(variant2) {
             switch(variant2){
                 case "info":
                     return /* @__PURE__ */ jsx70(InfoIcon2, {
-                        className: "h-6 w-6 text-cc-Icon-Featured-icon-fg-Info"
+                        className: "h-6 w-6 sm:h-4.5 sm:w-4.5 text-cc-Icon-Featured-icon-fg-Info"
                     });
                 case "success":
                     return /* @__PURE__ */ jsx70(CircleCheckIcon2, {
-                        className: "h-6 w-6 text-cc-Icon-Featured-icon-fg-Success"
+                        className: "h-6 w-6 sm:h-4.5 sm:w-4.5 text-cc-Icon-Featured-icon-fg-Success"
                     });
                 case "warning":
                     return /* @__PURE__ */ jsx70(TriangleAlertIcon2, {
-                        className: "h-6 w-6 text-cc-Icon-Featured-icon-fg-Warning"
+                        className: "h-6 w-6 sm:h-4.5 sm:w-4.5 text-cc-Icon-Featured-icon-fg-Warning"
                     });
                 case "error":
                     return /* @__PURE__ */ jsx70(CircleXIcon2, {
-                        className: "h-6 w-6 text-cc-Icon-Featured-icon-fg-Error"
+                        className: "h-6 w-6 sm:h-4.5 sm:w-4.5 text-cc-Icon-Featured-icon-fg-Error"
                     });
             }
         };
         var getBackgroundColor = function(variant2) {
             switch(variant2){
                 case "info":
-                    return "bg-Colors-Background-Info-Default";
+                    return "bg-cc-Icon-Featured-icon-bg-Info";
                 case "success":
-                    return "bg-Colors-Background-Success-Default";
+                    return "bg-cc-Icon-Featured-icon-bg-Success";
                 case "warning":
-                    return "bg-Colors-Background-Warning-Default";
+                    return "bg-cc-Icon-Featured-icon-bg-Warning";
                 case "error":
-                    return "bg-Colors-Background-Critical-Default";
+                    return "bg-cc-Icon-Featured-icon-bg-Error";
             }
         };
         return /* @__PURE__ */ jsxs47(Toast, _object_spread_props(_object_spread({}, toast4), {
@@ -25266,18 +25446,18 @@ function Toaster() {
                         className: "flex items-start gap-3",
                         children: [
                             /* @__PURE__ */ jsx70("div", {
-                                className: cn("flex h-10 w-10 flex-shrink-0 flex-grow-0 items-center justify-center rounded-full", getBackgroundColor(variant)),
-                                children: renderIcon3(variant)
+                                className: cn("flex h-10 w-10 sm:h-8 sm:w-8 flex-shrink-0 flex-grow-0 items-center justify-center rounded-full", getBackgroundColor(variant)),
+                                children: icon || renderIcon3(variant)
                             }),
                             /* @__PURE__ */ jsxs47("div", {
                                 className: "grid gap-1",
                                 children: [
                                     title && /* @__PURE__ */ jsx70(ToastTitle, {
-                                        className: "text-base text-Colors-Text-Default",
+                                        className: "text-base text-cc-Toast-fg-default",
                                         children: title
                                     }),
                                     description && /* @__PURE__ */ jsx70(ToastDescription, {
-                                        className: "text-sm text-Colors-Text-Subtle",
+                                        className: "text-sm text-cc-Toast-fg-subtle",
                                         children: description
                                     }),
                                     action
@@ -25306,7 +25486,7 @@ function Toaster() {
 }
 // src/components/swiper/index.tsx
 import { cva as cva22 } from "class-variance-authority";
-import { useEffect as useEffect15, useMemo as useMemo6, useRef as useRef11, useState as useState14 } from "react";
+import { useEffect as useEffect16, useMemo as useMemo7, useRef as useRef12, useState as useState15 } from "react";
 import { useRouter as useRouter2 } from "next/navigation";
 import { Autoplay, Navigation, FreeMode, Scrollbar, Mousewheel, Grid } from "swiper/modules";
 import { Swiper as SwiperComponent, SwiperSlide } from "swiper/react";
@@ -25316,7 +25496,7 @@ import "swiper/css/free-mode";
 import "swiper/css/grid";
 import "swiper/css/pagination";
 // src/components/swiper/index.module.scss
-var index_module_default = '.swiperBox {\n  @apply w-full h-fit;\n}\n.swiperBox :global(.swiper) :global(.swiper-button-prev) {\n  @apply bg-contain bg-no-repeat;\n  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0iIzQxNDM0NSIgY2xhc3M9InNpemUtNSI+CiAgPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNMTEuNzggNS4yMmEuNzUuNzUgMCAwIDEgMCAxLjA2TDguMDYgMTBsMy43MiAzLjcyYS43NS43NSAwIDEgMS0xLjA2IDEuMDZsLTQuMjUtNC4yNWEuNzUuNzUgMCAwIDEgMC0xLjA2bDQuMjUtNC4yNWEuNzUuNzUgMCAwIDEgMS4wNiAwWiIgY2xpcC1ydWxlPSJldmVub2RkIiAvPgo8L3N2Zz4K");\n}\n.swiperBox :global(.swiper) :global(.swiper-button-next) {\n  @apply bg-contain bg-no-repeat;\n  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0iIzQxNDM0NSIgY2xhc3M9InNpemUtNSI+CiAgPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNOC4yMiA1LjIyYS43NS43NSAwIDAgMSAxLjA2IDBsNC4yNSA0LjI1YS43NS43NSAwIDAgMSAwIDEuMDZsLTQuMjUgNC4yNWEuNzUuNzUgMCAwIDEtMS4wNi0xLjA2TDExLjk0IDEwIDguMjIgNi4yOGEuNzUuNzUgMCAwIDEgMC0xLjA2WiIgY2xpcC1ydWxlPSJldmVub2RkIiAvPgo8L3N2Zz4KCg==");\n}\n.swiperBox :global(.swiper) :global(.swiper-button-prev::after) {\n  @apply text-Colors-Foreground-Default content-none;\n}\n.swiperBox :global(.swiper) :global(.swiper-button-next::after) {\n  @apply text-Colors-Foreground-Default content-none;\n}\n.swiperBox :global(.swiper.banner-swiper) :global(.banner-swiper-slide.swiper-slide-prev) {\n  @apply origin-right;\n}\n.swiperBox :global(.swiper.banner-swiper) :global(.banner-swiper-slide.swiper-slide-next) {\n  @apply origin-left;\n}\n.swiperBox :global(.swiper.banner-swiper) :global(.swiper-slide-active) {\n  @apply opacity-100;\n}\n.swiperBox :global(.swiper.banner-swiper) :global(.swiper-button-next) {\n  @apply -right-4 md:right-0 3xl:right-[calc((100%-1200px)/2-16px)];\n}\n.swiperBox :global(.swiper.banner-swiper) :global(.swiper-button-prev) {\n  @apply -left-4 md:left-0 3xl:left-[calc((100%-1200px)/2-16px)];\n}\n.swiperBox :global(.swiper.feature-swiper) :global(.swiper-button-next) {\n  @apply right-0;\n}\n.swiperBox :global(.swiper.feature-swiper) :global(.swiper-button-prev) {\n  @apply left-0;\n}\n.swiperBox :global(.swiper.feature-swiper) :global(.swiper-button-disabled) {\n  @apply hidden;\n}\n.swiperBox :global(.swiper.patron-badge-swiper) :global(.swiper-button-next) {\n  @apply right-0;\n}\n.swiperBox :global(.swiper.patron-badge-swiper) :global(.swiper-button-prev) {\n  @apply left-0;\n}\n.swiperBox :global(.swiper.patron-badge-swiper) :global(.swiper-button-disabled) {\n  @apply hidden;\n}\n.swiperBox :global(.swiper.grid-swiper) :global(.swiper-wrapper) {\n  @apply w-[100vw] md:w-full flex-wrap flex-col m-0;\n}\n.swiperBox :global(.swiper) :global(.swiper-button-next) {\n  @apply hidden md:flex justify-center items-center absolute top-[50%] w-8 h-8 font-semibold text-Colors-Foreground-Default border border-Colors-Border-Default bg-Colors-Background-Normal-Primary-Default rounded-full cursor-pointer hover:bg-Colors-Background-Normal-Primary-Hover active:bg-Colors-Background-Normal-Primary-Active;\n}\n.swiperBox :global(.swiper) :global(.swiper-button-next)::after {\n  @apply text-Colors-Foreground-Default text-xs font-bold;\n}\n.swiperBox :global(.swiper) :global(.swiper-button-prev) {\n  @apply hidden md:flex justify-center items-center absolute top-[50%] w-8 h-8 font-semibold text-Colors-Foreground-Default border border-Colors-Border-Default bg-Colors-Background-Normal-Primary-Default rounded-full cursor-pointer hover:bg-Colors-Background-Normal-Primary-Hover active:bg-Colors-Background-Normal-Primary-Active;\n}\n.swiperBox :global(.swiper) :global(.swiper-button-prev)::after {\n  @apply text-Colors-Foreground-Default text-xs font-bold;\n}\n\n.animate :global(.swiper-slide) {\n  transition: transform 500ms linear;\n}\n/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VSb290IjoiL1VzZXJzL3hpYW9ndWFuZy9jb2RlL215c2hlbGwtcmVhY3QtbGliL3NyYy9jb21wb25lbnRzL3N3aXBlciIsInNvdXJjZXMiOlsiaW5kZXgubW9kdWxlLnNjc3MiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7RUFDRTs7QUFHRTtFQUNFO0VBQ0E7O0FBRUY7RUFDRTtFQUNBOztBQUVGO0VBQ0U7O0FBRUY7RUFDRTs7QUFJRjtFQUVFOztBQUVGO0VBRUU7O0FBRUY7RUFDRTs7QUFHRjtFQUNFOztBQUVGO0VBQ0U7O0FBSUY7RUFDRTs7QUFFRjtFQUNFOztBQUVGO0VBQ0U7O0FBSUY7RUFDRTs7QUFFRjtFQUNFOztBQUVGO0VBQ0U7O0FBSUY7RUFDRTs7QUFLRjtFQUNFOztBQUNFO0VBQ0U7O0FBR047RUFDRTs7QUFDRTtFQUNFOzs7QUFPUjtFQUNFIiwic291cmNlc0NvbnRlbnQiOlsiLnN3aXBlckJveHtcbiAgQGFwcGx5IHctZnVsbCBoLWZpdDtcbiAgXG4gIDpnbG9iYWwoLnN3aXBlcikge1xuICAgIDpnbG9iYWwoLnN3aXBlci1idXR0b24tcHJldil7XG4gICAgICBAYXBwbHkgYmctY29udGFpbiBiZy1uby1yZXBlYXQ7XG4gICAgICBiYWNrZ3JvdW5kLWltYWdlOiB1cmwoJ2RhdGE6aW1hZ2Uvc3ZnK3htbDtiYXNlNjQsUEhOMlp5QjRiV3h1Y3owaWFIUjBjRG92TDNkM2R5NTNNeTV2Y21jdk1qQXdNQzl6ZG1jaUlIWnBaWGRDYjNnOUlqQWdNQ0F5TUNBeU1DSWdabWxzYkQwaUl6UXhORE0wTlNJZ1kyeGhjM005SW5OcGVtVXROU0krQ2lBZ1BIQmhkR2dnWm1sc2JDMXlkV3hsUFNKbGRtVnViMlJrSWlCa1BTSk5NVEV1TnpnZ05TNHlNbUV1TnpVdU56VWdNQ0F3SURFZ01DQXhMakEyVERndU1EWWdNVEJzTXk0M01pQXpMamN5WVM0M05TNDNOU0F3SURFZ01TMHhMakEySURFdU1EWnNMVFF1TWpVdE5DNHlOV0V1TnpVdU56VWdNQ0F3SURFZ01DMHhMakEyYkRRdU1qVXROQzR5TldFdU56VXVOelVnTUNBd0lERWdNUzR3TmlBd1dpSWdZMnhwY0MxeWRXeGxQU0psZG1WdWIyUmtJaUF2UGdvOEwzTjJaejRLJyk7IFxuICAgIH1cbiAgICA6Z2xvYmFsKC5zd2lwZXItYnV0dG9uLW5leHQpe1xuICAgICAgQGFwcGx5IGJnLWNvbnRhaW4gYmctbm8tcmVwZWF0O1xuICAgICAgYmFja2dyb3VuZC1pbWFnZTogdXJsKCdkYXRhOmltYWdlL3N2Zyt4bWw7YmFzZTY0LFBITjJaeUI0Yld4dWN6MGlhSFIwY0RvdkwzZDNkeTUzTXk1dmNtY3ZNakF3TUM5emRtY2lJSFpwWlhkQ2IzZzlJakFnTUNBeU1DQXlNQ0lnWm1sc2JEMGlJelF4TkRNME5TSWdZMnhoYzNNOUluTnBlbVV0TlNJK0NpQWdQSEJoZEdnZ1ptbHNiQzF5ZFd4bFBTSmxkbVZ1YjJSa0lpQmtQU0pOT0M0eU1pQTFMakl5WVM0M05TNDNOU0F3SURBZ01TQXhMakEySURCc05DNHlOU0EwTGpJMVlTNDNOUzQzTlNBd0lEQWdNU0F3SURFdU1EWnNMVFF1TWpVZ05DNHlOV0V1TnpVdU56VWdNQ0F3SURFdE1TNHdOaTB4TGpBMlRERXhMamswSURFd0lEZ3VNaklnTmk0eU9HRXVOelV1TnpVZ01DQXdJREVnTUMweExqQTJXaUlnWTJ4cGNDMXlkV3hsUFNKbGRtVnViMlJrSWlBdlBnbzhMM04yWno0S0NnPT0nKTsgXG4gICAgfVxuICAgIDpnbG9iYWwoLnN3aXBlci1idXR0b24tcHJldjo6YWZ0ZXIpe1xuICAgICAgQGFwcGx5IHRleHQtQ29sb3JzLUZvcmVncm91bmQtRGVmYXVsdCBjb250ZW50LW5vbmU7XG4gICAgfVxuICAgIDpnbG9iYWwoLnN3aXBlci1idXR0b24tbmV4dDo6YWZ0ZXIpe1xuICAgICAgQGFwcGx5IHRleHQtQ29sb3JzLUZvcmVncm91bmQtRGVmYXVsdCBjb250ZW50LW5vbmU7XG4gICAgfVxuICB9XG4gIDpnbG9iYWwoLnN3aXBlci5iYW5uZXItc3dpcGVyKSB7XG4gICAgOmdsb2JhbCguYmFubmVyLXN3aXBlci1zbGlkZS5zd2lwZXItc2xpZGUtcHJldikge1xuICAgICAgLy8gdHJhbnNmb3JtOiBzY2FsZSgwLjgpO1xuICAgICAgQGFwcGx5IG9yaWdpbi1yaWdodDtcbiAgICB9XG4gICAgOmdsb2JhbCguYmFubmVyLXN3aXBlci1zbGlkZS5zd2lwZXItc2xpZGUtbmV4dCkge1xuICAgICAgLy8gdHJhbnNmb3JtOiBzY2FsZSgwLjgpO1xuICAgICAgQGFwcGx5IG9yaWdpbi1sZWZ0O1xuICAgIH1cbiAgICA6Z2xvYmFsKC5zd2lwZXItc2xpZGUtYWN0aXZlKSB7XG4gICAgICBAYXBwbHkgb3BhY2l0eS0xMDA7XG4gICAgICAvLyB0cmFuc2Zvcm06IHNjYWxlKDEpIHRyYW5zbGF0ZVgoMCk7XG4gICAgfVxuICAgIDpnbG9iYWwoLnN3aXBlci1idXR0b24tbmV4dCl7XG4gICAgICBAYXBwbHkgLXJpZ2h0LTQgbWQ6cmlnaHQtMCAzeGw6cmlnaHQtW2NhbGMoKDEwMCUtMTIwMHB4KS8yLTE2cHgpXTtcbiAgICB9XG4gICAgOmdsb2JhbCguc3dpcGVyLWJ1dHRvbi1wcmV2KXtcbiAgICAgIEBhcHBseSAtbGVmdC00IG1kOmxlZnQtMCAzeGw6bGVmdC1bY2FsYygoMTAwJS0xMjAwcHgpLzItMTZweCldO1xuICAgIH1cbiAgfVxuICA6Z2xvYmFsKC5zd2lwZXIuZmVhdHVyZS1zd2lwZXIpIHtcbiAgICA6Z2xvYmFsKC5zd2lwZXItYnV0dG9uLW5leHQpe1xuICAgICAgQGFwcGx5IHJpZ2h0LTA7XG4gICAgfVxuICAgIDpnbG9iYWwoLnN3aXBlci1idXR0b24tcHJldil7XG4gICAgICBAYXBwbHkgbGVmdC0wO1xuICAgIH1cbiAgICA6Z2xvYmFsKC5zd2lwZXItYnV0dG9uLWRpc2FibGVkKSB7XG4gICAgICBAYXBwbHkgaGlkZGVuO1xuICAgIH1cbiAgfVxuICA6Z2xvYmFsKC5zd2lwZXIucGF0cm9uLWJhZGdlLXN3aXBlcikge1xuICAgIDpnbG9iYWwoLnN3aXBlci1idXR0b24tbmV4dCl7XG4gICAgICBAYXBwbHkgcmlnaHQtMDtcbiAgICB9XG4gICAgOmdsb2JhbCguc3dpcGVyLWJ1dHRvbi1wcmV2KXtcbiAgICAgIEBhcHBseSBsZWZ0LTA7XG4gICAgfVxuICAgIDpnbG9iYWwoLnN3aXBlci1idXR0b24tZGlzYWJsZWQpIHtcbiAgICAgIEBhcHBseSBoaWRkZW47XG4gICAgfVxuICB9XG4gIDpnbG9iYWwoLnN3aXBlci5ncmlkLXN3aXBlcikge1xuICAgIDpnbG9iYWwoLnN3aXBlci13cmFwcGVyKSB7XG4gICAgICBAYXBwbHkgdy1bMTAwdnddIG1kOnctZnVsbCBmbGV4LXdyYXAgZmxleC1jb2wgbS0wO1xuICAgIH1cbiAgfVxuICA6Z2xvYmFsKC5zd2lwZXIpIHtcbiAgICBcbiAgICA6Z2xvYmFsKC5zd2lwZXItYnV0dG9uLW5leHQpe1xuICAgICAgQGFwcGx5IGhpZGRlbiBtZDpmbGV4IGp1c3RpZnktY2VudGVyIGl0ZW1zLWNlbnRlciBhYnNvbHV0ZSB0b3AtWzUwJV0gdy04IGgtOCBmb250LXNlbWlib2xkIHRleHQtQ29sb3JzLUZvcmVncm91bmQtRGVmYXVsdCBib3JkZXIgYm9yZGVyLUNvbG9ycy1Cb3JkZXItRGVmYXVsdCBiZy1Db2xvcnMtQmFja2dyb3VuZC1Ob3JtYWwtUHJpbWFyeS1EZWZhdWx0IHJvdW5kZWQtZnVsbCBjdXJzb3ItcG9pbnRlciBob3ZlcjpiZy1Db2xvcnMtQmFja2dyb3VuZC1Ob3JtYWwtUHJpbWFyeS1Ib3ZlciBhY3RpdmU6YmctQ29sb3JzLUJhY2tncm91bmQtTm9ybWFsLVByaW1hcnktQWN0aXZlO1xuICAgICAgICAmOjphZnRlciB7XG4gICAgICAgICAgQGFwcGx5IHRleHQtQ29sb3JzLUZvcmVncm91bmQtRGVmYXVsdCB0ZXh0LXhzIGZvbnQtYm9sZDtcbiAgICAgICAgfVxuICAgICAgfVxuICAgIDpnbG9iYWwoLnN3aXBlci1idXR0b24tcHJldil7XG4gICAgICBAYXBwbHkgaGlkZGVuIG1kOmZsZXgganVzdGlmeS1jZW50ZXIgaXRlbXMtY2VudGVyIGFic29sdXRlIHRvcC1bNTAlXSB3LTggaC04IGZvbnQtc2VtaWJvbGQgdGV4dC1Db2xvcnMtRm9yZWdyb3VuZC1EZWZhdWx0IGJvcmRlciBib3JkZXItQ29sb3JzLUJvcmRlci1EZWZhdWx0IGJnLUNvbG9ycy1CYWNrZ3JvdW5kLU5vcm1hbC1QcmltYXJ5LURlZmF1bHQgcm91bmRlZC1mdWxsIGN1cnNvci1wb2ludGVyIGhvdmVyOmJnLUNvbG9ycy1CYWNrZ3JvdW5kLU5vcm1hbC1QcmltYXJ5LUhvdmVyIGFjdGl2ZTpiZy1Db2xvcnMtQmFja2dyb3VuZC1Ob3JtYWwtUHJpbWFyeS1BY3RpdmU7XG4gICAgICAgICY6OmFmdGVyIHtcbiAgICAgICAgICBAYXBwbHkgdGV4dC1Db2xvcnMtRm9yZWdyb3VuZC1EZWZhdWx0IHRleHQteHMgZm9udC1ib2xkO1xuICAgICAgfVxuICAgIH1cbiAgfVxufVxuXG4uYW5pbWF0ZSB7XG4gIDpnbG9iYWwoLnN3aXBlci1zbGlkZSkge1xuICAgIHRyYW5zaXRpb246IHRyYW5zZm9ybSA1MDBtcyBsaW5lYXI7XG4gIH1cbn1cbiJdfQ== */';
+var index_module_default = '.swiperBox {\n  @apply w-full h-fit;\n}\n.swiperBox :global(.swiper) :global(.swiper-button-prev) {\n  @apply bg-contain bg-no-repeat;\n  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0iIzQxNDM0NSIgY2xhc3M9InNpemUtNSI+CiAgPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNMTEuNzggNS4yMmEuNzUuNzUgMCAwIDEgMCAxLjA2TDguMDYgMTBsMy43MiAzLjcyYS43NS43NSAwIDEgMS0xLjA2IDEuMDZsLTQuMjUtNC4yNWEuNzUuNzUgMCAwIDEgMC0xLjA2bDQuMjUtNC4yNWEuNzUuNzUgMCAwIDEgMS4wNiAwWiIgY2xpcC1ydWxlPSJldmVub2RkIiAvPgo8L3N2Zz4K");\n}\n.swiperBox :global(.swiper) :global(.swiper-button-next) {\n  @apply bg-contain bg-no-repeat;\n  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0iIzQxNDM0NSIgY2xhc3M9InNpemUtNSI+CiAgPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNOC4yMiA1LjIyYS43NS43NSAwIDAgMSAxLjA2IDBsNC4yNSA0LjI1YS43NS43NSAwIDAgMSAwIDEuMDZsLTQuMjUgNC4yNWEuNzUuNzUgMCAwIDEtMS4wNi0xLjA2TDExLjk0IDEwIDguMjIgNi4yOGEuNzUuNzUgMCAwIDEgMC0xLjA2WiIgY2xpcC1ydWxlPSJldmVub2RkIiAvPgo8L3N2Zz4KCg==");\n}\n.swiperBox :global(.swiper) :global(.swiper-button-prev::after) {\n  @apply text-Colors-Foreground-Default content-none;\n}\n.swiperBox :global(.swiper) :global(.swiper-button-next::after) {\n  @apply text-Colors-Foreground-Default content-none;\n}\n.swiperBox :global(.swiper.banner-swiper) :global(.banner-swiper-slide.swiper-slide-prev) {\n  @apply origin-right;\n}\n.swiperBox :global(.swiper.banner-swiper) :global(.banner-swiper-slide.swiper-slide-next) {\n  @apply origin-left;\n}\n.swiperBox :global(.swiper.banner-swiper) :global(.swiper-slide-active) {\n  @apply opacity-100;\n}\n.swiperBox :global(.swiper.banner-swiper) :global(.swiper-button-next) {\n  @apply -right-4 md:right-0 3xl:right-[calc((100%-1200px)/2-16px)];\n}\n.swiperBox :global(.swiper.banner-swiper) :global(.swiper-button-prev) {\n  @apply -left-4 md:left-0 3xl:left-[calc((100%-1200px)/2-16px)];\n}\n.swiperBox :global(.swiper.feature-swiper) :global(.swiper-button-next) {\n  @apply right-0;\n}\n.swiperBox :global(.swiper.feature-swiper) :global(.swiper-button-prev) {\n  @apply left-0;\n}\n.swiperBox :global(.swiper.feature-swiper) :global(.swiper-button-disabled) {\n  @apply hidden;\n}\n.swiperBox :global(.swiper.patron-badge-swiper) :global(.swiper-button-next) {\n  @apply right-0;\n}\n.swiperBox :global(.swiper.patron-badge-swiper) :global(.swiper-button-prev) {\n  @apply left-0;\n}\n.swiperBox :global(.swiper.patron-badge-swiper) :global(.swiper-button-disabled) {\n  @apply hidden;\n}\n.swiperBox :global(.swiper.grid-swiper) :global(.swiper-wrapper) {\n  @apply w-[100vw] md:w-full flex-wrap flex-col m-0;\n}\n.swiperBox :global(.swiper) :global(.swiper-button-next) {\n  @apply hidden md:flex justify-center items-center absolute top-[50%] w-8 h-8 font-semibold text-Colors-Foreground-Default border border-Colors-Border-Default bg-Colors-Background-Normal-Primary-Default rounded-full cursor-pointer hover:bg-Colors-Background-Normal-Primary-Hover active:bg-Colors-Background-Normal-Primary-Active;\n}\n.swiperBox :global(.swiper) :global(.swiper-button-next)::after {\n  @apply text-Colors-Foreground-Default text-xs font-bold;\n}\n.swiperBox :global(.swiper) :global(.swiper-button-prev) {\n  @apply hidden md:flex justify-center items-center absolute top-[50%] w-8 h-8 font-semibold text-Colors-Foreground-Default border border-Colors-Border-Default bg-Colors-Background-Normal-Primary-Default rounded-full cursor-pointer hover:bg-Colors-Background-Normal-Primary-Hover active:bg-Colors-Background-Normal-Primary-Active;\n}\n.swiperBox :global(.swiper) :global(.swiper-button-prev)::after {\n  @apply text-Colors-Foreground-Default text-xs font-bold;\n}\n\n.animate :global(.swiper-slide) {\n  transition: transform 500ms linear;\n}\n/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VSb290IjoiL1VzZXJzL21vbmljYS9EZXNrdG9wL215c2hlbGwvbXlzaGVsbC1yZWFjdC1saWIvc3JjL2NvbXBvbmVudHMvc3dpcGVyIiwic291cmNlcyI6WyJpbmRleC5tb2R1bGUuc2NzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTtFQUNFOztBQUdFO0VBQ0U7RUFDQTs7QUFFRjtFQUNFO0VBQ0E7O0FBRUY7RUFDRTs7QUFFRjtFQUNFOztBQUlGO0VBRUU7O0FBRUY7RUFFRTs7QUFFRjtFQUNFOztBQUdGO0VBQ0U7O0FBRUY7RUFDRTs7QUFJRjtFQUNFOztBQUVGO0VBQ0U7O0FBRUY7RUFDRTs7QUFJRjtFQUNFOztBQUVGO0VBQ0U7O0FBRUY7RUFDRTs7QUFJRjtFQUNFOztBQUtGO0VBQ0U7O0FBQ0U7RUFDRTs7QUFHTjtFQUNFOztBQUNFO0VBQ0U7OztBQU9SO0VBQ0UiLCJzb3VyY2VzQ29udGVudCI6WyIuc3dpcGVyQm94e1xuICBAYXBwbHkgdy1mdWxsIGgtZml0O1xuICBcbiAgOmdsb2JhbCguc3dpcGVyKSB7XG4gICAgOmdsb2JhbCguc3dpcGVyLWJ1dHRvbi1wcmV2KXtcbiAgICAgIEBhcHBseSBiZy1jb250YWluIGJnLW5vLXJlcGVhdDtcbiAgICAgIGJhY2tncm91bmQtaW1hZ2U6IHVybCgnZGF0YTppbWFnZS9zdmcreG1sO2Jhc2U2NCxQSE4yWnlCNGJXeHVjejBpYUhSMGNEb3ZMM2QzZHk1M015NXZjbWN2TWpBd01DOXpkbWNpSUhacFpYZENiM2c5SWpBZ01DQXlNQ0F5TUNJZ1ptbHNiRDBpSXpReE5ETTBOU0lnWTJ4aGMzTTlJbk5wZW1VdE5TSStDaUFnUEhCaGRHZ2dabWxzYkMxeWRXeGxQU0psZG1WdWIyUmtJaUJrUFNKTk1URXVOemdnTlM0eU1tRXVOelV1TnpVZ01DQXdJREVnTUNBeExqQTJURGd1TURZZ01UQnNNeTQzTWlBekxqY3lZUzQzTlM0M05TQXdJREVnTVMweExqQTJJREV1TURac0xUUXVNalV0TkM0eU5XRXVOelV1TnpVZ01DQXdJREVnTUMweExqQTJiRFF1TWpVdE5DNHlOV0V1TnpVdU56VWdNQ0F3SURFZ01TNHdOaUF3V2lJZ1kyeHBjQzF5ZFd4bFBTSmxkbVZ1YjJSa0lpQXZQZ284TDNOMlp6NEsnKTsgXG4gICAgfVxuICAgIDpnbG9iYWwoLnN3aXBlci1idXR0b24tbmV4dCl7XG4gICAgICBAYXBwbHkgYmctY29udGFpbiBiZy1uby1yZXBlYXQ7XG4gICAgICBiYWNrZ3JvdW5kLWltYWdlOiB1cmwoJ2RhdGE6aW1hZ2Uvc3ZnK3htbDtiYXNlNjQsUEhOMlp5QjRiV3h1Y3owaWFIUjBjRG92TDNkM2R5NTNNeTV2Y21jdk1qQXdNQzl6ZG1jaUlIWnBaWGRDYjNnOUlqQWdNQ0F5TUNBeU1DSWdabWxzYkQwaUl6UXhORE0wTlNJZ1kyeGhjM005SW5OcGVtVXROU0krQ2lBZ1BIQmhkR2dnWm1sc2JDMXlkV3hsUFNKbGRtVnViMlJrSWlCa1BTSk5PQzR5TWlBMUxqSXlZUzQzTlM0M05TQXdJREFnTVNBeExqQTJJREJzTkM0eU5TQTBMakkxWVM0M05TNDNOU0F3SURBZ01TQXdJREV1TURac0xUUXVNalVnTkM0eU5XRXVOelV1TnpVZ01DQXdJREV0TVM0d05pMHhMakEyVERFeExqazBJREV3SURndU1qSWdOaTR5T0dFdU56VXVOelVnTUNBd0lERWdNQzB4TGpBMldpSWdZMnhwY0MxeWRXeGxQU0psZG1WdWIyUmtJaUF2UGdvOEwzTjJaejRLQ2c9PScpOyBcbiAgICB9XG4gICAgOmdsb2JhbCguc3dpcGVyLWJ1dHRvbi1wcmV2OjphZnRlcil7XG4gICAgICBAYXBwbHkgdGV4dC1Db2xvcnMtRm9yZWdyb3VuZC1EZWZhdWx0IGNvbnRlbnQtbm9uZTtcbiAgICB9XG4gICAgOmdsb2JhbCguc3dpcGVyLWJ1dHRvbi1uZXh0OjphZnRlcil7XG4gICAgICBAYXBwbHkgdGV4dC1Db2xvcnMtRm9yZWdyb3VuZC1EZWZhdWx0IGNvbnRlbnQtbm9uZTtcbiAgICB9XG4gIH1cbiAgOmdsb2JhbCguc3dpcGVyLmJhbm5lci1zd2lwZXIpIHtcbiAgICA6Z2xvYmFsKC5iYW5uZXItc3dpcGVyLXNsaWRlLnN3aXBlci1zbGlkZS1wcmV2KSB7XG4gICAgICAvLyB0cmFuc2Zvcm06IHNjYWxlKDAuOCk7XG4gICAgICBAYXBwbHkgb3JpZ2luLXJpZ2h0O1xuICAgIH1cbiAgICA6Z2xvYmFsKC5iYW5uZXItc3dpcGVyLXNsaWRlLnN3aXBlci1zbGlkZS1uZXh0KSB7XG4gICAgICAvLyB0cmFuc2Zvcm06IHNjYWxlKDAuOCk7XG4gICAgICBAYXBwbHkgb3JpZ2luLWxlZnQ7XG4gICAgfVxuICAgIDpnbG9iYWwoLnN3aXBlci1zbGlkZS1hY3RpdmUpIHtcbiAgICAgIEBhcHBseSBvcGFjaXR5LTEwMDtcbiAgICAgIC8vIHRyYW5zZm9ybTogc2NhbGUoMSkgdHJhbnNsYXRlWCgwKTtcbiAgICB9XG4gICAgOmdsb2JhbCguc3dpcGVyLWJ1dHRvbi1uZXh0KXtcbiAgICAgIEBhcHBseSAtcmlnaHQtNCBtZDpyaWdodC0wIDN4bDpyaWdodC1bY2FsYygoMTAwJS0xMjAwcHgpLzItMTZweCldO1xuICAgIH1cbiAgICA6Z2xvYmFsKC5zd2lwZXItYnV0dG9uLXByZXYpe1xuICAgICAgQGFwcGx5IC1sZWZ0LTQgbWQ6bGVmdC0wIDN4bDpsZWZ0LVtjYWxjKCgxMDAlLTEyMDBweCkvMi0xNnB4KV07XG4gICAgfVxuICB9XG4gIDpnbG9iYWwoLnN3aXBlci5mZWF0dXJlLXN3aXBlcikge1xuICAgIDpnbG9iYWwoLnN3aXBlci1idXR0b24tbmV4dCl7XG4gICAgICBAYXBwbHkgcmlnaHQtMDtcbiAgICB9XG4gICAgOmdsb2JhbCguc3dpcGVyLWJ1dHRvbi1wcmV2KXtcbiAgICAgIEBhcHBseSBsZWZ0LTA7XG4gICAgfVxuICAgIDpnbG9iYWwoLnN3aXBlci1idXR0b24tZGlzYWJsZWQpIHtcbiAgICAgIEBhcHBseSBoaWRkZW47XG4gICAgfVxuICB9XG4gIDpnbG9iYWwoLnN3aXBlci5wYXRyb24tYmFkZ2Utc3dpcGVyKSB7XG4gICAgOmdsb2JhbCguc3dpcGVyLWJ1dHRvbi1uZXh0KXtcbiAgICAgIEBhcHBseSByaWdodC0wO1xuICAgIH1cbiAgICA6Z2xvYmFsKC5zd2lwZXItYnV0dG9uLXByZXYpe1xuICAgICAgQGFwcGx5IGxlZnQtMDtcbiAgICB9XG4gICAgOmdsb2JhbCguc3dpcGVyLWJ1dHRvbi1kaXNhYmxlZCkge1xuICAgICAgQGFwcGx5IGhpZGRlbjtcbiAgICB9XG4gIH1cbiAgOmdsb2JhbCguc3dpcGVyLmdyaWQtc3dpcGVyKSB7XG4gICAgOmdsb2JhbCguc3dpcGVyLXdyYXBwZXIpIHtcbiAgICAgIEBhcHBseSB3LVsxMDB2d10gbWQ6dy1mdWxsIGZsZXgtd3JhcCBmbGV4LWNvbCBtLTA7XG4gICAgfVxuICB9XG4gIDpnbG9iYWwoLnN3aXBlcikge1xuICAgIFxuICAgIDpnbG9iYWwoLnN3aXBlci1idXR0b24tbmV4dCl7XG4gICAgICBAYXBwbHkgaGlkZGVuIG1kOmZsZXgganVzdGlmeS1jZW50ZXIgaXRlbXMtY2VudGVyIGFic29sdXRlIHRvcC1bNTAlXSB3LTggaC04IGZvbnQtc2VtaWJvbGQgdGV4dC1Db2xvcnMtRm9yZWdyb3VuZC1EZWZhdWx0IGJvcmRlciBib3JkZXItQ29sb3JzLUJvcmRlci1EZWZhdWx0IGJnLUNvbG9ycy1CYWNrZ3JvdW5kLU5vcm1hbC1QcmltYXJ5LURlZmF1bHQgcm91bmRlZC1mdWxsIGN1cnNvci1wb2ludGVyIGhvdmVyOmJnLUNvbG9ycy1CYWNrZ3JvdW5kLU5vcm1hbC1QcmltYXJ5LUhvdmVyIGFjdGl2ZTpiZy1Db2xvcnMtQmFja2dyb3VuZC1Ob3JtYWwtUHJpbWFyeS1BY3RpdmU7XG4gICAgICAgICY6OmFmdGVyIHtcbiAgICAgICAgICBAYXBwbHkgdGV4dC1Db2xvcnMtRm9yZWdyb3VuZC1EZWZhdWx0IHRleHQteHMgZm9udC1ib2xkO1xuICAgICAgICB9XG4gICAgICB9XG4gICAgOmdsb2JhbCguc3dpcGVyLWJ1dHRvbi1wcmV2KXtcbiAgICAgIEBhcHBseSBoaWRkZW4gbWQ6ZmxleCBqdXN0aWZ5LWNlbnRlciBpdGVtcy1jZW50ZXIgYWJzb2x1dGUgdG9wLVs1MCVdIHctOCBoLTggZm9udC1zZW1pYm9sZCB0ZXh0LUNvbG9ycy1Gb3JlZ3JvdW5kLURlZmF1bHQgYm9yZGVyIGJvcmRlci1Db2xvcnMtQm9yZGVyLURlZmF1bHQgYmctQ29sb3JzLUJhY2tncm91bmQtTm9ybWFsLVByaW1hcnktRGVmYXVsdCByb3VuZGVkLWZ1bGwgY3Vyc29yLXBvaW50ZXIgaG92ZXI6YmctQ29sb3JzLUJhY2tncm91bmQtTm9ybWFsLVByaW1hcnktSG92ZXIgYWN0aXZlOmJnLUNvbG9ycy1CYWNrZ3JvdW5kLU5vcm1hbC1QcmltYXJ5LUFjdGl2ZTtcbiAgICAgICAgJjo6YWZ0ZXIge1xuICAgICAgICAgIEBhcHBseSB0ZXh0LUNvbG9ycy1Gb3JlZ3JvdW5kLURlZmF1bHQgdGV4dC14cyBmb250LWJvbGQ7XG4gICAgICB9XG4gICAgfVxuICB9XG59XG5cbi5hbmltYXRlIHtcbiAgOmdsb2JhbCguc3dpcGVyLXNsaWRlKSB7XG4gICAgdHJhbnNpdGlvbjogdHJhbnNmb3JtIDUwMG1zIGxpbmVhcjtcbiAgfVxufVxuIl19 */';
 // src/components/swiper/index.tsx
 import { jsx as jsx71 } from "react/jsx-runtime";
 var swiperVariants = cva22("", {
@@ -25344,7 +25524,7 @@ function Swiper(props) {
     var isGrid = swiperType === "grid";
     var router = useRouter2();
     var Com = component || "div";
-    var swiperList = useMemo6(function() {
+    var swiperList = useMemo7(function() {
         var length = dataList.length;
         if (length < 2 || isGrid || isFeatured) {
             return dataList;
@@ -25359,7 +25539,7 @@ function Swiper(props) {
     var autoPlayOptions = {
         delay: delay
     };
-    var swiperRef = useRef11();
+    var swiperRef = useRef12();
     var fgconfigs = {
         0: {
             slidesPerView: 1.014,
@@ -25423,8 +25603,8 @@ function Swiper(props) {
             Grid
         ]
     });
-    var _useState14 = _sliced_to_array(useState14(false), 2), animate = _useState14[0], setAnimate = _useState14[1];
-    useEffect15(function() {
+    var _useState15 = _sliced_to_array(useState15(false), 2), animate = _useState15[0], setAnimate = _useState15[1];
+    useEffect16(function() {
         setTimeout(function() {
             setAnimate(true);
         }, 200);
@@ -25494,25 +25674,25 @@ function CustomNotification(param) {
     return /* @__PURE__ */ jsx72("div", {
         children: /* @__PURE__ */ jsx72("div", {
             id: id,
-            className: "z-[10000000] min-h-10 w-fit max-w-[90vw] rounded-full border border-Colors-Border-Opaque bg-Colors-Background-Utilities-Modal px-3 py-2 shadow-modal-default md:max-w-[560px]",
+            className: "z-[10000000] min-h-10 w-fit max-w-[90vw] rounded-full border border-cc-Popover-border bg-Colors-Background-Utilities-Modal px-3 py-2 shadow-modal-default md:max-w-[560px]",
             children: /* @__PURE__ */ jsxs48("div", {
                 className: "flex w-full items-center justify-center gap-2",
                 children: [
                     loading && /* @__PURE__ */ jsx72(Spinner, {}),
                     !loading && type && /* @__PURE__ */ jsxs48("div", {
-                        className: "flex flex-shrink-0 items-center",
+                        className: "flex flex-shrink-0 items-center justify-center",
                         children: [
                             type === "info" && /* @__PURE__ */ jsx72(CircleInfoIcon, {
-                                className: "h-6 w-6 text-cc-Icon-Featured-icon-fg-Info"
+                                className: "h-6 w-6 text-cc-Icon-Featured-icon-fg-Info  items-center justify-center"
                             }),
                             type === "success" && /* @__PURE__ */ jsx72(CircleSuccessIcon, {
-                                className: "h-6 w-6 text-cc-Icon-Featured-icon-fg-Success"
+                                className: "h-6 w-6 text-cc-Icon-Featured-icon-fg-Success  items-center justify-center"
                             }),
                             type === "warning" && /* @__PURE__ */ jsx72(CircleWarningIcon, {
-                                className: "h-6 w-6 text-cc-Icon-Featured-icon-fg-Warning"
+                                className: "h-6 w-6 text-cc-Icon-Featured-icon-fg-Warning  items-center justify-center"
                             }),
                             type === "error" && /* @__PURE__ */ jsx72(CircleErrorIcon, {
-                                className: "h-6 w-6 text-cc-Icon-Featured-icon-fg-Error"
+                                className: "h-6 w-6 text-cc-Icon-Featured-icon-fg-Error  items-center justify-center"
                             })
                         ]
                     }),
@@ -25559,11 +25739,11 @@ function CustomNotification(param) {
     });
 }
 // src/common/hooks/useNotification.tsx
-import { useCallback as useCallback6 } from "react";
+import { useCallback as useCallback7 } from "react";
 import { toast as toast3 } from "react-hot-toast";
 import { jsx as jsx73 } from "react/jsx-runtime";
 function useNotification() {
-    var addToast = useCallback6(function(config2, duration2) {
+    var addToast = useCallback7(function(config2, duration2) {
         if (config2.id) {
             toast3.remove(config2.id);
         }
@@ -25579,30 +25759,30 @@ function useNotification() {
             duration: duration2
         });
     }, []);
-    var message = useCallback6(function(config2, duration2) {
+    var message = useCallback7(function(config2, duration2) {
         return addToast(_object_spread({}, config2), duration2);
     }, []);
-    var success = useCallback6(function(config2, duration2) {
+    var success = useCallback7(function(config2, duration2) {
         return addToast(_object_spread_props(_object_spread({}, config2), {
             type: "success"
         }), duration2);
     }, []);
-    var error = useCallback6(function(config2, duration2) {
+    var error = useCallback7(function(config2, duration2) {
         return addToast(_object_spread_props(_object_spread({}, config2), {
             type: "error"
         }), duration2);
     }, []);
-    var warning = useCallback6(function(config2, duration2) {
+    var warning = useCallback7(function(config2, duration2) {
         return addToast(_object_spread_props(_object_spread({}, config2), {
             type: "warning"
         }), duration2);
     }, []);
-    var info = useCallback6(function(config2, duration2) {
+    var info = useCallback7(function(config2, duration2) {
         return addToast(_object_spread_props(_object_spread({}, config2), {
             type: "info"
         }), duration2);
     }, []);
-    var close = useCallback6(function(id) {
+    var close = useCallback7(function(id) {
         toast3.dismiss(id);
     }, []);
     return {
@@ -25684,7 +25864,7 @@ var Message = /*#__PURE__*/ function() {
     ]);
     return Message;
 }();
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AspectRatio, AudioPlayer, AudioPlaying, Avatar, AvatarImage, AvatarRoot, Badge, Button, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, CaretDownIcon, Cascader, CascaderContent, Checkbox, Chips, CircleErrorIcon, CircleInfoIcon, CircleSuccessIcon, CircleWarningIcon, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, Controller, DataEmptyState, Description, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Display, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, ErrorIcon, ErrorState, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, FormProvider, Guide, Heading, Icon, IconButton, Image2 as Image, ImgEmptyState, Input, Label3 as Label, Link, LinkButton, LogoIcon, LogoLoading, Masonry, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, Message, MiddleBar, Modal, ModalBody, ModalContent, ModalFooter, ModalHeader, ModalOverlay, ModalRoot, ModalTitle, MultipleSelector, NetworkErrorIcon, NetworkErrorState, NoPageIcon, NoPageState, NumberInput, Paragraph, Popover, PopoverAnchor, PopoverContent, PopoverRoot, Progress, ProgressIndicator, ProgressRoot, RadioGroup4 as RadioGroup, RadioGroupItem, ScrollArea, ScrollBar, SearchBar, SearchEmptyState, Select, SelectContent, SelectGroup, SelectIcon, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Skeleton, Slider, SliderPrimitive, SliderSingle, Spinner, State2 as State, SubHeading, SubTitle, Swiper, Switch, Tab, Tabs2 as Tabs, TabsContent, TabsList, TabsRoot, TabsTrigger, Text, Textarea, Title, Toast, ToastAction, ToastClose, ToastDescription, ToastProvider, ToastTitle, ToastViewport, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipProvider, TopNavigationBar, WalletEmptyState, buttonVariants, dangerouText, iconButtonVariants, reducer, toast, toggleVariants, useDebounce, useDevice, useForm, useFormContext, useFormField, useIsMobileByWindowWidth, useNativeBridge, useNotification, useToast, useWatch, useWindowWidth }; /*! Bundled license information:
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AspectRatio, AudioPlayer, AudioPlaying, Avatar, AvatarImage, AvatarRoot, Badge, Button, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, CaretDownIcon, Cascader, CascaderContent, Checkbox, Chips, CircleErrorIcon, CircleInfoIcon, CircleSuccessIcon, CircleWarningIcon, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, Controller, DataEmptyState, Description, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Display, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuHover, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, ErrorIcon, ErrorState, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, FormProvider, Guide, Heading, Icon, IconButton, Image2 as Image, ImgEmptyState, Input, Label3 as Label, Link, LinkButton, LogoIcon, LogoLoading, Masonry, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, Message, MiddleBar, Modal, ModalBody, ModalContent, ModalFooter, ModalHeader, ModalOverlay, ModalRoot, ModalTitle, MultipleSelector, NetworkErrorIcon, NetworkErrorState, NoPageIcon, NoPageState, NumberInput, Paragraph, Popover, PopoverAnchor, PopoverContent, PopoverRoot, Progress, ProgressIndicator, ProgressRoot, RadioGroup4 as RadioGroup, RadioGroupItem, ScrollArea, ScrollBar, SearchBar, SearchEmptyState, Select, SelectContent, SelectGroup, SelectIcon, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Skeleton, Slider, SliderPrimitive, SliderSingle, Spinner, State2 as State, SubHeading, SubTitle, Swiper, Switch, Tab, Tabs2 as Tabs, TabsContent, TabsList, TabsRoot, TabsTrigger, Text, Textarea, Title, Toast, ToastAction, ToastClose, ToastDescription, ToastProvider, ToastTitle, ToastViewport, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipProvider, TopNavigationBar, WalletEmptyState, buttonVariants, dangerouText, iconButtonVariants, reducer, toast, toggleVariants, useDebounce, useDevice, useForm, useFormContext, useFormField, useIsMobileByWindowWidth, useNativeBridge, useNotification, useToast, useWatch, useWindowWidth }; /*! Bundled license information:
 
 decimal.js/decimal.mjs:
   (*!