@exem-ui/react 0.3.4-next.20260630003548 → 0.3.4-next.20260701100842

package/dist/index.d.mts

@@ -212,31 +212,28 @@ type BreadcrumbComponent = React__default.ForwardRefExoticComponent<React__defau
  */
 declare const Breadcrumb: BreadcrumbComponent;
 
-type ButtonColorVariantCombination = {
-    color?: 'primary';
-    variant?: 'contained' | 'outlined' | 'invisible';
+type ButtonColor = 'primary' | 'accent' | 'critical';
+type ButtonSize = 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge';
+type ButtonBackground = 'none' | 'fill';
+type ButtonVariantProps = {
+    variant?: 'solid' | 'assistive';
+    color?: ButtonColor;
+    background?: never;
 } | {
-    color?: 'accent';
-    variant?: 'contained' | 'outlined' | 'invisible';
-} | {
-    color?: 'critical';
-    variant?: 'contained' | 'outlined' | 'invisible';
-} | {
-    color?: 'assistive';
-    variant?: 'contained';
-} | {
-    color?: 'inverse';
-    variant?: 'contained';
+    variant: 'outlined' | 'invisible';
+    color?: ButtonColor;
+    background?: ButtonBackground;
 };
-type ButtonProps = React__default.ButtonHTMLAttributes<HTMLButtonElement> & Omit<VariantProps<typeof buttonVariants>, 'variant' | 'color'> & ButtonColorVariantCombination & {
-    size?: 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge';
+type ButtonProps = React__default.ButtonHTMLAttributes<HTMLButtonElement> & Omit<VariantProps<typeof buttonVariants>, 'variant' | 'color' | 'background'> & ButtonVariantProps & {
+    size?: ButtonSize;
     icon?: React__default.ReactElement<IconBaseProps>;
 };
 type ButtonComponent = React__default.ForwardRefExoticComponent<ButtonProps & React__default.RefAttributes<HTMLButtonElement>>;
 declare const buttonVariants: (props?: ({
-    color?: "accent" | "primary" | "critical" | "assistive" | "inverse" | null | undefined;
+    background?: "fill" | "none" | null | undefined;
+    color?: "accent" | "primary" | "critical" | null | undefined;
     size?: "small" | "xsmall" | "medium" | "large" | "xlarge" | null | undefined;
-    variant?: "contained" | "outlined" | "invisible" | null | undefined;
+    variant?: "solid" | "assistive" | "outlined" | "invisible" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 declare const Button: ButtonComponent;
 
@@ -272,27 +269,9 @@ interface ButtonGroupProps {
 type ButtonGroupComponent = React__default.ForwardRefExoticComponent<ButtonGroupProps & React__default.RefAttributes<HTMLDivElement>>;
 declare const ButtonGroup: ButtonGroupComponent;
 
-type IconButtonVariant = 'contained' | 'outlined' | 'invisible';
-type IconButtonColorVariantCombination = {
-    color?: 'primary';
-    variant?: 'contained' | 'outlined' | 'invisible';
-} | {
-    color?: 'accent';
-    variant?: 'contained' | 'outlined' | 'invisible';
-} | {
-    color?: 'critical';
-    variant?: 'contained' | 'outlined' | 'invisible';
-} | {
-    color?: 'assistive';
-    variant?: 'contained';
-} | {
-    color?: 'inverse';
-    variant?: 'contained';
-};
-type IconButtonProps = Omit<React__default.ButtonHTMLAttributes<HTMLButtonElement>, 'children'> & IconButtonColorVariantCombination & {
+type IconButtonProps = Omit<React__default.ButtonHTMLAttributes<HTMLButtonElement>, 'children'> & ButtonVariantProps & {
     icon: React__default.ReactElement<IconBaseProps>;
-    variant?: IconButtonVariant;
-    size?: 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge';
+    size?: ButtonSize;
     /** 툴팁 설정 (문자열 또는 FlatTooltip 설정 객체) */
     tooltip?: ComponentProps<typeof ConditionalTooltip>['tooltip'];
 };
@@ -585,7 +564,7 @@ type ModalContentProps = React__default.ComponentPropsWithoutRef<typeof DialogPr
      */
     size?: ModalSize;
 };
-type ModalCloseProps = Omit<ButtonProps, 'color' | 'variant'>;
+type ModalCloseProps = Omit<ButtonProps, 'color' | 'variant' | 'background'>;
 type ModalHeaderProps = React__default.HTMLAttributes<HTMLDivElement> & {
     /**
      * 하단 구분선 표시 여부
@@ -615,7 +594,7 @@ type ModalFooterDescriptionProps = React__default.HTMLAttributes<HTMLDivElement>
     icon?: React__default.ReactNode;
 };
 type ModalActionsProps = React__default.HTMLAttributes<HTMLDivElement>;
-type ModalActionProps = Omit<ButtonProps, 'color' | 'variant'> & {
+type ModalActionProps = Omit<ButtonProps, 'color' | 'variant' | 'background'> & {
     /**
      * 버튼 색상
      * @default 'primary'
@@ -734,8 +713,8 @@ type MessageBoxContentProps = React__default.ComponentPropsWithoutRef<typeof Dia
 type MessageBoxTitleProps = React__default.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>;
 type MessageBoxDescriptionProps = React__default.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>;
 type MessageBoxActionsProps = React__default.HTMLAttributes<HTMLDivElement>;
-type MessageBoxCancelProps = Omit<ButtonProps, 'color' | 'variant'>;
-type MessageBoxActionProps = Omit<ButtonProps, 'color' | 'variant'>;
+type MessageBoxCancelProps = Omit<ButtonProps, 'color' | 'variant' | 'background'>;
+type MessageBoxActionProps = Omit<ButtonProps, 'color' | 'variant' | 'background'>;
 type MessageBoxComponent = React__default.FC<MessageBoxRootProps> & {
     Trigger: React__default.ForwardRefExoticComponent<React__default.PropsWithoutRef<MessageBoxTriggerProps> & React__default.RefAttributes<React__default.ElementRef<typeof DialogPrimitive.Trigger>>>;
     Content: React__default.ForwardRefExoticComponent<React__default.PropsWithoutRef<MessageBoxContentProps> & React__default.RefAttributes<React__default.ElementRef<typeof DialogPrimitive.Content>>>;

package/dist/index.d.ts

@@ -212,31 +212,28 @@ type BreadcrumbComponent = React__default.ForwardRefExoticComponent<React__defau
  */
 declare const Breadcrumb: BreadcrumbComponent;
 
-type ButtonColorVariantCombination = {
-    color?: 'primary';
-    variant?: 'contained' | 'outlined' | 'invisible';
+type ButtonColor = 'primary' | 'accent' | 'critical';
+type ButtonSize = 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge';
+type ButtonBackground = 'none' | 'fill';
+type ButtonVariantProps = {
+    variant?: 'solid' | 'assistive';
+    color?: ButtonColor;
+    background?: never;
 } | {
-    color?: 'accent';
-    variant?: 'contained' | 'outlined' | 'invisible';
-} | {
-    color?: 'critical';
-    variant?: 'contained' | 'outlined' | 'invisible';
-} | {
-    color?: 'assistive';
-    variant?: 'contained';
-} | {
-    color?: 'inverse';
-    variant?: 'contained';
+    variant: 'outlined' | 'invisible';
+    color?: ButtonColor;
+    background?: ButtonBackground;
 };
-type ButtonProps = React__default.ButtonHTMLAttributes<HTMLButtonElement> & Omit<VariantProps<typeof buttonVariants>, 'variant' | 'color'> & ButtonColorVariantCombination & {
-    size?: 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge';
+type ButtonProps = React__default.ButtonHTMLAttributes<HTMLButtonElement> & Omit<VariantProps<typeof buttonVariants>, 'variant' | 'color' | 'background'> & ButtonVariantProps & {
+    size?: ButtonSize;
     icon?: React__default.ReactElement<IconBaseProps>;
 };
 type ButtonComponent = React__default.ForwardRefExoticComponent<ButtonProps & React__default.RefAttributes<HTMLButtonElement>>;
 declare const buttonVariants: (props?: ({
-    color?: "accent" | "primary" | "critical" | "assistive" | "inverse" | null | undefined;
+    background?: "fill" | "none" | null | undefined;
+    color?: "accent" | "primary" | "critical" | null | undefined;
     size?: "small" | "xsmall" | "medium" | "large" | "xlarge" | null | undefined;
-    variant?: "contained" | "outlined" | "invisible" | null | undefined;
+    variant?: "solid" | "assistive" | "outlined" | "invisible" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 declare const Button: ButtonComponent;
 
@@ -272,27 +269,9 @@ interface ButtonGroupProps {
 type ButtonGroupComponent = React__default.ForwardRefExoticComponent<ButtonGroupProps & React__default.RefAttributes<HTMLDivElement>>;
 declare const ButtonGroup: ButtonGroupComponent;
 
-type IconButtonVariant = 'contained' | 'outlined' | 'invisible';
-type IconButtonColorVariantCombination = {
-    color?: 'primary';
-    variant?: 'contained' | 'outlined' | 'invisible';
-} | {
-    color?: 'accent';
-    variant?: 'contained' | 'outlined' | 'invisible';
-} | {
-    color?: 'critical';
-    variant?: 'contained' | 'outlined' | 'invisible';
-} | {
-    color?: 'assistive';
-    variant?: 'contained';
-} | {
-    color?: 'inverse';
-    variant?: 'contained';
-};
-type IconButtonProps = Omit<React__default.ButtonHTMLAttributes<HTMLButtonElement>, 'children'> & IconButtonColorVariantCombination & {
+type IconButtonProps = Omit<React__default.ButtonHTMLAttributes<HTMLButtonElement>, 'children'> & ButtonVariantProps & {
     icon: React__default.ReactElement<IconBaseProps>;
-    variant?: IconButtonVariant;
-    size?: 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge';
+    size?: ButtonSize;
     /** 툴팁 설정 (문자열 또는 FlatTooltip 설정 객체) */
     tooltip?: ComponentProps<typeof ConditionalTooltip>['tooltip'];
 };
@@ -585,7 +564,7 @@ type ModalContentProps = React__default.ComponentPropsWithoutRef<typeof DialogPr
      */
     size?: ModalSize;
 };
-type ModalCloseProps = Omit<ButtonProps, 'color' | 'variant'>;
+type ModalCloseProps = Omit<ButtonProps, 'color' | 'variant' | 'background'>;
 type ModalHeaderProps = React__default.HTMLAttributes<HTMLDivElement> & {
     /**
      * 하단 구분선 표시 여부
@@ -615,7 +594,7 @@ type ModalFooterDescriptionProps = React__default.HTMLAttributes<HTMLDivElement>
     icon?: React__default.ReactNode;
 };
 type ModalActionsProps = React__default.HTMLAttributes<HTMLDivElement>;
-type ModalActionProps = Omit<ButtonProps, 'color' | 'variant'> & {
+type ModalActionProps = Omit<ButtonProps, 'color' | 'variant' | 'background'> & {
     /**
      * 버튼 색상
      * @default 'primary'
@@ -734,8 +713,8 @@ type MessageBoxContentProps = React__default.ComponentPropsWithoutRef<typeof Dia
 type MessageBoxTitleProps = React__default.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>;
 type MessageBoxDescriptionProps = React__default.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>;
 type MessageBoxActionsProps = React__default.HTMLAttributes<HTMLDivElement>;
-type MessageBoxCancelProps = Omit<ButtonProps, 'color' | 'variant'>;
-type MessageBoxActionProps = Omit<ButtonProps, 'color' | 'variant'>;
+type MessageBoxCancelProps = Omit<ButtonProps, 'color' | 'variant' | 'background'>;
+type MessageBoxActionProps = Omit<ButtonProps, 'color' | 'variant' | 'background'>;
 type MessageBoxComponent = React__default.FC<MessageBoxRootProps> & {
     Trigger: React__default.ForwardRefExoticComponent<React__default.PropsWithoutRef<MessageBoxTriggerProps> & React__default.RefAttributes<React__default.ElementRef<typeof DialogPrimitive.Trigger>>>;
     Content: React__default.ForwardRefExoticComponent<React__default.PropsWithoutRef<MessageBoxContentProps> & React__default.RefAttributes<React__default.ElementRef<typeof DialogPrimitive.Content>>>;

package/dist/index.js

@@ -427,14 +427,41 @@ Breadcrumb.Path.displayName = "Breadcrumb.Path";
 Breadcrumb.Separator.displayName = "Breadcrumb.Separator";
 Breadcrumb.Ellipsis.displayName = "Breadcrumb.Ellipsis";
 var colorStyles = {
+  primary: {
+    solid: {
+      button: "bg-solid-primary-default hover:bg-solid-primary-hovered disabled:bg-solid-primary-disabled",
+      icon: "text-icon-inverse group-disabled/button:text-icon-inverse",
+      text: "text-text-inverse group-disabled/button:text-text-inverse"
+    },
+    assistive: {
+      button: "bg-elevation-elevation-2 hover:bg-elevation-elevation-3 disabled:bg-elevation-elevation-2",
+      icon: "text-icon-secondary group-disabled/button:text-icon-disabled",
+      text: "text-text-secondary group-disabled/button:text-text-disabled"
+    },
+    outlined: {
+      button: "border border-border-primary disabled:border-border-primary hover:bg-elevation-elevation-2",
+      icon: "text-icon-secondary group-disabled/button:text-icon-disabled",
+      text: "text-text-secondary group-disabled/button:text-text-disabled"
+    },
+    invisible: {
+      button: "hover:bg-elevation-elevation-2",
+      icon: "text-icon-secondary group-disabled/button:text-icon-disabled",
+      text: "text-text-secondary group-disabled/button:text-text-disabled"
+    }
+  },
   accent: {
-    contained: {
+    solid: {
       button: "bg-solid-accent-default hover:bg-solid-accent-hovered disabled:bg-solid-accent-disabled",
       icon: "text-icon-static-light group-disabled/button:text-icon-inverse-disabled",
       text: "text-text-static-light group-disabled/button:text-text-inverse-disabled"
     },
+    assistive: {
+      button: "bg-elevation-accent-0 hover:bg-elevation-accent-1 disabled:bg-elevation-accent-0",
+      icon: "text-text-accent group-disabled/button:text-text-accent-disabled",
+      text: "text-text-accent group-disabled/button:text-text-accent-disabled"
+    },
     outlined: {
-      button: "border border-border-accent hover:bg-elevation-accent-0 disabled:border-border-accent-disabled",
+      button: "border border-border-primary disabled:border-border-primary hover:bg-elevation-accent-0",
       icon: "text-text-accent group-disabled/button:text-text-accent-disabled",
       text: "text-text-accent group-disabled/button:text-text-accent-disabled"
     },
@@ -444,21 +471,19 @@ var colorStyles = {
       text: "text-text-accent group-disabled/button:text-text-accent-disabled"
     }
   },
-  assistive: {
-    contained: {
-      button: "bg-elevation-elevation-2 hover:bg-elevation-elevation-3 disabled:bg-elevation-elevation-2",
-      icon: "text-icon-secondary group-disabled/button:text-icon-disabled",
-      text: "text-text-secondary group-disabled/button:text-text-disabled"
-    }
-  },
   critical: {
-    contained: {
+    solid: {
       button: "bg-solid-critical-default hover:bg-solid-critical-hovered disabled:bg-solid-critical-disabled",
       icon: "text-icon-static-light group-disabled/button:text-icon-inverse-disabled",
       text: "text-text-static-light group-disabled/button:text-text-inverse-disabled"
     },
+    assistive: {
+      button: "bg-elevation-critical-0 hover:bg-elevation-critical-1 disabled:bg-elevation-critical-0",
+      icon: "text-text-critical group-disabled/button:text-text-critical-disabled",
+      text: "text-text-critical group-disabled/button:text-text-critical-disabled"
+    },
     outlined: {
-      button: "border border-border-critical hover:bg-elevation-critical-0 disabled:border-border-critical-disabled",
+      button: "border border-border-primary disabled:border-border-primary hover:bg-elevation-critical-0",
       icon: "text-text-critical group-disabled/button:text-text-critical-disabled",
       text: "text-text-critical group-disabled/button:text-text-critical-disabled"
     },
@@ -467,30 +492,6 @@ var colorStyles = {
       icon: "text-text-critical group-disabled/button:text-text-critical-disabled",
       text: "text-text-critical group-disabled/button:text-text-critical-disabled"
     }
-  },
-  inverse: {
-    contained: {
-      button: "bg-elevation-elevation-0 hover:bg-elevation-elevation-2 disabled:bg-elevation-elevation-2",
-      icon: "text-icon-secondary group-disabled/button:text-icon-disabled",
-      text: "text-text-secondary group-disabled/button:text-text-disabled"
-    }
-  },
-  primary: {
-    contained: {
-      button: "bg-solid-primary-default hover:bg-solid-primary-hovered disabled:bg-solid-primary-disabled",
-      icon: "text-icon-inverse group-disabled/button:text-icon-inverse",
-      text: "text-text-inverse group-disabled/button:text-text-inverse"
-    },
-    outlined: {
-      button: "border border-border-primary hover:bg-elevation-elevation-2 disabled:border-border-primary",
-      icon: "text-icon-secondary group-disabled/button:text-icon-disabled",
-      text: "text-text-secondary group-disabled/button:text-text-disabled"
-    },
-    invisible: {
-      button: "hover:bg-elevation-elevation-2",
-      icon: "text-icon-secondary group-disabled/button:text-icon-disabled",
-      text: "text-text-secondary group-disabled/button:text-text-disabled"
-    }
   }
 };
 var buttonVariants = utils.cva(
@@ -498,77 +499,41 @@ var buttonVariants = utils.cva(
   {
     compoundVariants: [
       // Primary 색상 조합
-      {
-        className: colorStyles.primary.contained.button,
-        color: "primary",
-        variant: "contained"
-      },
-      {
-        className: colorStyles.primary.outlined.button,
-        color: "primary",
-        variant: "outlined"
-      },
-      {
-        className: colorStyles.primary.invisible.button,
-        color: "primary",
-        variant: "invisible"
-      },
+      { className: colorStyles.primary.solid.button, color: "primary", variant: "solid" },
+      { className: colorStyles.primary.assistive.button, color: "primary", variant: "assistive" },
+      { className: colorStyles.primary.outlined.button, color: "primary", variant: "outlined" },
+      { className: colorStyles.primary.invisible.button, color: "primary", variant: "invisible" },
       // Accent 색상 조합
-      {
-        className: colorStyles.accent.contained.button,
-        color: "accent",
-        variant: "contained"
-      },
-      {
-        className: colorStyles.accent.outlined.button,
-        color: "accent",
-        variant: "outlined"
-      },
-      {
-        className: colorStyles.accent.invisible.button,
-        color: "accent",
-        variant: "invisible"
-      },
+      { className: colorStyles.accent.solid.button, color: "accent", variant: "solid" },
+      { className: colorStyles.accent.assistive.button, color: "accent", variant: "assistive" },
+      { className: colorStyles.accent.outlined.button, color: "accent", variant: "outlined" },
+      { className: colorStyles.accent.invisible.button, color: "accent", variant: "invisible" },
       // Critical 색상 조합
+      { className: colorStyles.critical.solid.button, color: "critical", variant: "solid" },
+      { className: colorStyles.critical.assistive.button, color: "critical", variant: "assistive" },
+      { className: colorStyles.critical.outlined.button, color: "critical", variant: "outlined" },
+      { className: colorStyles.critical.invisible.button, color: "critical", variant: "invisible" },
+      // background 표면은 outlined/invisible 에서만 추가
       {
-        className: colorStyles.critical.contained.button,
-        color: "critical",
-        variant: "contained"
-      },
-      {
-        className: colorStyles.critical.outlined.button,
-        color: "critical",
-        variant: "outlined"
-      },
-      {
-        className: colorStyles.critical.invisible.button,
-        color: "critical",
-        variant: "invisible"
-      },
-      // Assistive 색상 조합 (contained만 지원)
-      {
-        className: colorStyles.assistive.contained.button,
-        color: "assistive",
-        variant: "contained"
-      },
-      // Inverse 색상 조합 (contained만 지원)
-      {
-        className: colorStyles.inverse.contained.button,
-        color: "inverse",
-        variant: "contained"
+        className: "bg-elevation-elevation-0",
+        background: "fill",
+        variant: ["outlined", "invisible"]
       }
     ],
     defaultVariants: {
+      background: "none",
       color: "primary",
       size: "medium",
-      variant: "contained"
+      variant: "solid"
     },
     variants: {
+      background: {
+        none: "",
+        fill: ""
+      },
       color: {
         accent: "",
-        assistive: "",
         critical: "",
-        inverse: "",
         primary: ""
       },
       size: {
@@ -579,9 +544,10 @@ var buttonVariants = utils.cva(
         xlarge: "h-12 gap-1 px-3 text-title-2 font-medium"
       },
       variant: {
-        contained: "",
-        outlined: "bg-transparent",
-        invisible: "bg-transparent"
+        solid: "",
+        assistive: "",
+        outlined: "",
+        invisible: ""
       }
     }
   }
@@ -596,27 +562,31 @@ var IconSizeMap = {
 var Button = React.forwardRef(
   ({
     className,
-    variant = "contained",
+    variant = "solid",
     color = "primary",
+    background,
     size = "medium",
     icon,
     children,
     ...props
   }, ref) => {
-    const validColorStyle = color === "assistive" || color === "inverse" ? colorStyles[color].contained : colorStyles[color][variant];
     const content = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
       icon && React.cloneElement(icon, {
         className: utils.cn(
           "shrink-0 [&>path]:fill-current",
-          validColorStyle.icon,
+          colorStyles[color][variant].icon,
           icon.props.className
         ),
-        size: icon.props.size ?? IconSizeMap[size ?? "medium"]
+        size: icon.props.size ?? IconSizeMap[size]
       }),
       typeof children === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
         "span",
         {
-          className: utils.cn("truncate", size === "xlarge" ? "px-1" : "px-0.5", validColorStyle.text),
+          className: utils.cn(
+            "truncate",
+            size === "xlarge" ? "px-1" : "px-0.5",
+            colorStyles[color][variant].text
+          ),
           children
         }
       ) : children
@@ -626,6 +596,7 @@ var Button = React.forwardRef(
       {
         className: utils.cn(
           buttonVariants({
+            background,
             className,
             color,
             size,
@@ -649,21 +620,11 @@ var iconButtonSizeClasses = {
   xlarge: "size-12"
 };
 var IconButton = React.forwardRef(
-  ({
-    className,
-    tooltip,
-    variant = "contained",
-    icon,
-    size = "medium",
-    color = "primary",
-    ...props
-  }, ref) => {
+  ({ className, tooltip, icon, size = "medium", ...props }, ref) => {
     const buttonProps = {
       className: utils.cn(iconButtonSizeClasses[size], "px-0", className),
-      color,
       icon,
       size,
-      variant,
       ...props
     };
     return /* @__PURE__ */ jsxRuntime.jsx(chunkWYZY23QK_js.ConditionalTooltip, { tooltip, children: /* @__PURE__ */ jsxRuntime.jsx(Button, { ref, ...buttonProps }) });
@@ -710,7 +671,7 @@ var ButtonGroup = React.forwardRef(
               onClick: item.onClick,
               size
             };
-            return /* @__PURE__ */ jsxRuntime.jsx(chunkWYZY23QK_js.ConditionalTooltip, { tooltip: item.tooltip, children: variant === "contained" ? /* @__PURE__ */ jsxRuntime.jsx(IconButton, { ...iconBaseProps, color: "assistive", variant: "contained" }) : /* @__PURE__ */ jsxRuntime.jsx(IconButton, { ...iconBaseProps, color: "primary", variant: "outlined" }) }, item.id);
+            return /* @__PURE__ */ jsxRuntime.jsx(chunkWYZY23QK_js.ConditionalTooltip, { tooltip: item.tooltip, children: variant === "contained" ? /* @__PURE__ */ jsxRuntime.jsx(IconButton, { ...iconBaseProps, variant: "assistive" }) : /* @__PURE__ */ jsxRuntime.jsx(IconButton, { ...iconBaseProps, color: "primary", variant: "outlined" }) }, item.id);
           }
           const buttonBaseProps = {
             className: utils.cn(roundedClasses, dividerClasses, mergeClasses, hoverClasses),
@@ -718,7 +679,7 @@ var ButtonGroup = React.forwardRef(
             onClick: item.onClick,
             size
           };
-          return /* @__PURE__ */ jsxRuntime.jsx(chunkWYZY23QK_js.ConditionalTooltip, { tooltip: item.tooltip, children: variant === "contained" ? /* @__PURE__ */ jsxRuntime.jsx(Button, { ...buttonBaseProps, color: "assistive", variant: "contained", children: item.label }) : /* @__PURE__ */ jsxRuntime.jsx(Button, { ...buttonBaseProps, color: "primary", variant: "outlined", children: item.label }) }, item.id);
+          return /* @__PURE__ */ jsxRuntime.jsx(chunkWYZY23QK_js.ConditionalTooltip, { tooltip: item.tooltip, children: variant === "contained" ? /* @__PURE__ */ jsxRuntime.jsx(Button, { ...buttonBaseProps, variant: "assistive", children: item.label }) : /* @__PURE__ */ jsxRuntime.jsx(Button, { ...buttonBaseProps, color: "primary", variant: "outlined", children: item.label }) }, item.id);
         })
       }
     );
@@ -1697,8 +1658,7 @@ Modal.Close = React.forwardRef(({ size, ...props }, ref) => {
     {
       ...props,
       ref,
-      color: "assistive",
-      variant: "contained",
+      variant: "assistive",
       size: size ?? (modalSize === "fullsize" ? "large" : "medium")
     }
   ) });
@@ -1846,7 +1806,7 @@ Modal.Action = React.forwardRef(
         ...props,
         ref,
         color,
-        variant: "contained",
+        variant: "solid",
         size: size ?? (modalSize === "fullsize" ? "large" : "medium")
       }
     ) });
@@ -2246,7 +2206,7 @@ MessageBox.Actions = React.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: utils.cn("flex flex-row gap-2", className), ...props })
 );
 MessageBox.Cancel = React.forwardRef(
-  ({ size = "medium", ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(Button, { ref, color: "assistive", variant: "contained", size, ...props }) })
+  ({ size = "medium", ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(Button, { ref, variant: "assistive", size, ...props }) })
 );
 MessageBox.Action = React.forwardRef(
   ({ size = "medium", ...props }, ref) => {
@@ -2256,7 +2216,7 @@ MessageBox.Action = React.forwardRef(
       {
         ref,
         color: variant === "critical" ? "critical" : "primary",
-        variant: "contained",
+        variant: "solid",
         size,
         ...props
       }