@ceed/ads 1.37.0 → 1.38.0-next.1

package/dist/index.js

@@ -2,7 +2,7 @@
 import {
   useTheme as useTheme2,
   useColorScheme,
-  useThemeProps as useThemeProps10,
+  useThemeProps as useThemeProps14,
   ButtonGroup,
   alertClasses,
   boxClasses,
@@ -136,7 +136,7 @@ Accordions.displayName = "Accordions";
 
 // src/components/Alert/Alert.tsx
 import React3 from "react";
-import { Alert as JoyAlert, styled } from "@mui/joy";
+import { Alert as JoyAlert, styled, useThemeProps } from "@mui/joy";
 import { motion as motion3 } from "framer-motion";
 
 // src/components/Typography/Typography.tsx
@@ -173,8 +173,9 @@ var contentLevelMapping = {
   md: "body-sm",
   lg: "body-md"
 };
-function Alert(props) {
-  const { title, content, actions, color = "primary", size = "md", ...innerProps } = props;
+function Alert(inProps) {
+  const props = useThemeProps({ props: inProps, name: "Alert" });
+  const { title, content, actions, color = "primary", size = "sm", ...innerProps } = props;
   const invertedColors = props.invertedColors || props.variant === "solid";
   return /* @__PURE__ */ React3.createElement(MotionAlert, { ...innerProps, color, endDecorator: actions, invertedColors, size }, /* @__PURE__ */ React3.createElement(Stack_default, null, title && /* @__PURE__ */ React3.createElement(Typography_default, { level: titleLevelMapping[size], fontWeight: "bold", color }, title), /* @__PURE__ */ React3.createElement(Typography_default, { level: contentLevelMapping[size], fontWeight: 500, color }, content)));
 }
@@ -573,7 +574,7 @@ var Autocomplete_default = Autocomplete;
 
 // src/components/Avatar/Avatar.tsx
 import React6, { forwardRef as forwardRef2, useMemo as useMemo2 } from "react";
-import { Avatar as JoyAvatar, AvatarGroup, styled as styled4, useThemeProps } from "@mui/joy";
+import { Avatar as JoyAvatar, AvatarGroup, styled as styled4, useThemeProps as useThemeProps2 } from "@mui/joy";
 var StyledAvatar = styled4(JoyAvatar, {
   name: "Avatar",
   slot: "Root",
@@ -595,7 +596,7 @@ var defaultGetInitial = (name) => {
   }
 };
 var Avatar = forwardRef2(function Avatar2(inProps, ref) {
-  const props = useThemeProps({
+  const props = useThemeProps2({
     props: inProps,
     name: "Avatar"
   });
@@ -815,7 +816,7 @@ var isSameMonth = (date1, date2) => {
 
 // src/components/Calendar/hooks/use-calendar-props.ts
 import { useCallback as useCallback4, useMemo as useMemo4, useState as useState3 } from "react";
-import { useThemeProps as useThemeProps2 } from "@mui/joy";
+import { useThemeProps as useThemeProps3 } from "@mui/joy";
 var resolveView = (view, views) => {
   return views.includes(view) ? view : views[0];
 };
@@ -864,7 +865,7 @@ var useCalendarProps = (inProps) => {
     },
     [resolvedView, inProps, viewMonth, paginate]
   );
-  const props = useThemeProps2({
+  const props = useThemeProps3({
     props: {
       locale: "default",
       views: ["day", "month"],
@@ -1916,7 +1917,7 @@ Input.displayName = "Input";
 var Input_default = Input;
 
 // src/components/CurrencyInput/CurrencyInput.tsx
-import { styled as styled7, useThemeProps as useThemeProps3 } from "@mui/joy";
+import { styled as styled7, useThemeProps as useThemeProps4 } from "@mui/joy";
 
 // src/components/CurrencyInput/hooks/use-currency-setting.ts
 var CURRENCY_DECIMAL_MAP = {
@@ -2102,7 +2103,7 @@ var CurrencyInputRoot = styled7(Input_default, {
   overridesResolver: (props, styles) => styles.root
 })({});
 var CurrencyInput = React17.forwardRef(function CurrencyInput2(inProps, ref) {
-  const props = useThemeProps3({ props: inProps, name: "CurrencyInput" });
+  const props = useThemeProps4({ props: inProps, name: "CurrencyInput" });
   const {
     currency = "USD",
     name,
@@ -2630,7 +2631,7 @@ import { AnimatePresence as AnimatePresence2 } from "framer-motion";
 import React19, { forwardRef as forwardRef6, useCallback as useCallback9, useEffect as useEffect4, useImperativeHandle, useRef as useRef4, useState as useState8 } from "react";
 import { IMaskInput, IMask } from "react-imask";
 import CalendarTodayIcon from "@mui/icons-material/CalendarToday";
-import { styled as styled10, useThemeProps as useThemeProps4 } from "@mui/joy";
+import { styled as styled10, useThemeProps as useThemeProps5 } from "@mui/joy";
 import { FocusTrap, ClickAwayListener, Popper as Popper2 } from "@mui/base";
 
 // src/components/Sheet/Sheet.tsx
@@ -2818,7 +2819,7 @@ var TextMaskAdapter3 = React19.forwardRef(function TextMaskAdapter4(props, ref)
   );
 });
 var DatePicker = forwardRef6((inProps, ref) => {
-  const props = useThemeProps4({ props: inProps, name: "DatePicker" });
+  const props = useThemeProps5({ props: inProps, name: "DatePicker" });
   const {
     onChange,
     disabled,
@@ -4212,7 +4213,7 @@ import PreviousIcon from "@mui/icons-material/ChevronLeftRounded";
 import NextIcon from "@mui/icons-material/ChevronRightRounded";
 import FirstPageIcon from "@mui/icons-material/FirstPageRounded";
 import LastPageIcon from "@mui/icons-material/LastPageRounded";
-import { styled as styled13 } from "@mui/joy";
+import { styled as styled13, useThemeProps as useThemeProps6 } from "@mui/joy";
 var PaginationButton = styled13(Button_default, {
   name: "Pagination",
   slot: "button"
@@ -4263,13 +4264,14 @@ var PaginationContainer = styled13(Stack_default, {
     lg: theme.spacing(2)
   }[size]
 }));
-function Pagination(props) {
+function Pagination(inProps) {
+  const props = useThemeProps6({ props: inProps, name: "Pagination" });
   const {
     paginationModel: _paginationModel,
     defaultPaginationModel = { page: 1, pageSize: 25 },
     onPageChange,
     rowCount,
-    size = "md",
+    size = "sm",
     variant = "standard",
     ...innerProps
   } = props;
@@ -4924,7 +4926,7 @@ DataTable.displayName = "DataTable";
 import React27, { forwardRef as forwardRef8, useCallback as useCallback14, useEffect as useEffect8, useImperativeHandle as useImperativeHandle3, useMemo as useMemo12, useRef as useRef8, useState as useState11 } from "react";
 import { IMaskInput as IMaskInput2, IMask as IMask2 } from "react-imask";
 import CalendarTodayIcon2 from "@mui/icons-material/CalendarToday";
-import { styled as styled14, useThemeProps as useThemeProps5 } from "@mui/joy";
+import { styled as styled14, useThemeProps as useThemeProps7 } from "@mui/joy";
 import { FocusTrap as FocusTrap2, ClickAwayListener as ClickAwayListener2, Popper as Popper3 } from "@mui/base";
 var hasAlphabeticMonth2 = (format) => /MMMM|MMM/.test(format);
 var CalendarButton2 = styled14(IconButton_default, {
@@ -5100,7 +5102,7 @@ var TextMaskAdapter5 = React27.forwardRef(function TextMaskAdapter6(props, ref)
   );
 });
 var DateRangePicker = forwardRef8((inProps, ref) => {
-  const props = useThemeProps5({ props: inProps, name: "DateRangePicker" });
+  const props = useThemeProps7({ props: inProps, name: "DateRangePicker" });
   const {
     onChange,
     disabled,
@@ -5474,6 +5476,7 @@ var InsetDrawer = styled19(JoyDrawer)(({ theme }) => ({
 // src/components/FilterableCheckboxGroup/FilterableCheckboxGroup.tsx
 import React31, { useCallback as useCallback15, useEffect as useEffect9, useMemo as useMemo13, useRef as useRef9, useState as useState12 } from "react";
 import SearchIcon from "@mui/icons-material/Search";
+import { useThemeProps as useThemeProps8 } from "@mui/joy";
 import { useVirtualizer as useVirtualizer3 } from "@tanstack/react-virtual";
 function LabelWithTooltip(props) {
   const { label, size } = props;
@@ -5506,14 +5509,15 @@ function LabelWithTooltip(props) {
   }
   return labelContent;
 }
-function FilterableCheckboxGroup(props) {
+function FilterableCheckboxGroup(inProps) {
+  const props = useThemeProps8({ props: inProps, name: "FilterableCheckboxGroup" });
   const {
     value,
     options,
     label,
     placeholder,
     helperText,
-    size = "md",
+    size = "sm",
     required,
     onChange,
     maxHeight = 300,
@@ -5946,7 +5950,7 @@ import { Stack as Stack6 } from "@mui/joy";
 import React36, { forwardRef as forwardRef9, useCallback as useCallback20, useEffect as useEffect11, useImperativeHandle as useImperativeHandle4, useMemo as useMemo15, useRef as useRef10, useState as useState14 } from "react";
 import { IMaskInput as IMaskInput3, IMask as IMask3 } from "react-imask";
 import CalendarTodayIcon3 from "@mui/icons-material/CalendarToday";
-import { styled as styled20, useThemeProps as useThemeProps6 } from "@mui/joy";
+import { styled as styled20, useThemeProps as useThemeProps9 } from "@mui/joy";
 import { FocusTrap as FocusTrap3, ClickAwayListener as ClickAwayListener3, Popper as Popper4 } from "@mui/base";
 var hasAlphabeticMonth3 = (format) => /MMMM|MMM/.test(format);
 var StyledPopper3 = styled20(Popper4, {
@@ -6035,7 +6039,7 @@ var TextMaskAdapter7 = React36.forwardRef(function TextMaskAdapter8(props, ref)
   );
 });
 var MonthRangePicker = forwardRef9((inProps, ref) => {
-  const props = useThemeProps6({ props: inProps, name: "MonthRangePicker" });
+  const props = useThemeProps9({ props: inProps, name: "MonthRangePicker" });
   const {
     onChange,
     disabled,
@@ -6390,7 +6394,7 @@ import { Stack as Stack9, Typography as Typography5 } from "@mui/joy";
 // src/components/PercentageInput/PercentageInput.tsx
 import React40, { useCallback as useCallback24, useMemo as useMemo17, useState as useState15 } from "react";
 import { NumericFormat as NumericFormat2 } from "react-number-format";
-import { styled as styled21, useThemeProps as useThemeProps7 } from "@mui/joy";
+import { styled as styled21, useThemeProps as useThemeProps10 } from "@mui/joy";
 var padDecimal = (value, decimalScale) => {
   const [integer, decimal = ""] = `${value}`.split(".");
   return Number(`${integer}${decimal.padEnd(decimalScale, "0")}`);
@@ -6424,7 +6428,7 @@ var PercentageInputRoot = styled21(Input_default, {
 })({});
 var PercentageInput = React40.forwardRef(
   function PercentageInput2(inProps, ref) {
-    const props = useThemeProps7({ props: inProps, name: "PercentageInput" });
+    const props = useThemeProps10({ props: inProps, name: "PercentageInput" });
     const {
       name,
       onChange,
@@ -6711,7 +6715,7 @@ function FilterMenu(props) {
         }
       ) : null;
     }))),
-    /* @__PURE__ */ React44.createElement(DialogActions, { sx: { justifyContent: "space-between" } }, useClear && filters?.length === 1 && /* @__PURE__ */ React44.createElement(Button2, { variant: "plain", color: "neutral", size: "md", onClick: handleClear }, "Clear"), useReset && !useClear && /* @__PURE__ */ React44.createElement(Button2, { variant: "plain", color: "neutral", size: "md", onClick: handleClear }, "Reset"), /* @__PURE__ */ React44.createElement(Button2, { variant: "solid", color: "primary", size: "md", onClick: handleApply }, "Apply"))
+    /* @__PURE__ */ React44.createElement(DialogActions, { sx: { justifyContent: "space-between" } }, useClear && filters?.length === 1 && /* @__PURE__ */ React44.createElement(Button2, { variant: "plain", color: "neutral", onClick: handleClear }, "Clear"), useReset && !useClear && /* @__PURE__ */ React44.createElement(Button2, { variant: "plain", color: "neutral", onClick: handleClear }, "Reset"), /* @__PURE__ */ React44.createElement(Button2, { variant: "solid", color: "primary", onClick: handleApply }, "Apply"))
   );
 }
 FilterMenu.displayName = "FilterMenu";
@@ -7315,7 +7319,7 @@ MenuButton2.displayName = "MenuButton";
 // src/components/MonthPicker/MonthPicker.tsx
 import React49, { forwardRef as forwardRef10, useCallback as useCallback29, useEffect as useEffect15, useImperativeHandle as useImperativeHandle5, useRef as useRef12, useState as useState18 } from "react";
 import CalendarTodayIcon4 from "@mui/icons-material/CalendarToday";
-import { styled as styled23, useThemeProps as useThemeProps8 } from "@mui/joy";
+import { styled as styled23, useThemeProps as useThemeProps11 } from "@mui/joy";
 import { FocusTrap as FocusTrap4, ClickAwayListener as ClickAwayListener4, Popper as Popper5 } from "@mui/base";
 var StyledPopper4 = styled23(Popper5, {
   name: "MonthPicker",
@@ -7370,7 +7374,7 @@ function parseDate4(dateString, format) {
   return result;
 }
 var MonthPicker = forwardRef10((inProps, ref) => {
-  const props = useThemeProps8({ props: inProps, name: "MonthPicker" });
+  const props = useThemeProps11({ props: inProps, name: "MonthPicker" });
   const {
     onChange,
     disabled,
@@ -7692,7 +7696,7 @@ Navigator.displayName = "Navigator";
 
 // src/components/ProfileMenu/ProfileMenu.tsx
 import React53, { useCallback as useCallback30, useMemo as useMemo19 } from "react";
-import { Dropdown as Dropdown2, ListDivider, menuItemClasses, styled as styled26, MenuButton as MenuButton3 } from "@mui/joy";
+import { Dropdown as Dropdown2, ListDivider, menuItemClasses, styled as styled26, MenuButton as MenuButton3, useThemeProps as useThemeProps12 } from "@mui/joy";
 import { ClickAwayListener as ClickAwayListener5 } from "@mui/base";
 import DropdownIcon from "@mui/icons-material/ArrowDropDown";
 var StyledProfileCard = styled26(Stack, {
@@ -7714,7 +7718,7 @@ var StyledProfileMenuButton = styled26(MenuButton3, {
   "--Button-gap": theme.spacing(1)
 }));
 function ProfileMenuButton(props) {
-  const { size = "md", src, alt, children, getInitial, ...innerProps } = props;
+  const { size = "sm", src, alt, children, getInitial, ...innerProps } = props;
   return /* @__PURE__ */ React53.createElement(
     StyledProfileMenuButton,
     {
@@ -7738,7 +7742,8 @@ var ProfileMenuRoot = styled26(Menu, {
     border: "none"
   }
 }));
-function ProfileMenu(props) {
+function ProfileMenu(inProps) {
+  const props = useThemeProps12({ props: inProps, name: "ProfileMenu" });
   const { open: _open, defaultOpen, onOpenChange, profile, getInitial, menuItems, size, ...innerProps } = props;
   const [open, setOpen] = useControlledState(
     _open,
@@ -7943,7 +7948,7 @@ RadioList.displayName = "RadioList";
 
 // src/components/SearchBar/SearchBar.tsx
 import * as React56 from "react";
-import { styled as styled28, useThemeProps as useThemeProps9 } from "@mui/joy/styles";
+import { styled as styled28, useThemeProps as useThemeProps13 } from "@mui/joy/styles";
 import Box2 from "@mui/joy/Box";
 import SearchRoundedIcon from "@mui/icons-material/SearchRounded";
 import CloseRoundedIcon from "@mui/icons-material/CloseRounded";
@@ -7963,7 +7968,7 @@ var SearchBarRoot = styled28(Box2, {
   flexShrink: 0
 }));
 var SearchBar = React56.forwardRef(function SearchBar2(inProps, ref) {
-  const props = useThemeProps9({ props: inProps, name: "SearchBar" });
+  const props = useThemeProps13({ props: inProps, name: "SearchBar" });
   const { showSelect = false, options, placeholder: placeholderProp, value, onChange, onSearch, ...other } = props;
   const [selectVal, setSelectVal] = React56.useState(options?.[0]?.value ?? "");
   const [isHovered, setIsHovered] = React56.useState(false);
@@ -8456,6 +8461,9 @@ var defaultTheme = extendTheme({
       }
     },
     JoyAvatar: {
+      defaultProps: {
+        size: "sm"
+      },
       styleOverrides: {
         root: ({ ownerState }) => ({
           ...ownerState.size === "xs" && {
@@ -8477,6 +8485,120 @@ var defaultTheme = extendTheme({
       defaultProps: {
         size: "sm"
       }
+    },
+    JoyButton: {
+      defaultProps: {
+        size: "sm"
+      }
+    },
+    JoyIconButton: {
+      defaultProps: {
+        size: "sm"
+      }
+    },
+    JoyChip: {
+      defaultProps: {
+        size: "sm"
+      }
+    },
+    JoyCard: {
+      defaultProps: {
+        size: "sm"
+      }
+    },
+    JoyBreadcrumbs: {
+      defaultProps: {
+        size: "sm"
+      }
+    },
+    JoyList: {
+      defaultProps: {
+        size: "sm"
+      }
+    },
+    JoyMenu: {
+      defaultProps: {
+        size: "sm"
+      }
+    },
+    JoyMenuList: {
+      defaultProps: {
+        size: "sm"
+      }
+    },
+    JoyTabs: {
+      defaultProps: {
+        size: "sm"
+      }
+    },
+    // NOTE: TabList 는 size 를 직접 지정하지 않는다. Joy 의 TabList 는 theme defaultProps 가
+    // 부모 Tabs 의 context(SizeTabsContext)보다 우선하므로(`sizeProp != null ? sizeProp : tabsSize`),
+    // 여기서 sm 을 지정하면 <Tabs size="lg"> 처럼 부모에서 내려준 size 를 상속하지 못한다.
+    // JoyTabs 의 기본값 sm 이 context 로 전파되어 TabList 도 기본 sm 이 된다.
+    JoyStepper: {
+      defaultProps: {
+        size: "sm"
+      }
+    },
+    JoyModalDialog: {
+      defaultProps: {
+        size: "sm"
+      }
+    },
+    JoyAccordionGroup: {
+      defaultProps: {
+        size: "sm"
+      }
+    },
+    JoyButtonGroup: {
+      defaultProps: {
+        size: "sm"
+      }
+    },
+    JoyMenuButton: {
+      defaultProps: {
+        size: "sm"
+      }
+    },
+    JoyCircularProgress: {
+      defaultProps: {
+        size: "sm"
+      }
+    },
+    JoyLinearProgress: {
+      defaultProps: {
+        size: "sm"
+      }
+    },
+    JoySlider: {
+      defaultProps: {
+        size: "sm"
+      }
+    },
+    JoyBadge: {
+      defaultProps: {
+        size: "sm"
+      }
+    },
+    Alert: {
+      defaultProps: {
+        size: "sm"
+      }
+    },
+    Pagination: {
+      defaultProps: {
+        size: "sm"
+      }
+    },
+    FilterableCheckboxGroup: {
+      defaultProps: {
+        size: "sm"
+      }
+    },
+    ProfileMenu: {
+      defaultProps: {
+        size: "sm"
+      }
     }
   }
 });
@@ -8665,5 +8787,5 @@ export {
   useColorScheme,
   useMenuButton,
   useTheme2 as useTheme,
-  useThemeProps10 as useThemeProps
+  useThemeProps14 as useThemeProps
 };