halumz / react-slate-customized

react-slate-customized

react-slate-customized

A Slate example to improvise the editor using react and Slate

Demo Link

Features

An enhanced standard rich text using Slate

• Images:

  • Image linking from url
  • Image upload with button drop desktop using dropzone

• Lists: Ordered and unordered lists with tab support using slate-edit-list

  • Pressing Enter insert a new list item
  • Pressing Shift+Enter split the block in the list item
  • Pressing Tab increase the depth of the item (creates a sub-list)
  • Pressing Shift+Tab decrease the depth of the item
  • Pressing Delete (OSX) or Backspace at the start, remove the list item (or the list)

• Save/Cancel functionality

  • Save - stores new editor content in localstorage included image path
  • Cancel - restores to the old saved content from localstorage

• Number of top-level block is restricted in config->MAX_LENGTH file

• Number of maximum tab count is restricted in config->MAX_TAB_COUNT file