Introduce annotations (#2747)

* first stab at removing leaves with tests passing

* fixes

* add iterables to the element interface

* use iterables in more places

* update examples to use iterables

* update naming

* fix tests

* convert more key-based logic to paths

* add range support to iterables

* refactor many methods to use iterables, deprecate cruft

* clean up existing iterables

* more cleanup

* more cleaning

* fix word count example

* work

* split decoration and annotations

* update examples for `renderNode` useage

* deprecate old DOM-based helpers, update examples

* make formats first class, refactor leaf rendering

* fix examples, fix isAtomic checking

* deprecate leaf model

* convert Text and Leaf to functional components

* fix lint and tests

packages/slate-hyperscript/test/fixtures/annotation-across-block.js

@@ -6,7 +6,7 @@ const h = createHyperscript({
   blocks: {
     paragraph: 'paragraph',
   },
-  decorations: {
+  annotations: {
     highlight: 'highlight',
   },
 })
@@ -22,7 +22,7 @@ export const input = (
 )
 
 export const options = {
-  preserveDecorations: true,
+  preserveAnnotations: true,
   preserveKeys: true,
 }
 
@@ -49,9 +49,12 @@ export const output = {
       },
     ],
   },
-  decorations: [
+  annotations: [
     {
-      object: 'decoration',
+      key: '0',
+      object: 'annotation',
+      type: 'highlight',
+      data: {},
       anchor: {
         object: 'point',
         key: '1',
@@ -64,11 +67,6 @@ export const output = {
         path: [0, 0],
         offset: 6,
       },
-      mark: {
-        object: 'mark',
-        type: 'highlight',
-        data: {},
-      },
     },
   ],
 }

packages/slate-hyperscript/test/fixtures/annotation-across-multiple-blocks.js

@@ -6,7 +6,7 @@ const h = createHyperscript({
   blocks: {
     paragraph: 'paragraph',
   },
-  decorations: {
+  annotations: {
     highlight: 'highlight',
   },
 })
@@ -25,7 +25,7 @@ export const input = (
 )
 
 export const options = {
-  preserveDecorations: true,
+  preserveAnnotations: true,
   preserveKeys: true,
 }
 
@@ -66,9 +66,12 @@ export const output = {
       },
     ],
   },
-  decorations: [
+  annotations: [
     {
-      object: 'decoration',
+      object: 'annotation',
+      key: 'a',
+      type: 'highlight',
+      data: {},
       anchor: {
         object: 'point',
         key: '0',
@@ -81,11 +84,6 @@ export const output = {
         path: [1, 0],
         offset: 2,
       },
-      mark: {
-        object: 'mark',
-        type: 'highlight',
-        data: {},
-      },
     },
   ],
 }