Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 | // @flow
import RadioGroup from "./RadioGroup"
import type { RadioGroupProps } from "@bluframe/blublocks"
import { prepareComponent } from "@bluframe/grapple"
import { useMemo } from "react"
export type Props = {|
...RadioGroupProps
|}
export type ComponentProps = {|
...Props,
+groupId: string,
+labelId: string
|}
const FIRST = 0
const usePrepareComponent = (props: Props): ComponentProps => {
const groupId = `${props.name}-radiogroup`
const labelId = `${groupId}-label`
// Auto select first option if no selected option is provided
const selected = useMemo(() => {
if (props.selected) {
return props.selected
}
if (!props.options.length) {
return null
}
return props.options[FIRST].value
}, [props.options, props.selected])
return {
...props,
groupId,
labelId,
selected
}
}
export default (prepareComponent<Props, ComponentProps>(usePrepareComponent)(
RadioGroup
): React$ComponentType<Props>)
|