2020-10-23 05:21:52 +08:00
|
|
|
import {
|
|
|
|
DOMOutputSpec, NodeSpec, Node, NodeType,
|
|
|
|
} from 'prosemirror-model'
|
|
|
|
import { Plugin } from 'prosemirror-state'
|
2020-10-22 15:14:24 +08:00
|
|
|
import { ExtensionSpec, defaultExtension } from './Extension'
|
2020-10-30 18:08:23 +08:00
|
|
|
import { Attributes, NodeViewRenderer, Overwrite } from './types'
|
2020-10-23 05:21:52 +08:00
|
|
|
import { Editor } from './Editor'
|
2020-10-21 21:17:05 +08:00
|
|
|
|
2020-10-23 17:24:27 +08:00
|
|
|
export interface NodeExtensionSpec<Options = {}, Commands = {}> extends Overwrite<ExtensionSpec<Options, Commands>, {
|
2020-10-23 05:21:52 +08:00
|
|
|
/**
|
|
|
|
* TopNode
|
|
|
|
*/
|
2020-10-21 21:17:05 +08:00
|
|
|
topNode?: boolean,
|
2020-10-22 17:14:44 +08:00
|
|
|
|
|
|
|
/**
|
2020-10-23 05:21:52 +08:00
|
|
|
* Content
|
2020-10-22 17:14:44 +08:00
|
|
|
*/
|
2020-10-30 22:20:10 +08:00
|
|
|
content?: NodeSpec['content'] | ((this: { options: Options }) => NodeSpec['content']),
|
2020-10-23 05:21:52 +08:00
|
|
|
|
|
|
|
/**
|
|
|
|
* Marks
|
|
|
|
*/
|
2020-10-30 22:20:10 +08:00
|
|
|
marks?: NodeSpec['marks'] | ((this: { options: Options }) => NodeSpec['marks']),
|
2020-10-23 05:21:52 +08:00
|
|
|
|
|
|
|
/**
|
|
|
|
* Group
|
|
|
|
*/
|
2020-10-30 22:20:10 +08:00
|
|
|
group?: NodeSpec['group'] | ((this: { options: Options }) => NodeSpec['group']),
|
2020-10-23 05:21:52 +08:00
|
|
|
|
|
|
|
/**
|
|
|
|
* Inline
|
|
|
|
*/
|
2020-10-30 22:20:10 +08:00
|
|
|
inline?: NodeSpec['inline'] | ((this: { options: Options }) => NodeSpec['inline']),
|
2020-10-23 05:21:52 +08:00
|
|
|
|
|
|
|
/**
|
|
|
|
* Atom
|
|
|
|
*/
|
2020-10-30 22:20:10 +08:00
|
|
|
atom?: NodeSpec['atom'] | ((this: { options: Options }) => NodeSpec['atom']),
|
2020-10-23 05:21:52 +08:00
|
|
|
|
|
|
|
/**
|
|
|
|
* Selectable
|
|
|
|
*/
|
2020-10-30 22:20:10 +08:00
|
|
|
selectable?: NodeSpec['selectable'] | ((this: { options: Options }) => NodeSpec['selectable']),
|
2020-10-23 05:21:52 +08:00
|
|
|
|
|
|
|
/**
|
|
|
|
* Draggable
|
|
|
|
*/
|
2020-10-30 22:20:10 +08:00
|
|
|
draggable?: NodeSpec['draggable'] | ((this: { options: Options }) => NodeSpec['draggable']),
|
2020-10-23 05:21:52 +08:00
|
|
|
|
|
|
|
/**
|
|
|
|
* Code
|
|
|
|
*/
|
2020-10-30 22:20:10 +08:00
|
|
|
code?: NodeSpec['code'] | ((this: { options: Options }) => NodeSpec['code']),
|
2020-10-23 05:21:52 +08:00
|
|
|
|
|
|
|
/**
|
|
|
|
* Defining
|
|
|
|
*/
|
2020-10-30 22:20:10 +08:00
|
|
|
defining?: NodeSpec['defining'] | ((this: { options: Options }) => NodeSpec['defining']),
|
2020-10-23 05:21:52 +08:00
|
|
|
|
|
|
|
/**
|
|
|
|
* Isolating
|
|
|
|
*/
|
2020-10-30 22:20:10 +08:00
|
|
|
isolating?: NodeSpec['isolating'] | ((this: { options: Options }) => NodeSpec['isolating']),
|
2020-10-23 05:21:52 +08:00
|
|
|
|
|
|
|
/**
|
|
|
|
* Parse HTML
|
|
|
|
*/
|
2020-10-22 03:13:38 +08:00
|
|
|
parseHTML?: (
|
|
|
|
this: {
|
|
|
|
options: Options,
|
2020-10-21 21:17:05 +08:00
|
|
|
},
|
2020-10-22 03:13:38 +08:00
|
|
|
) => NodeSpec['parseDOM'],
|
2020-10-23 05:21:52 +08:00
|
|
|
|
|
|
|
/**
|
|
|
|
* Render HTML
|
|
|
|
*/
|
2020-10-23 20:24:19 +08:00
|
|
|
renderHTML?: ((
|
2020-10-22 03:13:38 +08:00
|
|
|
this: {
|
|
|
|
options: Options,
|
|
|
|
},
|
|
|
|
props: {
|
|
|
|
node: Node,
|
2020-10-22 15:14:24 +08:00
|
|
|
attributes: { [key: string]: any },
|
2020-10-22 03:13:38 +08:00
|
|
|
}
|
2020-10-23 20:24:19 +08:00
|
|
|
) => DOMOutputSpec) | null,
|
2020-10-23 05:21:52 +08:00
|
|
|
|
|
|
|
/**
|
|
|
|
* Add Attributes
|
|
|
|
*/
|
2020-10-22 17:14:44 +08:00
|
|
|
addAttributes?: (
|
2020-10-22 05:32:28 +08:00
|
|
|
this: {
|
|
|
|
options: Options,
|
|
|
|
},
|
|
|
|
) => Attributes,
|
2020-10-23 05:21:52 +08:00
|
|
|
|
|
|
|
/**
|
|
|
|
* Commands
|
|
|
|
*/
|
|
|
|
addCommands?: (this: {
|
|
|
|
options: Options,
|
|
|
|
editor: Editor,
|
|
|
|
type: NodeType,
|
|
|
|
}) => Commands,
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Keyboard shortcuts
|
|
|
|
*/
|
|
|
|
addKeyboardShortcuts?: (this: {
|
|
|
|
options: Options,
|
|
|
|
editor: Editor,
|
|
|
|
type: NodeType,
|
|
|
|
}) => {
|
|
|
|
[key: string]: any
|
|
|
|
},
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Input rules
|
|
|
|
*/
|
|
|
|
addInputRules?: (this: {
|
|
|
|
options: Options,
|
|
|
|
editor: Editor,
|
|
|
|
type: NodeType,
|
|
|
|
}) => any[],
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Paste rules
|
|
|
|
*/
|
|
|
|
addPasteRules?: (this: {
|
|
|
|
options: Options,
|
|
|
|
editor: Editor,
|
|
|
|
type: NodeType,
|
|
|
|
}) => any[],
|
|
|
|
|
|
|
|
/**
|
|
|
|
* ProseMirror plugins
|
|
|
|
*/
|
|
|
|
addProseMirrorPlugins?: (this: {
|
|
|
|
options: Options,
|
|
|
|
editor: Editor,
|
|
|
|
type: NodeType,
|
|
|
|
}) => Plugin[],
|
2020-10-29 16:26:24 +08:00
|
|
|
|
|
|
|
/**
|
|
|
|
* Node View
|
|
|
|
*/
|
2020-10-30 18:08:23 +08:00
|
|
|
addNodeView?: (() => NodeViewRenderer) | null,
|
2020-10-23 17:24:27 +08:00
|
|
|
}> {}
|
2020-10-21 21:17:05 +08:00
|
|
|
|
2020-10-21 21:30:34 +08:00
|
|
|
export type NodeExtension = Required<Omit<NodeExtensionSpec, 'defaultOptions'> & {
|
|
|
|
type: string,
|
|
|
|
options: {
|
|
|
|
[key: string]: any
|
|
|
|
},
|
|
|
|
}>
|
|
|
|
|
2020-10-21 21:17:05 +08:00
|
|
|
const defaultNode: NodeExtension = {
|
2020-10-22 15:14:24 +08:00
|
|
|
...defaultExtension,
|
2020-10-21 21:17:05 +08:00
|
|
|
type: 'node',
|
|
|
|
name: 'node',
|
|
|
|
topNode: false,
|
|
|
|
content: null,
|
|
|
|
marks: null,
|
|
|
|
group: null,
|
|
|
|
inline: null,
|
|
|
|
atom: null,
|
2020-10-22 03:01:39 +08:00
|
|
|
selectable: null,
|
|
|
|
draggable: null,
|
|
|
|
code: null,
|
|
|
|
defining: null,
|
|
|
|
isolating: null,
|
2020-10-21 21:17:05 +08:00
|
|
|
parseHTML: () => null,
|
2020-10-23 20:24:19 +08:00
|
|
|
renderHTML: null,
|
2020-10-22 17:14:44 +08:00
|
|
|
addAttributes: () => ({}),
|
2020-10-29 16:26:24 +08:00
|
|
|
addNodeView: null,
|
2020-10-21 21:17:05 +08:00
|
|
|
}
|
2020-03-30 18:40:25 +08:00
|
|
|
|
2020-10-21 21:17:05 +08:00
|
|
|
export function createNode<Options extends {}, Commands extends {}>(config: NodeExtensionSpec<Options, Commands>) {
|
|
|
|
const extend = <ExtendedOptions = Options, ExtendedCommands = Commands>(extendedConfig: Partial<NodeExtensionSpec<ExtendedOptions, ExtendedCommands>>) => {
|
|
|
|
return createNode({
|
|
|
|
...config,
|
|
|
|
...extendedConfig,
|
|
|
|
} as NodeExtensionSpec<ExtendedOptions, ExtendedCommands>)
|
2020-09-09 05:44:45 +08:00
|
|
|
}
|
2020-10-10 04:59:25 +08:00
|
|
|
|
2020-10-21 21:17:05 +08:00
|
|
|
const setOptions = (options?: Partial<Options>) => {
|
|
|
|
const { defaultOptions, ...rest } = config
|
|
|
|
|
|
|
|
return {
|
|
|
|
...defaultNode,
|
|
|
|
...rest,
|
|
|
|
options: {
|
|
|
|
...defaultOptions,
|
|
|
|
...options,
|
|
|
|
} as Options,
|
|
|
|
}
|
2020-10-10 04:59:25 +08:00
|
|
|
}
|
|
|
|
|
2020-10-21 21:17:05 +08:00
|
|
|
return Object.assign(setOptions, { config, extend })
|
2019-12-17 06:20:05 +08:00
|
|
|
}
|