import { jsx as _jsx } from "react/jsx-runtime";
import styled from "styled-components";
import { CheckedIcon } from "../../CommonUI/Icon/CheckedIcon";
import { UncheckedIcon } from "../../CommonUI/Icon/UncheckedIcon";
export const CheckBox = (props) => {
    return (_jsx(CheckBoxWrapper, Object.assign({ onClick: () => props.onChange(!props.checked) }, { children: props.checked ? _jsx(CheckedIcon, {}, void 0) : _jsx(UncheckedIcon, {}, void 0) }), void 0));
};
const CheckBoxWrapper = styled.div `
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    position: relative;
    img {
        position: absolute;
        top: 0;
        left: 0;
        width: 24px;
        height: 24px;
    }
`;
//# sourceMappingURL=CheckBox.js.map