[hyperscript] rename decorators option in params to decorations (#2074)

#### Is this adding or improving a _feature_ or fixing a _bug_?

Debt.

#### What's the new behavior?

`createHyperscript` takes an options object that now looks for the `decorations` property instead of the `decorators` property

#### How does this change work?

Pretty straightforward rename of an option, then all of its uses and wherever the term decorators showed up in docs

#### Have you checked that...?

* [x] The new code matches the existing patterns and styles.
* [x] The tests pass with `yarn test`.
* [x] The linter passes with `yarn lint`. (Fix errors with `yarn prettier`.)
* [x] The relevant examples still work. (Run examples with `yarn watch`.)

#### Does this fix any issues or need any specific reviewers?

Fixes: #1996
Reviewers: @ianstormtaylor

Readme.md

@@ -38,7 +38,7 @@
   </a>
   <a href="https://slate-slack.herokuapp.com">
     <img src="https://slate-slack.herokuapp.com/badge.svg">
-  <a/> 
+  </a>
   <a href="./packages/slate/package.json">
     <img src="https://img.shields.io/npm/v/slate.svg?maxAge=3600&label=slate&colorB=007ec6">
   </a>
@@ -127,7 +127,7 @@ To get a sense for how you might use Slate, check out a few of the examples:
 * [**Hovering menu**](./examples/hovering-menu) — showing how a contextual hovering menu can be implemented.
 * [**Tables**](./examples/tables) — showing how to nest blocks to render more advanced components.
 * [**Paste HTML**](./examples/paste-html) — showing how to use an HTML serializer to handle pasted HTML.
-* [**Code Highlighting**](./examples/code-highlighting) — showing how to use decorators to dynamically mark text.
+* [**Code Highlighting**](./examples/code-highlighting) — showing how to use decorations to dynamically mark text.
 * [**See all the examples...**](./examples)
 
 If you have an idea for an example that shows a common use case, pull request it!

docs/Introduction.md

@@ -70,7 +70,7 @@ To get a sense for how you might use Slate, check out a few of the examples:
 * [**Hovering menu**](https://github.com/ianstormtaylor/slate/tree/master/examples/hovering-menu) — showing how a contextual hovering menu can be implemented.
 * [**Tables**](https://github.com/ianstormtaylor/slate/tree/master/examples/tables) — showing how to nest blocks to render more advanced components.
 * [**Paste HTML**](https://github.com/ianstormtaylor/slate/tree/master/examples/paste-html) — showing how to use an HTML serializer to handle pasted HTML.
-* [**Code Highlighting**](https://github.com/ianstormtaylor/slate/tree/master/examples/code-highlighting) — showing how to use decorators to dynamically mark text.
+* [**Code Highlighting**](https://github.com/ianstormtaylor/slate/tree/master/examples/code-highlighting) — showing how to use decorations to dynamically mark text.
 
 If you have an idea for an example that shows a common use case, pull request it!
 

examples/Readme.md

@@ -13,7 +13,7 @@ This directory contains a set of examples that give you an idea for how you migh
 * [**Hovering menu**](./hovering-menu) — showing how a contextual hovering menu can be implemented.
 * [**Tables**](./tables) — showing how to nest blocks to render more advanced components.
 * [**Paste HTML**](./paste-html) — showing how to use an HTML serializer to handle pasted HTML.
-* [**Code Highlighting**](./code-highlighting) — showing how to use decorators to dynamically mark text.
+* [**Code Highlighting**](./code-highlighting) — showing how to use decorations to dynamically mark text.
 * ...and more!
 
 If you have an idea for an example that shows a common use case, pull request it!

examples/markdown-preview/index.js

@@ -26,7 +26,7 @@ class MarkdownPreview extends React.Component {
 
   state = {
     value: Plain.deserialize(
-      'Slate is flexible enough to add **decorators** that can format text based on its content. For example, this editor has **Markdown** preview decorators on it, to make it _dead_ simple to make an editor with built-in Markdown previewing.\n## Try it out!\nTry it out for yourself!'
+      'Slate is flexible enough to add **decorations** that can format text based on its content. For example, this editor has **Markdown** preview decorations on it, to make it _dead_ simple to make an editor with built-in Markdown previewing.\n## Try it out!\nTry it out for yourself!'
     ),
   }
 

packages/slate-hyperscript/src/index.js

@@ -445,7 +445,7 @@ function createChildren(children, options = {}) {
  */
 
 function resolveCreators(options) {
-  const { blocks = {}, inlines = {}, marks = {}, decorators = {} } = options
+  const { blocks = {}, inlines = {}, marks = {}, decorations = {} } = options
 
   const creators = {
     ...CREATORS,
@@ -464,8 +464,8 @@ function resolveCreators(options) {
     creators[key] = normalizeMark(key, marks[key])
   })
 
-  Object.keys(decorators).map(key => {
+  Object.keys(decorations).map(key => {
-    creators[key] = normalizeNode(key, decorators[key], 'decoration')
+    creators[key] = normalizeNode(key, decorations[key], 'decoration')
   })
 
   return creators

packages/slate-hyperscript/test/decorations/across-blocks.js

@@ -6,7 +6,7 @@ const h = createHyperscript({
   blocks: {
     paragraph: 'paragraph',
   },
-  decorators: {
+  decorations: {
     highlight: 'highlight',
   },
 })

packages/slate-hyperscript/test/decorations/across-marks.js

@@ -9,7 +9,7 @@ const h = createHyperscript({
   marks: {
     b: 'bold',
   },
-  decorators: {
+  decorations: {
     highlight: 'highlight',
   },
 })

packages/slate-hyperscript/test/decorations/deep-anchors.js

@@ -7,7 +7,7 @@ const h = createHyperscript({
     ul: 'ul',
     li: 'li',
   },
-  decorators: {
+  decorations: {
     highlight: 'highlight',
   },
 })

packages/slate-hyperscript/test/decorations/intersecting-marks.js

@@ -9,7 +9,7 @@ const h = createHyperscript({
   marks: {
     b: 'bold',
   },
-  decorators: {
+  decorations: {
     highlight: 'highlight',
   },
 })

packages/slate-hyperscript/test/decorations/multiple.js

@@ -6,7 +6,7 @@ const h = createHyperscript({
   blocks: {
     paragraph: 'paragraph',
   },
-  decorators: {
+  decorations: {
     highlight: 'highlight',
     lowlight: 'lowlight',
   },

packages/slate-hyperscript/test/decorations/nested.js

@@ -6,7 +6,7 @@ const h = createHyperscript({
   blocks: {
     paragraph: 'paragraph',
   },
-  decorators: {
+  decorations: {
     highlight: 'highlight',
   },
 })

packages/slate-hyperscript/test/decorations/overlapping.js

@@ -6,7 +6,7 @@ const h = createHyperscript({
   blocks: {
     paragraph: 'paragraph',
   },
-  decorators: {
+  decorations: {
     highlight: 'highlight',
   },
 })

packages/slate-hyperscript/test/fixtures/decoration-across-blocks.js

@@ -6,7 +6,7 @@ const h = createHyperscript({
   blocks: {
     paragraph: 'paragraph',
   },
-  decorators: {
+  decorations: {
     highlight: 'highlight',
   },
 })

packages/slate-hyperscript/test/fixtures/decoration.js

@@ -6,7 +6,7 @@ const h = createHyperscript({
   blocks: {
     paragraph: 'paragraph',
   },
-  decorators: {
+  decorations: {
     highlight: 'highlight',
   },
 })

packages/slate/test/helpers/h.js

@@ -28,7 +28,7 @@ const h = createHyperscript({
     u: 'underline',
     fontSize: 'font-size',
   },
-  decorators: {
+  decorations: {
     highlight: 'highlight',
   },
 })