@portabletext/editor 2.6.9 → 2.7.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/_chunks-cjs/selector.is-selecting-entire-blocks.cjs +4 -1
- package/lib/_chunks-cjs/selector.is-selecting-entire-blocks.cjs.map +1 -1
- package/lib/_chunks-dts/behavior.types.action.d.ts +9 -9
- package/lib/_chunks-es/selector.is-selecting-entire-blocks.js +4 -1
- package/lib/_chunks-es/selector.is-selecting-entire-blocks.js.map +1 -1
- package/lib/index.cjs +13 -19
- package/lib/index.cjs.map +1 -1
- package/lib/index.js +13 -19
- package/lib/index.js.map +1 -1
- package/lib/plugins/index.d.ts +3 -3
- package/lib/utils/index.d.cts +2 -2
- package/package.json +11 -11
- package/src/editor/editor-provider.tsx +2 -3
- package/src/selectors/selector.is-overlapping-selection.test.ts +116 -0
- package/src/selectors/selector.is-overlapping-selection.ts +20 -4
- package/src/internal-utils/use-constant.ts +0 -15
package/lib/plugins/index.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { Behavior, Editor, EditorEmittedEvent, EditorSchema } from "../_chunks-dts/behavior.types.action.js";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react21 from "react";
|
|
3
3
|
import React from "react";
|
|
4
4
|
/**
|
|
5
5
|
* @beta
|
|
@@ -181,7 +181,7 @@ type MarkdownPluginConfig = MarkdownBehaviorsConfig & {
|
|
|
181
181
|
*/
|
|
182
182
|
declare function MarkdownPlugin(props: {
|
|
183
183
|
config: MarkdownPluginConfig;
|
|
184
|
-
}):
|
|
184
|
+
}): react21.JSX.Element;
|
|
185
185
|
/**
|
|
186
186
|
* @beta
|
|
187
187
|
* Restrict the editor to one line. The plugin takes care of blocking
|
|
@@ -192,5 +192,5 @@ declare function MarkdownPlugin(props: {
|
|
|
192
192
|
*
|
|
193
193
|
* @deprecated Install the plugin from `@portabletext/plugin-one-line`
|
|
194
194
|
*/
|
|
195
|
-
declare function OneLinePlugin():
|
|
195
|
+
declare function OneLinePlugin(): react21.JSX.Element;
|
|
196
196
|
export { BehaviorPlugin, DecoratorShortcutPlugin, EditorRefPlugin, EventListenerPlugin, MarkdownPlugin, type MarkdownPluginConfig, OneLinePlugin };
|
package/lib/utils/index.d.cts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { BlockOffset, BlockPath, ChildPath, EditorContext, EditorSelection, EditorSelectionPoint } from "../_chunks-dts/behavior.types.action.cjs";
|
|
2
|
-
import * as
|
|
2
|
+
import * as _sanity_types9 from "@sanity/types";
|
|
3
3
|
import { KeyedSegment, PortableTextBlock, PortableTextTextBlock } from "@sanity/types";
|
|
4
4
|
import { isSpan, isTextBlock } from "@portabletext/schema";
|
|
5
5
|
/**
|
|
@@ -143,7 +143,7 @@ declare function mergeTextBlocks({
|
|
|
143
143
|
context: Pick<EditorContext, 'keyGenerator' | 'schema'>;
|
|
144
144
|
targetBlock: PortableTextTextBlock;
|
|
145
145
|
incomingBlock: PortableTextTextBlock;
|
|
146
|
-
}): PortableTextTextBlock<
|
|
146
|
+
}): PortableTextTextBlock<_sanity_types9.PortableTextObject | _sanity_types9.PortableTextSpan>;
|
|
147
147
|
/**
|
|
148
148
|
* @public
|
|
149
149
|
*/
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@portabletext/editor",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.7.0",
|
|
4
4
|
"description": "Portable Text Editor made in React",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"sanity",
|
|
@@ -74,19 +74,19 @@
|
|
|
74
74
|
"immer": "^10.1.1",
|
|
75
75
|
"lodash": "^4.17.21",
|
|
76
76
|
"lodash.startcase": "^4.4.0",
|
|
77
|
-
"react-compiler-runtime": "19.1.0-rc.
|
|
77
|
+
"react-compiler-runtime": "19.1.0-rc.3",
|
|
78
78
|
"slate": "0.118.1",
|
|
79
79
|
"slate-dom": "^0.118.1",
|
|
80
80
|
"slate-react": "0.117.4",
|
|
81
81
|
"xstate": "^5.21.0",
|
|
82
82
|
"@portabletext/block-tools": "^3.5.1",
|
|
83
83
|
"@portabletext/keyboard-shortcuts": "^1.1.1",
|
|
84
|
-
"@portabletext/
|
|
85
|
-
"@portabletext/
|
|
84
|
+
"@portabletext/patches": "^1.1.8",
|
|
85
|
+
"@portabletext/schema": "^1.2.0"
|
|
86
86
|
},
|
|
87
87
|
"devDependencies": {
|
|
88
88
|
"@sanity/diff-match-patch": "^3.2.0",
|
|
89
|
-
"@sanity/pkg-utils": "^8.1.
|
|
89
|
+
"@sanity/pkg-utils": "^8.1.4",
|
|
90
90
|
"@sanity/schema": "^4.6.0",
|
|
91
91
|
"@sanity/types": "^4.6.0",
|
|
92
92
|
"@testing-library/react": "^16.3.0",
|
|
@@ -95,19 +95,19 @@
|
|
|
95
95
|
"@types/lodash.startcase": "^4.4.9",
|
|
96
96
|
"@types/react": "^19.1.11",
|
|
97
97
|
"@types/react-dom": "^19.1.7",
|
|
98
|
-
"@typescript-eslint/eslint-plugin": "^8.39.1",
|
|
99
|
-
"@typescript-eslint/parser": "^8.39.1",
|
|
100
98
|
"@vitejs/plugin-react": "^4.7.0",
|
|
101
99
|
"@vitest/browser": "^3.2.4",
|
|
102
100
|
"@vitest/coverage-istanbul": "^3.2.4",
|
|
103
|
-
"babel-plugin-react-compiler": "19.1.0-rc.
|
|
104
|
-
"eslint": "
|
|
105
|
-
"eslint-
|
|
101
|
+
"babel-plugin-react-compiler": "19.1.0-rc.3",
|
|
102
|
+
"eslint": "^9.34.0",
|
|
103
|
+
"eslint-formatter-gha": "^1.6.0",
|
|
104
|
+
"eslint-plugin-react-hooks": "6.0.0-rc.2",
|
|
106
105
|
"jsdom": "^26.0.0",
|
|
107
106
|
"react": "^19.1.1",
|
|
108
107
|
"react-dom": "^19.1.1",
|
|
109
108
|
"rxjs": "^7.8.2",
|
|
110
109
|
"typescript": "5.9.2",
|
|
110
|
+
"typescript-eslint": "^8.41.0",
|
|
111
111
|
"vite": "^7.1.3",
|
|
112
112
|
"vitest": "^3.2.4",
|
|
113
113
|
"vitest-browser-react": "^1.0.1",
|
|
@@ -131,7 +131,7 @@
|
|
|
131
131
|
"scripts": {
|
|
132
132
|
"build": "pkg-utils build --strict --check --clean",
|
|
133
133
|
"check:lint": "biome lint .",
|
|
134
|
-
"check:react-compiler": "eslint --cache
|
|
134
|
+
"check:react-compiler": "eslint --cache .",
|
|
135
135
|
"check:types": "tsc",
|
|
136
136
|
"check:types:watch": "tsc --watch",
|
|
137
137
|
"clean": "del .turbo && del lib && del node_modules",
|
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
import type React from 'react'
|
|
2
|
-
import {useEffect} from 'react'
|
|
2
|
+
import {useEffect, useState} from 'react'
|
|
3
3
|
import {Slate} from 'slate-react'
|
|
4
4
|
import type {EditorConfig} from '../editor'
|
|
5
5
|
import {stopActor} from '../internal-utils/stop-actor'
|
|
6
|
-
import useConstant from '../internal-utils/use-constant'
|
|
7
6
|
import {createInternalEditor} from './create-editor'
|
|
8
7
|
import {EditorActorContext} from './editor-actor-context'
|
|
9
8
|
import {EditorContext} from './editor-context'
|
|
@@ -42,7 +41,7 @@ export type EditorProviderProps = {
|
|
|
42
41
|
* @group Components
|
|
43
42
|
*/
|
|
44
43
|
export function EditorProvider(props: EditorProviderProps) {
|
|
45
|
-
const {internalEditor, portableTextEditor} =
|
|
44
|
+
const [{internalEditor, portableTextEditor}] = useState(() => {
|
|
46
45
|
const internalEditor = createInternalEditor(props.initialConfig)
|
|
47
46
|
const portableTextEditor = new PortableTextEditor({
|
|
48
47
|
editor: internalEditor.editor,
|
|
@@ -170,6 +170,122 @@ describe(isOverlappingSelection.name, () => {
|
|
|
170
170
|
).toBe(false)
|
|
171
171
|
})
|
|
172
172
|
|
|
173
|
+
test('partial span selection', () => {
|
|
174
|
+
expect(
|
|
175
|
+
isOverlappingSelection({
|
|
176
|
+
anchor: {path: [{_key: 'k1'}, 'children', {_key: 'k3'}], offset: 0},
|
|
177
|
+
focus: {path: [{_key: 'k1'}, 'children', {_key: 'k3'}], offset: 3},
|
|
178
|
+
})(
|
|
179
|
+
snapshot({
|
|
180
|
+
anchor: {path: [{_key: 'k1'}, 'children', {_key: 'k3'}], offset: 2},
|
|
181
|
+
focus: {path: [{_key: 'k1'}, 'children', {_key: 'k5'}], offset: 1},
|
|
182
|
+
}),
|
|
183
|
+
),
|
|
184
|
+
).toBe(true)
|
|
185
|
+
})
|
|
186
|
+
|
|
187
|
+
test('expanded selection at the end edge of span', () => {
|
|
188
|
+
expect(
|
|
189
|
+
isOverlappingSelection({
|
|
190
|
+
anchor: {path: [{_key: 'k1'}, 'children', {_key: 'k3'}], offset: 0},
|
|
191
|
+
focus: {path: [{_key: 'k1'}, 'children', {_key: 'k3'}], offset: 3},
|
|
192
|
+
})(
|
|
193
|
+
snapshot({
|
|
194
|
+
anchor: {path: [{_key: 'k1'}, 'children', {_key: 'k3'}], offset: 3},
|
|
195
|
+
focus: {path: [{_key: 'k1'}, 'children', {_key: 'k5'}], offset: 1},
|
|
196
|
+
}),
|
|
197
|
+
),
|
|
198
|
+
).toBe(false)
|
|
199
|
+
})
|
|
200
|
+
|
|
201
|
+
test('collapsed selection at the end edge of span', () => {
|
|
202
|
+
expect(
|
|
203
|
+
isOverlappingSelection({
|
|
204
|
+
anchor: {path: [{_key: 'k1'}, 'children', {_key: 'k3'}], offset: 0},
|
|
205
|
+
focus: {path: [{_key: 'k1'}, 'children', {_key: 'k3'}], offset: 3},
|
|
206
|
+
})(
|
|
207
|
+
snapshot({
|
|
208
|
+
anchor: {path: [{_key: 'k1'}, 'children', {_key: 'k3'}], offset: 3},
|
|
209
|
+
focus: {path: [{_key: 'k1'}, 'children', {_key: 'k3'}], offset: 3},
|
|
210
|
+
}),
|
|
211
|
+
),
|
|
212
|
+
).toBe(true)
|
|
213
|
+
})
|
|
214
|
+
|
|
215
|
+
test('expanded selection at the start edge of span', () => {
|
|
216
|
+
expect(
|
|
217
|
+
isOverlappingSelection({
|
|
218
|
+
anchor: {path: [{_key: 'k1'}, 'children', {_key: 'k5'}], offset: 0},
|
|
219
|
+
focus: {path: [{_key: 'k1'}, 'children', {_key: 'k5'}], offset: 3},
|
|
220
|
+
})(
|
|
221
|
+
snapshot({
|
|
222
|
+
anchor: {path: [{_key: 'k1'}, 'children', {_key: 'k3'}], offset: 3},
|
|
223
|
+
focus: {path: [{_key: 'k1'}, 'children', {_key: 'k5'}], offset: 0},
|
|
224
|
+
}),
|
|
225
|
+
),
|
|
226
|
+
).toBe(false)
|
|
227
|
+
})
|
|
228
|
+
|
|
229
|
+
test('collapsed selection at the start edge of span', () => {
|
|
230
|
+
expect(
|
|
231
|
+
isOverlappingSelection({
|
|
232
|
+
anchor: {path: [{_key: 'k1'}, 'children', {_key: 'k5'}], offset: 0},
|
|
233
|
+
focus: {path: [{_key: 'k1'}, 'children', {_key: 'k5'}], offset: 3},
|
|
234
|
+
})(
|
|
235
|
+
snapshot({
|
|
236
|
+
anchor: {path: [{_key: 'k1'}, 'children', {_key: 'k5'}], offset: 0},
|
|
237
|
+
focus: {path: [{_key: 'k1'}, 'children', {_key: 'k5'}], offset: 0},
|
|
238
|
+
}),
|
|
239
|
+
),
|
|
240
|
+
).toBe(true)
|
|
241
|
+
})
|
|
242
|
+
|
|
243
|
+
test('selecting entire span', () => {
|
|
244
|
+
const blockKey = defaultKeyGenerator()
|
|
245
|
+
const fooKey = defaultKeyGenerator()
|
|
246
|
+
const barKey = defaultKeyGenerator()
|
|
247
|
+
const bazKey = defaultKeyGenerator()
|
|
248
|
+
|
|
249
|
+
expect(
|
|
250
|
+
isOverlappingSelection({
|
|
251
|
+
anchor: {
|
|
252
|
+
path: [{_key: blockKey}, 'children', {_key: barKey}],
|
|
253
|
+
offset: 0,
|
|
254
|
+
},
|
|
255
|
+
focus: {
|
|
256
|
+
path: [{_key: blockKey}, 'children', {_key: barKey}],
|
|
257
|
+
offset: 3,
|
|
258
|
+
},
|
|
259
|
+
})(
|
|
260
|
+
createTestSnapshot({
|
|
261
|
+
context: {
|
|
262
|
+
value: [
|
|
263
|
+
{
|
|
264
|
+
_key: blockKey,
|
|
265
|
+
_type: 'block',
|
|
266
|
+
children: [
|
|
267
|
+
{_key: fooKey, _type: 'span', text: 'foo'},
|
|
268
|
+
{_key: barKey, _type: 'span', text: 'bar', marks: ['strong']},
|
|
269
|
+
{_key: bazKey, _type: 'span', text: 'baz'},
|
|
270
|
+
],
|
|
271
|
+
},
|
|
272
|
+
],
|
|
273
|
+
selection: {
|
|
274
|
+
anchor: {
|
|
275
|
+
path: [{_key: blockKey}, 'children', {_key: barKey}],
|
|
276
|
+
offset: 0,
|
|
277
|
+
},
|
|
278
|
+
focus: {
|
|
279
|
+
path: [{_key: blockKey}, 'children', {_key: barKey}],
|
|
280
|
+
offset: 3,
|
|
281
|
+
},
|
|
282
|
+
},
|
|
283
|
+
},
|
|
284
|
+
}),
|
|
285
|
+
),
|
|
286
|
+
).toBe(true)
|
|
287
|
+
})
|
|
288
|
+
|
|
173
289
|
test('unknown block', () => {
|
|
174
290
|
const unknownBlockKey = defaultKeyGenerator()
|
|
175
291
|
|
|
@@ -44,6 +44,22 @@ export function isOverlappingSelection(
|
|
|
44
44
|
return false
|
|
45
45
|
}
|
|
46
46
|
|
|
47
|
+
const startPointEqualToOriginalStartPoint = isEqualSelectionPoints(
|
|
48
|
+
selectionStartPoint,
|
|
49
|
+
originalSelectionStartPoint,
|
|
50
|
+
)
|
|
51
|
+
const endPointEqualToOriginalEndPoint = isEqualSelectionPoints(
|
|
52
|
+
selectionEndPoint,
|
|
53
|
+
originalSelectionEndPoint,
|
|
54
|
+
)
|
|
55
|
+
|
|
56
|
+
if (
|
|
57
|
+
startPointEqualToOriginalStartPoint &&
|
|
58
|
+
endPointEqualToOriginalEndPoint
|
|
59
|
+
) {
|
|
60
|
+
return true
|
|
61
|
+
}
|
|
62
|
+
|
|
47
63
|
const startPointBeforeSelection =
|
|
48
64
|
isPointBeforeSelection(selectionStartPoint)(snapshot)
|
|
49
65
|
const startPointAfterSelection =
|
|
@@ -103,14 +119,14 @@ export function isOverlappingSelection(
|
|
|
103
119
|
},
|
|
104
120
|
})
|
|
105
121
|
|
|
106
|
-
const endPointEqualToOriginalStartPoint = isEqualSelectionPoints(
|
|
107
|
-
selectionEndPoint,
|
|
108
|
-
originalSelectionStartPoint,
|
|
109
|
-
)
|
|
110
122
|
const startPointEqualToOriginalEndPoint = isEqualSelectionPoints(
|
|
111
123
|
selectionStartPoint,
|
|
112
124
|
originalSelectionEndPoint,
|
|
113
125
|
)
|
|
126
|
+
const endPointEqualToOriginalStartPoint = isEqualSelectionPoints(
|
|
127
|
+
selectionEndPoint,
|
|
128
|
+
originalSelectionStartPoint,
|
|
129
|
+
)
|
|
114
130
|
|
|
115
131
|
// If all checks fail then we can deduce that the selection does not exist
|
|
116
132
|
// and there doesn't overlap with the snapshot selection
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import React from 'react'
|
|
2
|
-
|
|
3
|
-
type ConstantRef<TConstant> = {constant: TConstant}
|
|
4
|
-
|
|
5
|
-
export default function useConstant<TConstant>(
|
|
6
|
-
factory: () => TConstant,
|
|
7
|
-
): TConstant {
|
|
8
|
-
const ref = React.useRef<ConstantRef<TConstant>>(null)
|
|
9
|
-
|
|
10
|
-
if (!ref.current) {
|
|
11
|
-
ref.current = {constant: factory()}
|
|
12
|
-
}
|
|
13
|
-
|
|
14
|
-
return ref.current.constant
|
|
15
|
-
}
|