@etsoo/materialui
Version:
TypeScript Material-UI Implementation
34 lines (33 loc) • 1.82 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import NotchedOutline from "@mui/material/OutlinedInput";
import React from "react";
import { SwitchAnt } from "./SwitchAnt";
import FormControl from "@mui/material/FormControl";
import InputLabel from "@mui/material/InputLabel";
import Box from "@mui/material/Box";
import FormHelperText from "@mui/material/FormHelperText";
/**
* SwitchField
* @param props Props
* @returns Component
*/
export function SwitchField(props) {
// Destruct
const { activeColor, startLabel, endLabel, value = true, fullWidth, helperText, label, name, required, checked, variant = "outlined", ...rest } = props;
// Outlined
const outlined = variant === "outlined";
// Group
const group = (_jsx(SwitchAnt, { activeColor: activeColor, name: name, startLabel: startLabel, endLabel: endLabel, value: value, checked: checked }));
// Layout
return (_jsxs(React.Fragment, { children: [_jsxs(FormControl, { fullWidth: fullWidth, ...rest, children: [label && (_jsx(InputLabel, { required: required, variant: variant, shrink: true, children: label })), outlined ? (_jsx(NotchedOutline, { label: label && required ? label + " *" : label, notched: true, endAdornment: group, sx: {
cursor: "default",
display: "flex",
gap: 1,
paddingX: 2,
paddingY: "7px",
width: fullWidth ? "100%" : "auto",
"& input": {
display: "none"
}
} })) : (_jsx(Box, { paddingLeft: 2, paddingY: "7px", children: group }))] }), helperText && _jsx(FormHelperText, { children: helperText })] }));
}