@yamada-ui/react/dist/esm/components/radio-card/radio-card.js

React UI components of the Yamada, by the Yamada, for the Yamada built with React and Emotion

"use client";


import { styled } from "../../core/system/factory.js";
import { createSlotComponent } from "../../core/components/create-component.js";
import { useInputBorder } from "../input/use-input-border.js";
import { useRadio } from "../radio/use-radio.js";
import { radioCardStyle } from "./radio-card.style.js";
import { useMemo } from "react";
import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";

//#region src/components/radio-card/radio-card.tsx
const { component, PropsContext: RadioCardPropsContext, usePropsContext: useRadioCardPropsContext, withContext, withProvider, useRootComponentProps } = createSlotComponent("radio-card", radioCardStyle);
/**
* `RadioCard` is a component used for allowing users to select one option from multiple choices.
*
* @see https://yamada-ui.com/docs/components/radio-card
*/
const RadioCardRoot = withProvider(({ addon, children, description, errorBorderColor, focusBorderColor, label, withIndicator = true, addonProps, descriptionProps, indicatorProps, inputProps, labelProps, rootProps,...rest }) => {
	const { getIndicatorProps, getInputProps, getRootProps } = useRadio(rest);
	const varProps = useInputBorder({
		errorBorderColor,
		focusBorderColor
	});
	const computedChildren = useMemo(() => {
		if (children) return children;
		return /* @__PURE__ */ jsxs(Fragment$1, { children: [
			label ? /* @__PURE__ */ jsx(RadioCardLabel, {
				...labelProps,
				children: label
			}) : null,
			description ? /* @__PURE__ */ jsx(RadioCardDescription, {
				...descriptionProps,
				children: description
			}) : null,
			addon ? /* @__PURE__ */ jsx(RadioCardAddon, {
				...addonProps,
				children: addon
			}) : null
		] });
	}, [
		addon,
		addonProps,
		children,
		description,
		descriptionProps,
		label,
		labelProps
	]);
	return /* @__PURE__ */ jsxs(styled.label, {
		...getRootProps({
			...varProps,
			...rootProps
		}),
		children: [
			/* @__PURE__ */ jsx(styled.input, { ...getInputProps(inputProps) }),
			withIndicator ? /* @__PURE__ */ jsx(RadioCardIndicator, { ...getIndicatorProps(indicatorProps) }) : null,
			computedChildren
		]
	});
}, "root")();
const RadioCardIndicator = withContext("div", "indicator")({ "data-indicator": "" });
const RadioCardLabel = withContext("span", "label")();
const RadioCardDescription = withContext("span", "description")();
const RadioCardAddon = withContext("span", "addon")();

//#endregion
export { RadioCardAddon, RadioCardDescription, RadioCardLabel, RadioCardPropsContext, RadioCardRoot, component, useRadioCardPropsContext, useRootComponentProps };
//# sourceMappingURL=radio-card.js.map