@yamada-ui/radio 1.0.5 → 1.0.6-dev-20240104230031

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -20,7 +20,7 @@ import { ui, useMultiComponentStyle, omitThemeProps } from "@yamada-ui/core";
20
20
  import {
21
21
  useFormControl,
22
22
  useFormControlProps,
23
- formControlProperties
23
+ getFormControlProperties
24
24
  } from "@yamada-ui/form-control";
25
25
  import { trackFocusVisible } from "@yamada-ui/use-focus-visible";
26
26
  import {
@@ -36,6 +36,10 @@ import { forwardRef, useCallback, useEffect, useState } from "react";
36
36
  import { jsx, jsxs } from "react/jsx-runtime";
37
37
  var useRadio = (props) => {
38
38
  const { id, name, value, required, disabled, readOnly, ...rest } = useFormControlProps(props);
39
+ const formControlProps = pickObject(
40
+ rest,
41
+ getFormControlProperties({ omit: ["aria-readonly"] })
42
+ );
39
43
  const [isFocusVisible, setIsFocusVisible] = useState(false);
40
44
  const [isFocused, setFocused] = useState(false);
41
45
  const [isHovered, setHovered] = useState(false);
@@ -77,16 +81,16 @@ var useRadio = (props) => {
77
81
  );
78
82
  const getContainerProps = useCallback(
79
83
  (props2 = {}, ref = null) => ({
80
- ...pickObject(rest, formControlProperties),
84
+ ...formControlProps,
81
85
  ...props2,
82
86
  ref,
83
87
  "data-checked": dataAttr(checked)
84
88
  }),
85
- [checked, rest]
89
+ [checked, formControlProps]
86
90
  );
87
91
  const getIconProps = useCallback(
88
92
  (props2 = {}, ref = null) => ({
89
- ...pickObject(rest, formControlProperties),
93
+ ...formControlProps,
90
94
  ...props2,
91
95
  ref,
92
96
  "data-active": dataAttr(isActive),
@@ -100,11 +104,11 @@ var useRadio = (props) => {
100
104
  onMouseEnter: handlerAll(props2.onMouseEnter, () => setHovered(true)),
101
105
  onMouseLeave: handlerAll(props2.onMouseLeave, () => setHovered(false))
102
106
  }),
103
- [checked, isActive, isFocused, isFocusVisible, isHovered, rest]
107
+ [checked, isActive, isFocused, isFocusVisible, isHovered, formControlProps]
104
108
  );
105
109
  const getInputProps = useCallback(
106
110
  (props2 = {}, ref = null) => ({
107
- ...pickObject(rest, formControlProperties),
111
+ ...formControlProps,
108
112
  ...props2,
109
113
  ref,
110
114
  id,
@@ -133,7 +137,7 @@ var useRadio = (props) => {
133
137
  onKeyUp: handlerAll(props2.onKeyUp, onKeyUp)
134
138
  }),
135
139
  [
136
- rest,
140
+ formControlProps,
137
141
  id,
138
142
  name,
139
143
  value,
@@ -150,7 +154,7 @@ var useRadio = (props) => {
150
154
  );
151
155
  const getLabelProps = useCallback(
152
156
  (props2 = {}, ref = null) => ({
153
- ...pickObject(rest, formControlProperties),
157
+ ...formControlProps,
154
158
  props: props2,
155
159
  ref,
156
160
  onMouseDown: handlerAll(props2.onMouseDown, (ev) => {
@@ -163,7 +167,7 @@ var useRadio = (props) => {
163
167
  }),
164
168
  "data-checked": dataAttr(checked)
165
169
  }),
166
- [checked, rest]
170
+ [checked, formControlProps]
167
171
  );
168
172
  return {
169
173
  isFocusVisible,
@@ -407,4 +411,4 @@ export {
407
411
  useRadio,
408
412
  Radio
409
413
  };
410
- //# sourceMappingURL=chunk-RKB6MN6N.mjs.map
414
+ //# sourceMappingURL=chunk-CWVCOFAA.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/radio-group.tsx","../src/radio.tsx"],"sourcesContent":["import type { ComponentArgs, ThemeProps, UIPropGetter } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport { useFormControl } from \"@yamada-ui/form-control\"\nimport type { FlexProps } from \"@yamada-ui/layouts\"\nimport { Flex } from \"@yamada-ui/layouts\"\nimport { useControllableState } from \"@yamada-ui/use-controllable-state\"\nimport type { DOMAttributes, PropGetter } from \"@yamada-ui/utils\"\nimport {\n createContext,\n cx,\n isObject,\n mergeRefs,\n useCallbackRef,\n omitObject,\n getValidChildren,\n} from \"@yamada-ui/utils\"\nimport type { ChangeEvent, ForwardedRef, Ref, ReactElement } from \"react\"\nimport { useCallback, useId, useRef, forwardRef } from \"react\"\nimport type { RadioProps } from \"./radio\"\nimport { Radio } from \"./radio\"\n\nexport type RadioItem<Y extends string | number = string> = RadioProps<Y> & {\n label?: string\n}\n\nconst isEvent = (value: any): value is { target: HTMLInputElement } =>\n value && isObject(value) && isObject(value.target)\n\nexport type UseRadioGroupProps<Y extends string | number = string> = {\n /**\n * The top-level id string that will be applied to the radios.\n * The index of the radio will be appended to this top-level id.\n */\n id?: string\n /**\n * The HTML `name` attribute used for forms.\n */\n name?: string\n /**\n * The value of the radio group.\n */\n value?: Y\n /**\n * The initial value of the radio group.\n */\n defaultValue?: Y\n /**\n * The callback fired when any children radio is checked or unchecked.\n */\n onChange?: (value: Y) => void\n /**\n * If `true`, input elements will receive `checked` attribute instead of `isChecked`.\n *\n * This assumes, you're using native radio inputs.\n *\n * @default false\n */\n isNative?: boolean\n}\n\nexport const useRadioGroup = <Y extends string | number = string>({\n id,\n name,\n isNative,\n ...props\n}: UseRadioGroupProps<Y>) => {\n id ??= useId()\n name ??= `radio-${id}`\n\n props.onChange = useCallbackRef(props.onChange)\n\n const [value, setValue] = useControllableState({\n value: props.value,\n defaultValue: props.defaultValue,\n onChange: props.onChange,\n })\n\n const containerRef = useRef<any>(null)\n\n const onFocus = useCallback(() => {\n const container = containerRef.current\n\n if (!container) return\n\n let query = `input:not(:disabled):checked`\n\n let firstInput = container.querySelector(query) as HTMLElement | undefined\n\n if (firstInput) {\n firstInput.focus()\n } else {\n query = `input:not(:disabled)`\n firstInput = container.querySelector(query) as HTMLElement | undefined\n\n firstInput?.focus()\n }\n }, [])\n\n const onChange = useCallback(\n (evOrValue: ChangeEvent<HTMLInputElement> | Y) => {\n const nextValue = (\n isEvent(evOrValue) ? evOrValue.target.value : evOrValue\n ) as Y\n\n setValue(nextValue)\n },\n [setValue],\n )\n\n const getContainerProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...props,\n ref: mergeRefs(ref, containerRef),\n role: \"group\",\n }),\n [],\n )\n\n const getRadioProps: UIPropGetter<\"input\", { value?: Y }, { value?: Y }> =\n useCallback(\n (props = {}, ref = null) => ({\n ...props,\n ref,\n name,\n [isNative ? \"checked\" : \"isChecked\"]:\n value != null ? props.value === value : undefined,\n onChange,\n }),\n [name, value, onChange, isNative],\n )\n\n return {\n name,\n value,\n setValue,\n onChange,\n onFocus,\n getContainerProps,\n getRadioProps,\n }\n}\n\nexport type UseRadioGroupReturn<Y extends string | number = string> =\n ReturnType<typeof useRadioGroup<Y>>\n\nexport type RadioGroupProps<Y extends string | number = string> =\n ThemeProps<\"Radio\"> &\n Omit<FlexProps, \"onChange\"> &\n UseRadioGroupProps<Y> &\n FormControlOptions & {\n /**\n * If provided, generate radios based on items.\n *\n * @default '[]'\n */\n items?: RadioItem<Y>[]\n }\n\ntype RadioGroupContext = ThemeProps<\"Radio\"> &\n FormControlOptions & {\n name: string\n value: string | number\n onChange: (\n evOrValue: ChangeEvent<HTMLInputElement> | string | number,\n ) => void\n }\n\nconst [RadioGroupProvider, useRadioGroupContext] = createContext<\n RadioGroupContext | undefined\n>({\n strict: false,\n name: \"RadioGroupContext\",\n})\n\nexport { useRadioGroupContext }\n\nexport const RadioGroup = forwardRef(\n <Y extends string | number = string>(\n {\n className,\n size,\n variant,\n colorScheme,\n children,\n items = [],\n direction = \"column\",\n gap,\n ...props\n }: RadioGroupProps<Y>,\n ref: ForwardedRef<HTMLDivElement>,\n ) => {\n const { name, value, onChange, getContainerProps } = useRadioGroup(props)\n const { isRequired, isReadOnly, isDisabled, isInvalid } =\n useFormControl(props)\n\n const validChildren = getValidChildren(children)\n let computedChildren: ReactElement[] = []\n\n if (!validChildren.length && items.length) {\n computedChildren = items.map(({ label, value, ...props }, i) => (\n <Radio key={i} value={value} {...props}>\n {label}\n </Radio>\n ))\n }\n\n return (\n <RadioGroupProvider\n value={\n {\n size,\n variant,\n colorScheme,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n name,\n value,\n onChange,\n } as RadioGroupContext\n }\n >\n <Flex\n ref={ref}\n className={cx(\"ui-radio-group\", className)}\n gap={gap ?? (direction === \"row\" ? \"1rem\" : undefined)}\n {...getContainerProps(\n omitObject(props, [\n \"onChange\",\n \"isInvalid\",\n \"isDisabled\",\n \"isRequired\",\n \"isReadOnly\",\n ]) as DOMAttributes<HTMLElement>,\n )}\n direction={direction}\n >\n {children ?? computedChildren}\n </Flex>\n </RadioGroupProvider>\n )\n },\n) as {\n <Y extends string | number = string>(\n props: RadioGroupProps<Y> & { ref?: Ref<HTMLDivElement> },\n ): JSX.Element\n} & ComponentArgs\n\nRadioGroup.displayName = \"RadioGroup\"\n","import type {\n HTMLUIProps,\n ThemeProps,\n ComponentArgs,\n UIPropGetter,\n} from \"@yamada-ui/core\"\nimport { ui, useMultiComponentStyle, omitThemeProps } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport {\n useFormControl,\n useFormControlProps,\n getFormControlProperties,\n} from \"@yamada-ui/form-control\"\nimport { trackFocusVisible } from \"@yamada-ui/use-focus-visible\"\nimport {\n cx,\n useCallbackRef,\n omitObject,\n funcAll,\n handlerAll,\n dataAttr,\n pickObject,\n} from \"@yamada-ui/utils\"\nimport type {\n ForwardedRef,\n Ref,\n ChangeEvent,\n ChangeEventHandler,\n InputHTMLAttributes,\n KeyboardEvent,\n SyntheticEvent,\n} from \"react\"\nimport { forwardRef, useCallback, useEffect, useState } from \"react\"\nimport { useRadioGroupContext } from \"./radio-group\"\n\nexport type UseRadioProps<Y extends string | number = string> =\n FormControlOptions & {\n /**\n * id assigned to input.\n */\n id?: string\n /**\n * The name of the input field in a radio.\n */\n name?: string\n /**\n * The value to be used in the radio button.\n */\n value?: Y\n /**\n * If `true`, the radio will be initially checked.\n *\n * @default false\n */\n defaultIsChecked?: boolean\n /**\n * If `true`, the radio will be checked.\n *\n * @default false\n */\n isChecked?: boolean\n /**\n * The callback invoked when the checked state changes.\n */\n onChange?: ChangeEventHandler<HTMLInputElement>\n }\n\nexport const useRadio = <Y extends string | number = string>(\n props: UseRadioProps<Y>,\n) => {\n const { id, name, value, required, disabled, readOnly, ...rest } =\n useFormControlProps(props)\n const formControlProps = pickObject(\n rest,\n getFormControlProperties({ omit: [\"aria-readonly\"] }),\n )\n\n const [isFocusVisible, setIsFocusVisible] = useState<boolean>(false)\n const [isFocused, setFocused] = useState<boolean>(false)\n const [isHovered, setHovered] = useState<boolean>(false)\n const [isActive, setActive] = useState<boolean>(false)\n\n const [isChecked, setIsChecked] = useState<boolean>(!!props.defaultIsChecked)\n\n const isControlled = props.isChecked !== undefined\n const checked = isControlled ? (props.isChecked as boolean) : isChecked\n\n useEffect(() => {\n return trackFocusVisible(setIsFocusVisible)\n }, [])\n\n const onChange = useCallbackRef(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if (readOnly || disabled) {\n ev.preventDefault()\n\n return\n }\n\n if (!isControlled) setIsChecked(ev.target.checked)\n\n rest.onChange?.(ev)\n },\n [readOnly, disabled, isControlled],\n )\n const onBlur = useCallbackRef(rest.onBlur)\n const onFocus = useCallbackRef(rest.onFocus)\n\n const onKeyDown = useCallback(\n ({ key }: KeyboardEvent<Element>) => {\n if (key === \" \") setActive(true)\n },\n [setActive],\n )\n\n const onKeyUp = useCallback(\n ({ key }: KeyboardEvent<Element>) => {\n if (key === \" \") setActive(false)\n },\n [setActive],\n )\n\n const getContainerProps: UIPropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref,\n \"data-checked\": dataAttr(checked),\n }),\n [checked, formControlProps],\n )\n\n const getIconProps: UIPropGetter<\"span\"> = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref,\n \"data-active\": dataAttr(isActive),\n \"data-hover\": dataAttr(isHovered),\n \"data-checked\": dataAttr(checked),\n \"data-focus\": dataAttr(isFocused),\n \"data-focus-visible\": dataAttr(isFocused && isFocusVisible),\n \"aria-hidden\": true,\n onMouseDown: handlerAll(props.onMouseDown, () => setActive(true)),\n onMouseUp: handlerAll(props.onMouseUp, () => setActive(false)),\n onMouseEnter: handlerAll(props.onMouseEnter, () => setHovered(true)),\n onMouseLeave: handlerAll(props.onMouseLeave, () => setHovered(false)),\n }),\n [checked, isActive, isFocused, isFocusVisible, isHovered, formControlProps],\n )\n\n const getInputProps: UIPropGetter<\"input\"> = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref,\n id,\n type: \"radio\",\n name,\n value,\n required,\n disabled,\n readOnly,\n checked,\n style: {\n border: \"0px\",\n clip: \"rect(0px, 0px, 0px, 0px)\",\n height: \"1px\",\n width: \"1px\",\n margin: \"-1px\",\n padding: \"0px\",\n overflow: \"hidden\",\n whiteSpace: \"nowrap\",\n position: \"absolute\",\n },\n onChange: handlerAll(props.onChange, onChange),\n onBlur: handlerAll(props.onBlur, onBlur, () => setFocused(false)),\n onFocus: handlerAll(props.onFocus, onFocus, () => setFocused(true)),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n onKeyUp: handlerAll(props.onKeyUp, onKeyUp),\n }),\n [\n formControlProps,\n id,\n name,\n value,\n required,\n disabled,\n readOnly,\n checked,\n onChange,\n onBlur,\n onFocus,\n onKeyDown,\n onKeyUp,\n ],\n )\n\n const getLabelProps: UIPropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n props,\n ref,\n onMouseDown: handlerAll(props.onMouseDown, (ev: SyntheticEvent) => {\n ev.preventDefault()\n ev.stopPropagation()\n }),\n onTouchStart: handlerAll(props.onTouchStart, (ev: SyntheticEvent) => {\n ev.preventDefault()\n ev.stopPropagation()\n }),\n \"data-checked\": dataAttr(checked),\n }),\n [checked, formControlProps],\n )\n\n return {\n isFocusVisible,\n isFocused,\n isHovered,\n isActive,\n isChecked: checked,\n getContainerProps,\n getInputProps,\n getIconProps,\n getLabelProps,\n }\n}\n\nexport type UseRadioReturn = ReturnType<typeof useRadio>\n\ntype RadioOptions = {\n iconProps?: HTMLUIProps<\"span\">\n inputProps?: InputHTMLAttributes<HTMLInputElement>\n labelProps?: HTMLUIProps<\"span\">\n}\n\nexport type RadioProps<Y extends string | number = string> = Omit<\n HTMLUIProps<\"label\">,\n keyof UseRadioProps\n> &\n ThemeProps<\"Radio\"> &\n UseRadioProps<Y> &\n RadioOptions\n\n/**\n * `Radio` is a component used for allowing users to select one option from multiple choices.\n *\n * @see Docs https://yamada-ui.com/components/forms/radio\n */\nexport const Radio = forwardRef(\n <Y extends string | number = string>(\n props: RadioProps<Y>,\n ref: ForwardedRef<HTMLInputElement>,\n ) => {\n const group = useRadioGroupContext()\n const control = useFormControl(props)\n const [styles, mergedProps] = useMultiComponentStyle(\"Radio\", {\n ...group,\n ...props,\n })\n const {\n className,\n gap = \"0.5rem\",\n isRequired = group?.isRequired ?? control.isRequired,\n isReadOnly = group?.isReadOnly ?? control.isReadOnly,\n isDisabled = group?.isDisabled ?? control.isDisabled,\n isInvalid = group?.isInvalid ?? control.isInvalid,\n iconProps,\n inputProps,\n labelProps,\n children,\n ...rest\n } = omitThemeProps(mergedProps)\n\n const { getContainerProps, getInputProps, getIconProps, getLabelProps } =\n useRadio({\n ...rest,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n isChecked:\n group?.value && rest.value\n ? group.value === rest.value\n : rest.isChecked,\n onChange:\n group?.onChange && rest.value\n ? funcAll(group.onChange, rest.onChange)\n : rest.onChange,\n })\n\n return (\n <ui.label\n className={cx(\"ui-radio\", className)}\n {...getContainerProps()}\n {...omitObject(rest, [\n \"id\",\n \"name\",\n \"value\",\n \"defaultValue\",\n \"defaultIsChecked\",\n \"isChecked\",\n \"onChange\",\n \"onBlur\",\n \"onFocus\",\n ])}\n __css={{\n cursor: \"pointer\",\n position: \"relative\",\n display: \"inline-flex\",\n alignItems: \"center\",\n verticalAlign: \"top\",\n gap,\n ...styles.container,\n }}\n >\n <ui.input\n className=\"ui-radio__input\"\n {...getInputProps(inputProps, ref)}\n />\n\n <ui.span\n className=\"ui-radio__icon\"\n {...getIconProps(iconProps)}\n __css={{\n position: \"relative\",\n display: \"inline-block\",\n userSelect: \"none\",\n ...styles.icon,\n }}\n />\n\n <ui.span\n className=\"ui-radio__label\"\n {...getLabelProps(labelProps)}\n __css={{ ...styles.label }}\n >\n {children}\n </ui.span>\n </ui.label>\n )\n },\n) as {\n <Y extends string | number = string>(\n props: RadioProps<Y> & { ref?: Ref<HTMLInputElement> },\n ): JSX.Element\n} & ComponentArgs\n\nRadio.displayName = \"Radio\"\n"],"mappings":"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","names":["useFormControl","cx","useCallbackRef","omitObject","useCallback","forwardRef","props","jsx","useCallbackRef","useCallback","props","forwardRef","useFormControl","value","props","jsx","cx","omitObject"]}
package/dist/index.js CHANGED
@@ -174,6 +174,10 @@ RadioGroup.displayName = "RadioGroup";
174
174
  var import_jsx_runtime2 = require("react/jsx-runtime");
175
175
  var useRadio = (props) => {
176
176
  const { id, name, value, required, disabled, readOnly, ...rest } = (0, import_form_control2.useFormControlProps)(props);
177
+ const formControlProps = (0, import_utils2.pickObject)(
178
+ rest,
179
+ (0, import_form_control2.getFormControlProperties)({ omit: ["aria-readonly"] })
180
+ );
177
181
  const [isFocusVisible, setIsFocusVisible] = (0, import_react2.useState)(false);
178
182
  const [isFocused, setFocused] = (0, import_react2.useState)(false);
179
183
  const [isHovered, setHovered] = (0, import_react2.useState)(false);
@@ -215,16 +219,16 @@ var useRadio = (props) => {
215
219
  );
216
220
  const getContainerProps = (0, import_react2.useCallback)(
217
221
  (props2 = {}, ref = null) => ({
218
- ...(0, import_utils2.pickObject)(rest, import_form_control2.formControlProperties),
222
+ ...formControlProps,
219
223
  ...props2,
220
224
  ref,
221
225
  "data-checked": (0, import_utils2.dataAttr)(checked)
222
226
  }),
223
- [checked, rest]
227
+ [checked, formControlProps]
224
228
  );
225
229
  const getIconProps = (0, import_react2.useCallback)(
226
230
  (props2 = {}, ref = null) => ({
227
- ...(0, import_utils2.pickObject)(rest, import_form_control2.formControlProperties),
231
+ ...formControlProps,
228
232
  ...props2,
229
233
  ref,
230
234
  "data-active": (0, import_utils2.dataAttr)(isActive),
@@ -238,11 +242,11 @@ var useRadio = (props) => {
238
242
  onMouseEnter: (0, import_utils2.handlerAll)(props2.onMouseEnter, () => setHovered(true)),
239
243
  onMouseLeave: (0, import_utils2.handlerAll)(props2.onMouseLeave, () => setHovered(false))
240
244
  }),
241
- [checked, isActive, isFocused, isFocusVisible, isHovered, rest]
245
+ [checked, isActive, isFocused, isFocusVisible, isHovered, formControlProps]
242
246
  );
243
247
  const getInputProps = (0, import_react2.useCallback)(
244
248
  (props2 = {}, ref = null) => ({
245
- ...(0, import_utils2.pickObject)(rest, import_form_control2.formControlProperties),
249
+ ...formControlProps,
246
250
  ...props2,
247
251
  ref,
248
252
  id,
@@ -271,7 +275,7 @@ var useRadio = (props) => {
271
275
  onKeyUp: (0, import_utils2.handlerAll)(props2.onKeyUp, onKeyUp)
272
276
  }),
273
277
  [
274
- rest,
278
+ formControlProps,
275
279
  id,
276
280
  name,
277
281
  value,
@@ -288,7 +292,7 @@ var useRadio = (props) => {
288
292
  );
289
293
  const getLabelProps = (0, import_react2.useCallback)(
290
294
  (props2 = {}, ref = null) => ({
291
- ...(0, import_utils2.pickObject)(rest, import_form_control2.formControlProperties),
295
+ ...formControlProps,
292
296
  props: props2,
293
297
  ref,
294
298
  onMouseDown: (0, import_utils2.handlerAll)(props2.onMouseDown, (ev) => {
@@ -301,7 +305,7 @@ var useRadio = (props) => {
301
305
  }),
302
306
  "data-checked": (0, import_utils2.dataAttr)(checked)
303
307
  }),
304
- [checked, rest]
308
+ [checked, formControlProps]
305
309
  );
306
310
  return {
307
311
  isFocusVisible,
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts","../src/radio.tsx","../src/radio-group.tsx"],"sourcesContent":["export { Radio, useRadio } from \"./radio\"\nexport type { RadioProps, UseRadioProps, UseRadioReturn } from \"./radio\"\nexport { RadioGroup, useRadioGroup } from \"./radio-group\"\nexport type {\n RadioItem,\n RadioGroupProps,\n UseRadioGroupProps,\n UseRadioGroupReturn,\n} from \"./radio-group\"\n","import type {\n HTMLUIProps,\n ThemeProps,\n ComponentArgs,\n UIPropGetter,\n} from \"@yamada-ui/core\"\nimport { ui, useMultiComponentStyle, omitThemeProps } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport {\n useFormControl,\n useFormControlProps,\n formControlProperties,\n} from \"@yamada-ui/form-control\"\nimport { trackFocusVisible } from \"@yamada-ui/use-focus-visible\"\nimport {\n cx,\n useCallbackRef,\n omitObject,\n funcAll,\n handlerAll,\n dataAttr,\n pickObject,\n} from \"@yamada-ui/utils\"\nimport type {\n ForwardedRef,\n Ref,\n ChangeEvent,\n ChangeEventHandler,\n InputHTMLAttributes,\n KeyboardEvent,\n SyntheticEvent,\n} from \"react\"\nimport { forwardRef, useCallback, useEffect, useState } from \"react\"\nimport { useRadioGroupContext } from \"./radio-group\"\n\nexport type UseRadioProps<Y extends string | number = string> =\n FormControlOptions & {\n /**\n * id assigned to input.\n */\n id?: string\n /**\n * The name of the input field in a radio.\n */\n name?: string\n /**\n * The value to be used in the radio button.\n */\n value?: Y\n /**\n * If `true`, the radio will be initially checked.\n *\n * @default false\n */\n defaultIsChecked?: boolean\n /**\n * If `true`, the radio will be checked.\n *\n * @default false\n */\n isChecked?: boolean\n /**\n * The callback invoked when the checked state changes.\n */\n onChange?: ChangeEventHandler<HTMLInputElement>\n }\n\nexport const useRadio = <Y extends string | number = string>(\n props: UseRadioProps<Y>,\n) => {\n const { id, name, value, required, disabled, readOnly, ...rest } =\n useFormControlProps(props)\n\n const [isFocusVisible, setIsFocusVisible] = useState<boolean>(false)\n const [isFocused, setFocused] = useState<boolean>(false)\n const [isHovered, setHovered] = useState<boolean>(false)\n const [isActive, setActive] = useState<boolean>(false)\n\n const [isChecked, setIsChecked] = useState<boolean>(!!props.defaultIsChecked)\n\n const isControlled = props.isChecked !== undefined\n const checked = isControlled ? (props.isChecked as boolean) : isChecked\n\n useEffect(() => {\n return trackFocusVisible(setIsFocusVisible)\n }, [])\n\n const onChange = useCallbackRef(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if (readOnly || disabled) {\n ev.preventDefault()\n\n return\n }\n\n if (!isControlled) setIsChecked(ev.target.checked)\n\n rest.onChange?.(ev)\n },\n [readOnly, disabled, isControlled],\n )\n const onBlur = useCallbackRef(rest.onBlur)\n const onFocus = useCallbackRef(rest.onFocus)\n\n const onKeyDown = useCallback(\n ({ key }: KeyboardEvent<Element>) => {\n if (key === \" \") setActive(true)\n },\n [setActive],\n )\n\n const onKeyUp = useCallback(\n ({ key }: KeyboardEvent<Element>) => {\n if (key === \" \") setActive(false)\n },\n [setActive],\n )\n\n const getContainerProps: UIPropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n ...props,\n ref,\n \"data-checked\": dataAttr(checked),\n }),\n [checked, rest],\n )\n\n const getIconProps: UIPropGetter<\"span\"> = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n ...props,\n ref,\n \"data-active\": dataAttr(isActive),\n \"data-hover\": dataAttr(isHovered),\n \"data-checked\": dataAttr(checked),\n \"data-focus\": dataAttr(isFocused),\n \"data-focus-visible\": dataAttr(isFocused && isFocusVisible),\n \"aria-hidden\": true,\n onMouseDown: handlerAll(props.onMouseDown, () => setActive(true)),\n onMouseUp: handlerAll(props.onMouseUp, () => setActive(false)),\n onMouseEnter: handlerAll(props.onMouseEnter, () => setHovered(true)),\n onMouseLeave: handlerAll(props.onMouseLeave, () => setHovered(false)),\n }),\n [checked, isActive, isFocused, isFocusVisible, isHovered, rest],\n )\n\n const getInputProps: UIPropGetter<\"input\"> = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n ...props,\n ref,\n id,\n type: \"radio\",\n name,\n value,\n required,\n disabled,\n readOnly,\n checked,\n style: {\n border: \"0px\",\n clip: \"rect(0px, 0px, 0px, 0px)\",\n height: \"1px\",\n width: \"1px\",\n margin: \"-1px\",\n padding: \"0px\",\n overflow: \"hidden\",\n whiteSpace: \"nowrap\",\n position: \"absolute\",\n },\n onChange: handlerAll(props.onChange, onChange),\n onBlur: handlerAll(props.onBlur, onBlur, () => setFocused(false)),\n onFocus: handlerAll(props.onFocus, onFocus, () => setFocused(true)),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n onKeyUp: handlerAll(props.onKeyUp, onKeyUp),\n }),\n [\n rest,\n id,\n name,\n value,\n required,\n disabled,\n readOnly,\n checked,\n onChange,\n onBlur,\n onFocus,\n onKeyDown,\n onKeyUp,\n ],\n )\n\n const getLabelProps: UIPropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n props,\n ref,\n onMouseDown: handlerAll(props.onMouseDown, (ev: SyntheticEvent) => {\n ev.preventDefault()\n ev.stopPropagation()\n }),\n onTouchStart: handlerAll(props.onTouchStart, (ev: SyntheticEvent) => {\n ev.preventDefault()\n ev.stopPropagation()\n }),\n \"data-checked\": dataAttr(checked),\n }),\n [checked, rest],\n )\n\n return {\n isFocusVisible,\n isFocused,\n isHovered,\n isActive,\n isChecked: checked,\n getContainerProps,\n getInputProps,\n getIconProps,\n getLabelProps,\n }\n}\n\nexport type UseRadioReturn = ReturnType<typeof useRadio>\n\ntype RadioOptions = {\n iconProps?: HTMLUIProps<\"span\">\n inputProps?: InputHTMLAttributes<HTMLInputElement>\n labelProps?: HTMLUIProps<\"span\">\n}\n\nexport type RadioProps<Y extends string | number = string> = Omit<\n HTMLUIProps<\"label\">,\n keyof UseRadioProps\n> &\n ThemeProps<\"Radio\"> &\n UseRadioProps<Y> &\n RadioOptions\n\n/**\n * `Radio` is a component used for allowing users to select one option from multiple choices.\n *\n * @see Docs https://yamada-ui.com/components/forms/radio\n */\nexport const Radio = forwardRef(\n <Y extends string | number = string>(\n props: RadioProps<Y>,\n ref: ForwardedRef<HTMLInputElement>,\n ) => {\n const group = useRadioGroupContext()\n const control = useFormControl(props)\n const [styles, mergedProps] = useMultiComponentStyle(\"Radio\", {\n ...group,\n ...props,\n })\n const {\n className,\n gap = \"0.5rem\",\n isRequired = group?.isRequired ?? control.isRequired,\n isReadOnly = group?.isReadOnly ?? control.isReadOnly,\n isDisabled = group?.isDisabled ?? control.isDisabled,\n isInvalid = group?.isInvalid ?? control.isInvalid,\n iconProps,\n inputProps,\n labelProps,\n children,\n ...rest\n } = omitThemeProps(mergedProps)\n\n const { getContainerProps, getInputProps, getIconProps, getLabelProps } =\n useRadio({\n ...rest,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n isChecked:\n group?.value && rest.value\n ? group.value === rest.value\n : rest.isChecked,\n onChange:\n group?.onChange && rest.value\n ? funcAll(group.onChange, rest.onChange)\n : rest.onChange,\n })\n\n return (\n <ui.label\n className={cx(\"ui-radio\", className)}\n {...getContainerProps()}\n {...omitObject(rest, [\n \"id\",\n \"name\",\n \"value\",\n \"defaultValue\",\n \"defaultIsChecked\",\n \"isChecked\",\n \"onChange\",\n \"onBlur\",\n \"onFocus\",\n ])}\n __css={{\n cursor: \"pointer\",\n position: \"relative\",\n display: \"inline-flex\",\n alignItems: \"center\",\n verticalAlign: \"top\",\n gap,\n ...styles.container,\n }}\n >\n <ui.input\n className=\"ui-radio__input\"\n {...getInputProps(inputProps, ref)}\n />\n\n <ui.span\n className=\"ui-radio__icon\"\n {...getIconProps(iconProps)}\n __css={{\n position: \"relative\",\n display: \"inline-block\",\n userSelect: \"none\",\n ...styles.icon,\n }}\n />\n\n <ui.span\n className=\"ui-radio__label\"\n {...getLabelProps(labelProps)}\n __css={{ ...styles.label }}\n >\n {children}\n </ui.span>\n </ui.label>\n )\n },\n) as {\n <Y extends string | number = string>(\n props: RadioProps<Y> & { ref?: Ref<HTMLInputElement> },\n ): JSX.Element\n} & ComponentArgs\n\nRadio.displayName = \"Radio\"\n","import type { ComponentArgs, ThemeProps, UIPropGetter } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport { useFormControl } from \"@yamada-ui/form-control\"\nimport type { FlexProps } from \"@yamada-ui/layouts\"\nimport { Flex } from \"@yamada-ui/layouts\"\nimport { useControllableState } from \"@yamada-ui/use-controllable-state\"\nimport type { DOMAttributes, PropGetter } from \"@yamada-ui/utils\"\nimport {\n createContext,\n cx,\n isObject,\n mergeRefs,\n useCallbackRef,\n omitObject,\n getValidChildren,\n} from \"@yamada-ui/utils\"\nimport type { ChangeEvent, ForwardedRef, Ref, ReactElement } from \"react\"\nimport { useCallback, useId, useRef, forwardRef } from \"react\"\nimport type { RadioProps } from \"./radio\"\nimport { Radio } from \"./radio\"\n\nexport type RadioItem<Y extends string | number = string> = RadioProps<Y> & {\n label?: string\n}\n\nconst isEvent = (value: any): value is { target: HTMLInputElement } =>\n value && isObject(value) && isObject(value.target)\n\nexport type UseRadioGroupProps<Y extends string | number = string> = {\n /**\n * The top-level id string that will be applied to the radios.\n * The index of the radio will be appended to this top-level id.\n */\n id?: string\n /**\n * The HTML `name` attribute used for forms.\n */\n name?: string\n /**\n * The value of the radio group.\n */\n value?: Y\n /**\n * The initial value of the radio group.\n */\n defaultValue?: Y\n /**\n * The callback fired when any children radio is checked or unchecked.\n */\n onChange?: (value: Y) => void\n /**\n * If `true`, input elements will receive `checked` attribute instead of `isChecked`.\n *\n * This assumes, you're using native radio inputs.\n *\n * @default false\n */\n isNative?: boolean\n}\n\nexport const useRadioGroup = <Y extends string | number = string>({\n id,\n name,\n isNative,\n ...props\n}: UseRadioGroupProps<Y>) => {\n id ??= useId()\n name ??= `radio-${id}`\n\n props.onChange = useCallbackRef(props.onChange)\n\n const [value, setValue] = useControllableState({\n value: props.value,\n defaultValue: props.defaultValue,\n onChange: props.onChange,\n })\n\n const containerRef = useRef<any>(null)\n\n const onFocus = useCallback(() => {\n const container = containerRef.current\n\n if (!container) return\n\n let query = `input:not(:disabled):checked`\n\n let firstInput = container.querySelector(query) as HTMLElement | undefined\n\n if (firstInput) {\n firstInput.focus()\n } else {\n query = `input:not(:disabled)`\n firstInput = container.querySelector(query) as HTMLElement | undefined\n\n firstInput?.focus()\n }\n }, [])\n\n const onChange = useCallback(\n (evOrValue: ChangeEvent<HTMLInputElement> | Y) => {\n const nextValue = (\n isEvent(evOrValue) ? evOrValue.target.value : evOrValue\n ) as Y\n\n setValue(nextValue)\n },\n [setValue],\n )\n\n const getContainerProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...props,\n ref: mergeRefs(ref, containerRef),\n role: \"group\",\n }),\n [],\n )\n\n const getRadioProps: UIPropGetter<\"input\", { value?: Y }, { value?: Y }> =\n useCallback(\n (props = {}, ref = null) => ({\n ...props,\n ref,\n name,\n [isNative ? \"checked\" : \"isChecked\"]:\n value != null ? props.value === value : undefined,\n onChange,\n }),\n [name, value, onChange, isNative],\n )\n\n return {\n name,\n value,\n setValue,\n onChange,\n onFocus,\n getContainerProps,\n getRadioProps,\n }\n}\n\nexport type UseRadioGroupReturn<Y extends string | number = string> =\n ReturnType<typeof useRadioGroup<Y>>\n\nexport type RadioGroupProps<Y extends string | number = string> =\n ThemeProps<\"Radio\"> &\n Omit<FlexProps, \"onChange\"> &\n UseRadioGroupProps<Y> &\n FormControlOptions & {\n /**\n * If provided, generate radios based on items.\n *\n * @default '[]'\n */\n items?: RadioItem<Y>[]\n }\n\ntype RadioGroupContext = ThemeProps<\"Radio\"> &\n FormControlOptions & {\n name: string\n value: string | number\n onChange: (\n evOrValue: ChangeEvent<HTMLInputElement> | string | number,\n ) => void\n }\n\nconst [RadioGroupProvider, useRadioGroupContext] = createContext<\n RadioGroupContext | undefined\n>({\n strict: false,\n name: \"RadioGroupContext\",\n})\n\nexport { useRadioGroupContext }\n\nexport const RadioGroup = forwardRef(\n <Y extends string | number = string>(\n {\n className,\n size,\n variant,\n colorScheme,\n children,\n items = [],\n direction = \"column\",\n gap,\n ...props\n }: RadioGroupProps<Y>,\n ref: ForwardedRef<HTMLDivElement>,\n ) => {\n const { name, value, onChange, getContainerProps } = useRadioGroup(props)\n const { isRequired, isReadOnly, isDisabled, isInvalid } =\n useFormControl(props)\n\n const validChildren = getValidChildren(children)\n let computedChildren: ReactElement[] = []\n\n if (!validChildren.length && items.length) {\n computedChildren = items.map(({ label, value, ...props }, i) => (\n <Radio key={i} value={value} {...props}>\n {label}\n </Radio>\n ))\n }\n\n return (\n <RadioGroupProvider\n value={\n {\n size,\n variant,\n colorScheme,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n name,\n value,\n onChange,\n } as RadioGroupContext\n }\n >\n <Flex\n ref={ref}\n className={cx(\"ui-radio-group\", className)}\n gap={gap ?? (direction === \"row\" ? \"1rem\" : undefined)}\n {...getContainerProps(\n omitObject(props, [\n \"onChange\",\n \"isInvalid\",\n \"isDisabled\",\n \"isRequired\",\n \"isReadOnly\",\n ]) as DOMAttributes<HTMLElement>,\n )}\n direction={direction}\n >\n {children ?? computedChildren}\n </Flex>\n </RadioGroupProvider>\n )\n },\n) as {\n <Y extends string | number = string>(\n props: RadioGroupProps<Y> & { ref?: Ref<HTMLDivElement> },\n ): JSX.Element\n} & ComponentArgs\n\nRadioGroup.displayName = \"RadioGroup\"\n"],"mappings":"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","names":["import_form_control","import_utils","import_react","props","value","props","import_jsx_runtime","props"]}
1
+ {"version":3,"sources":["../src/index.ts","../src/radio.tsx","../src/radio-group.tsx"],"sourcesContent":["export { Radio, useRadio } from \"./radio\"\nexport type { RadioProps, UseRadioProps, UseRadioReturn } from \"./radio\"\nexport { RadioGroup, useRadioGroup } from \"./radio-group\"\nexport type {\n RadioItem,\n RadioGroupProps,\n UseRadioGroupProps,\n UseRadioGroupReturn,\n} from \"./radio-group\"\n","import type {\n HTMLUIProps,\n ThemeProps,\n ComponentArgs,\n UIPropGetter,\n} from \"@yamada-ui/core\"\nimport { ui, useMultiComponentStyle, omitThemeProps } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport {\n useFormControl,\n useFormControlProps,\n getFormControlProperties,\n} from \"@yamada-ui/form-control\"\nimport { trackFocusVisible } from \"@yamada-ui/use-focus-visible\"\nimport {\n cx,\n useCallbackRef,\n omitObject,\n funcAll,\n handlerAll,\n dataAttr,\n pickObject,\n} from \"@yamada-ui/utils\"\nimport type {\n ForwardedRef,\n Ref,\n ChangeEvent,\n ChangeEventHandler,\n InputHTMLAttributes,\n KeyboardEvent,\n SyntheticEvent,\n} from \"react\"\nimport { forwardRef, useCallback, useEffect, useState } from \"react\"\nimport { useRadioGroupContext } from \"./radio-group\"\n\nexport type UseRadioProps<Y extends string | number = string> =\n FormControlOptions & {\n /**\n * id assigned to input.\n */\n id?: string\n /**\n * The name of the input field in a radio.\n */\n name?: string\n /**\n * The value to be used in the radio button.\n */\n value?: Y\n /**\n * If `true`, the radio will be initially checked.\n *\n * @default false\n */\n defaultIsChecked?: boolean\n /**\n * If `true`, the radio will be checked.\n *\n * @default false\n */\n isChecked?: boolean\n /**\n * The callback invoked when the checked state changes.\n */\n onChange?: ChangeEventHandler<HTMLInputElement>\n }\n\nexport const useRadio = <Y extends string | number = string>(\n props: UseRadioProps<Y>,\n) => {\n const { id, name, value, required, disabled, readOnly, ...rest } =\n useFormControlProps(props)\n const formControlProps = pickObject(\n rest,\n getFormControlProperties({ omit: [\"aria-readonly\"] }),\n )\n\n const [isFocusVisible, setIsFocusVisible] = useState<boolean>(false)\n const [isFocused, setFocused] = useState<boolean>(false)\n const [isHovered, setHovered] = useState<boolean>(false)\n const [isActive, setActive] = useState<boolean>(false)\n\n const [isChecked, setIsChecked] = useState<boolean>(!!props.defaultIsChecked)\n\n const isControlled = props.isChecked !== undefined\n const checked = isControlled ? (props.isChecked as boolean) : isChecked\n\n useEffect(() => {\n return trackFocusVisible(setIsFocusVisible)\n }, [])\n\n const onChange = useCallbackRef(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if (readOnly || disabled) {\n ev.preventDefault()\n\n return\n }\n\n if (!isControlled) setIsChecked(ev.target.checked)\n\n rest.onChange?.(ev)\n },\n [readOnly, disabled, isControlled],\n )\n const onBlur = useCallbackRef(rest.onBlur)\n const onFocus = useCallbackRef(rest.onFocus)\n\n const onKeyDown = useCallback(\n ({ key }: KeyboardEvent<Element>) => {\n if (key === \" \") setActive(true)\n },\n [setActive],\n )\n\n const onKeyUp = useCallback(\n ({ key }: KeyboardEvent<Element>) => {\n if (key === \" \") setActive(false)\n },\n [setActive],\n )\n\n const getContainerProps: UIPropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref,\n \"data-checked\": dataAttr(checked),\n }),\n [checked, formControlProps],\n )\n\n const getIconProps: UIPropGetter<\"span\"> = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref,\n \"data-active\": dataAttr(isActive),\n \"data-hover\": dataAttr(isHovered),\n \"data-checked\": dataAttr(checked),\n \"data-focus\": dataAttr(isFocused),\n \"data-focus-visible\": dataAttr(isFocused && isFocusVisible),\n \"aria-hidden\": true,\n onMouseDown: handlerAll(props.onMouseDown, () => setActive(true)),\n onMouseUp: handlerAll(props.onMouseUp, () => setActive(false)),\n onMouseEnter: handlerAll(props.onMouseEnter, () => setHovered(true)),\n onMouseLeave: handlerAll(props.onMouseLeave, () => setHovered(false)),\n }),\n [checked, isActive, isFocused, isFocusVisible, isHovered, formControlProps],\n )\n\n const getInputProps: UIPropGetter<\"input\"> = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref,\n id,\n type: \"radio\",\n name,\n value,\n required,\n disabled,\n readOnly,\n checked,\n style: {\n border: \"0px\",\n clip: \"rect(0px, 0px, 0px, 0px)\",\n height: \"1px\",\n width: \"1px\",\n margin: \"-1px\",\n padding: \"0px\",\n overflow: \"hidden\",\n whiteSpace: \"nowrap\",\n position: \"absolute\",\n },\n onChange: handlerAll(props.onChange, onChange),\n onBlur: handlerAll(props.onBlur, onBlur, () => setFocused(false)),\n onFocus: handlerAll(props.onFocus, onFocus, () => setFocused(true)),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n onKeyUp: handlerAll(props.onKeyUp, onKeyUp),\n }),\n [\n formControlProps,\n id,\n name,\n value,\n required,\n disabled,\n readOnly,\n checked,\n onChange,\n onBlur,\n onFocus,\n onKeyDown,\n onKeyUp,\n ],\n )\n\n const getLabelProps: UIPropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n props,\n ref,\n onMouseDown: handlerAll(props.onMouseDown, (ev: SyntheticEvent) => {\n ev.preventDefault()\n ev.stopPropagation()\n }),\n onTouchStart: handlerAll(props.onTouchStart, (ev: SyntheticEvent) => {\n ev.preventDefault()\n ev.stopPropagation()\n }),\n \"data-checked\": dataAttr(checked),\n }),\n [checked, formControlProps],\n )\n\n return {\n isFocusVisible,\n isFocused,\n isHovered,\n isActive,\n isChecked: checked,\n getContainerProps,\n getInputProps,\n getIconProps,\n getLabelProps,\n }\n}\n\nexport type UseRadioReturn = ReturnType<typeof useRadio>\n\ntype RadioOptions = {\n iconProps?: HTMLUIProps<\"span\">\n inputProps?: InputHTMLAttributes<HTMLInputElement>\n labelProps?: HTMLUIProps<\"span\">\n}\n\nexport type RadioProps<Y extends string | number = string> = Omit<\n HTMLUIProps<\"label\">,\n keyof UseRadioProps\n> &\n ThemeProps<\"Radio\"> &\n UseRadioProps<Y> &\n RadioOptions\n\n/**\n * `Radio` is a component used for allowing users to select one option from multiple choices.\n *\n * @see Docs https://yamada-ui.com/components/forms/radio\n */\nexport const Radio = forwardRef(\n <Y extends string | number = string>(\n props: RadioProps<Y>,\n ref: ForwardedRef<HTMLInputElement>,\n ) => {\n const group = useRadioGroupContext()\n const control = useFormControl(props)\n const [styles, mergedProps] = useMultiComponentStyle(\"Radio\", {\n ...group,\n ...props,\n })\n const {\n className,\n gap = \"0.5rem\",\n isRequired = group?.isRequired ?? control.isRequired,\n isReadOnly = group?.isReadOnly ?? control.isReadOnly,\n isDisabled = group?.isDisabled ?? control.isDisabled,\n isInvalid = group?.isInvalid ?? control.isInvalid,\n iconProps,\n inputProps,\n labelProps,\n children,\n ...rest\n } = omitThemeProps(mergedProps)\n\n const { getContainerProps, getInputProps, getIconProps, getLabelProps } =\n useRadio({\n ...rest,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n isChecked:\n group?.value && rest.value\n ? group.value === rest.value\n : rest.isChecked,\n onChange:\n group?.onChange && rest.value\n ? funcAll(group.onChange, rest.onChange)\n : rest.onChange,\n })\n\n return (\n <ui.label\n className={cx(\"ui-radio\", className)}\n {...getContainerProps()}\n {...omitObject(rest, [\n \"id\",\n \"name\",\n \"value\",\n \"defaultValue\",\n \"defaultIsChecked\",\n \"isChecked\",\n \"onChange\",\n \"onBlur\",\n \"onFocus\",\n ])}\n __css={{\n cursor: \"pointer\",\n position: \"relative\",\n display: \"inline-flex\",\n alignItems: \"center\",\n verticalAlign: \"top\",\n gap,\n ...styles.container,\n }}\n >\n <ui.input\n className=\"ui-radio__input\"\n {...getInputProps(inputProps, ref)}\n />\n\n <ui.span\n className=\"ui-radio__icon\"\n {...getIconProps(iconProps)}\n __css={{\n position: \"relative\",\n display: \"inline-block\",\n userSelect: \"none\",\n ...styles.icon,\n }}\n />\n\n <ui.span\n className=\"ui-radio__label\"\n {...getLabelProps(labelProps)}\n __css={{ ...styles.label }}\n >\n {children}\n </ui.span>\n </ui.label>\n )\n },\n) as {\n <Y extends string | number = string>(\n props: RadioProps<Y> & { ref?: Ref<HTMLInputElement> },\n ): JSX.Element\n} & ComponentArgs\n\nRadio.displayName = \"Radio\"\n","import type { ComponentArgs, ThemeProps, UIPropGetter } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport { useFormControl } from \"@yamada-ui/form-control\"\nimport type { FlexProps } from \"@yamada-ui/layouts\"\nimport { Flex } from \"@yamada-ui/layouts\"\nimport { useControllableState } from \"@yamada-ui/use-controllable-state\"\nimport type { DOMAttributes, PropGetter } from \"@yamada-ui/utils\"\nimport {\n createContext,\n cx,\n isObject,\n mergeRefs,\n useCallbackRef,\n omitObject,\n getValidChildren,\n} from \"@yamada-ui/utils\"\nimport type { ChangeEvent, ForwardedRef, Ref, ReactElement } from \"react\"\nimport { useCallback, useId, useRef, forwardRef } from \"react\"\nimport type { RadioProps } from \"./radio\"\nimport { Radio } from \"./radio\"\n\nexport type RadioItem<Y extends string | number = string> = RadioProps<Y> & {\n label?: string\n}\n\nconst isEvent = (value: any): value is { target: HTMLInputElement } =>\n value && isObject(value) && isObject(value.target)\n\nexport type UseRadioGroupProps<Y extends string | number = string> = {\n /**\n * The top-level id string that will be applied to the radios.\n * The index of the radio will be appended to this top-level id.\n */\n id?: string\n /**\n * The HTML `name` attribute used for forms.\n */\n name?: string\n /**\n * The value of the radio group.\n */\n value?: Y\n /**\n * The initial value of the radio group.\n */\n defaultValue?: Y\n /**\n * The callback fired when any children radio is checked or unchecked.\n */\n onChange?: (value: Y) => void\n /**\n * If `true`, input elements will receive `checked` attribute instead of `isChecked`.\n *\n * This assumes, you're using native radio inputs.\n *\n * @default false\n */\n isNative?: boolean\n}\n\nexport const useRadioGroup = <Y extends string | number = string>({\n id,\n name,\n isNative,\n ...props\n}: UseRadioGroupProps<Y>) => {\n id ??= useId()\n name ??= `radio-${id}`\n\n props.onChange = useCallbackRef(props.onChange)\n\n const [value, setValue] = useControllableState({\n value: props.value,\n defaultValue: props.defaultValue,\n onChange: props.onChange,\n })\n\n const containerRef = useRef<any>(null)\n\n const onFocus = useCallback(() => {\n const container = containerRef.current\n\n if (!container) return\n\n let query = `input:not(:disabled):checked`\n\n let firstInput = container.querySelector(query) as HTMLElement | undefined\n\n if (firstInput) {\n firstInput.focus()\n } else {\n query = `input:not(:disabled)`\n firstInput = container.querySelector(query) as HTMLElement | undefined\n\n firstInput?.focus()\n }\n }, [])\n\n const onChange = useCallback(\n (evOrValue: ChangeEvent<HTMLInputElement> | Y) => {\n const nextValue = (\n isEvent(evOrValue) ? evOrValue.target.value : evOrValue\n ) as Y\n\n setValue(nextValue)\n },\n [setValue],\n )\n\n const getContainerProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...props,\n ref: mergeRefs(ref, containerRef),\n role: \"group\",\n }),\n [],\n )\n\n const getRadioProps: UIPropGetter<\"input\", { value?: Y }, { value?: Y }> =\n useCallback(\n (props = {}, ref = null) => ({\n ...props,\n ref,\n name,\n [isNative ? \"checked\" : \"isChecked\"]:\n value != null ? props.value === value : undefined,\n onChange,\n }),\n [name, value, onChange, isNative],\n )\n\n return {\n name,\n value,\n setValue,\n onChange,\n onFocus,\n getContainerProps,\n getRadioProps,\n }\n}\n\nexport type UseRadioGroupReturn<Y extends string | number = string> =\n ReturnType<typeof useRadioGroup<Y>>\n\nexport type RadioGroupProps<Y extends string | number = string> =\n ThemeProps<\"Radio\"> &\n Omit<FlexProps, \"onChange\"> &\n UseRadioGroupProps<Y> &\n FormControlOptions & {\n /**\n * If provided, generate radios based on items.\n *\n * @default '[]'\n */\n items?: RadioItem<Y>[]\n }\n\ntype RadioGroupContext = ThemeProps<\"Radio\"> &\n FormControlOptions & {\n name: string\n value: string | number\n onChange: (\n evOrValue: ChangeEvent<HTMLInputElement> | string | number,\n ) => void\n }\n\nconst [RadioGroupProvider, useRadioGroupContext] = createContext<\n RadioGroupContext | undefined\n>({\n strict: false,\n name: \"RadioGroupContext\",\n})\n\nexport { useRadioGroupContext }\n\nexport const RadioGroup = forwardRef(\n <Y extends string | number = string>(\n {\n className,\n size,\n variant,\n colorScheme,\n children,\n items = [],\n direction = \"column\",\n gap,\n ...props\n }: RadioGroupProps<Y>,\n ref: ForwardedRef<HTMLDivElement>,\n ) => {\n const { name, value, onChange, getContainerProps } = useRadioGroup(props)\n const { isRequired, isReadOnly, isDisabled, isInvalid } =\n useFormControl(props)\n\n const validChildren = getValidChildren(children)\n let computedChildren: ReactElement[] = []\n\n if (!validChildren.length && items.length) {\n computedChildren = items.map(({ label, value, ...props }, i) => (\n <Radio key={i} value={value} {...props}>\n {label}\n </Radio>\n ))\n }\n\n return (\n <RadioGroupProvider\n value={\n {\n size,\n variant,\n colorScheme,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n name,\n value,\n onChange,\n } as RadioGroupContext\n }\n >\n <Flex\n ref={ref}\n className={cx(\"ui-radio-group\", className)}\n gap={gap ?? (direction === \"row\" ? \"1rem\" : undefined)}\n {...getContainerProps(\n omitObject(props, [\n \"onChange\",\n \"isInvalid\",\n \"isDisabled\",\n \"isRequired\",\n \"isReadOnly\",\n ]) as DOMAttributes<HTMLElement>,\n )}\n direction={direction}\n >\n {children ?? computedChildren}\n </Flex>\n </RadioGroupProvider>\n )\n },\n) as {\n <Y extends string | number = string>(\n props: RadioGroupProps<Y> & { ref?: Ref<HTMLDivElement> },\n ): JSX.Element\n} & ComponentArgs\n\nRadioGroup.displayName = \"RadioGroup\"\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACMA,kBAA2D;AAE3D,IAAAA,uBAIO;AACP,+BAAkC;AAClC,IAAAC,gBAQO;AAUP,IAAAC,gBAA6D;;;AC9B7D,0BAA+B;AAE/B,qBAAqB;AACrB,oCAAqC;AAErC,mBAQO;AAEP,mBAAuD;AAuL/C;AA/KR,IAAM,UAAU,CAAC,UACf,aAAS,uBAAS,KAAK,SAAK,uBAAS,MAAM,MAAM;AAkC5C,IAAM,gBAAgB,CAAqC;AAAA,EAChE;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAA6B;AAC3B,6BAAO,oBAAM;AACb,+BAAS,SAAS,EAAE;AAEpB,QAAM,eAAW,6BAAe,MAAM,QAAQ;AAE9C,QAAM,CAAC,OAAO,QAAQ,QAAI,oDAAqB;AAAA,IAC7C,OAAO,MAAM;AAAA,IACb,cAAc,MAAM;AAAA,IACpB,UAAU,MAAM;AAAA,EAClB,CAAC;AAED,QAAM,mBAAe,qBAAY,IAAI;AAErC,QAAM,cAAU,0BAAY,MAAM;AAChC,UAAM,YAAY,aAAa;AAE/B,QAAI,CAAC;AAAW;AAEhB,QAAI,QAAQ;AAEZ,QAAI,aAAa,UAAU,cAAc,KAAK;AAE9C,QAAI,YAAY;AACd,iBAAW,MAAM;AAAA,IACnB,OAAO;AACL,cAAQ;AACR,mBAAa,UAAU,cAAc,KAAK;AAE1C,+CAAY;AAAA,IACd;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,QAAM,eAAW;AAAA,IACf,CAAC,cAAiD;AAChD,YAAM,YACJ,QAAQ,SAAS,IAAI,UAAU,OAAO,QAAQ;AAGhD,eAAS,SAAS;AAAA,IACpB;AAAA,IACA,CAAC,QAAQ;AAAA,EACX;AAEA,QAAM,wBAAgC;AAAA,IACpC,CAACC,SAAQ,CAAC,GAAG,MAAM,UAAU;AAAA,MAC3B,GAAGA;AAAA,MACH,SAAK,wBAAU,KAAK,YAAY;AAAA,MAChC,MAAM;AAAA,IACR;AAAA,IACA,CAAC;AAAA,EACH;AAEA,QAAM,oBACJ;AAAA,IACE,CAACA,SAAQ,CAAC,GAAG,MAAM,UAAU;AAAA,MAC3B,GAAGA;AAAA,MACH;AAAA,MACA;AAAA,MACA,CAAC,WAAW,YAAY,WAAW,GACjC,SAAS,OAAOA,OAAM,UAAU,QAAQ;AAAA,MAC1C;AAAA,IACF;AAAA,IACA,CAAC,MAAM,OAAO,UAAU,QAAQ;AAAA,EAClC;AAEF,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;AA2BA,IAAM,CAAC,oBAAoB,oBAAoB,QAAI,4BAEjD;AAAA,EACA,QAAQ;AAAA,EACR,MAAM;AACR,CAAC;AAIM,IAAM,iBAAa;AAAA,EACxB,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,QAAQ,CAAC;AAAA,IACT,YAAY;AAAA,IACZ;AAAA,IACA,GAAG;AAAA,EACL,GACA,QACG;AACH,UAAM,EAAE,MAAM,OAAO,UAAU,kBAAkB,IAAI,cAAc,KAAK;AACxE,UAAM,EAAE,YAAY,YAAY,YAAY,UAAU,QACpD,oCAAe,KAAK;AAEtB,UAAM,oBAAgB,+BAAiB,QAAQ;AAC/C,QAAI,mBAAmC,CAAC;AAExC,QAAI,CAAC,cAAc,UAAU,MAAM,QAAQ;AACzC,yBAAmB,MAAM,IAAI,CAAC,EAAE,OAAO,OAAAC,QAAO,GAAGC,OAAM,GAAG,MACxD,4CAAC,SAAc,OAAOD,QAAQ,GAAGC,QAC9B,mBADS,CAEZ,CACD;AAAA,IACH;AAEA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,OACE;AAAA,UACE;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,QAGF;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA,eAAW,iBAAG,kBAAkB,SAAS;AAAA,YACzC,KAAK,oBAAQ,cAAc,QAAQ,SAAS;AAAA,YAC3C,GAAG;AAAA,kBACF,yBAAW,OAAO;AAAA,gBAChB;AAAA,gBACA;AAAA,gBACA;AAAA,gBACA;AAAA,gBACA;AAAA,cACF,CAAC;AAAA,YACH;AAAA,YACA;AAAA,YAEC,wCAAY;AAAA;AAAA,QACf;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAMA,WAAW,cAAc;;;AD4CnB,IAAAC,sBAAA;AAlOC,IAAM,WAAW,CACtB,UACG;AACH,QAAM,EAAE,IAAI,MAAM,OAAO,UAAU,UAAU,UAAU,GAAG,KAAK,QAC7D,0CAAoB,KAAK;AAC3B,QAAM,uBAAmB;AAAA,IACvB;AAAA,QACA,+CAAyB,EAAE,MAAM,CAAC,eAAe,EAAE,CAAC;AAAA,EACtD;AAEA,QAAM,CAAC,gBAAgB,iBAAiB,QAAI,wBAAkB,KAAK;AACnE,QAAM,CAAC,WAAW,UAAU,QAAI,wBAAkB,KAAK;AACvD,QAAM,CAAC,WAAW,UAAU,QAAI,wBAAkB,KAAK;AACvD,QAAM,CAAC,UAAU,SAAS,QAAI,wBAAkB,KAAK;AAErD,QAAM,CAAC,WAAW,YAAY,QAAI,wBAAkB,CAAC,CAAC,MAAM,gBAAgB;AAE5E,QAAM,eAAe,MAAM,cAAc;AACzC,QAAM,UAAU,eAAgB,MAAM,YAAwB;AAE9D,+BAAU,MAAM;AACd,eAAO,4CAAkB,iBAAiB;AAAA,EAC5C,GAAG,CAAC,CAAC;AAEL,QAAM,eAAW;AAAA,IACf,CAAC,OAAsC;AA5F3C;AA6FM,UAAI,YAAY,UAAU;AACxB,WAAG,eAAe;AAElB;AAAA,MACF;AAEA,UAAI,CAAC;AAAc,qBAAa,GAAG,OAAO,OAAO;AAEjD,iBAAK,aAAL,8BAAgB;AAAA,IAClB;AAAA,IACA,CAAC,UAAU,UAAU,YAAY;AAAA,EACnC;AACA,QAAM,aAAS,8BAAe,KAAK,MAAM;AACzC,QAAM,cAAU,8BAAe,KAAK,OAAO;AAE3C,QAAM,gBAAY;AAAA,IAChB,CAAC,EAAE,IAAI,MAA8B;AACnC,UAAI,QAAQ;AAAK,kBAAU,IAAI;AAAA,IACjC;AAAA,IACA,CAAC,SAAS;AAAA,EACZ;AAEA,QAAM,cAAU;AAAA,IACd,CAAC,EAAE,IAAI,MAA8B;AACnC,UAAI,QAAQ;AAAK,kBAAU,KAAK;AAAA,IAClC;AAAA,IACA,CAAC,SAAS;AAAA,EACZ;AAEA,QAAM,wBAAkC;AAAA,IACtC,CAACC,SAAQ,CAAC,GAAG,MAAM,UAAU;AAAA,MAC3B,GAAG;AAAA,MACH,GAAGA;AAAA,MACH;AAAA,MACA,oBAAgB,wBAAS,OAAO;AAAA,IAClC;AAAA,IACA,CAAC,SAAS,gBAAgB;AAAA,EAC5B;AAEA,QAAM,mBAAqC;AAAA,IACzC,CAACA,SAAQ,CAAC,GAAG,MAAM,UAAU;AAAA,MAC3B,GAAG;AAAA,MACH,GAAGA;AAAA,MACH;AAAA,MACA,mBAAe,wBAAS,QAAQ;AAAA,MAChC,kBAAc,wBAAS,SAAS;AAAA,MAChC,oBAAgB,wBAAS,OAAO;AAAA,MAChC,kBAAc,wBAAS,SAAS;AAAA,MAChC,0BAAsB,wBAAS,aAAa,cAAc;AAAA,MAC1D,eAAe;AAAA,MACf,iBAAa,0BAAWA,OAAM,aAAa,MAAM,UAAU,IAAI,CAAC;AAAA,MAChE,eAAW,0BAAWA,OAAM,WAAW,MAAM,UAAU,KAAK,CAAC;AAAA,MAC7D,kBAAc,0BAAWA,OAAM,cAAc,MAAM,WAAW,IAAI,CAAC;AAAA,MACnE,kBAAc,0BAAWA,OAAM,cAAc,MAAM,WAAW,KAAK,CAAC;AAAA,IACtE;AAAA,IACA,CAAC,SAAS,UAAU,WAAW,gBAAgB,WAAW,gBAAgB;AAAA,EAC5E;AAEA,QAAM,oBAAuC;AAAA,IAC3C,CAACA,SAAQ,CAAC,GAAG,MAAM,UAAU;AAAA,MAC3B,GAAG;AAAA,MACH,GAAGA;AAAA,MACH;AAAA,MACA;AAAA,MACA,MAAM;AAAA,MACN;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,OAAO;AAAA,QACL,QAAQ;AAAA,QACR,MAAM;AAAA,QACN,QAAQ;AAAA,QACR,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,SAAS;AAAA,QACT,UAAU;AAAA,QACV,YAAY;AAAA,QACZ,UAAU;AAAA,MACZ;AAAA,MACA,cAAU,0BAAWA,OAAM,UAAU,QAAQ;AAAA,MAC7C,YAAQ,0BAAWA,OAAM,QAAQ,QAAQ,MAAM,WAAW,KAAK,CAAC;AAAA,MAChE,aAAS,0BAAWA,OAAM,SAAS,SAAS,MAAM,WAAW,IAAI,CAAC;AAAA,MAClE,eAAW,0BAAWA,OAAM,WAAW,SAAS;AAAA,MAChD,aAAS,0BAAWA,OAAM,SAAS,OAAO;AAAA,IAC5C;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,QAAM,oBAA8B;AAAA,IAClC,CAACA,SAAQ,CAAC,GAAG,MAAM,UAAU;AAAA,MAC3B,GAAG;AAAA,MACH,OAAAA;AAAA,MACA;AAAA,MACA,iBAAa,0BAAWA,OAAM,aAAa,CAAC,OAAuB;AACjE,WAAG,eAAe;AAClB,WAAG,gBAAgB;AAAA,MACrB,CAAC;AAAA,MACD,kBAAc,0BAAWA,OAAM,cAAc,CAAC,OAAuB;AACnE,WAAG,eAAe;AAClB,WAAG,gBAAgB;AAAA,MACrB,CAAC;AAAA,MACD,oBAAgB,wBAAS,OAAO;AAAA,IAClC;AAAA,IACA,CAAC,SAAS,gBAAgB;AAAA,EAC5B;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;AAuBO,IAAM,YAAQ;AAAA,EACnB,CACE,OACA,QACG;AA9PP;AA+PI,UAAM,QAAQ,qBAAqB;AACnC,UAAM,cAAU,qCAAe,KAAK;AACpC,UAAM,CAAC,QAAQ,WAAW,QAAI,oCAAuB,SAAS;AAAA,MAC5D,GAAG;AAAA,MACH,GAAG;AAAA,IACL,CAAC;AACD,UAAM;AAAA,MACJ;AAAA,MACA,MAAM;AAAA,MACN,cAAa,oCAAO,eAAP,YAAqB,QAAQ;AAAA,MAC1C,cAAa,oCAAO,eAAP,YAAqB,QAAQ;AAAA,MAC1C,cAAa,oCAAO,eAAP,YAAqB,QAAQ;AAAA,MAC1C,aAAY,oCAAO,cAAP,YAAoB,QAAQ;AAAA,MACxC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,IACL,QAAI,4BAAe,WAAW;AAE9B,UAAM,EAAE,mBAAmB,eAAe,cAAc,cAAc,IACpE,SAAS;AAAA,MACP,GAAG;AAAA,MACH;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,YACE,+BAAO,UAAS,KAAK,QACjB,MAAM,UAAU,KAAK,QACrB,KAAK;AAAA,MACX,WACE,+BAAO,aAAY,KAAK,YACpB,uBAAQ,MAAM,UAAU,KAAK,QAAQ,IACrC,KAAK;AAAA,IACb,CAAC;AAEH,WACE;AAAA,MAAC,eAAG;AAAA,MAAH;AAAA,QACC,eAAW,kBAAG,YAAY,SAAS;AAAA,QAClC,GAAG,kBAAkB;AAAA,QACrB,OAAG,0BAAW,MAAM;AAAA,UACnB;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACF,CAAC;AAAA,QACD,OAAO;AAAA,UACL,QAAQ;AAAA,UACR,UAAU;AAAA,UACV,SAAS;AAAA,UACT,YAAY;AAAA,UACZ,eAAe;AAAA,UACf;AAAA,UACA,GAAG,OAAO;AAAA,QACZ;AAAA,QAEA;AAAA;AAAA,YAAC,eAAG;AAAA,YAAH;AAAA,cACC,WAAU;AAAA,cACT,GAAG,cAAc,YAAY,GAAG;AAAA;AAAA,UACnC;AAAA,UAEA;AAAA,YAAC,eAAG;AAAA,YAAH;AAAA,cACC,WAAU;AAAA,cACT,GAAG,aAAa,SAAS;AAAA,cAC1B,OAAO;AAAA,gBACL,UAAU;AAAA,gBACV,SAAS;AAAA,gBACT,YAAY;AAAA,gBACZ,GAAG,OAAO;AAAA,cACZ;AAAA;AAAA,UACF;AAAA,UAEA;AAAA,YAAC,eAAG;AAAA,YAAH;AAAA,cACC,WAAU;AAAA,cACT,GAAG,cAAc,UAAU;AAAA,cAC5B,OAAO,EAAE,GAAG,OAAO,MAAM;AAAA,cAExB;AAAA;AAAA,UACH;AAAA;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAMA,MAAM,cAAc;","names":["import_form_control","import_utils","import_react","props","value","props","import_jsx_runtime","props"]}
package/dist/index.mjs CHANGED
@@ -4,7 +4,7 @@ import {
4
4
  RadioGroup,
5
5
  useRadio,
6
6
  useRadioGroup
7
- } from "./chunk-RKB6MN6N.mjs";
7
+ } from "./chunk-CWVCOFAA.mjs";
8
8
  export {
9
9
  Radio,
10
10
  RadioGroup,
@@ -41,6 +41,10 @@ var import_react = require("react");
41
41
  var import_jsx_runtime = require("react/jsx-runtime");
42
42
  var useRadio = (props) => {
43
43
  const { id, name, value, required, disabled, readOnly, ...rest } = (0, import_form_control.useFormControlProps)(props);
44
+ const formControlProps = (0, import_utils.pickObject)(
45
+ rest,
46
+ (0, import_form_control.getFormControlProperties)({ omit: ["aria-readonly"] })
47
+ );
44
48
  const [isFocusVisible, setIsFocusVisible] = (0, import_react.useState)(false);
45
49
  const [isFocused, setFocused] = (0, import_react.useState)(false);
46
50
  const [isHovered, setHovered] = (0, import_react.useState)(false);
@@ -82,16 +86,16 @@ var useRadio = (props) => {
82
86
  );
83
87
  const getContainerProps = (0, import_react.useCallback)(
84
88
  (props2 = {}, ref = null) => ({
85
- ...(0, import_utils.pickObject)(rest, import_form_control.formControlProperties),
89
+ ...formControlProps,
86
90
  ...props2,
87
91
  ref,
88
92
  "data-checked": (0, import_utils.dataAttr)(checked)
89
93
  }),
90
- [checked, rest]
94
+ [checked, formControlProps]
91
95
  );
92
96
  const getIconProps = (0, import_react.useCallback)(
93
97
  (props2 = {}, ref = null) => ({
94
- ...(0, import_utils.pickObject)(rest, import_form_control.formControlProperties),
98
+ ...formControlProps,
95
99
  ...props2,
96
100
  ref,
97
101
  "data-active": (0, import_utils.dataAttr)(isActive),
@@ -105,11 +109,11 @@ var useRadio = (props) => {
105
109
  onMouseEnter: (0, import_utils.handlerAll)(props2.onMouseEnter, () => setHovered(true)),
106
110
  onMouseLeave: (0, import_utils.handlerAll)(props2.onMouseLeave, () => setHovered(false))
107
111
  }),
108
- [checked, isActive, isFocused, isFocusVisible, isHovered, rest]
112
+ [checked, isActive, isFocused, isFocusVisible, isHovered, formControlProps]
109
113
  );
110
114
  const getInputProps = (0, import_react.useCallback)(
111
115
  (props2 = {}, ref = null) => ({
112
- ...(0, import_utils.pickObject)(rest, import_form_control.formControlProperties),
116
+ ...formControlProps,
113
117
  ...props2,
114
118
  ref,
115
119
  id,
@@ -138,7 +142,7 @@ var useRadio = (props) => {
138
142
  onKeyUp: (0, import_utils.handlerAll)(props2.onKeyUp, onKeyUp)
139
143
  }),
140
144
  [
141
- rest,
145
+ formControlProps,
142
146
  id,
143
147
  name,
144
148
  value,
@@ -155,7 +159,7 @@ var useRadio = (props) => {
155
159
  );
156
160
  const getLabelProps = (0, import_react.useCallback)(
157
161
  (props2 = {}, ref = null) => ({
158
- ...(0, import_utils.pickObject)(rest, import_form_control.formControlProperties),
162
+ ...formControlProps,
159
163
  props: props2,
160
164
  ref,
161
165
  onMouseDown: (0, import_utils.handlerAll)(props2.onMouseDown, (ev) => {
@@ -168,7 +172,7 @@ var useRadio = (props) => {
168
172
  }),
169
173
  "data-checked": (0, import_utils.dataAttr)(checked)
170
174
  }),
171
- [checked, rest]
175
+ [checked, formControlProps]
172
176
  );
173
177
  return {
174
178
  isFocusVisible,
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/radio-group.tsx","../src/radio.tsx"],"sourcesContent":["import type { ComponentArgs, ThemeProps, UIPropGetter } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport { useFormControl } from \"@yamada-ui/form-control\"\nimport type { FlexProps } from \"@yamada-ui/layouts\"\nimport { Flex } from \"@yamada-ui/layouts\"\nimport { useControllableState } from \"@yamada-ui/use-controllable-state\"\nimport type { DOMAttributes, PropGetter } from \"@yamada-ui/utils\"\nimport {\n createContext,\n cx,\n isObject,\n mergeRefs,\n useCallbackRef,\n omitObject,\n getValidChildren,\n} from \"@yamada-ui/utils\"\nimport type { ChangeEvent, ForwardedRef, Ref, ReactElement } from \"react\"\nimport { useCallback, useId, useRef, forwardRef } from \"react\"\nimport type { RadioProps } from \"./radio\"\nimport { Radio } from \"./radio\"\n\nexport type RadioItem<Y extends string | number = string> = RadioProps<Y> & {\n label?: string\n}\n\nconst isEvent = (value: any): value is { target: HTMLInputElement } =>\n value && isObject(value) && isObject(value.target)\n\nexport type UseRadioGroupProps<Y extends string | number = string> = {\n /**\n * The top-level id string that will be applied to the radios.\n * The index of the radio will be appended to this top-level id.\n */\n id?: string\n /**\n * The HTML `name` attribute used for forms.\n */\n name?: string\n /**\n * The value of the radio group.\n */\n value?: Y\n /**\n * The initial value of the radio group.\n */\n defaultValue?: Y\n /**\n * The callback fired when any children radio is checked or unchecked.\n */\n onChange?: (value: Y) => void\n /**\n * If `true`, input elements will receive `checked` attribute instead of `isChecked`.\n *\n * This assumes, you're using native radio inputs.\n *\n * @default false\n */\n isNative?: boolean\n}\n\nexport const useRadioGroup = <Y extends string | number = string>({\n id,\n name,\n isNative,\n ...props\n}: UseRadioGroupProps<Y>) => {\n id ??= useId()\n name ??= `radio-${id}`\n\n props.onChange = useCallbackRef(props.onChange)\n\n const [value, setValue] = useControllableState({\n value: props.value,\n defaultValue: props.defaultValue,\n onChange: props.onChange,\n })\n\n const containerRef = useRef<any>(null)\n\n const onFocus = useCallback(() => {\n const container = containerRef.current\n\n if (!container) return\n\n let query = `input:not(:disabled):checked`\n\n let firstInput = container.querySelector(query) as HTMLElement | undefined\n\n if (firstInput) {\n firstInput.focus()\n } else {\n query = `input:not(:disabled)`\n firstInput = container.querySelector(query) as HTMLElement | undefined\n\n firstInput?.focus()\n }\n }, [])\n\n const onChange = useCallback(\n (evOrValue: ChangeEvent<HTMLInputElement> | Y) => {\n const nextValue = (\n isEvent(evOrValue) ? evOrValue.target.value : evOrValue\n ) as Y\n\n setValue(nextValue)\n },\n [setValue],\n )\n\n const getContainerProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...props,\n ref: mergeRefs(ref, containerRef),\n role: \"group\",\n }),\n [],\n )\n\n const getRadioProps: UIPropGetter<\"input\", { value?: Y }, { value?: Y }> =\n useCallback(\n (props = {}, ref = null) => ({\n ...props,\n ref,\n name,\n [isNative ? \"checked\" : \"isChecked\"]:\n value != null ? props.value === value : undefined,\n onChange,\n }),\n [name, value, onChange, isNative],\n )\n\n return {\n name,\n value,\n setValue,\n onChange,\n onFocus,\n getContainerProps,\n getRadioProps,\n }\n}\n\nexport type UseRadioGroupReturn<Y extends string | number = string> =\n ReturnType<typeof useRadioGroup<Y>>\n\nexport type RadioGroupProps<Y extends string | number = string> =\n ThemeProps<\"Radio\"> &\n Omit<FlexProps, \"onChange\"> &\n UseRadioGroupProps<Y> &\n FormControlOptions & {\n /**\n * If provided, generate radios based on items.\n *\n * @default '[]'\n */\n items?: RadioItem<Y>[]\n }\n\ntype RadioGroupContext = ThemeProps<\"Radio\"> &\n FormControlOptions & {\n name: string\n value: string | number\n onChange: (\n evOrValue: ChangeEvent<HTMLInputElement> | string | number,\n ) => void\n }\n\nconst [RadioGroupProvider, useRadioGroupContext] = createContext<\n RadioGroupContext | undefined\n>({\n strict: false,\n name: \"RadioGroupContext\",\n})\n\nexport { useRadioGroupContext }\n\nexport const RadioGroup = forwardRef(\n <Y extends string | number = string>(\n {\n className,\n size,\n variant,\n colorScheme,\n children,\n items = [],\n direction = \"column\",\n gap,\n ...props\n }: RadioGroupProps<Y>,\n ref: ForwardedRef<HTMLDivElement>,\n ) => {\n const { name, value, onChange, getContainerProps } = useRadioGroup(props)\n const { isRequired, isReadOnly, isDisabled, isInvalid } =\n useFormControl(props)\n\n const validChildren = getValidChildren(children)\n let computedChildren: ReactElement[] = []\n\n if (!validChildren.length && items.length) {\n computedChildren = items.map(({ label, value, ...props }, i) => (\n <Radio key={i} value={value} {...props}>\n {label}\n </Radio>\n ))\n }\n\n return (\n <RadioGroupProvider\n value={\n {\n size,\n variant,\n colorScheme,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n name,\n value,\n onChange,\n } as RadioGroupContext\n }\n >\n <Flex\n ref={ref}\n className={cx(\"ui-radio-group\", className)}\n gap={gap ?? (direction === \"row\" ? \"1rem\" : undefined)}\n {...getContainerProps(\n omitObject(props, [\n \"onChange\",\n \"isInvalid\",\n \"isDisabled\",\n \"isRequired\",\n \"isReadOnly\",\n ]) as DOMAttributes<HTMLElement>,\n )}\n direction={direction}\n >\n {children ?? computedChildren}\n </Flex>\n </RadioGroupProvider>\n )\n },\n) as {\n <Y extends string | number = string>(\n props: RadioGroupProps<Y> & { ref?: Ref<HTMLDivElement> },\n ): JSX.Element\n} & ComponentArgs\n\nRadioGroup.displayName = \"RadioGroup\"\n","import type {\n HTMLUIProps,\n ThemeProps,\n ComponentArgs,\n UIPropGetter,\n} from \"@yamada-ui/core\"\nimport { ui, useMultiComponentStyle, omitThemeProps } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport {\n useFormControl,\n useFormControlProps,\n formControlProperties,\n} from \"@yamada-ui/form-control\"\nimport { trackFocusVisible } from \"@yamada-ui/use-focus-visible\"\nimport {\n cx,\n useCallbackRef,\n omitObject,\n funcAll,\n handlerAll,\n dataAttr,\n pickObject,\n} from \"@yamada-ui/utils\"\nimport type {\n ForwardedRef,\n Ref,\n ChangeEvent,\n ChangeEventHandler,\n InputHTMLAttributes,\n KeyboardEvent,\n SyntheticEvent,\n} from \"react\"\nimport { forwardRef, useCallback, useEffect, useState } from \"react\"\nimport { useRadioGroupContext } from \"./radio-group\"\n\nexport type UseRadioProps<Y extends string | number = string> =\n FormControlOptions & {\n /**\n * id assigned to input.\n */\n id?: string\n /**\n * The name of the input field in a radio.\n */\n name?: string\n /**\n * The value to be used in the radio button.\n */\n value?: Y\n /**\n * If `true`, the radio will be initially checked.\n *\n * @default false\n */\n defaultIsChecked?: boolean\n /**\n * If `true`, the radio will be checked.\n *\n * @default false\n */\n isChecked?: boolean\n /**\n * The callback invoked when the checked state changes.\n */\n onChange?: ChangeEventHandler<HTMLInputElement>\n }\n\nexport const useRadio = <Y extends string | number = string>(\n props: UseRadioProps<Y>,\n) => {\n const { id, name, value, required, disabled, readOnly, ...rest } =\n useFormControlProps(props)\n\n const [isFocusVisible, setIsFocusVisible] = useState<boolean>(false)\n const [isFocused, setFocused] = useState<boolean>(false)\n const [isHovered, setHovered] = useState<boolean>(false)\n const [isActive, setActive] = useState<boolean>(false)\n\n const [isChecked, setIsChecked] = useState<boolean>(!!props.defaultIsChecked)\n\n const isControlled = props.isChecked !== undefined\n const checked = isControlled ? (props.isChecked as boolean) : isChecked\n\n useEffect(() => {\n return trackFocusVisible(setIsFocusVisible)\n }, [])\n\n const onChange = useCallbackRef(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if (readOnly || disabled) {\n ev.preventDefault()\n\n return\n }\n\n if (!isControlled) setIsChecked(ev.target.checked)\n\n rest.onChange?.(ev)\n },\n [readOnly, disabled, isControlled],\n )\n const onBlur = useCallbackRef(rest.onBlur)\n const onFocus = useCallbackRef(rest.onFocus)\n\n const onKeyDown = useCallback(\n ({ key }: KeyboardEvent<Element>) => {\n if (key === \" \") setActive(true)\n },\n [setActive],\n )\n\n const onKeyUp = useCallback(\n ({ key }: KeyboardEvent<Element>) => {\n if (key === \" \") setActive(false)\n },\n [setActive],\n )\n\n const getContainerProps: UIPropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n ...props,\n ref,\n \"data-checked\": dataAttr(checked),\n }),\n [checked, rest],\n )\n\n const getIconProps: UIPropGetter<\"span\"> = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n ...props,\n ref,\n \"data-active\": dataAttr(isActive),\n \"data-hover\": dataAttr(isHovered),\n \"data-checked\": dataAttr(checked),\n \"data-focus\": dataAttr(isFocused),\n \"data-focus-visible\": dataAttr(isFocused && isFocusVisible),\n \"aria-hidden\": true,\n onMouseDown: handlerAll(props.onMouseDown, () => setActive(true)),\n onMouseUp: handlerAll(props.onMouseUp, () => setActive(false)),\n onMouseEnter: handlerAll(props.onMouseEnter, () => setHovered(true)),\n onMouseLeave: handlerAll(props.onMouseLeave, () => setHovered(false)),\n }),\n [checked, isActive, isFocused, isFocusVisible, isHovered, rest],\n )\n\n const getInputProps: UIPropGetter<\"input\"> = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n ...props,\n ref,\n id,\n type: \"radio\",\n name,\n value,\n required,\n disabled,\n readOnly,\n checked,\n style: {\n border: \"0px\",\n clip: \"rect(0px, 0px, 0px, 0px)\",\n height: \"1px\",\n width: \"1px\",\n margin: \"-1px\",\n padding: \"0px\",\n overflow: \"hidden\",\n whiteSpace: \"nowrap\",\n position: \"absolute\",\n },\n onChange: handlerAll(props.onChange, onChange),\n onBlur: handlerAll(props.onBlur, onBlur, () => setFocused(false)),\n onFocus: handlerAll(props.onFocus, onFocus, () => setFocused(true)),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n onKeyUp: handlerAll(props.onKeyUp, onKeyUp),\n }),\n [\n rest,\n id,\n name,\n value,\n required,\n disabled,\n readOnly,\n checked,\n onChange,\n onBlur,\n onFocus,\n onKeyDown,\n onKeyUp,\n ],\n )\n\n const getLabelProps: UIPropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n props,\n ref,\n onMouseDown: handlerAll(props.onMouseDown, (ev: SyntheticEvent) => {\n ev.preventDefault()\n ev.stopPropagation()\n }),\n onTouchStart: handlerAll(props.onTouchStart, (ev: SyntheticEvent) => {\n ev.preventDefault()\n ev.stopPropagation()\n }),\n \"data-checked\": dataAttr(checked),\n }),\n [checked, rest],\n )\n\n return {\n isFocusVisible,\n isFocused,\n isHovered,\n isActive,\n isChecked: checked,\n getContainerProps,\n getInputProps,\n getIconProps,\n getLabelProps,\n }\n}\n\nexport type UseRadioReturn = ReturnType<typeof useRadio>\n\ntype RadioOptions = {\n iconProps?: HTMLUIProps<\"span\">\n inputProps?: InputHTMLAttributes<HTMLInputElement>\n labelProps?: HTMLUIProps<\"span\">\n}\n\nexport type RadioProps<Y extends string | number = string> = Omit<\n HTMLUIProps<\"label\">,\n keyof UseRadioProps\n> &\n ThemeProps<\"Radio\"> &\n UseRadioProps<Y> &\n RadioOptions\n\n/**\n * `Radio` is a component used for allowing users to select one option from multiple choices.\n *\n * @see Docs https://yamada-ui.com/components/forms/radio\n */\nexport const Radio = forwardRef(\n <Y extends string | number = string>(\n props: RadioProps<Y>,\n ref: ForwardedRef<HTMLInputElement>,\n ) => {\n const group = useRadioGroupContext()\n const control = useFormControl(props)\n const [styles, mergedProps] = useMultiComponentStyle(\"Radio\", {\n ...group,\n ...props,\n })\n const {\n className,\n gap = \"0.5rem\",\n isRequired = group?.isRequired ?? control.isRequired,\n isReadOnly = group?.isReadOnly ?? control.isReadOnly,\n isDisabled = group?.isDisabled ?? control.isDisabled,\n isInvalid = group?.isInvalid ?? control.isInvalid,\n iconProps,\n inputProps,\n labelProps,\n children,\n ...rest\n } = omitThemeProps(mergedProps)\n\n const { getContainerProps, getInputProps, getIconProps, getLabelProps } =\n useRadio({\n ...rest,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n isChecked:\n group?.value && rest.value\n ? group.value === rest.value\n : rest.isChecked,\n onChange:\n group?.onChange && rest.value\n ? funcAll(group.onChange, rest.onChange)\n : rest.onChange,\n })\n\n return (\n <ui.label\n className={cx(\"ui-radio\", className)}\n {...getContainerProps()}\n {...omitObject(rest, [\n \"id\",\n \"name\",\n \"value\",\n \"defaultValue\",\n \"defaultIsChecked\",\n \"isChecked\",\n \"onChange\",\n \"onBlur\",\n \"onFocus\",\n ])}\n __css={{\n cursor: \"pointer\",\n position: \"relative\",\n display: \"inline-flex\",\n alignItems: \"center\",\n verticalAlign: \"top\",\n gap,\n ...styles.container,\n }}\n >\n <ui.input\n className=\"ui-radio__input\"\n {...getInputProps(inputProps, ref)}\n />\n\n <ui.span\n className=\"ui-radio__icon\"\n {...getIconProps(iconProps)}\n __css={{\n position: \"relative\",\n display: \"inline-block\",\n userSelect: \"none\",\n ...styles.icon,\n }}\n />\n\n <ui.span\n className=\"ui-radio__label\"\n {...getLabelProps(labelProps)}\n __css={{ ...styles.label }}\n >\n {children}\n </ui.span>\n </ui.label>\n )\n },\n) as {\n <Y extends string | number = string>(\n props: RadioProps<Y> & { ref?: Ref<HTMLInputElement> },\n ): JSX.Element\n} & ComponentArgs\n\nRadio.displayName = \"Radio\"\n"],"mappings":"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","names":["import_form_control","import_utils","import_react","props","import_jsx_runtime","props","value","props"]}
1
+ {"version":3,"sources":["../src/radio-group.tsx","../src/radio.tsx"],"sourcesContent":["import type { ComponentArgs, ThemeProps, UIPropGetter } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport { useFormControl } from \"@yamada-ui/form-control\"\nimport type { FlexProps } from \"@yamada-ui/layouts\"\nimport { Flex } from \"@yamada-ui/layouts\"\nimport { useControllableState } from \"@yamada-ui/use-controllable-state\"\nimport type { DOMAttributes, PropGetter } from \"@yamada-ui/utils\"\nimport {\n createContext,\n cx,\n isObject,\n mergeRefs,\n useCallbackRef,\n omitObject,\n getValidChildren,\n} from \"@yamada-ui/utils\"\nimport type { ChangeEvent, ForwardedRef, Ref, ReactElement } from \"react\"\nimport { useCallback, useId, useRef, forwardRef } from \"react\"\nimport type { RadioProps } from \"./radio\"\nimport { Radio } from \"./radio\"\n\nexport type RadioItem<Y extends string | number = string> = RadioProps<Y> & {\n label?: string\n}\n\nconst isEvent = (value: any): value is { target: HTMLInputElement } =>\n value && isObject(value) && isObject(value.target)\n\nexport type UseRadioGroupProps<Y extends string | number = string> = {\n /**\n * The top-level id string that will be applied to the radios.\n * The index of the radio will be appended to this top-level id.\n */\n id?: string\n /**\n * The HTML `name` attribute used for forms.\n */\n name?: string\n /**\n * The value of the radio group.\n */\n value?: Y\n /**\n * The initial value of the radio group.\n */\n defaultValue?: Y\n /**\n * The callback fired when any children radio is checked or unchecked.\n */\n onChange?: (value: Y) => void\n /**\n * If `true`, input elements will receive `checked` attribute instead of `isChecked`.\n *\n * This assumes, you're using native radio inputs.\n *\n * @default false\n */\n isNative?: boolean\n}\n\nexport const useRadioGroup = <Y extends string | number = string>({\n id,\n name,\n isNative,\n ...props\n}: UseRadioGroupProps<Y>) => {\n id ??= useId()\n name ??= `radio-${id}`\n\n props.onChange = useCallbackRef(props.onChange)\n\n const [value, setValue] = useControllableState({\n value: props.value,\n defaultValue: props.defaultValue,\n onChange: props.onChange,\n })\n\n const containerRef = useRef<any>(null)\n\n const onFocus = useCallback(() => {\n const container = containerRef.current\n\n if (!container) return\n\n let query = `input:not(:disabled):checked`\n\n let firstInput = container.querySelector(query) as HTMLElement | undefined\n\n if (firstInput) {\n firstInput.focus()\n } else {\n query = `input:not(:disabled)`\n firstInput = container.querySelector(query) as HTMLElement | undefined\n\n firstInput?.focus()\n }\n }, [])\n\n const onChange = useCallback(\n (evOrValue: ChangeEvent<HTMLInputElement> | Y) => {\n const nextValue = (\n isEvent(evOrValue) ? evOrValue.target.value : evOrValue\n ) as Y\n\n setValue(nextValue)\n },\n [setValue],\n )\n\n const getContainerProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...props,\n ref: mergeRefs(ref, containerRef),\n role: \"group\",\n }),\n [],\n )\n\n const getRadioProps: UIPropGetter<\"input\", { value?: Y }, { value?: Y }> =\n useCallback(\n (props = {}, ref = null) => ({\n ...props,\n ref,\n name,\n [isNative ? \"checked\" : \"isChecked\"]:\n value != null ? props.value === value : undefined,\n onChange,\n }),\n [name, value, onChange, isNative],\n )\n\n return {\n name,\n value,\n setValue,\n onChange,\n onFocus,\n getContainerProps,\n getRadioProps,\n }\n}\n\nexport type UseRadioGroupReturn<Y extends string | number = string> =\n ReturnType<typeof useRadioGroup<Y>>\n\nexport type RadioGroupProps<Y extends string | number = string> =\n ThemeProps<\"Radio\"> &\n Omit<FlexProps, \"onChange\"> &\n UseRadioGroupProps<Y> &\n FormControlOptions & {\n /**\n * If provided, generate radios based on items.\n *\n * @default '[]'\n */\n items?: RadioItem<Y>[]\n }\n\ntype RadioGroupContext = ThemeProps<\"Radio\"> &\n FormControlOptions & {\n name: string\n value: string | number\n onChange: (\n evOrValue: ChangeEvent<HTMLInputElement> | string | number,\n ) => void\n }\n\nconst [RadioGroupProvider, useRadioGroupContext] = createContext<\n RadioGroupContext | undefined\n>({\n strict: false,\n name: \"RadioGroupContext\",\n})\n\nexport { useRadioGroupContext }\n\nexport const RadioGroup = forwardRef(\n <Y extends string | number = string>(\n {\n className,\n size,\n variant,\n colorScheme,\n children,\n items = [],\n direction = \"column\",\n gap,\n ...props\n }: RadioGroupProps<Y>,\n ref: ForwardedRef<HTMLDivElement>,\n ) => {\n const { name, value, onChange, getContainerProps } = useRadioGroup(props)\n const { isRequired, isReadOnly, isDisabled, isInvalid } =\n useFormControl(props)\n\n const validChildren = getValidChildren(children)\n let computedChildren: ReactElement[] = []\n\n if (!validChildren.length && items.length) {\n computedChildren = items.map(({ label, value, ...props }, i) => (\n <Radio key={i} value={value} {...props}>\n {label}\n </Radio>\n ))\n }\n\n return (\n <RadioGroupProvider\n value={\n {\n size,\n variant,\n colorScheme,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n name,\n value,\n onChange,\n } as RadioGroupContext\n }\n >\n <Flex\n ref={ref}\n className={cx(\"ui-radio-group\", className)}\n gap={gap ?? (direction === \"row\" ? \"1rem\" : undefined)}\n {...getContainerProps(\n omitObject(props, [\n \"onChange\",\n \"isInvalid\",\n \"isDisabled\",\n \"isRequired\",\n \"isReadOnly\",\n ]) as DOMAttributes<HTMLElement>,\n )}\n direction={direction}\n >\n {children ?? computedChildren}\n </Flex>\n </RadioGroupProvider>\n )\n },\n) as {\n <Y extends string | number = string>(\n props: RadioGroupProps<Y> & { ref?: Ref<HTMLDivElement> },\n ): JSX.Element\n} & ComponentArgs\n\nRadioGroup.displayName = \"RadioGroup\"\n","import type {\n HTMLUIProps,\n ThemeProps,\n ComponentArgs,\n UIPropGetter,\n} from \"@yamada-ui/core\"\nimport { ui, useMultiComponentStyle, omitThemeProps } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport {\n useFormControl,\n useFormControlProps,\n getFormControlProperties,\n} from \"@yamada-ui/form-control\"\nimport { trackFocusVisible } from \"@yamada-ui/use-focus-visible\"\nimport {\n cx,\n useCallbackRef,\n omitObject,\n funcAll,\n handlerAll,\n dataAttr,\n pickObject,\n} from \"@yamada-ui/utils\"\nimport type {\n ForwardedRef,\n Ref,\n ChangeEvent,\n ChangeEventHandler,\n InputHTMLAttributes,\n KeyboardEvent,\n SyntheticEvent,\n} from \"react\"\nimport { forwardRef, useCallback, useEffect, useState } from \"react\"\nimport { useRadioGroupContext } from \"./radio-group\"\n\nexport type UseRadioProps<Y extends string | number = string> =\n FormControlOptions & {\n /**\n * id assigned to input.\n */\n id?: string\n /**\n * The name of the input field in a radio.\n */\n name?: string\n /**\n * The value to be used in the radio button.\n */\n value?: Y\n /**\n * If `true`, the radio will be initially checked.\n *\n * @default false\n */\n defaultIsChecked?: boolean\n /**\n * If `true`, the radio will be checked.\n *\n * @default false\n */\n isChecked?: boolean\n /**\n * The callback invoked when the checked state changes.\n */\n onChange?: ChangeEventHandler<HTMLInputElement>\n }\n\nexport const useRadio = <Y extends string | number = string>(\n props: UseRadioProps<Y>,\n) => {\n const { id, name, value, required, disabled, readOnly, ...rest } =\n useFormControlProps(props)\n const formControlProps = pickObject(\n rest,\n getFormControlProperties({ omit: [\"aria-readonly\"] }),\n )\n\n const [isFocusVisible, setIsFocusVisible] = useState<boolean>(false)\n const [isFocused, setFocused] = useState<boolean>(false)\n const [isHovered, setHovered] = useState<boolean>(false)\n const [isActive, setActive] = useState<boolean>(false)\n\n const [isChecked, setIsChecked] = useState<boolean>(!!props.defaultIsChecked)\n\n const isControlled = props.isChecked !== undefined\n const checked = isControlled ? (props.isChecked as boolean) : isChecked\n\n useEffect(() => {\n return trackFocusVisible(setIsFocusVisible)\n }, [])\n\n const onChange = useCallbackRef(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if (readOnly || disabled) {\n ev.preventDefault()\n\n return\n }\n\n if (!isControlled) setIsChecked(ev.target.checked)\n\n rest.onChange?.(ev)\n },\n [readOnly, disabled, isControlled],\n )\n const onBlur = useCallbackRef(rest.onBlur)\n const onFocus = useCallbackRef(rest.onFocus)\n\n const onKeyDown = useCallback(\n ({ key }: KeyboardEvent<Element>) => {\n if (key === \" \") setActive(true)\n },\n [setActive],\n )\n\n const onKeyUp = useCallback(\n ({ key }: KeyboardEvent<Element>) => {\n if (key === \" \") setActive(false)\n },\n [setActive],\n )\n\n const getContainerProps: UIPropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref,\n \"data-checked\": dataAttr(checked),\n }),\n [checked, formControlProps],\n )\n\n const getIconProps: UIPropGetter<\"span\"> = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref,\n \"data-active\": dataAttr(isActive),\n \"data-hover\": dataAttr(isHovered),\n \"data-checked\": dataAttr(checked),\n \"data-focus\": dataAttr(isFocused),\n \"data-focus-visible\": dataAttr(isFocused && isFocusVisible),\n \"aria-hidden\": true,\n onMouseDown: handlerAll(props.onMouseDown, () => setActive(true)),\n onMouseUp: handlerAll(props.onMouseUp, () => setActive(false)),\n onMouseEnter: handlerAll(props.onMouseEnter, () => setHovered(true)),\n onMouseLeave: handlerAll(props.onMouseLeave, () => setHovered(false)),\n }),\n [checked, isActive, isFocused, isFocusVisible, isHovered, formControlProps],\n )\n\n const getInputProps: UIPropGetter<\"input\"> = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref,\n id,\n type: \"radio\",\n name,\n value,\n required,\n disabled,\n readOnly,\n checked,\n style: {\n border: \"0px\",\n clip: \"rect(0px, 0px, 0px, 0px)\",\n height: \"1px\",\n width: \"1px\",\n margin: \"-1px\",\n padding: \"0px\",\n overflow: \"hidden\",\n whiteSpace: \"nowrap\",\n position: \"absolute\",\n },\n onChange: handlerAll(props.onChange, onChange),\n onBlur: handlerAll(props.onBlur, onBlur, () => setFocused(false)),\n onFocus: handlerAll(props.onFocus, onFocus, () => setFocused(true)),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n onKeyUp: handlerAll(props.onKeyUp, onKeyUp),\n }),\n [\n formControlProps,\n id,\n name,\n value,\n required,\n disabled,\n readOnly,\n checked,\n onChange,\n onBlur,\n onFocus,\n onKeyDown,\n onKeyUp,\n ],\n )\n\n const getLabelProps: UIPropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n props,\n ref,\n onMouseDown: handlerAll(props.onMouseDown, (ev: SyntheticEvent) => {\n ev.preventDefault()\n ev.stopPropagation()\n }),\n onTouchStart: handlerAll(props.onTouchStart, (ev: SyntheticEvent) => {\n ev.preventDefault()\n ev.stopPropagation()\n }),\n \"data-checked\": dataAttr(checked),\n }),\n [checked, formControlProps],\n )\n\n return {\n isFocusVisible,\n isFocused,\n isHovered,\n isActive,\n isChecked: checked,\n getContainerProps,\n getInputProps,\n getIconProps,\n getLabelProps,\n }\n}\n\nexport type UseRadioReturn = ReturnType<typeof useRadio>\n\ntype RadioOptions = {\n iconProps?: HTMLUIProps<\"span\">\n inputProps?: InputHTMLAttributes<HTMLInputElement>\n labelProps?: HTMLUIProps<\"span\">\n}\n\nexport type RadioProps<Y extends string | number = string> = Omit<\n HTMLUIProps<\"label\">,\n keyof UseRadioProps\n> &\n ThemeProps<\"Radio\"> &\n UseRadioProps<Y> &\n RadioOptions\n\n/**\n * `Radio` is a component used for allowing users to select one option from multiple choices.\n *\n * @see Docs https://yamada-ui.com/components/forms/radio\n */\nexport const Radio = forwardRef(\n <Y extends string | number = string>(\n props: RadioProps<Y>,\n ref: ForwardedRef<HTMLInputElement>,\n ) => {\n const group = useRadioGroupContext()\n const control = useFormControl(props)\n const [styles, mergedProps] = useMultiComponentStyle(\"Radio\", {\n ...group,\n ...props,\n })\n const {\n className,\n gap = \"0.5rem\",\n isRequired = group?.isRequired ?? control.isRequired,\n isReadOnly = group?.isReadOnly ?? control.isReadOnly,\n isDisabled = group?.isDisabled ?? control.isDisabled,\n isInvalid = group?.isInvalid ?? control.isInvalid,\n iconProps,\n inputProps,\n labelProps,\n children,\n ...rest\n } = omitThemeProps(mergedProps)\n\n const { getContainerProps, getInputProps, getIconProps, getLabelProps } =\n useRadio({\n ...rest,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n isChecked:\n group?.value && rest.value\n ? group.value === rest.value\n : rest.isChecked,\n onChange:\n group?.onChange && rest.value\n ? funcAll(group.onChange, rest.onChange)\n : rest.onChange,\n })\n\n return (\n <ui.label\n className={cx(\"ui-radio\", className)}\n {...getContainerProps()}\n {...omitObject(rest, [\n \"id\",\n \"name\",\n \"value\",\n \"defaultValue\",\n \"defaultIsChecked\",\n \"isChecked\",\n \"onChange\",\n \"onBlur\",\n \"onFocus\",\n ])}\n __css={{\n cursor: \"pointer\",\n position: \"relative\",\n display: \"inline-flex\",\n alignItems: \"center\",\n verticalAlign: \"top\",\n gap,\n ...styles.container,\n }}\n >\n <ui.input\n className=\"ui-radio__input\"\n {...getInputProps(inputProps, ref)}\n />\n\n <ui.span\n className=\"ui-radio__icon\"\n {...getIconProps(iconProps)}\n __css={{\n position: \"relative\",\n display: \"inline-block\",\n userSelect: \"none\",\n ...styles.icon,\n }}\n />\n\n <ui.span\n className=\"ui-radio__label\"\n {...getLabelProps(labelProps)}\n __css={{ ...styles.label }}\n >\n {children}\n </ui.span>\n </ui.label>\n )\n },\n) as {\n <Y extends string | number = string>(\n props: RadioProps<Y> & { ref?: Ref<HTMLInputElement> },\n ): JSX.Element\n} & ComponentArgs\n\nRadio.displayName = \"Radio\"\n"],"mappings":"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","names":["import_form_control","import_utils","import_react","props","import_jsx_runtime","props","value","props"]}
@@ -3,7 +3,7 @@ import {
3
3
  RadioGroup,
4
4
  useRadioGroup,
5
5
  useRadioGroupContext
6
- } from "./chunk-RKB6MN6N.mjs";
6
+ } from "./chunk-CWVCOFAA.mjs";
7
7
  export {
8
8
  RadioGroup,
9
9
  useRadioGroup,
package/dist/radio.js CHANGED
@@ -170,6 +170,10 @@ RadioGroup.displayName = "RadioGroup";
170
170
  var import_jsx_runtime2 = require("react/jsx-runtime");
171
171
  var useRadio = (props) => {
172
172
  const { id, name, value, required, disabled, readOnly, ...rest } = (0, import_form_control2.useFormControlProps)(props);
173
+ const formControlProps = (0, import_utils2.pickObject)(
174
+ rest,
175
+ (0, import_form_control2.getFormControlProperties)({ omit: ["aria-readonly"] })
176
+ );
173
177
  const [isFocusVisible, setIsFocusVisible] = (0, import_react2.useState)(false);
174
178
  const [isFocused, setFocused] = (0, import_react2.useState)(false);
175
179
  const [isHovered, setHovered] = (0, import_react2.useState)(false);
@@ -211,16 +215,16 @@ var useRadio = (props) => {
211
215
  );
212
216
  const getContainerProps = (0, import_react2.useCallback)(
213
217
  (props2 = {}, ref = null) => ({
214
- ...(0, import_utils2.pickObject)(rest, import_form_control2.formControlProperties),
218
+ ...formControlProps,
215
219
  ...props2,
216
220
  ref,
217
221
  "data-checked": (0, import_utils2.dataAttr)(checked)
218
222
  }),
219
- [checked, rest]
223
+ [checked, formControlProps]
220
224
  );
221
225
  const getIconProps = (0, import_react2.useCallback)(
222
226
  (props2 = {}, ref = null) => ({
223
- ...(0, import_utils2.pickObject)(rest, import_form_control2.formControlProperties),
227
+ ...formControlProps,
224
228
  ...props2,
225
229
  ref,
226
230
  "data-active": (0, import_utils2.dataAttr)(isActive),
@@ -234,11 +238,11 @@ var useRadio = (props) => {
234
238
  onMouseEnter: (0, import_utils2.handlerAll)(props2.onMouseEnter, () => setHovered(true)),
235
239
  onMouseLeave: (0, import_utils2.handlerAll)(props2.onMouseLeave, () => setHovered(false))
236
240
  }),
237
- [checked, isActive, isFocused, isFocusVisible, isHovered, rest]
241
+ [checked, isActive, isFocused, isFocusVisible, isHovered, formControlProps]
238
242
  );
239
243
  const getInputProps = (0, import_react2.useCallback)(
240
244
  (props2 = {}, ref = null) => ({
241
- ...(0, import_utils2.pickObject)(rest, import_form_control2.formControlProperties),
245
+ ...formControlProps,
242
246
  ...props2,
243
247
  ref,
244
248
  id,
@@ -267,7 +271,7 @@ var useRadio = (props) => {
267
271
  onKeyUp: (0, import_utils2.handlerAll)(props2.onKeyUp, onKeyUp)
268
272
  }),
269
273
  [
270
- rest,
274
+ formControlProps,
271
275
  id,
272
276
  name,
273
277
  value,
@@ -284,7 +288,7 @@ var useRadio = (props) => {
284
288
  );
285
289
  const getLabelProps = (0, import_react2.useCallback)(
286
290
  (props2 = {}, ref = null) => ({
287
- ...(0, import_utils2.pickObject)(rest, import_form_control2.formControlProperties),
291
+ ...formControlProps,
288
292
  props: props2,
289
293
  ref,
290
294
  onMouseDown: (0, import_utils2.handlerAll)(props2.onMouseDown, (ev) => {
@@ -297,7 +301,7 @@ var useRadio = (props) => {
297
301
  }),
298
302
  "data-checked": (0, import_utils2.dataAttr)(checked)
299
303
  }),
300
- [checked, rest]
304
+ [checked, formControlProps]
301
305
  );
302
306
  return {
303
307
  isFocusVisible,
package/dist/radio.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/radio.tsx","../src/radio-group.tsx"],"sourcesContent":["import type {\n HTMLUIProps,\n ThemeProps,\n ComponentArgs,\n UIPropGetter,\n} from \"@yamada-ui/core\"\nimport { ui, useMultiComponentStyle, omitThemeProps } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport {\n useFormControl,\n useFormControlProps,\n formControlProperties,\n} from \"@yamada-ui/form-control\"\nimport { trackFocusVisible } from \"@yamada-ui/use-focus-visible\"\nimport {\n cx,\n useCallbackRef,\n omitObject,\n funcAll,\n handlerAll,\n dataAttr,\n pickObject,\n} from \"@yamada-ui/utils\"\nimport type {\n ForwardedRef,\n Ref,\n ChangeEvent,\n ChangeEventHandler,\n InputHTMLAttributes,\n KeyboardEvent,\n SyntheticEvent,\n} from \"react\"\nimport { forwardRef, useCallback, useEffect, useState } from \"react\"\nimport { useRadioGroupContext } from \"./radio-group\"\n\nexport type UseRadioProps<Y extends string | number = string> =\n FormControlOptions & {\n /**\n * id assigned to input.\n */\n id?: string\n /**\n * The name of the input field in a radio.\n */\n name?: string\n /**\n * The value to be used in the radio button.\n */\n value?: Y\n /**\n * If `true`, the radio will be initially checked.\n *\n * @default false\n */\n defaultIsChecked?: boolean\n /**\n * If `true`, the radio will be checked.\n *\n * @default false\n */\n isChecked?: boolean\n /**\n * The callback invoked when the checked state changes.\n */\n onChange?: ChangeEventHandler<HTMLInputElement>\n }\n\nexport const useRadio = <Y extends string | number = string>(\n props: UseRadioProps<Y>,\n) => {\n const { id, name, value, required, disabled, readOnly, ...rest } =\n useFormControlProps(props)\n\n const [isFocusVisible, setIsFocusVisible] = useState<boolean>(false)\n const [isFocused, setFocused] = useState<boolean>(false)\n const [isHovered, setHovered] = useState<boolean>(false)\n const [isActive, setActive] = useState<boolean>(false)\n\n const [isChecked, setIsChecked] = useState<boolean>(!!props.defaultIsChecked)\n\n const isControlled = props.isChecked !== undefined\n const checked = isControlled ? (props.isChecked as boolean) : isChecked\n\n useEffect(() => {\n return trackFocusVisible(setIsFocusVisible)\n }, [])\n\n const onChange = useCallbackRef(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if (readOnly || disabled) {\n ev.preventDefault()\n\n return\n }\n\n if (!isControlled) setIsChecked(ev.target.checked)\n\n rest.onChange?.(ev)\n },\n [readOnly, disabled, isControlled],\n )\n const onBlur = useCallbackRef(rest.onBlur)\n const onFocus = useCallbackRef(rest.onFocus)\n\n const onKeyDown = useCallback(\n ({ key }: KeyboardEvent<Element>) => {\n if (key === \" \") setActive(true)\n },\n [setActive],\n )\n\n const onKeyUp = useCallback(\n ({ key }: KeyboardEvent<Element>) => {\n if (key === \" \") setActive(false)\n },\n [setActive],\n )\n\n const getContainerProps: UIPropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n ...props,\n ref,\n \"data-checked\": dataAttr(checked),\n }),\n [checked, rest],\n )\n\n const getIconProps: UIPropGetter<\"span\"> = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n ...props,\n ref,\n \"data-active\": dataAttr(isActive),\n \"data-hover\": dataAttr(isHovered),\n \"data-checked\": dataAttr(checked),\n \"data-focus\": dataAttr(isFocused),\n \"data-focus-visible\": dataAttr(isFocused && isFocusVisible),\n \"aria-hidden\": true,\n onMouseDown: handlerAll(props.onMouseDown, () => setActive(true)),\n onMouseUp: handlerAll(props.onMouseUp, () => setActive(false)),\n onMouseEnter: handlerAll(props.onMouseEnter, () => setHovered(true)),\n onMouseLeave: handlerAll(props.onMouseLeave, () => setHovered(false)),\n }),\n [checked, isActive, isFocused, isFocusVisible, isHovered, rest],\n )\n\n const getInputProps: UIPropGetter<\"input\"> = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n ...props,\n ref,\n id,\n type: \"radio\",\n name,\n value,\n required,\n disabled,\n readOnly,\n checked,\n style: {\n border: \"0px\",\n clip: \"rect(0px, 0px, 0px, 0px)\",\n height: \"1px\",\n width: \"1px\",\n margin: \"-1px\",\n padding: \"0px\",\n overflow: \"hidden\",\n whiteSpace: \"nowrap\",\n position: \"absolute\",\n },\n onChange: handlerAll(props.onChange, onChange),\n onBlur: handlerAll(props.onBlur, onBlur, () => setFocused(false)),\n onFocus: handlerAll(props.onFocus, onFocus, () => setFocused(true)),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n onKeyUp: handlerAll(props.onKeyUp, onKeyUp),\n }),\n [\n rest,\n id,\n name,\n value,\n required,\n disabled,\n readOnly,\n checked,\n onChange,\n onBlur,\n onFocus,\n onKeyDown,\n onKeyUp,\n ],\n )\n\n const getLabelProps: UIPropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n props,\n ref,\n onMouseDown: handlerAll(props.onMouseDown, (ev: SyntheticEvent) => {\n ev.preventDefault()\n ev.stopPropagation()\n }),\n onTouchStart: handlerAll(props.onTouchStart, (ev: SyntheticEvent) => {\n ev.preventDefault()\n ev.stopPropagation()\n }),\n \"data-checked\": dataAttr(checked),\n }),\n [checked, rest],\n )\n\n return {\n isFocusVisible,\n isFocused,\n isHovered,\n isActive,\n isChecked: checked,\n getContainerProps,\n getInputProps,\n getIconProps,\n getLabelProps,\n }\n}\n\nexport type UseRadioReturn = ReturnType<typeof useRadio>\n\ntype RadioOptions = {\n iconProps?: HTMLUIProps<\"span\">\n inputProps?: InputHTMLAttributes<HTMLInputElement>\n labelProps?: HTMLUIProps<\"span\">\n}\n\nexport type RadioProps<Y extends string | number = string> = Omit<\n HTMLUIProps<\"label\">,\n keyof UseRadioProps\n> &\n ThemeProps<\"Radio\"> &\n UseRadioProps<Y> &\n RadioOptions\n\n/**\n * `Radio` is a component used for allowing users to select one option from multiple choices.\n *\n * @see Docs https://yamada-ui.com/components/forms/radio\n */\nexport const Radio = forwardRef(\n <Y extends string | number = string>(\n props: RadioProps<Y>,\n ref: ForwardedRef<HTMLInputElement>,\n ) => {\n const group = useRadioGroupContext()\n const control = useFormControl(props)\n const [styles, mergedProps] = useMultiComponentStyle(\"Radio\", {\n ...group,\n ...props,\n })\n const {\n className,\n gap = \"0.5rem\",\n isRequired = group?.isRequired ?? control.isRequired,\n isReadOnly = group?.isReadOnly ?? control.isReadOnly,\n isDisabled = group?.isDisabled ?? control.isDisabled,\n isInvalid = group?.isInvalid ?? control.isInvalid,\n iconProps,\n inputProps,\n labelProps,\n children,\n ...rest\n } = omitThemeProps(mergedProps)\n\n const { getContainerProps, getInputProps, getIconProps, getLabelProps } =\n useRadio({\n ...rest,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n isChecked:\n group?.value && rest.value\n ? group.value === rest.value\n : rest.isChecked,\n onChange:\n group?.onChange && rest.value\n ? funcAll(group.onChange, rest.onChange)\n : rest.onChange,\n })\n\n return (\n <ui.label\n className={cx(\"ui-radio\", className)}\n {...getContainerProps()}\n {...omitObject(rest, [\n \"id\",\n \"name\",\n \"value\",\n \"defaultValue\",\n \"defaultIsChecked\",\n \"isChecked\",\n \"onChange\",\n \"onBlur\",\n \"onFocus\",\n ])}\n __css={{\n cursor: \"pointer\",\n position: \"relative\",\n display: \"inline-flex\",\n alignItems: \"center\",\n verticalAlign: \"top\",\n gap,\n ...styles.container,\n }}\n >\n <ui.input\n className=\"ui-radio__input\"\n {...getInputProps(inputProps, ref)}\n />\n\n <ui.span\n className=\"ui-radio__icon\"\n {...getIconProps(iconProps)}\n __css={{\n position: \"relative\",\n display: \"inline-block\",\n userSelect: \"none\",\n ...styles.icon,\n }}\n />\n\n <ui.span\n className=\"ui-radio__label\"\n {...getLabelProps(labelProps)}\n __css={{ ...styles.label }}\n >\n {children}\n </ui.span>\n </ui.label>\n )\n },\n) as {\n <Y extends string | number = string>(\n props: RadioProps<Y> & { ref?: Ref<HTMLInputElement> },\n ): JSX.Element\n} & ComponentArgs\n\nRadio.displayName = \"Radio\"\n","import type { ComponentArgs, ThemeProps, UIPropGetter } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport { useFormControl } from \"@yamada-ui/form-control\"\nimport type { FlexProps } from \"@yamada-ui/layouts\"\nimport { Flex } from \"@yamada-ui/layouts\"\nimport { useControllableState } from \"@yamada-ui/use-controllable-state\"\nimport type { DOMAttributes, PropGetter } from \"@yamada-ui/utils\"\nimport {\n createContext,\n cx,\n isObject,\n mergeRefs,\n useCallbackRef,\n omitObject,\n getValidChildren,\n} from \"@yamada-ui/utils\"\nimport type { ChangeEvent, ForwardedRef, Ref, ReactElement } from \"react\"\nimport { useCallback, useId, useRef, forwardRef } from \"react\"\nimport type { RadioProps } from \"./radio\"\nimport { Radio } from \"./radio\"\n\nexport type RadioItem<Y extends string | number = string> = RadioProps<Y> & {\n label?: string\n}\n\nconst isEvent = (value: any): value is { target: HTMLInputElement } =>\n value && isObject(value) && isObject(value.target)\n\nexport type UseRadioGroupProps<Y extends string | number = string> = {\n /**\n * The top-level id string that will be applied to the radios.\n * The index of the radio will be appended to this top-level id.\n */\n id?: string\n /**\n * The HTML `name` attribute used for forms.\n */\n name?: string\n /**\n * The value of the radio group.\n */\n value?: Y\n /**\n * The initial value of the radio group.\n */\n defaultValue?: Y\n /**\n * The callback fired when any children radio is checked or unchecked.\n */\n onChange?: (value: Y) => void\n /**\n * If `true`, input elements will receive `checked` attribute instead of `isChecked`.\n *\n * This assumes, you're using native radio inputs.\n *\n * @default false\n */\n isNative?: boolean\n}\n\nexport const useRadioGroup = <Y extends string | number = string>({\n id,\n name,\n isNative,\n ...props\n}: UseRadioGroupProps<Y>) => {\n id ??= useId()\n name ??= `radio-${id}`\n\n props.onChange = useCallbackRef(props.onChange)\n\n const [value, setValue] = useControllableState({\n value: props.value,\n defaultValue: props.defaultValue,\n onChange: props.onChange,\n })\n\n const containerRef = useRef<any>(null)\n\n const onFocus = useCallback(() => {\n const container = containerRef.current\n\n if (!container) return\n\n let query = `input:not(:disabled):checked`\n\n let firstInput = container.querySelector(query) as HTMLElement | undefined\n\n if (firstInput) {\n firstInput.focus()\n } else {\n query = `input:not(:disabled)`\n firstInput = container.querySelector(query) as HTMLElement | undefined\n\n firstInput?.focus()\n }\n }, [])\n\n const onChange = useCallback(\n (evOrValue: ChangeEvent<HTMLInputElement> | Y) => {\n const nextValue = (\n isEvent(evOrValue) ? evOrValue.target.value : evOrValue\n ) as Y\n\n setValue(nextValue)\n },\n [setValue],\n )\n\n const getContainerProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...props,\n ref: mergeRefs(ref, containerRef),\n role: \"group\",\n }),\n [],\n )\n\n const getRadioProps: UIPropGetter<\"input\", { value?: Y }, { value?: Y }> =\n useCallback(\n (props = {}, ref = null) => ({\n ...props,\n ref,\n name,\n [isNative ? \"checked\" : \"isChecked\"]:\n value != null ? props.value === value : undefined,\n onChange,\n }),\n [name, value, onChange, isNative],\n )\n\n return {\n name,\n value,\n setValue,\n onChange,\n onFocus,\n getContainerProps,\n getRadioProps,\n }\n}\n\nexport type UseRadioGroupReturn<Y extends string | number = string> =\n ReturnType<typeof useRadioGroup<Y>>\n\nexport type RadioGroupProps<Y extends string | number = string> =\n ThemeProps<\"Radio\"> &\n Omit<FlexProps, \"onChange\"> &\n UseRadioGroupProps<Y> &\n FormControlOptions & {\n /**\n * If provided, generate radios based on items.\n *\n * @default '[]'\n */\n items?: RadioItem<Y>[]\n }\n\ntype RadioGroupContext = ThemeProps<\"Radio\"> &\n FormControlOptions & {\n name: string\n value: string | number\n onChange: (\n evOrValue: ChangeEvent<HTMLInputElement> | string | number,\n ) => void\n }\n\nconst [RadioGroupProvider, useRadioGroupContext] = createContext<\n RadioGroupContext | undefined\n>({\n strict: false,\n name: \"RadioGroupContext\",\n})\n\nexport { useRadioGroupContext }\n\nexport const RadioGroup = forwardRef(\n <Y extends string | number = string>(\n {\n className,\n size,\n variant,\n colorScheme,\n children,\n items = [],\n direction = \"column\",\n gap,\n ...props\n }: RadioGroupProps<Y>,\n ref: ForwardedRef<HTMLDivElement>,\n ) => {\n const { name, value, onChange, getContainerProps } = useRadioGroup(props)\n const { isRequired, isReadOnly, isDisabled, isInvalid } =\n useFormControl(props)\n\n const validChildren = getValidChildren(children)\n let computedChildren: ReactElement[] = []\n\n if (!validChildren.length && items.length) {\n computedChildren = items.map(({ label, value, ...props }, i) => (\n <Radio key={i} value={value} {...props}>\n {label}\n </Radio>\n ))\n }\n\n return (\n <RadioGroupProvider\n value={\n {\n size,\n variant,\n colorScheme,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n name,\n value,\n onChange,\n } as RadioGroupContext\n }\n >\n <Flex\n ref={ref}\n className={cx(\"ui-radio-group\", className)}\n gap={gap ?? (direction === \"row\" ? \"1rem\" : undefined)}\n {...getContainerProps(\n omitObject(props, [\n \"onChange\",\n \"isInvalid\",\n \"isDisabled\",\n \"isRequired\",\n \"isReadOnly\",\n ]) as DOMAttributes<HTMLElement>,\n )}\n direction={direction}\n >\n {children ?? computedChildren}\n </Flex>\n </RadioGroupProvider>\n )\n },\n) as {\n <Y extends string | number = string>(\n props: RadioGroupProps<Y> & { ref?: Ref<HTMLDivElement> },\n ): JSX.Element\n} & ComponentArgs\n\nRadioGroup.displayName = \"RadioGroup\"\n"],"mappings":"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","names":["import_form_control","import_utils","import_react","props","value","props","import_jsx_runtime","props"]}
1
+ {"version":3,"sources":["../src/radio.tsx","../src/radio-group.tsx"],"sourcesContent":["import type {\n HTMLUIProps,\n ThemeProps,\n ComponentArgs,\n UIPropGetter,\n} from \"@yamada-ui/core\"\nimport { ui, useMultiComponentStyle, omitThemeProps } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport {\n useFormControl,\n useFormControlProps,\n getFormControlProperties,\n} from \"@yamada-ui/form-control\"\nimport { trackFocusVisible } from \"@yamada-ui/use-focus-visible\"\nimport {\n cx,\n useCallbackRef,\n omitObject,\n funcAll,\n handlerAll,\n dataAttr,\n pickObject,\n} from \"@yamada-ui/utils\"\nimport type {\n ForwardedRef,\n Ref,\n ChangeEvent,\n ChangeEventHandler,\n InputHTMLAttributes,\n KeyboardEvent,\n SyntheticEvent,\n} from \"react\"\nimport { forwardRef, useCallback, useEffect, useState } from \"react\"\nimport { useRadioGroupContext } from \"./radio-group\"\n\nexport type UseRadioProps<Y extends string | number = string> =\n FormControlOptions & {\n /**\n * id assigned to input.\n */\n id?: string\n /**\n * The name of the input field in a radio.\n */\n name?: string\n /**\n * The value to be used in the radio button.\n */\n value?: Y\n /**\n * If `true`, the radio will be initially checked.\n *\n * @default false\n */\n defaultIsChecked?: boolean\n /**\n * If `true`, the radio will be checked.\n *\n * @default false\n */\n isChecked?: boolean\n /**\n * The callback invoked when the checked state changes.\n */\n onChange?: ChangeEventHandler<HTMLInputElement>\n }\n\nexport const useRadio = <Y extends string | number = string>(\n props: UseRadioProps<Y>,\n) => {\n const { id, name, value, required, disabled, readOnly, ...rest } =\n useFormControlProps(props)\n const formControlProps = pickObject(\n rest,\n getFormControlProperties({ omit: [\"aria-readonly\"] }),\n )\n\n const [isFocusVisible, setIsFocusVisible] = useState<boolean>(false)\n const [isFocused, setFocused] = useState<boolean>(false)\n const [isHovered, setHovered] = useState<boolean>(false)\n const [isActive, setActive] = useState<boolean>(false)\n\n const [isChecked, setIsChecked] = useState<boolean>(!!props.defaultIsChecked)\n\n const isControlled = props.isChecked !== undefined\n const checked = isControlled ? (props.isChecked as boolean) : isChecked\n\n useEffect(() => {\n return trackFocusVisible(setIsFocusVisible)\n }, [])\n\n const onChange = useCallbackRef(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if (readOnly || disabled) {\n ev.preventDefault()\n\n return\n }\n\n if (!isControlled) setIsChecked(ev.target.checked)\n\n rest.onChange?.(ev)\n },\n [readOnly, disabled, isControlled],\n )\n const onBlur = useCallbackRef(rest.onBlur)\n const onFocus = useCallbackRef(rest.onFocus)\n\n const onKeyDown = useCallback(\n ({ key }: KeyboardEvent<Element>) => {\n if (key === \" \") setActive(true)\n },\n [setActive],\n )\n\n const onKeyUp = useCallback(\n ({ key }: KeyboardEvent<Element>) => {\n if (key === \" \") setActive(false)\n },\n [setActive],\n )\n\n const getContainerProps: UIPropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref,\n \"data-checked\": dataAttr(checked),\n }),\n [checked, formControlProps],\n )\n\n const getIconProps: UIPropGetter<\"span\"> = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref,\n \"data-active\": dataAttr(isActive),\n \"data-hover\": dataAttr(isHovered),\n \"data-checked\": dataAttr(checked),\n \"data-focus\": dataAttr(isFocused),\n \"data-focus-visible\": dataAttr(isFocused && isFocusVisible),\n \"aria-hidden\": true,\n onMouseDown: handlerAll(props.onMouseDown, () => setActive(true)),\n onMouseUp: handlerAll(props.onMouseUp, () => setActive(false)),\n onMouseEnter: handlerAll(props.onMouseEnter, () => setHovered(true)),\n onMouseLeave: handlerAll(props.onMouseLeave, () => setHovered(false)),\n }),\n [checked, isActive, isFocused, isFocusVisible, isHovered, formControlProps],\n )\n\n const getInputProps: UIPropGetter<\"input\"> = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref,\n id,\n type: \"radio\",\n name,\n value,\n required,\n disabled,\n readOnly,\n checked,\n style: {\n border: \"0px\",\n clip: \"rect(0px, 0px, 0px, 0px)\",\n height: \"1px\",\n width: \"1px\",\n margin: \"-1px\",\n padding: \"0px\",\n overflow: \"hidden\",\n whiteSpace: \"nowrap\",\n position: \"absolute\",\n },\n onChange: handlerAll(props.onChange, onChange),\n onBlur: handlerAll(props.onBlur, onBlur, () => setFocused(false)),\n onFocus: handlerAll(props.onFocus, onFocus, () => setFocused(true)),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n onKeyUp: handlerAll(props.onKeyUp, onKeyUp),\n }),\n [\n formControlProps,\n id,\n name,\n value,\n required,\n disabled,\n readOnly,\n checked,\n onChange,\n onBlur,\n onFocus,\n onKeyDown,\n onKeyUp,\n ],\n )\n\n const getLabelProps: UIPropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n props,\n ref,\n onMouseDown: handlerAll(props.onMouseDown, (ev: SyntheticEvent) => {\n ev.preventDefault()\n ev.stopPropagation()\n }),\n onTouchStart: handlerAll(props.onTouchStart, (ev: SyntheticEvent) => {\n ev.preventDefault()\n ev.stopPropagation()\n }),\n \"data-checked\": dataAttr(checked),\n }),\n [checked, formControlProps],\n )\n\n return {\n isFocusVisible,\n isFocused,\n isHovered,\n isActive,\n isChecked: checked,\n getContainerProps,\n getInputProps,\n getIconProps,\n getLabelProps,\n }\n}\n\nexport type UseRadioReturn = ReturnType<typeof useRadio>\n\ntype RadioOptions = {\n iconProps?: HTMLUIProps<\"span\">\n inputProps?: InputHTMLAttributes<HTMLInputElement>\n labelProps?: HTMLUIProps<\"span\">\n}\n\nexport type RadioProps<Y extends string | number = string> = Omit<\n HTMLUIProps<\"label\">,\n keyof UseRadioProps\n> &\n ThemeProps<\"Radio\"> &\n UseRadioProps<Y> &\n RadioOptions\n\n/**\n * `Radio` is a component used for allowing users to select one option from multiple choices.\n *\n * @see Docs https://yamada-ui.com/components/forms/radio\n */\nexport const Radio = forwardRef(\n <Y extends string | number = string>(\n props: RadioProps<Y>,\n ref: ForwardedRef<HTMLInputElement>,\n ) => {\n const group = useRadioGroupContext()\n const control = useFormControl(props)\n const [styles, mergedProps] = useMultiComponentStyle(\"Radio\", {\n ...group,\n ...props,\n })\n const {\n className,\n gap = \"0.5rem\",\n isRequired = group?.isRequired ?? control.isRequired,\n isReadOnly = group?.isReadOnly ?? control.isReadOnly,\n isDisabled = group?.isDisabled ?? control.isDisabled,\n isInvalid = group?.isInvalid ?? control.isInvalid,\n iconProps,\n inputProps,\n labelProps,\n children,\n ...rest\n } = omitThemeProps(mergedProps)\n\n const { getContainerProps, getInputProps, getIconProps, getLabelProps } =\n useRadio({\n ...rest,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n isChecked:\n group?.value && rest.value\n ? group.value === rest.value\n : rest.isChecked,\n onChange:\n group?.onChange && rest.value\n ? funcAll(group.onChange, rest.onChange)\n : rest.onChange,\n })\n\n return (\n <ui.label\n className={cx(\"ui-radio\", className)}\n {...getContainerProps()}\n {...omitObject(rest, [\n \"id\",\n \"name\",\n \"value\",\n \"defaultValue\",\n \"defaultIsChecked\",\n \"isChecked\",\n \"onChange\",\n \"onBlur\",\n \"onFocus\",\n ])}\n __css={{\n cursor: \"pointer\",\n position: \"relative\",\n display: \"inline-flex\",\n alignItems: \"center\",\n verticalAlign: \"top\",\n gap,\n ...styles.container,\n }}\n >\n <ui.input\n className=\"ui-radio__input\"\n {...getInputProps(inputProps, ref)}\n />\n\n <ui.span\n className=\"ui-radio__icon\"\n {...getIconProps(iconProps)}\n __css={{\n position: \"relative\",\n display: \"inline-block\",\n userSelect: \"none\",\n ...styles.icon,\n }}\n />\n\n <ui.span\n className=\"ui-radio__label\"\n {...getLabelProps(labelProps)}\n __css={{ ...styles.label }}\n >\n {children}\n </ui.span>\n </ui.label>\n )\n },\n) as {\n <Y extends string | number = string>(\n props: RadioProps<Y> & { ref?: Ref<HTMLInputElement> },\n ): JSX.Element\n} & ComponentArgs\n\nRadio.displayName = \"Radio\"\n","import type { ComponentArgs, ThemeProps, UIPropGetter } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport { useFormControl } from \"@yamada-ui/form-control\"\nimport type { FlexProps } from \"@yamada-ui/layouts\"\nimport { Flex } from \"@yamada-ui/layouts\"\nimport { useControllableState } from \"@yamada-ui/use-controllable-state\"\nimport type { DOMAttributes, PropGetter } from \"@yamada-ui/utils\"\nimport {\n createContext,\n cx,\n isObject,\n mergeRefs,\n useCallbackRef,\n omitObject,\n getValidChildren,\n} from \"@yamada-ui/utils\"\nimport type { ChangeEvent, ForwardedRef, Ref, ReactElement } from \"react\"\nimport { useCallback, useId, useRef, forwardRef } from \"react\"\nimport type { RadioProps } from \"./radio\"\nimport { Radio } from \"./radio\"\n\nexport type RadioItem<Y extends string | number = string> = RadioProps<Y> & {\n label?: string\n}\n\nconst isEvent = (value: any): value is { target: HTMLInputElement } =>\n value && isObject(value) && isObject(value.target)\n\nexport type UseRadioGroupProps<Y extends string | number = string> = {\n /**\n * The top-level id string that will be applied to the radios.\n * The index of the radio will be appended to this top-level id.\n */\n id?: string\n /**\n * The HTML `name` attribute used for forms.\n */\n name?: string\n /**\n * The value of the radio group.\n */\n value?: Y\n /**\n * The initial value of the radio group.\n */\n defaultValue?: Y\n /**\n * The callback fired when any children radio is checked or unchecked.\n */\n onChange?: (value: Y) => void\n /**\n * If `true`, input elements will receive `checked` attribute instead of `isChecked`.\n *\n * This assumes, you're using native radio inputs.\n *\n * @default false\n */\n isNative?: boolean\n}\n\nexport const useRadioGroup = <Y extends string | number = string>({\n id,\n name,\n isNative,\n ...props\n}: UseRadioGroupProps<Y>) => {\n id ??= useId()\n name ??= `radio-${id}`\n\n props.onChange = useCallbackRef(props.onChange)\n\n const [value, setValue] = useControllableState({\n value: props.value,\n defaultValue: props.defaultValue,\n onChange: props.onChange,\n })\n\n const containerRef = useRef<any>(null)\n\n const onFocus = useCallback(() => {\n const container = containerRef.current\n\n if (!container) return\n\n let query = `input:not(:disabled):checked`\n\n let firstInput = container.querySelector(query) as HTMLElement | undefined\n\n if (firstInput) {\n firstInput.focus()\n } else {\n query = `input:not(:disabled)`\n firstInput = container.querySelector(query) as HTMLElement | undefined\n\n firstInput?.focus()\n }\n }, [])\n\n const onChange = useCallback(\n (evOrValue: ChangeEvent<HTMLInputElement> | Y) => {\n const nextValue = (\n isEvent(evOrValue) ? evOrValue.target.value : evOrValue\n ) as Y\n\n setValue(nextValue)\n },\n [setValue],\n )\n\n const getContainerProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...props,\n ref: mergeRefs(ref, containerRef),\n role: \"group\",\n }),\n [],\n )\n\n const getRadioProps: UIPropGetter<\"input\", { value?: Y }, { value?: Y }> =\n useCallback(\n (props = {}, ref = null) => ({\n ...props,\n ref,\n name,\n [isNative ? \"checked\" : \"isChecked\"]:\n value != null ? props.value === value : undefined,\n onChange,\n }),\n [name, value, onChange, isNative],\n )\n\n return {\n name,\n value,\n setValue,\n onChange,\n onFocus,\n getContainerProps,\n getRadioProps,\n }\n}\n\nexport type UseRadioGroupReturn<Y extends string | number = string> =\n ReturnType<typeof useRadioGroup<Y>>\n\nexport type RadioGroupProps<Y extends string | number = string> =\n ThemeProps<\"Radio\"> &\n Omit<FlexProps, \"onChange\"> &\n UseRadioGroupProps<Y> &\n FormControlOptions & {\n /**\n * If provided, generate radios based on items.\n *\n * @default '[]'\n */\n items?: RadioItem<Y>[]\n }\n\ntype RadioGroupContext = ThemeProps<\"Radio\"> &\n FormControlOptions & {\n name: string\n value: string | number\n onChange: (\n evOrValue: ChangeEvent<HTMLInputElement> | string | number,\n ) => void\n }\n\nconst [RadioGroupProvider, useRadioGroupContext] = createContext<\n RadioGroupContext | undefined\n>({\n strict: false,\n name: \"RadioGroupContext\",\n})\n\nexport { useRadioGroupContext }\n\nexport const RadioGroup = forwardRef(\n <Y extends string | number = string>(\n {\n className,\n size,\n variant,\n colorScheme,\n children,\n items = [],\n direction = \"column\",\n gap,\n ...props\n }: RadioGroupProps<Y>,\n ref: ForwardedRef<HTMLDivElement>,\n ) => {\n const { name, value, onChange, getContainerProps } = useRadioGroup(props)\n const { isRequired, isReadOnly, isDisabled, isInvalid } =\n useFormControl(props)\n\n const validChildren = getValidChildren(children)\n let computedChildren: ReactElement[] = []\n\n if (!validChildren.length && items.length) {\n computedChildren = items.map(({ label, value, ...props }, i) => (\n <Radio key={i} value={value} {...props}>\n {label}\n </Radio>\n ))\n }\n\n return (\n <RadioGroupProvider\n value={\n {\n size,\n variant,\n colorScheme,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n name,\n value,\n onChange,\n } as RadioGroupContext\n }\n >\n <Flex\n ref={ref}\n className={cx(\"ui-radio-group\", className)}\n gap={gap ?? (direction === \"row\" ? \"1rem\" : undefined)}\n {...getContainerProps(\n omitObject(props, [\n \"onChange\",\n \"isInvalid\",\n \"isDisabled\",\n \"isRequired\",\n \"isReadOnly\",\n ]) as DOMAttributes<HTMLElement>,\n )}\n direction={direction}\n >\n {children ?? computedChildren}\n </Flex>\n </RadioGroupProvider>\n )\n },\n) as {\n <Y extends string | number = string>(\n props: RadioGroupProps<Y> & { ref?: Ref<HTMLDivElement> },\n ): JSX.Element\n} & ComponentArgs\n\nRadioGroup.displayName = \"RadioGroup\"\n"],"mappings":"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","names":["import_form_control","import_utils","import_react","props","value","props","import_jsx_runtime","props"]}
package/dist/radio.mjs CHANGED
@@ -2,7 +2,7 @@
2
2
  import {
3
3
  Radio,
4
4
  useRadio
5
- } from "./chunk-RKB6MN6N.mjs";
5
+ } from "./chunk-CWVCOFAA.mjs";
6
6
  export {
7
7
  Radio,
8
8
  useRadio
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@yamada-ui/radio",
3
- "version": "1.0.5",
3
+ "version": "1.0.6-dev-20240104230031",
4
4
  "description": "Yamada UI radio component",
5
5
  "keywords": [
6
6
  "yamada",
@@ -38,7 +38,7 @@
38
38
  "dependencies": {
39
39
  "@yamada-ui/core": "1.1.3",
40
40
  "@yamada-ui/utils": "1.0.1",
41
- "@yamada-ui/form-control": "1.0.5",
41
+ "@yamada-ui/form-control": "1.0.6-dev-20240104230031",
42
42
  "@yamada-ui/layouts": "1.1.1",
43
43
  "@yamada-ui/use-controllable-state": "1.0.1",
44
44
  "@yamada-ui/use-focus-visible": "1.0.1"
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/radio-group.tsx","../src/radio.tsx"],"sourcesContent":["import type { ComponentArgs, ThemeProps, UIPropGetter } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport { useFormControl } from \"@yamada-ui/form-control\"\nimport type { FlexProps } from \"@yamada-ui/layouts\"\nimport { Flex } from \"@yamada-ui/layouts\"\nimport { useControllableState } from \"@yamada-ui/use-controllable-state\"\nimport type { DOMAttributes, PropGetter } from \"@yamada-ui/utils\"\nimport {\n createContext,\n cx,\n isObject,\n mergeRefs,\n useCallbackRef,\n omitObject,\n getValidChildren,\n} from \"@yamada-ui/utils\"\nimport type { ChangeEvent, ForwardedRef, Ref, ReactElement } from \"react\"\nimport { useCallback, useId, useRef, forwardRef } from \"react\"\nimport type { RadioProps } from \"./radio\"\nimport { Radio } from \"./radio\"\n\nexport type RadioItem<Y extends string | number = string> = RadioProps<Y> & {\n label?: string\n}\n\nconst isEvent = (value: any): value is { target: HTMLInputElement } =>\n value && isObject(value) && isObject(value.target)\n\nexport type UseRadioGroupProps<Y extends string | number = string> = {\n /**\n * The top-level id string that will be applied to the radios.\n * The index of the radio will be appended to this top-level id.\n */\n id?: string\n /**\n * The HTML `name` attribute used for forms.\n */\n name?: string\n /**\n * The value of the radio group.\n */\n value?: Y\n /**\n * The initial value of the radio group.\n */\n defaultValue?: Y\n /**\n * The callback fired when any children radio is checked or unchecked.\n */\n onChange?: (value: Y) => void\n /**\n * If `true`, input elements will receive `checked` attribute instead of `isChecked`.\n *\n * This assumes, you're using native radio inputs.\n *\n * @default false\n */\n isNative?: boolean\n}\n\nexport const useRadioGroup = <Y extends string | number = string>({\n id,\n name,\n isNative,\n ...props\n}: UseRadioGroupProps<Y>) => {\n id ??= useId()\n name ??= `radio-${id}`\n\n props.onChange = useCallbackRef(props.onChange)\n\n const [value, setValue] = useControllableState({\n value: props.value,\n defaultValue: props.defaultValue,\n onChange: props.onChange,\n })\n\n const containerRef = useRef<any>(null)\n\n const onFocus = useCallback(() => {\n const container = containerRef.current\n\n if (!container) return\n\n let query = `input:not(:disabled):checked`\n\n let firstInput = container.querySelector(query) as HTMLElement | undefined\n\n if (firstInput) {\n firstInput.focus()\n } else {\n query = `input:not(:disabled)`\n firstInput = container.querySelector(query) as HTMLElement | undefined\n\n firstInput?.focus()\n }\n }, [])\n\n const onChange = useCallback(\n (evOrValue: ChangeEvent<HTMLInputElement> | Y) => {\n const nextValue = (\n isEvent(evOrValue) ? evOrValue.target.value : evOrValue\n ) as Y\n\n setValue(nextValue)\n },\n [setValue],\n )\n\n const getContainerProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...props,\n ref: mergeRefs(ref, containerRef),\n role: \"group\",\n }),\n [],\n )\n\n const getRadioProps: UIPropGetter<\"input\", { value?: Y }, { value?: Y }> =\n useCallback(\n (props = {}, ref = null) => ({\n ...props,\n ref,\n name,\n [isNative ? \"checked\" : \"isChecked\"]:\n value != null ? props.value === value : undefined,\n onChange,\n }),\n [name, value, onChange, isNative],\n )\n\n return {\n name,\n value,\n setValue,\n onChange,\n onFocus,\n getContainerProps,\n getRadioProps,\n }\n}\n\nexport type UseRadioGroupReturn<Y extends string | number = string> =\n ReturnType<typeof useRadioGroup<Y>>\n\nexport type RadioGroupProps<Y extends string | number = string> =\n ThemeProps<\"Radio\"> &\n Omit<FlexProps, \"onChange\"> &\n UseRadioGroupProps<Y> &\n FormControlOptions & {\n /**\n * If provided, generate radios based on items.\n *\n * @default '[]'\n */\n items?: RadioItem<Y>[]\n }\n\ntype RadioGroupContext = ThemeProps<\"Radio\"> &\n FormControlOptions & {\n name: string\n value: string | number\n onChange: (\n evOrValue: ChangeEvent<HTMLInputElement> | string | number,\n ) => void\n }\n\nconst [RadioGroupProvider, useRadioGroupContext] = createContext<\n RadioGroupContext | undefined\n>({\n strict: false,\n name: \"RadioGroupContext\",\n})\n\nexport { useRadioGroupContext }\n\nexport const RadioGroup = forwardRef(\n <Y extends string | number = string>(\n {\n className,\n size,\n variant,\n colorScheme,\n children,\n items = [],\n direction = \"column\",\n gap,\n ...props\n }: RadioGroupProps<Y>,\n ref: ForwardedRef<HTMLDivElement>,\n ) => {\n const { name, value, onChange, getContainerProps } = useRadioGroup(props)\n const { isRequired, isReadOnly, isDisabled, isInvalid } =\n useFormControl(props)\n\n const validChildren = getValidChildren(children)\n let computedChildren: ReactElement[] = []\n\n if (!validChildren.length && items.length) {\n computedChildren = items.map(({ label, value, ...props }, i) => (\n <Radio key={i} value={value} {...props}>\n {label}\n </Radio>\n ))\n }\n\n return (\n <RadioGroupProvider\n value={\n {\n size,\n variant,\n colorScheme,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n name,\n value,\n onChange,\n } as RadioGroupContext\n }\n >\n <Flex\n ref={ref}\n className={cx(\"ui-radio-group\", className)}\n gap={gap ?? (direction === \"row\" ? \"1rem\" : undefined)}\n {...getContainerProps(\n omitObject(props, [\n \"onChange\",\n \"isInvalid\",\n \"isDisabled\",\n \"isRequired\",\n \"isReadOnly\",\n ]) as DOMAttributes<HTMLElement>,\n )}\n direction={direction}\n >\n {children ?? computedChildren}\n </Flex>\n </RadioGroupProvider>\n )\n },\n) as {\n <Y extends string | number = string>(\n props: RadioGroupProps<Y> & { ref?: Ref<HTMLDivElement> },\n ): JSX.Element\n} & ComponentArgs\n\nRadioGroup.displayName = \"RadioGroup\"\n","import type {\n HTMLUIProps,\n ThemeProps,\n ComponentArgs,\n UIPropGetter,\n} from \"@yamada-ui/core\"\nimport { ui, useMultiComponentStyle, omitThemeProps } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport {\n useFormControl,\n useFormControlProps,\n formControlProperties,\n} from \"@yamada-ui/form-control\"\nimport { trackFocusVisible } from \"@yamada-ui/use-focus-visible\"\nimport {\n cx,\n useCallbackRef,\n omitObject,\n funcAll,\n handlerAll,\n dataAttr,\n pickObject,\n} from \"@yamada-ui/utils\"\nimport type {\n ForwardedRef,\n Ref,\n ChangeEvent,\n ChangeEventHandler,\n InputHTMLAttributes,\n KeyboardEvent,\n SyntheticEvent,\n} from \"react\"\nimport { forwardRef, useCallback, useEffect, useState } from \"react\"\nimport { useRadioGroupContext } from \"./radio-group\"\n\nexport type UseRadioProps<Y extends string | number = string> =\n FormControlOptions & {\n /**\n * id assigned to input.\n */\n id?: string\n /**\n * The name of the input field in a radio.\n */\n name?: string\n /**\n * The value to be used in the radio button.\n */\n value?: Y\n /**\n * If `true`, the radio will be initially checked.\n *\n * @default false\n */\n defaultIsChecked?: boolean\n /**\n * If `true`, the radio will be checked.\n *\n * @default false\n */\n isChecked?: boolean\n /**\n * The callback invoked when the checked state changes.\n */\n onChange?: ChangeEventHandler<HTMLInputElement>\n }\n\nexport const useRadio = <Y extends string | number = string>(\n props: UseRadioProps<Y>,\n) => {\n const { id, name, value, required, disabled, readOnly, ...rest } =\n useFormControlProps(props)\n\n const [isFocusVisible, setIsFocusVisible] = useState<boolean>(false)\n const [isFocused, setFocused] = useState<boolean>(false)\n const [isHovered, setHovered] = useState<boolean>(false)\n const [isActive, setActive] = useState<boolean>(false)\n\n const [isChecked, setIsChecked] = useState<boolean>(!!props.defaultIsChecked)\n\n const isControlled = props.isChecked !== undefined\n const checked = isControlled ? (props.isChecked as boolean) : isChecked\n\n useEffect(() => {\n return trackFocusVisible(setIsFocusVisible)\n }, [])\n\n const onChange = useCallbackRef(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if (readOnly || disabled) {\n ev.preventDefault()\n\n return\n }\n\n if (!isControlled) setIsChecked(ev.target.checked)\n\n rest.onChange?.(ev)\n },\n [readOnly, disabled, isControlled],\n )\n const onBlur = useCallbackRef(rest.onBlur)\n const onFocus = useCallbackRef(rest.onFocus)\n\n const onKeyDown = useCallback(\n ({ key }: KeyboardEvent<Element>) => {\n if (key === \" \") setActive(true)\n },\n [setActive],\n )\n\n const onKeyUp = useCallback(\n ({ key }: KeyboardEvent<Element>) => {\n if (key === \" \") setActive(false)\n },\n [setActive],\n )\n\n const getContainerProps: UIPropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n ...props,\n ref,\n \"data-checked\": dataAttr(checked),\n }),\n [checked, rest],\n )\n\n const getIconProps: UIPropGetter<\"span\"> = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n ...props,\n ref,\n \"data-active\": dataAttr(isActive),\n \"data-hover\": dataAttr(isHovered),\n \"data-checked\": dataAttr(checked),\n \"data-focus\": dataAttr(isFocused),\n \"data-focus-visible\": dataAttr(isFocused && isFocusVisible),\n \"aria-hidden\": true,\n onMouseDown: handlerAll(props.onMouseDown, () => setActive(true)),\n onMouseUp: handlerAll(props.onMouseUp, () => setActive(false)),\n onMouseEnter: handlerAll(props.onMouseEnter, () => setHovered(true)),\n onMouseLeave: handlerAll(props.onMouseLeave, () => setHovered(false)),\n }),\n [checked, isActive, isFocused, isFocusVisible, isHovered, rest],\n )\n\n const getInputProps: UIPropGetter<\"input\"> = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n ...props,\n ref,\n id,\n type: \"radio\",\n name,\n value,\n required,\n disabled,\n readOnly,\n checked,\n style: {\n border: \"0px\",\n clip: \"rect(0px, 0px, 0px, 0px)\",\n height: \"1px\",\n width: \"1px\",\n margin: \"-1px\",\n padding: \"0px\",\n overflow: \"hidden\",\n whiteSpace: \"nowrap\",\n position: \"absolute\",\n },\n onChange: handlerAll(props.onChange, onChange),\n onBlur: handlerAll(props.onBlur, onBlur, () => setFocused(false)),\n onFocus: handlerAll(props.onFocus, onFocus, () => setFocused(true)),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n onKeyUp: handlerAll(props.onKeyUp, onKeyUp),\n }),\n [\n rest,\n id,\n name,\n value,\n required,\n disabled,\n readOnly,\n checked,\n onChange,\n onBlur,\n onFocus,\n onKeyDown,\n onKeyUp,\n ],\n )\n\n const getLabelProps: UIPropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...pickObject(rest, formControlProperties),\n props,\n ref,\n onMouseDown: handlerAll(props.onMouseDown, (ev: SyntheticEvent) => {\n ev.preventDefault()\n ev.stopPropagation()\n }),\n onTouchStart: handlerAll(props.onTouchStart, (ev: SyntheticEvent) => {\n ev.preventDefault()\n ev.stopPropagation()\n }),\n \"data-checked\": dataAttr(checked),\n }),\n [checked, rest],\n )\n\n return {\n isFocusVisible,\n isFocused,\n isHovered,\n isActive,\n isChecked: checked,\n getContainerProps,\n getInputProps,\n getIconProps,\n getLabelProps,\n }\n}\n\nexport type UseRadioReturn = ReturnType<typeof useRadio>\n\ntype RadioOptions = {\n iconProps?: HTMLUIProps<\"span\">\n inputProps?: InputHTMLAttributes<HTMLInputElement>\n labelProps?: HTMLUIProps<\"span\">\n}\n\nexport type RadioProps<Y extends string | number = string> = Omit<\n HTMLUIProps<\"label\">,\n keyof UseRadioProps\n> &\n ThemeProps<\"Radio\"> &\n UseRadioProps<Y> &\n RadioOptions\n\n/**\n * `Radio` is a component used for allowing users to select one option from multiple choices.\n *\n * @see Docs https://yamada-ui.com/components/forms/radio\n */\nexport const Radio = forwardRef(\n <Y extends string | number = string>(\n props: RadioProps<Y>,\n ref: ForwardedRef<HTMLInputElement>,\n ) => {\n const group = useRadioGroupContext()\n const control = useFormControl(props)\n const [styles, mergedProps] = useMultiComponentStyle(\"Radio\", {\n ...group,\n ...props,\n })\n const {\n className,\n gap = \"0.5rem\",\n isRequired = group?.isRequired ?? control.isRequired,\n isReadOnly = group?.isReadOnly ?? control.isReadOnly,\n isDisabled = group?.isDisabled ?? control.isDisabled,\n isInvalid = group?.isInvalid ?? control.isInvalid,\n iconProps,\n inputProps,\n labelProps,\n children,\n ...rest\n } = omitThemeProps(mergedProps)\n\n const { getContainerProps, getInputProps, getIconProps, getLabelProps } =\n useRadio({\n ...rest,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n isChecked:\n group?.value && rest.value\n ? group.value === rest.value\n : rest.isChecked,\n onChange:\n group?.onChange && rest.value\n ? funcAll(group.onChange, rest.onChange)\n : rest.onChange,\n })\n\n return (\n <ui.label\n className={cx(\"ui-radio\", className)}\n {...getContainerProps()}\n {...omitObject(rest, [\n \"id\",\n \"name\",\n \"value\",\n \"defaultValue\",\n \"defaultIsChecked\",\n \"isChecked\",\n \"onChange\",\n \"onBlur\",\n \"onFocus\",\n ])}\n __css={{\n cursor: \"pointer\",\n position: \"relative\",\n display: \"inline-flex\",\n alignItems: \"center\",\n verticalAlign: \"top\",\n gap,\n ...styles.container,\n }}\n >\n <ui.input\n className=\"ui-radio__input\"\n {...getInputProps(inputProps, ref)}\n />\n\n <ui.span\n className=\"ui-radio__icon\"\n {...getIconProps(iconProps)}\n __css={{\n position: \"relative\",\n display: \"inline-block\",\n userSelect: \"none\",\n ...styles.icon,\n }}\n />\n\n <ui.span\n className=\"ui-radio__label\"\n {...getLabelProps(labelProps)}\n __css={{ ...styles.label }}\n >\n {children}\n </ui.span>\n </ui.label>\n )\n },\n) as {\n <Y extends string | number = string>(\n props: RadioProps<Y> & { ref?: Ref<HTMLInputElement> },\n ): JSX.Element\n} & ComponentArgs\n\nRadio.displayName = \"Radio\"\n"],"mappings":"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","names":["useFormControl","cx","useCallbackRef","omitObject","useCallback","forwardRef","props","jsx","useCallbackRef","useCallback","props","forwardRef","useFormControl","value","props","jsx","cx","omitObject"]}