@yamada-ui/react 2.0.10-dev-20260301101758 → 2.1.0-dev-20260302125757

package/dist/types/components/file-input/file-input.style.d.ts

@@ -197,6 +197,12 @@ declare const fileInputStyle: ComponentSlotStyle<"root" | "tag", CSSPropObject<C
       border: "1px solid transparent";
       focusRingColor: "{focus-border-color}";
       focusVisibleRing: "inside";
+      _container: {
+        css: {
+          bg: "bg";
+        };
+        style: string;
+      }[];
       _invalid: {
         borderColor: "{error-border-color}";
         focusRingColor: "{error-border-color}";
@@ -234,6 +240,12 @@ declare const fileInputStyle: ComponentSlotStyle<"root" | "tag", CSSPropObject<C
       border: "1px solid {colors.border}";
       focusRingColor: "{focus-border-color}";
       focusVisibleRing: "inside";
+      _container: {
+        css: {
+          bg: "bg";
+        };
+        style: string;
+      }[];
       _invalid: {
         borderColor: "{error-border-color}";
         focusRingColor: "{error-border-color}";

package/dist/types/components/file-input/use-file-input.d.ts

@@ -5,7 +5,7 @@ import { FieldProps } from "../field/field.js";
 import "../field/index.js";
 import { UseClickableProps } from "../../hooks/use-clickable/index.js";
 import "../../index.js";
-import * as react876 from "react";
+import * as react840 from "react";
 import { RefObject } from "react";
 
 //#region src/components/file-input/use-file-input.d.ts
@@ -33,31 +33,31 @@ declare const useFileInput: <Y extends "button" | "input" = "input">(props: UseF
   readOnly: boolean | undefined;
   required: boolean | undefined;
   values: File[] | undefined;
-  clickableProps: (Omit<UseClickableProps<HTMLElement, Dict<any>>, "disabled" | "ref" | "tabIndex" | "onKeyDown" | "onKeyUp" | "onClick" | "onMouseDown" | "onMouseLeave" | "onMouseOver" | "onMouseUp" | "clickOnEnter" | "clickOnSpace" | "disableTouchBehavior" | "focusable" | "focusOnClick"> & {
+  clickableProps: (Omit<UseClickableProps<HTMLElement, Dict<any>>, "disabled" | "ref" | "tabIndex" | "onKeyDown" | "onKeyUp" | "onClick" | "onMouseDown" | "onMouseLeave" | "onMouseOver" | "onMouseUp" | "focusable" | "clickOnEnter" | "clickOnSpace" | "disableTouchBehavior" | "focusOnClick"> & {
     ref: (node: any) => void;
     type: "button";
     "aria-disabled": boolean | undefined;
     disabled: boolean | undefined;
-    onClick: (ev: react876.MouseEvent<HTMLElement, MouseEvent>) => void;
-    onKeyDown: react876.KeyboardEventHandler<HTMLElement> | undefined;
-    onKeyUp: react876.KeyboardEventHandler<HTMLElement> | undefined;
-    onMouseDown: react876.MouseEventHandler<HTMLElement> | undefined;
-    onMouseLeave: react876.MouseEventHandler<HTMLElement> | undefined;
-    onMouseOver: react876.MouseEventHandler<HTMLElement> | undefined;
-    onMouseUp: react876.MouseEventHandler<HTMLElement> | undefined;
-  }) | (Omit<UseClickableProps<HTMLElement, Dict<any>>, "disabled" | "ref" | "tabIndex" | "onKeyDown" | "onKeyUp" | "onClick" | "onMouseDown" | "onMouseLeave" | "onMouseOver" | "onMouseUp" | "clickOnEnter" | "clickOnSpace" | "disableTouchBehavior" | "focusable" | "focusOnClick"> & {
+    onClick: (ev: react840.MouseEvent<HTMLElement, MouseEvent>) => void;
+    onKeyDown: react840.KeyboardEventHandler<HTMLElement> | undefined;
+    onKeyUp: react840.KeyboardEventHandler<HTMLElement> | undefined;
+    onMouseDown: react840.MouseEventHandler<HTMLElement> | undefined;
+    onMouseLeave: react840.MouseEventHandler<HTMLElement> | undefined;
+    onMouseOver: react840.MouseEventHandler<HTMLElement> | undefined;
+    onMouseUp: react840.MouseEventHandler<HTMLElement> | undefined;
+  }) | (Omit<UseClickableProps<HTMLElement, Dict<any>>, "disabled" | "ref" | "tabIndex" | "onKeyDown" | "onKeyUp" | "onClick" | "onMouseDown" | "onMouseLeave" | "onMouseOver" | "onMouseUp" | "focusable" | "clickOnEnter" | "clickOnSpace" | "disableTouchBehavior" | "focusOnClick"> & {
     ref: (node: any) => void;
     "aria-disabled": "true" | undefined;
     "data-active": string | undefined;
     role: string;
     tabIndex: number | undefined;
-    onClick: (ev: react876.MouseEvent<HTMLElement, MouseEvent>) => void;
-    onKeyDown: (ev: react876.KeyboardEvent<HTMLElement>) => void;
-    onKeyUp: (ev: react876.KeyboardEvent<HTMLElement>) => void;
-    onMouseDown: (ev: react876.MouseEvent<HTMLElement, MouseEvent>) => void;
-    onMouseLeave: (ev: react876.MouseEvent<HTMLElement, MouseEvent>) => void;
-    onMouseOver: (ev: react876.MouseEvent<HTMLElement, MouseEvent>) => void;
-    onMouseUp: (ev: react876.MouseEvent<HTMLElement, MouseEvent>) => void;
+    onClick: (ev: react840.MouseEvent<HTMLElement, MouseEvent>) => void;
+    onKeyDown: (ev: react840.KeyboardEvent<HTMLElement>) => void;
+    onKeyUp: (ev: react840.KeyboardEvent<HTMLElement>) => void;
+    onMouseDown: (ev: react840.MouseEvent<HTMLElement, MouseEvent>) => void;
+    onMouseLeave: (ev: react840.MouseEvent<HTMLElement, MouseEvent>) => void;
+    onMouseOver: (ev: react840.MouseEvent<HTMLElement, MouseEvent>) => void;
+    onMouseUp: (ev: react840.MouseEvent<HTMLElement, MouseEvent>) => void;
   });
   getFieldProps: PropGetter<"div", undefined, undefined>;
   getInputProps: PropGetter<"input", undefined, undefined>;

package/dist/types/components/flex/flex.d.ts

@@ -4,7 +4,7 @@ import { Component, HTMLStyledProps } from "../../core/components/index.types.js
 import "../../core/index.js";
 import { FlexStyle } from "./flex.style.js";
 import "../../index.js";
-import * as react873 from "react";
+import * as react839 from "react";
 
 //#region src/components/flex/flex.d.ts
 interface FlexProps extends Omit<HTMLStyledProps, "direction">, ThemeProps<FlexStyle> {
@@ -37,7 +37,7 @@ interface FlexProps extends Omit<HTMLStyledProps, "direction">, ThemeProps<FlexS
    */
   wrap?: CSSProps["flexWrap"];
 }
-declare const FlexPropsContext: react873.Context<Partial<FlexProps> | undefined>, useFlexPropsContext: () => Partial<FlexProps> | undefined;
+declare const FlexPropsContext: react839.Context<Partial<FlexProps> | undefined>, useFlexPropsContext: () => Partial<FlexProps> | undefined;
 /**
  * `Flex` is a component that sets `flex` to `Box`. Also, convenient style shorthand is available.
  *

package/dist/types/components/flip/flip.d.ts

@@ -7,7 +7,7 @@ import "../motion/index.js";
 import { FlipStyle } from "./flip.style.js";
 import "../../index.js";
 import * as react_jsx_runtime6 from "react/jsx-runtime";
-import * as react875 from "react";
+import * as react838 from "react";
 import { ReactNode } from "react";
 
 //#region src/components/flip/flip.d.ts
@@ -65,7 +65,7 @@ interface FlipProps extends Omit<HTMLMotionProps<"button">, "onChange">, ThemePr
    */
   onChange?: (value: KeyframeIdent) => void;
 }
-declare const FlipPropsContext: react875.Context<Partial<FlipProps> | undefined>, useFlipPropsContext: () => Partial<FlipProps> | undefined;
+declare const FlipPropsContext: react838.Context<Partial<FlipProps> | undefined>, useFlipPropsContext: () => Partial<FlipProps> | undefined;
 /**
  * `Flip` is an animation component that alternates between flipping two elements.
  *

package/dist/types/components/float/float.d.ts

@@ -4,7 +4,7 @@ import { Component, HTMLStyledProps } from "../../core/components/index.types.js
 import "../../core/index.js";
 import { FloatStyle } from "./float.style.js";
 import "../../index.js";
-import * as react874 from "react";
+import * as react837 from "react";
 
 //#region src/components/float/float.d.ts
 interface FloatProps extends Omit<HTMLStyledProps, "offset">, ThemeProps<FloatStyle> {
@@ -13,7 +13,7 @@ interface FloatProps extends Omit<HTMLStyledProps, "offset">, ThemeProps<FloatSt
    */
   offset?: CSSProps["inset"];
 }
-declare const FloatPropsContext: react874.Context<Partial<FloatProps> | undefined>, useFloatPropsContext: () => Partial<FloatProps> | undefined;
+declare const FloatPropsContext: react837.Context<Partial<FloatProps> | undefined>, useFloatPropsContext: () => Partial<FloatProps> | undefined;
 /**
  * `Float` is a component used to anchor an element to the edge of a container.
  *

package/dist/types/components/form/form.d.ts

@@ -0,0 +1,129 @@
+import { ThemeProps } from "../../core/system/index.types.js";
+import { Component, HTMLStyledProps } from "../../core/components/index.types.js";
+import "../../core/index.js";
+import { ButtonProps } from "../button/button.js";
+import "../button/index.js";
+import { FormStyle } from "./form.style.js";
+import "../../index.js";
+import * as react828 from "react";
+import { ReactNode } from "react";
+
+//#region src/components/form/form.d.ts
+interface FormContext extends Pick<FormRootProps, "disabled" | "errorMessage" | "helperMessage" | "invalid" | "optionalIndicator" | "readOnly" | "replace" | "required" | "requiredIndicator" | "size" | "variant"> {
+  descriptionId: string;
+  id: string;
+  titleId: string;
+}
+declare const FormContext: react828.Context<FormContext | undefined>, useFormContext: () => FormContext | undefined;
+interface FormRootProps extends Omit<HTMLStyledProps<"form">, "title">, ThemeProps<FormStyle> {
+  /**
+   * The form description to use.
+   */
+  description?: ReactNode;
+  /**
+   * An object managing the disabled state of each field.
+   */
+  disabled?: boolean | {
+    [key: string]: boolean | undefined;
+  };
+  /**
+   * An object managing the error message of each field.
+   */
+  errorMessage?: {
+    [key: string]: ReactNode;
+  };
+  /**
+   * An object managing the helper message of each field.
+   */
+  helperMessage?: {
+    [key: string]: ReactNode;
+  };
+  /**
+   * An object managing the invalid state of each field.
+   */
+  invalid?: boolean | {
+    [key: string]: boolean | undefined;
+  };
+  /**
+   * The optional indicator to use for each field.
+   */
+  optionalIndicator?: ReactNode;
+  /**
+   * An object managing the read only state of each field.
+   */
+  readOnly?: boolean | {
+    [key: string]: boolean | undefined;
+  };
+  /**
+   * An object managing the replace state of each field.
+   */
+  replace?: boolean | {
+    [key: string]: boolean | undefined;
+  };
+  /**
+   * An object managing the required state of each field.
+   */
+  required?: boolean | {
+    [key: string]: boolean | undefined;
+  };
+  /**
+   * The required indicator to use for each field.
+   */
+  requiredIndicator?: ReactNode;
+  /**
+   * The submit button to use.
+   */
+  submitButton?: ReactNode;
+  /**
+   * The form title to use.
+   */
+  title?: ReactNode;
+  /**
+   * Props the body component.
+   */
+  bodyProps?: FormBodyProps;
+  /**
+   * Props the description component.
+   */
+  descriptionProps?: FormDescriptionProps;
+  /**
+   * Props the footer component.
+   */
+  footerProps?: FormFooterProps;
+  /**
+   * Props the header component.
+   */
+  headerProps?: FormHeaderProps;
+  /**
+   * Props the submit button component.
+   */
+  submitButtonProps?: FormSubmitButtonProps;
+  /**
+   * Props the title component.
+   */
+  titleProps?: FormTitleProps;
+}
+declare const FormPropsContext: react828.Context<Partial<FormRootProps> | undefined>, useFormPropsContext: () => Partial<FormRootProps> | undefined;
+/**
+ * `Form` is a component used to group multiple form elements.
+ *
+ * @see https://yamada-ui.com/docs/components/form
+ */
+declare const FormRoot: Component<"form", FormRootProps>;
+interface FormHeaderProps extends HTMLStyledProps {}
+declare const FormHeader: Component<"div", FormHeaderProps>;
+interface FormTitleProps extends HTMLStyledProps<"h3"> {}
+declare const FormTitle: Component<"h3", FormTitleProps>;
+interface FormDescriptionProps extends HTMLStyledProps<"p"> {}
+declare const FormDescription: Component<"p", FormDescriptionProps>;
+interface FormBodyProps extends HTMLStyledProps {}
+declare const FormBody: Component<"div", FormBodyProps>;
+interface FormGroupProps extends HTMLStyledProps {}
+declare const FormGroup: Component<"div", FormGroupProps>;
+interface FormFooterProps extends HTMLStyledProps {}
+declare const FormFooter: Component<"div", FormFooterProps>;
+interface FormSubmitButtonProps extends ButtonProps {}
+declare const FormSubmitButton: Component<"button", FormSubmitButtonProps>;
+//#endregion
+export { FormBody, FormBodyProps, FormContext, FormDescription, FormDescriptionProps, FormFooter, FormFooterProps, FormGroup, FormGroupProps, FormHeader, FormHeaderProps, FormPropsContext, FormRoot, FormRootProps, FormSubmitButton, FormSubmitButtonProps, FormTitle, FormTitleProps, useFormContext, useFormPropsContext };
+//# sourceMappingURL=form.d.ts.map

package/dist/types/components/form/form.style.d.ts

@@ -0,0 +1,107 @@
+import { ComponentSlotStyle } from "../../core/system/index.types.js";
+import { CSSPropObject, CSSSlotObject } from "../../core/css/index.types.js";
+import "../../core/index.js";
+import "../../index.js";
+
+//#region src/components/form/form.style.d.ts
+declare const formStyle: ComponentSlotStyle<"body" | "footer" | "header" | "title" | "group" | "root" | "description" | "submitButton", CSSPropObject<CSSSlotObject<"body" | "footer" | "header" | "title" | "group" | "root" | "description" | "submitButton">>, {
+  sm: {
+    body: {
+      gap: "5";
+    };
+    description: {
+      fontSize: "sm";
+      gap: "1";
+    };
+    footer: {
+      gap: "3";
+    };
+    group: {
+      gap: "3" | undefined;
+    };
+    header: {
+      gap: "1";
+    };
+    root: {
+      gap: "5";
+    };
+    title: {
+      fontSize: "xl";
+      gap: "1";
+    };
+  };
+  md: {
+    body: {
+      gap: "6";
+    };
+    description: {
+      fontSize: "sm";
+      gap: "1";
+    };
+    footer: {
+      gap: "4";
+    };
+    group: {
+      gap: "4" | undefined;
+    };
+    header: {
+      gap: "1";
+    };
+    root: {
+      gap: "6";
+    };
+    title: {
+      fontSize: "2xl";
+      gap: "1";
+    };
+  };
+  lg: {
+    body: {
+      gap: "8";
+    };
+    description: {
+      fontSize: "md";
+      gap: "1";
+    };
+    footer: {
+      gap: "6";
+    };
+    group: {
+      gap: "6" | undefined;
+    };
+    header: {
+      gap: "1";
+    };
+    root: {
+      gap: "8";
+    };
+    title: {
+      fontSize: "3xl";
+      gap: "1";
+    };
+  };
+}, {
+  elevated: {
+    group: {
+      bg: "bg.panel";
+      boxShadow: "md";
+    } | undefined;
+  };
+  outline: {
+    group: {
+      borderWidth: "1px";
+    } | undefined;
+  };
+  panel: {
+    group: {
+      layerStyle: "panel";
+    } | undefined;
+  };
+  plain: {
+    group: {} | undefined;
+  };
+}>;
+type FormStyle = typeof formStyle;
+//#endregion
+export { FormStyle, formStyle };
+//# sourceMappingURL=form.style.d.ts.map

package/dist/types/components/form/index.d.ts

@@ -0,0 +1,4 @@
+import { FormStyle, formStyle } from "./form.style.js";
+import { FormBody, FormBodyProps, FormContext, FormDescription, FormDescriptionProps, FormFooter, FormFooterProps, FormGroup, FormGroupProps, FormHeader, FormHeaderProps, FormPropsContext, FormRoot, FormRootProps, FormSubmitButton, FormSubmitButtonProps, FormTitle, FormTitleProps, useFormContext, useFormPropsContext } from "./form.js";
+import { namespace_d_exports } from "./namespace.js";
+export { namespace_d_exports as Form, FormBody, type FormBodyProps, FormContext, FormDescription, type FormDescriptionProps, FormFooter, type FormFooterProps, FormGroup, type FormGroupProps, FormHeader, type FormHeaderProps, FormPropsContext, FormRoot, type FormRootProps, FormStyle, FormSubmitButton, type FormSubmitButtonProps, FormTitle, type FormTitleProps, formStyle, useFormContext, useFormPropsContext };

package/dist/types/components/form/namespace.d.ts

@@ -0,0 +1,9 @@
+import { FormBody, FormBodyProps, FormDescription, FormDescriptionProps, FormFooter, FormFooterProps, FormGroup, FormGroupProps, FormHeader, FormHeaderProps, FormPropsContext, FormRoot, FormRootProps, FormSubmitButton, FormSubmitButtonProps, FormTitle, FormTitleProps, useFormPropsContext } from "./form.js";
+
+//#region src/components/form/namespace.d.ts
+declare namespace namespace_d_exports {
+  export { FormBody as Body, FormBodyProps as BodyProps, FormDescription as Description, FormDescriptionProps as DescriptionProps, FormFooter as Footer, FormFooterProps as FooterProps, FormGroup as Group, FormGroupProps as GroupProps, FormHeader as Header, FormHeaderProps as HeaderProps, FormPropsContext as PropsContext, FormRoot as Root, FormRootProps as RootProps, FormSubmitButton as SubmitButton, FormSubmitButtonProps as SubmitButtonProps, FormTitle as Title, FormTitleProps as TitleProps, useFormPropsContext as usePropsContext };
+}
+//#endregion
+export { namespace_d_exports };
+//# sourceMappingURL=namespace.d.ts.map

package/dist/types/components/format/format-byte.d.ts

@@ -6,7 +6,7 @@ import { FormatByteStyle } from "./format-byte.style.js";
 import { FormatBytesOptions } from "./use-format-byte.js";
 import "../../index.js";
 import * as react_jsx_runtime4 from "react/jsx-runtime";
-import * as react863 from "react";
+import * as react820 from "react";
 
 //#region src/components/format/format-byte.d.ts
 interface FormatByteProps extends HTMLStyledProps<"span">, ThemeProps<FormatByteStyle>, FormatBytesOptions {
@@ -15,7 +15,7 @@ interface FormatByteProps extends HTMLStyledProps<"span">, ThemeProps<FormatByte
    */
   value: number;
 }
-declare const FormatBytePropsContext: react863.Context<Partial<FormatByteProps> | undefined>, useFormatBytePropsContext: () => Partial<FormatByteProps> | undefined;
+declare const FormatBytePropsContext: react820.Context<Partial<FormatByteProps> | undefined>, useFormatBytePropsContext: () => Partial<FormatByteProps> | undefined;
 /**
  * `Format` is used to format dates, numbers, and bytes according to a specific locale.
  *

package/dist/types/components/format/format-date-time.d.ts

@@ -6,7 +6,7 @@ import { FormatDateTimeStyle } from "./format-date-time.style.js";
 import { FormatDateTimeOptions } from "./use-format-date-time.js";
 import "../../index.js";
 import * as react_jsx_runtime5 from "react/jsx-runtime";
-import * as react864 from "react";
+import * as react822 from "react";
 
 //#region src/components/format/format-date-time.d.ts
 interface FormatDateTimeProps extends HTMLStyledProps<"span">, ThemeProps<FormatDateTimeStyle>, FormatDateTimeOptions {
@@ -15,7 +15,7 @@ interface FormatDateTimeProps extends HTMLStyledProps<"span">, ThemeProps<Format
    */
   value: Date;
 }
-declare const FormatDateTimePropsContext: react864.Context<Partial<FormatDateTimeProps> | undefined>, useFormatDateTimePropsContext: () => Partial<FormatDateTimeProps> | undefined;
+declare const FormatDateTimePropsContext: react822.Context<Partial<FormatDateTimeProps> | undefined>, useFormatDateTimePropsContext: () => Partial<FormatDateTimeProps> | undefined;
 /**
  * `Format` is used to format dates, numbers, and bytes according to a specific locale.
  *

package/dist/types/components/format/format-number.d.ts

@@ -4,7 +4,7 @@ import "../../core/index.js";
 import { FormatNumberStyle } from "./format-number.style.js";
 import { FormatNumberOptions } from "./use-format-number.js";
 import "../../index.js";
-import * as react865 from "react";
+import * as react821 from "react";
 
 //#region src/components/format/format-number.d.ts
 interface FormatNumberProps extends Omit<HTMLStyledProps<"span">, "style">, ThemeProps<FormatNumberStyle>, FormatNumberOptions {
@@ -13,7 +13,7 @@ interface FormatNumberProps extends Omit<HTMLStyledProps<"span">, "style">, Them
    */
   value: number;
 }
-declare const FormatNumberPropsContext: react865.Context<Partial<FormatNumberProps> | undefined>, useFormatNumberPropsContext: () => Partial<FormatNumberProps> | undefined;
+declare const FormatNumberPropsContext: react821.Context<Partial<FormatNumberProps> | undefined>, useFormatNumberPropsContext: () => Partial<FormatNumberProps> | undefined;
 /**
  * `Format` is used to format dates, numbers, and bytes according to a specific locale.
  *

package/dist/types/components/grid/grid-item.d.ts

@@ -2,7 +2,7 @@ import { CSSProps, StyleValue } from "../../core/css/index.types.js";
 import { Component, HTMLStyledProps } from "../../core/components/index.types.js";
 import "../../core/index.js";
 import "../../index.js";
-import * as react870 from "react";
+import * as react826 from "react";
 
 //#region src/components/grid/grid-item.d.ts
 interface GridItemProps extends HTMLStyledProps {
@@ -35,7 +35,7 @@ interface GridItemProps extends HTMLStyledProps {
    */
   rowStart?: CSSProps["gridRowStart"];
 }
-declare const GridItemPropsContext: react870.Context<Partial<GridItemProps> | undefined>, useGridItemPropsContext: () => Partial<GridItemProps> | undefined;
+declare const GridItemPropsContext: react826.Context<Partial<GridItemProps> | undefined>, useGridItemPropsContext: () => Partial<GridItemProps> | undefined;
 declare const GridItem: Component<"div", GridItemProps>;
 //#endregion
 export { GridItem, GridItemProps, GridItemPropsContext, useGridItemPropsContext };

package/dist/types/components/grid/grid.d.ts

@@ -4,7 +4,7 @@ import { Component, HTMLStyledProps } from "../../core/components/index.types.js
 import "../../core/index.js";
 import { GridStyle } from "./grid.style.js";
 import "../../index.js";
-import * as react871 from "react";
+import * as react827 from "react";
 
 //#region src/components/grid/grid.d.ts
 interface GridProps extends HTMLStyledProps, ThemeProps<GridStyle> {
@@ -45,7 +45,7 @@ interface GridProps extends HTMLStyledProps, ThemeProps<GridStyle> {
    */
   templateRows?: CSSProps["gridTemplateRows"];
 }
-declare const GridPropsContext: react871.Context<Partial<GridProps> | undefined>, useGridPropsContext: () => Partial<GridProps> | undefined;
+declare const GridPropsContext: react827.Context<Partial<GridProps> | undefined>, useGridPropsContext: () => Partial<GridProps> | undefined;
 /**
  * `Grid` is a component for managing grid layouts. It also comes with handy style shorthand.
  *

package/dist/types/components/group/group.d.ts

@@ -5,11 +5,11 @@ import { GroupStyle } from "./group.style.js";
 import { FlexProps } from "../flex/flex.js";
 import "../flex/index.js";
 import "../../index.js";
-import * as react861 from "react";
+import * as react825 from "react";
 
 //#region src/components/group/group.d.ts
 interface GroupProps extends Omit<FlexProps, "grow">, ThemeProps<GroupStyle> {}
-declare const GroupPropsContext: react861.Context<Partial<GroupProps> | undefined>, useGroupPropsContext: () => Partial<GroupProps> | undefined;
+declare const GroupPropsContext: react825.Context<Partial<GroupProps> | undefined>, useGroupPropsContext: () => Partial<GroupProps> | undefined;
 /**
  * `Group` is a component that groups and attaches multiple elements together.
  *

package/dist/types/components/group/use-group.d.ts

@@ -1,9 +1,9 @@
-import * as react859 from "react";
+import * as react823 from "react";
 import { CSSProperties, DataAttributes, ReactNode } from "react";
 import * as csstype0 from "csstype";
 
 //#region src/components/group/use-group.d.ts
-declare const useGroup: (children?: ReactNode) => react859.ReactElement<any, string | react859.JSXElementConstructor<any>>[];
+declare const useGroup: (children?: ReactNode) => react823.ReactElement<any, string | react823.JSXElementConstructor<any>>[];
 type UseGroupReturn = ReturnType<typeof useGroup>;
 interface Props extends DataAttributes {
   style?: CSSProperties;

package/dist/types/components/heading/heading.d.ts

@@ -3,11 +3,11 @@ import { Component, HTMLStyledProps } from "../../core/components/index.types.js
 import "../../core/index.js";
 import { HeadingStyle } from "./heading.style.js";
 import "../../index.js";
-import * as react862 from "react";
+import * as react819 from "react";
 
 //#region src/components/heading/heading.d.ts
 interface HeadingProps extends HTMLStyledProps<"h1">, ThemeProps<HeadingStyle> {}
-declare const HeadingPropsContext: react862.Context<Partial<HeadingProps> | undefined>, useHeadingPropsContext: () => Partial<HeadingProps> | undefined;
+declare const HeadingPropsContext: react819.Context<Partial<HeadingProps> | undefined>, useHeadingPropsContext: () => Partial<HeadingProps> | undefined;
 /**
  * `Heading` is a component that represents section headings. By default, it renders an `h1` element.
  *

package/dist/types/components/hue-slider/hue-slider.d.ts

@@ -5,7 +5,7 @@ import { HueSliderStyle } from "./hue-slider.style.js";
 import { SliderRootProps, SliderThumbProps, SliderTrackProps } from "../slider/slider.js";
 import "../slider/index.js";
 import "../../index.js";
-import * as react857 from "react";
+import * as react817 from "react";
 
 //#region src/components/hue-slider/hue-slider.d.ts
 interface HueSliderRootProps extends WithoutThemeProps<Omit<SliderRootProps, "betweenThumbs" | "marks" | "marksProps" | "max" | "rangeFill" | "rangeProps" | "thumbFill" | "thumbProps" | "trackFill" | "trackProps">, HueSliderStyle>, ThemeProps<HueSliderStyle> {
@@ -28,7 +28,7 @@ interface HueSliderRootProps extends WithoutThemeProps<Omit<SliderRootProps, "be
    */
   trackProps?: HueSliderTrackProps;
 }
-declare const HueSliderPropsContext: react857.Context<Partial<HueSliderRootProps> | undefined>, useHueSliderPropsContext: () => Partial<HueSliderRootProps> | undefined;
+declare const HueSliderPropsContext: react817.Context<Partial<HueSliderRootProps> | undefined>, useHueSliderPropsContext: () => Partial<HueSliderRootProps> | undefined;
 /**
  * `HueSlider` is a component used to allow the user to select a color hue.
  *
@@ -43,7 +43,7 @@ interface HueSliderOverlayProps extends HTMLStyledProps {
    */
   layers?: HTMLStyledProps[];
 }
-declare const HueSliderOverlay: react857.FunctionComponent<HueSliderOverlayProps>;
+declare const HueSliderOverlay: react817.FunctionComponent<HueSliderOverlayProps>;
 interface HueSliderThumbProps extends SliderThumbProps {}
 declare const HueSliderThumb: Component<"div", HueSliderThumbProps>;
 //#endregion

package/dist/types/components/icon/icon.d.ts

@@ -5,22 +5,22 @@ import { ComponentOptions, ComponentWithContextOptions, InitialProps, SuperProps
 import "../../core/index.js";
 import { IconStyle } from "./icon.style.js";
 import "../../index.js";
-import * as react850 from "react";
+import * as react812 from "react";
 import * as _yamada_ui_utils7 from "@yamada-ui/utils";
 
 //#region src/components/icon/icon.d.ts
 interface IconProps extends HTMLStyledProps<"svg">, ThemeProps<IconStyle> {}
-declare const component: <D extends "fragment" | As = "div", H extends _yamada_ui_utils7.Dict = IconProps>(el: D | react850.FC<H>, {
+declare const component: <D extends "fragment" | As = "div", H extends _yamada_ui_utils7.Dict = IconProps>(el: D | react812.FC<H>, {
     name,
     className,
     ...options
-  }?: ComponentOptions) => (...superProps: SuperProps<H>[]) => D extends "fragment" ? react850.FunctionComponent<H> : Component<Exclude<D, "fragment">, H>, IconPropsContext: react850.Context<Partial<IconProps> | undefined>, useIconPropsContext: () => Partial<IconProps> | undefined, withContext: <D extends "fragment" | As = "div", H extends IconProps = IconProps, R extends keyof H = keyof H>(el: D | react850.FC<WithoutThemeProps<H, ComponentStyle<CSSPropObject<CSSObject>, CSSModifierObject, CSSModifierObject>, R>>, {
+  }?: ComponentOptions) => (initialProps?: InitialProps<H>, ...superProps: SuperProps<H>[]) => D extends "fragment" ? react812.FunctionComponent<H> : Component<Exclude<D, "fragment">, H>, IconPropsContext: react812.Context<Partial<IconProps> | undefined>, useIconPropsContext: () => Partial<IconProps> | undefined, withContext: <D extends "fragment" | As = "div", H extends IconProps = IconProps, R extends keyof H = keyof H>(el: D | react812.FC<WithoutThemeProps<H, ComponentStyle<CSSPropObject<CSSObject>, CSSModifierObject, CSSModifierObject>, R>>, {
     name,
     className,
     withContext,
     transferProps,
     ...options
-  }?: ComponentWithContextOptions<R>) => (initialProps?: InitialProps<H>, ...superProps: SuperWithoutThemeProps<H, ComponentStyle<CSSPropObject<CSSObject>, CSSModifierObject, CSSModifierObject>, R>[]) => D extends "fragment" ? react850.FunctionComponent<H> : Component<Exclude<D, "fragment">, H>;
+  }?: ComponentWithContextOptions<R>) => (initialProps?: InitialProps<H>, ...superProps: SuperWithoutThemeProps<H, ComponentStyle<CSSPropObject<CSSObject>, CSSModifierObject, CSSModifierObject>, R>[]) => D extends "fragment" ? react812.FunctionComponent<H> : Component<Exclude<D, "fragment">, H>;
 /**
  * `Icon` is a general icon component that can be used in your projects.
  *

package/dist/types/components/image/image.d.ts

@@ -4,7 +4,7 @@ import { Component, HTMLStyledProps } from "../../core/components/index.types.js
 import "../../core/index.js";
 import { ImageStyle } from "./image.style.js";
 import "../../index.js";
-import * as react856 from "react";
+import * as react811 from "react";
 
 //#region src/components/image/image.d.ts
 interface ImageProps extends HTMLStyledProps<"img">, ThemeProps<ImageStyle> {
@@ -13,7 +13,7 @@ interface ImageProps extends HTMLStyledProps<"img">, ThemeProps<ImageStyle> {
    */
   fit?: CSSProps["objectFit"];
 }
-declare const ImagePropsContext: react856.Context<Partial<ImageProps> | undefined>, useImagePropsContext: () => Partial<ImageProps> | undefined;
+declare const ImagePropsContext: react811.Context<Partial<ImageProps> | undefined>, useImagePropsContext: () => Partial<ImageProps> | undefined;
 /**
  * `Image` is a component that displays images with fallback support.
  *

package/dist/types/components/indicator/indicator.d.ts

@@ -7,7 +7,7 @@ import "../float/index.js";
 import { IndicatorStyle } from "./indicator.style.js";
 import "../../index.js";
 import * as react_jsx_runtime3 from "react/jsx-runtime";
-import * as react855 from "react";
+import * as react810 from "react";
 import { ReactNode } from "react";
 
 //#region src/components/indicator/indicator.d.ts
@@ -71,7 +71,7 @@ interface IndicatorProps extends Omit<HTMLStyledProps, "offset">, Omit<ThemeProp
    */
   labelProps?: IndicatorLabelProps;
 }
-declare const IndicatorPropsContext: react855.Context<Partial<IndicatorProps> | undefined>, useIndicatorPropsContext: () => Partial<IndicatorProps> | undefined;
+declare const IndicatorPropsContext: react810.Context<Partial<IndicatorProps> | undefined>, useIndicatorPropsContext: () => Partial<IndicatorProps> | undefined;
 /**
  * `Indicator` is a component that displays at the corner of elements such as avatars.
  *