import React from 'react' ; import { CellProps , WithClassname } from '@jsonforms/core' ; import { Input } from '@mui/material' ; import merge from 'lodash/merge' ; import { useDebouncedChange } from '../util' ; const toNumber = ( value ) => value === '' ? undefined : parseInt ( value , 10 ) ; const eventToValue = ( ev ) => toNumber ( ev . target . value ) ; export const MuiInputInteger = React . memo ( ( props ) => { const { data , className , id , enabled , uischema , path , handleChange , config } = props ; const inputProps = { step : '1' } ; const appliedUiSchemaOptions = merge ( { } , config , uischema . options ) ; const [ inputValue , onChange ] = useDebouncedChange ( handleChange , '' , data , path , eventToValue ) ; return ( < Input type = 'number' value = { inputValue } onChange = { onChange } className = { className } id = { id } disabled = { ! enabled } autoFocus = { appliedUiSchemaOptions . focus } inputProps = { inputProps } fullWidth = { true } / > ) ; } ) ;