remove marks, in favor of text properties (#3235)

* remove marks, in favor of text properties

* fix lint

* fix more examples

* update docs

packages/slate-hyperscript/src/creators.ts

@@ -1,9 +1,7 @@
 import {
   Element,
   Descendant,
-  Mark,
   Node,
-  Path,
   Range,
   Text,
   Editor,
@@ -37,7 +35,7 @@ const resolveDescendants = (children: any[]): Descendant[] => {
     const prev = nodes[nodes.length - 1]
 
     if (typeof child === 'string') {
-      const text = { text: child, marks: [] }
+      const text = { text: child }
       STRINGS.add(text)
       child = text
     }
@@ -49,8 +47,7 @@ const resolveDescendants = (children: any[]): Descendant[] => {
         Text.isText(prev) &&
         STRINGS.has(prev) &&
         STRINGS.has(c) &&
-        c.marks.every(m => Mark.exists(m, prev.marks)) &&
-        prev.marks.every(m => Mark.exists(m, c.marks))
+        Text.equals(prev, c, { loose: true })
       ) {
         prev.text += c.text
       } else {
@@ -143,43 +140,6 @@ export function createFragment(
   return resolveDescendants(children)
 }
 
-/**
- * Create a `Text` object with a mark applied.
- */
-
-export function createMark(
-  tagName: string,
-  attributes: { [key: string]: any },
-  children: any[]
-): Text {
-  const mark = { ...attributes }
-  const nodes = resolveDescendants(children)
-
-  if (nodes.length > 1) {
-    throw new Error(
-      `The <mark> hyperscript tag must only contain a single node's worth of children.`
-    )
-  }
-
-  if (nodes.length === 0) {
-    return { text: '', marks: [mark] }
-  }
-
-  const [node] = nodes
-
-  if (!Text.isText(node)) {
-    throw new Error(
-      `The <mark> hyperscript tag must only contain text content as children.`
-    )
-  }
-
-  if (!Mark.exists(mark, node.marks)) {
-    node.marks.push(mark)
-  }
-
-  return node
-}
-
 /**
  * Create a `Selection` object.
  */
@@ -237,7 +197,7 @@ export function createText(
   let [node] = nodes
 
   if (node == null) {
-    node = { text: '', marks: [] }
+    node = { text: '' }
   }
 
   if (!Text.isText(node)) {
@@ -245,8 +205,8 @@ export function createText(
     The <text> hyperscript tag can only contain text content as children.`)
   }
 
-  // COMPAT: Re-create the node, because if they used the <text> tag we want to
-  // guarantee that it won't be merge with other string children.
+  // COMPAT: If they used the <text> tag we want to guarantee that it won't be
+  // merge with other string children.
   STRINGS.delete(node)
 
   Object.assign(node, attributes)

packages/slate-hyperscript/src/hyperscript.ts

@@ -1,5 +1,5 @@
 import isPlainObject from 'is-plain-object'
-import { Element, Mark } from 'slate'
+import { Element } from 'slate'
 import {
   createAnchor,
   createCursor,
@@ -7,7 +7,6 @@ import {
   createElement,
   createFocus,
   createFragment,
-  createMark,
   createSelection,
   createText,
 } from './creators'
@@ -23,7 +22,6 @@ const DEFAULT_CREATORS = {
   element: createElement,
   focus: createFocus,
   fragment: createFragment,
-  mark: createMark,
   selection: createSelection,
   text: createText,
 }
@@ -54,16 +52,13 @@ const createHyperscript = (
   options: {
     creators?: HyperscriptCreators
     elements?: HyperscriptShorthands
-    marks?: HyperscriptShorthands
   } = {}
 ) => {
-  const { elements = {}, marks = {} } = options
+  const { elements = {} } = options
   const elementCreators = normalizeElements(elements)
-  const markCreators = normalizeMarks(marks)
   const creators = {
     ...DEFAULT_CREATORS,
     ...elementCreators,
-    ...markCreators,
     ...options.creators,
   }
 
@@ -132,32 +127,4 @@ const normalizeElements = (elements: HyperscriptShorthands) => {
   return creators
 }
 
-/**
- * Normalize a dictionary of mark shorthands into creator functions.
- */
-
-const normalizeMarks = (marks: HyperscriptShorthands) => {
-  const creators: HyperscriptCreators<Mark> = {}
-
-  for (const tagName in marks) {
-    const props = marks[tagName]
-
-    if (typeof props !== 'object') {
-      throw new Error(
-        `Properties specified for a hyperscript shorthand should be an object, but for the custom mark <${tagName}> tag you passed: ${props}`
-      )
-    }
-
-    creators[tagName] = (
-      tagName: string,
-      attributes: { [key: string]: any },
-      children: any[]
-    ) => {
-      return createMark('mark', { ...props, ...attributes }, children)
-    }
-  }
-
-  return creators
-}
-
 export { createHyperscript, HyperscriptCreators, HyperscriptShorthands }

packages/slate-hyperscript/src/tokens.ts

@@ -1,4 +1,4 @@
-import { Mark, Node, Path, Text } from 'slate'
+import { Node, Path, Text } from 'slate'
 
 /**
  * A weak map to hold anchor tokens.
@@ -23,23 +23,17 @@ export class Token {}
  */
 
 export class AnchorToken extends Token {
-  focused: boolean
-  marks: Mark[] | null
   offset?: number
   path?: Path
 
   constructor(
     props: {
-      focused?: boolean
-      marks?: Mark[] | null
       offset?: number
       path?: Path
     } = {}
   ) {
     super()
-    const { focused = true, marks = null, offset, path } = props
-    this.focused = focused
-    this.marks = marks
+    const { offset, path } = props
     this.offset = offset
     this.path = path
   }
@@ -50,23 +44,17 @@ export class AnchorToken extends Token {
  */
 
 export class FocusToken extends Token {
-  focused: boolean
-  marks: Mark[] | null
   offset?: number
   path?: Path
 
   constructor(
     props: {
-      focused?: boolean
-      marks?: Mark[] | null
       offset?: number
       path?: Path
     } = {}
   ) {
     super()
-    const { focused = true, marks = null, offset, path } = props
-    this.focused = focused
-    this.marks = marks
+    const { offset, path } = props
     this.offset = offset
     this.path = path
   }