Skip to content

Commit c662384

Browse files
kudlajzkudlajz
authored
Merge pull request #575 from prezly/feature/dev-14744-explore-migrating-to-plate-editor
Refactor - Migrate to Plate
2 parents 638570c + 941d07c commit c662384

File tree

421 files changed

+1912
-2328
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

421 files changed

+1912
-2328
lines changed

‎lerna.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
11
{
22
"$schema": "node_modules/lerna/schemas/lerna-schema.json",
3-
"version": "0.117.0"
3+
"version": "0.117.4-alpha.0"
44
}

‎package.json

+3-3
Original file line numberDiff line numberDiff line change
@@ -41,9 +41,9 @@
4141
"@types/react-dom": "^18.3.0",
4242
"react": "^18.3.0",
4343
"react-dom": "^18.3.0",
44-
"slate": "^0.101.5",
45-
"slate-history": "^0.100.0",
46-
"slate-react": "^0.101.5"
44+
"slate": "^0.110.2",
45+
"slate-history": "^0.110.3",
46+
"slate-react": "^0.111.0"
4747
},
4848
"devDependencies": {
4949
"@babel/cli": "^7.23.9",

‎packages/slate-commons/package.json

+5-4
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@prezly/slate-commons",
3-
"version": "0.117.0",
3+
"version": "0.117.3-alpha.0",
44
"description": "Low-level commands, utilities, plugins, types, etc. used throughout Prezly-Slate packages",
55
"license": "MIT",
66
"type": "module",
@@ -42,11 +42,12 @@
4242
"clean:build": "rimraf build/ *.tsbuildinfo"
4343
},
4444
"peerDependencies": {
45+
"@udecode/plate-common": "^40.0.0",
4546
"react": "^18.3.0",
4647
"react-dom": "^18.3.0",
47-
"slate": "^0.101.5",
48-
"slate-history": "^0.100.0",
49-
"slate-react": "^0.101.5"
48+
"slate": "^0.110.2",
49+
"slate-history": "^0.110.3",
50+
"slate-react": "^0.111.0"
5051
},
5152
"dependencies": {
5253
"@prezly/slate-types": "workspace:*",

‎packages/slate-commons/src/commands/alignment.ts

+14-11
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
11
import type { AlignableNode, Alignment } from '@prezly/slate-types';
22
import { isAlignableElement, isTableCellNode } from '@prezly/slate-types';
3-
import type { Node, NodeEntry, Path } from 'slate';
4-
import { Editor, Transforms } from 'slate';
3+
import { getAboveNode, type SlateEditor, type TNodeEntry } from '@udecode/plate-common';
4+
import type { Node, Path } from 'slate';
55

6-
export function getAlignment(editor: Editor, defaultAlignment: Alignment): Alignment[] {
7-
const nodes = Editor.nodes<AlignableNode>(editor, {
6+
export function getAlignment(editor: SlateEditor, defaultAlignment: Alignment): Alignment[] {
7+
const nodes = editor.nodes<AlignableNode>({
88
match: (node, path) => isTopLevelAlignableElement(editor, node, path),
99
});
1010

@@ -17,27 +17,30 @@ export function getAlignment(editor: Editor, defaultAlignment: Alignment): Align
1717
return [...alignments];
1818
}
1919

20-
export function toggleAlignment(editor: Editor, align: Alignment | undefined): void {
20+
export function toggleAlignment(editor: SlateEditor, align: Alignment | undefined): void {
2121
if (align === undefined) {
22-
Transforms.unsetNodes(editor, 'align', {
22+
editor.unsetNodes('align', {
2323
match: (node, path) => isTopLevelAlignableElement(editor, node, path),
2424
});
2525
return;
2626
}
2727

28-
Transforms.setNodes<AlignableNode>(
29-
editor,
28+
editor.setNodes<AlignableNode>(
3029
{ align },
3130
{ match: (node, path) => isTopLevelAlignableElement(editor, node, path) },
3231
);
3332
}
3433

35-
function isAlignmentRoot([node, path]: NodeEntry): boolean {
34+
function isAlignmentRoot([node, path]: TNodeEntry): boolean {
3635
// We allow aligning elements either at top-level or inside table cells.
3736
return path.length === 0 || isTableCellNode(node);
3837
}
3938

40-
function isTopLevelAlignableElement(editor: Editor, node: Node, path: Path): node is AlignableNode {
41-
const parent = Editor.above(editor, { at: path });
39+
function isTopLevelAlignableElement(
40+
editor: SlateEditor,
41+
node: Node,
42+
path: Path,
43+
): node is AlignableNode {
44+
const parent = getAboveNode(editor, { at: path });
4245
return parent !== undefined && isAlignmentRoot(parent) && isAlignableElement(node);
4346
}

‎packages/slate-commons/src/commands/blur.ts

+4-4
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
1-
import type { Editor } from 'slate';
2-
import { ReactEditor } from 'slate-react';
1+
import type { SlateEditor } from '@udecode/plate-common';
2+
import { deselectEditor } from '@udecode/plate-common/react';
33

4-
export function blur(editor: Editor & ReactEditor): void {
5-
ReactEditor.deselect(editor);
4+
export function blur(editor: SlateEditor): void {
5+
deselectEditor(editor);
66
}

‎packages/slate-commons/src/commands/findLeafLocation.ts

+3-2
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,12 @@
1-
import type { Editor, Location } from 'slate';
1+
import type { SlateEditor } from '@udecode/plate-common';
2+
import type { Location } from 'slate';
23
import { Path, Point } from 'slate';
34

45
import { findLeafPath } from './findLeafPath';
56
import { findLeafPoint } from './findLeafPoint';
67
import { findLeafRange } from './findLeafRange';
78

8-
export function findLeafLocation(editor: Editor, location: Location): Location | undefined {
9+
export function findLeafLocation(editor: SlateEditor, location: Location): Location | undefined {
910
if (Path.isPath(location)) {
1011
return findLeafPath(editor, location);
1112
}

‎packages/slate-commons/src/commands/findLeafPath.ts

+8-4
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,14 @@
1+
import type { SlateEditor } from '@udecode/plate-common';
12
import type { Path } from 'slate';
2-
import { Editor, Node, Text } from 'slate';
3+
import { Node, Text } from 'slate';
34

45
export type Edge = 'highest' | 'lowest';
56

6-
export function findLeafPath(editor: Editor, path: Path, edge: Edge = 'highest'): Path | undefined {
7+
export function findLeafPath(
8+
editor: SlateEditor,
9+
path: Path,
10+
edge: Edge = 'highest',
11+
): Path | undefined {
712
if (!Node.has(editor, path)) {
813
return undefined;
914
}
@@ -14,8 +19,7 @@ export function findLeafPath(editor: Editor, path: Path, edge: Edge = 'highest')
1419
return path;
1520
}
1621

17-
const [, nestedPath] =
18-
edge === 'highest' ? Editor.first(editor, path) : Editor.last(editor, path);
22+
const [, nestedPath] = edge === 'highest' ? editor.first(path) : editor.last(path);
1923

2024
return findLeafPath(editor, nestedPath);
2125
}

‎packages/slate-commons/src/commands/findLeafPoint.ts

+4-3
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,11 @@
1-
import { Editor, Path, Point } from 'slate';
1+
import type { SlateEditor } from '@udecode/plate-common';
2+
import { Path, Point } from 'slate';
23

34
import type { Edge } from './findLeafPath';
45
import { findLeafPath } from './findLeafPath';
56

67
export function findLeafPoint(
7-
editor: Editor,
8+
editor: SlateEditor,
89
point: Point,
910
edge: Edge = 'highest',
1011
): Point | undefined {
@@ -14,7 +15,7 @@ export function findLeafPoint(
1415
return undefined;
1516
}
1617

17-
const [, end] = Editor.edges(editor, path);
18+
const [, end] = editor.edges(path);
1819

1920
if (Path.equals(point.path, path)) {
2021
if (Point.isAfter(point, end)) {

‎packages/slate-commons/src/commands/findLeafRange.ts

+3-2
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,9 @@
1-
import type { Editor, Range } from 'slate';
1+
import type { SlateEditor } from '@udecode/plate-common';
2+
import type { Range } from 'slate';
23

34
import { findLeafPoint } from './findLeafPoint';
45

5-
export function findLeafRange(editor: Editor, range: Range): Range | undefined {
6+
export function findLeafRange(editor: SlateEditor, range: Range): Range | undefined {
67
const anchor = findLeafPoint(editor, range.anchor);
78
const focus = findLeafPoint(editor, range.focus);
89

‎packages/slate-commons/src/commands/focus.ts

+4-4
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
1-
import type { Editor } from 'slate';
2-
import { ReactEditor } from 'slate-react';
1+
import type { SlateEditor } from '@udecode/plate-common';
2+
import { focusEditor } from '@udecode/plate-common/react';
33

44
import { moveCursorToEndOfDocument } from './moveCursorToEndOfDocument';
55

6-
export function focus(editor: Editor & ReactEditor): void {
7-
ReactEditor.focus(editor);
6+
export function focus(editor: SlateEditor): void {
7+
focusEditor(editor);
88
moveCursorToEndOfDocument(editor);
99
}

‎packages/slate-commons/src/commands/getCurrentDomNode.ts

+4-5
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,14 @@
1-
import type { Editor } from 'slate';
2-
import type { ReactEditor } from 'slate-react';
1+
import type { SlateEditor } from '@udecode/plate-common';
2+
import { toDOMNode } from '@udecode/plate-common/react';
33

44
import { getCurrentNodeEntry } from './getCurrentNodeEntry';
5-
import { toDomNode } from './toDomNode';
65

7-
export function getCurrentDomNode(editor: Editor & ReactEditor): HTMLElement | null {
6+
export function getCurrentDomNode(editor: SlateEditor): HTMLElement | null {
87
const [currentNode] = getCurrentNodeEntry(editor) || [];
98

109
if (!currentNode) {
1110
return null;
1211
}
1312

14-
return toDomNode(editor, currentNode);
13+
return toDOMNode(editor, currentNode) ?? null;
1514
}

‎packages/slate-commons/src/commands/getCurrentNodeEntry.ts

+4-4
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
1-
import type { NodeEntry } from 'slate';
2-
import { Editor } from 'slate';
1+
import type { TNodeEntry } from '@udecode/plate-common';
2+
import { getNodeEntry, type SlateEditor } from '@udecode/plate-common';
33

44
import { isSelectionValid } from './isSelectionValid';
55

6-
export function getCurrentNodeEntry(editor: Editor): NodeEntry | null {
6+
export function getCurrentNodeEntry(editor: SlateEditor): TNodeEntry | null {
77
if (!editor.selection || !isSelectionValid(editor)) {
88
return null;
99
}
1010

11-
return Editor.node(editor, editor.selection, { depth: 1 });
11+
return getNodeEntry(editor, editor.selection, { depth: 1 }) ?? null;
1212
}

‎packages/slate-commons/src/commands/getEditorRange.ts

+4-4
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,14 @@
1+
import type { SlateEditor } from '@udecode/plate-common';
12
import type { Range } from 'slate';
2-
import { Editor } from 'slate';
33

4-
export function getEditorRange(editor: Editor): Range | undefined {
4+
export function getEditorRange(editor: SlateEditor): Range | undefined {
55
// editor.children can sometimes be undefined, even though TypeScript says otherwise
66
if (!editor.children || editor.children.length === 0) {
77
return undefined;
88
}
99

1010
return {
11-
anchor: Editor.start(editor, [0]),
12-
focus: Editor.end(editor, [editor.children.length - 1]),
11+
anchor: editor.start([0]),
12+
focus: editor.end([editor.children.length - 1]),
1313
};
1414
}

‎packages/slate-commons/src/commands/getNodePath.ts

+4-4
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
1+
import type { SlateEditor } from '@udecode/plate-common';
12
import type { Path } from 'slate';
2-
import { Editor } from 'slate';
33

44
export function getNodePath(
5-
editor: Editor,
6-
options: NonNullable<Parameters<typeof Editor.nodes>[1]>,
5+
editor: SlateEditor,
6+
options: NonNullable<Parameters<typeof editor.nodes>[0]>,
77
): Path | null {
8-
const [entry] = Editor.nodes(editor, options);
8+
const [entry] = editor.nodes(options);
99
return entry ? entry[1] : null;
1010
}

‎packages/slate-commons/src/commands/getPrevChars.ts

+5-4
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,25 @@
1-
import { Editor, Path, Text } from 'slate';
1+
import type { SlateEditor } from '@udecode/plate-common';
2+
import { Path, Text } from 'slate';
23

34
import { isVoid } from './isVoid';
45

5-
export function getPrevChars(editor: Editor, length: number): string {
6+
export function getPrevChars(editor: SlateEditor, length: number): string {
67
const selection = editor.selection;
78

89
if (!selection) {
910
return '';
1011
}
1112

1213
const { focus } = selection;
13-
let text = Editor.string(editor, { focus, anchor: { path: focus.path, offset: 0 } });
14+
let text = editor.string({ focus, anchor: { path: focus.path, offset: 0 } });
1415

1516
if (text.length > length) {
1617
return text.slice(-length);
1718
}
1819

1920
const start = { path: [...Path.parent(focus.path), 0], offset: 0 };
2021

21-
const nodes = Editor.nodes(editor, {
22+
const nodes = editor.nodes({
2223
mode: 'lowest',
2324
at: { anchor: start, focus },
2425
reverse: true,

‎packages/slate-commons/src/commands/hasVoidElements.tsx

+3-2
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,10 @@
1-
import type { Node, Editor } from 'slate';
1+
import type { SlateEditor } from '@udecode/plate-common';
2+
import type { Node } from 'slate';
23
import { Text } from 'slate';
34

45
import { isVoid } from './isVoid';
56

6-
export function hasVoidElements(editor: Editor, node: Node): boolean {
7+
export function hasVoidElements(editor: SlateEditor, node: Node): boolean {
78
if (Text.isText(node)) {
89
return false;
910
}

‎packages/slate-commons/src/commands/index.ts

-3
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,6 @@ export {
2323
} from './isCursorOnEdgeOfContainer';
2424
export { isEmpty } from './isEmpty';
2525
export { isEmptyParagraphElement } from './isEmptyParagraphElement';
26-
export { isInline } from './isInline';
2726
export { isMarkActive } from './isMarkActive';
2827
export { isNodeEmpty } from './isNodeEmpty';
2928
export { isSelectionAtBlockEnd } from './isSelectionAtBlockEnd';
@@ -53,7 +52,5 @@ export {
5352
} from './roughly-normalize';
5453
export { saveSelection } from './saveSelection';
5554
export { selectNode } from './selectNode';
56-
export { toDomNode } from './toDomNode';
57-
export { toDomRange } from './toDomRange';
5855
export { toggleMark } from './toggleMark';
5956
export { unsetMark } from './unsetMark';

‎packages/slate-commons/src/commands/insertEmptyParagraph.ts

+4-4
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import type { ParagraphNode } from '@prezly/slate-types';
22
import { PARAGRAPH_NODE_TYPE } from '@prezly/slate-types';
3-
import type { Editor, Location } from 'slate';
4-
import { Transforms } from 'slate';
3+
import type { SlateEditor } from '@udecode/plate-common';
4+
import type { Location } from 'slate';
55

66
function createEmptyParagraph(): ParagraphNode {
77
return {
@@ -11,10 +11,10 @@ function createEmptyParagraph(): ParagraphNode {
1111
}
1212

1313
export function insertEmptyParagraph(
14-
editor: Editor,
14+
editor: SlateEditor,
1515
options: { at?: Location; select?: boolean } = {},
1616
): void {
1717
// Using `mode: 'highest' under assumption that "paragraph" can only be
1818
// at the root of the document.
19-
Transforms.insertNodes(editor, [createEmptyParagraph()], { ...options, mode: 'highest' });
19+
editor.insertNodes([createEmptyParagraph()], { ...options, mode: 'highest' });
2020
}

0 commit comments

Comments
 (0)