@portabletext/editor 1.35.0 → 1.35.1

package/src/editor-event-listener.tsx

@@ -0,0 +1,30 @@
+import {useEffect} from 'react'
+import {useEffectEvent} from 'use-effect-event'
+import type {EditorEmittedEvent} from './editor/editor-machine'
+import {useEditor} from './editor/editor-provider'
+
+/**
+ * @public
+ * @deprecated
+ * This component has been renamed. Use `EventListenerPlugin` instead.
+ *
+ * ```
+ * import {EventListenerPlugin} from '@portabletext/editor/plugins'
+ * ```
+ */
+export function EditorEventListener(props: {
+  on: (event: EditorEmittedEvent) => void
+}) {
+  const editor = useEditor()
+  const on = useEffectEvent(props.on)
+
+  useEffect(() => {
+    const subscription = editor.on('*', on)
+
+    return () => {
+      subscription.unsubscribe()
+    }
+  }, [editor])
+
+  return null
+}

package/src/index.ts

@@ -41,7 +41,7 @@ export {defaultKeyGenerator as keyGenerator} from './editor/key-generator'
 export type {AddedAnnotationPaths} from './editor/plugins/createWithEditableAPI'
 export {PortableTextEditor} from './editor/PortableTextEditor'
 export type {PortableTextEditorProps} from './editor/PortableTextEditor'
-export {EventListenerPlugin as EditorEventListener} from './plugins/plugin.event-listener'
+export {EditorEventListener} from './editor-event-listener'
 export type {BlockOffset} from './types/block-offset'
 export * from './types/editor'
 export type {PortableTextMemberSchemaTypes} from './types/editor'

package/src/internal-utils/create-test-snapshot.ts

@@ -0,0 +1,23 @@
+import {compileSchemaDefinition, defineSchema} from '../editor/define-schema'
+import type {EditorSnapshot} from '../selectors'
+import {createTestKeyGenerator} from './test-key-generator'
+
+export function createTestSnapshot(snapshot: {
+  context?: Partial<EditorSnapshot['context']>
+  beta?: Partial<EditorSnapshot['beta']>
+}): EditorSnapshot {
+  return {
+    context: {
+      converters: snapshot.context?.converters ?? [],
+      schema:
+        snapshot.context?.schema ?? compileSchemaDefinition(defineSchema({})),
+      keyGenerator: snapshot.context?.keyGenerator ?? createTestKeyGenerator(),
+      activeDecorators: snapshot.context?.activeDecorators ?? [],
+      value: snapshot.context?.value ?? [],
+      selection: snapshot.context?.selection ?? null,
+    },
+    beta: {
+      hasTag: snapshot.beta?.hasTag ?? (() => false),
+    },
+  }
+}

package/src/plugins/plugin.one-line.tsx

@@ -10,7 +10,7 @@ const oneLineBehaviors = [
    */
   defineBehavior({
     on: 'insert.break',
-    guard: (snapshot) =>
+    guard: ({snapshot}) =>
       snapshot.context.selection && selectors.isSelectionExpanded(snapshot)
         ? {selection: snapshot.context.selection}
         : false,

package/src/selectors/selector.get-active-annotations.test.ts

@@ -1,25 +1,16 @@
 import type {PortableTextBlock} from '@sanity/types'
 import {expect, test} from 'vitest'
-import type {EditorSchema} from '../editor/define-schema'
-import type {EditorSnapshot} from '../editor/editor-snapshot'
-import {createTestKeyGenerator} from '../internal-utils/test-key-generator'
+import {createTestSnapshot} from '../internal-utils/create-test-snapshot'
 import type {EditorSelection} from '../utils'
 import {getActiveAnnotations} from './selector.get-active-annotations'
 
-function snapshot(
-  value: Array<PortableTextBlock>,
-  selection: EditorSelection,
-): EditorSnapshot {
-  return {
+function snapshot(value: Array<PortableTextBlock>, selection: EditorSelection) {
+  return createTestSnapshot({
     context: {
-      converters: [],
-      schema: {} as EditorSchema,
-      keyGenerator: createTestKeyGenerator(),
-      activeDecorators: [],
       value,
       selection,
     },
-  }
+  })
 }
 
 const link = {

package/src/selectors/selector.get-caret-word-selection.test.ts

@@ -1,7 +1,6 @@
 import type {PortableTextBlock} from '@sanity/types'
 import {describe, expect, test} from 'vitest'
-import {compileSchemaDefinition, defineSchema} from '../editor/define-schema'
-import type {EditorSnapshot} from '../editor/editor-snapshot'
+import {createTestSnapshot} from '../internal-utils/create-test-snapshot'
 import {createTestKeyGenerator} from '../internal-utils/test-key-generator'
 import type {EditorSelection} from '../utils'
 import {getCaretWordSelection} from './selector.get-caret-word-selection'
@@ -9,16 +8,13 @@ import {getCaretWordSelection} from './selector.get-caret-word-selection'
 const keyGenerator = createTestKeyGenerator()
 
 function snapshot(value: Array<PortableTextBlock>, selection: EditorSelection) {
-  return {
+  return createTestSnapshot({
     context: {
       value,
       selection,
       keyGenerator,
-      activeDecorators: [],
-      converters: [],
-      schema: compileSchemaDefinition(defineSchema({})),
     },
-  } satisfies EditorSnapshot
+  })
 }
 
 describe(getCaretWordSelection.name, () => {

package/src/selectors/selector.get-selected-spans.test.ts

@@ -1,7 +1,7 @@
 import type {PortableTextBlock} from '@sanity/types'
 import {describe, expect, test} from 'vitest'
-import {getSelectedSpans, type EditorSchema, type EditorSelection} from '.'
-import type {EditorSnapshot} from '../editor/editor-snapshot'
+import {getSelectedSpans, type EditorSelection} from '.'
+import {createTestSnapshot} from '../internal-utils/create-test-snapshot'
 
 const fooBar = {
   _type: 'block',
@@ -40,17 +40,13 @@ describe(getSelectedSpans.name, () => {
   function snapshot(
     value: Array<PortableTextBlock>,
     selection: EditorSelection,
-  ): EditorSnapshot {
-    return {
+  ) {
+    return createTestSnapshot({
       context: {
-        converters: [],
-        schema: {} as EditorSchema,
-        keyGenerator: () => '',
-        activeDecorators: [],
         value,
         selection,
       },
-    }
+    })
   }
 
   test('selecting a single span', () => {

package/src/selectors/selector.get-selection-text.test.ts

@@ -1,7 +1,8 @@
 import type {PortableTextBlock} from '@sanity/types'
 import {expect, test} from 'vitest'
-import type {EditorSelection, EditorSnapshot} from '.'
+import type {EditorSelection} from '.'
 import {compileSchemaDefinition, defineSchema} from '../editor/define-schema'
+import {createTestSnapshot} from '../internal-utils/create-test-snapshot'
 import {getSelectionText} from './selector.get-selection-text'
 
 const brokenBlock = {
@@ -67,21 +68,18 @@ test(getSelectionText.name, () => {
   function snapshot(
     value: Array<PortableTextBlock>,
     selection: EditorSelection,
-  ): EditorSnapshot {
-    return {
+  ) {
+    return createTestSnapshot({
       context: {
-        converters: [],
         schema: compileSchemaDefinition(
           defineSchema({
             inlineObjects: [{name: 'stock-ticker'}],
           }),
         ),
-        keyGenerator: () => '',
-        activeDecorators: [],
         value,
         selection,
       },
-    }
+    })
   }
 
   expect(

package/src/selectors/selector.get-trimmed-selection.test.ts

@@ -1,7 +1,7 @@
 import type {PortableTextBlock} from '@sanity/types'
 import {describe, expect, test} from 'vitest'
 import {compileSchemaDefinition, defineSchema} from '../editor/define-schema'
-import type {EditorSnapshot} from '../editor/editor-snapshot'
+import {createTestSnapshot} from '../internal-utils/create-test-snapshot'
 import {parseBlock} from '../internal-utils/parse-blocks'
 import {createTestKeyGenerator} from '../internal-utils/test-key-generator'
 import type {EditorSelection} from '../types/editor'
@@ -20,10 +20,8 @@ function snapshot(
     }),
   )
 
-  return {
+  return createTestSnapshot({
     context: {
-      activeDecorators: [],
-      converters: [],
       keyGenerator,
       schema,
       selection,
@@ -42,7 +40,7 @@ function snapshot(
         return parsedBlock ? [parsedBlock] : []
       }),
     },
-  } satisfies EditorSnapshot
+  })
 }
 
 function createSpan(text: string, marks: Array<string> = []) {

package/src/selectors/selector.is-active-decorator.test.ts

@@ -1,16 +1,12 @@
 import {expect, test} from 'vitest'
-import type {EditorSchema, EditorSelection} from '.'
-import type {EditorSnapshot} from '../editor/editor-snapshot'
+import type {EditorSelection} from '.'
+import {createTestSnapshot} from '../internal-utils/create-test-snapshot'
 import {isActiveDecorator} from './selector.is-active-decorator'
 
 test(isActiveDecorator.name, () => {
-  function snapshot(selection: EditorSelection): EditorSnapshot {
-    return {
+  function snapshot(selection: EditorSelection) {
+    return createTestSnapshot({
       context: {
-        converters: [],
-        schema: {} as EditorSchema,
-        keyGenerator: () => '',
-        activeDecorators: [],
         value: [
           {
             _type: '_block',
@@ -32,7 +28,7 @@ test(isActiveDecorator.name, () => {
         ],
         selection,
       },
-    }
+    })
   }
 
   expect(