@trail-ui/react
Version:
64 lines (61 loc) • 2.38 kB
JavaScript
import {
RadioGroupThemeContext
} from "./chunk-Y3QYVZ6A.mjs";
// src/radio/radio.tsx
import { clsx } from "@trail-ui/shared-utils";
import { radio } from "@trail-ui/theme";
import {
cloneElement,
forwardRef,
isValidElement,
useContext,
useMemo
} from "react";
import { Radio as AriaRadio } from "react-aria-components";
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
function Radio(props, ref) {
var _a, _b;
const groupThemeContext = useContext(RadioGroupThemeContext);
const {
size = (_a = groupThemeContext == null ? void 0 : groupThemeContext.size) != null ? _a : "md",
color = (_b = groupThemeContext == null ? void 0 : groupThemeContext.color) != null ? _b : "purple",
control,
isDisplayControl = true,
className,
classNames,
children,
...otherProps
} = props;
const slots = useMemo(
() => radio({
color,
size
}),
[color, size]
);
const baseStyles = clsx(classNames == null ? void 0 : classNames.base, className);
return /* @__PURE__ */ jsx(AriaRadio, { ref, className: slots.base({ class: baseStyles }), ...otherProps, children: (renderProps) => {
const iconProps = {
"data-checked": String(renderProps.isSelected),
isSelected: renderProps.isSelected
};
let clonedControl;
if (typeof control === "function") {
clonedControl = control(iconProps);
} else if (isValidElement(control)) {
clonedControl = cloneElement(control, iconProps);
} else {
const controlClass = renderProps.isHovered && !renderProps.isSelected ? clsx(classNames == null ? void 0 : classNames.control, "bg-neutral-100") : classNames == null ? void 0 : classNames.control;
clonedControl = /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: slots.control({ class: controlClass }), children: /* @__PURE__ */ jsx("span", { className: slots.point({ class: classNames == null ? void 0 : classNames.point }) }) });
}
const displayControl = isDisplayControl && clonedControl;
return /* @__PURE__ */ jsxs(Fragment, { children: [
displayControl,
children && /* @__PURE__ */ jsx("span", { className: slots.label({ class: classNames == null ? void 0 : classNames.label }), children: typeof children === "function" ? children(renderProps) : children })
] });
} });
}
var _Radio = forwardRef(Radio);
export {
_Radio
};