import * as __WEBPACK_EXTERNAL_MODULE__chakra_ui_react__ from "@chakra-ui/react";
import * as __WEBPACK_EXTERNAL_MODULE__utils_useAttachedStyle_mjs__ from "../../../utils/useAttachedStyle.mjs";
function RadioCard(props) {
    const { size = 'md', isAttached, direction, ...radioProps } = props;
    const { getInputProps, getRadioProps } = (0, __WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.useRadio)(radioProps);
    const input = getInputProps();
    const radio = getRadioProps();
    const focusChecked = '' === radio['data-checked'] && '' === radio['data-focus'];
    const invalidStyle = {
        textColor: 'red.500',
        borderColor: 'red.500'
    };
    const checkedStyle = {
        position: 'relative',
        outline: '1px solid',
        ...(0, __WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.useColorModeValue)({
            bg: 'transparent',
            borderColor: 'darkblue.800 !important',
            outlineColor: 'darkblue.800',
            boxShadow: !isAttached && "4px 4px 0px 0px var(--chakra-colors-blackAlpha-300)"
        }, {
            bg: 'transparent',
            borderColor: 'white !important',
            outlineColor: 'white',
            boxShadow: !isAttached && "4px 4px 0px 0px var(--chakra-colors-whiteAlpha-300)"
        })
    };
    const hoverStyle = (0, __WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.useColorModeValue)({
        borderColor: 'blackAlpha.500'
    }, {
        borderColor: 'whiteAlpha.500'
    });
    const attachedStyle = (0, __WEBPACK_EXTERNAL_MODULE__utils_useAttachedStyle_mjs__["default"])('> div', true, void 0, direction);
    const sizes = {
        sm: {
            px: 4,
            py: 1,
            fontSize: 'sm'
        },
        md: {
            px: 5,
            py: 2
        },
        lg: {
            px: 6,
            py: 3,
            fontSize: 'lg'
        }
    }[size];
    return /*#__PURE__*/ React.createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Box, {
        as: "label",
        __css: isAttached ? attachedStyle : void 0,
        "data-testid": `${props.value}_field`
    }, /*#__PURE__*/ React.createElement("input", input), /*#__PURE__*/ React.createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Box, {
        ...radio,
        cursor: "pointer",
        borderWidth: "1px",
        borderRadius: "md",
        transition: "100ms all ease-in-out",
        _invalid: invalidStyle,
        _checked: checkedStyle,
        _hover: hoverStyle,
        _focus: focusChecked ? {
            boxShadow: 'outline'
        } : void 0,
        _disabled: {
            cursor: 'not-allowed',
            opacity: 0.5
        },
        px: sizes.px,
        py: sizes.py,
        fontSize: sizes.fontSize
    }, props.children));
}
/* ESM default export */ const RadioCard_rslib_entry_ = RadioCard;
export { RadioCard_rslib_entry_ as default };
