@wq/material-web/inputs/Toggle.js

Web bindings for @wq/material

import React from "react";
import { Field } from "formik";
import { ToggleButton, FormControl, FormLabel } from "@mui/material";
import { ToggleButtonGroup } from "formik-mui";
import HelperText from "./HelperText.js";
import PropTypes from "prop-types";
export default function Toggle({ choices, label, ...rest }) {
    return /*#__PURE__*/ React.createElement(
        FormControl,
        {
            component: "fieldset",
            fullWidth: true,
            margin: "dense",
        },
        /*#__PURE__*/ React.createElement(
            FormLabel,
            {
                component: "legend",
            },
            label
        ),
        /*#__PURE__*/ React.createElement(
            Field,
            {
                component: ToggleButtonGroup,
                exclusive: true,
                ...rest,
                type: "checkbox",
            },
            choices.map(({ name, label }) =>
                /*#__PURE__*/ React.createElement(
                    ToggleButton,
                    {
                        key: name,
                        value: name,
                    },
                    label
                )
            )
        ),
        /*#__PURE__*/ React.createElement(HelperText, {
            name: rest.name,
            hint: rest.hint,
        })
    );
}
Toggle.propTypes = {
    choices: PropTypes.arrayOf(PropTypes.object),
    label: PropTypes.string,
};