import React, { forwardRef, useCallback } from "react";
import { StyledContainer, StyledToggle } from "./Toggle.styled.js";
const Toggle = forwardRef((props, ref) => {
    const { onChange, onContextMenu, undeterminedClickValue, disabled, value, ...rest } = props;
    const handleChange = useCallback((e) => {
        if (value == null) {
            if (typeof undeterminedClickValue === "boolean") {
                onChange(undeterminedClickValue);
            }
            return;
        }
        onChange(e.target.checked);
    }, [onChange, value, undeterminedClickValue]);
    return (React.createElement(StyledContainer, { ...rest, disabled: Boolean(disabled), onContextMenu: onContextMenu },
        React.createElement("input", { type: "checkbox", checked: Boolean(value), "data-undetermined": value == null, readOnly: value == null, disabled: disabled, onChange: handleChange, ref: ref }),
        React.createElement(StyledToggle, null)));
});
Toggle.displayName = "Toggle";
Toggle.toString = () => StyledContainer.toString();
const ToggleStyledToggleSelector = StyledToggle.toString();
export { Toggle, ToggleStyledToggleSelector };
//# sourceMappingURL=Toggle.js.map