Estoy usando el componente editable de la interfaz de usuario de chakra y configuro '-' como el valor predeterminado si no hay ningún valor disponible. Entonces, cuando se edita, la entrada es visible como se muestra a continuación. Pero quiero eliminar el '-' al editar.

Aquí está mi código.

 <Editable defaultValue={rate || '-'} submitOnBlur={false} > {(props) => ( <> <EditablePreview/> <EditableInput onBlur={null} /> <EditableControls {...props} id={no} /> </> )}

Caja de arena: https://codesandbox.io/s/summer-sound-0wvcr?file=/src/App.js