@slate-editor/alignment-plugin

Installation

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

``sh
yarn add @slate-editor/alignment-plugin
`

Usage

Here is a quick example to get you started:

`js
import React from 'react'
import { SlateEditor, SlateToolbar, SlateContent } from 'slate-editor'
import { AlignmentPlugin, AlignmentButtonBar } from '@slate-editor/alignment-plugin'

const plugins = [
AlignmentPlugin()
]

const SlateRichTextEditor = () => (







)

export default SlateRichTextEditor
`

Keyboard Shortcut

| OS | Action | Shortcut |
|--------------------------|--------------|---------------------------------------------------|
| ![Apple Logo][apple] | Align Left | ⌘ + shift + l |
| ![Apple Logo][apple] | Align Center | ⌘ + shift + c |
| ![Apple Logo][apple] | Align Right | ⌘ + shift + r |
| ![Windows Logo][windows] | Align Left | alt + shift + l |
| ![Windows Logo][windows] | Align Center | alt + shift + c |
| ![Windows Logo][windows] | Align Right | alt + shift + r |

API

| Name | Description |
|---------------------------|--------------------------------------------------------------------------------|
| AlignmentNode | Component that holds the html that will wrap the content with alignment style. |
| AlignmentUtils | Generic file that holds the util common functions. |
| AlignmentButtonBar | Component that holds all action buttons to handle the alignment behaviour. |
| AlignmentLeftButton | Component that holds button to handle the left alignment behaviour. |
| AlignmentCenterButton | Component that holds button to handle the center alignment behaviour. |
| AlignmentRightButton | Component that holds button to handle the right alignment behaviour. |
| AlignmentKeyboardShortcut | Keyboard shortcut file that manipulates onKeyDown` event inside SlateJS. |

TODO

- Make keyboard shortcut accepts customization

[apple]: https://cdn2.iconfinder.com/data/icons/designer-skills/128/apple-ios-system-platform-os-mac-linux-48.png
[windows]: https://cdn2.iconfinder.com/data/icons/designer-skills/128/windows-48.png