src/SalaryInput.jsx


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28

import { useState } from "react";
import TextField from "@mui/material/TextField";
import { NumericFormat } from "react-number-format";

function SalaryInput({handleBaseSalaryChange}) {
    const [baseSalary, setBaseSalary] = useState('');
    return (
        <NumericFormat
            customInput={ TextField }
            label='Gaji Bulanan'
            variant="outlined"
            valueIsNumericString={true}
            thousandSeparator={true}
            allowNegative={false}
            decimalScale={0}
            value={baseSalary}
            onValueChange={(value, sourceInfo) => {
                setBaseSalary(value.value);
                handleBaseSalaryChange(value.value);
            }}
            InputProps={{
                startAdornment: <span>Rp</span>
            }}
        />
    );
}

export default SalaryInput;