import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Container, CheckboxContainer } from "./checkbox.styled";
import CheckboxIcon from "./checkbox.icon";
import { P } from "../typography";
export const Checkbox = ({ label, onClick, checked, disabled, children, }) => {
    return (_jsxs(Container, { onClick: onClick, className: "ui-checkbox", children: [_jsx(CheckboxContainer, { className: "ui-checkbox__checkbox", role: "checkbox", "aria-checked": !!checked, "aria-disabled": !!disabled, active: !!checked, children: checked && (_jsx(CheckboxIcon, { className: "ui-checkbox__checkbox__icon", disabled: !!disabled })) }), label && !children ? (_jsx(P.MD, { className: "ui-checkbox__checkbox__label", children: label })) : (children)] }));
};
//# sourceMappingURL=checkbox.js.map