UNPKG

@yamada-ui/radio

Version:

Yamada UI radio component

1 lines 4.81 kB
{"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 disabled,\n invalid,\n isDisabled: _isDisabled,\n isInvalid: _isInvalid,\n isReadOnly: _isReadOnly,\n isRequired: _isRequired,\n labelId,\n readOnly,\n required,\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 disabled,\n invalid,\n readOnly,\n required,\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;AAyEnB;AA7CD,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,YAAY;AAAA,MACZ,WAAW;AAAA,MACX,YAAY;AAAA,MACZ,YAAY;AAAA,MACZ;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"]}