Updated docs and examples.

README.md

@@ -2,15 +2,15 @@
 
 [![Build Status](https://travis-ci.org/enzoferey/slate-instant-replace.svg?branch=master)](https://travis-ci.org/enzoferey/slate-instant-replace)
 
-A Slate plugin to automatically replace text automatically when the user types certain strings.
+A Slate plugin that gives you full power on the last word your user typed.
 
 #### Why ?
 
 I was looking at some plugin to automatically replace some text at the very same moment that you press the key that completes the word you want to replace. There is already a SlateJS [auto replace plugin](https://github.com/ianstormtaylor/slate-plugins/tree/master/packages/slate-auto-replace), however you need to specify a key to trigger the replacement and this key cannot be a part of the replaced text.
 
 #### How ?
 
-This plugin applies your transformations everytime you write a new letter and has no opinion on the changes you make to the SlateJS's `change` object. It gives you the change object and the last word and the rest is up to you !
+This plugin applies your transformations every time you write a new letter and has no opinion on the changes you make to the SlateJS's `editor` instance. Your transformation functions will receive as arguments the editor instance and the last word write and the rest is up to you !
 
 ## Install
 
@@ -24,7 +24,7 @@ npm install --save slate-instant-replace
 import InstantReplace from "slate-instant-replace";
 import { Editor } from "slate-react";
 
-const YourFunction = (change, lastWord) => {
+const YourFunction = (editor, lastWord) => {
   ...
 }
 
@@ -52,6 +52,19 @@ const plugins = [InstantReplace([YourFunction1, YourFunction2, YourFunction3])];
 | --------------- | ------------------------------ | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
 | **`transform`** | `Function` `ArrayOf(Function)` | The transforms to apply to the `change` object each time a letter is pressed. If an array is passed, the functions will be applied from the first element of the array to the last. |
 
+## Commands and queries
+
+Additionally this plugins exposes the follow [commands and queries](https://docs.slatejs.org/guides/commands-and-queries) if you want to reuse them for your other plugins:
+
+| Name                    | Type      | Description                                                                       |
+| ----------------------- | --------- | --------------------------------------------------------------------------------- |
+| getSelection            | `query`   | Returns the current selection.                                                    |
+| getCurrentWordOffset    | `query`   | Returns the offset of the current word in the node.                               |
+| getLastWord             | `query`   | Returns the last word using as a reference the current anchor position.           |
+| getPreviousNode         | `query`   | Returns the previous node to the one currently focused.                           |
+| isFirstCharOfNode       | `query`   | Returns true if the anchor is at position 0 of the current node.                  |
+| focusPreviousInlineNode | `command` | Focuses the previous [`Inline`](https://docs.slatejs.org/slate-core/inline) node. |
+
 ## Examples
 
 - Emoji auto replacement ([check source code](https://github.com/enzoferey/slate-instant-replace/blob/master/examples/emojis-example/src/Slate.js))

examples/emojis-example/src/Slate.js

@@ -2,10 +2,11 @@ import React from "react";
 import { Editor } from "slate-react";
 import Plain from "slate-plain-serializer";
 
-import InstantReplace from "./lib";
+import InstantReplace from "slate-instant-replace";
 
 import { toArray } from "react-emoji-render";
 
+// Check out react-emoji-render, pretty cool library !
 const parseEmojis = value => {
   const emojisArray = toArray(value);
   const newValue = emojisArray.reduce((previous, current) => {
@@ -16,9 +17,9 @@ const parseEmojis = value => {
 };
 
 // Transformation function
-const AddEmojis = (change, lastWord) => {
-  change.extend(-lastWord.length); // select last word
-  change.insertText(parseEmojis(lastWord)); // replace it
+const AddEmojis = (editor, lastWord) => {
+  editor.moveFocusBackward(lastWord.length); // select last word
+  editor.insertText(parseEmojis(lastWord)); // replace it
 };
 
 // Initialise the plugin

examples/multiple-transforms-example/src/Slate.js

@@ -2,10 +2,11 @@ import React from "react";
 import { Editor } from "slate-react";
 import Plain from "slate-plain-serializer";
 
-import InstantReplace from "./lib";
+import InstantReplace from "slate-instant-replace";
 
 import { toArray } from "react-emoji-render";
 
+// Check out react-emoji-render, pretty cool library !
 const parseEmojis = value => {
   const emojisArray = toArray(value);
   const newValue = emojisArray.reduce((previous, current) => {
@@ -16,16 +17,16 @@ const parseEmojis = value => {
 };
 
 // Transformation function
-const AddEmojis = (change, lastWord) => {
-  change.extend(-lastWord.length); // select last word
-  change.insertText(parseEmojis(lastWord)); // replace it
+const AddEmojis = (editor, lastWord) => {
+  editor.moveFocusBackward(lastWord.length); // select last word
+  editor.insertText(parseEmojis(lastWord)); // replace it
 };
 
 // Transformation function 2
-const CustomTransform = (change, lastWord) => {
+const CustomTransform = (editor, lastWord) => {
   if (lastWord === "hello") {
-    change.extend(-lastWord.length); // select last word
-    change.insertText("hi"); // replace it
+    editor.moveFocusBackward(lastWord.length); // select last word
+    editor.insertText("hi"); // replace it
   }
 };
 

examples/urls-example/src/Slate.js

@@ -2,18 +2,18 @@ import React from "react";
 import { Editor } from "slate-react";
 import Plain from "slate-plain-serializer";
 
-import InstantReplace from "./lib";
+import InstantReplace from "slate-instant-replace";
 
 import isUrl from "is-url";
 
 // Transformation function
-const AddURL = (change, lastWord) => {
+const AddURL = (editor, lastWord) => {
   if (isUrl(lastWord)) {
-    change.extend(-lastWord.length); // select last word
-    change.unwrapInline("link"); // remove existing urls
+    editor.moveFocusBackward(lastWord.length); // select last word
+    editor.unwrapInline("link"); // remove existing urls
     const href = lastWord.startsWith("http") ? lastWord : `https://${lastWord}`;
-    change.wrapInline({ type: "link", data: { href } }); // set URL inline
-    change.extend(lastWord.length); // deselect it
+    editor.wrapInline({ type: "link", data: { href } }); // set URL inline
+    editor.moveFocusForward(lastWord.length); // deselect it
   }
 };
 

lib/commands.js

@@ -2,7 +2,7 @@ import { Inline } from "slate";
 
 import { getPreviousNode, isFirstCharOfNode } from "./queries";
 
-export const focusPreviousNode = editor => {
+export const focusPreviousInlineNode = editor => {
   if (isFirstCharOfNode(editor)) {
     const previousNode = getPreviousNode(editor);
     if (previousNode && Inline.isInline(previousNode)) {

lib/index.js

@@ -5,7 +5,7 @@ import {
   getPreviousNode,
   isFirstCharOfNode,
 } from "./queries";
-import { focusPreviousNode } from "./commands";
+import { focusPreviousInlineNode } from "./commands";
 import { isPrintableChar, isCtrlOrCmd, isSpace } from "./keyHelpers";
 
 const InstantReplace = transforms => ({
@@ -17,15 +17,15 @@ const InstantReplace = transforms => ({
     isFirstCharOfNode,
   },
   commands: {
-    focusPreviousNode,
+    focusPreviousInlineNode,
   },
   onKeyDown(event, editor, next) {
     if (!isPrintableChar(event)) return next();
 
     // Needed to handle space & control + key actions by default
     if (!isCtrlOrCmd(event)) {
       // Focus previous node to make sure to write inside the previous Inline
-      if (!isSpace(event)) focusPreviousNode(editor);
+      if (!isSpace(event)) focusPreviousInlineNode(editor);
 
       // Insert the text manually
       editor.insertText(event.key);

package.json

@@ -1,7 +1,7 @@
 {
   "name": "slate-instant-replace",
-  "version": "0.1.8",
-  "description": "A Slate plugin to automatically replace text automatically when the user types certain strings.",
+  "version": "0.1.9",
+  "description": "A Slate plugin that gives you full power on the last word your user typed.",
   "repository": "git://github.com/enzoferey/slate-instant-replace.git",
   "main": "./dist/index.js",
   "files": [
@@ -35,7 +35,9 @@
     "slate",
     "autocomplete",
     "replace",
-    "editor"
+    "editor",
+    "last",
+    "word"
   ],
   "dependencies": {}
 }