@vonaffenfels/slate-editor 1.1.10 → 1.1.12

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@vonaffenfels/slate-editor",
-    "version": "1.1.10",
+    "version": "1.1.12",
     "description": "",
     "main": "dist/index.js",
     "scripts": {
@@ -72,7 +72,7 @@
         "cssnano": "^5.0.1",
         "escape-html": "^1.0.3"
     },
-    "gitHead": "fc76d00d7b878bf1beb0597e177ba2b6f1b0d405",
+    "gitHead": "772f1444de93f6949ce340b13bc24665493d5ef1",
     "publishConfig": {
         "access": "public"
     }

package/src/SidebarEditor/SidebarEditorField.js

@@ -236,10 +236,15 @@ export const SidebarEditorField = ({
                 );
             case "color":
                 return (
-                    <input
-                        type="color"
-                        value={value || ""}
-                        onChange={e => onChange(fieldKey, e.target.value)}/>
+                    <div className="flex flex-col">
+                        <input
+                            type="color"
+                            value={value || ""}
+                            onChange={e => onChange(fieldKey, e.target.value)}/>
+                        {!!value && (
+                            <button className="button button--tertiary mt-1" onClick={() => onChange(fieldKey, undefined)}>Zurücksetzen</button>
+                        )}
+                    </div>
                 );
             case "date":
                 return (

package/src/Toolbar/Toolbar.js

@@ -2,9 +2,8 @@ import ReactDOM from "react-dom";
 import React, {
     useEffect, useRef, useState,
 } from "react";
-import {
-    ReactEditor, useSlate,
-} from "slate-react";
+import {ReactEditor} from "slate-react";
+import {Node} from "slate";
 import classNames from "classnames";
 // eslint-disable-next-line import/no-unresolved
 import "scss/toolbar.scss";
@@ -106,7 +105,24 @@ export const Toolbar = ({
             },
         };
 
-        Transforms.insertNodes(editor, [element], {at: [lastSelection?.anchor?.path?.[0]]});
+        if (lastSelection?.anchor?.path?.length) {
+            lastSelection.anchor.path.forEach((p, i) => {
+                let slicedPath = lastSelection.anchor.path.slice(0, i + 1);
+                let node = Node.get(editor, slicedPath);
+
+                // Wenn Paragraph, dann auf die Ebene des Paragraphen
+                if (node.type === "paragraph") {
+                    Transforms.insertNodes(editor, [element], {at: slicedPath});
+
+                    return;
+                }
+
+                // Wenn vorletzter Anchor, dann einfügen (letzter ist column, keine row)
+                if (i === lastSelection.anchor.path.length - 2) {
+                    Transforms.insertNodes(editor, [element], {at: slicedPath});
+                }
+            });
+        }
     };
 
     function renderMenu() {