36 lines
831 B
TypeScript
36 lines
831 B
TypeScript
|
import { TextField } from "@mui/material";
|
||
|
|
import { LenConstraint } from "../api/ServerApi";
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Couple / Member property edition
|
||
|
|
*/
|
||
|
|
export function PropEdit(p: {
|
||
|
|
label: string;
|
||
|
|
editable: boolean;
|
||
|
|
value?: string;
|
||
|
|
onValueChange: (newVal: string | undefined) => void;
|
||
|
|
size: LenConstraint;
|
||
|
|
}): React.ReactElement {
|
||
|
|
if (((!p.editable && p.value) ?? "") === "") return <></>;
|
||
|
|
|
||
|
|
return (
|
||
|
|
<TextField
|
||
|
|
label={p.label}
|
||
|
|
value={p.value}
|
||
|
|
onChange={(e) =>
|
||
|
|
p.onValueChange(
|
||
|
|
e.target.value.length === 0 ? undefined : e.target.value
|
||
|
|
)
|
||
|
|
}
|
||
|
|
inputProps={{
|
||
|
|
maxLength: p.size.max,
|
||
|
|
}}
|
||
|
|
InputProps={{
|
||
|
|
readOnly: !p.editable,
|
||
|
|
}}
|
||
|
|
variant={p.editable ? "filled" : "standard"}
|
||
|
|
style={{ width: "100%", marginBottom: "15px" }}
|
||
|
|
/>
|
||
|
|
);
|
||
|
|
}
|