Changelog: Tweaked spacing, count and element referencing

[bookstack] / resources / js / wysiwyg / ui / defaults / buttons / inline-formats.ts

diff --git a/resources/js/wysiwyg/ui/defaults/buttons/inline-formats.ts b/resources/js/wysiwyg/ui/defaults/buttons/inline-formats.ts
index d04f72a2e571da85e81b079bf0ec31f97ed10d5d..c5b7ad29ad9c6be63548854d506f1e8944ef231f 100644 (file)
--- a/resources/js/wysiwyg/ui/defaults/buttons/inline-formats.ts
+++ b/resources/js/wysiwyg/ui/defaults/buttons/inline-formats.ts
@@ -1,7 +1,6 @@
 import {$getSelection, $isTextNode, BaseSelection, FORMAT_TEXT_COMMAND, TextFormatType} from "lexical";
 import {EditorBasicButtonDefinition, EditorButtonDefinition} from "../../framework/buttons";
 import {EditorUiContext} from "../../framework/core";
-import {$selectionContainsTextFormat} from "../../../helpers";
 import boldIcon from "@icons/editor/bold.svg";
 import italicIcon from "@icons/editor/italic.svg";
 import underlinedIcon from "@icons/editor/underlined.svg";
@@ -12,6 +11,9 @@ import superscriptIcon from "@icons/editor/superscript.svg";
 import subscriptIcon from "@icons/editor/subscript.svg";
 import codeIcon from "@icons/editor/code.svg";
 import formatClearIcon from "@icons/editor/format-clear.svg";
+import {$selectionContainsTextFormat} from "../../../utils/selection";
+import {$patchStyleText} from "@lexical/selection";
+import {context} from "esbuild";
 
 function buildFormatButton(label: string, format: TextFormatType, icon: string): EditorButtonDefinition {
     return {
@@ -30,12 +32,24 @@ export const bold: EditorButtonDefinition = buildFormatButton('Bold', 'bold', bo
 export const italic: EditorButtonDefinition = buildFormatButton('Italic', 'italic', italicIcon);
 export const underline: EditorButtonDefinition = buildFormatButton('Underline', 'underline', underlinedIcon);
 export const textColor: EditorBasicButtonDefinition = {label: 'Text color', icon: textColorIcon};
-export const highlightColor: EditorBasicButtonDefinition = {label: 'Highlight color', icon: highlightIcon};
+export const highlightColor: EditorBasicButtonDefinition = {label: 'Background color', icon: highlightIcon};
+
+function colorAction(context: EditorUiContext, property: string, color: string): void {
+    context.editor.update(() => {
+        const selection = $getSelection();
+        if (selection) {
+            $patchStyleText(selection, {[property]: color || null});
+        }
+    });
+}
+
+export const textColorAction = (color: string, context: EditorUiContext) => colorAction(context, 'color', color);
+export const highlightColorAction = (color: string, context: EditorUiContext) => colorAction(context, 'color', color);
 
 export const strikethrough: EditorButtonDefinition = buildFormatButton('Strikethrough', 'strikethrough', strikethroughIcon);
 export const superscript: EditorButtonDefinition = buildFormatButton('Superscript', 'superscript', superscriptIcon);
 export const subscript: EditorButtonDefinition = buildFormatButton('Subscript', 'subscript', subscriptIcon);
-export const code: EditorButtonDefinition = buildFormatButton('Inline Code', 'code', codeIcon);
+export const code: EditorButtonDefinition = buildFormatButton('Inline code', 'code', codeIcon);
 export const clearFormating: EditorButtonDefinition = {
     label: 'Clear formatting',
     icon: formatClearIcon,