@tiptap/core 2.1.0-rc.9 → 2.1.0

package/src/inputRules/index.ts

@@ -1,5 +1,5 @@
-export * from './markInputRule'
-export * from './nodeInputRule'
-export * from './textblockTypeInputRule'
-export * from './textInputRule'
-export * from './wrappingInputRule'
+export * from './markInputRule.js'
+export * from './nodeInputRule.js'
+export * from './textblockTypeInputRule.js'
+export * from './textInputRule.js'
+export * from './wrappingInputRule.js'

package/src/inputRules/markInputRule.ts

@@ -1,9 +1,9 @@
 import { MarkType } from '@tiptap/pm/model'
 
-import { getMarksBetween } from '../helpers/getMarksBetween'
-import { InputRule, InputRuleFinder } from '../InputRule'
-import { ExtendedRegExpMatchArray } from '../types'
-import { callOrReturn } from '../utilities/callOrReturn'
+import { getMarksBetween } from '../helpers/getMarksBetween.js'
+import { InputRule, InputRuleFinder } from '../InputRule.js'
+import { ExtendedRegExpMatchArray } from '../types.js'
+import { callOrReturn } from '../utilities/callOrReturn.js'
 
 /**
  * Build an input rule that adds a mark when the
@@ -30,7 +30,6 @@ export function markInputRule(config: {
       const { tr } = state
       const captureGroup = match[match.length - 1]
       const fullMatch = match[0]
-      let markEnd = range.to
 
       if (captureGroup) {
         const startSpaces = fullMatch.search(/\S/)
@@ -58,7 +57,7 @@ export function markInputRule(config: {
           tr.delete(range.from + startSpaces, textStart)
         }
 
-        markEnd = range.from + startSpaces + captureGroup.length
+        const markEnd = range.from + startSpaces + captureGroup.length
 
         tr.addMark(range.from + startSpaces, markEnd, config.type.create(attributes || {}))
 

package/src/inputRules/nodeInputRule.ts

@@ -1,16 +1,41 @@
 import { NodeType } from '@tiptap/pm/model'
+import { NodeSelection, TextSelection } from '@tiptap/pm/state'
 
-import { InputRule, InputRuleFinder } from '../InputRule'
-import { ExtendedRegExpMatchArray } from '../types'
-import { callOrReturn } from '../utilities/callOrReturn'
+import { InputRule, InputRuleFinder } from '../InputRule.js'
+import { ExtendedRegExpMatchArray } from '../types.js'
+import { callOrReturn } from '../utilities/callOrReturn.js'
 
 /**
  * Build an input rule that adds a node when the
  * matched text is typed into it.
  */
 export function nodeInputRule(config: {
+  /**
+   * The regex to match.
+   */
   find: InputRuleFinder
+
+  /**
+   * The node type to add.
+   */
   type: NodeType
+
+  /**
+   * Should the input rule replace the node or append to it
+   * If true, the node will be replaced
+   */
+  blockReplace?: boolean
+
+  /**
+   * Insert empty paragraph after inserting the node
+   * Only works if blockReplace is true
+   */
+  addExtraNewline?: boolean
+
+  /**
+   * A function that returns the attributes for the node
+   * can also be an object of attributes
+   */
   getAttributes?:
     | Record<string, any>
     | ((match: ExtendedRegExpMatchArray) => Record<string, any>)
@@ -22,9 +47,13 @@ export function nodeInputRule(config: {
     handler: ({ state, range, match }) => {
       const attributes = callOrReturn(config.getAttributes, undefined, match) || {}
       const { tr } = state
-      const start = range.from
+      const start = config.blockReplace ? range.from - 1 : range.from
       let end = range.to
 
+      const newNode = config.type.create(attributes)
+
+      const { $to } = tr.selection
+
       if (match[1]) {
         const offset = match[0].lastIndexOf(match[1])
         let matchStart = start + offset
@@ -41,9 +70,34 @@ export function nodeInputRule(config: {
         tr.insertText(lastChar, start + match[0].length - 1)
 
         // insert node from input rule
-        tr.replaceWith(matchStart, end, config.type.create(attributes))
+        tr.replaceWith(matchStart, end, newNode)
       } else if (match[0]) {
-        tr.replaceWith(start, end, config.type.create(attributes))
+        tr.replaceWith(start, end, newNode)
+      }
+
+      if (config.blockReplace && config.addExtraNewline) {
+        const posAfter = $to.end()
+
+        if ($to.nodeAfter) {
+          console.log($to.node().type.name)
+          if ($to.nodeAfter.isTextblock) {
+            tr.setSelection(TextSelection.create(tr.doc, $to.pos + 1))
+          } else if ($to.nodeAfter.isBlock) {
+            tr.setSelection(NodeSelection.create(tr.doc, $to.pos))
+          } else {
+            tr.setSelection(TextSelection.create(tr.doc, $to.pos))
+          }
+        } else {
+          // add node after horizontal rule if it’s the end of the document
+          const node = $to.parent.type.contentMatch.defaultType?.create()
+
+          if (node) {
+            tr.insert(posAfter, node)
+            tr.setSelection(TextSelection.create(tr.doc, posAfter + 1))
+          }
+        }
+
+        tr.scrollIntoView()
       }
     },
   })

package/src/inputRules/textInputRule.ts

@@ -1,4 +1,4 @@
-import { InputRule, InputRuleFinder } from '../InputRule'
+import { InputRule, InputRuleFinder } from '../InputRule.js'
 
 /**
  * Build an input rule that replaces text when the

package/src/inputRules/textblockTypeInputRule.ts

@@ -1,8 +1,8 @@
 import { NodeType } from '@tiptap/pm/model'
 
-import { InputRule, InputRuleFinder } from '../InputRule'
-import { ExtendedRegExpMatchArray } from '../types'
-import { callOrReturn } from '../utilities/callOrReturn'
+import { InputRule, InputRuleFinder } from '../InputRule.js'
+import { ExtendedRegExpMatchArray } from '../types.js'
+import { callOrReturn } from '../utilities/callOrReturn.js'
 
 /**
  * Build an input rule that changes the type of a textblock when the

package/src/inputRules/wrappingInputRule.ts

@@ -1,10 +1,10 @@
 import { Node as ProseMirrorNode, NodeType } from '@tiptap/pm/model'
 import { canJoin, findWrapping } from '@tiptap/pm/transform'
 
-import { Editor } from '../Editor'
-import { InputRule, InputRuleFinder } from '../InputRule'
-import { ExtendedRegExpMatchArray } from '../types'
-import { callOrReturn } from '../utilities/callOrReturn'
+import { Editor } from '../Editor.js'
+import { InputRule, InputRuleFinder } from '../InputRule.js'
+import { ExtendedRegExpMatchArray } from '../types.js'
+import { callOrReturn } from '../utilities/callOrReturn.js'
 
 /**
  * Build an input rule for automatically wrapping a textblock when a

package/src/pasteRules/index.ts

@@ -1,3 +1,3 @@
-export * from './markPasteRule'
-export * from './nodePasteRule'
-export * from './textPasteRule'
+export * from './markPasteRule.js'
+export * from './nodePasteRule.js'
+export * from './textPasteRule.js'

package/src/pasteRules/markPasteRule.ts

@@ -1,9 +1,9 @@
 import { MarkType } from '@tiptap/pm/model'
 
-import { getMarksBetween } from '../helpers/getMarksBetween'
-import { PasteRule, PasteRuleFinder } from '../PasteRule'
-import { ExtendedRegExpMatchArray } from '../types'
-import { callOrReturn } from '../utilities/callOrReturn'
+import { getMarksBetween } from '../helpers/getMarksBetween.js'
+import { PasteRule, PasteRuleFinder } from '../PasteRule.js'
+import { ExtendedRegExpMatchArray } from '../types.js'
+import { callOrReturn } from '../utilities/callOrReturn.js'
 
 /**
  * Build an paste rule that adds a mark when the

package/src/pasteRules/nodePasteRule.ts

@@ -1,8 +1,8 @@
 import { NodeType } from '@tiptap/pm/model'
 
-import { PasteRule, PasteRuleFinder } from '../PasteRule'
-import { ExtendedRegExpMatchArray } from '../types'
-import { callOrReturn } from '../utilities'
+import { PasteRule, PasteRuleFinder } from '../PasteRule.js'
+import { ExtendedRegExpMatchArray } from '../types.js'
+import { callOrReturn } from '../utilities/index.js'
 
 /**
  * Build an paste rule that adds a node when the

package/src/pasteRules/textPasteRule.ts

@@ -1,4 +1,4 @@
-import { PasteRule, PasteRuleFinder } from '../PasteRule'
+import { PasteRule, PasteRuleFinder } from '../PasteRule.js'
 
 /**
  * Build an paste rule that replaces text when the

package/src/types.ts

@@ -6,13 +6,13 @@ import {
   Decoration, EditorProps, EditorView, NodeView,
 } from '@tiptap/pm/view'
 
+import { Editor } from './Editor.js'
+import { Extension } from './Extension.js'
 import {
   Commands, ExtensionConfig, MarkConfig, NodeConfig,
-} from '.'
-import { Editor } from './Editor'
-import { Extension } from './Extension'
-import { Mark } from './Mark'
-import { Node } from './Node'
+} from './index.js'
+import { Mark } from './Mark.js'
+import { Node } from './Node.js'
 
 export type AnyConfig = ExtensionConfig | NodeConfig | MarkConfig
 export type AnyExtension = Extension | Node | Mark

package/src/utilities/callOrReturn.ts

@@ -1,5 +1,5 @@
-import { MaybeReturnType } from '../types'
-import { isFunction } from './isFunction'
+import { MaybeReturnType } from '../types.js'
+import { isFunction } from './isFunction.js'
 
 /**
  * Optionally calls `value` as a function.

package/src/utilities/createStyleTag.ts

@@ -1,5 +1,5 @@
-export function createStyleTag(style: string, nonce?: string): HTMLStyleElement {
-  const tiptapStyleTag = (<HTMLStyleElement>document.querySelector('style[data-tiptap-style]'))
+export function createStyleTag(style: string, nonce?: string, suffix?: string): HTMLStyleElement {
+  const tiptapStyleTag = (<HTMLStyleElement>document.querySelector(`style[data-tiptap-style${suffix ? `-${suffix}` : ''}]`))
 
   if (tiptapStyleTag !== null) {
     return tiptapStyleTag
@@ -11,7 +11,7 @@ export function createStyleTag(style: string, nonce?: string): HTMLStyleElement
     styleNode.setAttribute('nonce', nonce)
   }
 
-  styleNode.setAttribute('data-tiptap-style', '')
+  styleNode.setAttribute(`data-tiptap-style${suffix ? `-${suffix}` : ''}`, '')
   styleNode.innerHTML = style
   document.getElementsByTagName('head')[0].appendChild(styleNode)
 

package/src/utilities/index.ts

@@ -1,20 +1,20 @@
-export * from './callOrReturn'
-export * from './createStyleTag'
-export * from './deleteProps'
-export * from './elementFromString'
-export * from './escapeForRegEx'
-export * from './findDuplicates'
-export * from './fromString'
-export * from './isEmptyObject'
-export * from './isFunction'
-export * from './isiOS'
-export * from './isMacOS'
-export * from './isNumber'
-export * from './isPlainObject'
-export * from './isRegExp'
-export * from './isString'
-export * from './mergeAttributes'
-export * from './mergeDeep'
-export * from './minMax'
-export * from './objectIncludes'
-export * from './removeDuplicates'
+export * from './callOrReturn.js'
+export * from './createStyleTag.js'
+export * from './deleteProps.js'
+export * from './elementFromString.js'
+export * from './escapeForRegEx.js'
+export * from './findDuplicates.js'
+export * from './fromString.js'
+export * from './isEmptyObject.js'
+export * from './isFunction.js'
+export * from './isiOS.js'
+export * from './isMacOS.js'
+export * from './isNumber.js'
+export * from './isPlainObject.js'
+export * from './isRegExp.js'
+export * from './isString.js'
+export * from './mergeAttributes.js'
+export * from './mergeDeep.js'
+export * from './minMax.js'
+export * from './objectIncludes.js'
+export * from './removeDuplicates.js'

package/src/utilities/isAndroid.ts

@@ -0,0 +1,3 @@
+export function isAndroid(): boolean {
+  return navigator.platform === 'Android' || /android/i.test(navigator.userAgent)
+}

package/src/utilities/mergeAttributes.ts

@@ -14,7 +14,14 @@ export function mergeAttributes(...objects: Record<string, any>[]): Record<strin
         }
 
         if (key === 'class') {
-          mergedAttributes[key] = [mergedAttributes[key], value].join(' ')
+          const valueClasses: string[] = value.split(' ')
+          const existingClasses: string[] = mergedAttributes[key].split(' ')
+
+          const insertClasses = valueClasses.filter(
+            valueClass => !existingClasses.includes(valueClass),
+          )
+
+          mergedAttributes[key] = [...existingClasses, ...insertClasses].join(' ')
         } else if (key === 'style') {
           mergedAttributes[key] = [mergedAttributes[key], value].join('; ')
         } else {

package/src/utilities/mergeDeep.ts

@@ -1,4 +1,4 @@
-import { isPlainObject } from './isPlainObject'
+import { isPlainObject } from './isPlainObject.js'
 
 export function mergeDeep(target: Record<string, any>, source: Record<string, any>): Record<string, any> {
   const output = { ...target }

package/src/utilities/objectIncludes.ts

@@ -1,4 +1,4 @@
-import { isRegExp } from './isRegExp'
+import { isRegExp } from './isRegExp.js'
 
 /**
  * Check if object1 includes object2