chore(portable-text-editor): upgrade slate + remove workarounds (#5175)

* chore(portable-text-editor): upgrade slate and slate-react to latest * refactor(portable-text-editor): remove workaround This was a workaround for missing functionality in slate-react which is now fixed upstream ianstormtaylor/slate#5527 * fix(core/form/inputs): remove workaround This is not needed anymore as it's fixed upstream. * feat(portable-text-editor): create a selection on focus if it doesn't exist
portabletext · Nov 14, 2023 · 6fcd996 · 6fcd996
1 parent dfac8b9
commit 6fcd996
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 10 deletions.
diff --git a/packages/editor/package.json b/packages/editor/package.json
@@ -70,8 +70,8 @@
     "debug": "^3.2.7",
     "is-hotkey": "^0.1.6",
     "lodash": "^4.17.21",
-    "slate": "0.94.1",
-    "slate-react": "0.98.1"
+    "slate": "0.100.0",
+    "slate-react": "0.101.0"
   },
   "devDependencies": {
     "@playwright/test": "^1.39.0",

diff --git a/packages/editor/src/editor/Editable.tsx b/packages/editor/src/editor/Editable.tsx
@@ -1,4 +1,4 @@
-import {BaseRange, Transforms, Text} from 'slate'
+import {BaseRange, Transforms, Text, select, Editor} from 'slate'
 import React, {useCallback, useMemo, useEffect, forwardRef, useState, KeyboardEvent} from 'react'
 import {
   Editable as SlateEditable,
@@ -303,6 +303,11 @@ export const PortableTextEditable = forwardRef(function PortableTextEditable(
       }
       if (!event.isDefaultPrevented()) {
         const selection = PortableTextEditor.getSelection(portableTextEditor)
+        // Create an editor selection if it does'nt exist
+        if (selection === null) {
+          Transforms.select(slateEditor, Editor.start(slateEditor, []))
+          slateEditor.onChange()
+        }
         change$.next({type: 'focus', event})
         const newSelection = PortableTextEditor.getSelection(portableTextEditor)
         // If the selection is the same, emit it explicitly here as there is no actual onChange event triggered.
@@ -314,7 +319,7 @@ export const PortableTextEditable = forwardRef(function PortableTextEditable(
         }
       }
     },
-    [change$, portableTextEditor, onFocus],
+    [onFocus, portableTextEditor, change$, slateEditor],
   )
 
   const handleOnBlur: React.FocusEventHandler<HTMLDivElement> = useCallback(

diff --git a/packages/editor/src/editor/plugins/createWithEditableAPI.ts b/packages/editor/src/editor/plugins/createWithEditableAPI.ts
@@ -41,12 +41,6 @@ export function createWithEditableAPI(
   return function withEditableAPI(editor: PortableTextSlateEditor): PortableTextSlateEditor {
     portableTextEditor.setEditable({
       focus: (): void => {
-        // Make a selection if missing
-        if (!editor.selection) {
-          const point = {path: [0, 0], offset: 0}
-          Transforms.select(editor, {focus: point, anchor: point})
-          editor.onChange()
-        }
         ReactEditor.focus(editor)
       },
       blur: (): void => {