make extension configs extendable

This commit is contained in:
Philipp Kühn
2021-02-19 17:35:50 +01:00
parent 32af53d0f4
commit 6fb28a2741
6 changed files with 648 additions and 525 deletions

View File

@@ -4,9 +4,10 @@ import { InputRule } from 'prosemirror-inputrules'
import { Editor } from './Editor'
import { Node } from './Node'
import mergeDeep from './utilities/mergeDeep'
import { GlobalAttributes, RawCommands } from './types'
import { GlobalAttributes, RawCommands, ExtensionConfig } from './types'
export interface ExtensionConfig<Options = any> {
declare module '@tiptap/core' {
interface ExtensionConfig<Options = any> {
/**
* Name
*/
@@ -160,6 +161,7 @@ export interface ExtensionConfig<Options = any> {
options: Options,
editor: Editor,
}) => void) | null,
}
}
export class Extension<Options = any> {

View File

@@ -7,65 +7,36 @@ import {
import { Plugin, Transaction } from 'prosemirror-state'
import { Command as ProseMirrorCommand } from 'prosemirror-commands'
import { InputRule } from 'prosemirror-inputrules'
import { ExtensionConfig } from './Extension'
import mergeDeep from './utilities/mergeDeep'
import { Attributes, Overwrite, RawCommands } from './types'
import {
Attributes,
RawCommands,
GlobalAttributes,
MarkConfig,
} from './types'
import { Editor } from './Editor'
export interface MarkConfig<Options = any> extends Overwrite<ExtensionConfig<Options>, {
declare module '@tiptap/core' {
export interface MarkConfig<Options = any> {
/**
* Inclusive
* Name
*/
inclusive?: MarkSpec['inclusive'] | ((this: { options: Options }) => MarkSpec['inclusive']),
name: string,
/**
* Excludes
* Default options
*/
excludes?: MarkSpec['excludes'] | ((this: { options: Options }) => MarkSpec['excludes']),
defaultOptions?: Options,
/**
* Group
* Global attributes
*/
group?: MarkSpec['group'] | ((this: { options: Options }) => MarkSpec['group']),
/**
* Spanning
*/
spanning?: MarkSpec['spanning'] | ((this: { options: Options }) => MarkSpec['spanning']),
/**
* Parse HTML
*/
parseHTML?: (
this: {
addGlobalAttributes?: (this: {
options: Options,
},
) => MarkSpec['parseDOM'],
}) => GlobalAttributes | {},
/**
* Render HTML
*/
renderHTML?: ((
this: {
options: Options,
},
props: {
mark: ProseMirrorMark,
HTMLAttributes: { [key: string]: any },
}
) => DOMOutputSpec) | null,
/**
* Attributes
*/
addAttributes?: (
this: {
options: Options,
},
) => Attributes | {},
/**
* Commands
* Raw
*/
addCommands?: (this: {
options: Options,
@@ -111,6 +82,30 @@ export interface MarkConfig<Options = any> extends Overwrite<ExtensionConfig<Opt
type: MarkType,
}) => Plugin[],
/**
* Extend Node Schema
*/
extendNodeSchema?: ((
this: {
options: Options,
},
extension: Node,
) => {
[key: string]: any,
}) | null,
/**
* Extend Mark Schema
*/
extendMarkSchema?: ((
this: {
options: Options,
},
extension: Node,
) => {
[key: string]: any,
}) | null,
/**
* The editor is ready.
*/
@@ -188,7 +183,59 @@ export interface MarkConfig<Options = any> extends Overwrite<ExtensionConfig<Opt
editor: Editor,
type: MarkType,
}) => void) | null,
}> {}
/**
* Inclusive
*/
inclusive?: MarkSpec['inclusive'] | ((this: { options: Options }) => MarkSpec['inclusive']),
/**
* Excludes
*/
excludes?: MarkSpec['excludes'] | ((this: { options: Options }) => MarkSpec['excludes']),
/**
* Group
*/
group?: MarkSpec['group'] | ((this: { options: Options }) => MarkSpec['group']),
/**
* Spanning
*/
spanning?: MarkSpec['spanning'] | ((this: { options: Options }) => MarkSpec['spanning']),
/**
* Parse HTML
*/
parseHTML?: (
this: {
options: Options,
},
) => MarkSpec['parseDOM'],
/**
* Render HTML
*/
renderHTML?: ((
this: {
options: Options,
},
props: {
mark: ProseMirrorMark,
HTMLAttributes: { [key: string]: any },
}
) => DOMOutputSpec) | null,
/**
* Attributes
*/
addAttributes?: (
this: {
options: Options,
},
) => Attributes | {},
}
}
export class Mark<Options = any> {
type = 'mark'

View File

@@ -7,17 +7,193 @@ import {
import { Command as ProseMirrorCommand } from 'prosemirror-commands'
import { Plugin, Transaction } from 'prosemirror-state'
import { InputRule } from 'prosemirror-inputrules'
import { ExtensionConfig } from './Extension'
import mergeDeep from './utilities/mergeDeep'
import {
Attributes,
NodeViewRenderer,
Overwrite,
GlobalAttributes,
RawCommands,
NodeConfig,
} from './types'
import { Editor } from './Editor'
export interface NodeConfig<Options = any> extends Overwrite<ExtensionConfig<Options>, {
declare module '@tiptap/core' {
interface NodeConfig<Options = any> {
/**
* Name
*/
name: string,
/**
* Default options
*/
defaultOptions?: Options,
/**
* Global attributes
*/
addGlobalAttributes?: (this: {
options: Options,
}) => GlobalAttributes | {},
/**
* Raw
*/
addCommands?: (this: {
options: Options,
editor: Editor,
type: NodeType,
}) => Partial<RawCommands>,
/**
* Keyboard shortcuts
*/
addKeyboardShortcuts?: (this: {
options: Options,
editor: Editor,
type: NodeType,
}) => {
[key: string]: ProseMirrorCommand,
},
/**
* Input rules
*/
addInputRules?: (this: {
options: Options,
editor: Editor,
type: NodeType,
}) => InputRule[],
/**
* Paste rules
*/
addPasteRules?: (this: {
options: Options,
editor: Editor,
type: NodeType,
}) => Plugin[],
/**
* ProseMirror plugins
*/
addProseMirrorPlugins?: (this: {
options: Options,
editor: Editor,
type: NodeType,
}) => Plugin[],
/**
* Extend Node Schema
*/
extendNodeSchema?: ((
this: {
options: Options,
},
extension: Node,
) => {
[key: string]: any,
}) | null,
/**
* Extend Mark Schema
*/
extendMarkSchema?: ((
this: {
options: Options,
},
extension: Node,
) => {
[key: string]: any,
}) | null,
/**
* The editor is ready.
*/
onCreate?: ((this: {
options: Options,
editor: Editor,
type: NodeType,
}) => void) | null,
/**
* The content has changed.
*/
onUpdate?: ((this: {
options: Options,
editor: Editor,
type: NodeType,
}) => void) | null,
/**
* The selection has changed.
*/
onSelection?: ((this: {
options: Options,
editor: Editor,
type: NodeType,
}) => void) | null,
/**
* The editor state has changed.
*/
onTransaction?: ((
this: {
options: Options,
editor: Editor,
type: NodeType,
},
props: {
transaction: Transaction,
},
) => void) | null,
/**
* The editor is focused.
*/
onFocus?: ((
this: {
options: Options,
editor: Editor,
type: NodeType,
},
props: {
event: FocusEvent,
},
) => void) | null,
/**
* The editor isnt focused anymore.
*/
onBlur?: ((
this: {
options: Options,
editor: Editor,
type: NodeType,
},
props: {
event: FocusEvent,
},
) => void) | null,
/**
* The editor is destroyed.
*/
onDestroy?: ((this: {
options: Options,
editor: Editor,
type: NodeType,
}) => void) | null,
/**
* Node View
*/
addNodeView?: ((this: {
options: Options,
editor: Editor,
type: NodeType,
}) => NodeViewRenderer) | null,
/**
* TopNode
*/
@@ -117,141 +293,8 @@ export interface NodeConfig<Options = any> extends Overwrite<ExtensionConfig<Opt
options: Options,
},
) => Attributes | {},
/**
* Commands
*/
addCommands?: (this: {
options: Options,
editor: Editor,
type: NodeType,
}) => Partial<RawCommands>,
/**
* Keyboard shortcuts
*/
addKeyboardShortcuts?: (this: {
options: Options,
editor: Editor,
type: NodeType,
}) => {
[key: string]: ProseMirrorCommand,
},
/**
* Input rules
*/
addInputRules?: (this: {
options: Options,
editor: Editor,
type: NodeType,
}) => InputRule[],
/**
* Paste rules
*/
addPasteRules?: (this: {
options: Options,
editor: Editor,
type: NodeType,
}) => Plugin[],
/**
* ProseMirror plugins
*/
addProseMirrorPlugins?: (this: {
options: Options,
editor: Editor,
type: NodeType,
}) => Plugin[],
/**
* Node View
*/
addNodeView?: ((this: {
options: Options,
editor: Editor,
type: NodeType,
}) => NodeViewRenderer) | null,
/**
* The editor is ready.
*/
onCreate?: ((this: {
options: Options,
editor: Editor,
type: NodeType,
}) => void) | null,
/**
* The content has changed.
*/
onUpdate?: ((this: {
options: Options,
editor: Editor,
type: NodeType,
}) => void) | null,
/**
* The selection has changed.
*/
onSelection?: ((this: {
options: Options,
editor: Editor,
type: NodeType,
}) => void) | null,
/**
* The editor state has changed.
*/
onTransaction?: ((
this: {
options: Options,
editor: Editor,
type: NodeType,
},
props: {
transaction: Transaction,
},
) => void) | null,
/**
* The editor is focused.
*/
onFocus?: ((
this: {
options: Options,
editor: Editor,
type: NodeType,
},
props: {
event: FocusEvent,
},
) => void) | null,
/**
* The editor isnt focused anymore.
*/
onBlur?: ((
this: {
options: Options,
editor: Editor,
type: NodeType,
},
props: {
event: FocusEvent,
},
) => void) | null,
/**
* The editor is destroyed.
*/
onDestroy?: ((this: {
options: Options,
editor: Editor,
type: NodeType,
}) => void) | null,
}> {}
}
}
export class Node<Options = any> {
type = 'node'

View File

@@ -1,6 +1,10 @@
import { NodeSpec, MarkSpec, Schema } from 'prosemirror-model'
import { Extensions } from '../types'
import { ExtensionConfig } from '../Extension'
import {
Extensions,
ExtensionConfig,
NodeConfig,
MarkConfig,
} from '../types'
import splitExtensions from './splitExtensions'
import getAttributesFromExtensions from './getAttributesFromExtensions'
import getRenderedAttributes from './getRenderedAttributes'
@@ -22,8 +26,16 @@ export default function getSchema(extensions: Extensions): Schema {
const allAttributes = getAttributesFromExtensions(extensions)
const { nodeExtensions, markExtensions } = splitExtensions(extensions)
const topNode = nodeExtensions.find(extension => extension.config.topNode)?.config.name
const nodeSchemaExtenders: ExtensionConfig['extendNodeSchema'][] = []
const markSchemaExtenders: ExtensionConfig['extendMarkSchema'][] = []
const nodeSchemaExtenders: (
| ExtensionConfig['extendNodeSchema']
| NodeConfig['extendNodeSchema']
| MarkConfig['extendNodeSchema']
)[] = []
const markSchemaExtenders: (
| ExtensionConfig['extendNodeSchema']
| NodeConfig['extendNodeSchema']
| MarkConfig['extendNodeSchema']
)[] = []
extensions.forEach(extension => {
if (typeof extension.config.extendNodeSchema === 'function') {

View File

@@ -23,3 +23,12 @@ export { default as isCellSelection } from './helpers/isCellSelection'
export { default as findParentNodeClosestToPos } from './helpers/findParentNodeClosestToPos'
export interface Commands {}
// eslint-disable-next-line
export interface ExtensionConfig<Options = any> {}
// eslint-disable-next-line
export interface NodeConfig<Options = any> {}
// eslint-disable-next-line
export interface MarkConfig<Options = any> {}

View File

@@ -14,9 +14,19 @@ import { Extension } from './Extension'
import { Node } from './Node'
import { Mark } from './Mark'
import { Editor } from './Editor'
import { Commands } from '.'
import {
Commands,
ExtensionConfig,
NodeConfig,
MarkConfig,
} from '.'
export { Commands }
export {
Commands,
ExtensionConfig,
NodeConfig,
MarkConfig,
}
export type Extensions = (Extension | Node | Mark)[]