import {
DOMConversionMap,
- DOMConversionOutput, ElementFormatType,
+ DOMConversionOutput,
LexicalNode,
Spread
} from "lexical";
import {EditorConfig} from "lexical/LexicalEditor";
import {HeadingNode, HeadingTagType, SerializedHeadingNode} from "@lexical/rich-text";
+import {
+ CommonBlockAlignment, commonPropertiesDifferent, deserializeCommonBlockNode,
+ SerializedCommonBlockNode,
+ setCommonBlockPropsFromElement,
+ updateElementWithCommonBlockProps
+} from "./_common";
-export type SerializedCustomHeadingNode = Spread<{
- id: string;
-}, SerializedHeadingNode>
+export type SerializedCustomHeadingNode = Spread<SerializedCommonBlockNode, SerializedHeadingNode>
export class CustomHeadingNode extends HeadingNode {
__id: string = '';
+ __alignment: CommonBlockAlignment = '';
+ __inset: number = 0;
static getType() {
return 'custom-heading';
return self.__id;
}
+ setAlignment(alignment: CommonBlockAlignment) {
+ const self = this.getWritable();
+ self.__alignment = alignment;
+ }
+
+ getAlignment(): CommonBlockAlignment {
+ const self = this.getLatest();
+ return self.__alignment;
+ }
+
+ setInset(size: number) {
+ const self = this.getWritable();
+ self.__inset = size;
+ }
+
+ getInset(): number {
+ const self = this.getLatest();
+ return self.__inset;
+ }
+
static clone(node: CustomHeadingNode) {
const newNode = new CustomHeadingNode(node.__tag, node.__key);
- newNode.__id = node.__id;
+ newNode.__alignment = node.__alignment;
+ newNode.__inset = node.__inset;
return newNode;
}
createDOM(config: EditorConfig): HTMLElement {
const dom = super.createDOM(config);
- if (this.__id) {
- dom.setAttribute('id', this.__id);
- }
-
+ updateElementWithCommonBlockProps(dom, this);
return dom;
}
+ updateDOM(prevNode: CustomHeadingNode, dom: HTMLElement): boolean {
+ return super.updateDOM(prevNode, dom)
+ || commonPropertiesDifferent(prevNode, this);
+ }
+
exportJSON(): SerializedCustomHeadingNode {
return {
...super.exportJSON(),
type: 'custom-heading',
version: 1,
id: this.__id,
+ alignment: this.__alignment,
+ inset: this.__inset,
};
}
static importJSON(serializedNode: SerializedCustomHeadingNode): CustomHeadingNode {
const node = $createCustomHeadingNode(serializedNode.tag);
- node.setId(serializedNode.id);
+ deserializeCommonBlockNode(serializedNode, node);
return node;
}
nodeName === 'h6'
) {
node = $createCustomHeadingNode(nodeName);
- if (element.style !== null) {
- node.setFormat(element.style.textAlign as ElementFormatType);
- }
- if (element.id) {
- node.setId(element.id);
- }
+ setCommonBlockPropsFromElement(element, node);
}
return {node};
}