import React from 'react' ; import { closeEditor , updateCellValue } from '../../actionCreators' ; import defaultOptions from '../../defaultOptions' ; import { ICellEditorProps } from '../../props' ; import { getElementCustomization } from '../../Utils/ComponentUtils' ; const CellEditorNumber = ( props ) => { const { column , dispatch , value , rowKeyValue , autoFocus , childComponents } = props ; const { elementAttributes , content } = getElementCustomization < HTMLInputElement > ( { className : `${ defaultOptions . css . numberInput }` , autoFocus , type : 'number' , value : value === null || value === undefined ? '' : value , onChange : ( event ) => { const newValue = event . currentTarget . value !== '' ? Number ( event . currentTarget . value ) : null ; dispatch ( updateCellValue ( rowKeyValue , column . key , newValue ) ) ; } , onBlur : ( ) => { dispatch ( closeEditor ( rowKeyValue , column . key ) ) ; } } , props , childComponents ?. cellEditorInput ) ; return ( content || ( < input { ... elementAttributes } / > ) ) ; } ; export default CellEditorNumber ;