@yamada-ui/radio 1.1.0-dev-20240611165242 → 2.0.0-next-20240609100940
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/{chunk-FFTY4IHZ.mjs → chunk-LTFK3PSZ.mjs} +2 -11
- package/dist/chunk-LTFK3PSZ.mjs.map +1 -0
- package/dist/index.js +1 -10
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +1 -1
- package/dist/radio-group.js +1 -10
- package/dist/radio-group.js.map +1 -1
- package/dist/radio-group.mjs +1 -1
- package/dist/radio.js +1 -10
- package/dist/radio.js.map +1 -1
- package/dist/radio.mjs +1 -1
- package/package.json +7 -7
- package/dist/chunk-FFTY4IHZ.mjs.map +0 -1
@@ -130,7 +130,6 @@ var useRadio = ({
|
|
130
130
|
disabled,
|
131
131
|
readOnly,
|
132
132
|
checked,
|
133
|
-
"aria-checked": checked,
|
134
133
|
style: {
|
135
134
|
border: "0px",
|
136
135
|
clip: "rect(0px, 0px, 0px, 0px)",
|
@@ -241,11 +240,6 @@ var Radio = forwardRef(
|
|
241
240
|
...getContainerProps(),
|
242
241
|
...rest,
|
243
242
|
__css: {
|
244
|
-
cursor: "pointer",
|
245
|
-
position: "relative",
|
246
|
-
display: "inline-flex",
|
247
|
-
alignItems: "center",
|
248
|
-
verticalAlign: "top",
|
249
243
|
gap,
|
250
244
|
...styles.container
|
251
245
|
},
|
@@ -263,9 +257,6 @@ var Radio = forwardRef(
|
|
263
257
|
className: "ui-radio__icon",
|
264
258
|
...getIconProps(iconProps),
|
265
259
|
__css: {
|
266
|
-
position: "relative",
|
267
|
-
display: "inline-block",
|
268
|
-
userSelect: "none",
|
269
260
|
...styles.icon
|
270
261
|
}
|
271
262
|
}
|
@@ -332,7 +323,7 @@ var useRadioGroup = ({
|
|
332
323
|
(props2 = {}, ref = null) => ({
|
333
324
|
...props2,
|
334
325
|
ref: mergeRefs(ref, containerRef),
|
335
|
-
role: "
|
326
|
+
role: "group"
|
336
327
|
}),
|
337
328
|
[]
|
338
329
|
);
|
@@ -434,4 +425,4 @@ export {
|
|
434
425
|
useRadio,
|
435
426
|
Radio
|
436
427
|
};
|
437
|
-
//# sourceMappingURL=chunk-
|
428
|
+
//# sourceMappingURL=chunk-LTFK3PSZ.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, Dict, PropGetter } from \"@yamada-ui/utils\"\nimport {\n createContext,\n cx,\n isObject,\n mergeRefs,\n useCallbackRef,\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 = <\n Y extends string | number = string,\n M extends Dict = Dict,\n>({\n id,\n name,\n isNative,\n value: valueProp,\n defaultValue,\n onChange: onChangeProp,\n ...props\n}: UseRadioGroupProps<Y> & M) => {\n id ??= useId()\n name ??= `radio-${id}`\n\n const onChangeRef = useCallbackRef(onChangeProp)\n\n const [value, setValue] = useControllableState({\n value: valueProp,\n defaultValue,\n onChange: onChangeRef,\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 props,\n id,\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 {\n id,\n name,\n value,\n onChange,\n getContainerProps,\n props: computedProps,\n } = useRadioGroup(props)\n const { isRequired, isReadOnly, isDisabled, isInvalid, ...rest } =\n useFormControl({\n id,\n ...computedProps,\n })\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 ...rest,\n id,\n name,\n } as DOMAttributes<HTMLElement>)}\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 type { Dict, PropGetter } from \"@yamada-ui/utils\"\nimport {\n cx,\n useCallbackRef,\n funcAll,\n handlerAll,\n dataAttr,\n splitObject,\n} from \"@yamada-ui/utils\"\nimport type {\n ForwardedRef,\n Ref,\n ChangeEvent,\n ChangeEventHandler,\n InputHTMLAttributes,\n KeyboardEvent,\n SyntheticEvent,\n DOMAttributes,\n} from \"react\"\nimport { forwardRef, useCallback, useEffect, useId, 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 = <\n Y extends string | number = string,\n M extends Dict = Dict,\n>({\n id,\n ...props\n}: UseRadioProps<Y> & M) => {\n id ??= useId()\n const {\n id: _id,\n name,\n value,\n isChecked: isCheckedProp,\n defaultIsChecked,\n required,\n disabled,\n readOnly,\n onChange: onChangeProp,\n onFocus: onFocusProp,\n onBlur: onBlurProp,\n ...computedProps\n } = useFormControlProps({ id, ...props })\n const [{ \"aria-readonly\": _ariaReadonly, ...formControlProps }, rest] =\n splitObject(computedProps, formControlProperties)\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>(!!defaultIsChecked)\n\n const isControlled = isCheckedProp !== undefined\n const checked = isControlled ? (isCheckedProp 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 onChangeProp?.(ev)\n },\n [readOnly, disabled, isControlled],\n )\n const onFocus = useCallbackRef(onFocusProp)\n const onBlur = useCallbackRef(onBlurProp)\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: PropGetter = 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: PropGetter = 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 props: rest,\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 { value: groupValue, ...groupProps } = { ...group }\n const control = useFormControl(props)\n const [styles, mergedProps] = useMultiComponentStyle(\"Radio\", {\n ...groupProps,\n ...props,\n })\n const {\n className,\n gap = \"0.5rem\",\n isRequired = groupProps.isRequired ?? control.isRequired,\n isReadOnly = groupProps.isReadOnly ?? control.isReadOnly,\n isDisabled = groupProps.isDisabled ?? control.isDisabled,\n isInvalid = groupProps.isInvalid ?? control.isInvalid,\n iconProps,\n inputProps,\n labelProps,\n children,\n ...computedProps\n } = omitThemeProps(mergedProps)\n\n const isChecked =\n groupValue && computedProps.value\n ? groupValue === computedProps.value\n : computedProps.isChecked\n\n const onChange =\n groupProps.onChange && computedProps.value\n ? funcAll(groupProps.onChange, computedProps.onChange)\n : computedProps.onChange\n\n const {\n getContainerProps,\n getInputProps,\n getIconProps,\n getLabelProps,\n props: rest,\n } = useRadio({\n ...computedProps,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n isChecked,\n onChange,\n })\n\n return (\n <ui.label\n className={cx(\"ui-radio\", className)}\n {...getContainerProps()}\n {...rest}\n __css={{\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 ...styles.icon,\n }}\n />\n\n <ui.span\n className=\"ui-radio__label\"\n {...getLabelProps(labelProps as DOMAttributes<HTMLElement>)}\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","useCallback","useId","forwardRef","props","jsx","useId","useCallbackRef","useCallback","props","forwardRef","useFormControl","value","props","jsx","cx"]}
|
package/dist/index.js
CHANGED
@@ -86,7 +86,7 @@ var useRadioGroup = ({
|
|
86
86
|
(props2 = {}, ref = null) => ({
|
87
87
|
...props2,
|
88
88
|
ref: (0, import_utils.mergeRefs)(ref, containerRef),
|
89
|
-
role: "
|
89
|
+
role: "group"
|
90
90
|
}),
|
91
91
|
[]
|
92
92
|
);
|
@@ -281,7 +281,6 @@ var useRadio = ({
|
|
281
281
|
disabled,
|
282
282
|
readOnly,
|
283
283
|
checked,
|
284
|
-
"aria-checked": checked,
|
285
284
|
style: {
|
286
285
|
border: "0px",
|
287
286
|
clip: "rect(0px, 0px, 0px, 0px)",
|
@@ -392,11 +391,6 @@ var Radio = (0, import_react2.forwardRef)(
|
|
392
391
|
...getContainerProps(),
|
393
392
|
...rest,
|
394
393
|
__css: {
|
395
|
-
cursor: "pointer",
|
396
|
-
position: "relative",
|
397
|
-
display: "inline-flex",
|
398
|
-
alignItems: "center",
|
399
|
-
verticalAlign: "top",
|
400
394
|
gap,
|
401
395
|
...styles.container
|
402
396
|
},
|
@@ -414,9 +408,6 @@ var Radio = (0, import_react2.forwardRef)(
|
|
414
408
|
className: "ui-radio__icon",
|
415
409
|
...getIconProps(iconProps),
|
416
410
|
__css: {
|
417
|
-
position: "relative",
|
418
|
-
display: "inline-block",
|
419
|
-
userSelect: "none",
|
420
411
|
...styles.icon
|
421
412
|
}
|
422
413
|
}
|
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 type { Dict, PropGetter } from \"@yamada-ui/utils\"\nimport {\n cx,\n useCallbackRef,\n funcAll,\n handlerAll,\n dataAttr,\n splitObject,\n} from \"@yamada-ui/utils\"\nimport type {\n ForwardedRef,\n Ref,\n ChangeEvent,\n ChangeEventHandler,\n InputHTMLAttributes,\n KeyboardEvent,\n SyntheticEvent,\n DOMAttributes,\n} from \"react\"\nimport { forwardRef, useCallback, useEffect, useId, 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 = <\n Y extends string | number = string,\n M extends Dict = Dict,\n>({\n id,\n ...props\n}: UseRadioProps<Y> & M) => {\n id ??= useId()\n const {\n id: _id,\n name,\n value,\n isChecked: isCheckedProp,\n defaultIsChecked,\n required,\n disabled,\n readOnly,\n onChange: onChangeProp,\n onFocus: onFocusProp,\n onBlur: onBlurProp,\n ...computedProps\n } = useFormControlProps({ id, ...props })\n const [{ \"aria-readonly\": _ariaReadonly, ...formControlProps }, rest] =\n splitObject(computedProps, formControlProperties)\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>(!!defaultIsChecked)\n\n const isControlled = isCheckedProp !== undefined\n const checked = isControlled ? (isCheckedProp 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 onChangeProp?.(ev)\n },\n [readOnly, disabled, isControlled],\n )\n const onFocus = useCallbackRef(onFocusProp)\n const onBlur = useCallbackRef(onBlurProp)\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: PropGetter = 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 \"aria-checked\": 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: PropGetter = 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 props: rest,\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 { value: groupValue, ...groupProps } = { ...group }\n const control = useFormControl(props)\n const [styles, mergedProps] = useMultiComponentStyle(\"Radio\", {\n ...groupProps,\n ...props,\n })\n const {\n className,\n gap = \"0.5rem\",\n isRequired = groupProps.isRequired ?? control.isRequired,\n isReadOnly = groupProps.isReadOnly ?? control.isReadOnly,\n isDisabled = groupProps.isDisabled ?? control.isDisabled,\n isInvalid = groupProps.isInvalid ?? control.isInvalid,\n iconProps,\n inputProps,\n labelProps,\n children,\n ...computedProps\n } = omitThemeProps(mergedProps)\n\n const isChecked =\n groupValue && computedProps.value\n ? groupValue === computedProps.value\n : computedProps.isChecked\n\n const onChange =\n groupProps.onChange && computedProps.value\n ? funcAll(groupProps.onChange, computedProps.onChange)\n : computedProps.onChange\n\n const {\n getContainerProps,\n getInputProps,\n getIconProps,\n getLabelProps,\n props: rest,\n } = useRadio({\n ...computedProps,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n isChecked,\n onChange,\n })\n\n return (\n <ui.label\n className={cx(\"ui-radio\", className)}\n {...getContainerProps()}\n {...rest}\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 as DOMAttributes<HTMLElement>)}\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, Dict, PropGetter } from \"@yamada-ui/utils\"\nimport {\n createContext,\n cx,\n isObject,\n mergeRefs,\n useCallbackRef,\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 = <\n Y extends string | number = string,\n M extends Dict = Dict,\n>({\n id,\n name,\n isNative,\n value: valueProp,\n defaultValue,\n onChange: onChangeProp,\n ...props\n}: UseRadioGroupProps<Y> & M) => {\n id ??= useId()\n name ??= `radio-${id}`\n\n const onChangeRef = useCallbackRef(onChangeProp)\n\n const [value, setValue] = useControllableState({\n value: valueProp,\n defaultValue,\n onChange: onChangeRef,\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: \"radiogroup\",\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 props,\n id,\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 {\n id,\n name,\n value,\n onChange,\n getContainerProps,\n props: computedProps,\n } = useRadioGroup(props)\n const { isRequired, isReadOnly, isDisabled, isInvalid, ...rest } =\n useFormControl({\n id,\n ...computedProps,\n })\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 ...rest,\n id,\n name,\n } as DOMAttributes<HTMLElement>)}\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 formControlProperties,\n} from \"@yamada-ui/form-control\"\nimport { trackFocusVisible } from \"@yamada-ui/use-focus-visible\"\nimport type { Dict, PropGetter } from \"@yamada-ui/utils\"\nimport {\n cx,\n useCallbackRef,\n funcAll,\n handlerAll,\n dataAttr,\n splitObject,\n} from \"@yamada-ui/utils\"\nimport type {\n ForwardedRef,\n Ref,\n ChangeEvent,\n ChangeEventHandler,\n InputHTMLAttributes,\n KeyboardEvent,\n SyntheticEvent,\n DOMAttributes,\n} from \"react\"\nimport { forwardRef, useCallback, useEffect, useId, 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 = <\n Y extends string | number = string,\n M extends Dict = Dict,\n>({\n id,\n ...props\n}: UseRadioProps<Y> & M) => {\n id ??= useId()\n const {\n id: _id,\n name,\n value,\n isChecked: isCheckedProp,\n defaultIsChecked,\n required,\n disabled,\n readOnly,\n onChange: onChangeProp,\n onFocus: onFocusProp,\n onBlur: onBlurProp,\n ...computedProps\n } = useFormControlProps({ id, ...props })\n const [{ \"aria-readonly\": _ariaReadonly, ...formControlProps }, rest] =\n splitObject(computedProps, formControlProperties)\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>(!!defaultIsChecked)\n\n const isControlled = isCheckedProp !== undefined\n const checked = isControlled ? (isCheckedProp 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 onChangeProp?.(ev)\n },\n [readOnly, disabled, isControlled],\n )\n const onFocus = useCallbackRef(onFocusProp)\n const onBlur = useCallbackRef(onBlurProp)\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: PropGetter = 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: PropGetter = 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 props: rest,\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 { value: groupValue, ...groupProps } = { ...group }\n const control = useFormControl(props)\n const [styles, mergedProps] = useMultiComponentStyle(\"Radio\", {\n ...groupProps,\n ...props,\n })\n const {\n className,\n gap = \"0.5rem\",\n isRequired = groupProps.isRequired ?? control.isRequired,\n isReadOnly = groupProps.isReadOnly ?? control.isReadOnly,\n isDisabled = groupProps.isDisabled ?? control.isDisabled,\n isInvalid = groupProps.isInvalid ?? control.isInvalid,\n iconProps,\n inputProps,\n labelProps,\n children,\n ...computedProps\n } = omitThemeProps(mergedProps)\n\n const isChecked =\n groupValue && computedProps.value\n ? groupValue === computedProps.value\n : computedProps.isChecked\n\n const onChange =\n groupProps.onChange && computedProps.value\n ? funcAll(groupProps.onChange, computedProps.onChange)\n : computedProps.onChange\n\n const {\n getContainerProps,\n getInputProps,\n getIconProps,\n getLabelProps,\n props: rest,\n } = useRadio({\n ...computedProps,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n isChecked,\n onChange,\n })\n\n return (\n <ui.label\n className={cx(\"ui-radio\", className)}\n {...getContainerProps()}\n {...rest}\n __css={{\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 ...styles.icon,\n }}\n />\n\n <ui.span\n className=\"ui-radio__label\"\n {...getLabelProps(labelProps as DOMAttributes<HTMLElement>)}\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, Dict, PropGetter } from \"@yamada-ui/utils\"\nimport {\n createContext,\n cx,\n isObject,\n mergeRefs,\n useCallbackRef,\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 = <\n Y extends string | number = string,\n M extends Dict = Dict,\n>({\n id,\n name,\n isNative,\n value: valueProp,\n defaultValue,\n onChange: onChangeProp,\n ...props\n}: UseRadioGroupProps<Y> & M) => {\n id ??= useId()\n name ??= `radio-${id}`\n\n const onChangeRef = useCallbackRef(onChangeProp)\n\n const [value, setValue] = useControllableState({\n value: valueProp,\n defaultValue,\n onChange: onChangeRef,\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 props,\n id,\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 {\n id,\n name,\n value,\n onChange,\n getContainerProps,\n props: computedProps,\n } = useRadioGroup(props)\n const { isRequired, isReadOnly, isDisabled, isInvalid, ...rest } =\n useFormControl({\n id,\n ...computedProps,\n })\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 ...rest,\n id,\n name,\n } as DOMAttributes<HTMLElement>)}\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;AAElC,IAAAC,gBAOO;AAWP,IAAAC,gBAAoE;;;AC/BpE,0BAA+B;AAE/B,qBAAqB;AACrB,oCAAqC;AAErC,mBAOO;AAEP,mBAAuD;AAyM/C;AAjMR,IAAM,UAAU,CAAC,UACf,aAAS,uBAAS,KAAK,SAAK,uBAAS,MAAM,MAAM;AAkC5C,IAAM,gBAAgB,CAG3B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP;AAAA,EACA,UAAU;AAAA,EACV,GAAG;AACL,MAAiC;AAC/B,6BAAO,oBAAM;AACb,+BAAS,SAAS,EAAE;AAEpB,QAAM,kBAAc,6BAAe,YAAY;AAE/C,QAAM,CAAC,OAAO,QAAQ,QAAI,oDAAqB;AAAA,IAC7C,OAAO;AAAA,IACP;AAAA,IACA,UAAU;AAAA,EACZ,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,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;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,OAAO;AAAA,IACT,IAAI,cAAc,KAAK;AACvB,UAAM,EAAE,YAAY,YAAY,YAAY,WAAW,GAAG,KAAK,QAC7D,oCAAe;AAAA,MACb;AAAA,MACA,GAAG;AAAA,IACL,CAAC;AAEH,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,kBAAkB;AAAA,cACpB,GAAG;AAAA,cACH;AAAA,cACA;AAAA,YACF,CAA+B;AAAA,YAC/B;AAAA,YAEC,wCAAY;AAAA;AAAA,QACf;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAMA,WAAW,cAAc;;;AD0DnB,IAAAC,sBAAA;AA5PC,IAAM,WAAW,CAGtB;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAA4B;AAC1B,6BAAO,qBAAM;AACb,QAAM;AAAA,IACJ,IAAI;AAAA,IACJ;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,UAAU;AAAA,IACV,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,GAAG;AAAA,EACL,QAAI,0CAAoB,EAAE,IAAI,GAAG,MAAM,CAAC;AACxC,QAAM,CAAC,EAAE,iBAAiB,eAAe,GAAG,iBAAiB,GAAG,IAAI,QAClE,2BAAY,eAAe,0CAAqB;AAElD,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,gBAAgB;AAEtE,QAAM,eAAe,kBAAkB;AACvC,QAAM,UAAU,eAAgB,gBAA4B;AAE5D,+BAAU,MAAM;AACd,eAAO,4CAAkB,iBAAiB;AAAA,EAC5C,GAAG,CAAC,CAAC;AAEL,QAAM,eAAW;AAAA,IACf,CAAC,OAAsC;AACrC,UAAI,YAAY,UAAU;AACxB,WAAG,eAAe;AAElB;AAAA,MACF;AAEA,UAAI,CAAC;AAAc,qBAAa,GAAG,OAAO,OAAO;AAEjD,mDAAe;AAAA,IACjB;AAAA,IACA,CAAC,UAAU,UAAU,YAAY;AAAA,EACnC;AACA,QAAM,cAAU,8BAAe,WAAW;AAC1C,QAAM,aAAS,8BAAe,UAAU;AAExC,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,oBAA4B;AAAA,IAChC,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,oBAA4B;AAAA,IAChC,CAACA,SAAQ,CAAC,GAAG,MAAM,UAAU;AAAA,MAC3B,GAAG;AAAA,MACH,GAAGA;AAAA,MACH;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,OAAO;AAAA,IACP;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;AA/QP;AAgRI,UAAM,QAAQ,qBAAqB;AACnC,UAAM,EAAE,OAAO,YAAY,GAAG,WAAW,IAAI,EAAE,GAAG,MAAM;AACxD,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,gBAAW,eAAX,YAAyB,QAAQ;AAAA,MAC9C,cAAa,gBAAW,eAAX,YAAyB,QAAQ;AAAA,MAC9C,cAAa,gBAAW,eAAX,YAAyB,QAAQ;AAAA,MAC9C,aAAY,gBAAW,cAAX,YAAwB,QAAQ;AAAA,MAC5C;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,IACL,QAAI,4BAAe,WAAW;AAE9B,UAAM,YACJ,cAAc,cAAc,QACxB,eAAe,cAAc,QAC7B,cAAc;AAEpB,UAAM,WACJ,WAAW,YAAY,cAAc,YACjC,uBAAQ,WAAW,UAAU,cAAc,QAAQ,IACnD,cAAc;AAEpB,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,OAAO;AAAA,IACT,IAAI,SAAS;AAAA,MACX,GAAG;AAAA,MACH;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF,CAAC;AAED,WACE;AAAA,MAAC,eAAG;AAAA,MAAH;AAAA,QACC,eAAW,kBAAG,YAAY,SAAS;AAAA,QAClC,GAAG,kBAAkB;AAAA,QACrB,GAAG;AAAA,QACJ,OAAO;AAAA,UACL;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,GAAG,OAAO;AAAA,cACZ;AAAA;AAAA,UACF;AAAA,UAEA;AAAA,YAAC,eAAG;AAAA,YAAH;AAAA,cACC,WAAU;AAAA,cACT,GAAG,cAAc,UAAwC;AAAA,cAC1D,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
package/dist/radio-group.js
CHANGED
@@ -137,7 +137,6 @@ var useRadio = ({
|
|
137
137
|
disabled,
|
138
138
|
readOnly,
|
139
139
|
checked,
|
140
|
-
"aria-checked": checked,
|
141
140
|
style: {
|
142
141
|
border: "0px",
|
143
142
|
clip: "rect(0px, 0px, 0px, 0px)",
|
@@ -248,11 +247,6 @@ var Radio = (0, import_react.forwardRef)(
|
|
248
247
|
...getContainerProps(),
|
249
248
|
...rest,
|
250
249
|
__css: {
|
251
|
-
cursor: "pointer",
|
252
|
-
position: "relative",
|
253
|
-
display: "inline-flex",
|
254
|
-
alignItems: "center",
|
255
|
-
verticalAlign: "top",
|
256
250
|
gap,
|
257
251
|
...styles.container
|
258
252
|
},
|
@@ -270,9 +264,6 @@ var Radio = (0, import_react.forwardRef)(
|
|
270
264
|
className: "ui-radio__icon",
|
271
265
|
...getIconProps(iconProps),
|
272
266
|
__css: {
|
273
|
-
position: "relative",
|
274
|
-
display: "inline-block",
|
275
|
-
userSelect: "none",
|
276
267
|
...styles.icon
|
277
268
|
}
|
278
269
|
}
|
@@ -339,7 +330,7 @@ var useRadioGroup = ({
|
|
339
330
|
(props2 = {}, ref = null) => ({
|
340
331
|
...props2,
|
341
332
|
ref: (0, import_utils2.mergeRefs)(ref, containerRef),
|
342
|
-
role: "
|
333
|
+
role: "group"
|
343
334
|
}),
|
344
335
|
[]
|
345
336
|
);
|
package/dist/radio-group.js.map
CHANGED
@@ -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, Dict, PropGetter } from \"@yamada-ui/utils\"\nimport {\n createContext,\n cx,\n isObject,\n mergeRefs,\n useCallbackRef,\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 = <\n Y extends string | number = string,\n M extends Dict = Dict,\n>({\n id,\n name,\n isNative,\n value: valueProp,\n defaultValue,\n onChange: onChangeProp,\n ...props\n}: UseRadioGroupProps<Y> & M) => {\n id ??= useId()\n name ??= `radio-${id}`\n\n const onChangeRef = useCallbackRef(onChangeProp)\n\n const [value, setValue] = useControllableState({\n value: valueProp,\n defaultValue,\n onChange: onChangeRef,\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: \"radiogroup\",\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 props,\n id,\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 {\n id,\n name,\n value,\n onChange,\n getContainerProps,\n props: computedProps,\n } = useRadioGroup(props)\n const { isRequired, isReadOnly, isDisabled, isInvalid, ...rest } =\n useFormControl({\n id,\n ...computedProps,\n })\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 ...rest,\n id,\n name,\n } as DOMAttributes<HTMLElement>)}\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 type { Dict, PropGetter } from \"@yamada-ui/utils\"\nimport {\n cx,\n useCallbackRef,\n funcAll,\n handlerAll,\n dataAttr,\n splitObject,\n} from \"@yamada-ui/utils\"\nimport type {\n ForwardedRef,\n Ref,\n ChangeEvent,\n ChangeEventHandler,\n InputHTMLAttributes,\n KeyboardEvent,\n SyntheticEvent,\n DOMAttributes,\n} from \"react\"\nimport { forwardRef, useCallback, useEffect, useId, 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 = <\n Y extends string | number = string,\n M extends Dict = Dict,\n>({\n id,\n ...props\n}: UseRadioProps<Y> & M) => {\n id ??= useId()\n const {\n id: _id,\n name,\n value,\n isChecked: isCheckedProp,\n defaultIsChecked,\n required,\n disabled,\n readOnly,\n onChange: onChangeProp,\n onFocus: onFocusProp,\n onBlur: onBlurProp,\n ...computedProps\n } = useFormControlProps({ id, ...props })\n const [{ \"aria-readonly\": _ariaReadonly, ...formControlProps }, rest] =\n splitObject(computedProps, formControlProperties)\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>(!!defaultIsChecked)\n\n const isControlled = isCheckedProp !== undefined\n const checked = isControlled ? (isCheckedProp 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 onChangeProp?.(ev)\n },\n [readOnly, disabled, isControlled],\n )\n const onFocus = useCallbackRef(onFocusProp)\n const onBlur = useCallbackRef(onBlurProp)\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: PropGetter = 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 \"aria-checked\": 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: PropGetter = 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 props: rest,\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 { value: groupValue, ...groupProps } = { ...group }\n const control = useFormControl(props)\n const [styles, mergedProps] = useMultiComponentStyle(\"Radio\", {\n ...groupProps,\n ...props,\n })\n const {\n className,\n gap = \"0.5rem\",\n isRequired = groupProps.isRequired ?? control.isRequired,\n isReadOnly = groupProps.isReadOnly ?? control.isReadOnly,\n isDisabled = groupProps.isDisabled ?? control.isDisabled,\n isInvalid = groupProps.isInvalid ?? control.isInvalid,\n iconProps,\n inputProps,\n labelProps,\n children,\n ...computedProps\n } = omitThemeProps(mergedProps)\n\n const isChecked =\n groupValue && computedProps.value\n ? groupValue === computedProps.value\n : computedProps.isChecked\n\n const onChange =\n groupProps.onChange && computedProps.value\n ? funcAll(groupProps.onChange, computedProps.onChange)\n : computedProps.onChange\n\n const {\n getContainerProps,\n getInputProps,\n getIconProps,\n getLabelProps,\n props: rest,\n } = useRadio({\n ...computedProps,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n isChecked,\n onChange,\n })\n\n return (\n <ui.label\n className={cx(\"ui-radio\", className)}\n {...getContainerProps()}\n {...rest}\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 as DOMAttributes<HTMLElement>)}\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, Dict, PropGetter } from \"@yamada-ui/utils\"\nimport {\n createContext,\n cx,\n isObject,\n mergeRefs,\n useCallbackRef,\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 = <\n Y extends string | number = string,\n M extends Dict = Dict,\n>({\n id,\n name,\n isNative,\n value: valueProp,\n defaultValue,\n onChange: onChangeProp,\n ...props\n}: UseRadioGroupProps<Y> & M) => {\n id ??= useId()\n name ??= `radio-${id}`\n\n const onChangeRef = useCallbackRef(onChangeProp)\n\n const [value, setValue] = useControllableState({\n value: valueProp,\n defaultValue,\n onChange: onChangeRef,\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 props,\n id,\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 {\n id,\n name,\n value,\n onChange,\n getContainerProps,\n props: computedProps,\n } = useRadioGroup(props)\n const { isRequired, isReadOnly, isDisabled, isInvalid, ...rest } =\n useFormControl({\n id,\n ...computedProps,\n })\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 ...rest,\n id,\n name,\n } as DOMAttributes<HTMLElement>)}\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 type { Dict, PropGetter } from \"@yamada-ui/utils\"\nimport {\n cx,\n useCallbackRef,\n funcAll,\n handlerAll,\n dataAttr,\n splitObject,\n} from \"@yamada-ui/utils\"\nimport type {\n ForwardedRef,\n Ref,\n ChangeEvent,\n ChangeEventHandler,\n InputHTMLAttributes,\n KeyboardEvent,\n SyntheticEvent,\n DOMAttributes,\n} from \"react\"\nimport { forwardRef, useCallback, useEffect, useId, 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 = <\n Y extends string | number = string,\n M extends Dict = Dict,\n>({\n id,\n ...props\n}: UseRadioProps<Y> & M) => {\n id ??= useId()\n const {\n id: _id,\n name,\n value,\n isChecked: isCheckedProp,\n defaultIsChecked,\n required,\n disabled,\n readOnly,\n onChange: onChangeProp,\n onFocus: onFocusProp,\n onBlur: onBlurProp,\n ...computedProps\n } = useFormControlProps({ id, ...props })\n const [{ \"aria-readonly\": _ariaReadonly, ...formControlProps }, rest] =\n splitObject(computedProps, formControlProperties)\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>(!!defaultIsChecked)\n\n const isControlled = isCheckedProp !== undefined\n const checked = isControlled ? (isCheckedProp 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 onChangeProp?.(ev)\n },\n [readOnly, disabled, isControlled],\n )\n const onFocus = useCallbackRef(onFocusProp)\n const onBlur = useCallbackRef(onBlurProp)\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: PropGetter = 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: PropGetter = 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 props: rest,\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 { value: groupValue, ...groupProps } = { ...group }\n const control = useFormControl(props)\n const [styles, mergedProps] = useMultiComponentStyle(\"Radio\", {\n ...groupProps,\n ...props,\n })\n const {\n className,\n gap = \"0.5rem\",\n isRequired = groupProps.isRequired ?? control.isRequired,\n isReadOnly = groupProps.isReadOnly ?? control.isReadOnly,\n isDisabled = groupProps.isDisabled ?? control.isDisabled,\n isInvalid = groupProps.isInvalid ?? control.isInvalid,\n iconProps,\n inputProps,\n labelProps,\n children,\n ...computedProps\n } = omitThemeProps(mergedProps)\n\n const isChecked =\n groupValue && computedProps.value\n ? groupValue === computedProps.value\n : computedProps.isChecked\n\n const onChange =\n groupProps.onChange && computedProps.value\n ? funcAll(groupProps.onChange, computedProps.onChange)\n : computedProps.onChange\n\n const {\n getContainerProps,\n getInputProps,\n getIconProps,\n getLabelProps,\n props: rest,\n } = useRadio({\n ...computedProps,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n isChecked,\n onChange,\n })\n\n return (\n <ui.label\n className={cx(\"ui-radio\", className)}\n {...getContainerProps()}\n {...rest}\n __css={{\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 ...styles.icon,\n }}\n />\n\n <ui.span\n className=\"ui-radio__label\"\n {...getLabelProps(labelProps as DOMAttributes<HTMLElement>)}\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"]}
|
package/dist/radio-group.mjs
CHANGED
package/dist/radio.js
CHANGED
@@ -82,7 +82,7 @@ var useRadioGroup = ({
|
|
82
82
|
(props2 = {}, ref = null) => ({
|
83
83
|
...props2,
|
84
84
|
ref: (0, import_utils.mergeRefs)(ref, containerRef),
|
85
|
-
role: "
|
85
|
+
role: "group"
|
86
86
|
}),
|
87
87
|
[]
|
88
88
|
);
|
@@ -277,7 +277,6 @@ var useRadio = ({
|
|
277
277
|
disabled,
|
278
278
|
readOnly,
|
279
279
|
checked,
|
280
|
-
"aria-checked": checked,
|
281
280
|
style: {
|
282
281
|
border: "0px",
|
283
282
|
clip: "rect(0px, 0px, 0px, 0px)",
|
@@ -388,11 +387,6 @@ var Radio = (0, import_react2.forwardRef)(
|
|
388
387
|
...getContainerProps(),
|
389
388
|
...rest,
|
390
389
|
__css: {
|
391
|
-
cursor: "pointer",
|
392
|
-
position: "relative",
|
393
|
-
display: "inline-flex",
|
394
|
-
alignItems: "center",
|
395
|
-
verticalAlign: "top",
|
396
390
|
gap,
|
397
391
|
...styles.container
|
398
392
|
},
|
@@ -410,9 +404,6 @@ var Radio = (0, import_react2.forwardRef)(
|
|
410
404
|
className: "ui-radio__icon",
|
411
405
|
...getIconProps(iconProps),
|
412
406
|
__css: {
|
413
|
-
position: "relative",
|
414
|
-
display: "inline-block",
|
415
|
-
userSelect: "none",
|
416
407
|
...styles.icon
|
417
408
|
}
|
418
409
|
}
|
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 type { Dict, PropGetter } from \"@yamada-ui/utils\"\nimport {\n cx,\n useCallbackRef,\n funcAll,\n handlerAll,\n dataAttr,\n splitObject,\n} from \"@yamada-ui/utils\"\nimport type {\n ForwardedRef,\n Ref,\n ChangeEvent,\n ChangeEventHandler,\n InputHTMLAttributes,\n KeyboardEvent,\n SyntheticEvent,\n DOMAttributes,\n} from \"react\"\nimport { forwardRef, useCallback, useEffect, useId, 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 = <\n Y extends string | number = string,\n M extends Dict = Dict,\n>({\n id,\n ...props\n}: UseRadioProps<Y> & M) => {\n id ??= useId()\n const {\n id: _id,\n name,\n value,\n isChecked: isCheckedProp,\n defaultIsChecked,\n required,\n disabled,\n readOnly,\n onChange: onChangeProp,\n onFocus: onFocusProp,\n onBlur: onBlurProp,\n ...computedProps\n } = useFormControlProps({ id, ...props })\n const [{ \"aria-readonly\": _ariaReadonly, ...formControlProps }, rest] =\n splitObject(computedProps, formControlProperties)\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>(!!defaultIsChecked)\n\n const isControlled = isCheckedProp !== undefined\n const checked = isControlled ? (isCheckedProp 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 onChangeProp?.(ev)\n },\n [readOnly, disabled, isControlled],\n )\n const onFocus = useCallbackRef(onFocusProp)\n const onBlur = useCallbackRef(onBlurProp)\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: PropGetter = 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 \"aria-checked\": 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: PropGetter = 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 props: rest,\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 { value: groupValue, ...groupProps } = { ...group }\n const control = useFormControl(props)\n const [styles, mergedProps] = useMultiComponentStyle(\"Radio\", {\n ...groupProps,\n ...props,\n })\n const {\n className,\n gap = \"0.5rem\",\n isRequired = groupProps.isRequired ?? control.isRequired,\n isReadOnly = groupProps.isReadOnly ?? control.isReadOnly,\n isDisabled = groupProps.isDisabled ?? control.isDisabled,\n isInvalid = groupProps.isInvalid ?? control.isInvalid,\n iconProps,\n inputProps,\n labelProps,\n children,\n ...computedProps\n } = omitThemeProps(mergedProps)\n\n const isChecked =\n groupValue && computedProps.value\n ? groupValue === computedProps.value\n : computedProps.isChecked\n\n const onChange =\n groupProps.onChange && computedProps.value\n ? funcAll(groupProps.onChange, computedProps.onChange)\n : computedProps.onChange\n\n const {\n getContainerProps,\n getInputProps,\n getIconProps,\n getLabelProps,\n props: rest,\n } = useRadio({\n ...computedProps,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n isChecked,\n onChange,\n })\n\n return (\n <ui.label\n className={cx(\"ui-radio\", className)}\n {...getContainerProps()}\n {...rest}\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 as DOMAttributes<HTMLElement>)}\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, Dict, PropGetter } from \"@yamada-ui/utils\"\nimport {\n createContext,\n cx,\n isObject,\n mergeRefs,\n useCallbackRef,\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 = <\n Y extends string | number = string,\n M extends Dict = Dict,\n>({\n id,\n name,\n isNative,\n value: valueProp,\n defaultValue,\n onChange: onChangeProp,\n ...props\n}: UseRadioGroupProps<Y> & M) => {\n id ??= useId()\n name ??= `radio-${id}`\n\n const onChangeRef = useCallbackRef(onChangeProp)\n\n const [value, setValue] = useControllableState({\n value: valueProp,\n defaultValue,\n onChange: onChangeRef,\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: \"radiogroup\",\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 props,\n id,\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 {\n id,\n name,\n value,\n onChange,\n getContainerProps,\n props: computedProps,\n } = useRadioGroup(props)\n const { isRequired, isReadOnly, isDisabled, isInvalid, ...rest } =\n useFormControl({\n id,\n ...computedProps,\n })\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 ...rest,\n id,\n name,\n } as DOMAttributes<HTMLElement>)}\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 formControlProperties,\n} from \"@yamada-ui/form-control\"\nimport { trackFocusVisible } from \"@yamada-ui/use-focus-visible\"\nimport type { Dict, PropGetter } from \"@yamada-ui/utils\"\nimport {\n cx,\n useCallbackRef,\n funcAll,\n handlerAll,\n dataAttr,\n splitObject,\n} from \"@yamada-ui/utils\"\nimport type {\n ForwardedRef,\n Ref,\n ChangeEvent,\n ChangeEventHandler,\n InputHTMLAttributes,\n KeyboardEvent,\n SyntheticEvent,\n DOMAttributes,\n} from \"react\"\nimport { forwardRef, useCallback, useEffect, useId, 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 = <\n Y extends string | number = string,\n M extends Dict = Dict,\n>({\n id,\n ...props\n}: UseRadioProps<Y> & M) => {\n id ??= useId()\n const {\n id: _id,\n name,\n value,\n isChecked: isCheckedProp,\n defaultIsChecked,\n required,\n disabled,\n readOnly,\n onChange: onChangeProp,\n onFocus: onFocusProp,\n onBlur: onBlurProp,\n ...computedProps\n } = useFormControlProps({ id, ...props })\n const [{ \"aria-readonly\": _ariaReadonly, ...formControlProps }, rest] =\n splitObject(computedProps, formControlProperties)\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>(!!defaultIsChecked)\n\n const isControlled = isCheckedProp !== undefined\n const checked = isControlled ? (isCheckedProp 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 onChangeProp?.(ev)\n },\n [readOnly, disabled, isControlled],\n )\n const onFocus = useCallbackRef(onFocusProp)\n const onBlur = useCallbackRef(onBlurProp)\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: PropGetter = 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: PropGetter = 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 props: rest,\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 { value: groupValue, ...groupProps } = { ...group }\n const control = useFormControl(props)\n const [styles, mergedProps] = useMultiComponentStyle(\"Radio\", {\n ...groupProps,\n ...props,\n })\n const {\n className,\n gap = \"0.5rem\",\n isRequired = groupProps.isRequired ?? control.isRequired,\n isReadOnly = groupProps.isReadOnly ?? control.isReadOnly,\n isDisabled = groupProps.isDisabled ?? control.isDisabled,\n isInvalid = groupProps.isInvalid ?? control.isInvalid,\n iconProps,\n inputProps,\n labelProps,\n children,\n ...computedProps\n } = omitThemeProps(mergedProps)\n\n const isChecked =\n groupValue && computedProps.value\n ? groupValue === computedProps.value\n : computedProps.isChecked\n\n const onChange =\n groupProps.onChange && computedProps.value\n ? funcAll(groupProps.onChange, computedProps.onChange)\n : computedProps.onChange\n\n const {\n getContainerProps,\n getInputProps,\n getIconProps,\n getLabelProps,\n props: rest,\n } = useRadio({\n ...computedProps,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n isChecked,\n onChange,\n })\n\n return (\n <ui.label\n className={cx(\"ui-radio\", className)}\n {...getContainerProps()}\n {...rest}\n __css={{\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 ...styles.icon,\n }}\n />\n\n <ui.span\n className=\"ui-radio__label\"\n {...getLabelProps(labelProps as DOMAttributes<HTMLElement>)}\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, Dict, PropGetter } from \"@yamada-ui/utils\"\nimport {\n createContext,\n cx,\n isObject,\n mergeRefs,\n useCallbackRef,\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 = <\n Y extends string | number = string,\n M extends Dict = Dict,\n>({\n id,\n name,\n isNative,\n value: valueProp,\n defaultValue,\n onChange: onChangeProp,\n ...props\n}: UseRadioGroupProps<Y> & M) => {\n id ??= useId()\n name ??= `radio-${id}`\n\n const onChangeRef = useCallbackRef(onChangeProp)\n\n const [value, setValue] = useControllableState({\n value: valueProp,\n defaultValue,\n onChange: onChangeRef,\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 props,\n id,\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 {\n id,\n name,\n value,\n onChange,\n getContainerProps,\n props: computedProps,\n } = useRadioGroup(props)\n const { isRequired, isReadOnly, isDisabled, isInvalid, ...rest } =\n useFormControl({\n id,\n ...computedProps,\n })\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 ...rest,\n id,\n name,\n } as DOMAttributes<HTMLElement>)}\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
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@yamada-ui/radio",
|
3
|
-
"version": "
|
3
|
+
"version": "2.0.0-next-20240609100940",
|
4
4
|
"description": "Yamada UI radio component",
|
5
5
|
"keywords": [
|
6
6
|
"yamada",
|
@@ -36,12 +36,12 @@
|
|
36
36
|
"url": "https://github.com/yamada-ui/yamada-ui/issues"
|
37
37
|
},
|
38
38
|
"dependencies": {
|
39
|
-
"@yamada-ui/core": "1.7.1",
|
40
|
-
"@yamada-ui/utils": "1.2.1",
|
41
|
-
"@yamada-ui/form-control": "
|
42
|
-
"@yamada-ui/layouts": "1.1.24",
|
43
|
-
"@yamada-ui/use-controllable-state": "1.0.14",
|
44
|
-
"@yamada-ui/use-focus-visible": "1.1.1"
|
39
|
+
"@yamada-ui/core": "1.7.1-next-20240609100940",
|
40
|
+
"@yamada-ui/utils": "1.2.1-next-20240609100940",
|
41
|
+
"@yamada-ui/form-control": "2.0.0-next-20240609100940",
|
42
|
+
"@yamada-ui/layouts": "1.1.24-next-20240609100940",
|
43
|
+
"@yamada-ui/use-controllable-state": "1.0.14-next-20240609100940",
|
44
|
+
"@yamada-ui/use-focus-visible": "1.1.1-next-20240609100940"
|
45
45
|
},
|
46
46
|
"devDependencies": {
|
47
47
|
"react": "^18.0.0",
|
@@ -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, Dict, PropGetter } from \"@yamada-ui/utils\"\nimport {\n createContext,\n cx,\n isObject,\n mergeRefs,\n useCallbackRef,\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 = <\n Y extends string | number = string,\n M extends Dict = Dict,\n>({\n id,\n name,\n isNative,\n value: valueProp,\n defaultValue,\n onChange: onChangeProp,\n ...props\n}: UseRadioGroupProps<Y> & M) => {\n id ??= useId()\n name ??= `radio-${id}`\n\n const onChangeRef = useCallbackRef(onChangeProp)\n\n const [value, setValue] = useControllableState({\n value: valueProp,\n defaultValue,\n onChange: onChangeRef,\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: \"radiogroup\",\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 props,\n id,\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 {\n id,\n name,\n value,\n onChange,\n getContainerProps,\n props: computedProps,\n } = useRadioGroup(props)\n const { isRequired, isReadOnly, isDisabled, isInvalid, ...rest } =\n useFormControl({\n id,\n ...computedProps,\n })\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 ...rest,\n id,\n name,\n } as DOMAttributes<HTMLElement>)}\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 type { Dict, PropGetter } from \"@yamada-ui/utils\"\nimport {\n cx,\n useCallbackRef,\n funcAll,\n handlerAll,\n dataAttr,\n splitObject,\n} from \"@yamada-ui/utils\"\nimport type {\n ForwardedRef,\n Ref,\n ChangeEvent,\n ChangeEventHandler,\n InputHTMLAttributes,\n KeyboardEvent,\n SyntheticEvent,\n DOMAttributes,\n} from \"react\"\nimport { forwardRef, useCallback, useEffect, useId, 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 = <\n Y extends string | number = string,\n M extends Dict = Dict,\n>({\n id,\n ...props\n}: UseRadioProps<Y> & M) => {\n id ??= useId()\n const {\n id: _id,\n name,\n value,\n isChecked: isCheckedProp,\n defaultIsChecked,\n required,\n disabled,\n readOnly,\n onChange: onChangeProp,\n onFocus: onFocusProp,\n onBlur: onBlurProp,\n ...computedProps\n } = useFormControlProps({ id, ...props })\n const [{ \"aria-readonly\": _ariaReadonly, ...formControlProps }, rest] =\n splitObject(computedProps, formControlProperties)\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>(!!defaultIsChecked)\n\n const isControlled = isCheckedProp !== undefined\n const checked = isControlled ? (isCheckedProp 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 onChangeProp?.(ev)\n },\n [readOnly, disabled, isControlled],\n )\n const onFocus = useCallbackRef(onFocusProp)\n const onBlur = useCallbackRef(onBlurProp)\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: PropGetter = 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 \"aria-checked\": 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: PropGetter = 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 props: rest,\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 { value: groupValue, ...groupProps } = { ...group }\n const control = useFormControl(props)\n const [styles, mergedProps] = useMultiComponentStyle(\"Radio\", {\n ...groupProps,\n ...props,\n })\n const {\n className,\n gap = \"0.5rem\",\n isRequired = groupProps.isRequired ?? control.isRequired,\n isReadOnly = groupProps.isReadOnly ?? control.isReadOnly,\n isDisabled = groupProps.isDisabled ?? control.isDisabled,\n isInvalid = groupProps.isInvalid ?? control.isInvalid,\n iconProps,\n inputProps,\n labelProps,\n children,\n ...computedProps\n } = omitThemeProps(mergedProps)\n\n const isChecked =\n groupValue && computedProps.value\n ? groupValue === computedProps.value\n : computedProps.isChecked\n\n const onChange =\n groupProps.onChange && computedProps.value\n ? funcAll(groupProps.onChange, computedProps.onChange)\n : computedProps.onChange\n\n const {\n getContainerProps,\n getInputProps,\n getIconProps,\n getLabelProps,\n props: rest,\n } = useRadio({\n ...computedProps,\n isRequired,\n isReadOnly,\n isDisabled,\n isInvalid,\n isChecked,\n onChange,\n })\n\n return (\n <ui.label\n className={cx(\"ui-radio\", className)}\n {...getContainerProps()}\n {...rest}\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 as DOMAttributes<HTMLElement>)}\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","useCallback","useId","forwardRef","props","jsx","useId","useCallbackRef","useCallback","props","forwardRef","useFormControl","value","props","jsx","cx"]}
|