@openeditor/react 0.0.17 → 0.0.19
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/README.md +19 -0
- package/dist/index.d.ts +31 -3
- package/dist/index.js +32624 -129
- package/dist/index.js.map +1 -1
- package/package.json +6 -5
package/README.md
CHANGED
|
@@ -10,11 +10,30 @@ Pass `attachmentRuntime` to `useOpenEditorController` for editable attachments a
|
|
|
10
10
|
- `OpenEditorContent` for the editable Tiptap-backed content surface
|
|
11
11
|
- `OpenEditorViewer` for read-only React rendering
|
|
12
12
|
- `getDefaultSlashMenuItems` for UI packages that want the built-in insert actions
|
|
13
|
+
- position-based block targeting and transaction-backed copy, duplicate, move, and delete commands
|
|
13
14
|
- `defineOpenEditorReactNode` for consumer-owned React blocks
|
|
14
15
|
- `defineOpenEditorReactExtension` for advanced integrations that contribute multiple Tiptap extensions
|
|
15
16
|
|
|
16
17
|
This package intentionally does not import CSS and does not render styled menus. Use `@openeditor/ui` for the optional styled components.
|
|
17
18
|
|
|
19
|
+
## Block actions
|
|
20
|
+
|
|
21
|
+
`controller.blockTarget` identifies the top-level block under the pointer or the
|
|
22
|
+
active node selection. Mutating commands operate directly on ProseMirror
|
|
23
|
+
transactions, preserving history and avoiding whole-document replacement:
|
|
24
|
+
|
|
25
|
+
```tsx
|
|
26
|
+
controller.selectBlock(target);
|
|
27
|
+
await controller.copyBlock(target);
|
|
28
|
+
controller.duplicateBlock(target);
|
|
29
|
+
controller.deleteBlock(target);
|
|
30
|
+
```
|
|
31
|
+
|
|
32
|
+
Pass `blockActions` to contribute product-specific actions. The optional
|
|
33
|
+
`OpenEditorBlockMenu` from `@openeditor/ui` combines those contributions with
|
|
34
|
+
Copy, Duplicate, and Delete. Clipboard copies use a versioned OpenEditor block
|
|
35
|
+
envelope so blocks can move between independent editor instances and documents.
|
|
36
|
+
|
|
18
37
|
The built-in web catalog includes editable Toggle Lists, rich-content Callouts,
|
|
19
38
|
and Mermaid-powered Diagrams. Diagrams use `beautiful-mermaid` for synchronous,
|
|
20
39
|
themeable SVG rendering and retain their canonical Mermaid source in the document.
|
package/dist/index.d.ts
CHANGED
|
@@ -4,6 +4,7 @@ import { OpenEditorDocument, BlockSpec, ProseMirrorNode, OpenEditorAttachmentRun
|
|
|
4
4
|
import { toExportBundle, OpenEditorExporters } from '@openeditor/exporters';
|
|
5
5
|
export { seedDocument } from '@openeditor/extensions';
|
|
6
6
|
import { Editor, AnyExtension, NodeConfig } from '@tiptap/core';
|
|
7
|
+
export { DragHandle as OpenEditorDragHandle } from '@tiptap/extension-drag-handle-react';
|
|
7
8
|
import { ReactNodeViewProps } from '@tiptap/react';
|
|
8
9
|
export { NodeViewContent, NodeViewWrapper, ReactNodeViewProps as OpenEditorNodeViewProps } from '@tiptap/react';
|
|
9
10
|
|
|
@@ -46,6 +47,25 @@ type OpenEditorReactProps = {
|
|
|
46
47
|
slashMenuItems?: readonly OpenEditorSlashMenuItem[];
|
|
47
48
|
/** Consumer-owned blocks. Extension names and node types must be unique. */
|
|
48
49
|
extensions?: readonly OpenEditorReactExtension[];
|
|
50
|
+
blockActions?: readonly OpenEditorBlockAction[];
|
|
51
|
+
};
|
|
52
|
+
type OpenEditorBlockTarget = {
|
|
53
|
+
pos: number;
|
|
54
|
+
depth: number;
|
|
55
|
+
nodeType: string;
|
|
56
|
+
blockName?: string;
|
|
57
|
+
rect: OpenEditorOverlayRect;
|
|
58
|
+
};
|
|
59
|
+
type OpenEditorBlockActionContext = {
|
|
60
|
+
controller: OpenEditorController;
|
|
61
|
+
target: OpenEditorBlockTarget;
|
|
62
|
+
};
|
|
63
|
+
type OpenEditorBlockAction = {
|
|
64
|
+
id: string;
|
|
65
|
+
label: string;
|
|
66
|
+
group?: "edit" | "danger" | string;
|
|
67
|
+
disabled?: (context: OpenEditorBlockActionContext) => boolean;
|
|
68
|
+
run: (context: OpenEditorBlockActionContext) => void | Promise<void>;
|
|
49
69
|
};
|
|
50
70
|
type OpenEditorReactConfig = OpenEditorReactProps;
|
|
51
71
|
type OpenEditorController = {
|
|
@@ -78,6 +98,14 @@ type OpenEditorController = {
|
|
|
78
98
|
moveSelectedBlock: (direction: -1 | 1) => void;
|
|
79
99
|
duplicateSelectedBlock: () => void;
|
|
80
100
|
deleteSelectedBlock: () => void;
|
|
101
|
+
selectBlock: (target: OpenEditorBlockTarget) => void;
|
|
102
|
+
copyBlock: (target?: OpenEditorBlockTarget) => Promise<boolean>;
|
|
103
|
+
duplicateBlock: (target?: OpenEditorBlockTarget) => boolean;
|
|
104
|
+
deleteBlock: (target?: OpenEditorBlockTarget) => boolean;
|
|
105
|
+
moveBlock: (direction: -1 | 1, target?: OpenEditorBlockTarget) => boolean;
|
|
106
|
+
blockActions: readonly OpenEditorBlockAction[];
|
|
107
|
+
blockTarget: OpenEditorBlockTarget | null;
|
|
108
|
+
setBlockTargetAt: (pos: number | null) => void;
|
|
81
109
|
slashMenuItems: readonly OpenEditorSlashMenuItem[];
|
|
82
110
|
extensions: readonly OpenEditorReactExtension[];
|
|
83
111
|
pageRuntime?: OpenEditorPageRuntime;
|
|
@@ -168,10 +196,10 @@ declare module "@tiptap/core" {
|
|
|
168
196
|
}
|
|
169
197
|
}
|
|
170
198
|
declare const formatAttachmentSize: (size: number | null) => string;
|
|
171
|
-
declare const useOpenEditorController: ({ initialDocument, editable, placeholder, onChange, onFilePasteDrop, pageRuntime, attachmentRuntime, slashMenuItems, extensions, }?: OpenEditorReactProps) => OpenEditorController;
|
|
199
|
+
declare const useOpenEditorController: ({ initialDocument, editable, placeholder, onChange, onFilePasteDrop, pageRuntime, attachmentRuntime, slashMenuItems, extensions, blockActions, }?: OpenEditorReactProps) => OpenEditorController;
|
|
172
200
|
declare const getDefaultSlashMenuItems: (controller: OpenEditorController) => OpenEditorSlashMenuItem[];
|
|
173
201
|
declare const OpenEditorContent: ({ controller, className, }: OpenEditorContentProps) => react.JSX.Element;
|
|
174
202
|
declare const OpenEditorViewer: ({ document, className, renderers, extensions, pageRuntime, attachmentRuntime, }: OpenEditorViewerProps) => react.JSX.Element;
|
|
175
|
-
declare const useOpenEditor: ({ initialDocument, editable, placeholder, onChange, onFilePasteDrop, pageRuntime, attachmentRuntime, slashMenuItems, extensions, }?: OpenEditorReactProps) => OpenEditorController;
|
|
203
|
+
declare const useOpenEditor: ({ initialDocument, editable, placeholder, onChange, onFilePasteDrop, pageRuntime, attachmentRuntime, slashMenuItems, extensions, blockActions, }?: OpenEditorReactProps) => OpenEditorController;
|
|
176
204
|
|
|
177
|
-
export { type InsertRange, OpenEditorContent, type OpenEditorContentProps, type OpenEditorController, type OpenEditorExtensionMenu, type OpenEditorOverlayRect, type OpenEditorPageRuntime, type OpenEditorPageSnapshot, type OpenEditorReactConfig, type OpenEditorReactExtension, type OpenEditorReactNodeExtension, type OpenEditorReactProps, type OpenEditorSlashMenuItem, type OpenEditorTheme, OpenEditorThemeProvider, type OpenEditorThemeStyle, type OpenEditorThemeToken, OpenEditorViewer, type OpenEditorViewerProps, type OpenEditorViewerRenderer, type SelectionBubbleState, type SlashState, createOpenEditorThemeStyle, defineOpenEditorReactExtension, defineOpenEditorReactNode, formatAttachmentSize, getDefaultSlashMenuItems, openEditorThemeTokenNames, useOpenEditor, useOpenEditorController, useOpenEditorThemeStyle };
|
|
205
|
+
export { type InsertRange, type OpenEditorBlockAction, type OpenEditorBlockActionContext, type OpenEditorBlockTarget, OpenEditorContent, type OpenEditorContentProps, type OpenEditorController, type OpenEditorExtensionMenu, type OpenEditorOverlayRect, type OpenEditorPageRuntime, type OpenEditorPageSnapshot, type OpenEditorReactConfig, type OpenEditorReactExtension, type OpenEditorReactNodeExtension, type OpenEditorReactProps, type OpenEditorSlashMenuItem, type OpenEditorTheme, OpenEditorThemeProvider, type OpenEditorThemeStyle, type OpenEditorThemeToken, OpenEditorViewer, type OpenEditorViewerProps, type OpenEditorViewerRenderer, type SelectionBubbleState, type SlashState, createOpenEditorThemeStyle, defineOpenEditorReactExtension, defineOpenEditorReactNode, formatAttachmentSize, getDefaultSlashMenuItems, openEditorThemeTokenNames, useOpenEditor, useOpenEditorController, useOpenEditorThemeStyle };
|