Skip to content
This repository has been archived by the owner on Nov 4, 2021. It is now read-only.

Latest commit

 

History

History

slate-editor-list-plugin

Folders and files

NameName
Last commit message
Last commit date

parent directory

..
 
 
 
 
 
 
 
 
 
 
 
 
Nossas Cidades logo

@slate-editor/list-plugin

SlateJS list plugin.

npm package npm downloads

Installation

The @slate-editor/list-plugin is available as an npm package.

yarn add @slate-editor/list-plugin

Usage

Here is a quick example to get you started:

import React from 'react'
import { SlateEditor, SlateToolbar, SlateContent } from 'slate-editor'
import { ListPlugin, ListButtonBar } from '@slate-editor/list-plugin'

const plugins = [
  ListPlugin()
]

const SlateRichTextEditor = () => (
  <SlateEditor plugins={plugins}>
    <SlateToolbar>
      <ListButtonBar />
    </SlateToolbar>

    <SlateContent />
  </SlateEditor>
)

export default SlateRichTextEditor

Keyboard Shortcut

OS Action Shortcut
Apple Logo Unordered List ^ + shift + l
Apple Logo Ordered List ^ + shift + n
Windows Logo Unordered List alt + shift + l
Windows Logo Ordered List alt + shift + n

API

Name Description
ListNode Component that holds the html that will wrap the content with list style.
ListKeyboardShortcut Keyboard shortcut file that manipulates onKeyDown event inside SlateJS.
ListUtils Generic file that holds the util common functions.
ListButtonBar Component that holds all action buttons to handle list behaviours.
UnorderedListButton Component that render ordered list button to handle its behaviour.
OrderedListButton Component that render unordered list button to handle its behaviour.

TODO

  • Make keyboard shortcut accepts customization