@slate-editor/italic-plugin NPM

SlateJS - Italic Plugin

The goal of this plugin is to offers an easy handling of SlateJS italic mark node content editable. Providing a simple API and easy usage, basing on concept of plugin-centric by SlateJS framework.

Usage

SlateJS Italic Plugin

import React, { Component } from 'react'
import ItalicPlugin from 'slate-italic-plugin'

const plugins = [
  ItalicPlugin()
]

class SlateEditor extends Component {
  onChange(state) {
    this.setState({ state })
  }
  render() {
    return (
      <Editor
        plugins={plugins}
        state={this.state.state}
        onChange={this.onChange.bind(this)}
      />
    )
  }
}

SlateJS Italic Plugin Button

import React, { Component } from 'react'
import { ItalicButton } from 'slate-italic-plugin'

class SlateEditor extends Component {
  onChange(state) {
    this.setState({ state })
  }
  render() {
    return (
      <div className="editor--toolbar">
        <ItalicButton
          state={this.state.state}
          onChange={this.onChange.bind(this)}
        />
      </div>
    )
  }
}

Keyboard Shortcut

Platform	Shortcut
	`⌘`+`i`
	`^`+`i`

API

Target	Description
ItalicMark	Component that holds the html that will wrap the content with italic style.
ItalicKeyboardShortcut	Keyboard shortcut file that manipulates `onKeyDown` event inside SlateJS.
ItalicUtils	Generic file that holds the util common functions.
ItalicButton	Button component that have behaviour to wrap content with italic style.