You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
51 lines
1.3 KiB
51 lines
1.3 KiB
import React from "react"; |
|
import TextField from "@material-ui/core/TextField"; |
|
import { makeStyles } from "@material-ui/core/styles"; |
|
|
|
export default function FormPropsTextFields(props) { |
|
const useStyles = makeStyles((theme) => ({ |
|
root: { |
|
"& .MuiTextField-root": { |
|
width: "100%", |
|
position: "relative", |
|
marginRight: 10, |
|
"& input": { |
|
textAlign: props.align, |
|
direction: props.align === "right" ? "rtl" : "ltr", |
|
}, |
|
fontFamily: "numeralLight", |
|
}, |
|
}, |
|
})); |
|
|
|
const classes = useStyles(); |
|
const { parent, defaultValue, maxLength, inputMode, onInput, variant } = |
|
props; |
|
return ( |
|
<form className={classes.root} noValidate autoComplete="off"> |
|
<div> |
|
<TextField |
|
id="outlined-basic" |
|
name={props.name} |
|
label={props.label} |
|
variant={variant || "outlined"} |
|
onChange={(e) => parent.onChange(e.target.name, e.target.value)} |
|
defaultValue={defaultValue[props.name] || ""} |
|
inputProps={{ maxLength }} |
|
onInput={ |
|
onInput |
|
? (e) => (e.target.value = onInput(e.target.value)) |
|
: () => {} |
|
} |
|
/> |
|
</div> |
|
</form> |
|
); |
|
} |
|
|
|
FormPropsTextFields.defaultProps = { |
|
align: "right", |
|
maxLength: "", |
|
inputMode: "numeric", |
|
defaultValue: "", |
|
};
|
|
|