@portabletext/editor 1.12.3 → 1.13.0

package/src/editor/editor-machine.ts

@@ -71,6 +71,7 @@ export type InternalEditorEvent =
       type: 'behavior event'
       behaviorEvent: BehaviorEvent
       editor: PortableTextSlateEditor
+      nativeEvent?: {preventDefault: () => void}
     }
   | {
       type: 'behavior action intends'
@@ -271,10 +272,11 @@ export const editorMachine = setup({
 
       for (const eventBehavior of eventBehaviors) {
         const shouldRun =
-          eventBehavior.guard?.({
+          eventBehavior.guard === undefined ||
+          eventBehavior.guard({
             context: behaviorContext,
             event: event.behaviorEvent,
-          }) ?? true
+          })
 
         if (!shouldRun) {
           continue
@@ -303,6 +305,7 @@ export const editorMachine = setup({
         }
 
         if (behaviorOverwritten) {
+          event.nativeEvent?.preventDefault()
           break
         }
       }

package/src/editor/plugins/createWithHotKeys.ts

@@ -1,6 +1,6 @@
 import {isPortableTextSpan, isPortableTextTextBlock} from '@sanity/types'
 import type {KeyboardEvent} from 'react'
-import {Editor, Node, Path, Range, Transforms} from 'slate'
+import {Editor, Node, Range} from 'slate'
 import type {ReactEditor} from 'slate-react'
 import type {PortableTextSlateEditor} from '../../types/editor'
 import type {HotkeyOptions} from '../../types/options'
@@ -80,53 +80,6 @@ export function createWithHotkeys(
       const isTab = isHotkey('tab', event.nativeEvent)
       const isShiftEnter = isHotkey('shift+enter', event.nativeEvent)
       const isShiftTab = isHotkey('shift+tab', event.nativeEvent)
-      const isArrowDown = isHotkey('down', event.nativeEvent)
-      const isArrowUp = isHotkey('up', event.nativeEvent)
-
-      // Check if the user is in a void block, in that case, add an empty text block below if there is no next block
-      if (isArrowDown && editor.selection) {
-        const focusBlock = Node.descendant(
-          editor,
-          editor.selection.focus.path.slice(0, 1),
-        ) as SlateTextBlock | VoidElement
-
-        if (focusBlock && Editor.isVoid(editor, focusBlock)) {
-          const nextPath = Path.next(editor.selection.focus.path.slice(0, 1))
-          const nextBlock = Node.has(editor, nextPath)
-          if (!nextBlock) {
-            Transforms.insertNodes(
-              editor,
-              editor.pteCreateTextBlock({decorators: []}),
-              {
-                at: nextPath,
-              },
-            )
-            Transforms.select(editor, {path: [...nextPath, 0], offset: 0})
-            editor.onChange()
-            return
-          }
-        }
-      }
-      if (isArrowUp && editor.selection) {
-        const isFirstBlock = editor.selection.focus.path[0] === 0
-        const focusBlock = Node.descendant(
-          editor,
-          editor.selection.focus.path.slice(0, 1),
-        ) as SlateTextBlock | VoidElement
-
-        if (isFirstBlock && focusBlock && Editor.isVoid(editor, focusBlock)) {
-          Transforms.insertNodes(
-            editor,
-            editor.pteCreateTextBlock({decorators: []}),
-            {
-              at: [0],
-            },
-          )
-          Transforms.select(editor, {path: [0, 0], offset: 0})
-          editor.onChange()
-          return
-        }
-      }
 
       // Tab for lists
       // Only steal tab when we are on a plain text span or we are at the start of the line (fallback if the whole block is annotated or contains a single inline object)

package/src/index.ts

@@ -9,6 +9,10 @@ export {
   createMarkdownBehaviors,
   type MarkdownBehaviorsConfig,
 } from './editor/behavior/behavior.markdown'
+export {
+  createCodeEditorBehaviors,
+  type CodeEditorBehaviorsConfig,
+} from './editor/behavior/behavior.code-editor'
 export {
   defineBehavior,
   type Behavior,

package/src/utils/is-hotkey.test.ts

@@ -1,61 +1,112 @@
 import {expect, test} from 'vitest'
 import {isHotkey, type KeyboardEventLike} from './is-hotkey'
 
-function e(value: string | number, ...modifiers: string[]) {
+function e(
+  value: string | number,
+  modifiers: Array<'altKey' | 'ctrlKey' | 'metaKey' | 'shiftKey'> = [],
+) {
   return {
     ...(typeof value === 'string' ? {key: value} : {keyCode: value}),
-    altKey: modifiers.includes('alt'),
-    ctrlKey: modifiers.includes('ctrl'),
-    metaKey: modifiers.includes('meta'),
-    shiftKey: modifiers.includes('shift'),
+    altKey: modifiers.includes('altKey'),
+    ctrlKey: modifiers.includes('ctrlKey'),
+    metaKey: modifiers.includes('metaKey'),
+    shiftKey: modifiers.includes('shiftKey'),
   } as KeyboardEventLike
 }
 
-type TestCase = [KeyboardEventLike, string, boolean]
-
-const testCases = [
-  [e(83, 'meta'), 'Meta+S', true],
-  [e(83, 'alt', 'meta'), 'Meta+Alt+s', true],
-  [e(83, 'meta'), 'meta+s', true],
-  [e(83, 'meta'), 'cmd+s', true],
-  [e(32, 'meta'), 'cmd+space', true],
-  [e(187, 'meta'), 'cmd+=', true],
-  [e(83, 'ctrl'), 'mod+s', true],
-  [e(16, 'shift'), 'shift', true],
-  [e(93, 'meta'), 'meta', true],
-  [e(65), 'a', true],
-  [e(83, 'alt', 'meta'), 'cmd+s', false],
-  [e('a', 'ctrl'), 'a', false],
-  [e(83, 'alt', 'meta'), 'cmd+alt?+s', true],
-  [e(83, 'meta'), 'cmd+alt?+s', true],
-  [e('?'), '?', true],
-  [e(13), 'enter', true],
-  [e(65, 'meta'), 'cmd+a', true],
-  [e(83, 'meta'), 'cmd+s', true],
-  [e('s', 'meta'), 'Meta+S', true],
-  [e('ß', 'alt', 'meta'), 'Meta+Alt+ß', true],
-  [e('s', 'meta'), 'meta+s', true],
-  [e('s', 'meta'), 'cmd+s', true],
-  [e(' ', 'meta'), 'cmd+space', true],
-  [e('+', 'meta'), 'cmd++', true],
-  [e('s', 'ctrl'), 'mod+s', true],
-  [e('Shift', 'shift'), 'shift', true],
-  [e('a'), 'a', true],
-  [e('s', 'alt', 'meta'), 'cmd+s', false],
-  [e('a', 'ctrl'), 'a', false],
-  [e('s', 'alt', 'meta'), 'cmd+alt?+s', true],
-  [e('s', 'meta'), 'cmd+alt?+s', true],
-  [e('Enter'), 'enter', true],
-  [e('a', 'meta'), 'meta+a', true],
-  [e('s', 'meta'), 'meta+s', true],
+type TestCase = [string, KeyboardEventLike, boolean]
+
+const testCases: TestCase[] = [
+  ['meta', e('Meta', ['metaKey']), true],
+  ['Meta', e('Meta', ['metaKey']), true],
+  ['meta', e(93, ['metaKey']), true],
+  ['Meta', e(93, ['metaKey']), true],
+
+  ['meta+s', e('s', ['metaKey']), true],
+  ['Meta+S', e('s', ['metaKey']), true],
+  ['meta+s', e(83, ['metaKey']), true],
+  ['Meta+S', e(83, ['metaKey']), true],
+
+  ['cmd+space', e(' ', ['metaKey']), true],
+  ['Cmd+Space', e(' ', ['metaKey']), true],
+  ['cmd+space', e(32, ['metaKey']), true],
+  ['Cmd+Space', e(32, ['metaKey']), true],
+
+  ['cmd+alt?+s', e('s', ['metaKey']), true],
+  ['cmd+alt?+s', e('s', ['metaKey', 'altKey']), true],
+  ['cmd+alt?+s', e(83, ['metaKey']), true],
+  ['cmd+alt?+s', e(83, ['metaKey', 'altKey']), true],
+
+  ['Cmd+Alt?+S', e('s', ['metaKey']), true],
+  ['Cmd+Alt?+S', e('s', ['metaKey', 'altKey']), true],
+  ['Cmd+Alt?+S', e(83, ['metaKey']), true],
+  ['Cmd+Alt?+S', e(83, ['metaKey', 'altKey']), true],
+
+  ['cmd+s', e('s', ['metaKey', 'altKey']), false],
+  ['Cmd+S', e('s', ['metaKey', 'altKey']), false],
+  ['cmd+s', e(83, ['metaKey', 'altKey']), false],
+  ['Cmd+S', e(83, ['metaKey', 'altKey']), false],
+
+  ['cmd+s', e('s', ['metaKey']), true],
+  ['Cmd+s', e('s', ['metaKey']), true],
+  ['cmd+s', e(83, ['metaKey']), true],
+  ['Cmd+s', e(83, ['metaKey']), true],
+
+  ['mod+s', e('s', ['ctrlKey']), true],
+  ['Mod+S', e('s', ['ctrlKey']), true],
+  ['mod+s', e(83, ['ctrlKey']), true],
+  ['Mod+S', e(83, ['ctrlKey']), true],
+
+  ['meta+alt+s', e('s', ['metaKey', 'altKey']), true],
+  ['Meta+Alt+S', e('s', ['metaKey', 'altKey']), true],
+  ['meta+alt+s', e(83, ['metaKey', 'altKey']), true],
+  ['Meta+Alt+S', e(83, ['metaKey', 'altKey']), true],
+
+  ['?', e('?'), true],
+  ['?', e('?', ['altKey']), false],
+
+  ['a', e('a'), true],
+  ['a', e('A'), true],
+  ['A', e('a'), true],
+  ['A', e('A'), true],
+  ['a', e(65), true],
+  ['A', e(65), true],
+
+  ['a', e('a', ['ctrlKey']), false],
+  ['A', e('a', ['ctrlKey']), false],
+  ['a', e(65, ['ctrlKey']), false],
+  ['A', e(65, ['ctrlKey']), false],
+
+  ['shift', e('Shift', ['shiftKey']), true],
+  ['Shift', e('Shift', ['shiftKey']), true],
+  ['shift', e(16, ['shiftKey']), true],
+  ['Shift', e(16, ['shiftKey']), true],
+
+  ['meta+a', e('a', ['metaKey']), true],
+  ['Meta+A', e('a', ['metaKey']), true],
+  ['cmd+a', e(65, ['metaKey']), true],
+  ['Cmd+A', e(65, ['metaKey']), true],
+
+  ['enter', e('Enter'), true],
+  ['Enter', e('Enter'), true],
+  ['enter', e(13), true],
+  ['Enter', e(13), true],
+
+  ['cmd+=', e(187, ['metaKey']), true],
+  ['Cmd+=', e(187, ['metaKey']), true],
+  ['cmd++', e('+', ['metaKey']), true],
+  ['Cmd++', e('+', ['metaKey']), true],
+
+  ['meta+alt+ß', e('ß', ['metaKey', 'altKey']), true],
+  ['Meta+Alt+ß', e('ß', ['metaKey', 'altKey']), true],
 ] satisfies Array<TestCase>
 
 test(isHotkey.name, () => {
   for (const testCase of testCases) {
-    expect(isHotkey(testCase[1], testCase[0])).toBe(testCase[2])
+    expect(isHotkey(testCase[0], testCase[1])).toBe(testCase[2])
   }
 
-  expect(() => isHotkey('ctrlalt+k', e('k', 'ctrl', 'alt'))).toThrowError(
-    'Unknown modifier: "ctrlalt"',
-  )
+  expect(() =>
+    isHotkey('ctrlalt+k', e('k', ['ctrlKey', 'altKey'])),
+  ).toThrowError('Unknown modifier: "ctrlalt"')
 })

package/src/utils/is-hotkey.ts

@@ -1,6 +1,6 @@
 export interface KeyboardEventLike {
   key: string
-  keyCode: number
+  keyCode?: number
   altKey: boolean
   ctrlKey: boolean
   metaKey: boolean