@yamada-ui/radio 0.2.4 → 0.2.6

package/dist/index.d.mts

@@ -0,0 +1,7 @@
+export { Radio, RadioProps, UseRadioProps, UseRadioReturn, useRadio } from './radio.mjs';
+export { RadioGroup, RadioGroupProps, UseRadioGroupProps, UseRadioGroupReturn, useRadioGroup } from './radio-group.mjs';
+import '@yamada-ui/core';
+import '@yamada-ui/form-control';
+import '@yamada-ui/utils';
+import 'react';
+import '@yamada-ui/layouts';

package/dist/radio-group.d.mts

@@ -0,0 +1,72 @@
+import * as react from 'react';
+import { ChangeEvent, Ref } from 'react';
+import { ThemeProps, ComponentArgs } from '@yamada-ui/core';
+import { FormControlOptions } from '@yamada-ui/form-control';
+import { FlexProps } from '@yamada-ui/layouts';
+import { PropGetter, DOMAttributes } from '@yamada-ui/utils';
+
+type UseRadioGroupProps<Y extends string | number = string> = {
+    /**
+     * The top-level id string that will be applied to the radios.
+     * The index of the radio will be appended to this top-level id.
+     */
+    id?: string;
+    /**
+     * The HTML `name` attribute used for forms.
+     */
+    name?: string;
+    /**
+     * The value of the radio group.
+     */
+    value?: Y;
+    /**
+     * The initial value of the radio group.
+     */
+    defaultValue?: Y;
+    /**
+     * The callback fired when any children radio is checked or unchecked.
+     */
+    onChange?: (value: Y) => void;
+    /**
+     * If `true`, input elements will receive `checked` attribute instead of `isChecked`.
+     *
+     * This assumes, you're using native radio inputs.
+     *
+     * @default false
+     */
+    isNative?: boolean;
+};
+declare const useRadioGroup: <Y extends string | number = string>({ id, name, isNative, ...props }: UseRadioGroupProps<Y>) => {
+    name: string;
+    value: Y;
+    setValue: react.Dispatch<react.SetStateAction<Y>>;
+    onChange: (evOrValue: ChangeEvent<HTMLInputElement> | Y) => void;
+    onFocus: () => void;
+    getContainerProps: PropGetter;
+    getRadioProps: PropGetter<react.AriaAttributes & react.DOMAttributes<HTMLInputElement> & {
+        [dataAttr: string]: any;
+    } & {
+        id?: string | undefined;
+        role?: react.AriaRole | undefined;
+        tabIndex?: number | undefined;
+        style?: react.CSSProperties | undefined;
+    } & {
+        isChecked?: boolean | undefined;
+    }, Omit<DOMAttributes<HTMLInputElement>, "onChange"> & {
+        onChange: (ev: ChangeEvent<HTMLInputElement> | Y) => void;
+    }>;
+};
+type UseRadioGroupReturn = ReturnType<typeof useRadioGroup>;
+type RadioGroupProps<Y extends string | number = string> = ThemeProps<'Radio'> & Omit<FlexProps, 'onChange'> & UseRadioGroupProps<Y> & FormControlOptions;
+type RadioGroupContext = ThemeProps<'Radio'> & FormControlOptions & {
+    name: string;
+    value: string | number;
+    onChange: (evOrValue: ChangeEvent<HTMLInputElement> | string | number) => void;
+};
+declare const useRadioGroupContenxt: () => RadioGroupContext | undefined;
+
+declare const RadioGroup: (<Y extends string | number = string>(props: ThemeProps<"Radio"> & Omit<FlexProps, "onChange"> & UseRadioGroupProps<Y> & FormControlOptions & {
+    ref?: Ref<HTMLDivElement> | undefined;
+}) => JSX.Element) & ComponentArgs;
+
+export { RadioGroup, RadioGroupProps, UseRadioGroupProps, UseRadioGroupReturn, useRadioGroup, useRadioGroupContenxt };

package/dist/radio.d.mts

@@ -0,0 +1,87 @@
+import { HTMLUIProps, ThemeProps, ComponentArgs } from '@yamada-ui/core';
+import { FormControlOptions } from '@yamada-ui/form-control';
+import { PropGetter } from '@yamada-ui/utils';
+import { ChangeEventHandler, Ref, InputHTMLAttributes } from 'react';
+
+type UseRadioProps<Y extends string | number = string> = FormControlOptions & {
+    /**
+     * id assigned to input.
+     */
+    id?: string;
+    /**
+     * The name of the input field in a radio.
+     */
+    name?: string;
+    /**
+     * The value to be used in the radio button.
+     */
+    value?: Y;
+    /**
+     * If `true`, the radio will be initially checked.
+     *
+     * @default false
+     */
+    defaultChecked?: boolean;
+    /**
+     * If `true`, the radio will be checked.
+     *
+     * @default false
+     */
+    isChecked?: boolean;
+    /**
+     * The callback invoked when the checked state changes.
+     */
+    onChange?: ChangeEventHandler<HTMLInputElement>;
+};
+declare const useRadio: <Y extends string | number = string>(props: UseRadioProps<Y>) => {
+    isFocusVisible: boolean;
+    isFocused: boolean;
+    isHovered: boolean;
+    isActive: boolean;
+    isChecked: boolean;
+    getContainerProps: PropGetter;
+    getInputProps: PropGetter;
+    getIconProps: PropGetter;
+    getLabelProps: PropGetter;
+};
+type UseRadioReturn = ReturnType<typeof useRadio>;
+type RadioOptions = {
+    iconProps?: HTMLUIProps<'span'>;
+    inputProps?: InputHTMLAttributes<HTMLInputElement>;
+    labelProps?: HTMLUIProps<'span'>;
+};
+type RadioProps<Y extends string | number = string> = Omit<HTMLUIProps<'label'>, keyof UseRadioProps> & ThemeProps<'Radio'> & UseRadioProps<Y> & RadioOptions;
+declare const Radio: (<Y extends string | number = string>(props: Omit<HTMLUIProps<"label">, "value" | "name" | "id" | "onChange" | "defaultChecked" | keyof FormControlOptions | "isChecked"> & ThemeProps<"Radio"> & FormControlOptions & {
+    /**
+     * id assigned to input.
+     */
+    id?: string | undefined;
+    /**
+     * The name of the input field in a radio.
+     */
+    name?: string | undefined;
+    /**
+     * The value to be used in the radio button.
+     */
+    value?: Y | undefined;
+    /**
+     * If `true`, the radio will be initially checked.
+     *
+     * @default false
+     */
+    defaultChecked?: boolean | undefined;
+    /**
+     * If `true`, the radio will be checked.
+     *
+     * @default false
+     */
+    isChecked?: boolean | undefined;
+    /**
+     * The callback invoked when the checked state changes.
+     */
+    onChange?: ChangeEventHandler<HTMLInputElement> | undefined;
+} & RadioOptions & {
+    ref?: Ref<HTMLInputElement> | undefined;
+}) => JSX.Element) & ComponentArgs;
+
+export { Radio, RadioProps, UseRadioProps, UseRadioReturn, useRadio };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yamada-ui/radio",
-  "version": "0.2.4",
+  "version": "0.2.6",
   "description": "Yamada UI radio component",
   "keywords": [
     "yamada",
@@ -35,12 +35,12 @@
     "url": "https://github.com/hirotomoyamada/yamada-ui/issues"
   },
   "dependencies": {
-    "@yamada-ui/core": "0.4.3",
-    "@yamada-ui/utils": "0.1.2",
-    "@yamada-ui/form-control": "0.2.4",
-    "@yamada-ui/layouts": "0.2.4",
-    "@yamada-ui/use-controllable-state": "0.1.3",
-    "@yamada-ui/use-focus-visible": "0.1.2"
+    "@yamada-ui/core": "0.5.1",
+    "@yamada-ui/utils": "0.1.3",
+    "@yamada-ui/form-control": "0.2.6",
+    "@yamada-ui/layouts": "0.2.6",
+    "@yamada-ui/use-controllable-state": "0.1.4",
+    "@yamada-ui/use-focus-visible": "0.1.3"
   },
   "devDependencies": {
     "react": "^18.0.0",