@yamada-ui/radio 1.3.2-dev-20241213213653 → 1.3.2-dev-20241215203956

Sign up to get free protection for your applications and to get access to all the features.
Files changed (41) hide show
  1. package/dist/{chunk-WLXTCMUT.mjs → chunk-5NXORUGF.mjs} +8 -15
  2. package/dist/chunk-5NXORUGF.mjs.map +1 -0
  3. package/dist/{chunk-BJ7BU7PO.mjs → chunk-PWCVZ3CT.mjs} +8 -15
  4. package/dist/chunk-PWCVZ3CT.mjs.map +1 -0
  5. package/dist/{chunk-HFS5TQ47.mjs → chunk-QJKELJFS.mjs} +25 -7
  6. package/dist/{chunk-HFS5TQ47.mjs.map → chunk-QJKELJFS.mjs.map} +1 -1
  7. package/dist/{chunk-NP4GICPF.mjs → chunk-R7JQ4H4D.mjs} +10 -10
  8. package/dist/chunk-R7JQ4H4D.mjs.map +1 -0
  9. package/dist/{chunk-JLL7F3NY.mjs → chunk-RA4K44ZS.mjs} +10 -10
  10. package/dist/chunk-RA4K44ZS.mjs.map +1 -0
  11. package/dist/{chunk-TSA4YXU3.mjs → chunk-UXJ5W7LK.mjs} +2 -2
  12. package/dist/chunk-UXJ5W7LK.mjs.map +1 -0
  13. package/dist/index.js +51 -47
  14. package/dist/index.js.map +1 -1
  15. package/dist/index.mjs +6 -6
  16. package/dist/radio-card-group.js +38 -27
  17. package/dist/radio-card-group.js.map +1 -1
  18. package/dist/radio-card-group.mjs +4 -4
  19. package/dist/radio-card.js +32 -14
  20. package/dist/radio-card.js.map +1 -1
  21. package/dist/radio-card.mjs +2 -2
  22. package/dist/radio-group.js +38 -27
  23. package/dist/radio-group.js.map +1 -1
  24. package/dist/radio-group.mjs +4 -4
  25. package/dist/radio.js +32 -14
  26. package/dist/radio.js.map +1 -1
  27. package/dist/radio.mjs +2 -2
  28. package/dist/use-radio-group.js +1 -1
  29. package/dist/use-radio-group.js.map +1 -1
  30. package/dist/use-radio-group.mjs +1 -1
  31. package/dist/use-radio.d.mts +20 -0
  32. package/dist/use-radio.d.ts +20 -0
  33. package/dist/use-radio.js +24 -6
  34. package/dist/use-radio.js.map +1 -1
  35. package/dist/use-radio.mjs +1 -1
  36. package/package.json +7 -7
  37. package/dist/chunk-BJ7BU7PO.mjs.map +0 -1
  38. package/dist/chunk-JLL7F3NY.mjs.map +0 -1
  39. package/dist/chunk-NP4GICPF.mjs.map +0 -1
  40. package/dist/chunk-TSA4YXU3.mjs.map +0 -1
  41. package/dist/chunk-WLXTCMUT.mjs.map +0 -1
package/dist/radio.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/radio.tsx","../src/radio-context.ts","../src/use-radio.ts"],"sourcesContent":["import type { ComponentArgs, HTMLUIProps, ThemeProps } from \"@yamada-ui/core\"\nimport type {\n ForwardedRef,\n InputHTMLAttributes,\n ReactElement,\n ReactNode,\n RefAttributes,\n} from \"react\"\nimport type { UseRadioProps } from \"./use-radio\"\nimport { omitThemeProps, ui, useComponentMultiStyle } from \"@yamada-ui/core\"\nimport { useFormControl } from \"@yamada-ui/form-control\"\nimport { cx, funcAll } from \"@yamada-ui/utils\"\nimport { forwardRef } from \"react\"\nimport { useRadioGroupContext } from \"./radio-context\"\nimport { useRadio } from \"./use-radio\"\n\ninterface RadioOptions {\n /**\n * The label of the radio.\n */\n label?: ReactNode\n /**\n * Props for icon element.\n */\n iconProps?: HTMLUIProps<\"span\">\n /**\n * Props for input element.\n */\n inputProps?: InputHTMLAttributes<HTMLInputElement>\n /**\n * Props for label element.\n */\n labelProps?: HTMLUIProps<\"span\">\n}\n\nexport interface RadioProps<Y extends number | string = string>\n extends Omit<HTMLUIProps<\"label\">, keyof UseRadioProps>,\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 number | string = 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] = useComponentMultiStyle(\"Radio\", {\n ...groupProps,\n ...props,\n })\n const {\n className,\n children,\n gap = \"0.5rem\",\n isDisabled = groupProps.isDisabled ?? control.isDisabled,\n isInvalid = groupProps.isInvalid ?? control.isInvalid,\n isReadOnly = groupProps.isReadOnly ?? control.isReadOnly,\n isRequired = groupProps.isRequired ?? control.isRequired,\n label,\n iconProps,\n inputProps,\n labelProps,\n ...computedProps\n } = omitThemeProps(mergedProps)\n\n computedProps.checked ??= computedProps.isChecked\n\n const checkedProp =\n groupValue && computedProps.value\n ? groupValue === computedProps.value\n : computedProps.checked\n\n const onChange =\n groupProps.onChange && computedProps.value\n ? funcAll(groupProps.onChange, computedProps.onChange)\n : computedProps.onChange\n\n const {\n checked,\n props: rest,\n getContainerProps,\n getIconProps,\n getInputProps,\n getLabelProps,\n } = useRadio({\n ...computedProps,\n checked: checkedProp,\n isDisabled,\n isInvalid,\n isReadOnly,\n isRequired,\n onChange,\n })\n\n const tabIndex = !groupValue ? 0 : checked ? 0 : -1\n\n return (\n <ui.label\n className={cx(\"ui-radio\", className)}\n {...getContainerProps(rest)}\n __css={{\n alignItems: \"center\",\n cursor: \"pointer\",\n display: \"inline-flex\",\n gap,\n position: \"relative\",\n verticalAlign: \"top\",\n ...styles.container,\n }}\n >\n <ui.input\n className=\"ui-radio__input\"\n {...getInputProps(\n {\n ...inputProps,\n tabIndex,\n },\n ref,\n )}\n />\n\n <ui.div\n className=\"ui-radio__icon\"\n {...getIconProps(iconProps)}\n __css={{\n display: \"inline-block\",\n position: \"relative\",\n userSelect: \"none\",\n ...styles.icon,\n }}\n />\n\n <ui.span\n className=\"ui-radio__label\"\n {...getLabelProps(labelProps)}\n __css={{ ...styles.label }}\n >\n {children ?? label}\n </ui.span>\n </ui.label>\n )\n },\n) as {\n <Y extends number | string = string>(\n props: RadioProps<Y> & RefAttributes<HTMLInputElement>,\n ): ReactElement\n} & ComponentArgs\n\nRadio.displayName = \"Radio\"\nRadio.__ui__ = \"Radio\"\n","import type {\n CSSUIObject,\n HTMLUIProps,\n PropGetter,\n ThemeProps,\n} from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport type { ChangeEvent } from \"react\"\nimport type { RadioCardProps } from \"./radio-card\"\nimport { createContext } from \"@yamada-ui/utils\"\n\ninterface RadioGroupSharedContext extends FormControlOptions {\n name: string\n value: number | string\n onChange: (evOrValue: ChangeEvent<HTMLInputElement> | number | string) => void\n}\n\nexport interface RadioGroupContext\n extends RadioGroupSharedContext,\n ThemeProps<\"Radio\"> {}\n\nexport const [RadioGroupProvider, useRadioGroupContext] =\n createContext<RadioGroupContext>({\n name: \"RadioGroupContext\",\n strict: false,\n })\n\nexport interface RadioCardGroupContext\n extends RadioGroupSharedContext,\n Pick<\n RadioCardProps,\n \"addonProps\" | \"descriptionProps\" | \"labelProps\" | \"withIcon\"\n >,\n ThemeProps<\"RadioCard\"> {}\n\nexport const [RadioCardGroupProvider, useRadioCardGroupContext] =\n createContext<RadioCardGroupContext>({\n name: \"RadioCardGroupContext\",\n strict: false,\n })\n\nexport interface RadioCardContext {\n styles: { [key: string]: CSSUIObject | undefined }\n withIcon: boolean\n getIconProps: PropGetter\n iconProps?: HTMLUIProps\n}\n\nexport const [RadioCardProvider, useRadioCardContext] =\n createContext<RadioCardContext>({\n name: \"RadioCardContext\",\n errorMessage: `useRadioCardContext returned is 'undefined'. Seems you forgot to wrap the components in \"<RadioCard />\"`,\n })\n","import type { PropGetter } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport type { Dict } from \"@yamada-ui/utils\"\nimport type {\n ChangeEvent,\n ChangeEventHandler,\n KeyboardEvent,\n SyntheticEvent,\n} from \"react\"\nimport {\n formControlProperties,\n useFormControlProps,\n} from \"@yamada-ui/form-control\"\nimport { trackFocusVisible } from \"@yamada-ui/use-focus-visible\"\nimport {\n dataAttr,\n handlerAll,\n splitObject,\n useCallbackRef,\n} from \"@yamada-ui/utils\"\nimport { useCallback, useEffect, useId, useState } from \"react\"\n\nexport interface UseRadioProps<Y extends number | string = string>\n extends 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 * If `true`, the radio will be checked.\n *\n * @default false\n */\n checked?: boolean\n /**\n * If `true`, the radio will be initially checked.\n *\n * @default false\n */\n defaultChecked?: boolean\n /**\n * If `true`, the radio will be initially checked.\n *\n * @default false\n *\n * @deprecated Use `defaultChecked` instead.\n */\n defaultIsChecked?: boolean\n /**\n * If `true`, the radio will be checked.\n *\n * @default false\n *\n * @deprecated Use `checked` instead.\n */\n isChecked?: boolean\n /**\n * The value to be used in the radio button.\n */\n value?: Y\n /**\n * The callback invoked when the checked state changes.\n */\n onChange?: ChangeEventHandler<HTMLInputElement>\n}\n\nexport const useRadio = <\n Y extends number | string = string,\n M extends Dict = Dict,\n>({\n id,\n ...props\n}: M & UseRadioProps<Y>) => {\n const uuid = useId()\n\n id ??= uuid\n\n let {\n id: _id,\n name,\n checked: checkedProp,\n defaultChecked,\n defaultIsChecked,\n isChecked: isCheckedProp,\n value,\n onChange: onChangeProp,\n ...computedProps\n } = useFormControlProps({ id, ...props })\n\n checkedProp ??= isCheckedProp\n defaultChecked ??= defaultIsChecked\n\n const [\n {\n \"aria-readonly\": _ariaReadonly,\n disabled,\n readOnly,\n required,\n onBlur: onBlurProp,\n onFocus: onFocusProp,\n ...formControlProps\n },\n rest,\n ] = splitObject(computedProps, formControlProperties)\n\n const [focusVisible, setFocusVisible] = useState<boolean>(false)\n const [focused, setFocused] = useState<boolean>(false)\n const [hovered, setHovered] = useState<boolean>(false)\n const [active, setActive] = useState<boolean>(false)\n\n const [checked, setChecked] = useState<boolean>(!!defaultChecked)\n\n const controlled = checkedProp !== undefined\n const resolvedChecked = controlled ? (checkedProp as boolean) : checked\n\n useEffect(() => {\n return trackFocusVisible(setFocusVisible)\n }, [])\n\n const onChange = useCallbackRef(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if (readOnly || disabled) {\n ev.preventDefault()\n\n return\n }\n\n if (!controlled) setChecked(ev.target.checked)\n\n onChangeProp?.(ev)\n },\n [readOnly, disabled, controlled],\n )\n const onFocus = useCallbackRef(onFocusProp)\n const onBlur = useCallbackRef(onBlurProp)\n\n const onKeyDown = useCallback(\n ({ key }: KeyboardEvent) => {\n if (key === \" \") setActive(true)\n },\n [setActive],\n )\n\n const onKeyUp = useCallback(\n ({ key }: KeyboardEvent) => {\n if (key === \" \") setActive(false)\n },\n [setActive],\n )\n\n const getContainerProps: PropGetter<\"label\"> = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref,\n \"data-checked\": dataAttr(resolvedChecked),\n \"data-focus\": dataAttr(focused),\n \"data-focus-visible\": dataAttr(focused && focusVisible),\n }),\n [resolvedChecked, formControlProps, focused, focusVisible],\n )\n\n const getIconProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref,\n \"aria-hidden\": true,\n \"data-active\": dataAttr(active),\n \"data-checked\": dataAttr(resolvedChecked),\n \"data-focus\": dataAttr(focused),\n \"data-focus-visible\": dataAttr(focused && focusVisible),\n \"data-hover\": dataAttr(hovered),\n onMouseDown: handlerAll(props.onMouseDown, () => setActive(true)),\n onMouseEnter: handlerAll(props.onMouseEnter, () => setHovered(true)),\n onMouseLeave: handlerAll(props.onMouseLeave, () => setHovered(false)),\n onMouseUp: handlerAll(props.onMouseUp, () => setActive(false)),\n }),\n [resolvedChecked, active, focused, focusVisible, hovered, formControlProps],\n )\n\n const getInputProps: PropGetter<\"input\"> = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n id,\n ref,\n type: \"radio\",\n name,\n style: {\n border: \"0px\",\n clip: \"rect(0px, 0px, 0px, 0px)\",\n height: \"1px\",\n margin: \"-1px\",\n overflow: \"hidden\",\n padding: \"0px\",\n position: \"absolute\",\n whiteSpace: \"nowrap\",\n width: \"1px\",\n },\n \"aria-checked\": resolvedChecked,\n checked: resolvedChecked,\n disabled,\n readOnly,\n required,\n value,\n onBlur: handlerAll(props.onBlur, onBlur, () => setFocused(false)),\n onChange: handlerAll(props.onChange, onChange),\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 resolvedChecked,\n onChange,\n onBlur,\n onFocus,\n onKeyDown,\n onKeyUp,\n ],\n )\n\n const getLabelProps: PropGetter<\"span\"> = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref,\n \"data-checked\": dataAttr(resolvedChecked),\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 }),\n [resolvedChecked, formControlProps],\n )\n\n return {\n active,\n checked: resolvedChecked,\n focused,\n focusVisible,\n hovered,\n props: rest,\n getContainerProps,\n getIconProps,\n getInputProps,\n getLabelProps,\n }\n}\n\nexport type UseRadioReturn = ReturnType<typeof useRadio>\n"],"mappings":"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","names":["import_form_control","import_utils","import_react","import_utils","props"]}
1
+ {"version":3,"sources":["../src/radio.tsx","../src/radio-context.ts","../src/use-radio.ts"],"sourcesContent":["import type { ComponentArgs, HTMLUIProps, ThemeProps } from \"@yamada-ui/core\"\nimport type {\n ForwardedRef,\n InputHTMLAttributes,\n ReactElement,\n ReactNode,\n RefAttributes,\n} from \"react\"\nimport type { UseRadioProps } from \"./use-radio\"\nimport { omitThemeProps, ui, useComponentMultiStyle } from \"@yamada-ui/core\"\nimport { useFormControl } from \"@yamada-ui/form-control\"\nimport { cx, funcAll } from \"@yamada-ui/utils\"\nimport { forwardRef } from \"react\"\nimport { useRadioGroupContext } from \"./radio-context\"\nimport { useRadio } from \"./use-radio\"\n\ninterface RadioOptions {\n /**\n * The label of the radio.\n */\n label?: ReactNode\n /**\n * Props for icon element.\n */\n iconProps?: HTMLUIProps<\"span\">\n /**\n * Props for input element.\n */\n inputProps?: InputHTMLAttributes<HTMLInputElement>\n /**\n * Props for label element.\n */\n labelProps?: HTMLUIProps<\"span\">\n}\n\nexport interface RadioProps<Y extends number | string = string>\n extends Omit<HTMLUIProps<\"label\">, keyof UseRadioProps>,\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 number | string = 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] = useComponentMultiStyle(\"Radio\", {\n ...groupProps,\n ...props,\n })\n const {\n className,\n children,\n disabled = groupProps.disabled ?? control.disabled,\n gap = \"0.5rem\",\n invalid = groupProps.invalid ?? control.invalid,\n label,\n readOnly = groupProps.readOnly ?? control.readOnly,\n required = groupProps.required ?? control.required,\n iconProps,\n inputProps,\n labelProps,\n ...computedProps\n } = omitThemeProps(mergedProps)\n\n computedProps.checked ??= computedProps.isChecked\n\n const checkedProp =\n groupValue && computedProps.value\n ? groupValue === computedProps.value\n : computedProps.checked\n\n const onChange =\n groupProps.onChange && computedProps.value\n ? funcAll(groupProps.onChange, computedProps.onChange)\n : computedProps.onChange\n\n const {\n checked,\n props: rest,\n getContainerProps,\n getIconProps,\n getInputProps,\n getLabelProps,\n } = useRadio({\n ...computedProps,\n checked: checkedProp,\n disabled,\n invalid,\n readOnly,\n required,\n onChange,\n })\n\n const tabIndex = !groupValue ? 0 : checked ? 0 : -1\n\n return (\n <ui.label\n className={cx(\"ui-radio\", className)}\n {...getContainerProps(rest)}\n __css={{\n alignItems: \"center\",\n cursor: \"pointer\",\n display: \"inline-flex\",\n gap,\n position: \"relative\",\n verticalAlign: \"top\",\n ...styles.container,\n }}\n >\n <ui.input\n className=\"ui-radio__input\"\n {...getInputProps(\n {\n ...inputProps,\n tabIndex,\n },\n ref,\n )}\n />\n\n <ui.div\n className=\"ui-radio__icon\"\n {...getIconProps(iconProps)}\n __css={{\n display: \"inline-block\",\n position: \"relative\",\n userSelect: \"none\",\n ...styles.icon,\n }}\n />\n\n <ui.span\n className=\"ui-radio__label\"\n {...getLabelProps(labelProps)}\n __css={{ ...styles.label }}\n >\n {children ?? label}\n </ui.span>\n </ui.label>\n )\n },\n) as {\n <Y extends number | string = string>(\n props: RadioProps<Y> & RefAttributes<HTMLInputElement>,\n ): ReactElement\n} & ComponentArgs\n\nRadio.displayName = \"Radio\"\nRadio.__ui__ = \"Radio\"\n","import type {\n CSSUIObject,\n HTMLUIProps,\n PropGetter,\n ThemeProps,\n} from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport type { ChangeEvent } from \"react\"\nimport type { RadioCardProps } from \"./radio-card\"\nimport { createContext } from \"@yamada-ui/utils\"\n\ninterface RadioGroupSharedContext extends FormControlOptions {\n name: string\n value: number | string\n onChange: (evOrValue: ChangeEvent<HTMLInputElement> | number | string) => void\n}\n\nexport interface RadioGroupContext\n extends RadioGroupSharedContext,\n ThemeProps<\"Radio\"> {}\n\nexport const [RadioGroupProvider, useRadioGroupContext] =\n createContext<RadioGroupContext>({\n name: \"RadioGroupContext\",\n strict: false,\n })\n\nexport interface RadioCardGroupContext\n extends RadioGroupSharedContext,\n Pick<\n RadioCardProps,\n \"addonProps\" | \"descriptionProps\" | \"labelProps\" | \"withIcon\"\n >,\n ThemeProps<\"RadioCard\"> {}\n\nexport const [RadioCardGroupProvider, useRadioCardGroupContext] =\n createContext<RadioCardGroupContext>({\n name: \"RadioCardGroupContext\",\n strict: false,\n })\n\nexport interface RadioCardContext {\n styles: { [key: string]: CSSUIObject | undefined }\n withIcon: boolean\n getIconProps: PropGetter\n iconProps?: HTMLUIProps\n}\n\nexport const [RadioCardProvider, useRadioCardContext] =\n createContext<RadioCardContext>({\n name: \"RadioCardContext\",\n errorMessage: `useRadioCardContext returned is 'undefined'. Seems you forgot to wrap the components in \"<RadioCard />\"`,\n })\n","import type { PropGetter } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport type { Dict } from \"@yamada-ui/utils\"\nimport type {\n ChangeEvent,\n ChangeEventHandler,\n KeyboardEvent,\n SyntheticEvent,\n} from \"react\"\nimport {\n formControlProperties,\n useFormControlProps,\n} from \"@yamada-ui/form-control\"\nimport { trackFocusVisible } from \"@yamada-ui/use-focus-visible\"\nimport {\n dataAttr,\n handlerAll,\n splitObject,\n useCallbackRef,\n} from \"@yamada-ui/utils\"\nimport { useCallback, useEffect, useId, useState } from \"react\"\n\nexport interface UseRadioProps<Y extends number | string = string>\n extends 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 * If `true`, the radio will be checked.\n *\n * @default false\n */\n checked?: boolean\n /**\n * If `true`, the radio will be initially checked.\n *\n * @default false\n */\n defaultChecked?: boolean\n /**\n * If `true`, the radio will be initially checked.\n *\n * @default false\n *\n * @deprecated Use `defaultChecked` instead.\n */\n defaultIsChecked?: boolean\n /**\n * If `true`, the radio will be checked.\n *\n * @default false\n *\n * @deprecated Use `checked` instead.\n */\n isChecked?: boolean\n /**\n * The value to be used in the radio button.\n */\n value?: Y\n /**\n * The callback invoked when the checked state changes.\n */\n onChange?: ChangeEventHandler<HTMLInputElement>\n}\n\nexport const useRadio = <\n Y extends number | string = string,\n M extends Dict = Dict,\n>({\n id,\n ...props\n}: M & UseRadioProps<Y>) => {\n const uuid = useId()\n\n id ??= uuid\n\n const {\n id: _id,\n name,\n isChecked,\n checked: checkedProp = isChecked,\n defaultIsChecked,\n defaultChecked = defaultIsChecked,\n value,\n onChange: onChangeProp,\n ...computedProps\n } = useFormControlProps({ id, ...props })\n const [\n {\n \"aria-readonly\": _ariaReadonly,\n disabled,\n readOnly,\n required,\n onBlur: onBlurProp,\n onFocus: onFocusProp,\n ...formControlProps\n },\n rest,\n ] = splitObject(computedProps, formControlProperties)\n const [focusVisible, setFocusVisible] = useState<boolean>(false)\n const [focused, setFocused] = useState<boolean>(false)\n const [hovered, setHovered] = useState<boolean>(false)\n const [active, setActive] = useState<boolean>(false)\n const [checked, setChecked] = useState<boolean>(!!defaultChecked)\n const controlled = checkedProp !== undefined\n const resolvedChecked = controlled ? (checkedProp as boolean) : checked\n\n useEffect(() => {\n return trackFocusVisible(setFocusVisible)\n }, [])\n\n const onChange = useCallbackRef(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if (readOnly || disabled) {\n ev.preventDefault()\n\n return\n }\n\n if (!controlled) setChecked(ev.target.checked)\n\n onChangeProp?.(ev)\n },\n [readOnly, disabled, controlled],\n )\n const onFocus = useCallbackRef(onFocusProp)\n const onBlur = useCallbackRef(onBlurProp)\n\n const onKeyDown = useCallback(\n ({ key }: KeyboardEvent) => {\n if (key === \" \") setActive(true)\n },\n [setActive],\n )\n\n const onKeyUp = useCallback(\n ({ key }: KeyboardEvent) => {\n if (key === \" \") setActive(false)\n },\n [setActive],\n )\n\n const getContainerProps: PropGetter<\"label\"> = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref,\n \"data-checked\": dataAttr(resolvedChecked),\n \"data-focus\": dataAttr(focused),\n \"data-focus-visible\": dataAttr(focused && focusVisible),\n }),\n [resolvedChecked, formControlProps, focused, focusVisible],\n )\n\n const getIconProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref,\n \"aria-hidden\": true,\n \"data-active\": dataAttr(active),\n \"data-checked\": dataAttr(resolvedChecked),\n \"data-focus\": dataAttr(focused),\n \"data-focus-visible\": dataAttr(focused && focusVisible),\n \"data-hover\": dataAttr(hovered),\n onMouseDown: handlerAll(props.onMouseDown, () => setActive(true)),\n onMouseEnter: handlerAll(props.onMouseEnter, () => setHovered(true)),\n onMouseLeave: handlerAll(props.onMouseLeave, () => setHovered(false)),\n onMouseUp: handlerAll(props.onMouseUp, () => setActive(false)),\n }),\n [resolvedChecked, active, focused, focusVisible, hovered, formControlProps],\n )\n\n const getInputProps: PropGetter<\"input\"> = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n id,\n ref,\n type: \"radio\",\n name,\n style: {\n border: \"0px\",\n clip: \"rect(0px, 0px, 0px, 0px)\",\n height: \"1px\",\n margin: \"-1px\",\n overflow: \"hidden\",\n padding: \"0px\",\n position: \"absolute\",\n whiteSpace: \"nowrap\",\n width: \"1px\",\n },\n \"aria-checked\": resolvedChecked,\n checked: resolvedChecked,\n disabled,\n readOnly,\n required,\n value,\n onBlur: handlerAll(props.onBlur, onBlur, () => setFocused(false)),\n onChange: handlerAll(props.onChange, onChange),\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 resolvedChecked,\n onChange,\n onBlur,\n onFocus,\n onKeyDown,\n onKeyUp,\n ],\n )\n\n const getLabelProps: PropGetter<\"span\"> = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref,\n \"data-checked\": dataAttr(resolvedChecked),\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 }),\n [resolvedChecked, formControlProps],\n )\n\n return {\n active,\n checked: resolvedChecked,\n focused,\n focusVisible,\n hovered,\n /**\n * @deprecated Use `active` instead.\n */\n isActive: active,\n /**\n * @deprecated Use `checked` instead.\n */\n isChecked: resolvedChecked,\n /**\n * @deprecated Use `focused` instead.\n */\n isFocused: focused,\n /**\n * @deprecated Use `focusVisible` instead.\n */\n isFocusVisible: focusVisible,\n /**\n * @deprecated Use `hovered` instead.\n */\n isHovered: hovered,\n props: rest,\n getContainerProps,\n getIconProps,\n getInputProps,\n getLabelProps,\n }\n}\n\nexport type UseRadioReturn = ReturnType<typeof useRadio>\n"],"mappings":"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","names":["import_form_control","import_utils","import_react","import_utils","props"]}
package/dist/radio.mjs CHANGED
@@ -1,8 +1,8 @@
1
1
  "use client"
2
2
  import {
3
3
  Radio
4
- } from "./chunk-JLL7F3NY.mjs";
5
- import "./chunk-HFS5TQ47.mjs";
4
+ } from "./chunk-RA4K44ZS.mjs";
5
+ import "./chunk-QJKELJFS.mjs";
6
6
  import "./chunk-ZLJHOIFP.mjs";
7
7
  export {
8
8
  Radio
@@ -40,13 +40,13 @@ var useRadioGroup = ({
40
40
  const uuid = (0, import_react.useId)();
41
41
  id != null ? id : id = uuid;
42
42
  name != null ? name : name = `radio-${id}`;
43
+ const containerRef = (0, import_react.useRef)(null);
43
44
  const onChangeRef = (0, import_utils.useCallbackRef)(onChangeProp);
44
45
  const [value, setValue] = (0, import_use_controllable_state.useControllableState)({
45
46
  defaultValue,
46
47
  value: valueProp,
47
48
  onChange: onChangeRef
48
49
  });
49
- const containerRef = (0, import_react.useRef)(null);
50
50
  const onFocus = (0, import_react.useCallback)(() => {
51
51
  const container = containerRef.current;
52
52
  if (!container) return;
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/use-radio-group.ts"],"sourcesContent":["import type { PropGetter } from \"@yamada-ui/core\"\nimport type { Dict } from \"@yamada-ui/utils\"\nimport type { ChangeEvent } from \"react\"\nimport { useControllableState } from \"@yamada-ui/use-controllable-state\"\nimport { isObject, mergeRefs, useCallbackRef } from \"@yamada-ui/utils\"\nimport { useCallback, useId, useRef } from \"react\"\n\nconst isEvent = (value: any): value is { target: HTMLInputElement } =>\n value && isObject(value) && isObject(value.target)\n\nexport interface UseRadioGroupProps<Y extends number | string = 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 initial value of the radio group.\n */\n defaultValue?: Y\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 * @deprecated It will be deprecated in version 2.0.\n */\n isNative?: boolean\n /**\n * The value of the radio group.\n */\n value?: Y\n /**\n * The callback fired when any children radio is checked or unchecked.\n */\n onChange?: (value: Y) => void\n}\n\nexport const useRadioGroup = <\n Y extends number | string,\n M extends Dict = Dict,\n>({\n id,\n name,\n defaultValue,\n isNative,\n value: valueProp,\n onChange: onChangeProp,\n ...props\n}: M & UseRadioGroupProps<Y>) => {\n const uuid = useId()\n\n id ??= uuid\n name ??= `radio-${id}`\n\n const onChangeRef = useCallbackRef(onChangeProp)\n\n const [value, setValue] = useControllableState({\n defaultValue,\n value: valueProp,\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 role: \"radiogroup\",\n ...props,\n ref: mergeRefs(ref, containerRef),\n }),\n [],\n )\n\n const getRadioProps: PropGetter<\n { value?: Y },\n {\n checked?: boolean\n isChecked?: boolean\n value?: Y\n }\n > = useCallback(\n (props = {}, ref = null) => {\n const checked = props.value === value\n\n return {\n ...props,\n ref,\n name,\n \"aria-checked\": checked,\n [isNative ? \"checked\" : \"isChecked\"]:\n // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n value != null ? checked : undefined,\n onChange,\n }\n },\n [name, value, onChange, isNative],\n )\n\n return {\n id,\n name,\n props,\n setValue,\n value,\n getContainerProps,\n getRadioProps,\n onChange,\n onFocus,\n }\n}\n\nexport type UseRadioGroupReturn<Y extends number | string = string> =\n ReturnType<typeof useRadioGroup<Y>>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,oCAAqC;AACrC,mBAAoD;AACpD,mBAA2C;AAE3C,IAAM,UAAU,CAAC,UACf,aAAS,uBAAS,KAAK,SAAK,uBAAS,MAAM,MAAM;AAoC5C,IAAM,gBAAgB,CAG3B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,UAAU;AAAA,EACV,GAAG;AACL,MAAiC;AAC/B,QAAM,WAAO,oBAAM;AAEnB,yBAAO;AACP,+BAAS,SAAS,EAAE;AAEpB,QAAM,kBAAc,6BAAe,YAAY;AAE/C,QAAM,CAAC,OAAO,QAAQ,QAAI,oDAAqB;AAAA,IAC7C;AAAA,IACA,OAAO;AAAA,IACP,UAAU;AAAA,EACZ,CAAC;AAED,QAAM,mBAAe,qBAAY,IAAI;AAErC,QAAM,cAAU,0BAAY,MAAM;AAChC,UAAM,YAAY,aAAa;AAE/B,QAAI,CAAC,UAAW;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,CAACA,SAAQ,CAAC,GAAG,MAAM,UAAU;AAAA,MAC3B,MAAM;AAAA,MACN,GAAGA;AAAA,MACH,SAAK,wBAAU,KAAK,YAAY;AAAA,IAClC;AAAA,IACA,CAAC;AAAA,EACH;AAEA,QAAM,oBAOF;AAAA,IACF,CAACA,SAAQ,CAAC,GAAG,MAAM,SAAS;AAC1B,YAAM,UAAUA,OAAM,UAAU;AAEhC,aAAO;AAAA,QACL,GAAGA;AAAA,QACH;AAAA,QACA;AAAA,QACA,gBAAgB;AAAA,QAChB,CAAC,WAAW,YAAY,WAAW;AAAA;AAAA,UAEjC,SAAS,OAAO,UAAU;AAAA;AAAA,QAC5B;AAAA,MACF;AAAA,IACF;AAAA,IACA,CAAC,MAAM,OAAO,UAAU,QAAQ;AAAA,EAClC;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;","names":["props"]}
1
+ {"version":3,"sources":["../src/use-radio-group.ts"],"sourcesContent":["import type { PropGetter } from \"@yamada-ui/core\"\nimport type { Dict } from \"@yamada-ui/utils\"\nimport type { ChangeEvent } from \"react\"\nimport { useControllableState } from \"@yamada-ui/use-controllable-state\"\nimport { isObject, mergeRefs, useCallbackRef } from \"@yamada-ui/utils\"\nimport { useCallback, useId, useRef } from \"react\"\n\nconst isEvent = (value: any): value is { target: HTMLInputElement } =>\n value && isObject(value) && isObject(value.target)\n\nexport interface UseRadioGroupProps<Y extends number | string = 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 initial value of the radio group.\n */\n defaultValue?: Y\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 * @deprecated It will be deprecated in version 2.0.\n */\n isNative?: boolean\n /**\n * The value of the radio group.\n */\n value?: Y\n /**\n * The callback fired when any children radio is checked or unchecked.\n */\n onChange?: (value: Y) => void\n}\n\nexport const useRadioGroup = <\n Y extends number | string,\n M extends Dict = Dict,\n>({\n id,\n name,\n defaultValue,\n isNative,\n value: valueProp,\n onChange: onChangeProp,\n ...props\n}: M & UseRadioGroupProps<Y>) => {\n const uuid = useId()\n\n id ??= uuid\n name ??= `radio-${id}`\n\n const containerRef = useRef<any>(null)\n const onChangeRef = useCallbackRef(onChangeProp)\n const [value, setValue] = useControllableState({\n defaultValue,\n value: valueProp,\n onChange: onChangeRef,\n })\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 role: \"radiogroup\",\n ...props,\n ref: mergeRefs(ref, containerRef),\n }),\n [],\n )\n\n const getRadioProps: PropGetter<\n { value?: Y },\n {\n checked?: boolean\n isChecked?: boolean\n value?: Y\n }\n > = useCallback(\n (props = {}, ref = null) => {\n const checked = props.value === value\n\n return {\n ...props,\n ref,\n name,\n \"aria-checked\": checked,\n [isNative ? \"checked\" : \"isChecked\"]:\n // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n value != null ? checked : undefined,\n onChange,\n }\n },\n [name, value, onChange, isNative],\n )\n\n return {\n id,\n name,\n props,\n setValue,\n value,\n getContainerProps,\n getRadioProps,\n onChange,\n onFocus,\n }\n}\n\nexport type UseRadioGroupReturn<Y extends number | string = string> =\n ReturnType<typeof useRadioGroup<Y>>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,oCAAqC;AACrC,mBAAoD;AACpD,mBAA2C;AAE3C,IAAM,UAAU,CAAC,UACf,aAAS,uBAAS,KAAK,SAAK,uBAAS,MAAM,MAAM;AAoC5C,IAAM,gBAAgB,CAG3B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,UAAU;AAAA,EACV,GAAG;AACL,MAAiC;AAC/B,QAAM,WAAO,oBAAM;AAEnB,yBAAO;AACP,+BAAS,SAAS,EAAE;AAEpB,QAAM,mBAAe,qBAAY,IAAI;AACrC,QAAM,kBAAc,6BAAe,YAAY;AAC/C,QAAM,CAAC,OAAO,QAAQ,QAAI,oDAAqB;AAAA,IAC7C;AAAA,IACA,OAAO;AAAA,IACP,UAAU;AAAA,EACZ,CAAC;AAED,QAAM,cAAU,0BAAY,MAAM;AAChC,UAAM,YAAY,aAAa;AAE/B,QAAI,CAAC,UAAW;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,CAACA,SAAQ,CAAC,GAAG,MAAM,UAAU;AAAA,MAC3B,MAAM;AAAA,MACN,GAAGA;AAAA,MACH,SAAK,wBAAU,KAAK,YAAY;AAAA,IAClC;AAAA,IACA,CAAC;AAAA,EACH;AAEA,QAAM,oBAOF;AAAA,IACF,CAACA,SAAQ,CAAC,GAAG,MAAM,SAAS;AAC1B,YAAM,UAAUA,OAAM,UAAU;AAEhC,aAAO;AAAA,QACL,GAAGA;AAAA,QACH;AAAA,QACA;AAAA,QACA,gBAAgB;AAAA,QAChB,CAAC,WAAW,YAAY,WAAW;AAAA;AAAA,UAEjC,SAAS,OAAO,UAAU;AAAA;AAAA,QAC5B;AAAA,MACF;AAAA,IACF;AAAA,IACA,CAAC,MAAM,OAAO,UAAU,QAAQ;AAAA,EAClC;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;","names":["props"]}
@@ -1,7 +1,7 @@
1
1
  "use client"
2
2
  import {
3
3
  useRadioGroup
4
- } from "./chunk-TSA4YXU3.mjs";
4
+ } from "./chunk-UXJ5W7LK.mjs";
5
5
  export {
6
6
  useRadioGroup
7
7
  };
@@ -57,6 +57,26 @@ declare const useRadio: <Y extends number | string = string, M extends Dict = Di
57
57
  focused: boolean;
58
58
  focusVisible: boolean;
59
59
  hovered: boolean;
60
+ /**
61
+ * @deprecated Use `active` instead.
62
+ */
63
+ isActive: boolean;
64
+ /**
65
+ * @deprecated Use `checked` instead.
66
+ */
67
+ isChecked: boolean;
68
+ /**
69
+ * @deprecated Use `focused` instead.
70
+ */
71
+ isFocused: boolean;
72
+ /**
73
+ * @deprecated Use `focusVisible` instead.
74
+ */
75
+ isFocusVisible: boolean;
76
+ /**
77
+ * @deprecated Use `hovered` instead.
78
+ */
79
+ isHovered: boolean;
60
80
  props: Omit<Omit<{
61
81
  _active?: {} | undefined;
62
82
  _focus?: {} | undefined;
@@ -57,6 +57,26 @@ declare const useRadio: <Y extends number | string = string, M extends Dict = Di
57
57
  focused: boolean;
58
58
  focusVisible: boolean;
59
59
  hovered: boolean;
60
+ /**
61
+ * @deprecated Use `active` instead.
62
+ */
63
+ isActive: boolean;
64
+ /**
65
+ * @deprecated Use `checked` instead.
66
+ */
67
+ isChecked: boolean;
68
+ /**
69
+ * @deprecated Use `focused` instead.
70
+ */
71
+ isFocused: boolean;
72
+ /**
73
+ * @deprecated Use `focusVisible` instead.
74
+ */
75
+ isFocusVisible: boolean;
76
+ /**
77
+ * @deprecated Use `hovered` instead.
78
+ */
79
+ isHovered: boolean;
60
80
  props: Omit<Omit<{
61
81
  _active?: {} | undefined;
62
82
  _focus?: {} | undefined;
package/dist/use-radio.js CHANGED
@@ -34,19 +34,17 @@ var useRadio = ({
34
34
  }) => {
35
35
  const uuid = (0, import_react.useId)();
36
36
  id != null ? id : id = uuid;
37
- let {
37
+ const {
38
38
  id: _id,
39
39
  name,
40
- checked: checkedProp,
41
- defaultChecked,
40
+ isChecked,
41
+ checked: checkedProp = isChecked,
42
42
  defaultIsChecked,
43
- isChecked: isCheckedProp,
43
+ defaultChecked = defaultIsChecked,
44
44
  value,
45
45
  onChange: onChangeProp,
46
46
  ...computedProps
47
47
  } = (0, import_form_control.useFormControlProps)({ id, ...props });
48
- checkedProp != null ? checkedProp : checkedProp = isCheckedProp;
49
- defaultChecked != null ? defaultChecked : defaultChecked = defaultIsChecked;
50
48
  const [
51
49
  {
52
50
  "aria-readonly": _ariaReadonly,
@@ -193,6 +191,26 @@ var useRadio = ({
193
191
  focused,
194
192
  focusVisible,
195
193
  hovered,
194
+ /**
195
+ * @deprecated Use `active` instead.
196
+ */
197
+ isActive: active,
198
+ /**
199
+ * @deprecated Use `checked` instead.
200
+ */
201
+ isChecked: resolvedChecked,
202
+ /**
203
+ * @deprecated Use `focused` instead.
204
+ */
205
+ isFocused: focused,
206
+ /**
207
+ * @deprecated Use `focusVisible` instead.
208
+ */
209
+ isFocusVisible: focusVisible,
210
+ /**
211
+ * @deprecated Use `hovered` instead.
212
+ */
213
+ isHovered: hovered,
196
214
  props: rest,
197
215
  getContainerProps,
198
216
  getIconProps,
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/use-radio.ts"],"sourcesContent":["import type { PropGetter } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport type { Dict } from \"@yamada-ui/utils\"\nimport type {\n ChangeEvent,\n ChangeEventHandler,\n KeyboardEvent,\n SyntheticEvent,\n} from \"react\"\nimport {\n formControlProperties,\n useFormControlProps,\n} from \"@yamada-ui/form-control\"\nimport { trackFocusVisible } from \"@yamada-ui/use-focus-visible\"\nimport {\n dataAttr,\n handlerAll,\n splitObject,\n useCallbackRef,\n} from \"@yamada-ui/utils\"\nimport { useCallback, useEffect, useId, useState } from \"react\"\n\nexport interface UseRadioProps<Y extends number | string = string>\n extends 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 * If `true`, the radio will be checked.\n *\n * @default false\n */\n checked?: boolean\n /**\n * If `true`, the radio will be initially checked.\n *\n * @default false\n */\n defaultChecked?: boolean\n /**\n * If `true`, the radio will be initially checked.\n *\n * @default false\n *\n * @deprecated Use `defaultChecked` instead.\n */\n defaultIsChecked?: boolean\n /**\n * If `true`, the radio will be checked.\n *\n * @default false\n *\n * @deprecated Use `checked` instead.\n */\n isChecked?: boolean\n /**\n * The value to be used in the radio button.\n */\n value?: Y\n /**\n * The callback invoked when the checked state changes.\n */\n onChange?: ChangeEventHandler<HTMLInputElement>\n}\n\nexport const useRadio = <\n Y extends number | string = string,\n M extends Dict = Dict,\n>({\n id,\n ...props\n}: M & UseRadioProps<Y>) => {\n const uuid = useId()\n\n id ??= uuid\n\n let {\n id: _id,\n name,\n checked: checkedProp,\n defaultChecked,\n defaultIsChecked,\n isChecked: isCheckedProp,\n value,\n onChange: onChangeProp,\n ...computedProps\n } = useFormControlProps({ id, ...props })\n\n checkedProp ??= isCheckedProp\n defaultChecked ??= defaultIsChecked\n\n const [\n {\n \"aria-readonly\": _ariaReadonly,\n disabled,\n readOnly,\n required,\n onBlur: onBlurProp,\n onFocus: onFocusProp,\n ...formControlProps\n },\n rest,\n ] = splitObject(computedProps, formControlProperties)\n\n const [focusVisible, setFocusVisible] = useState<boolean>(false)\n const [focused, setFocused] = useState<boolean>(false)\n const [hovered, setHovered] = useState<boolean>(false)\n const [active, setActive] = useState<boolean>(false)\n\n const [checked, setChecked] = useState<boolean>(!!defaultChecked)\n\n const controlled = checkedProp !== undefined\n const resolvedChecked = controlled ? (checkedProp as boolean) : checked\n\n useEffect(() => {\n return trackFocusVisible(setFocusVisible)\n }, [])\n\n const onChange = useCallbackRef(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if (readOnly || disabled) {\n ev.preventDefault()\n\n return\n }\n\n if (!controlled) setChecked(ev.target.checked)\n\n onChangeProp?.(ev)\n },\n [readOnly, disabled, controlled],\n )\n const onFocus = useCallbackRef(onFocusProp)\n const onBlur = useCallbackRef(onBlurProp)\n\n const onKeyDown = useCallback(\n ({ key }: KeyboardEvent) => {\n if (key === \" \") setActive(true)\n },\n [setActive],\n )\n\n const onKeyUp = useCallback(\n ({ key }: KeyboardEvent) => {\n if (key === \" \") setActive(false)\n },\n [setActive],\n )\n\n const getContainerProps: PropGetter<\"label\"> = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref,\n \"data-checked\": dataAttr(resolvedChecked),\n \"data-focus\": dataAttr(focused),\n \"data-focus-visible\": dataAttr(focused && focusVisible),\n }),\n [resolvedChecked, formControlProps, focused, focusVisible],\n )\n\n const getIconProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref,\n \"aria-hidden\": true,\n \"data-active\": dataAttr(active),\n \"data-checked\": dataAttr(resolvedChecked),\n \"data-focus\": dataAttr(focused),\n \"data-focus-visible\": dataAttr(focused && focusVisible),\n \"data-hover\": dataAttr(hovered),\n onMouseDown: handlerAll(props.onMouseDown, () => setActive(true)),\n onMouseEnter: handlerAll(props.onMouseEnter, () => setHovered(true)),\n onMouseLeave: handlerAll(props.onMouseLeave, () => setHovered(false)),\n onMouseUp: handlerAll(props.onMouseUp, () => setActive(false)),\n }),\n [resolvedChecked, active, focused, focusVisible, hovered, formControlProps],\n )\n\n const getInputProps: PropGetter<\"input\"> = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n id,\n ref,\n type: \"radio\",\n name,\n style: {\n border: \"0px\",\n clip: \"rect(0px, 0px, 0px, 0px)\",\n height: \"1px\",\n margin: \"-1px\",\n overflow: \"hidden\",\n padding: \"0px\",\n position: \"absolute\",\n whiteSpace: \"nowrap\",\n width: \"1px\",\n },\n \"aria-checked\": resolvedChecked,\n checked: resolvedChecked,\n disabled,\n readOnly,\n required,\n value,\n onBlur: handlerAll(props.onBlur, onBlur, () => setFocused(false)),\n onChange: handlerAll(props.onChange, onChange),\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 resolvedChecked,\n onChange,\n onBlur,\n onFocus,\n onKeyDown,\n onKeyUp,\n ],\n )\n\n const getLabelProps: PropGetter<\"span\"> = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref,\n \"data-checked\": dataAttr(resolvedChecked),\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 }),\n [resolvedChecked, formControlProps],\n )\n\n return {\n active,\n checked: resolvedChecked,\n focused,\n focusVisible,\n hovered,\n props: rest,\n getContainerProps,\n getIconProps,\n getInputProps,\n getLabelProps,\n }\n}\n\nexport type UseRadioReturn = ReturnType<typeof useRadio>\n"],"mappings":"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","names":["props"]}
1
+ {"version":3,"sources":["../src/use-radio.ts"],"sourcesContent":["import type { PropGetter } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport type { Dict } from \"@yamada-ui/utils\"\nimport type {\n ChangeEvent,\n ChangeEventHandler,\n KeyboardEvent,\n SyntheticEvent,\n} from \"react\"\nimport {\n formControlProperties,\n useFormControlProps,\n} from \"@yamada-ui/form-control\"\nimport { trackFocusVisible } from \"@yamada-ui/use-focus-visible\"\nimport {\n dataAttr,\n handlerAll,\n splitObject,\n useCallbackRef,\n} from \"@yamada-ui/utils\"\nimport { useCallback, useEffect, useId, useState } from \"react\"\n\nexport interface UseRadioProps<Y extends number | string = string>\n extends 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 * If `true`, the radio will be checked.\n *\n * @default false\n */\n checked?: boolean\n /**\n * If `true`, the radio will be initially checked.\n *\n * @default false\n */\n defaultChecked?: boolean\n /**\n * If `true`, the radio will be initially checked.\n *\n * @default false\n *\n * @deprecated Use `defaultChecked` instead.\n */\n defaultIsChecked?: boolean\n /**\n * If `true`, the radio will be checked.\n *\n * @default false\n *\n * @deprecated Use `checked` instead.\n */\n isChecked?: boolean\n /**\n * The value to be used in the radio button.\n */\n value?: Y\n /**\n * The callback invoked when the checked state changes.\n */\n onChange?: ChangeEventHandler<HTMLInputElement>\n}\n\nexport const useRadio = <\n Y extends number | string = string,\n M extends Dict = Dict,\n>({\n id,\n ...props\n}: M & UseRadioProps<Y>) => {\n const uuid = useId()\n\n id ??= uuid\n\n const {\n id: _id,\n name,\n isChecked,\n checked: checkedProp = isChecked,\n defaultIsChecked,\n defaultChecked = defaultIsChecked,\n value,\n onChange: onChangeProp,\n ...computedProps\n } = useFormControlProps({ id, ...props })\n const [\n {\n \"aria-readonly\": _ariaReadonly,\n disabled,\n readOnly,\n required,\n onBlur: onBlurProp,\n onFocus: onFocusProp,\n ...formControlProps\n },\n rest,\n ] = splitObject(computedProps, formControlProperties)\n const [focusVisible, setFocusVisible] = useState<boolean>(false)\n const [focused, setFocused] = useState<boolean>(false)\n const [hovered, setHovered] = useState<boolean>(false)\n const [active, setActive] = useState<boolean>(false)\n const [checked, setChecked] = useState<boolean>(!!defaultChecked)\n const controlled = checkedProp !== undefined\n const resolvedChecked = controlled ? (checkedProp as boolean) : checked\n\n useEffect(() => {\n return trackFocusVisible(setFocusVisible)\n }, [])\n\n const onChange = useCallbackRef(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if (readOnly || disabled) {\n ev.preventDefault()\n\n return\n }\n\n if (!controlled) setChecked(ev.target.checked)\n\n onChangeProp?.(ev)\n },\n [readOnly, disabled, controlled],\n )\n const onFocus = useCallbackRef(onFocusProp)\n const onBlur = useCallbackRef(onBlurProp)\n\n const onKeyDown = useCallback(\n ({ key }: KeyboardEvent) => {\n if (key === \" \") setActive(true)\n },\n [setActive],\n )\n\n const onKeyUp = useCallback(\n ({ key }: KeyboardEvent) => {\n if (key === \" \") setActive(false)\n },\n [setActive],\n )\n\n const getContainerProps: PropGetter<\"label\"> = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref,\n \"data-checked\": dataAttr(resolvedChecked),\n \"data-focus\": dataAttr(focused),\n \"data-focus-visible\": dataAttr(focused && focusVisible),\n }),\n [resolvedChecked, formControlProps, focused, focusVisible],\n )\n\n const getIconProps: PropGetter = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref,\n \"aria-hidden\": true,\n \"data-active\": dataAttr(active),\n \"data-checked\": dataAttr(resolvedChecked),\n \"data-focus\": dataAttr(focused),\n \"data-focus-visible\": dataAttr(focused && focusVisible),\n \"data-hover\": dataAttr(hovered),\n onMouseDown: handlerAll(props.onMouseDown, () => setActive(true)),\n onMouseEnter: handlerAll(props.onMouseEnter, () => setHovered(true)),\n onMouseLeave: handlerAll(props.onMouseLeave, () => setHovered(false)),\n onMouseUp: handlerAll(props.onMouseUp, () => setActive(false)),\n }),\n [resolvedChecked, active, focused, focusVisible, hovered, formControlProps],\n )\n\n const getInputProps: PropGetter<\"input\"> = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n id,\n ref,\n type: \"radio\",\n name,\n style: {\n border: \"0px\",\n clip: \"rect(0px, 0px, 0px, 0px)\",\n height: \"1px\",\n margin: \"-1px\",\n overflow: \"hidden\",\n padding: \"0px\",\n position: \"absolute\",\n whiteSpace: \"nowrap\",\n width: \"1px\",\n },\n \"aria-checked\": resolvedChecked,\n checked: resolvedChecked,\n disabled,\n readOnly,\n required,\n value,\n onBlur: handlerAll(props.onBlur, onBlur, () => setFocused(false)),\n onChange: handlerAll(props.onChange, onChange),\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 resolvedChecked,\n onChange,\n onBlur,\n onFocus,\n onKeyDown,\n onKeyUp,\n ],\n )\n\n const getLabelProps: PropGetter<\"span\"> = useCallback(\n (props = {}, ref = null) => ({\n ...formControlProps,\n ...props,\n ref,\n \"data-checked\": dataAttr(resolvedChecked),\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 }),\n [resolvedChecked, formControlProps],\n )\n\n return {\n active,\n checked: resolvedChecked,\n focused,\n focusVisible,\n hovered,\n /**\n * @deprecated Use `active` instead.\n */\n isActive: active,\n /**\n * @deprecated Use `checked` instead.\n */\n isChecked: resolvedChecked,\n /**\n * @deprecated Use `focused` instead.\n */\n isFocused: focused,\n /**\n * @deprecated Use `focusVisible` instead.\n */\n isFocusVisible: focusVisible,\n /**\n * @deprecated Use `hovered` instead.\n */\n isHovered: hovered,\n props: rest,\n getContainerProps,\n getIconProps,\n getInputProps,\n getLabelProps,\n }\n}\n\nexport type UseRadioReturn = ReturnType<typeof useRadio>\n"],"mappings":"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","names":["props"]}
@@ -1,7 +1,7 @@
1
1
  "use client"
2
2
  import {
3
3
  useRadio
4
- } from "./chunk-HFS5TQ47.mjs";
4
+ } from "./chunk-QJKELJFS.mjs";
5
5
  export {
6
6
  useRadio
7
7
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@yamada-ui/radio",
3
- "version": "1.3.2-dev-20241213213653",
3
+ "version": "1.3.2-dev-20241215203956",
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.16.2-dev-20241213213653",
40
- "@yamada-ui/form-control": "2.1.11-dev-20241213213653",
41
- "@yamada-ui/layouts": "1.3.2-dev-20241213213653",
42
- "@yamada-ui/use-controllable-state": "1.0.26-dev-20241213213653",
43
- "@yamada-ui/use-focus-visible": "1.1.13-dev-20241213213653",
44
- "@yamada-ui/utils": "1.6.2-dev-20241213213653"
39
+ "@yamada-ui/core": "1.16.2-dev-20241215203956",
40
+ "@yamada-ui/form-control": "2.1.11-dev-20241215203956",
41
+ "@yamada-ui/layouts": "1.3.2-dev-20241215203956",
42
+ "@yamada-ui/use-controllable-state": "1.0.26-dev-20241215203956",
43
+ "@yamada-ui/use-focus-visible": "1.1.13-dev-20241215203956",
44
+ "@yamada-ui/utils": "1.6.2-dev-20241215203956"
45
45
  },
46
46
  "devDependencies": {
47
47
  "clean-package": "2.2.0",
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/radio-group.tsx"],"sourcesContent":["import type { ComponentArgs, ThemeProps } from \"@yamada-ui/core\"\nimport type { FormControlOptions } from \"@yamada-ui/form-control\"\nimport type { FlexProps } from \"@yamada-ui/layouts\"\nimport type { ForwardedRef, ReactElement, RefAttributes } from \"react\"\nimport type { RadioProps } from \"./radio\"\nimport type { RadioGroupContext } from \"./radio-context\"\nimport type { UseRadioGroupProps } from \"./use-radio-group\"\nimport { useFormControl } from \"@yamada-ui/form-control\"\nimport { Flex } from \"@yamada-ui/layouts\"\nimport { cx, getValidChildren } from \"@yamada-ui/utils\"\nimport { forwardRef } from \"react\"\nimport { Radio } from \"./radio\"\nimport { RadioGroupProvider } from \"./radio-context\"\nimport { useRadioGroup } from \"./use-radio-group\"\n\nexport type RadioItem<Y extends number | string = string> = RadioProps<Y>\n\nexport interface RadioGroupSharedProps<Y extends number | string = string>\n extends Omit<FlexProps, \"defaultValue\" | \"onChange\">,\n UseRadioGroupProps<Y>,\n FormControlOptions {}\n\nexport interface RadioGroupProps<Y extends number | string = string>\n extends RadioGroupSharedProps<Y>,\n ThemeProps<\"Radio\"> {\n /**\n * If provided, generate radios based on items.\n *\n * @default '[]'\n */\n items?: RadioItem<Y>[]\n}\n\n/**\n * `RadioGroup` is a component that groups `Radio` components.\n *\n * @see Docs https://yamada-ui.com/components/forms/radio\n */\nexport const RadioGroup = forwardRef(\n <Y extends number | string = string>(\n {\n id: idProp,\n className,\n colorScheme,\n size,\n variant,\n children,\n direction = \"column\",\n gap,\n items = [],\n ...props\n }: RadioGroupProps<Y>,\n ref: ForwardedRef<HTMLDivElement>,\n ) => {\n const {\n isDisabled,\n isInvalid,\n isReadOnly,\n isRequired,\n labelId,\n ...computedProps\n } = useFormControl({\n id: idProp,\n ...props,\n })\n const {\n id,\n name,\n props: rest,\n value,\n getContainerProps,\n onChange,\n } = useRadioGroup(computedProps)\n\n const validChildren = getValidChildren(children)\n let computedChildren: ReactElement[] = []\n\n if (!validChildren.length && items.length)\n computedChildren = items.map((props, index) => (\n <Radio key={index} {...props} />\n ))\n\n return (\n <RadioGroupProvider\n value={\n {\n name,\n colorScheme,\n size,\n variant,\n isDisabled,\n isInvalid,\n isReadOnly,\n isRequired,\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 id,\n \"aria-labelledby\": labelId,\n ...rest,\n })}\n direction={direction}\n >\n {children ?? computedChildren}\n </Flex>\n </RadioGroupProvider>\n )\n },\n) as {\n <Y extends number | string = string>(\n props: RadioGroupProps<Y> & RefAttributes<HTMLDivElement>,\n ): ReactElement\n} & ComponentArgs\n\nRadioGroup.displayName = \"RadioGroup\"\nRadioGroup.__ui__ = \"RadioGroup\"\n"],"mappings":";;;;;;;;;;;;AAOA,SAAS,sBAAsB;AAC/B,SAAS,YAAY;AACrB,SAAS,IAAI,wBAAwB;AACrC,SAAS,kBAAkB;AAqEnB;AAzCD,IAAM,aAAa;AAAA,EACxB,CACE;AAAA,IACE,IAAI;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,YAAY;AAAA,IACZ;AAAA,IACA,QAAQ,CAAC;AAAA,IACT,GAAG;AAAA,EACL,GACA,QACG;AACH,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,IACL,IAAI,eAAe;AAAA,MACjB,IAAI;AAAA,MACJ,GAAG;AAAA,IACL,CAAC;AACD,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA,OAAO;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,IACF,IAAI,cAAc,aAAa;AAE/B,UAAM,gBAAgB,iBAAiB,QAAQ;AAC/C,QAAI,mBAAmC,CAAC;AAExC,QAAI,CAAC,cAAc,UAAU,MAAM;AACjC,yBAAmB,MAAM,IAAI,CAACA,QAAO,UACnC,oBAAC,SAAmB,GAAGA,UAAX,KAAkB,CAC/B;AAEH,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,WAAW,GAAG,kBAAkB,SAAS;AAAA,YACzC,KAAK,oBAAQ,cAAc,QAAQ,SAAS;AAAA,YAC3C,GAAG,kBAAkB;AAAA,cACpB;AAAA,cACA,mBAAmB;AAAA,cACnB,GAAG;AAAA,YACL,CAAC;AAAA,YACD;AAAA,YAEC,wCAAY;AAAA;AAAA,QACf;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAMA,WAAW,cAAc;AACzB,WAAW,SAAS;","names":["props"]}
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/radio.tsx"],"sourcesContent":["import type { ComponentArgs, HTMLUIProps, ThemeProps } from \"@yamada-ui/core\"\nimport type {\n ForwardedRef,\n InputHTMLAttributes,\n ReactElement,\n ReactNode,\n RefAttributes,\n} from \"react\"\nimport type { UseRadioProps } from \"./use-radio\"\nimport { omitThemeProps, ui, useComponentMultiStyle } from \"@yamada-ui/core\"\nimport { useFormControl } from \"@yamada-ui/form-control\"\nimport { cx, funcAll } from \"@yamada-ui/utils\"\nimport { forwardRef } from \"react\"\nimport { useRadioGroupContext } from \"./radio-context\"\nimport { useRadio } from \"./use-radio\"\n\ninterface RadioOptions {\n /**\n * The label of the radio.\n */\n label?: ReactNode\n /**\n * Props for icon element.\n */\n iconProps?: HTMLUIProps<\"span\">\n /**\n * Props for input element.\n */\n inputProps?: InputHTMLAttributes<HTMLInputElement>\n /**\n * Props for label element.\n */\n labelProps?: HTMLUIProps<\"span\">\n}\n\nexport interface RadioProps<Y extends number | string = string>\n extends Omit<HTMLUIProps<\"label\">, keyof UseRadioProps>,\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 number | string = 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] = useComponentMultiStyle(\"Radio\", {\n ...groupProps,\n ...props,\n })\n const {\n className,\n children,\n gap = \"0.5rem\",\n isDisabled = groupProps.isDisabled ?? control.isDisabled,\n isInvalid = groupProps.isInvalid ?? control.isInvalid,\n isReadOnly = groupProps.isReadOnly ?? control.isReadOnly,\n isRequired = groupProps.isRequired ?? control.isRequired,\n label,\n iconProps,\n inputProps,\n labelProps,\n ...computedProps\n } = omitThemeProps(mergedProps)\n\n computedProps.checked ??= computedProps.isChecked\n\n const checkedProp =\n groupValue && computedProps.value\n ? groupValue === computedProps.value\n : computedProps.checked\n\n const onChange =\n groupProps.onChange && computedProps.value\n ? funcAll(groupProps.onChange, computedProps.onChange)\n : computedProps.onChange\n\n const {\n checked,\n props: rest,\n getContainerProps,\n getIconProps,\n getInputProps,\n getLabelProps,\n } = useRadio({\n ...computedProps,\n checked: checkedProp,\n isDisabled,\n isInvalid,\n isReadOnly,\n isRequired,\n onChange,\n })\n\n const tabIndex = !groupValue ? 0 : checked ? 0 : -1\n\n return (\n <ui.label\n className={cx(\"ui-radio\", className)}\n {...getContainerProps(rest)}\n __css={{\n alignItems: \"center\",\n cursor: \"pointer\",\n display: \"inline-flex\",\n gap,\n position: \"relative\",\n verticalAlign: \"top\",\n ...styles.container,\n }}\n >\n <ui.input\n className=\"ui-radio__input\"\n {...getInputProps(\n {\n ...inputProps,\n tabIndex,\n },\n ref,\n )}\n />\n\n <ui.div\n className=\"ui-radio__icon\"\n {...getIconProps(iconProps)}\n __css={{\n display: \"inline-block\",\n position: \"relative\",\n userSelect: \"none\",\n ...styles.icon,\n }}\n />\n\n <ui.span\n className=\"ui-radio__label\"\n {...getLabelProps(labelProps)}\n __css={{ ...styles.label }}\n >\n {children ?? label}\n </ui.span>\n </ui.label>\n )\n },\n) as {\n <Y extends number | string = string>(\n props: RadioProps<Y> & RefAttributes<HTMLInputElement>,\n ): ReactElement\n} & ComponentArgs\n\nRadio.displayName = \"Radio\"\nRadio.__ui__ = \"Radio\"\n"],"mappings":";;;;;;;;;AASA,SAAS,gBAAgB,IAAI,8BAA8B;AAC3D,SAAS,sBAAsB;AAC/B,SAAS,IAAI,eAAe;AAC5B,SAAS,kBAAkB;AA6FrB,SAaE,KAbF;AA3DC,IAAM,QAAQ;AAAA,EACnB,CACE,OACA,QACG;AAlDP;AAmDI,UAAM,QAAQ,qBAAqB;AACnC,UAAM,EAAE,OAAO,YAAY,GAAG,WAAW,IAAI,EAAE,GAAG,MAAM;AACxD,UAAM,UAAU,eAAe,KAAK;AACpC,UAAM,CAAC,QAAQ,WAAW,IAAI,uBAAuB,SAAS;AAAA,MAC5D,GAAG;AAAA,MACH,GAAG;AAAA,IACL,CAAC;AACD,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA,MAAM;AAAA,MACN,cAAa,gBAAW,eAAX,YAAyB,QAAQ;AAAA,MAC9C,aAAY,gBAAW,cAAX,YAAwB,QAAQ;AAAA,MAC5C,cAAa,gBAAW,eAAX,YAAyB,QAAQ;AAAA,MAC9C,cAAa,gBAAW,eAAX,YAAyB,QAAQ;AAAA,MAC9C;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,IACL,IAAI,eAAe,WAAW;AAE9B,wBAAc,YAAd,0BAAc,UAAY,cAAc;AAExC,UAAM,cACJ,cAAc,cAAc,QACxB,eAAe,cAAc,QAC7B,cAAc;AAEpB,UAAM,WACJ,WAAW,YAAY,cAAc,QACjC,QAAQ,WAAW,UAAU,cAAc,QAAQ,IACnD,cAAc;AAEpB,UAAM;AAAA,MACJ;AAAA,MACA,OAAO;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF,IAAI,SAAS;AAAA,MACX,GAAG;AAAA,MACH,SAAS;AAAA,MACT;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF,CAAC;AAED,UAAM,WAAW,CAAC,aAAa,IAAI,UAAU,IAAI;AAEjD,WACE;AAAA,MAAC,GAAG;AAAA,MAAH;AAAA,QACC,WAAW,GAAG,YAAY,SAAS;AAAA,QAClC,GAAG,kBAAkB,IAAI;AAAA,QAC1B,OAAO;AAAA,UACL,YAAY;AAAA,UACZ,QAAQ;AAAA,UACR,SAAS;AAAA,UACT;AAAA,UACA,UAAU;AAAA,UACV,eAAe;AAAA,UACf,GAAG,OAAO;AAAA,QACZ;AAAA,QAEA;AAAA;AAAA,YAAC,GAAG;AAAA,YAAH;AAAA,cACC,WAAU;AAAA,cACT,GAAG;AAAA,gBACF;AAAA,kBACE,GAAG;AAAA,kBACH;AAAA,gBACF;AAAA,gBACA;AAAA,cACF;AAAA;AAAA,UACF;AAAA,UAEA;AAAA,YAAC,GAAG;AAAA,YAAH;AAAA,cACC,WAAU;AAAA,cACT,GAAG,aAAa,SAAS;AAAA,cAC1B,OAAO;AAAA,gBACL,SAAS;AAAA,gBACT,UAAU;AAAA,gBACV,YAAY;AAAA,gBACZ,GAAG,OAAO;AAAA,cACZ;AAAA;AAAA,UACF;AAAA,UAEA;AAAA,YAAC,GAAG;AAAA,YAAH;AAAA,cACC,WAAU;AAAA,cACT,GAAG,cAAc,UAAU;AAAA,cAC5B,OAAO,EAAE,GAAG,OAAO,MAAM;AAAA,cAExB,wCAAY;AAAA;AAAA,UACf;AAAA;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAMA,MAAM,cAAc;AACpB,MAAM,SAAS;","names":[]}
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/radio-card.tsx"],"sourcesContent":["import type { ComponentArgs, HTMLUIProps, ThemeProps } from \"@yamada-ui/core\"\nimport type {\n ForwardedRef,\n InputHTMLAttributes,\n ReactElement,\n ReactNode,\n RefAttributes,\n} from \"react\"\nimport type { RadioCardAddonProps } from \"./radio-card-addon\"\nimport type { RadioCardDescriptionProps } from \"./radio-card-description\"\nimport type { RadioCardLabelProps } from \"./radio-card-label\"\nimport type { UseRadioProps } from \"./use-radio\"\nimport { omitThemeProps, ui, useComponentMultiStyle } from \"@yamada-ui/core\"\nimport { useFormControl } from \"@yamada-ui/form-control\"\nimport {\n cx,\n findChild,\n funcAll,\n getValidChildren,\n isEmpty,\n omitChildren,\n} from \"@yamada-ui/utils\"\nimport { forwardRef } from \"react\"\nimport { RadioCardAddon } from \"./radio-card-addon\"\nimport { RadioCardDescription } from \"./radio-card-description\"\nimport { RadioCardLabel } from \"./radio-card-label\"\nimport { RadioCardProvider, useRadioCardGroupContext } from \"./radio-context\"\nimport { useRadio } from \"./use-radio\"\n\ninterface RadioCardOptions {\n /**\n * The addon of the radio card.\n */\n addon?: ReactNode\n /**\n * The body of the radio card.\n */\n description?: ReactNode\n /**\n * The label of the radio card.\n */\n label?: ReactNode\n /**\n * If `true`, the icon will be displayed.\n *\n * @default true\n */\n withIcon?: boolean\n /**\n * Props for the footer of the radio card.\n */\n addonProps?: RadioCardAddonProps\n /**\n * Props for the description of the radio card.\n */\n descriptionProps?: RadioCardDescriptionProps\n /**\n * Props for the icon of the radio card.\n */\n iconProps?: HTMLUIProps\n /**\n * Props for input element.\n */\n inputProps?: InputHTMLAttributes<HTMLInputElement>\n /**\n * Props for the label of the radio card.\n */\n labelProps?: RadioCardLabelProps\n}\n\nexport interface RadioCardProps<Y extends number | string = string>\n extends Omit<HTMLUIProps<\"label\">, keyof UseRadioProps>,\n ThemeProps<\"RadioCard\">,\n UseRadioProps<Y>,\n RadioCardOptions {}\n\n/**\n * `RadioCard` 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-card\n */\nexport const RadioCard = forwardRef(\n <Y extends number | string = string>(\n props: RadioCardProps<Y>,\n ref: ForwardedRef<HTMLInputElement>,\n ) => {\n const group = useRadioCardGroupContext()\n const { value: groupValue, ...groupProps } = { ...group }\n const control = useFormControl(props)\n const [styles, mergedProps] = useComponentMultiStyle(\"RadioCard\", {\n ...groupProps,\n ...props,\n })\n const {\n className,\n addon,\n children,\n description,\n isDisabled = groupProps.isDisabled ?? control.isDisabled,\n isInvalid = groupProps.isInvalid ?? control.isInvalid,\n isReadOnly = groupProps.isReadOnly ?? control.isReadOnly,\n isRequired = groupProps.isRequired ?? control.isRequired,\n label,\n withIcon = true,\n addonProps,\n descriptionProps,\n iconProps,\n inputProps,\n labelProps,\n ...computedProps\n } = omitThemeProps(mergedProps)\n\n computedProps.checked ??= computedProps.isChecked\n\n const checkedProp =\n groupValue && computedProps.value\n ? groupValue === computedProps.value\n : computedProps.checked\n\n const onChange =\n groupProps.onChange && computedProps.value\n ? funcAll(groupProps.onChange, computedProps.onChange)\n : computedProps.onChange\n\n const {\n checked,\n props: rest,\n getContainerProps,\n getIconProps,\n getInputProps,\n } = useRadio({\n ...computedProps,\n checked: checkedProp,\n isDisabled,\n isInvalid,\n isReadOnly,\n isRequired,\n onChange,\n })\n\n const tabIndex = !groupValue ? 0 : checked ? 0 : -1\n\n const validChildren = getValidChildren(children)\n const customLabel = findChild(validChildren, RadioCardLabel)\n const customDescription = findChild(validChildren, RadioCardDescription)\n const customAddon = findChild(validChildren, RadioCardAddon)\n\n const computedChildren = !isEmpty(validChildren)\n ? omitChildren(\n validChildren,\n RadioCardLabel,\n RadioCardDescription,\n RadioCardAddon,\n )\n : children\n\n return (\n <RadioCardProvider value={{ styles, withIcon, getIconProps, iconProps }}>\n <ui.label\n className={cx(\"ui-radio-card\", className)}\n {...getContainerProps(rest)}\n __css={{ ...styles.container }}\n >\n <ui.input\n className=\"ui-radio-card__input\"\n {...getInputProps(\n {\n ...inputProps,\n tabIndex,\n },\n ref,\n )}\n />\n\n {customLabel ??\n (label ? (\n <RadioCardLabel {...labelProps}>{label}</RadioCardLabel>\n ) : null)}\n\n {customDescription ??\n (description ? (\n <RadioCardDescription {...descriptionProps}>\n {description}\n </RadioCardDescription>\n ) : null)}\n\n {customAddon ??\n (addon ? (\n <RadioCardAddon {...addonProps}>{addon}</RadioCardAddon>\n ) : null)}\n\n {computedChildren}\n </ui.label>\n </RadioCardProvider>\n )\n },\n) as {\n <Y extends number | string = string>(\n props: RadioCardProps<Y> & RefAttributes<HTMLInputElement>,\n ): ReactElement\n} & ComponentArgs\n\nRadioCard.displayName = \"RadioCard\"\nRadioCard.__ui__ = \"RadioCard\"\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAYA,SAAS,gBAAgB,IAAI,8BAA8B;AAC3D,SAAS,sBAAsB;AAC/B;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,kBAAkB;AAwInB,SAKE,KALF;AA7ED,IAAM,YAAY;AAAA,EACvB,CACE,OACA,QACG;AArFP;AAsFI,UAAM,QAAQ,yBAAyB;AACvC,UAAM,EAAE,OAAO,YAAY,GAAG,WAAW,IAAI,EAAE,GAAG,MAAM;AACxD,UAAM,UAAU,eAAe,KAAK;AACpC,UAAM,CAAC,QAAQ,WAAW,IAAI,uBAAuB,aAAa;AAAA,MAChE,GAAG;AAAA,MACH,GAAG;AAAA,IACL,CAAC;AACD,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,cAAa,gBAAW,eAAX,YAAyB,QAAQ;AAAA,MAC9C,aAAY,gBAAW,cAAX,YAAwB,QAAQ;AAAA,MAC5C,cAAa,gBAAW,eAAX,YAAyB,QAAQ;AAAA,MAC9C,cAAa,gBAAW,eAAX,YAAyB,QAAQ;AAAA,MAC9C;AAAA,MACA,WAAW;AAAA,MACX;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,IACL,IAAI,eAAe,WAAW;AAE9B,wBAAc,YAAd,0BAAc,UAAY,cAAc;AAExC,UAAM,cACJ,cAAc,cAAc,QACxB,eAAe,cAAc,QAC7B,cAAc;AAEpB,UAAM,WACJ,WAAW,YAAY,cAAc,QACjC,QAAQ,WAAW,UAAU,cAAc,QAAQ,IACnD,cAAc;AAEpB,UAAM;AAAA,MACJ;AAAA,MACA,OAAO;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,IACF,IAAI,SAAS;AAAA,MACX,GAAG;AAAA,MACH,SAAS;AAAA,MACT;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF,CAAC;AAED,UAAM,WAAW,CAAC,aAAa,IAAI,UAAU,IAAI;AAEjD,UAAM,gBAAgB,iBAAiB,QAAQ;AAC/C,UAAM,cAAc,UAAU,eAAe,cAAc;AAC3D,UAAM,oBAAoB,UAAU,eAAe,oBAAoB;AACvE,UAAM,cAAc,UAAU,eAAe,cAAc;AAE3D,UAAM,mBAAmB,CAAC,QAAQ,aAAa,IAC3C;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF,IACA;AAEJ,WACE,oBAAC,qBAAkB,OAAO,EAAE,QAAQ,UAAU,cAAc,UAAU,GACpE;AAAA,MAAC,GAAG;AAAA,MAAH;AAAA,QACC,WAAW,GAAG,iBAAiB,SAAS;AAAA,QACvC,GAAG,kBAAkB,IAAI;AAAA,QAC1B,OAAO,EAAE,GAAG,OAAO,UAAU;AAAA,QAE7B;AAAA;AAAA,YAAC,GAAG;AAAA,YAAH;AAAA,cACC,WAAU;AAAA,cACT,GAAG;AAAA,gBACF;AAAA,kBACE,GAAG;AAAA,kBACH;AAAA,gBACF;AAAA,gBACA;AAAA,cACF;AAAA;AAAA,UACF;AAAA,UAEC,oCACE,QACC,oBAAC,kBAAgB,GAAG,YAAa,iBAAM,IACrC;AAAA,UAEL,gDACE,cACC,oBAAC,wBAAsB,GAAG,kBACvB,uBACH,IACE;AAAA,UAEL,oCACE,QACC,oBAAC,kBAAgB,GAAG,YAAa,iBAAM,IACrC;AAAA,UAEL;AAAA;AAAA;AAAA,IACH,GACF;AAAA,EAEJ;AACF;AAMA,UAAU,cAAc;AACxB,UAAU,SAAS;","names":[]}
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/use-radio-group.ts"],"sourcesContent":["import type { PropGetter } from \"@yamada-ui/core\"\nimport type { Dict } from \"@yamada-ui/utils\"\nimport type { ChangeEvent } from \"react\"\nimport { useControllableState } from \"@yamada-ui/use-controllable-state\"\nimport { isObject, mergeRefs, useCallbackRef } from \"@yamada-ui/utils\"\nimport { useCallback, useId, useRef } from \"react\"\n\nconst isEvent = (value: any): value is { target: HTMLInputElement } =>\n value && isObject(value) && isObject(value.target)\n\nexport interface UseRadioGroupProps<Y extends number | string = 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 initial value of the radio group.\n */\n defaultValue?: Y\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 * @deprecated It will be deprecated in version 2.0.\n */\n isNative?: boolean\n /**\n * The value of the radio group.\n */\n value?: Y\n /**\n * The callback fired when any children radio is checked or unchecked.\n */\n onChange?: (value: Y) => void\n}\n\nexport const useRadioGroup = <\n Y extends number | string,\n M extends Dict = Dict,\n>({\n id,\n name,\n defaultValue,\n isNative,\n value: valueProp,\n onChange: onChangeProp,\n ...props\n}: M & UseRadioGroupProps<Y>) => {\n const uuid = useId()\n\n id ??= uuid\n name ??= `radio-${id}`\n\n const onChangeRef = useCallbackRef(onChangeProp)\n\n const [value, setValue] = useControllableState({\n defaultValue,\n value: valueProp,\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 role: \"radiogroup\",\n ...props,\n ref: mergeRefs(ref, containerRef),\n }),\n [],\n )\n\n const getRadioProps: PropGetter<\n { value?: Y },\n {\n checked?: boolean\n isChecked?: boolean\n value?: Y\n }\n > = useCallback(\n (props = {}, ref = null) => {\n const checked = props.value === value\n\n return {\n ...props,\n ref,\n name,\n \"aria-checked\": checked,\n [isNative ? \"checked\" : \"isChecked\"]:\n // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n value != null ? checked : undefined,\n onChange,\n }\n },\n [name, value, onChange, isNative],\n )\n\n return {\n id,\n name,\n props,\n setValue,\n value,\n getContainerProps,\n getRadioProps,\n onChange,\n onFocus,\n }\n}\n\nexport type UseRadioGroupReturn<Y extends number | string = string> =\n ReturnType<typeof useRadioGroup<Y>>\n"],"mappings":";;;AAGA,SAAS,4BAA4B;AACrC,SAAS,UAAU,WAAW,sBAAsB;AACpD,SAAS,aAAa,OAAO,cAAc;AAE3C,IAAM,UAAU,CAAC,UACf,SAAS,SAAS,KAAK,KAAK,SAAS,MAAM,MAAM;AAoC5C,IAAM,gBAAgB,CAG3B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,UAAU;AAAA,EACV,GAAG;AACL,MAAiC;AAC/B,QAAM,OAAO,MAAM;AAEnB,yBAAO;AACP,+BAAS,SAAS,EAAE;AAEpB,QAAM,cAAc,eAAe,YAAY;AAE/C,QAAM,CAAC,OAAO,QAAQ,IAAI,qBAAqB;AAAA,IAC7C;AAAA,IACA,OAAO;AAAA,IACP,UAAU;AAAA,EACZ,CAAC;AAED,QAAM,eAAe,OAAY,IAAI;AAErC,QAAM,UAAU,YAAY,MAAM;AAChC,UAAM,YAAY,aAAa;AAE/B,QAAI,CAAC,UAAW;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,WAAW;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,oBAAgC;AAAA,IACpC,CAACA,SAAQ,CAAC,GAAG,MAAM,UAAU;AAAA,MAC3B,MAAM;AAAA,MACN,GAAGA;AAAA,MACH,KAAK,UAAU,KAAK,YAAY;AAAA,IAClC;AAAA,IACA,CAAC;AAAA,EACH;AAEA,QAAM,gBAOF;AAAA,IACF,CAACA,SAAQ,CAAC,GAAG,MAAM,SAAS;AAC1B,YAAM,UAAUA,OAAM,UAAU;AAEhC,aAAO;AAAA,QACL,GAAGA;AAAA,QACH;AAAA,QACA;AAAA,QACA,gBAAgB;AAAA,QAChB,CAAC,WAAW,YAAY,WAAW;AAAA;AAAA,UAEjC,SAAS,OAAO,UAAU;AAAA;AAAA,QAC5B;AAAA,MACF;AAAA,IACF;AAAA,IACA,CAAC,MAAM,OAAO,UAAU,QAAQ;AAAA,EAClC;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;","names":["props"]}
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/radio-card-group.tsx"],"sourcesContent":["import type { ComponentArgs, ThemeProps } from \"@yamada-ui/core\"\nimport type { ForwardedRef, ReactElement, RefAttributes } from \"react\"\nimport type { RadioCardProps } from \"./radio-card\"\nimport type { RadioCardGroupContext } from \"./radio-context\"\nimport type { RadioGroupSharedProps } from \"./radio-group\"\nimport { useFormControl } from \"@yamada-ui/form-control\"\nimport { Flex } from \"@yamada-ui/layouts\"\nimport { cx, getValidChildren } from \"@yamada-ui/utils\"\nimport { forwardRef } from \"react\"\nimport { RadioCard } from \"./radio-card\"\nimport { RadioCardGroupProvider } from \"./radio-context\"\nimport { useRadioGroup } from \"./use-radio-group\"\n\nexport type RadioCardItem<Y extends number | string = string> =\n RadioCardProps<Y>\n\nexport interface RadioCardGroupProps<Y extends number | string = string>\n extends RadioGroupSharedProps<Y>,\n Pick<\n RadioCardProps,\n \"addonProps\" | \"descriptionProps\" | \"labelProps\" | \"withIcon\"\n >,\n ThemeProps<\"RadioCard\"> {\n /**\n * If provided, generate radio cards based on items.\n *\n * @default '[]'\n */\n items?: RadioCardItem<Y>[]\n}\n\n/**\n * `RadioCardGroup` is a component that groups `RadioCard` components.\n *\n * @see Docs https://yamada-ui.com/components/forms/radio-card\n */\nexport const RadioCardGroup = forwardRef(\n <Y extends number | string = string>(\n {\n id: idProp,\n className,\n colorScheme,\n size,\n variant,\n children,\n direction = \"row\",\n gap = \"0.5rem\",\n items = [],\n withIcon = true,\n addonProps,\n descriptionProps,\n labelProps,\n ...props\n }: RadioCardGroupProps<Y>,\n ref: ForwardedRef<HTMLDivElement>,\n ) => {\n const {\n isDisabled,\n isInvalid,\n isReadOnly,\n isRequired,\n labelId,\n ...computedProps\n } = useFormControl({\n id: idProp,\n ...props,\n })\n const {\n id,\n name,\n props: rest,\n value,\n getContainerProps,\n onChange,\n } = useRadioGroup(computedProps)\n\n const validChildren = getValidChildren(children)\n let computedChildren: ReactElement[] = []\n\n if (!validChildren.length && items.length)\n computedChildren = items.map((props, i) => (\n <RadioCard key={i} {...props} />\n ))\n\n return (\n <RadioCardGroupProvider\n value={\n {\n name,\n colorScheme,\n size,\n variant,\n isDisabled,\n isInvalid,\n isReadOnly,\n isRequired,\n value,\n withIcon,\n addonProps,\n descriptionProps,\n labelProps,\n onChange,\n } as RadioCardGroupContext\n }\n >\n <Flex\n ref={ref}\n className={cx(\"ui-radio-card-group\", className)}\n gap={gap}\n w=\"100%\"\n {...getContainerProps({\n id,\n \"aria-labelledby\": labelId,\n ...rest,\n })}\n direction={direction}\n >\n {children ?? computedChildren}\n </Flex>\n </RadioCardGroupProvider>\n )\n },\n) as {\n <Y extends number | string = string>(\n props: RadioCardGroupProps<Y> & RefAttributes<HTMLDivElement>,\n ): ReactElement\n} & ComponentArgs\n\nRadioCardGroup.displayName = \"RadioCardGroup\"\nRadioCardGroup.__ui__ = \"RadioCardGroup\"\n"],"mappings":";;;;;;;;;;;;AAKA,SAAS,sBAAsB;AAC/B,SAAS,YAAY;AACrB,SAAS,IAAI,wBAAwB;AACrC,SAAS,kBAAkB;AAyEnB;AA7CD,IAAM,iBAAiB;AAAA,EAC5B,CACE;AAAA,IACE,IAAI;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,YAAY;AAAA,IACZ,MAAM;AAAA,IACN,QAAQ,CAAC;AAAA,IACT,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,GACA,QACG;AACH,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,IACL,IAAI,eAAe;AAAA,MACjB,IAAI;AAAA,MACJ,GAAG;AAAA,IACL,CAAC;AACD,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA,OAAO;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,IACF,IAAI,cAAc,aAAa;AAE/B,UAAM,gBAAgB,iBAAiB,QAAQ;AAC/C,QAAI,mBAAmC,CAAC;AAExC,QAAI,CAAC,cAAc,UAAU,MAAM;AACjC,yBAAmB,MAAM,IAAI,CAACA,QAAO,MACnC,oBAAC,aAAmB,GAAGA,UAAP,CAAc,CAC/B;AAEH,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,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,QAGF;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA,WAAW,GAAG,uBAAuB,SAAS;AAAA,YAC9C;AAAA,YACA,GAAE;AAAA,YACD,GAAG,kBAAkB;AAAA,cACpB;AAAA,cACA,mBAAmB;AAAA,cACnB,GAAG;AAAA,YACL,CAAC;AAAA,YACD;AAAA,YAEC,wCAAY;AAAA;AAAA,QACf;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAMA,eAAe,cAAc;AAC7B,eAAe,SAAS;","names":["props"]}