diff --git a/projects/editor/src/app/text-editor/extensions/font-size.ts b/projects/editor/src/app/text-editor/extensions/font-size.ts index 098ced8b2b7a374c5fc8c14dfaedf7530255f91a..4170c24f28bc60f7fef9d934641454050313c530 100644 --- a/projects/editor/src/app/text-editor/extensions/font-size.ts +++ b/projects/editor/src/app/text-editor/extensions/font-size.ts @@ -1,29 +1,38 @@ -import { Command } from '@tiptap/core'; -import { TextStyle } from '@tiptap/extension-text-style'; +import { Extension } from '@tiptap/core'; +import '@tiptap/extension-text-style'; declare module '@tiptap/core' { - interface Commands<> { - fontSizeExtension: { - setFontSize: (fontSize: string) => Command + interface Commands<ReturnType> { + fontSize: { + setFontSize: (fontSize: string) => ReturnType }; } } -export const FontSizeExtension = TextStyle.extend({ - name: 'FontSizeExtension', +export const FontSize = Extension.create({ + name: 'fontSize', - addAttributes() { + addOptions() { return { - fontSize: { - default: '20px', - parseHTML: element => element.style.fontSize, - renderHTML: attributes => ({ - style: `font-size: ${attributes.fontSize}` - }) - } + types: ['textStyle'] }; }, + addGlobalAttributes() { + return [{ + types: this.options.types, + attributes: { + fontSize: { + default: '20px', + parseHTML: element => element.style.fontSize, + renderHTML: attributes => { + return { style: `font-size: ${attributes.fontSize}` }; + } + } + } + }]; + }, + addCommands() { return { setFontSize: fontSize => ({ chain }) => chain().setMark('textStyle', { fontSize }).run() diff --git a/projects/editor/src/app/text-editor/rich-text-editor.component.ts b/projects/editor/src/app/text-editor/rich-text-editor.component.ts index 29dca96a34053d27cb01cecd6f4c1a0c4d8b2787..d73e6a999fe4aad30fe616d11e3b5dff53501bde 100644 --- a/projects/editor/src/app/text-editor/rich-text-editor.component.ts +++ b/projects/editor/src/app/text-editor/rich-text-editor.component.ts @@ -17,7 +17,7 @@ import { Blockquote } from '@tiptap/extension-blockquote'; import { Indent } from './extensions/indent'; import { HangingIndent } from './extensions/hanging-indent'; import { ParagraphExtension } from './extensions/paragraph-extension'; -import { FontSizeExtension } from './extensions/font-size'; +import { FontSize } from './extensions/font-size'; import { BulletListExtension } from './extensions/bullet-list'; import { OrderedListExtension } from './extensions/orderedList-extension'; @@ -65,7 +65,7 @@ export class RichTextEditorComponent implements AfterViewInit { levels: [1, 2, 3, 4] }), ParagraphExtension, - FontSizeExtension, + FontSize, BulletListExtension, OrderedListExtension, HangingIndent,