@tiptap/core 3.0.0-next.2 → 3.0.0-next.4

package/src/types.ts

@@ -1,9 +1,4 @@
-import {
-  Mark as ProseMirrorMark,
-  Node as ProseMirrorNode,
-  ParseOptions,
-  Slice,
-} from '@tiptap/pm/model'
+import { Mark as ProseMirrorMark, Node as ProseMirrorNode, ParseOptions, Slice } from '@tiptap/pm/model'
 import { EditorState, Transaction } from '@tiptap/pm/state'
 import { Mappable } from '@tiptap/pm/transform'
 import {
@@ -18,76 +13,71 @@ import {
 
 import { Editor } from './Editor.js'
 import { Extension } from './Extension.js'
-import {
-  Commands, ExtensionConfig, MarkConfig, NodeConfig,
-} from './index.js'
+import { Commands, ExtensionConfig, MarkConfig, NodeConfig } 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;
-export type Extensions = AnyExtension[];
+export type AnyConfig = ExtensionConfig | NodeConfig | MarkConfig
+export type AnyExtension = Extension | Node | Mark
+export type Extensions = AnyExtension[]
 
 export type ParentConfig<T> = Partial<{
   [P in keyof T]: Required<T>[P] extends (...args: any) => any
     ? (...args: Parameters<Required<T>[P]>) => ReturnType<Required<T>[P]>
-    : T[P];
-}>;
+    : T[P]
+}>
 
-export type Primitive = null | undefined | string | number | boolean | symbol | bigint;
+export type Primitive = null | undefined | string | number | boolean | symbol | bigint
 
-export type RemoveThis<T> = T extends (...args: any) => any
-  ? (...args: Parameters<T>) => ReturnType<T>
-  : T;
+export type RemoveThis<T> = T extends (...args: any) => any ? (...args: Parameters<T>) => ReturnType<T> : T
 
-export type MaybeReturnType<T> = T extends (...args: any) => any ? ReturnType<T> : T;
+export type MaybeReturnType<T> = T extends (...args: any) => any ? ReturnType<T> : T
 
-export type MaybeThisParameterType<T> = Exclude<T, Primitive> extends (...args: any) => any
-  ? ThisParameterType<Exclude<T, Primitive>>
-  : any;
+export type MaybeThisParameterType<T> =
+  Exclude<T, Primitive> extends (...args: any) => any ? ThisParameterType<Exclude<T, Primitive>> : any
 
 export interface EditorEvents {
-  beforeCreate: { editor: Editor };
-  create: { editor: Editor };
+  beforeCreate: { editor: Editor }
+  create: { editor: Editor }
   contentError: {
-    editor: Editor;
-    error: Error;
+    editor: Editor
+    error: Error
     /**
      * If called, will re-initialize the editor with the collaboration extension removed.
      * This will prevent syncing back deletions of content not present in the current schema.
      */
-    disableCollaboration: () => void;
-  };
-  update: { editor: Editor; transaction: Transaction };
-  selectionUpdate: { editor: Editor; transaction: Transaction };
-  beforeTransaction: { editor: Editor; transaction: Transaction; nextState: EditorState };
-  transaction: { editor: Editor; transaction: Transaction };
-  focus: { editor: Editor; event: FocusEvent; transaction: Transaction };
-  blur: { editor: Editor; event: FocusEvent; transaction: Transaction };
-  destroy: void;
-  paste: { editor: Editor; event: ClipboardEvent; slice: Slice };
-  drop: { editor: Editor; event: DragEvent; slice: Slice; moved: boolean };
+    disableCollaboration: () => void
+  }
+  update: { editor: Editor; transaction: Transaction; appendedTransactions: Transaction[] }
+  selectionUpdate: { editor: Editor; transaction: Transaction }
+  beforeTransaction: { editor: Editor; transaction: Transaction; nextState: EditorState }
+  transaction: { editor: Editor; transaction: Transaction; appendedTransactions: Transaction[] }
+  focus: { editor: Editor; event: FocusEvent; transaction: Transaction }
+  blur: { editor: Editor; event: FocusEvent; transaction: Transaction }
+  destroy: void
+  paste: { editor: Editor; event: ClipboardEvent; slice: Slice }
+  drop: { editor: Editor; event: DragEvent; slice: Slice; moved: boolean }
 }
 
-export type EnableRules = (AnyExtension | string)[] | boolean;
+export type EnableRules = (AnyExtension | string)[] | boolean
 
 export interface EditorOptions {
-  element: Element;
-  content: Content;
-  extensions: Extensions;
-  injectCSS: boolean;
-  injectNonce: string | undefined;
-  autofocus: FocusPosition;
-  editable: boolean;
-  editorProps: EditorProps;
-  parseOptions: ParseOptions;
+  element: Element
+  content: Content
+  extensions: Extensions
+  injectCSS: boolean
+  injectNonce: string | undefined
+  autofocus: FocusPosition
+  editable: boolean
+  editorProps: EditorProps
+  parseOptions: ParseOptions
   coreExtensionOptions?: {
     clipboardTextSerializer?: {
-      blockSeparator?: string;
-    };
-  };
-  enableInputRules: EnableRules;
-  enablePasteRules: EnableRules;
+      blockSeparator?: string
+    }
+  }
+  enableInputRules: EnableRules
+  enablePasteRules: EnableRules
   /**
    * Determines whether core extensions are enabled.
    *
@@ -119,112 +109,164 @@ export interface EditorOptions {
           | 'paste',
           false
         >
-      >;
+      >
   /**
    * If `true`, the editor will check the content for errors on initialization.
    * Emitting the `contentError` event if the content is invalid.
    * Which can be used to show a warning or error message to the user.
    * @default false
    */
-  enableContentCheck: boolean;
-  onBeforeCreate: (props: EditorEvents['beforeCreate']) => void;
-  onCreate: (props: EditorEvents['create']) => void;
+  enableContentCheck: boolean
+  onBeforeCreate: (props: EditorEvents['beforeCreate']) => void
+  onCreate: (props: EditorEvents['create']) => void
   /**
    * Called when the editor encounters an error while parsing the content.
    * Only enabled if `enableContentCheck` is `true`.
    */
-  onContentError: (props: EditorEvents['contentError']) => void;
-  onUpdate: (props: EditorEvents['update']) => void;
-  onSelectionUpdate: (props: EditorEvents['selectionUpdate']) => void;
-  onTransaction: (props: EditorEvents['transaction']) => void;
-  onFocus: (props: EditorEvents['focus']) => void;
-  onBlur: (props: EditorEvents['blur']) => void;
-  onDestroy: (props: EditorEvents['destroy']) => void;
-  onPaste: (e: ClipboardEvent, slice: Slice) => void;
-  onDrop: (e: DragEvent, slice: Slice, moved: boolean) => void;
+  onContentError: (props: EditorEvents['contentError']) => void
+  onUpdate: (props: EditorEvents['update']) => void
+  onSelectionUpdate: (props: EditorEvents['selectionUpdate']) => void
+  onTransaction: (props: EditorEvents['transaction']) => void
+  onFocus: (props: EditorEvents['focus']) => void
+  onBlur: (props: EditorEvents['blur']) => void
+  onDestroy: (props: EditorEvents['destroy']) => void
+  onPaste: (e: ClipboardEvent, slice: Slice) => void
+  onDrop: (e: DragEvent, slice: Slice, moved: boolean) => void
 }
 
-export type HTMLContent = string;
+export type HTMLContent = string
 
 export type JSONContent = {
-  type?: string;
-  attrs?: Record<string, any>;
-  content?: JSONContent[];
+  type?: string
+  attrs?: Record<string, any>
+  content?: JSONContent[]
   marks?: {
-    type: string;
-    attrs?: Record<string, any>;
-    [key: string]: any;
-  }[];
-  text?: string;
-  [key: string]: any;
-};
+    type: string
+    attrs?: Record<string, any>
+    [key: string]: any
+  }[]
+  text?: string
+  [key: string]: any
+}
+
+/**
+ * A mark type is either a JSON representation of a mark or a Prosemirror mark instance
+ */
+export type MarkType<
+  Type extends string | { name: string } = any,
+  Attributes extends undefined | Record<string, any> = any,
+> = {
+  type: Type
+  attrs: Attributes
+}
+
+/**
+ * A node type is either a JSON representation of a node or a Prosemirror node instance
+ */
+export type NodeType<
+  Type extends string | { name: string } = any,
+  Attributes extends undefined | Record<string, any> = any,
+  NodeMarkType extends MarkType = any,
+  Content extends (NodeType | TextType)[] = any,
+> = {
+  type: Type
+  attrs: Attributes
+  content?: Content
+  marks?: NodeMarkType[]
+}
+
+/**
+ * A node type is either a JSON representation of a doc node or a Prosemirror doc node instance
+ */
+export type DocumentType<
+  TDocAttributes extends Record<string, any> | undefined = Record<string, any>,
+  TContentType extends NodeType[] = NodeType[],
+> = Omit<NodeType<'doc', TDocAttributes, never, TContentType>, 'marks' | 'content'> & { content: TContentType }
+
+/**
+ * A node type is either a JSON representation of a text node or a Prosemirror text node instance
+ */
+export type TextType<TMarkType extends MarkType = MarkType> = {
+  type: 'text'
+  text: string
+  marks: TMarkType[]
+}
 
-export type Content = HTMLContent | JSONContent | JSONContent[] | null;
+/**
+ * Describes the output of a `renderHTML` function in prosemirror
+ * @see https://prosemirror.net/docs/ref/#model.DOMOutputSpec
+ */
+export type DOMOutputSpecArray =
+  | [string]
+  | [string, Record<string, any>]
+  | [string, 0]
+  | [string, Record<string, any>, 0]
+  | [string, Record<string, any>, DOMOutputSpecArray | 0]
+  | [string, DOMOutputSpecArray]
+
+export type Content = HTMLContent | JSONContent | JSONContent[] | null
 
 export type CommandProps = {
-  editor: Editor;
-  tr: Transaction;
-  commands: SingleCommands;
-  can: () => CanCommands;
-  chain: () => ChainedCommands;
-  state: EditorState;
-  view: EditorView;
-  dispatch: ((args?: any) => any) | undefined;
-};
+  editor: Editor
+  tr: Transaction
+  commands: SingleCommands
+  can: () => CanCommands
+  chain: () => ChainedCommands
+  state: EditorState
+  view: EditorView
+  dispatch: ((args?: any) => any) | undefined
+}
 
-export type Command = (props: CommandProps) => boolean;
+export type Command = (props: CommandProps) => boolean
 
-export type CommandSpec = (...args: any[]) => Command;
+export type CommandSpec = (...args: any[]) => Command
 
-export type KeyboardShortcutCommand = (props: { editor: Editor }) => boolean;
+export type KeyboardShortcutCommand = (props: { editor: Editor }) => boolean
 
 export type Attribute = {
-  default?: any;
-  rendered?: boolean;
-  renderHTML?: ((attributes: Record<string, any>) => Record<string, any> | null) | null;
-  parseHTML?: ((element: HTMLElement) => any | null) | null;
-  keepOnSplit?: boolean;
-  isRequired?: boolean;
-};
+  default?: any
+  validate?: string | ((value: any) => void)
+  rendered?: boolean
+  renderHTML?: ((attributes: Record<string, any>) => Record<string, any> | null) | null
+  parseHTML?: ((element: HTMLElement) => any | null) | null
+  keepOnSplit?: boolean
+  isRequired?: boolean
+}
 
 export type Attributes = {
-  [key: string]: Attribute;
-};
+  [key: string]: Attribute
+}
 
 export type ExtensionAttribute = {
-  type: string;
-  name: string;
-  attribute: Required<Attribute>;
-};
+  type: string
+  name: string
+  attribute: Required<Omit<Attribute, 'validate'>> & Pick<Attribute, 'validate'>
+}
 
 export type GlobalAttributes = {
   /**
    * The node & mark types this attribute should be applied to.
    */
-  types: string[];
+  types: string[]
   /**
    * The attributes to add to the node or mark types.
    */
-  attributes: Record<string, Attribute | undefined>;
-}[];
+  attributes: Record<string, Attribute | undefined>
+}[]
 
-export type PickValue<T, K extends keyof T> = T[K];
+export type PickValue<T, K extends keyof T> = T[K]
 
-export type UnionToIntersection<U> = (U extends any ? (k: U) => void : never) extends (
-  k: infer I
-) => void
-  ? I
-  : never;
+export type UnionToIntersection<U> = (U extends any ? (k: U) => void : never) extends (k: infer I) => void ? I : never
 
 export type Diff<T extends keyof any, U extends keyof any> = ({ [P in T]: P } & {
-  [P in U]: never;
-} & { [x: string]: never })[T];
+  [P in U]: never
+} & { [x: string]: never })[T]
 
-export type Overwrite<T, U> = Pick<T, Diff<keyof T, keyof U>> & U;
+export type Overwrite<T, U> = Pick<T, Diff<keyof T, keyof U>> & U
 
-export type ValuesOf<T> = T[keyof T];
+export type ValuesOf<T> = T[keyof T]
 
-export type KeysWithTypeOf<T, Type> = { [P in keyof T]: T[P] extends Type ? P : never }[keyof T];
+export type KeysWithTypeOf<T, Type> = { [P in keyof T]: T[P] extends Type ? P : never }[keyof T]
 
 export type DOMNode = InstanceType<typeof window.Node>
 
@@ -246,23 +288,21 @@ export interface DecorationType {
  * This adds the `type` property to the `Decoration` type.
  */
 export type DecorationWithType = Decoration & {
-  type: DecorationType;
-};
+  type: DecorationType
+}
 
 export interface NodeViewProps extends NodeViewRendererProps {
   // TODO this type is not technically correct, but it's the best we can do for now since prosemirror doesn't expose the type of decorations
-  decorations: readonly DecorationWithType[];
-  selected: boolean;
-  updateAttributes: (attributes: Record<string, any>) => void;
-  deleteNode: () => void;
+  decorations: readonly DecorationWithType[]
+  selected: boolean
+  updateAttributes: (attributes: Record<string, any>) => void
+  deleteNode: () => void
 }
 
 export interface NodeViewRendererOptions {
-  stopEvent: ((props: { event: Event }) => boolean) | null;
-  ignoreMutation:
-    | ((props: { mutation: ViewMutationRecord }) => boolean)
-    | null;
-  contentDOMElementTag: string;
+  stopEvent: ((props: { event: Event }) => boolean) | null
+  ignoreMutation: ((props: { mutation: ViewMutationRecord }) => boolean) | null
+  contentDOMElementTag: string
 }
 
 export interface NodeViewRendererProps {
@@ -270,100 +310,100 @@ export interface NodeViewRendererProps {
   /**
    * The node that is being rendered.
    */
-  node: Parameters<NodeViewConstructor>[0];
+  node: Parameters<NodeViewConstructor>[0]
   /**
    * The editor's view.
    */
-  view: Parameters<NodeViewConstructor>[1];
+  view: Parameters<NodeViewConstructor>[1]
   /**
    * A function that can be called to get the node's current position in the document.
    */
-  getPos: Parameters<NodeViewConstructor>[2];
+  getPos: Parameters<NodeViewConstructor>[2]
   /**
    * is an array of node or inline decorations that are active around the node.
    * They are automatically drawn in the normal way, and you will usually just want to ignore this, but they can also be used as a way to provide context information to the node view without adding it to the document itself.
    */
-  decorations: Parameters<NodeViewConstructor>[3];
+  decorations: Parameters<NodeViewConstructor>[3]
   /**
    * holds the decorations for the node's content. You can safely ignore this if your view has no content or a contentDOM property, since the editor will draw the decorations on the content.
    * But if you, for example, want to create a nested editor with the content, it may make sense to provide it with the inner decorations.
    */
-  innerDecorations: Parameters<NodeViewConstructor>[4];
+  innerDecorations: Parameters<NodeViewConstructor>[4]
   // tiptap-specific
   /**
    * The editor instance.
    */
-  editor: Editor;
+  editor: Editor
   /**
    * The extension that is responsible for the node.
    */
-  extension: Node;
+  extension: Node
   /**
    * The HTML attributes that should be added to the node's DOM element.
    */
-  HTMLAttributes: Record<string, any>;
+  HTMLAttributes: Record<string, any>
 }
 
-export type NodeViewRenderer = (props: NodeViewRendererProps) => NodeView;
+export type NodeViewRenderer = (props: NodeViewRendererProps) => NodeView
 
-export type AnyCommands = Record<string, (...args: any[]) => Command>;
+export type AnyCommands = Record<string, (...args: any[]) => Command>
 
 export type UnionCommands<T = Command> = UnionToIntersection<
-  ValuesOf<Pick<Commands<T>, KeysWithTypeOf<Commands<T>, {}>>>
->;
+  ValuesOf<Pick<Commands<T>, KeysWithTypeOf<Commands<T>, object>>>
+>
 
 export type RawCommands = {
-  [Item in keyof UnionCommands]: UnionCommands<Command>[Item];
-};
+  [Item in keyof UnionCommands]: UnionCommands<Command>[Item]
+}
 
 export type SingleCommands = {
-  [Item in keyof UnionCommands]: UnionCommands<boolean>[Item];
-};
+  [Item in keyof UnionCommands]: UnionCommands<boolean>[Item]
+}
 
 export type ChainedCommands = {
-  [Item in keyof UnionCommands]: UnionCommands<ChainedCommands>[Item];
+  [Item in keyof UnionCommands]: UnionCommands<ChainedCommands>[Item]
 } & {
-  run: () => boolean;
-};
+  run: () => boolean
+}
 
-export type CanCommands = SingleCommands & { chain: () => ChainedCommands };
+export type CanCommands = SingleCommands & { chain: () => ChainedCommands }
 
-export type FocusPosition = 'start' | 'end' | 'all' | number | boolean | null;
+export type FocusPosition = 'start' | 'end' | 'all' | number | boolean | null
 
 export type Range = {
-  from: number;
-  to: number;
-};
+  from: number
+  to: number
+}
 
 export type NodeRange = {
-  node: ProseMirrorNode;
-  from: number;
-  to: number;
-};
+  node: ProseMirrorNode
+  from: number
+  to: number
+}
 
 export type MarkRange = {
-  mark: ProseMirrorMark;
-  from: number;
-  to: number;
-};
+  mark: ProseMirrorMark
+  from: number
+  to: number
+}
 
-export type Predicate = (node: ProseMirrorNode) => boolean;
+export type Predicate = (node: ProseMirrorNode) => boolean
 
 export type NodeWithPos = {
-  node: ProseMirrorNode;
-  pos: number;
-};
+  node: ProseMirrorNode
+  pos: number
+}
 
 export type TextSerializer = (props: {
-  node: ProseMirrorNode;
-  pos: number;
-  parent: ProseMirrorNode;
-  index: number;
-  range: Range;
-}) => string;
+  node: ProseMirrorNode
+  pos: number
+  parent: ProseMirrorNode
+  index: number
+  range: Range
+}) => string
 
 export type ExtendedRegExpMatchArray = RegExpMatchArray & {
-  data?: Record<string, any>;
-};
+  data?: Record<string, any>
+}
 
-export type Dispatch = ((args?: any) => any) | undefined;
+export type Dispatch = ((args?: any) => any) | undefined

package/src/utilities/createStyleTag.ts

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

package/src/utilities/deleteProps.ts

@@ -4,17 +4,13 @@
  * @param key Key to remove
  */
 export function deleteProps(obj: Record<string, any>, propOrProps: string | string[]): Record<string, any> {
-  const props = typeof propOrProps === 'string'
-    ? [propOrProps]
-    : propOrProps
+  const props = typeof propOrProps === 'string' ? [propOrProps] : propOrProps
 
-  return Object
-    .keys(obj)
-    .reduce((newObj: Record<string, any>, prop) => {
-      if (!props.includes(prop)) {
-        newObj[prop] = obj[prop]
-      }
+  return Object.keys(obj).reduce((newObj: Record<string, any>, prop) => {
+    if (!props.includes(prop)) {
+      newObj[prop] = obj[prop]
+    }
 
-      return newObj
-    }, {})
+    return newObj
+  }, {})
 }

package/src/utilities/findDuplicates.ts

@@ -1,4 +1,7 @@
-export function findDuplicates(items: any[]): any[] {
+/**
+ * Find duplicates in an array.
+ */
+export function findDuplicates<T>(items: T[]): T[] {
   const filtered = items.filter((el, index) => items.indexOf(el) !== index)
 
   return Array.from(new Set(filtered))

package/src/utilities/isFunction.ts

@@ -1,3 +1,4 @@
+// eslint-disable-next-line @typescript-eslint/no-unsafe-function-type
 export function isFunction(value: any): value is Function {
   return typeof value === 'function'
 }

package/src/utilities/isMacOS.ts

@@ -1,5 +1,3 @@
 export function isMacOS(): boolean {
-  return typeof navigator !== 'undefined'
-    ? /Mac/.test(navigator.platform)
-    : false
+  return typeof navigator !== 'undefined' ? /Mac/.test(navigator.platform) : false
 }

package/src/utilities/isiOS.ts

@@ -1,12 +1,7 @@
 export function isiOS(): boolean {
-  return [
-    'iPad Simulator',
-    'iPhone Simulator',
-    'iPod Simulator',
-    'iPad',
-    'iPhone',
-    'iPod',
-  ].includes(navigator.platform)
-  // iPad on iOS 13 detection
-  || (navigator.userAgent.includes('Mac') && 'ontouchend' in document)
+  return (
+    ['iPad Simulator', 'iPhone Simulator', 'iPod Simulator', 'iPad', 'iPhone', 'iPod'].includes(navigator.platform) ||
+    // iPad on iOS 13 detection
+    (navigator.userAgent.includes('Mac') && 'ontouchend' in document)
+  )
 }

package/src/utilities/mergeAttributes.ts

@@ -17,14 +17,22 @@ export function mergeAttributes(...objects: Record<string, any>[]): Record<strin
           const valueClasses: string[] = value ? value.split(' ') : []
           const existingClasses: string[] = mergedAttributes[key] ? mergedAttributes[key].split(' ') : []
 
-          const insertClasses = valueClasses.filter(
-            valueClass => !existingClasses.includes(valueClass),
-          )
+          const insertClasses = valueClasses.filter(valueClass => !existingClasses.includes(valueClass))
 
           mergedAttributes[key] = [...existingClasses, ...insertClasses].join(' ')
         } else if (key === 'style') {
-          const newStyles: string[] = value ? value.split(';').map((style: string) => style.trim()).filter(Boolean) : []
-          const existingStyles: string[] = mergedAttributes[key] ? mergedAttributes[key].split(';').map((style: string) => style.trim()).filter(Boolean) : []
+          const newStyles: string[] = value
+            ? value
+                .split(';')
+                .map((style: string) => style.trim())
+                .filter(Boolean)
+            : []
+          const existingStyles: string[] = mergedAttributes[key]
+            ? mergedAttributes[key]
+                .split(';')
+                .map((style: string) => style.trim())
+                .filter(Boolean)
+            : []
 
           const styleMap = new Map<string, string>()
 
@@ -40,7 +48,9 @@ export function mergeAttributes(...objects: Record<string, any>[]): Record<strin
             styleMap.set(property, val)
           })
 
-          mergedAttributes[key] = Array.from(styleMap.entries()).map(([property, val]) => `${property}: ${val}`).join('; ')
+          mergedAttributes[key] = Array.from(styleMap.entries())
+            .map(([property, val]) => `${property}: ${val}`)
+            .join('; ')
         } else {
           mergedAttributes[key] = value
         }

package/src/utilities/removeDuplicates.ts

@@ -8,8 +8,6 @@ export function removeDuplicates<T>(array: T[], by = JSON.stringify): T[] {
   return array.filter(item => {
     const key = by(item)
 
-    return Object.prototype.hasOwnProperty.call(seen, key)
-      ? false
-      : (seen[key] = true)
+    return Object.prototype.hasOwnProperty.call(seen, key) ? false : (seen[key] = true)
   })
 }