1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
|
import {
DecoratorNode,
DOMExportOutput,
LexicalNode,
NodeKey,
SerializedLexicalNode,
Spread,
} from 'lexical';
import React from 'react';
import { StepsDiagramComponent } from './StepsDiagramComponent';
export type SerializedStepsDiagramNode = Spread<
{
directiveId: string;
},
SerializedLexicalNode
>;
export class StepsDiagramNode extends DecoratorNode<JSX.Element> {
__directiveId: string;
static getType(): string {
return 'steps-diagram';
}
static clone(node: StepsDiagramNode): StepsDiagramNode {
return new StepsDiagramNode(node.__directiveId, node.__key);
}
constructor(directiveId: string, key?: NodeKey) {
super(key);
this.__directiveId = directiveId;
}
createDOM(): HTMLElement {
const div = document.createElement('div');
div.className = 'steps-diagram-block';
return div;
}
updateDOM(): boolean {
return false;
}
decorate(): JSX.Element {
return <StepsDiagramComponent directiveId={this.__directiveId} />;
}
exportJSON(): SerializedStepsDiagramNode {
return {
...super.exportJSON(),
type: 'steps-diagram',
directiveId: this.__directiveId,
version: 1,
};
}
static importJSON(serializedNode: SerializedStepsDiagramNode): StepsDiagramNode {
return $createStepsDiagramNode(serializedNode.directiveId);
}
isInline(): boolean {
return false;
}
canInsertTextBefore(): boolean {
return false;
}
canInsertTextAfter(): boolean {
return false;
}
exportDOM(): DOMExportOutput {
const element = document.createElement('div');
element.className = 'steps-diagram-block';
element.setAttribute('data-directive-id', this.__directiveId);
element.textContent = '[Steps Diagram]';
return { element };
}
}
export function $createStepsDiagramNode(directiveId: string): StepsDiagramNode {
return new StepsDiagramNode(directiveId);
}
export function $isStepsDiagramNode(
node: LexicalNode | null | undefined,
): node is StepsDiagramNode {
return node instanceof StepsDiagramNode;
}
|
