Using Draft.js as a single-line input

Hey all 👋🏼 Today I want to share with you a very simple code on how to use Draft.js as a single line input.

import Draft, { Editor, ... } from 'draft-js'

const keyBindingFn = (e) => {
  if (!e.metaKey && e.code === 'Enter') {
    // Function to execute...
    return false
  }

  // Return Draft's default command for this key.
  return Draft.getDefaultKeyBinding(e)
}

<Editor 
  [..]
  keyBindingFn={keyBindingFn}
/>

The code above will add line breaks should the user presses the command key (mac) + enter key. Nothing will happen if the enter button alone is pressed. You could then execute a function to save the entered value.

Note the user could copy/paste inside the editor. For my setup, I'm ok with that.

✌🏼