@ceed/ads 1.2.5 → 1.2.6-next.1

package/dist/index.js

@@ -120,7 +120,7 @@ import {
   CircularProgress as CircularProgress2,
   circularProgressClasses,
   Drawer,
-  drawerClasses,
+  drawerClasses as drawerClasses2,
   LinearProgress as LinearProgress2,
   linearProgressClasses,
   List,
@@ -4211,42 +4211,29 @@ var Divider = (props) => {
 Divider.displayName = "Divider";
 
 // src/components/InsetDrawer/InsetDrawer.tsx
-import React28 from "react";
-import { Drawer as JoyDrawer } from "@mui/joy";
-import { motion as motion26 } from "framer-motion";
-var MotionDrawer = motion26(JoyDrawer);
-var InsetDrawer = (props) => {
-  const { children, ...innerProps } = props;
-  return /* @__PURE__ */ React28.createElement(
-    MotionDrawer,
-    {
-      ...innerProps,
-      slotProps: {
-        ...innerProps.slotProps,
-        content: {
-          ...innerProps.slotProps?.content,
-          sx: {
-            bgcolor: "transparent",
-            p: { md: 3, sm: 0 },
-            boxShadow: "none"
-          }
-        }
-      }
-    },
-    children
-  );
-};
-InsetDrawer.displayName = "InsetDrawer";
+import { Drawer as JoyDrawer, styled as styled18, drawerClasses } from "@mui/joy";
+var InsetDrawer = styled18(JoyDrawer)(({ theme }) => ({
+  [`& .${drawerClasses.content}`]: {
+    backgroundColor: "transparent",
+    boxShadow: "none",
+    padding: 0,
+    width: "100%",
+    [theme.breakpoints.up("md")]: {
+      padding: theme.spacing(3),
+      width: "auto"
+    }
+  }
+}));
 
 // src/components/Uploader/Uploader.tsx
-import React29, {
+import React28, {
   useCallback as useCallback11,
   useEffect as useEffect7,
   useMemo as useMemo10,
   useRef as useRef6,
   useState as useState8
 } from "react";
-import { styled as styled18, Input as Input2 } from "@mui/joy";
+import { styled as styled19, Input as Input2 } from "@mui/joy";
 import MuiFileUploadIcon from "@mui/icons-material/CloudUploadRounded";
 import MuiUploadFileIcon from "@mui/icons-material/UploadFileRounded";
 import MuiClearIcon from "@mui/icons-material/ClearRounded";
@@ -4268,7 +4255,7 @@ var esmFiles = {
     "@atlaskit/pragmatic-drag-and-drop/dist/esm/entry-point/prevent-unhandled.js"
   )
 };
-var VisuallyHiddenInput = styled18(Input2)({
+var VisuallyHiddenInput = styled19(Input2)({
   width: "1px",
   height: "1px",
   overflow: "hidden",
@@ -4277,18 +4264,18 @@ var VisuallyHiddenInput = styled18(Input2)({
   clipPath: "inset(50%)",
   position: "absolute"
 });
-var PreviewRoot = styled18(Stack_default, {
+var PreviewRoot = styled19(Stack_default, {
   name: "Uploader",
   slot: "PreviewRoot"
 })({});
-var UploadCard = styled18(Card, {
+var UploadCard = styled19(Card, {
   name: "Uploader",
   slot: "UploadCard"
 })(({ theme }) => ({
   padding: theme.spacing(2.5),
   border: `1px solid ${theme.palette.neutral.outlinedBorder}`
 }));
-var UploadFileIcon = styled18(MuiUploadFileIcon, {
+var UploadFileIcon = styled19(MuiUploadFileIcon, {
   name: "Uploader",
   slot: "UploadFileIcon"
 })(({ theme }) => ({
@@ -4296,7 +4283,7 @@ var UploadFileIcon = styled18(MuiUploadFileIcon, {
   width: "32px",
   height: "32px"
 }));
-var ClearIcon2 = styled18(MuiClearIcon, {
+var ClearIcon2 = styled19(MuiClearIcon, {
   name: "Uploader",
   slot: "ClearIcon"
 })(({ theme }) => ({
@@ -4363,7 +4350,7 @@ var getFileSize = (n) => {
 };
 var Preview = (props) => {
   const { files, uploaded, onDelete } = props;
-  return /* @__PURE__ */ React29.createElement(PreviewRoot, { gap: 1 }, [...uploaded, ...files].map((file) => /* @__PURE__ */ React29.createElement(UploadCard, { key: file.name, size: "sm", color: "neutral" }, /* @__PURE__ */ React29.createElement(Stack_default, { direction: "row", alignItems: "center", gap: 2 }, /* @__PURE__ */ React29.createElement(UploadFileIcon, null), /* @__PURE__ */ React29.createElement(Stack_default, { flex: "1" }, /* @__PURE__ */ React29.createElement(Typography_default, { level: "body-sm", textColor: "common.black" }, file.name), !!file.size && /* @__PURE__ */ React29.createElement(
+  return /* @__PURE__ */ React28.createElement(PreviewRoot, { gap: 1 }, [...uploaded, ...files].map((file) => /* @__PURE__ */ React28.createElement(UploadCard, { key: file.name, size: "sm", color: "neutral" }, /* @__PURE__ */ React28.createElement(Stack_default, { direction: "row", alignItems: "center", gap: 2 }, /* @__PURE__ */ React28.createElement(UploadFileIcon, null), /* @__PURE__ */ React28.createElement(Stack_default, { flex: "1" }, /* @__PURE__ */ React28.createElement(Typography_default, { level: "body-sm", textColor: "common.black" }, file.name), !!file.size && /* @__PURE__ */ React28.createElement(
     Typography_default,
     {
       level: "body-xs",
@@ -4372,15 +4359,15 @@ var Preview = (props) => {
       textColor: "text.tertiary"
     },
     getFileSize(file.size)
-  )), /* @__PURE__ */ React29.createElement(IconButton_default, { onClick: () => onDelete?.(file) }, /* @__PURE__ */ React29.createElement(ClearIcon2, null))))));
+  )), /* @__PURE__ */ React28.createElement(IconButton_default, { onClick: () => onDelete?.(file) }, /* @__PURE__ */ React28.createElement(ClearIcon2, null))))));
 };
-var UploaderRoot = styled18(Stack_default, {
+var UploaderRoot = styled19(Stack_default, {
   name: "Uploader",
   slot: "root"
 })(({ theme }) => ({
   gap: theme.spacing(2)
 }));
-var FileDropZone = styled18(Sheet_default, {
+var FileDropZone = styled19(Sheet_default, {
   name: "Uploader",
   slot: "dropZone",
   shouldForwardProp: (prop) => prop !== "error"
@@ -4398,7 +4385,7 @@ var FileDropZone = styled18(Sheet_default, {
     border: error ? `1px solid ${theme.palette.danger.outlinedBorder}` : state === "idle" ? `1px solid ${theme.palette.neutral.outlinedBorder}` : `1px solid ${theme.palette.primary.outlinedBorder}`
   })
 );
-var UploaderIcon = styled18(MuiFileUploadIcon, {
+var UploaderIcon = styled19(MuiFileUploadIcon, {
   name: "Uploader",
   slot: "iconContainer",
   shouldForwardProp: (prop) => prop !== "error"
@@ -4409,7 +4396,7 @@ var UploaderIcon = styled18(MuiFileUploadIcon, {
     height: "32px"
   })
 );
-var Uploader = React29.memo(
+var Uploader = React28.memo(
   (props) => {
     const {
       accept,
@@ -4634,7 +4621,7 @@ var Uploader = React29.memo(
     const handleUploaderButtonClick = useCallback11(() => {
       inputRef.current?.click();
     }, []);
-    const uploader = /* @__PURE__ */ React29.createElement(
+    const uploader = /* @__PURE__ */ React28.createElement(
       FileDropZone,
       {
         state: previewState,
@@ -4642,8 +4629,8 @@ var Uploader = React29.memo(
         ref: dropZoneRef,
         onClick: handleUploaderButtonClick
       },
-      /* @__PURE__ */ React29.createElement(Stack_default, { alignItems: "center", gap: 1 }, /* @__PURE__ */ React29.createElement(UploaderIcon, { state: previewState, error: !!(error || errorText) })),
-      /* @__PURE__ */ React29.createElement(
+      /* @__PURE__ */ React28.createElement(Stack_default, { alignItems: "center", gap: 1 }, /* @__PURE__ */ React28.createElement(UploaderIcon, { state: previewState, error: !!(error || errorText) })),
+      /* @__PURE__ */ React28.createElement(
         VisuallyHiddenInput,
         {
           disabled,
@@ -4668,7 +4655,7 @@ var Uploader = React29.memo(
         }
       )
     );
-    return /* @__PURE__ */ React29.createElement(UploaderRoot, null, showDropZone && /* @__PURE__ */ React29.createElement(
+    return /* @__PURE__ */ React28.createElement(UploaderRoot, null, showDropZone && /* @__PURE__ */ React28.createElement(
       FormControl_default,
       {
         size,
@@ -4676,10 +4663,10 @@ var Uploader = React29.memo(
         disabled,
         required: !!minCount
       },
-      label && /* @__PURE__ */ React29.createElement(FormLabel_default, null, label),
+      label && /* @__PURE__ */ React28.createElement(FormLabel_default, null, label),
       uploader,
-      /* @__PURE__ */ React29.createElement(FormHelperText_default, null, /* @__PURE__ */ React29.createElement(Stack_default, null, errorText && /* @__PURE__ */ React29.createElement("div", null, errorText), /* @__PURE__ */ React29.createElement("div", null, helperText)))
-    ), [...uploaded, ...files].length > 0 && /* @__PURE__ */ React29.createElement(
+      /* @__PURE__ */ React28.createElement(FormHelperText_default, null, /* @__PURE__ */ React28.createElement(Stack_default, null, errorText && /* @__PURE__ */ React28.createElement("div", null, errorText), /* @__PURE__ */ React28.createElement("div", null, helperText)))
+    ), [...uploaded, ...files].length > 0 && /* @__PURE__ */ React28.createElement(
       Preview,
       {
         files,
@@ -4695,7 +4682,7 @@ Uploader.displayName = "Uploader";
 import { Grid } from "@mui/joy";
 
 // src/components/Markdown/Markdown.tsx
-import React30, { lazy, Suspense, useEffect as useEffect8, useState as useState9 } from "react";
+import React29, { lazy, Suspense, useEffect as useEffect8, useState as useState9 } from "react";
 import { Skeleton } from "@mui/joy";
 import { Link as Link2 } from "@mui/joy";
 var LazyReactMarkdown = lazy(() => import("react-markdown"));
@@ -4723,7 +4710,7 @@ var Markdown = (props) => {
   if (!rehypeAccent2) {
     return null;
   }
-  return /* @__PURE__ */ React30.createElement(
+  return /* @__PURE__ */ React29.createElement(
     Typography,
     {
       component: "div",
@@ -4732,23 +4719,23 @@ var Markdown = (props) => {
       level: defaultLevel,
       ...innerProps
     },
-    /* @__PURE__ */ React30.createElement(
+    /* @__PURE__ */ React29.createElement(
       Suspense,
       {
-        fallback: fallback || /* @__PURE__ */ React30.createElement(Typography, null, /* @__PURE__ */ React30.createElement(Skeleton, null, content || ""))
+        fallback: fallback || /* @__PURE__ */ React29.createElement(Typography, null, /* @__PURE__ */ React29.createElement(Skeleton, null, content || ""))
       },
-      /* @__PURE__ */ React30.createElement(
+      /* @__PURE__ */ React29.createElement(
         LazyReactMarkdown,
         {
           ...markdownOptions,
           children: content,
           rehypePlugins: [[rehypeAccent2, { accentColor }]],
           components: {
-            h1: ({ children }) => /* @__PURE__ */ React30.createElement(Typography, { color, textColor, level: "h1" }, children),
-            h2: ({ children }) => /* @__PURE__ */ React30.createElement(Typography, { color, textColor, level: "h2" }, children),
-            h3: ({ children }) => /* @__PURE__ */ React30.createElement(Typography, { color, textColor, level: "h3" }, children),
-            h4: ({ children }) => /* @__PURE__ */ React30.createElement(Typography, { color, textColor, level: "h4" }, children),
-            p: ({ children, node }) => /* @__PURE__ */ React30.createElement(
+            h1: ({ children }) => /* @__PURE__ */ React29.createElement(Typography, { color, textColor, level: "h1" }, children),
+            h2: ({ children }) => /* @__PURE__ */ React29.createElement(Typography, { color, textColor, level: "h2" }, children),
+            h3: ({ children }) => /* @__PURE__ */ React29.createElement(Typography, { color, textColor, level: "h3" }, children),
+            h4: ({ children }) => /* @__PURE__ */ React29.createElement(Typography, { color, textColor, level: "h4" }, children),
+            p: ({ children, node }) => /* @__PURE__ */ React29.createElement(
               Typography,
               {
                 color,
@@ -4758,10 +4745,10 @@ var Markdown = (props) => {
               },
               children
             ),
-            a: ({ children, href }) => /* @__PURE__ */ React30.createElement(Link2, { href, target: defaultLinkAction }, children),
-            hr: () => /* @__PURE__ */ React30.createElement(Divider, null),
-            b: ({ children }) => /* @__PURE__ */ React30.createElement(Typography, { fontWeight: boldFontWeight }, children),
-            strong: ({ children }) => /* @__PURE__ */ React30.createElement(Typography, { fontWeight: boldFontWeight }, children),
+            a: ({ children, href }) => /* @__PURE__ */ React29.createElement(Link2, { href, target: defaultLinkAction }, children),
+            hr: () => /* @__PURE__ */ React29.createElement(Divider, null),
+            b: ({ children }) => /* @__PURE__ */ React29.createElement(Typography, { fontWeight: boldFontWeight }, children),
+            strong: ({ children }) => /* @__PURE__ */ React29.createElement(Typography, { fontWeight: boldFontWeight }, children),
             ...markdownOptions?.components
           }
         }
@@ -4772,7 +4759,7 @@ var Markdown = (props) => {
 Markdown.displayName = "Markdown";
 
 // src/components/MenuButton/MenuButton.tsx
-import React31 from "react";
+import React30 from "react";
 import {
   MenuButton as JoyMenuButton2,
   Button as JoyButton2
@@ -4792,7 +4779,7 @@ function MenuButton(props) {
     startDecorator
   } = props;
   if (!items.length) {
-    return /* @__PURE__ */ React31.createElement(
+    return /* @__PURE__ */ React30.createElement(
       JoyButton2,
       {
         component: props.buttonComponent ?? "button",
@@ -4803,12 +4790,12 @@ function MenuButton(props) {
         loading,
         startDecorator,
         ...props.buttonComponentProps ?? {},
-        endDecorator: showIcon ? /* @__PURE__ */ React31.createElement(React31.Fragment, null, endDecorator, /* @__PURE__ */ React31.createElement(ExpandMoreIcon, null)) : /* @__PURE__ */ React31.createElement(React31.Fragment, null, endDecorator)
+        endDecorator: showIcon ? /* @__PURE__ */ React30.createElement(React30.Fragment, null, endDecorator, /* @__PURE__ */ React30.createElement(ExpandMoreIcon, null)) : /* @__PURE__ */ React30.createElement(React30.Fragment, null, endDecorator)
       },
       buttonText
     );
   }
-  return /* @__PURE__ */ React31.createElement(Dropdown_default, null, /* @__PURE__ */ React31.createElement(
+  return /* @__PURE__ */ React30.createElement(Dropdown_default, null, /* @__PURE__ */ React30.createElement(
     JoyMenuButton2,
     {
       component: props.buttonComponent ?? "button",
@@ -4819,10 +4806,10 @@ function MenuButton(props) {
       loading,
       startDecorator,
       ...props.buttonComponentProps ?? {},
-      endDecorator: showIcon ? /* @__PURE__ */ React31.createElement(React31.Fragment, null, endDecorator, /* @__PURE__ */ React31.createElement(ExpandMoreIcon, null)) : /* @__PURE__ */ React31.createElement(React31.Fragment, null, endDecorator)
+      endDecorator: showIcon ? /* @__PURE__ */ React30.createElement(React30.Fragment, null, endDecorator, /* @__PURE__ */ React30.createElement(ExpandMoreIcon, null)) : /* @__PURE__ */ React30.createElement(React30.Fragment, null, endDecorator)
     },
     buttonText
-  ), /* @__PURE__ */ React31.createElement(Menu, { size }, items.map((i) => /* @__PURE__ */ React31.createElement(
+  ), /* @__PURE__ */ React30.createElement(Menu, { size }, items.map((i) => /* @__PURE__ */ React30.createElement(
     MenuItem,
     {
       key: i.text,
@@ -4835,7 +4822,7 @@ function MenuButton(props) {
 MenuButton.displayName = "MenuButton";
 
 // src/components/MonthPicker/MonthPicker.tsx
-import React32, {
+import React31, {
   forwardRef as forwardRef9,
   useCallback as useCallback12,
   useEffect as useEffect9,
@@ -4845,15 +4832,15 @@ import React32, {
 } from "react";
 import { IMaskInput as IMaskInput3, IMask as IMask3 } from "react-imask";
 import CalendarTodayIcon3 from "@mui/icons-material/CalendarToday";
-import { styled as styled19, useThemeProps as useThemeProps6 } from "@mui/joy";
+import { styled as styled20, useThemeProps as useThemeProps6 } from "@mui/joy";
 import { FocusTrap as FocusTrap3, ClickAwayListener as ClickAwayListener3, Popper as Popper4 } from "@mui/base";
-var StyledPopper3 = styled19(Popper4, {
+var StyledPopper3 = styled20(Popper4, {
   name: "MonthPicker",
   slot: "popper"
 })(({ theme }) => ({
   zIndex: theme.zIndex.tooltip
 }));
-var CalendarSheet3 = styled19(Sheet_default, {
+var CalendarSheet3 = styled20(Sheet_default, {
   name: "MonthPicker",
   slot: "sheet",
   overridesResolver: (props, styles) => styles.root
@@ -4862,7 +4849,7 @@ var CalendarSheet3 = styled19(Sheet_default, {
   boxShadow: theme.shadow.md,
   borderRadius: theme.radius.md
 }));
-var MonthPickerRoot = styled19("div", {
+var MonthPickerRoot = styled20("div", {
   name: "MonthPicker",
   slot: "root",
   overridesResolver: (props, styles) => styles.root
@@ -4891,10 +4878,10 @@ function parseDate3(dateString) {
   const date = /* @__PURE__ */ new Date(`${year}/${month}`);
   return date;
 }
-var TextMaskAdapter7 = React32.forwardRef(
+var TextMaskAdapter7 = React31.forwardRef(
   function TextMaskAdapter8(props, ref) {
     const { onChange, format, ...other } = props;
-    return /* @__PURE__ */ React32.createElement(
+    return /* @__PURE__ */ React31.createElement(
       IMaskInput3,
       {
         ...other,
@@ -4977,7 +4964,7 @@ var MonthPicker = forwardRef9(
       },
       [anchorEl, setAnchorEl, innerRef]
     );
-    return /* @__PURE__ */ React32.createElement(MonthPickerRoot, null, /* @__PURE__ */ React32.createElement(FocusTrap3, { open: true }, /* @__PURE__ */ React32.createElement(React32.Fragment, null, /* @__PURE__ */ React32.createElement(
+    return /* @__PURE__ */ React31.createElement(MonthPickerRoot, null, /* @__PURE__ */ React31.createElement(FocusTrap3, { open: true }, /* @__PURE__ */ React31.createElement(React31.Fragment, null, /* @__PURE__ */ React31.createElement(
       Input_default,
       {
         ...innerProps,
@@ -4999,7 +4986,7 @@ var MonthPicker = forwardRef9(
           // NOTE: placeholder char 를 텍스트로 표시하므로 동일한 너비를 가지는 mono font 를 사용해야 이질감이 없다.
           fontFamily: "monospace"
         },
-        endDecorator: /* @__PURE__ */ React32.createElement(
+        endDecorator: /* @__PURE__ */ React31.createElement(
           IconButton_default,
           {
             variant: "plain",
@@ -5009,12 +4996,12 @@ var MonthPicker = forwardRef9(
             "aria-haspopup": "dialog",
             "aria-expanded": open
           },
-          /* @__PURE__ */ React32.createElement(CalendarTodayIcon3, null)
+          /* @__PURE__ */ React31.createElement(CalendarTodayIcon3, null)
         ),
         label,
         helperText
       }
-    ), open && /* @__PURE__ */ React32.createElement(ClickAwayListener3, { onClickAway: () => setAnchorEl(null) }, /* @__PURE__ */ React32.createElement(
+    ), open && /* @__PURE__ */ React31.createElement(ClickAwayListener3, { onClickAway: () => setAnchorEl(null) }, /* @__PURE__ */ React31.createElement(
       StyledPopper3,
       {
         id: "month-picker-popper",
@@ -5033,7 +5020,7 @@ var MonthPicker = forwardRef9(
         "aria-label": "Calendar Tooltip",
         "aria-expanded": open
       },
-      /* @__PURE__ */ React32.createElement(CalendarSheet3, { tabIndex: -1, role: "presentation" }, /* @__PURE__ */ React32.createElement(
+      /* @__PURE__ */ React31.createElement(CalendarSheet3, { tabIndex: -1, role: "presentation" }, /* @__PURE__ */ React31.createElement(
         Calendar_default,
         {
           view: "month",
@@ -5053,14 +5040,14 @@ var MonthPicker = forwardRef9(
           disableFuture,
           disablePast
         }
-      ), /* @__PURE__ */ React32.createElement(
+      ), /* @__PURE__ */ React31.createElement(
         DialogActions_default,
         {
           sx: {
             p: 1
           }
         },
-        /* @__PURE__ */ React32.createElement(
+        /* @__PURE__ */ React31.createElement(
           Button_default,
           {
             size,
@@ -5084,7 +5071,7 @@ var MonthPicker = forwardRef9(
 );
 
 // src/components/MonthRangePicker/MonthRangePicker.tsx
-import React33, {
+import React32, {
   forwardRef as forwardRef10,
   useCallback as useCallback13,
   useEffect as useEffect10,
@@ -5095,15 +5082,15 @@ import React33, {
 } from "react";
 import { IMaskInput as IMaskInput4, IMask as IMask4 } from "react-imask";
 import CalendarTodayIcon4 from "@mui/icons-material/CalendarToday";
-import { styled as styled20, useThemeProps as useThemeProps7 } from "@mui/joy";
+import { styled as styled21, useThemeProps as useThemeProps7 } from "@mui/joy";
 import { FocusTrap as FocusTrap4, ClickAwayListener as ClickAwayListener4, Popper as Popper5 } from "@mui/base";
-var StyledPopper4 = styled20(Popper5, {
+var StyledPopper4 = styled21(Popper5, {
   name: "MonthRangePicker",
   slot: "popper"
 })(({ theme }) => ({
   zIndex: theme.zIndex.tooltip
 }));
-var CalendarSheet4 = styled20(Sheet_default, {
+var CalendarSheet4 = styled21(Sheet_default, {
   name: "MonthRangePicker",
   slot: "sheet",
   overridesResolver: (props, styles) => styles.root
@@ -5113,7 +5100,7 @@ var CalendarSheet4 = styled20(Sheet_default, {
   boxShadow: theme.shadow.md,
   borderRadius: theme.radius.md
 }));
-var MonthRangePickerRoot = styled20("div", {
+var MonthRangePickerRoot = styled21("div", {
   name: "MonthRangePicker",
   slot: "root",
   overridesResolver: (props, styles) => styles.root
@@ -5150,10 +5137,10 @@ var parseDates2 = (str) => {
 var formatToPattern4 = (format) => {
   return `${format} - ${format}`.replace(/YYYY/g, "Y").replace(/MM/g, "m").replace(/[^YMm\s]/g, (match) => `${match}\``);
 };
-var TextMaskAdapter9 = React33.forwardRef(
+var TextMaskAdapter9 = React32.forwardRef(
   function TextMaskAdapter10(props, ref) {
     const { onChange, format, ...other } = props;
-    return /* @__PURE__ */ React33.createElement(
+    return /* @__PURE__ */ React32.createElement(
       IMaskInput4,
       {
         ...other,
@@ -5248,7 +5235,7 @@ var MonthRangePicker = forwardRef10(
       },
       [setValue, setAnchorEl, format]
     );
-    return /* @__PURE__ */ React33.createElement(MonthRangePickerRoot, null, /* @__PURE__ */ React33.createElement(FocusTrap4, { open: true }, /* @__PURE__ */ React33.createElement(React33.Fragment, null, /* @__PURE__ */ React33.createElement(
+    return /* @__PURE__ */ React32.createElement(MonthRangePickerRoot, null, /* @__PURE__ */ React32.createElement(FocusTrap4, { open: true }, /* @__PURE__ */ React32.createElement(React32.Fragment, null, /* @__PURE__ */ React32.createElement(
       Input_default,
       {
         ...innerProps,
@@ -5270,7 +5257,7 @@ var MonthRangePicker = forwardRef10(
           // NOTE: placeholder char 를 텍스트로 표시하므로 동일한 너비를 가지는 mono font 를 사용해야 이질감이 없다.
           fontFamily: "monospace"
         },
-        endDecorator: /* @__PURE__ */ React33.createElement(
+        endDecorator: /* @__PURE__ */ React32.createElement(
           IconButton_default,
           {
             variant: "plain",
@@ -5280,12 +5267,12 @@ var MonthRangePicker = forwardRef10(
             "aria-haspopup": "dialog",
             "aria-expanded": open
           },
-          /* @__PURE__ */ React33.createElement(CalendarTodayIcon4, null)
+          /* @__PURE__ */ React32.createElement(CalendarTodayIcon4, null)
         ),
         label,
         helperText
       }
-    ), open && /* @__PURE__ */ React33.createElement(ClickAwayListener4, { onClickAway: () => setAnchorEl(null) }, /* @__PURE__ */ React33.createElement(
+    ), open && /* @__PURE__ */ React32.createElement(ClickAwayListener4, { onClickAway: () => setAnchorEl(null) }, /* @__PURE__ */ React32.createElement(
       StyledPopper4,
       {
         id: "month-range-picker-popper",
@@ -5304,7 +5291,7 @@ var MonthRangePicker = forwardRef10(
         "aria-label": "Calendar Tooltip",
         "aria-expanded": open
       },
-      /* @__PURE__ */ React33.createElement(CalendarSheet4, { tabIndex: -1, role: "presentation" }, /* @__PURE__ */ React33.createElement(
+      /* @__PURE__ */ React32.createElement(CalendarSheet4, { tabIndex: -1, role: "presentation" }, /* @__PURE__ */ React32.createElement(
         Calendar_default,
         {
           view: "month",
@@ -5317,14 +5304,14 @@ var MonthRangePicker = forwardRef10(
           disableFuture,
           disablePast
         }
-      ), /* @__PURE__ */ React33.createElement(
+      ), /* @__PURE__ */ React32.createElement(
         DialogActions_default,
         {
           sx: {
             p: 1
           }
         },
-        /* @__PURE__ */ React33.createElement(
+        /* @__PURE__ */ React32.createElement(
           Button_default,
           {
             size,
@@ -5344,16 +5331,16 @@ var MonthRangePicker = forwardRef10(
 MonthRangePicker.displayName = "MonthRangePicker";
 
 // src/components/NavigationGroup/NavigationGroup.tsx
-import React34 from "react";
+import React33 from "react";
 import {
   Accordion as JoyAccordion2,
   AccordionSummary as JoyAccordionSummary2,
   AccordionDetails as JoyAccordionDetails2,
-  styled as styled21,
+  styled as styled22,
   accordionSummaryClasses,
   Stack as Stack2
 } from "@mui/joy";
-var AccordionSummary2 = styled21(JoyAccordionSummary2, {
+var AccordionSummary2 = styled22(JoyAccordionSummary2, {
   name: "NavigationGroup",
   slot: "Summary",
   shouldForwardProp: (prop) => prop !== "useIcon" && prop !== "level"
@@ -5366,7 +5353,7 @@ var AccordionSummary2 = styled21(JoyAccordionSummary2, {
     }
   }
 }));
-var AccordionDetails2 = styled21(JoyAccordionDetails2, {
+var AccordionDetails2 = styled22(JoyAccordionDetails2, {
   name: "NavigationGroup",
   slot: "Details"
 })(({ theme }) => ({
@@ -5375,19 +5362,19 @@ var AccordionDetails2 = styled21(JoyAccordionDetails2, {
 }));
 function NavigationGroup(props) {
   const { title, children, startDecorator, level, ...rest } = props;
-  return /* @__PURE__ */ React34.createElement(JoyAccordion2, { ...rest }, /* @__PURE__ */ React34.createElement(AccordionSummary2, { useIcon: !!startDecorator, level }, /* @__PURE__ */ React34.createElement(Stack2, { direction: "row", gap: 4 }, startDecorator, title)), /* @__PURE__ */ React34.createElement(AccordionDetails2, null, children));
+  return /* @__PURE__ */ React33.createElement(JoyAccordion2, { ...rest }, /* @__PURE__ */ React33.createElement(AccordionSummary2, { useIcon: !!startDecorator, level }, /* @__PURE__ */ React33.createElement(Stack2, { direction: "row", gap: 4 }, startDecorator, title)), /* @__PURE__ */ React33.createElement(AccordionDetails2, null, children));
 }
 
 // src/components/NavigationItem/NavigationItem.tsx
-import React35 from "react";
+import React34 from "react";
 import {
   ListItem as JoyListItem,
   ListItemButton as JoyListItemButton,
   ListItemDecorator as JoyListItemDecorator,
-  styled as styled22,
+  styled as styled23,
   listItemButtonClasses
 } from "@mui/joy";
-var ListItemButton = styled22(JoyListItemButton, {
+var ListItemButton = styled23(JoyListItemButton, {
   name: "NavigationItem",
   slot: "Button",
   shouldForwardProp: (prop) => prop !== "useIcon" && prop !== "level"
@@ -5414,7 +5401,7 @@ function NavigationItem(props) {
   const handleClick = () => {
     onClick?.(id);
   };
-  return /* @__PURE__ */ React35.createElement(JoyListItem, { ...rest }, /* @__PURE__ */ React35.createElement(
+  return /* @__PURE__ */ React34.createElement(JoyListItem, { ...rest }, /* @__PURE__ */ React34.createElement(
     ListItemButton,
     {
       level,
@@ -5423,21 +5410,21 @@ function NavigationItem(props) {
       "aria-current": selected,
       onClick: handleClick
     },
-    startDecorator && /* @__PURE__ */ React35.createElement(JoyListItemDecorator, null, startDecorator),
+    startDecorator && /* @__PURE__ */ React34.createElement(JoyListItemDecorator, null, startDecorator),
     children
   ));
 }
 
 // src/components/Navigator/Navigator.tsx
-import React36 from "react";
+import React35 from "react";
 function Navigator(props) {
   const { items, level = 0, onSelect } = props;
   const handleItemClick = (id) => {
     onSelect?.(id);
   };
-  return /* @__PURE__ */ React36.createElement("div", null, items.map((item, index) => {
+  return /* @__PURE__ */ React35.createElement("div", null, items.map((item, index) => {
     if (item.type === "item") {
-      return /* @__PURE__ */ React36.createElement(
+      return /* @__PURE__ */ React35.createElement(
         NavigationItem,
         {
           key: item.id,
@@ -5450,7 +5437,7 @@ function Navigator(props) {
         item.title
       );
     } else if (item.type === "group") {
-      return /* @__PURE__ */ React36.createElement(
+      return /* @__PURE__ */ React35.createElement(
         NavigationGroup,
         {
           key: index,
@@ -5468,17 +5455,17 @@ function Navigator(props) {
 Navigator.displayName = "Navigator";
 
 // src/components/PercentageInput/PercentageInput.tsx
-import React37, { useCallback as useCallback14, useMemo as useMemo12, useState as useState12 } from "react";
+import React36, { useCallback as useCallback14, useMemo as useMemo12, useState as useState12 } from "react";
 import { NumericFormat as NumericFormat2 } from "react-number-format";
-import { styled as styled23, useThemeProps as useThemeProps8 } from "@mui/joy";
+import { styled as styled24, useThemeProps as useThemeProps8 } from "@mui/joy";
 var padDecimal = (value, decimalScale) => {
   const [integer, decimal = ""] = `${value}`.split(".");
   return Number(`${integer}${decimal.padEnd(decimalScale, "0")}`);
 };
-var TextMaskAdapter11 = React37.forwardRef(
+var TextMaskAdapter11 = React36.forwardRef(
   function TextMaskAdapter12(props, ref) {
     const { onChange, min, max, ...innerProps } = props;
-    return /* @__PURE__ */ React37.createElement(
+    return /* @__PURE__ */ React36.createElement(
       NumericFormat2,
       {
         ...innerProps,
@@ -5499,12 +5486,12 @@ var TextMaskAdapter11 = React37.forwardRef(
     );
   }
 );
-var PercentageInputRoot = styled23(Input_default, {
+var PercentageInputRoot = styled24(Input_default, {
   name: "PercentageInput",
   slot: "Root",
   overridesResolver: (props, styles) => styles.root
 })({});
-var PercentageInput = React37.forwardRef(function PercentageInput2(inProps, ref) {
+var PercentageInput = React36.forwardRef(function PercentageInput2(inProps, ref) {
   const props = useThemeProps8({ props: inProps, name: "PercentageInput" });
   const {
     name,
@@ -5557,7 +5544,7 @@ var PercentageInput = React37.forwardRef(function PercentageInput2(inProps, ref)
     },
     [setValue, useMinorUnit, maxDecimalScale, min, max]
   );
-  return /* @__PURE__ */ React37.createElement(
+  return /* @__PURE__ */ React36.createElement(
     PercentageInputRoot,
     {
       ...innerProps,
@@ -5587,17 +5574,17 @@ var PercentageInput = React37.forwardRef(function PercentageInput2(inProps, ref)
 PercentageInput.displayName = "PercentageInput";
 
 // src/components/ProfileMenu/ProfileMenu.tsx
-import React38, { useCallback as useCallback15, useMemo as useMemo13 } from "react";
+import React37, { useCallback as useCallback15, useMemo as useMemo13 } from "react";
 import {
   Dropdown as Dropdown2,
   ListDivider,
   menuItemClasses,
-  styled as styled24,
+  styled as styled25,
   MenuButton as MenuButton2
 } from "@mui/joy";
 import { ClickAwayListener as ClickAwayListener5 } from "@mui/base";
 import DropdownIcon from "@mui/icons-material/ArrowDropDown";
-var StyledProfileCard = styled24(Stack, {
+var StyledProfileCard = styled25(Stack, {
   name: "ProfileMenu",
   slot: "item"
 })({});
@@ -5611,7 +5598,7 @@ function ProfileCard(props) {
     () => size === "sm" ? "body-sm" : "body-md",
     [size]
   );
-  return /* @__PURE__ */ React38.createElement(StyledProfileCard, { px: 4, py: 2 }, /* @__PURE__ */ React38.createElement(Stack, { direction: "row", gap: 2 }, /* @__PURE__ */ React38.createElement(
+  return /* @__PURE__ */ React37.createElement(StyledProfileCard, { px: 4, py: 2 }, /* @__PURE__ */ React37.createElement(Stack, { direction: "row", gap: 2 }, /* @__PURE__ */ React37.createElement(
     Typography,
     {
       level: nameLevel,
@@ -5619,10 +5606,10 @@ function ProfileCard(props) {
       textColor: "text.primary"
     },
     children
-  ), chip && /* @__PURE__ */ React38.createElement(Chip, { size, color: "neutral", variant: "outlined" }, chip)), caption && /* @__PURE__ */ React38.createElement(Typography, { level: captionLevel, textColor: "text.tertiary" }, caption));
+  ), chip && /* @__PURE__ */ React37.createElement(Chip, { size, color: "neutral", variant: "outlined" }, chip)), caption && /* @__PURE__ */ React37.createElement(Typography, { level: captionLevel, textColor: "text.tertiary" }, caption));
 }
 ProfileCard.displayName = "ProfileCard";
-var StyledProfileMenuButton = styled24(MenuButton2, {
+var StyledProfileMenuButton = styled25(MenuButton2, {
   name: "ProfileMenu",
   slot: "button"
 })(({ theme }) => ({
@@ -5631,16 +5618,16 @@ var StyledProfileMenuButton = styled24(MenuButton2, {
 }));
 function ProfileMenuButton(props) {
   const { size = "md", src, alt, children, getInitial, ...innerProps } = props;
-  return /* @__PURE__ */ React38.createElement(
+  return /* @__PURE__ */ React37.createElement(
     StyledProfileMenuButton,
     {
       variant: "plain",
       color: "neutral",
       size,
-      endDecorator: /* @__PURE__ */ React38.createElement(DropdownIcon, null),
+      endDecorator: /* @__PURE__ */ React37.createElement(DropdownIcon, null),
       ...innerProps
     },
-    /* @__PURE__ */ React38.createElement(
+    /* @__PURE__ */ React37.createElement(
       Avatar,
       {
         variant: "soft",
@@ -5655,7 +5642,7 @@ function ProfileMenuButton(props) {
   );
 }
 ProfileMenuButton.displayName = "ProfileMenuButton";
-var ProfileMenuRoot = styled24(Menu, {
+var ProfileMenuRoot = styled25(Menu, {
   name: "ProfileMenu",
   slot: "root"
 })(({ theme }) => ({
@@ -5681,7 +5668,7 @@ function ProfileMenu(props) {
     defaultOpen ?? false,
     useCallback15((value) => onOpenChange?.(value), [onOpenChange])
   );
-  return /* @__PURE__ */ React38.createElement(ClickAwayListener5, { onClickAway: () => setOpen(false) }, /* @__PURE__ */ React38.createElement("div", null, /* @__PURE__ */ React38.createElement(Dropdown2, { open }, /* @__PURE__ */ React38.createElement(
+  return /* @__PURE__ */ React37.createElement(ClickAwayListener5, { onClickAway: () => setOpen(false) }, /* @__PURE__ */ React37.createElement("div", null, /* @__PURE__ */ React37.createElement(Dropdown2, { open }, /* @__PURE__ */ React37.createElement(
     ProfileMenuButton,
     {
       size,
@@ -5691,7 +5678,7 @@ function ProfileMenu(props) {
       getInitial
     },
     profile.name
-  ), /* @__PURE__ */ React38.createElement(
+  ), /* @__PURE__ */ React37.createElement(
     ProfileMenuRoot,
     {
       size,
@@ -5699,7 +5686,7 @@ function ProfileMenu(props) {
       ...innerProps,
       onClose: () => setOpen(false)
     },
-    /* @__PURE__ */ React38.createElement(
+    /* @__PURE__ */ React37.createElement(
       ProfileCard,
       {
         size,
@@ -5708,8 +5695,8 @@ function ProfileMenu(props) {
       },
       profile.name
     ),
-    !!menuItems.length && /* @__PURE__ */ React38.createElement(ListDivider, null),
-    menuItems.map(({ label, ...menuProps }) => /* @__PURE__ */ React38.createElement(
+    !!menuItems.length && /* @__PURE__ */ React37.createElement(ListDivider, null),
+    menuItems.map(({ label, ...menuProps }) => /* @__PURE__ */ React37.createElement(
       MenuItem,
       {
         ...menuProps,
@@ -5726,39 +5713,39 @@ ProfileMenu.displayName = "ProfileMenu";
 
 // src/components/Radio/Radio.tsx
 import { Radio as JoyRadio, RadioGroup as JoyRadioGroup } from "@mui/joy";
-import { motion as motion27 } from "framer-motion";
-var MotionRadio = motion27(JoyRadio);
+import { motion as motion26 } from "framer-motion";
+var MotionRadio = motion26(JoyRadio);
 var Radio = MotionRadio;
 Radio.displayName = "Radio";
-var MotionRadioGroup = motion27(JoyRadioGroup);
+var MotionRadioGroup = motion26(JoyRadioGroup);
 var RadioGroup = MotionRadioGroup;
 RadioGroup.displayName = "RadioGroup";
 
 // src/components/RadioList/RadioList.tsx
-import React39 from "react";
+import React38 from "react";
 function RadioList(props) {
   const { items, ...innerProps } = props;
-  return /* @__PURE__ */ React39.createElement(RadioGroup, { ...innerProps }, items.map((item) => /* @__PURE__ */ React39.createElement(Radio, { key: `${item.value}`, value: item.value, label: item.label })));
+  return /* @__PURE__ */ React38.createElement(RadioGroup, { ...innerProps }, items.map((item) => /* @__PURE__ */ React38.createElement(Radio, { key: `${item.value}`, value: item.value, label: item.label })));
 }
 RadioList.displayName = "RadioList";
 
 // src/components/Stepper/Stepper.tsx
-import React40 from "react";
+import React39 from "react";
 import {
   Stepper as JoyStepper,
   Step as JoyStep,
   StepIndicator as JoyStepIndicator,
   stepClasses,
   stepIndicatorClasses,
-  styled as styled25
+  styled as styled26
 } from "@mui/joy";
 import CheckIcon from "@mui/icons-material/Check";
-import { motion as motion28 } from "framer-motion";
-var Step = styled25(JoyStep)({});
+import { motion as motion27 } from "framer-motion";
+var Step = styled26(JoyStep)({});
 Step.displayName = "Step";
-var StepIndicator = styled25(JoyStepIndicator)({});
+var StepIndicator = styled26(JoyStepIndicator)({});
 StepIndicator.displayName = "StepIndicator";
-var StyledStepper = styled25(JoyStepper)(({ theme }) => ({
+var StyledStepper = styled26(JoyStepper)(({ theme }) => ({
   "--StepIndicator-size": "24px",
   "--Step-gap": theme.spacing(2),
   "--joy-palette-success-solidBg": "var(--joy-palette-success-400)",
@@ -5766,7 +5753,7 @@ var StyledStepper = styled25(JoyStepper)(({ theme }) => ({
     fontSize: "var(--ceed-fontSize-xs)"
   }
 }));
-var MotionStepper = motion28(StyledStepper);
+var MotionStepper = motion27(StyledStepper);
 function Stepper(props) {
   const {
     steps,
@@ -5776,7 +5763,7 @@ function Stepper(props) {
     inactiveLineColor = "neutral.300",
     activeStep
   } = props;
-  return /* @__PURE__ */ React40.createElement(
+  return /* @__PURE__ */ React39.createElement(
     MotionStepper,
     {
       sx: (theme) => ({
@@ -5810,15 +5797,15 @@ function Stepper(props) {
       const completed = activeStep > i + 1;
       const disabled = activeStep < i + 1;
       const hasContent = step.label || step.extraContent;
-      return /* @__PURE__ */ React40.createElement(
+      return /* @__PURE__ */ React39.createElement(
         Step,
         {
-          indicator: /* @__PURE__ */ React40.createElement(StepIndicator, { variant: "solid", color: "primary" }, completed ? /* @__PURE__ */ React40.createElement(CheckIcon, null) : step.indicatorContent),
+          indicator: /* @__PURE__ */ React39.createElement(StepIndicator, { variant: "solid", color: "primary" }, completed ? /* @__PURE__ */ React39.createElement(CheckIcon, null) : step.indicatorContent),
           active,
           completed,
           disabled
         },
-        hasContent && /* @__PURE__ */ React40.createElement(Stack_default, null, step.label && /* @__PURE__ */ React40.createElement(Typography_default, { level: "title-sm" }, step.label), step.extraContent && /* @__PURE__ */ React40.createElement(Typography_default, { level: "body-xs" }, step.extraContent))
+        hasContent && /* @__PURE__ */ React39.createElement(Stack_default, null, step.label && /* @__PURE__ */ React39.createElement(Typography_default, { level: "title-sm" }, step.label), step.extraContent && /* @__PURE__ */ React39.createElement(Typography_default, { level: "body-xs" }, step.extraContent))
       );
     })
   );
@@ -5826,15 +5813,15 @@ function Stepper(props) {
 Stepper.displayName = "Stepper";
 
 // src/components/Switch/Switch.tsx
-import React41 from "react";
+import React40 from "react";
 import {
   Switch as JoySwitch,
-  styled as styled26,
+  styled as styled27,
   switchClasses
 } from "@mui/joy";
-import { motion as motion29 } from "framer-motion";
-var MotionSwitch = motion29(JoySwitch);
-var StyledThumb = styled26(motion29.div)({
+import { motion as motion28 } from "framer-motion";
+var MotionSwitch = motion28(JoySwitch);
+var StyledThumb = styled27(motion28.div)({
   "--Icon-fontSize": "calc(var(--Switch-thumbSize) * 0.75)",
   display: "inline-flex",
   justifyContent: "center",
@@ -5852,14 +5839,14 @@ var StyledThumb = styled26(motion29.div)({
     right: "var(--Switch-thumbOffset)"
   }
 });
-var Thumb = (props) => /* @__PURE__ */ React41.createElement(StyledThumb, { ...props, layout: true, transition: spring });
+var Thumb = (props) => /* @__PURE__ */ React40.createElement(StyledThumb, { ...props, layout: true, transition: spring });
 var spring = {
   type: "spring",
   stiffness: 700,
   damping: 30
 };
 var Switch = (props) => {
-  return /* @__PURE__ */ React41.createElement(
+  return /* @__PURE__ */ React40.createElement(
     MotionSwitch,
     {
       ...props,
@@ -5878,29 +5865,29 @@ import {
   Tab as JoyTab,
   TabList as JoyTabList,
   TabPanel as JoyTabPanel,
-  styled as styled27,
+  styled as styled28,
   tabClasses
 } from "@mui/joy";
-import { motion as motion30 } from "framer-motion";
-var MotionTabs = motion30(JoyTabs);
+import { motion as motion29 } from "framer-motion";
+var MotionTabs = motion29(JoyTabs);
 var Tabs = MotionTabs;
 Tabs.displayName = "Tabs";
-var MotionTab = styled27(motion30(JoyTab))(({ theme }) => ({
+var MotionTab = styled28(motion29(JoyTab))(({ theme }) => ({
   [`&:not(.${tabClasses.selected})`]: {
     color: theme.palette.neutral[700]
   }
 }));
 var Tab = MotionTab;
 Tab.displayName = "Tab";
-var MotionTabList = motion30(JoyTabList);
+var MotionTabList = motion29(JoyTabList);
 var TabList = MotionTabList;
 TabList.displayName = "TabList";
-var MotionTabPanel = motion30(JoyTabPanel);
+var MotionTabPanel = motion29(JoyTabPanel);
 var TabPanel = MotionTabPanel;
 TabPanel.displayName = "TabPanel";
 
 // src/components/ThemeProvider/ThemeProvider.tsx
-import React42 from "react";
+import React41 from "react";
 import {
   CssBaseline,
   CssVarsProvider,
@@ -6170,7 +6157,7 @@ var defaultTheme = extendTheme({
 });
 function ThemeProvider(props) {
   const theme = props.theme || defaultTheme;
-  return /* @__PURE__ */ React42.createElement(React42.Fragment, null, /* @__PURE__ */ React42.createElement(CssVarsProvider, { theme }, /* @__PURE__ */ React42.createElement(CssBaseline, null), props.children));
+  return /* @__PURE__ */ React41.createElement(React41.Fragment, null, /* @__PURE__ */ React41.createElement(CssVarsProvider, { theme }, /* @__PURE__ */ React41.createElement(CssBaseline, null), props.children));
 }
 ThemeProvider.displayName = "ThemeProvider";
 export {
@@ -6299,7 +6286,7 @@ export {
   dialogContentClasses,
   dialogTitleClasses,
   dividerClasses,
-  drawerClasses,
+  drawerClasses2 as drawerClasses,
   extendTheme,
   formControlClasses,
   formHelperTextClasses,