@etsoo/materialui/lib/mjs/custom/FieldSwitch.js

TypeScript Material-UI Implementation

import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
import React from "react";
import { SwitchAnt } from "../SwitchAnt";
import Typography from "@mui/material/Typography";
/**
 * Input field creator
 * type: switch
 * @returns Component
 */
export const FieldSwitch = ({ field, mref, onChange, defaultValue }) => {
    // State
    const [value, setLocalValue] = React.useState();
    const getValue = () => value;
    const setValue = (value) => {
        if (typeof value === "boolean")
            setLocalValue(value);
        else if (value === "true" || value === "1" || value === 1)
            setLocalValue(true);
        else if (value === "false" || value === "0" || value === 0)
            setLocalValue(false);
        else
            setLocalValue(undefined);
    };
    React.useImperativeHandle(mref, () => ({
        getValue,
        setValue
    }));
    // Name
    const name = field.name;
    if (!name) {
        return (_jsxs(Typography, { children: ["No name for FieldSwitch ", JSON.stringify(field)] }));
    }
    React.useEffect(() => {
        if (defaultValue == null)
            return;
        setValue(defaultValue);
    }, [defaultValue]);
    return (_jsx(SwitchAnt, { name: name, onChange: (_event, value) => {
            setLocalValue(value);
            onChange(name, value);
        }, ...field.mainSlotProps }));
};