@undefine-ui/design-system 3.7.0 → 3.7.2

package/dist/index.cjs

@@ -5052,7 +5052,7 @@ var MuiSelect = {
    * DEFAULT PROPS
    *************************************** */
   defaultProps: {
-    IconComponent: () => /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(Icon, { icon: "NavArrowDown", sx: { width: 18, height: 18, position: "absolute", right: 10 } })
+    IconComponent: () => /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(Icon, { icon: "NavArrowDown", sx: { position: "absolute", right: 10 } })
   }
 };
 var MuiNativeSelect = {
@@ -5060,7 +5060,7 @@ var MuiNativeSelect = {
    * DEFAULT PROPS
    *************************************** */
   defaultProps: {
-    IconComponent: () => /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(Icon, { icon: "NavArrowDown", sx: { width: 18, height: 18, position: "absolute", right: 10 } })
+    IconComponent: () => /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(Icon, { icon: "NavArrowDown", sx: { position: "absolute", right: 10 } })
   }
 };
 var select = { MuiSelect, MuiNativeSelect };
@@ -6185,19 +6185,31 @@ var MuiTextField = {
             borderColor: theme.vars.palette.surface.disable
           }
         },
-        // InputAdornment styling
+        // InputAdornment styling (target MuiInputAdornment only, not autocomplete endAdornment)
         [`&.${import_InputBase.inputBaseClasses.adornedStart}, &.${import_InputBase.inputBaseClasses.adornedEnd}`]: {
           color: theme.vars.palette.icon.black,
-          svg: {
+          [`& .${import_InputAdornment.inputAdornmentClasses.root} svg`]: {
             width: 20,
             height: 20,
             color: theme.vars.palette.icon.black
           },
-          [`& .${import_InputAdornment.inputAdornmentClasses.sizeSmall}`]: {
-            svg: { width: 16, height: 16 }
-          },
-          [`& .MuiInputAdornment-sizeLarge`]: {
-            svg: { width: 24, height: 24 }
+          [`& .${import_InputAdornment.inputAdornmentClasses.root} span`]: {
+            ...theme.typography.h8,
+            color: theme.vars.palette.icon.black
+          }
+        },
+        // Size small - 16x16 icons
+        [`&.${import_InputBase.inputBaseClasses.sizeSmall}`]: {
+          [`& .${import_InputAdornment.inputAdornmentClasses.root} svg`]: {
+            width: 16,
+            height: 16
+          }
+        },
+        // Size large - 24x24 icons
+        [`&.MuiInputBase-sizeLarge`]: {
+          [`& .${import_InputAdornment.inputAdornmentClasses.root} svg`]: {
+            width: 24,
+            height: 24
           }
         },
         [`&.${import_InputBase.inputBaseClasses.adornedStart}`]: {
@@ -6268,6 +6280,24 @@ var MuiTextField = {
         [`&.MuiInputBase-sizeLarge`]: {
           minHeight: 48
         }
+      },
+      // Select icon sizing
+      [`& .MuiSelect-root`]: {
+        // Default medium size - 20x20 icons
+        "& svg": {
+          width: 20,
+          height: 20
+        },
+        // Size small - 16x16 icons
+        [`&.${import_InputBase.inputBaseClasses.sizeSmall} svg`]: {
+          width: 16,
+          height: 16
+        },
+        // Size large - 24x24 icons
+        [`&.MuiInputBase-sizeLarge svg`]: {
+          width: 24,
+          height: 24
+        }
       }
     })
   }
@@ -11386,7 +11416,6 @@ var buttonGroup = { MuiButtonGroup };
 
 // src/theme/core/components/autocomplete.tsx
 var import_Chip2 = require("@mui/material/Chip");
-var import_SvgIcon4 = require("@mui/material/SvgIcon");
 var import_InputBase5 = require("@mui/material/InputBase");
 var import_Autocomplete5 = require("@mui/material/Autocomplete");
 var import_jsx_runtime107 = require("react/jsx-runtime");
@@ -11402,7 +11431,7 @@ var MuiAutocomplete = {
    * STYLE
    *************************************** */
   styleOverrides: {
-    root: ({ theme }) => ({
+    root: ({ theme, ownerState }) => ({
       // Tag count badge (e.g., "+2")
       [`& span.${import_Autocomplete5.autocompleteClasses.tag}`]: {
         ...theme.typography.subtitle2,
@@ -11423,34 +11452,49 @@ var MuiAutocomplete = {
         fontWeight: theme.typography.fontWeightMedium,
         color: theme.vars.palette.neutral[950],
         backgroundColor: theme.vars.palette.neutral[100]
+      },
+      // Default medium size - 20x20 end adornment icons
+      [`& .${import_Autocomplete5.autocompleteClasses.endAdornment} svg`]: {
+        width: 20,
+        height: 20
+      },
+      // Size small - 16x16 end adornment icons
+      ...ownerState.size === "small" && {
+        [`& .${import_Autocomplete5.autocompleteClasses.endAdornment} svg`]: {
+          width: 16,
+          height: 16
+        }
+      },
+      // Size large - 24x24 end adornment icons
+      ...ownerState.size === "large" && {
+        [`& .${import_Autocomplete5.autocompleteClasses.endAdornment} svg`]: {
+          width: 24,
+          height: 24
+        }
       }
     }),
     // Input root - override fixed heights for multiple mode
-    inputRoot: ({ theme }) => ({
+    inputRoot: ({ theme, ownerState }) => ({
       // Allow flexible height for multiple selections
       height: "auto",
       minHeight: 44,
       flexWrap: "wrap",
       alignItems: "center",
-      paddingTop: theme.spacing(0.75),
-      paddingBottom: theme.spacing(0.75),
+      paddingTop: theme.spacing(0),
+      paddingBottom: theme.spacing(0),
       paddingLeft: theme.spacing(1),
       paddingRight: `${theme.spacing(4)} !important`,
       // Space for clear/popup icons
       // Size small
-      [`&.${import_InputBase5.inputBaseClasses.sizeSmall}`]: {
-        height: "auto",
+      ...ownerState.size === "small" && {
         minHeight: 36,
-        paddingTop: theme.spacing(0.5),
-        paddingBottom: theme.spacing(0.5),
         [`& .${import_Autocomplete5.autocompleteClasses.tag}.${import_Chip2.chipClasses.root}`]: {
           height: 22,
           margin: theme.spacing(0.25, 0.25, 0.25, 0)
         }
       },
       // Size large
-      [`&.MuiInputBase-sizeLarge`]: {
-        height: "auto",
+      ...ownerState.size === "large" && {
         minHeight: 48,
         paddingTop: theme.spacing(1),
         paddingBottom: theme.spacing(1),
@@ -11468,7 +11512,7 @@ var MuiAutocomplete = {
     input: ({ theme }) => ({
       padding: `${theme.spacing(0.75, 0.75)} !important`,
       minWidth: 80,
-      [`&.${import_InputBase5.inputBaseClasses.inputSizeSmall}`]: {
+      [`&.${import_InputBase5.inputBaseClasses.sizeSmall}`]: {
         padding: `${theme.spacing(0.5, 0.5)} !important`
       }
     }),
@@ -11484,8 +11528,7 @@ var MuiAutocomplete = {
     endAdornment: ({ theme }) => ({
       top: "50%",
       transform: "translateY(-50%)",
-      right: theme.spacing(1),
-      [`& .${import_SvgIcon4.svgIconClasses.root}`]: { width: 24, height: 24 }
+      right: theme.spacing(1)
     }),
     clearIndicator: ({ theme }) => ({
       marginRight: theme.spacing(0.5)