@etsoo/materialui/lib/mjs/Switch.js

TypeScript Material-UI Implementation

import { jsx as _jsx } from "react/jsx-runtime";
import React from "react";
import MuiCheckbox from "@mui/material/Checkbox";
import MuiSwitch from "@mui/material/Switch";
import FormControlLabel from "@mui/material/FormControlLabel";
/**
 * Switch
 * @param props Props
 * @returns Component
 */
export function Switch(props) {
    // Destruct
    const { checked, defaultChecked, defaultValue, onChange, readOnly, size, checkbox = false, value = "true", ...rest } = props;
    // Checked state
    const [controlChecked, setControlChecked] = React.useState(checked ?? defaultChecked ?? defaultValue == value);
    React.useEffect(() => {
        if (checked)
            setControlChecked(checked);
    }, [checked]);
    // Handle change
    const handleChange = (event, checked) => {
        if (onChange)
            onChange(event, checked);
        setControlChecked(checked);
    };
    // Control
    const control = checkbox ? (_jsx(MuiCheckbox, { readOnly: readOnly, checked: controlChecked, onChange: handleChange, size: size, value: value })) : (_jsx(MuiSwitch, { readOnly: readOnly, checked: controlChecked, onChange: handleChange, size: size, value: value }));
    // Default state
    React.useEffect(() => {
        setControlChecked(controlChecked);
    }, [controlChecked]);
    // Layout
    return _jsx(FormControlLabel, { control: control, ...rest });
}