@postnzt/docx-js-editor 0.0.33
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/dist/ClipboardManager-C0rTRkVQ.d.ts +464 -0
- package/dist/ClipboardManager-CgpKW2At.d.mts +464 -0
- package/dist/DocumentAgent-BqA9EJ3F.d.mts +442 -0
- package/dist/DocumentAgent-CRCXiBT7.d.ts +442 -0
- package/dist/FindReplaceDialog-KNJETYJX.js +1 -0
- package/dist/FindReplaceDialog-YW3R4FHM.mjs +1 -0
- package/dist/FootnotePropertiesDialog-452A4UT5.js +1 -0
- package/dist/FootnotePropertiesDialog-H24AC5XK.mjs +1 -0
- package/dist/HyperlinkDialog-GBAYMTUE.js +1 -0
- package/dist/HyperlinkDialog-HNYTXDCB.mjs +1 -0
- package/dist/ImagePositionDialog-B4RLP2W5.mjs +1 -0
- package/dist/ImagePositionDialog-M65BYQQE.js +1 -0
- package/dist/ImagePropertiesDialog-JOGW3WDU.mjs +1 -0
- package/dist/ImagePropertiesDialog-O4WQSF5M.js +1 -0
- package/dist/PageSetupDialog-2GIBTKMJ.js +1 -0
- package/dist/PageSetupDialog-Q7SHEZIJ.mjs +1 -0
- package/dist/TablePropertiesDialog-LMXWX3FI.mjs +1 -0
- package/dist/TablePropertiesDialog-WOZ4ES3H.js +1 -0
- package/dist/agentApi-BVHzyk2l.d.mts +2239 -0
- package/dist/agentApi-BVHzyk2l.d.ts +2239 -0
- package/dist/chunk-2HDYCD2Q.mjs +1 -0
- package/dist/chunk-377ZVTSE.js +2 -0
- package/dist/chunk-37SLIJPH.mjs +58 -0
- package/dist/chunk-4VUZBV2S.js +1 -0
- package/dist/chunk-6WPRCJ5A.mjs +1 -0
- package/dist/chunk-7MGFEP2R.mjs +26 -0
- package/dist/chunk-7QTNB64A.mjs +9 -0
- package/dist/chunk-AARNCPWR.js +1 -0
- package/dist/chunk-AU5NVRHP.js +2 -0
- package/dist/chunk-BP3V2HDD.js +261 -0
- package/dist/chunk-BUEMG4NW.js +1 -0
- package/dist/chunk-DC65PJYE.js +4 -0
- package/dist/chunk-DLVLK5FT.mjs +24 -0
- package/dist/chunk-EV3CM6TU.js +1 -0
- package/dist/chunk-FVUGBRDD.js +1 -0
- package/dist/chunk-GZOCOWWB.mjs +2 -0
- package/dist/chunk-H5NTJZO4.js +1 -0
- package/dist/chunk-IFPN3NT3.js +3 -0
- package/dist/chunk-KCOGY3V2.js +10 -0
- package/dist/chunk-KUL2SDYC.js +26 -0
- package/dist/chunk-LFZXSNOF.mjs +261 -0
- package/dist/chunk-LYBG4YI7.mjs +1 -0
- package/dist/chunk-M5F4SK3W.mjs +1 -0
- package/dist/chunk-P7WEP4JU.js +9 -0
- package/dist/chunk-PB7VMDDP.js +24 -0
- package/dist/chunk-QAZ4233N.mjs +1 -0
- package/dist/chunk-QSUPYUOP.js +2 -0
- package/dist/chunk-QTSXJRP6.mjs +1 -0
- package/dist/chunk-QVPR2W5S.js +1 -0
- package/dist/chunk-RTFUE3KK.mjs +10 -0
- package/dist/chunk-SCYTWBF5.mjs +111 -0
- package/dist/chunk-SE5EN2QL.js +1 -0
- package/dist/chunk-T6X4C2QO.js +111 -0
- package/dist/chunk-TAUMSKRE.mjs +1 -0
- package/dist/chunk-W53SI3XW.mjs +1 -0
- package/dist/chunk-WOHFANC5.mjs +3 -0
- package/dist/chunk-X5A54T6S.mjs +4 -0
- package/dist/chunk-YKBSKEBS.mjs +2 -0
- package/dist/chunk-Z26WOH6R.mjs +2 -0
- package/dist/chunk-ZJNGMDRE.js +58 -0
- package/dist/clipboard-Cu80iVDh.d.ts +1181 -0
- package/dist/clipboard-dFROLI95.d.mts +1181 -0
- package/dist/colorResolver-BwI_Uxp3.d.mts +662 -0
- package/dist/colorResolver-Dlmk3itT.d.ts +662 -0
- package/dist/core-plugins-reexport.d.mts +31 -0
- package/dist/core-plugins-reexport.d.ts +31 -0
- package/dist/core-plugins-reexport.js +1 -0
- package/dist/core-plugins-reexport.mjs +1 -0
- package/dist/core-reexport.d.mts +309 -0
- package/dist/core-reexport.d.ts +309 -0
- package/dist/core-reexport.js +1 -0
- package/dist/core-reexport.mjs +1 -0
- package/dist/executor-L2MVKMXO.js +1 -0
- package/dist/executor-XKBCCVNY.mjs +1 -0
- package/dist/fontLoader-BI9ZoACv.d.ts +176 -0
- package/dist/fontLoader-DicgJidU.d.mts +176 -0
- package/dist/headless-reexport.d.mts +195 -0
- package/dist/headless-reexport.d.ts +195 -0
- package/dist/headless-reexport.js +4 -0
- package/dist/headless-reexport.mjs +4 -0
- package/dist/index.css +1 -0
- package/dist/index.d.mts +480 -0
- package/dist/index.d.ts +480 -0
- package/dist/index.js +112 -0
- package/dist/index.mjs +112 -0
- package/dist/lib-BCT2DRYI.mjs +1 -0
- package/dist/lib-U35UU4OU.js +1 -0
- package/dist/mcp-reexport.d.mts +156 -0
- package/dist/mcp-reexport.d.ts +156 -0
- package/dist/mcp-reexport.js +16 -0
- package/dist/mcp-reexport.mjs +16 -0
- package/dist/processTemplate-5ZST2Q5L.js +1 -0
- package/dist/processTemplate-LRHXOWMZ.mjs +1 -0
- package/dist/react-Cl2n0F5S.d.ts +1091 -0
- package/dist/react-DZlAKNXg.d.mts +1091 -0
- package/dist/react.css +1 -0
- package/dist/react.d.mts +10 -0
- package/dist/react.d.ts +10 -0
- package/dist/react.js +1 -0
- package/dist/react.mjs +1 -0
- package/dist/registry-D4FQ9aKX.d.mts +165 -0
- package/dist/registry-DrYyUXQr.d.ts +165 -0
- package/dist/selectionRects-DEX5THEG.js +1 -0
- package/dist/selectionRects-SQTAHMCH.mjs +1 -0
- package/dist/styles.css +1 -0
- package/dist/types-B3LkfO0u.d.mts +310 -0
- package/dist/types-igZ1x_e4.d.ts +310 -0
- package/dist/ui.d.mts +2005 -0
- package/dist/ui.d.ts +2005 -0
- package/dist/ui.js +1 -0
- package/dist/ui.mjs +1 -0
- package/dist/variableDetector-CIqTek7A.d.mts +204 -0
- package/dist/variableDetector-CkYvLv62.d.ts +204 -0
- package/i18n/de.json +745 -0
- package/i18n/en.json +745 -0
- package/i18n/pl.json +745 -0
- package/package.json +127 -0
|
@@ -0,0 +1,1091 @@
|
|
|
1
|
+
import * as React$1 from 'react';
|
|
2
|
+
import React__default, { ReactNode, CSSProperties as CSSProperties$1, Component, ErrorInfo } from 'react';
|
|
3
|
+
import * as prosemirror_view from 'prosemirror-view';
|
|
4
|
+
import { EditorView } from 'prosemirror-view';
|
|
5
|
+
import * as prosemirror_state from 'prosemirror-state';
|
|
6
|
+
import { EditorState, Transaction } from 'prosemirror-state';
|
|
7
|
+
import { T as TextFormatting, K as ParagraphFormatting, D as Document, a3 as Theme, C as Comment, e as Table } from './agentApi-BVHzyk2l.js';
|
|
8
|
+
import { F as SidebarItem, g as EditorPluginCore, k as PluginPanelProps, R as RenderedDomContext, G as SidebarItemContext, f as EditorHandle, h as ErrorNotification, m as SavedDocumentData, d as AutoSaveStatus, e as ClipboardSelection } from './ClipboardManager-C0rTRkVQ.js';
|
|
9
|
+
import { g as PrintOptions, T as Translations, j as TableContext, i as TableAction, P as ParsedClipboardContent } from './clipboard-Cu80iVDh.js';
|
|
10
|
+
import { g as DocxInput, D as DocumentAgent } from './DocumentAgent-CRCXiBT7.js';
|
|
11
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
12
|
+
|
|
13
|
+
/**
|
|
14
|
+
* React Plugin Interface for the DOCX Editor
|
|
15
|
+
*
|
|
16
|
+
* Extends the framework-agnostic EditorPluginCore with React-specific
|
|
17
|
+
* UI rendering capabilities (Panel component, renderOverlay).
|
|
18
|
+
*/
|
|
19
|
+
|
|
20
|
+
/**
|
|
21
|
+
* React-specific editor plugin interface.
|
|
22
|
+
*
|
|
23
|
+
* Extends EditorPluginCore with:
|
|
24
|
+
* - Panel: React component for rendering in the annotation panel
|
|
25
|
+
* - renderOverlay: Function returning ReactNode for overlay rendering
|
|
26
|
+
*/
|
|
27
|
+
/**
|
|
28
|
+
* Render props passed to each sidebar item.
|
|
29
|
+
*/
|
|
30
|
+
interface SidebarItemRenderProps {
|
|
31
|
+
/** Whether this item is currently expanded/active. */
|
|
32
|
+
isExpanded: boolean;
|
|
33
|
+
/** Toggle expand/collapse for this item. */
|
|
34
|
+
onToggleExpand: () => void;
|
|
35
|
+
/** Ref callback to measure the rendered card height. */
|
|
36
|
+
measureRef: (el: HTMLDivElement | null) => void;
|
|
37
|
+
}
|
|
38
|
+
/**
|
|
39
|
+
* A sidebar item with React rendering, anchored to a document position.
|
|
40
|
+
*/
|
|
41
|
+
interface ReactSidebarItem extends SidebarItem {
|
|
42
|
+
/** Render the card content. */
|
|
43
|
+
render: (props: SidebarItemRenderProps) => ReactNode;
|
|
44
|
+
/** Estimated height in pixels (for pre-layout before measurement). Default: 40. */
|
|
45
|
+
estimatedHeight?: number;
|
|
46
|
+
}
|
|
47
|
+
interface ReactEditorPlugin<TState = any> extends EditorPluginCore<TState> {
|
|
48
|
+
/**
|
|
49
|
+
* React component to render in the annotation panel area.
|
|
50
|
+
* Receives editor state and callbacks for interaction.
|
|
51
|
+
*/
|
|
52
|
+
Panel?: React.ComponentType<PluginPanelProps<TState>>;
|
|
53
|
+
/**
|
|
54
|
+
* Render an overlay on top of the rendered pages.
|
|
55
|
+
* Use this for highlights, annotations, or other visual elements
|
|
56
|
+
* that need to be positioned relative to the document content.
|
|
57
|
+
*/
|
|
58
|
+
renderOverlay?: (context: RenderedDomContext, state: TState, editorView: EditorView | null) => ReactNode;
|
|
59
|
+
/**
|
|
60
|
+
* Provide sidebar items anchored to document positions.
|
|
61
|
+
* Called whenever plugin state changes.
|
|
62
|
+
* Items from all plugins are merged and laid out together in a unified sidebar.
|
|
63
|
+
*/
|
|
64
|
+
getSidebarItems?: (state: TState, context: SidebarItemContext) => ReactSidebarItem[];
|
|
65
|
+
}
|
|
66
|
+
/**
|
|
67
|
+
* Backwards-compatible alias — EditorPlugin is now ReactEditorPlugin.
|
|
68
|
+
*/
|
|
69
|
+
type EditorPlugin<TState = any> = ReactEditorPlugin<TState>;
|
|
70
|
+
/**
|
|
71
|
+
* Context value provided to plugins and panels.
|
|
72
|
+
*/
|
|
73
|
+
interface PluginContext {
|
|
74
|
+
/** All registered plugins */
|
|
75
|
+
plugins: EditorPlugin[];
|
|
76
|
+
/** Current editor view */
|
|
77
|
+
editorView: EditorView | null;
|
|
78
|
+
/** Set the editor view (called by editor on mount) */
|
|
79
|
+
setEditorView: (view: EditorView | null) => void;
|
|
80
|
+
/** Get plugin state by plugin ID */
|
|
81
|
+
getPluginState: <T>(pluginId: string) => T | undefined;
|
|
82
|
+
/** Update plugin state */
|
|
83
|
+
setPluginState: <T>(pluginId: string, state: T) => void;
|
|
84
|
+
/** Scroll to a position in the editor */
|
|
85
|
+
scrollToPosition: (pos: number) => void;
|
|
86
|
+
/** Select a range in the editor */
|
|
87
|
+
selectRange: (from: number, to: number) => void;
|
|
88
|
+
}
|
|
89
|
+
/**
|
|
90
|
+
* Props for the PluginHost component.
|
|
91
|
+
*/
|
|
92
|
+
interface PluginHostProps {
|
|
93
|
+
/** Plugins to enable */
|
|
94
|
+
plugins: EditorPlugin[];
|
|
95
|
+
/** The editor component (passed as child) */
|
|
96
|
+
children: React.ReactElement;
|
|
97
|
+
/** Class name for the host container */
|
|
98
|
+
className?: string;
|
|
99
|
+
}
|
|
100
|
+
/**
|
|
101
|
+
* Ref interface for the PluginHost component.
|
|
102
|
+
*/
|
|
103
|
+
interface PluginHostRef {
|
|
104
|
+
/** Get plugin state by plugin ID */
|
|
105
|
+
getPluginState: <T>(pluginId: string) => T | undefined;
|
|
106
|
+
/** Update plugin state for a plugin */
|
|
107
|
+
setPluginState: <T>(pluginId: string, state: T) => void;
|
|
108
|
+
/** Get the current editor view */
|
|
109
|
+
getEditorView: () => EditorView | null;
|
|
110
|
+
/** Force a refresh of all plugin states */
|
|
111
|
+
refreshPluginStates: () => void;
|
|
112
|
+
}
|
|
113
|
+
|
|
114
|
+
/**
|
|
115
|
+
* Selection State Utilities
|
|
116
|
+
*
|
|
117
|
+
* Extracts selection state from ProseMirror for toolbar integration.
|
|
118
|
+
*/
|
|
119
|
+
|
|
120
|
+
/**
|
|
121
|
+
* Selection state for toolbar integration
|
|
122
|
+
*/
|
|
123
|
+
interface SelectionState {
|
|
124
|
+
/** Whether there's an active selection (not just cursor) */
|
|
125
|
+
hasSelection: boolean;
|
|
126
|
+
/** Whether selection spans multiple paragraphs */
|
|
127
|
+
isMultiParagraph: boolean;
|
|
128
|
+
/** Current text formatting at selection/cursor */
|
|
129
|
+
textFormatting: TextFormatting;
|
|
130
|
+
/** Current paragraph formatting */
|
|
131
|
+
paragraphFormatting: ParagraphFormatting;
|
|
132
|
+
/** Current paragraph style ID (e.g., 'Heading1', 'Normal') */
|
|
133
|
+
styleId: string | null;
|
|
134
|
+
/** Start paragraph index */
|
|
135
|
+
startParagraphIndex: number;
|
|
136
|
+
/** End paragraph index */
|
|
137
|
+
endParagraphIndex: number;
|
|
138
|
+
}
|
|
139
|
+
|
|
140
|
+
/**
|
|
141
|
+
* Layout Engine Types
|
|
142
|
+
*
|
|
143
|
+
* Core types for the paginated layout engine.
|
|
144
|
+
* Converts document blocks + measurements into positioned fragments on pages.
|
|
145
|
+
*/
|
|
146
|
+
/**
|
|
147
|
+
* Unique identifier for a block in the document.
|
|
148
|
+
* Format: typically `${index}-${type}` or just the block index.
|
|
149
|
+
*/
|
|
150
|
+
type BlockId = string | number;
|
|
151
|
+
/**
|
|
152
|
+
* Base fragment properties common to all fragment types.
|
|
153
|
+
*/
|
|
154
|
+
type FragmentBase = {
|
|
155
|
+
/** Block ID this fragment belongs to. */
|
|
156
|
+
blockId: BlockId;
|
|
157
|
+
/** X position on page (relative to page left). */
|
|
158
|
+
x: number;
|
|
159
|
+
/** Y position on page (relative to page top). */
|
|
160
|
+
y: number;
|
|
161
|
+
/** Width of the fragment. */
|
|
162
|
+
width: number;
|
|
163
|
+
/** ProseMirror start position (for click mapping). */
|
|
164
|
+
pmStart?: number;
|
|
165
|
+
/** ProseMirror end position (for click mapping). */
|
|
166
|
+
pmEnd?: number;
|
|
167
|
+
};
|
|
168
|
+
/**
|
|
169
|
+
* A paragraph fragment positioned on a page.
|
|
170
|
+
* May span only part of the paragraph's lines if split across pages.
|
|
171
|
+
*/
|
|
172
|
+
type ParagraphFragment = FragmentBase & {
|
|
173
|
+
kind: 'paragraph';
|
|
174
|
+
/** First line index (inclusive) from the measure. */
|
|
175
|
+
fromLine: number;
|
|
176
|
+
/** Last line index (exclusive) from the measure. */
|
|
177
|
+
toLine: number;
|
|
178
|
+
/** Height of this fragment. */
|
|
179
|
+
height: number;
|
|
180
|
+
/** True if this continues from a previous page. */
|
|
181
|
+
continuesFromPrev?: boolean;
|
|
182
|
+
/** True if this continues onto the next page. */
|
|
183
|
+
continuesOnNext?: boolean;
|
|
184
|
+
};
|
|
185
|
+
/**
|
|
186
|
+
* A table fragment positioned on a page.
|
|
187
|
+
* May span only part of the table's rows if split across pages.
|
|
188
|
+
*/
|
|
189
|
+
type TableFragment = FragmentBase & {
|
|
190
|
+
kind: 'table';
|
|
191
|
+
/** First row index (inclusive). */
|
|
192
|
+
fromRow: number;
|
|
193
|
+
/** Last row index (exclusive). */
|
|
194
|
+
toRow: number;
|
|
195
|
+
/** Height of this fragment. */
|
|
196
|
+
height: number;
|
|
197
|
+
/** True if this is a floating table. */
|
|
198
|
+
isFloating?: boolean;
|
|
199
|
+
/** True if this continues from a previous page. */
|
|
200
|
+
continuesFromPrev?: boolean;
|
|
201
|
+
/** True if this continues onto the next page. */
|
|
202
|
+
continuesOnNext?: boolean;
|
|
203
|
+
/** Number of header rows prepended to this continuation fragment (0 or undefined for first fragment). */
|
|
204
|
+
headerRowCount?: number;
|
|
205
|
+
};
|
|
206
|
+
/**
|
|
207
|
+
* An image fragment positioned on a page.
|
|
208
|
+
*/
|
|
209
|
+
type ImageFragment = FragmentBase & {
|
|
210
|
+
kind: 'image';
|
|
211
|
+
/** Height of the image. */
|
|
212
|
+
height: number;
|
|
213
|
+
/** True if this is an anchored/floating image. */
|
|
214
|
+
isAnchored?: boolean;
|
|
215
|
+
/** Z-index for layering. */
|
|
216
|
+
zIndex?: number;
|
|
217
|
+
};
|
|
218
|
+
/**
|
|
219
|
+
* A text box fragment positioned on a page.
|
|
220
|
+
*/
|
|
221
|
+
type TextBoxFragment = FragmentBase & {
|
|
222
|
+
kind: 'textBox';
|
|
223
|
+
/** Height of the text box. */
|
|
224
|
+
height: number;
|
|
225
|
+
};
|
|
226
|
+
/**
|
|
227
|
+
* Union of all fragment types.
|
|
228
|
+
*/
|
|
229
|
+
type Fragment = ParagraphFragment | TableFragment | ImageFragment | TextBoxFragment;
|
|
230
|
+
/**
|
|
231
|
+
* Page margin configuration.
|
|
232
|
+
*/
|
|
233
|
+
type PageMargins = {
|
|
234
|
+
top: number;
|
|
235
|
+
right: number;
|
|
236
|
+
bottom: number;
|
|
237
|
+
left: number;
|
|
238
|
+
/** Distance from page top to header content. */
|
|
239
|
+
header?: number;
|
|
240
|
+
/** Distance from page bottom to footer content. */
|
|
241
|
+
footer?: number;
|
|
242
|
+
};
|
|
243
|
+
/**
|
|
244
|
+
* A rendered page containing positioned fragments.
|
|
245
|
+
*/
|
|
246
|
+
type Page = {
|
|
247
|
+
/** Page number (1-indexed). */
|
|
248
|
+
number: number;
|
|
249
|
+
/** Fragments positioned on this page. */
|
|
250
|
+
fragments: Fragment[];
|
|
251
|
+
/** Page margins. */
|
|
252
|
+
margins: PageMargins;
|
|
253
|
+
/** Page size (width, height). */
|
|
254
|
+
size: {
|
|
255
|
+
w: number;
|
|
256
|
+
h: number;
|
|
257
|
+
};
|
|
258
|
+
/** Page orientation. */
|
|
259
|
+
orientation?: 'portrait' | 'landscape';
|
|
260
|
+
/** Section index this page belongs to. */
|
|
261
|
+
sectionIndex?: number;
|
|
262
|
+
/** Header/footer references for this page. */
|
|
263
|
+
headerFooterRefs?: {
|
|
264
|
+
headerDefault?: string;
|
|
265
|
+
headerFirst?: string;
|
|
266
|
+
headerEven?: string;
|
|
267
|
+
footerDefault?: string;
|
|
268
|
+
footerFirst?: string;
|
|
269
|
+
footerEven?: string;
|
|
270
|
+
};
|
|
271
|
+
/** Footnote IDs that appear on this page (for rendering). */
|
|
272
|
+
footnoteIds?: number[];
|
|
273
|
+
/** Height reserved for the footnote area at page bottom (pixels). */
|
|
274
|
+
footnoteReservedHeight?: number;
|
|
275
|
+
/** Column layout for this page (if multi-column). */
|
|
276
|
+
columns?: ColumnLayout;
|
|
277
|
+
};
|
|
278
|
+
/**
|
|
279
|
+
* Column layout configuration.
|
|
280
|
+
*/
|
|
281
|
+
type ColumnLayout = {
|
|
282
|
+
count: number;
|
|
283
|
+
gap: number;
|
|
284
|
+
equalWidth?: boolean;
|
|
285
|
+
/** Draw vertical separator line between columns (w:sep). */
|
|
286
|
+
separator?: boolean;
|
|
287
|
+
};
|
|
288
|
+
/**
|
|
289
|
+
* Header/footer layout for a specific type.
|
|
290
|
+
*/
|
|
291
|
+
type HeaderFooterLayout = {
|
|
292
|
+
height: number;
|
|
293
|
+
fragments: Fragment[];
|
|
294
|
+
};
|
|
295
|
+
/**
|
|
296
|
+
* Final layout output ready for rendering/painting.
|
|
297
|
+
*/
|
|
298
|
+
type Layout = {
|
|
299
|
+
/** Default page size for the document. */
|
|
300
|
+
pageSize: {
|
|
301
|
+
w: number;
|
|
302
|
+
h: number;
|
|
303
|
+
};
|
|
304
|
+
/** All rendered pages with positioned fragments. */
|
|
305
|
+
pages: Page[];
|
|
306
|
+
/** Column configuration (if multi-column). */
|
|
307
|
+
columns?: ColumnLayout;
|
|
308
|
+
/** Header layouts by type (default, first, even). */
|
|
309
|
+
headers?: Record<string, HeaderFooterLayout>;
|
|
310
|
+
/** Footer layouts by type (default, first, even). */
|
|
311
|
+
footers?: Record<string, HeaderFooterLayout>;
|
|
312
|
+
/** Gap between pages in pixels (for rendering). */
|
|
313
|
+
pageGap?: number;
|
|
314
|
+
};
|
|
315
|
+
|
|
316
|
+
interface PagedEditorRef {
|
|
317
|
+
/** Get the current document. */
|
|
318
|
+
getDocument(): Document | null;
|
|
319
|
+
/** Get the ProseMirror EditorState. */
|
|
320
|
+
getState(): EditorState | null;
|
|
321
|
+
/** Get the ProseMirror EditorView. */
|
|
322
|
+
getView(): EditorView | null;
|
|
323
|
+
/** Focus the editor. */
|
|
324
|
+
focus(): void;
|
|
325
|
+
/** Blur the editor. */
|
|
326
|
+
blur(): void;
|
|
327
|
+
/** Check if focused. */
|
|
328
|
+
isFocused(): boolean;
|
|
329
|
+
/** Dispatch a transaction. */
|
|
330
|
+
dispatch(tr: Transaction): void;
|
|
331
|
+
/** Undo. */
|
|
332
|
+
undo(): boolean;
|
|
333
|
+
/** Redo. */
|
|
334
|
+
redo(): boolean;
|
|
335
|
+
/** Set selection by PM position. */
|
|
336
|
+
setSelection(anchor: number, head?: number): void;
|
|
337
|
+
/** Get current layout. */
|
|
338
|
+
getLayout(): Layout | null;
|
|
339
|
+
/** Force re-layout. */
|
|
340
|
+
relayout(): void;
|
|
341
|
+
/** Scroll the visible pages to bring a PM position into view. */
|
|
342
|
+
scrollToPosition(pmPos: number): void;
|
|
343
|
+
}
|
|
344
|
+
|
|
345
|
+
/**
|
|
346
|
+
* DocxEditor props
|
|
347
|
+
*/
|
|
348
|
+
interface DocxEditorProps {
|
|
349
|
+
/** Document data — ArrayBuffer, Uint8Array, Blob, or File */
|
|
350
|
+
documentBuffer?: DocxInput | null;
|
|
351
|
+
/** Pre-parsed document (alternative to documentBuffer) */
|
|
352
|
+
document?: Document | null;
|
|
353
|
+
/** Callback when document is saved */
|
|
354
|
+
onSave?: (buffer: ArrayBuffer) => void;
|
|
355
|
+
/** Author name used for comments and track changes */
|
|
356
|
+
author?: string;
|
|
357
|
+
/** Callback when document changes */
|
|
358
|
+
onChange?: (document: Document) => void;
|
|
359
|
+
/** Callback when selection changes */
|
|
360
|
+
onSelectionChange?: (state: SelectionState | null) => void;
|
|
361
|
+
/** Callback on error */
|
|
362
|
+
onError?: (error: Error) => void;
|
|
363
|
+
/** Callback when fonts are loaded */
|
|
364
|
+
onFontsLoaded?: () => void;
|
|
365
|
+
/** External ProseMirror plugins (from PluginHost) */
|
|
366
|
+
externalPlugins?: prosemirror_state.Plugin[];
|
|
367
|
+
/** Callback when editor view is ready (for PluginHost) */
|
|
368
|
+
onEditorViewReady?: (view: prosemirror_view.EditorView) => void;
|
|
369
|
+
/** Theme for styling */
|
|
370
|
+
theme?: Theme | null;
|
|
371
|
+
/** Whether to show toolbar (default: true) */
|
|
372
|
+
showToolbar?: boolean;
|
|
373
|
+
/** Whether to show zoom control (default: true) */
|
|
374
|
+
showZoomControl?: boolean;
|
|
375
|
+
/** Whether to show page margin guides/boundaries (default: false) */
|
|
376
|
+
showMarginGuides?: boolean;
|
|
377
|
+
/** Color for margin guides (default: '#c0c0c0') */
|
|
378
|
+
marginGuideColor?: string;
|
|
379
|
+
/** Whether to show horizontal ruler (default: false) */
|
|
380
|
+
showRuler?: boolean;
|
|
381
|
+
/** Unit for ruler display (default: 'inch') */
|
|
382
|
+
rulerUnit?: 'inch' | 'cm';
|
|
383
|
+
/** Initial zoom level (default: 1.0) */
|
|
384
|
+
initialZoom?: number;
|
|
385
|
+
/** Whether the editor is read-only. When true, hides toolbar and rulers */
|
|
386
|
+
readOnly?: boolean;
|
|
387
|
+
/** Custom toolbar actions */
|
|
388
|
+
toolbarExtra?: ReactNode;
|
|
389
|
+
/** Additional CSS class name */
|
|
390
|
+
className?: string;
|
|
391
|
+
/** Additional inline styles */
|
|
392
|
+
style?: CSSProperties$1;
|
|
393
|
+
/** Placeholder when no document */
|
|
394
|
+
placeholder?: ReactNode;
|
|
395
|
+
/** Loading indicator */
|
|
396
|
+
loadingIndicator?: ReactNode;
|
|
397
|
+
/** Whether to show the document outline sidebar (default: false) */
|
|
398
|
+
showOutline?: boolean;
|
|
399
|
+
/** Whether to show the floating outline toggle button (default: true) */
|
|
400
|
+
showOutlineButton?: boolean;
|
|
401
|
+
/** Whether to show print button in toolbar (default: true) */
|
|
402
|
+
showPrintButton?: boolean;
|
|
403
|
+
/** Print options for print preview */
|
|
404
|
+
printOptions?: PrintOptions;
|
|
405
|
+
/** Callback when print is triggered */
|
|
406
|
+
onPrint?: () => void;
|
|
407
|
+
/** Callback when content is copied */
|
|
408
|
+
onCopy?: () => void;
|
|
409
|
+
/** Callback when content is cut */
|
|
410
|
+
onCut?: () => void;
|
|
411
|
+
/** Callback when content is pasted */
|
|
412
|
+
onPaste?: () => void;
|
|
413
|
+
/** Editor mode: 'editing' (direct edits), 'suggesting' (track changes), or 'viewing' (read-only). Default: 'editing' */
|
|
414
|
+
mode?: EditorMode;
|
|
415
|
+
/** Callback when the editing mode changes */
|
|
416
|
+
onModeChange?: (mode: EditorMode) => void;
|
|
417
|
+
/** Callback when a comment is added via the UI */
|
|
418
|
+
onCommentAdd?: (comment: Comment) => void;
|
|
419
|
+
/** Callback when a comment is resolved via the UI */
|
|
420
|
+
onCommentResolve?: (comment: Comment) => void;
|
|
421
|
+
/** Callback when a comment is deleted via the UI */
|
|
422
|
+
onCommentDelete?: (comment: Comment) => void;
|
|
423
|
+
/** Callback when a reply is added to a comment via the UI */
|
|
424
|
+
onCommentReply?: (reply: Comment, parent: Comment) => void;
|
|
425
|
+
/**
|
|
426
|
+
* Callback when rendered DOM context is ready (for plugin overlays).
|
|
427
|
+
* Used by PluginHost to get access to the rendered page DOM for positioning.
|
|
428
|
+
*/
|
|
429
|
+
onRenderedDomContextReady?: (context: RenderedDomContext) => void;
|
|
430
|
+
/**
|
|
431
|
+
* Plugin overlays to render inside the editor viewport.
|
|
432
|
+
* Passed from PluginHost to render plugin-specific overlays.
|
|
433
|
+
*/
|
|
434
|
+
pluginOverlays?: ReactNode;
|
|
435
|
+
/** Sidebar items from plugins (passed from PluginHost). */
|
|
436
|
+
pluginSidebarItems?: ReactSidebarItem[];
|
|
437
|
+
/** Rendered DOM context from PluginHost (for sidebar position resolution). */
|
|
438
|
+
pluginRenderedDomContext?: RenderedDomContext | null;
|
|
439
|
+
/** Custom logo/icon for the title bar */
|
|
440
|
+
renderLogo?: () => ReactNode;
|
|
441
|
+
/** Document name shown in the title bar */
|
|
442
|
+
documentName?: string;
|
|
443
|
+
/** Callback when document name changes */
|
|
444
|
+
onDocumentNameChange?: (name: string) => void;
|
|
445
|
+
/** Whether the document name is editable (default: true) */
|
|
446
|
+
documentNameEditable?: boolean;
|
|
447
|
+
/** Custom right-side actions for the title bar */
|
|
448
|
+
renderTitleBarRight?: () => ReactNode;
|
|
449
|
+
/** Translation overrides. Import a locale JSON file and pass it directly. */
|
|
450
|
+
i18n?: Translations;
|
|
451
|
+
}
|
|
452
|
+
/**
|
|
453
|
+
* DocxEditor ref interface
|
|
454
|
+
*/
|
|
455
|
+
interface DocxEditorRef {
|
|
456
|
+
/** Get the DocumentAgent for programmatic access */
|
|
457
|
+
getAgent: () => DocumentAgent | null;
|
|
458
|
+
/** Get the current document */
|
|
459
|
+
getDocument: () => Document | null;
|
|
460
|
+
/** Get the editor ref */
|
|
461
|
+
getEditorRef: () => PagedEditorRef | null;
|
|
462
|
+
/** Save the document to buffer. Pass { selective: false } to force full repack. */
|
|
463
|
+
save: (options?: {
|
|
464
|
+
selective?: boolean;
|
|
465
|
+
}) => Promise<ArrayBuffer | null>;
|
|
466
|
+
/** Set zoom level */
|
|
467
|
+
setZoom: (zoom: number) => void;
|
|
468
|
+
/** Get current zoom level */
|
|
469
|
+
getZoom: () => number;
|
|
470
|
+
/** Focus the editor */
|
|
471
|
+
focus: () => void;
|
|
472
|
+
/** Get current page number */
|
|
473
|
+
getCurrentPage: () => number;
|
|
474
|
+
/** Get total page count */
|
|
475
|
+
getTotalPages: () => number;
|
|
476
|
+
/** Scroll to a specific page */
|
|
477
|
+
scrollToPage: (pageNumber: number) => void;
|
|
478
|
+
/** Open print preview */
|
|
479
|
+
openPrintPreview: () => void;
|
|
480
|
+
/** Print the document directly */
|
|
481
|
+
print: () => void;
|
|
482
|
+
/** Load a pre-parsed document programmatically */
|
|
483
|
+
loadDocument: (doc: Document) => void;
|
|
484
|
+
/** Load a DOCX buffer programmatically (ArrayBuffer, Uint8Array, Blob, or File) */
|
|
485
|
+
loadDocumentBuffer: (buffer: DocxInput) => Promise<void>;
|
|
486
|
+
}
|
|
487
|
+
type EditorMode = 'editing' | 'suggesting' | 'viewing';
|
|
488
|
+
/**
|
|
489
|
+
* DocxEditor - Complete DOCX editor component
|
|
490
|
+
*/
|
|
491
|
+
declare const DocxEditor: React$1.ForwardRefExoticComponent<DocxEditorProps & React$1.RefAttributes<DocxEditorRef>>;
|
|
492
|
+
|
|
493
|
+
/**
|
|
494
|
+
* Simple imperative API for rendering a DOCX editor into a DOM element.
|
|
495
|
+
*
|
|
496
|
+
* Returns an `EditorHandle` (from @postnzt/docx-core) that works with
|
|
497
|
+
* any framework implementation.
|
|
498
|
+
*
|
|
499
|
+
* Usage:
|
|
500
|
+
* ```ts
|
|
501
|
+
* import { renderAsync } from '@postnzt/docx-js-editor';
|
|
502
|
+
*
|
|
503
|
+
* const editor = await renderAsync(docxBlob, document.getElementById('container'), {
|
|
504
|
+
* readOnly: false,
|
|
505
|
+
* showToolbar: true,
|
|
506
|
+
* });
|
|
507
|
+
*
|
|
508
|
+
* // Save the edited document
|
|
509
|
+
* const blob = await editor.save();
|
|
510
|
+
*
|
|
511
|
+
* // Clean up
|
|
512
|
+
* editor.destroy();
|
|
513
|
+
* ```
|
|
514
|
+
*/
|
|
515
|
+
|
|
516
|
+
/**
|
|
517
|
+
* Options for {@link renderAsync}. A subset of DocxEditorProps minus
|
|
518
|
+
* `documentBuffer` / `document` (passed as the first argument instead).
|
|
519
|
+
*/
|
|
520
|
+
type RenderAsyncOptions = Omit<DocxEditorProps, 'documentBuffer' | 'document'>;
|
|
521
|
+
/**
|
|
522
|
+
* React-specific handle that extends the framework-agnostic EditorHandle
|
|
523
|
+
* with zoom control.
|
|
524
|
+
*/
|
|
525
|
+
interface DocxEditorHandle extends EditorHandle {
|
|
526
|
+
/** Set zoom level (1.0 = 100%). */
|
|
527
|
+
setZoom: (zoom: number) => void;
|
|
528
|
+
}
|
|
529
|
+
/**
|
|
530
|
+
* Render a DOCX editor into a container element.
|
|
531
|
+
*
|
|
532
|
+
* @param input - DOCX data as ArrayBuffer, Uint8Array, Blob, or File
|
|
533
|
+
* @param container - DOM element to render into
|
|
534
|
+
* @param options - Editor configuration (toolbar, readOnly, callbacks, etc.)
|
|
535
|
+
* @returns A handle with save / destroy / getDocument methods
|
|
536
|
+
*/
|
|
537
|
+
declare function renderAsync(input: DocxInput, container: HTMLElement, options?: RenderAsyncOptions): Promise<DocxEditorHandle>;
|
|
538
|
+
|
|
539
|
+
/**
|
|
540
|
+
* Error context value
|
|
541
|
+
*/
|
|
542
|
+
interface ErrorContextValue {
|
|
543
|
+
/** Current notifications */
|
|
544
|
+
notifications: ErrorNotification[];
|
|
545
|
+
/** Show an error notification */
|
|
546
|
+
showError: (message: string, details?: string) => void;
|
|
547
|
+
/** Show a warning notification */
|
|
548
|
+
showWarning: (message: string, details?: string) => void;
|
|
549
|
+
/** Show an info notification */
|
|
550
|
+
showInfo: (message: string, details?: string) => void;
|
|
551
|
+
/** Dismiss a notification */
|
|
552
|
+
dismissNotification: (id: string) => void;
|
|
553
|
+
/** Clear all notifications */
|
|
554
|
+
clearNotifications: () => void;
|
|
555
|
+
}
|
|
556
|
+
/**
|
|
557
|
+
* Error boundary props
|
|
558
|
+
*/
|
|
559
|
+
interface ErrorBoundaryProps {
|
|
560
|
+
/** Child components to render */
|
|
561
|
+
children: ReactNode;
|
|
562
|
+
/** Custom fallback UI */
|
|
563
|
+
fallback?: ReactNode | ((error: Error, reset: () => void) => ReactNode);
|
|
564
|
+
/** Callback when error occurs */
|
|
565
|
+
onError?: (error: Error, errorInfo: ErrorInfo) => void;
|
|
566
|
+
/** Whether to show error details */
|
|
567
|
+
showDetails?: boolean;
|
|
568
|
+
}
|
|
569
|
+
/**
|
|
570
|
+
* Error boundary state
|
|
571
|
+
*/
|
|
572
|
+
interface ErrorBoundaryState {
|
|
573
|
+
hasError: boolean;
|
|
574
|
+
error: Error | null;
|
|
575
|
+
errorInfo: ErrorInfo | null;
|
|
576
|
+
}
|
|
577
|
+
/**
|
|
578
|
+
* Hook to use error notifications
|
|
579
|
+
*/
|
|
580
|
+
declare function useErrorNotifications(): ErrorContextValue;
|
|
581
|
+
/**
|
|
582
|
+
* Error notification provider
|
|
583
|
+
*
|
|
584
|
+
* Thin React wrapper around the framework-agnostic ErrorManager.
|
|
585
|
+
* Uses useSyncExternalStore to subscribe to ErrorManager state.
|
|
586
|
+
*/
|
|
587
|
+
declare function ErrorProvider({ children }: {
|
|
588
|
+
children: ReactNode;
|
|
589
|
+
}): react_jsx_runtime.JSX.Element;
|
|
590
|
+
/**
|
|
591
|
+
* Error Boundary class component
|
|
592
|
+
*
|
|
593
|
+
* Catches render errors in child components and displays fallback UI.
|
|
594
|
+
*/
|
|
595
|
+
declare class ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundaryState> {
|
|
596
|
+
constructor(props: ErrorBoundaryProps);
|
|
597
|
+
static getDerivedStateFromError(error: Error): Partial<ErrorBoundaryState>;
|
|
598
|
+
componentDidCatch(error: Error, errorInfo: ErrorInfo): void;
|
|
599
|
+
resetError: () => void;
|
|
600
|
+
render(): ReactNode;
|
|
601
|
+
}
|
|
602
|
+
interface ParseErrorDisplayProps {
|
|
603
|
+
message: string;
|
|
604
|
+
details?: string;
|
|
605
|
+
onRetry?: () => void;
|
|
606
|
+
className?: string;
|
|
607
|
+
}
|
|
608
|
+
/**
|
|
609
|
+
* Parse error display component
|
|
610
|
+
*
|
|
611
|
+
* Shows a helpful message for DOCX parsing errors.
|
|
612
|
+
*/
|
|
613
|
+
declare function ParseErrorDisplay({ message, details, onRetry, className, }: ParseErrorDisplayProps): React__default.ReactElement;
|
|
614
|
+
interface UnsupportedFeatureWarningProps {
|
|
615
|
+
feature: string;
|
|
616
|
+
description?: string;
|
|
617
|
+
className?: string;
|
|
618
|
+
}
|
|
619
|
+
/**
|
|
620
|
+
* Unsupported feature warning component
|
|
621
|
+
*
|
|
622
|
+
* Shows a non-blocking warning for unsupported features.
|
|
623
|
+
*/
|
|
624
|
+
declare function UnsupportedFeatureWarning({ feature, description, className, }: UnsupportedFeatureWarningProps): React__default.ReactElement;
|
|
625
|
+
/**
|
|
626
|
+
* Check if an error is a parse error
|
|
627
|
+
*/
|
|
628
|
+
declare function isParseError(error: Error): boolean;
|
|
629
|
+
/**
|
|
630
|
+
* Get user-friendly error message
|
|
631
|
+
*/
|
|
632
|
+
declare function getUserFriendlyMessage(error: Error): string;
|
|
633
|
+
|
|
634
|
+
/**
|
|
635
|
+
* useTableSelection Hook
|
|
636
|
+
*
|
|
637
|
+
* Thin React wrapper around the framework-agnostic TableSelectionManager.
|
|
638
|
+
* Provides table selection tracking and table operation dispatch.
|
|
639
|
+
*/
|
|
640
|
+
|
|
641
|
+
interface TableSelectionState {
|
|
642
|
+
context: TableContext | null;
|
|
643
|
+
table: Table | null;
|
|
644
|
+
tableIndex: number | null;
|
|
645
|
+
rowIndex: number | null;
|
|
646
|
+
columnIndex: number | null;
|
|
647
|
+
}
|
|
648
|
+
interface UseTableSelectionReturn {
|
|
649
|
+
state: TableSelectionState;
|
|
650
|
+
handleCellClick: (tableIndex: number, rowIndex: number, columnIndex: number) => void;
|
|
651
|
+
handleAction: (action: TableAction) => void;
|
|
652
|
+
clearSelection: () => void;
|
|
653
|
+
isCellSelected: (tableIndex: number, rowIndex: number, columnIndex: number) => boolean;
|
|
654
|
+
tableContext: TableContext | null;
|
|
655
|
+
}
|
|
656
|
+
interface UseTableSelectionOptions {
|
|
657
|
+
document: Document | null;
|
|
658
|
+
onChange?: (document: Document) => void;
|
|
659
|
+
onSelectionChange?: (context: TableContext | null) => void;
|
|
660
|
+
}
|
|
661
|
+
declare function useTableSelection({ document: doc, onChange, onSelectionChange, }: UseTableSelectionOptions): UseTableSelectionReturn;
|
|
662
|
+
|
|
663
|
+
/**
|
|
664
|
+
* useAutoSave Hook
|
|
665
|
+
*
|
|
666
|
+
* Thin React wrapper around the framework-agnostic AutoSaveManager.
|
|
667
|
+
* Bridges AutoSaveManager's subscribe/getSnapshot pattern with React state.
|
|
668
|
+
*/
|
|
669
|
+
|
|
670
|
+
/** Options for useAutoSave hook */
|
|
671
|
+
interface UseAutoSaveOptions {
|
|
672
|
+
/** Storage key for localStorage (default: 'docx-editor-autosave') */
|
|
673
|
+
storageKey?: string;
|
|
674
|
+
/** Save interval in milliseconds (default: 30000 - 30 seconds) */
|
|
675
|
+
interval?: number;
|
|
676
|
+
/** Whether auto-save is enabled (default: true) */
|
|
677
|
+
enabled?: boolean;
|
|
678
|
+
/** Maximum age of auto-save in milliseconds before it's considered stale (default: 24 hours) */
|
|
679
|
+
maxAge?: number;
|
|
680
|
+
/** Callback when save succeeds */
|
|
681
|
+
onSave?: (timestamp: Date) => void;
|
|
682
|
+
/** Callback when save fails */
|
|
683
|
+
onError?: (error: Error) => void;
|
|
684
|
+
/** Callback when recovery data is found */
|
|
685
|
+
onRecoveryAvailable?: (savedDocument: SavedDocumentData) => void;
|
|
686
|
+
/** Whether to save immediately when document changes (debounced) */
|
|
687
|
+
saveOnChange?: boolean;
|
|
688
|
+
/** Debounce delay for saveOnChange in milliseconds (default: 2000) */
|
|
689
|
+
debounceDelay?: number;
|
|
690
|
+
}
|
|
691
|
+
/** Return value of useAutoSave hook */
|
|
692
|
+
interface UseAutoSaveReturn {
|
|
693
|
+
status: AutoSaveStatus;
|
|
694
|
+
lastSaveTime: Date | null;
|
|
695
|
+
save: () => Promise<boolean>;
|
|
696
|
+
clearAutoSave: () => void;
|
|
697
|
+
hasRecoveryData: boolean;
|
|
698
|
+
getRecoveryData: () => SavedDocumentData | null;
|
|
699
|
+
acceptRecovery: () => Document | null;
|
|
700
|
+
dismissRecovery: () => void;
|
|
701
|
+
isEnabled: boolean;
|
|
702
|
+
enable: () => void;
|
|
703
|
+
disable: () => void;
|
|
704
|
+
}
|
|
705
|
+
declare function useAutoSave(document: Document | null | undefined, options?: UseAutoSaveOptions): UseAutoSaveReturn;
|
|
706
|
+
|
|
707
|
+
/**
|
|
708
|
+
* useWheelZoom Hook
|
|
709
|
+
*
|
|
710
|
+
* Enables Ctrl+scroll (or Cmd+scroll on Mac) to zoom in/out.
|
|
711
|
+
* Features:
|
|
712
|
+
* - Configurable zoom range and step
|
|
713
|
+
* - Smooth zoom transitions
|
|
714
|
+
* - Pinch-to-zoom support on trackpads
|
|
715
|
+
* - Zoom reset (Ctrl+0)
|
|
716
|
+
* - Zoom in/out shortcuts (Ctrl++, Ctrl+-)
|
|
717
|
+
*/
|
|
718
|
+
/**
|
|
719
|
+
* Options for useWheelZoom hook
|
|
720
|
+
*/
|
|
721
|
+
interface UseWheelZoomOptions {
|
|
722
|
+
/** Initial zoom level (default: 1.0) */
|
|
723
|
+
initialZoom?: number;
|
|
724
|
+
/** Minimum zoom level (default: 0.25) */
|
|
725
|
+
minZoom?: number;
|
|
726
|
+
/** Maximum zoom level (default: 4.0) */
|
|
727
|
+
maxZoom?: number;
|
|
728
|
+
/** Zoom step for each scroll event (default: 0.1) */
|
|
729
|
+
zoomStep?: number;
|
|
730
|
+
/** Whether zoom is enabled (default: true) */
|
|
731
|
+
enabled?: boolean;
|
|
732
|
+
/** Container element ref to attach wheel listener */
|
|
733
|
+
containerRef?: React.RefObject<HTMLElement>;
|
|
734
|
+
/** Callback when zoom changes */
|
|
735
|
+
onZoomChange?: (zoom: number) => void;
|
|
736
|
+
/** Whether to enable keyboard shortcuts (Ctrl++, Ctrl+-, Ctrl+0) */
|
|
737
|
+
enableKeyboardShortcuts?: boolean;
|
|
738
|
+
/** Whether to prevent default browser zoom behavior */
|
|
739
|
+
preventDefault?: boolean;
|
|
740
|
+
}
|
|
741
|
+
/**
|
|
742
|
+
* Return value of useWheelZoom hook
|
|
743
|
+
*/
|
|
744
|
+
interface UseWheelZoomReturn {
|
|
745
|
+
/** Current zoom level */
|
|
746
|
+
zoom: number;
|
|
747
|
+
/** Set zoom level directly */
|
|
748
|
+
setZoom: (zoom: number) => void;
|
|
749
|
+
/** Zoom in by step */
|
|
750
|
+
zoomIn: () => void;
|
|
751
|
+
/** Zoom out by step */
|
|
752
|
+
zoomOut: () => void;
|
|
753
|
+
/** Reset zoom to initial level */
|
|
754
|
+
resetZoom: () => void;
|
|
755
|
+
/** Reset zoom to 100% */
|
|
756
|
+
zoomTo100: () => void;
|
|
757
|
+
/** Zoom to fit width */
|
|
758
|
+
zoomToFit: (containerWidth: number, contentWidth: number) => void;
|
|
759
|
+
/** Whether currently at minimum zoom */
|
|
760
|
+
isMinZoom: boolean;
|
|
761
|
+
/** Whether currently at maximum zoom */
|
|
762
|
+
isMaxZoom: boolean;
|
|
763
|
+
/** Zoom percentage (e.g., 100 for zoom level 1.0) */
|
|
764
|
+
zoomPercent: number;
|
|
765
|
+
/** Wheel event handler (for manual attachment) */
|
|
766
|
+
handleWheel: (event: WheelEvent) => void;
|
|
767
|
+
/** Keyboard event handler (for manual attachment) */
|
|
768
|
+
handleKeyDown: (event: KeyboardEvent) => void;
|
|
769
|
+
}
|
|
770
|
+
/**
|
|
771
|
+
* Preset zoom levels for snapping
|
|
772
|
+
*/
|
|
773
|
+
declare const ZOOM_PRESETS: number[];
|
|
774
|
+
/**
|
|
775
|
+
* React hook for Ctrl+scroll zoom functionality
|
|
776
|
+
*/
|
|
777
|
+
declare function useWheelZoom(options?: UseWheelZoomOptions): UseWheelZoomReturn;
|
|
778
|
+
/**
|
|
779
|
+
* Get zoom presets
|
|
780
|
+
*/
|
|
781
|
+
declare function getZoomPresets(): number[];
|
|
782
|
+
/**
|
|
783
|
+
* Find nearest zoom preset
|
|
784
|
+
*/
|
|
785
|
+
declare function findNearestZoomPreset(zoom: number): number;
|
|
786
|
+
/**
|
|
787
|
+
* Get next zoom preset (for zoom in)
|
|
788
|
+
*/
|
|
789
|
+
declare function getNextZoomPreset(zoom: number): number;
|
|
790
|
+
/**
|
|
791
|
+
* Get previous zoom preset (for zoom out)
|
|
792
|
+
*/
|
|
793
|
+
declare function getPreviousZoomPreset(zoom: number): number;
|
|
794
|
+
/**
|
|
795
|
+
* Format zoom level for display
|
|
796
|
+
*/
|
|
797
|
+
declare function formatZoom(zoom: number): string;
|
|
798
|
+
/**
|
|
799
|
+
* Parse zoom from percentage string
|
|
800
|
+
*/
|
|
801
|
+
declare function parseZoom(zoomString: string): number | null;
|
|
802
|
+
/**
|
|
803
|
+
* Check if zoom level is at a preset
|
|
804
|
+
*/
|
|
805
|
+
declare function isZoomPreset(zoom: number): boolean;
|
|
806
|
+
/**
|
|
807
|
+
* Clamp zoom to valid range
|
|
808
|
+
*/
|
|
809
|
+
declare function clampZoom(zoom: number, minZoom?: number, maxZoom?: number): number;
|
|
810
|
+
|
|
811
|
+
/**
|
|
812
|
+
* Selection Highlight Utilities
|
|
813
|
+
*
|
|
814
|
+
* Provides visual highlighting for text selection across multiple runs.
|
|
815
|
+
* Browsers handle ::selection pseudo-element differently, especially when
|
|
816
|
+
* selection spans multiple elements with different backgrounds or styling.
|
|
817
|
+
*
|
|
818
|
+
* This module provides:
|
|
819
|
+
* - Custom selection highlight rendering
|
|
820
|
+
* - Programmatic selection range marking
|
|
821
|
+
* - Visual feedback for selection across runs
|
|
822
|
+
*/
|
|
823
|
+
/** Framework-agnostic CSS properties type (compatible with React.CSSProperties) */
|
|
824
|
+
type CSSProperties = Record<string, any>;
|
|
825
|
+
/**
|
|
826
|
+
* Highlight rectangle representing a selected region
|
|
827
|
+
*/
|
|
828
|
+
interface HighlightRect {
|
|
829
|
+
/** Left position in pixels */
|
|
830
|
+
left: number;
|
|
831
|
+
/** Top position in pixels */
|
|
832
|
+
top: number;
|
|
833
|
+
/** Width in pixels */
|
|
834
|
+
width: number;
|
|
835
|
+
/** Height in pixels */
|
|
836
|
+
height: number;
|
|
837
|
+
}
|
|
838
|
+
/**
|
|
839
|
+
* Selection highlight configuration
|
|
840
|
+
*/
|
|
841
|
+
interface SelectionHighlightConfig {
|
|
842
|
+
/** Background color for selection */
|
|
843
|
+
backgroundColor: string;
|
|
844
|
+
/** Optional border color for selection */
|
|
845
|
+
borderColor?: string;
|
|
846
|
+
/** Optional border radius */
|
|
847
|
+
borderRadius?: number;
|
|
848
|
+
/** Z-index for overlay */
|
|
849
|
+
zIndex?: number;
|
|
850
|
+
/** Opacity for highlight */
|
|
851
|
+
opacity?: number;
|
|
852
|
+
/** Mix blend mode */
|
|
853
|
+
mixBlendMode?: CSSProperties['mixBlendMode'];
|
|
854
|
+
}
|
|
855
|
+
/**
|
|
856
|
+
* Selection range in document coordinates
|
|
857
|
+
*/
|
|
858
|
+
interface SelectionRange {
|
|
859
|
+
/** Start position */
|
|
860
|
+
start: {
|
|
861
|
+
paragraphIndex: number;
|
|
862
|
+
contentIndex: number;
|
|
863
|
+
offset: number;
|
|
864
|
+
};
|
|
865
|
+
/** End position */
|
|
866
|
+
end: {
|
|
867
|
+
paragraphIndex: number;
|
|
868
|
+
contentIndex: number;
|
|
869
|
+
offset: number;
|
|
870
|
+
};
|
|
871
|
+
}
|
|
872
|
+
/**
|
|
873
|
+
* Default selection highlight style (matches Word/Google Docs)
|
|
874
|
+
*/
|
|
875
|
+
declare const DEFAULT_SELECTION_STYLE: SelectionHighlightConfig;
|
|
876
|
+
/**
|
|
877
|
+
* High contrast selection style
|
|
878
|
+
*/
|
|
879
|
+
declare const HIGH_CONTRAST_SELECTION_STYLE: SelectionHighlightConfig;
|
|
880
|
+
/**
|
|
881
|
+
* Selection highlight CSS custom properties
|
|
882
|
+
*/
|
|
883
|
+
declare const SELECTION_CSS_VARS: {
|
|
884
|
+
readonly backgroundColor: "--docx-selection-bg";
|
|
885
|
+
readonly borderColor: "--docx-selection-border";
|
|
886
|
+
readonly textColor: "--docx-selection-text";
|
|
887
|
+
};
|
|
888
|
+
/**
|
|
889
|
+
* Get all selection rectangles from the current DOM selection
|
|
890
|
+
*
|
|
891
|
+
* Uses getClientRects() to get accurate rectangles even when
|
|
892
|
+
* selection spans multiple inline elements.
|
|
893
|
+
*/
|
|
894
|
+
declare function getSelectionRects(containerElement?: HTMLElement | null): HighlightRect[];
|
|
895
|
+
/**
|
|
896
|
+
* Merge adjacent or overlapping rectangles
|
|
897
|
+
*
|
|
898
|
+
* This reduces the number of highlight elements needed and creates
|
|
899
|
+
* a cleaner visual appearance.
|
|
900
|
+
*/
|
|
901
|
+
declare function mergeAdjacentRects(rects: HighlightRect[], tolerance?: number): HighlightRect[];
|
|
902
|
+
/**
|
|
903
|
+
* Get selection rectangles with merging applied
|
|
904
|
+
*/
|
|
905
|
+
declare function getMergedSelectionRects(containerElement?: HTMLElement | null): HighlightRect[];
|
|
906
|
+
/**
|
|
907
|
+
* Generate CSS styles for a highlight rectangle
|
|
908
|
+
*/
|
|
909
|
+
declare function getHighlightRectStyle(rect: HighlightRect, config?: SelectionHighlightConfig): CSSProperties;
|
|
910
|
+
/**
|
|
911
|
+
* Generate inline CSS for selection pseudo-elements
|
|
912
|
+
*
|
|
913
|
+
* This is used to inject consistent selection styling
|
|
914
|
+
* across all editable elements.
|
|
915
|
+
*/
|
|
916
|
+
declare function generateSelectionCSS(selector: string, config?: SelectionHighlightConfig): string;
|
|
917
|
+
/**
|
|
918
|
+
* Check if there is an active text selection (not collapsed)
|
|
919
|
+
*/
|
|
920
|
+
declare function hasActiveSelection(): boolean;
|
|
921
|
+
/**
|
|
922
|
+
* Get the selected text
|
|
923
|
+
*/
|
|
924
|
+
declare function getSelectedText(): string;
|
|
925
|
+
/**
|
|
926
|
+
* Check if selection is within a specific element
|
|
927
|
+
*/
|
|
928
|
+
declare function isSelectionWithin(element: HTMLElement): boolean;
|
|
929
|
+
/**
|
|
930
|
+
* Get the bounding rect of the current selection
|
|
931
|
+
*/
|
|
932
|
+
declare function getSelectionBoundingRect(): DOMRect | null;
|
|
933
|
+
/**
|
|
934
|
+
* Create a selection highlight for a specific text range
|
|
935
|
+
*
|
|
936
|
+
* This is useful for find/replace highlighting, AI action previews, etc.
|
|
937
|
+
*/
|
|
938
|
+
declare function highlightTextRange(_containerElement: HTMLElement, startNode: Node, startOffset: number, endNode: Node, endOffset: number): Range | null;
|
|
939
|
+
/**
|
|
940
|
+
* Select a text range programmatically
|
|
941
|
+
*/
|
|
942
|
+
declare function selectRange(range: Range): void;
|
|
943
|
+
/**
|
|
944
|
+
* Clear the current selection
|
|
945
|
+
*/
|
|
946
|
+
declare function clearSelection(): void;
|
|
947
|
+
/**
|
|
948
|
+
* Check if selection is backwards (focus before anchor)
|
|
949
|
+
*/
|
|
950
|
+
declare function isSelectionBackwards(): boolean;
|
|
951
|
+
/**
|
|
952
|
+
* Normalize selection to always be forward (start before end)
|
|
953
|
+
*/
|
|
954
|
+
declare function normalizeSelectionDirection(): void;
|
|
955
|
+
/**
|
|
956
|
+
* Inject selection highlight CSS into document
|
|
957
|
+
*/
|
|
958
|
+
declare function injectSelectionStyles(config?: SelectionHighlightConfig): void;
|
|
959
|
+
/**
|
|
960
|
+
* Remove injected selection styles
|
|
961
|
+
*/
|
|
962
|
+
declare function removeSelectionStyles(): void;
|
|
963
|
+
/**
|
|
964
|
+
* Check if selection styles are injected
|
|
965
|
+
*/
|
|
966
|
+
declare function areSelectionStylesInjected(): boolean;
|
|
967
|
+
/**
|
|
968
|
+
* Create a selection change handler that updates highlight rects
|
|
969
|
+
*/
|
|
970
|
+
declare function createSelectionChangeHandler(containerElement: HTMLElement | null, onRectsChange: (rects: HighlightRect[]) => void, merge?: boolean): () => void;
|
|
971
|
+
|
|
972
|
+
/**
|
|
973
|
+
* Selection Highlight Hook
|
|
974
|
+
*
|
|
975
|
+
* A React hook that manages visual selection highlighting across multiple runs.
|
|
976
|
+
* Uses a combination of CSS ::selection pseudo-element styling and optional
|
|
977
|
+
* overlay rectangles for complex scenarios.
|
|
978
|
+
*
|
|
979
|
+
* Features:
|
|
980
|
+
* - Consistent selection highlighting across all text runs
|
|
981
|
+
* - Support for text with different backgrounds (highlighted, dark bg)
|
|
982
|
+
* - Optional overlay rectangles for custom highlight effects
|
|
983
|
+
* - Debounced updates for performance
|
|
984
|
+
*/
|
|
985
|
+
|
|
986
|
+
/**
|
|
987
|
+
* Options for the useSelectionHighlight hook
|
|
988
|
+
*/
|
|
989
|
+
interface UseSelectionHighlightOptions {
|
|
990
|
+
/** Reference to the container element */
|
|
991
|
+
containerRef: React__default.RefObject<HTMLElement>;
|
|
992
|
+
/** Whether to enable selection highlighting */
|
|
993
|
+
enabled?: boolean;
|
|
994
|
+
/** Custom highlight configuration */
|
|
995
|
+
config?: SelectionHighlightConfig;
|
|
996
|
+
/** Whether to use overlay rectangles (default: false, uses CSS) */
|
|
997
|
+
useOverlay?: boolean;
|
|
998
|
+
/** Debounce delay for rect updates in ms (default: 16) */
|
|
999
|
+
debounceMs?: number;
|
|
1000
|
+
/** Callback when selection changes */
|
|
1001
|
+
onSelectionChange?: (hasSelection: boolean, text: string) => void;
|
|
1002
|
+
}
|
|
1003
|
+
/**
|
|
1004
|
+
* Return value from the useSelectionHighlight hook
|
|
1005
|
+
*/
|
|
1006
|
+
interface UseSelectionHighlightReturn {
|
|
1007
|
+
/** Whether there is an active selection */
|
|
1008
|
+
hasSelection: boolean;
|
|
1009
|
+
/** The selected text */
|
|
1010
|
+
selectedText: string;
|
|
1011
|
+
/** Highlight rectangles (only populated if useOverlay is true) */
|
|
1012
|
+
highlightRects: HighlightRect[];
|
|
1013
|
+
/** Whether selection is within the container */
|
|
1014
|
+
isSelectionInContainer: boolean;
|
|
1015
|
+
/** Refresh the highlight state */
|
|
1016
|
+
refresh: () => void;
|
|
1017
|
+
/** Get styles for a highlight rect overlay */
|
|
1018
|
+
getOverlayStyle: (rect: HighlightRect) => CSSProperties$1;
|
|
1019
|
+
}
|
|
1020
|
+
/**
|
|
1021
|
+
* Hook to manage selection highlighting in the editor
|
|
1022
|
+
*/
|
|
1023
|
+
declare function useSelectionHighlight(options: UseSelectionHighlightOptions): UseSelectionHighlightReturn;
|
|
1024
|
+
/**
|
|
1025
|
+
* Props for selection overlay component
|
|
1026
|
+
*/
|
|
1027
|
+
interface SelectionOverlayProps {
|
|
1028
|
+
/** Highlight rectangles to render */
|
|
1029
|
+
rects: HighlightRect[];
|
|
1030
|
+
/** Style configuration */
|
|
1031
|
+
config?: SelectionHighlightConfig;
|
|
1032
|
+
/** Additional class name */
|
|
1033
|
+
className?: string;
|
|
1034
|
+
}
|
|
1035
|
+
/**
|
|
1036
|
+
* Generate selection overlay elements (for use in JSX)
|
|
1037
|
+
*
|
|
1038
|
+
* Usage:
|
|
1039
|
+
* ```tsx
|
|
1040
|
+
* const { highlightRects } = useSelectionHighlight({ ... });
|
|
1041
|
+
* return (
|
|
1042
|
+
* <div style={{ position: 'relative' }}>
|
|
1043
|
+
* {generateOverlayElements(highlightRects)}
|
|
1044
|
+
* <div>... content ...</div>
|
|
1045
|
+
* </div>
|
|
1046
|
+
* );
|
|
1047
|
+
* ```
|
|
1048
|
+
*/
|
|
1049
|
+
declare function generateOverlayElements(rects: HighlightRect[], config?: SelectionHighlightConfig): React__default.ReactNode[];
|
|
1050
|
+
|
|
1051
|
+
/**
|
|
1052
|
+
* useClipboard Hook
|
|
1053
|
+
*
|
|
1054
|
+
* Thin React wrapper around the framework-agnostic ClipboardManager.
|
|
1055
|
+
* Handles clipboard operations with formatting preservation.
|
|
1056
|
+
*/
|
|
1057
|
+
|
|
1058
|
+
interface UseClipboardOptions {
|
|
1059
|
+
onCopy?: (selection: ClipboardSelection) => void;
|
|
1060
|
+
onCut?: (selection: ClipboardSelection) => void;
|
|
1061
|
+
onPaste?: (content: ParsedClipboardContent, asPlainText: boolean) => void;
|
|
1062
|
+
cleanWordFormatting?: boolean;
|
|
1063
|
+
editable?: boolean;
|
|
1064
|
+
onError?: (error: Error) => void;
|
|
1065
|
+
}
|
|
1066
|
+
interface UseClipboardReturn {
|
|
1067
|
+
copy: (selection: ClipboardSelection) => Promise<boolean>;
|
|
1068
|
+
cut: (selection: ClipboardSelection) => Promise<boolean>;
|
|
1069
|
+
paste: (asPlainText?: boolean) => Promise<ParsedClipboardContent | null>;
|
|
1070
|
+
handleCopy: (event: ClipboardEvent) => void;
|
|
1071
|
+
handleCut: (event: ClipboardEvent) => void;
|
|
1072
|
+
handlePaste: (event: ClipboardEvent) => void;
|
|
1073
|
+
handleKeyDown: (event: KeyboardEvent) => void;
|
|
1074
|
+
isProcessing: boolean;
|
|
1075
|
+
lastPastedContent: ParsedClipboardContent | null;
|
|
1076
|
+
}
|
|
1077
|
+
declare function useClipboard(options?: UseClipboardOptions): UseClipboardReturn;
|
|
1078
|
+
|
|
1079
|
+
declare const PLUGIN_HOST_STYLES = "\n.plugin-host {\n display: flex;\n width: 100%;\n height: 100%;\n overflow: visible;\n position: relative;\n}\n\n.plugin-host-editor {\n flex: 1;\n display: flex;\n flex-direction: column;\n min-width: 0;\n overflow: visible;\n}\n\n\n.plugin-panels-left,\n.plugin-panels-right {\n display: flex;\n flex-direction: column;\n flex-shrink: 0;\n background: #f8f9fa;\n border-color: #e9ecef;\n}\n\n.plugin-panels-left {\n border-right: 1px solid #e9ecef;\n}\n\n.plugin-panels-right {\n border-left: 1px solid #e9ecef;\n}\n\n.plugin-panels-bottom {\n border-top: 1px solid #e9ecef;\n background: #f8f9fa;\n}\n\n.plugin-panel {\n position: relative;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n transition: width 0.2s ease, height 0.2s ease;\n}\n\n.plugin-panel.collapsed {\n overflow: visible;\n}\n\n.plugin-panel-toggle {\n display: flex;\n align-items: center;\n gap: 4px;\n padding: 6px 8px;\n background: transparent;\n border: none;\n cursor: pointer;\n font-size: 12px;\n color: #6c757d;\n white-space: nowrap;\n}\n\n.plugin-panel.collapsed .plugin-panel-toggle {\n writing-mode: vertical-rl;\n text-orientation: mixed;\n flex-direction: column;\n height: 100%;\n padding: 8px 6px;\n}\n\n.plugin-panel-toggle:hover {\n background: #e9ecef;\n color: #495057;\n}\n\n.plugin-panel-toggle-icon {\n font-weight: bold;\n font-size: 14px;\n}\n\n.plugin-panel.collapsed .plugin-panel-toggle-icon {\n transform: rotate(90deg);\n}\n\n.plugin-panel-toggle-label {\n font-weight: 500;\n}\n\n.plugin-panel-content {\n flex: 1;\n overflow: auto;\n}\n\n/* Right panel rendered inside viewport - scrolls with content */\n.plugin-panel-in-viewport {\n position: absolute;\n top: 0;\n /* Position is set dynamically via inline styles based on page edge */\n width: 220px;\n pointer-events: auto;\n z-index: 10;\n overflow: visible;\n}\n\n.plugin-panel-in-viewport.collapsed {\n width: 32px;\n}\n\n.plugin-panel-in-viewport .plugin-panel-toggle {\n position: sticky;\n top: 0;\n background: rgba(255, 255, 255, 0.95);\n border-radius: 4px;\n box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);\n}\n\n.plugin-panel-in-viewport-content {\n overflow: visible;\n position: relative;\n}\n\n/* Plugin overlay container for rendering highlights/decorations */\n.plugin-overlays-container {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n pointer-events: none;\n overflow: visible;\n z-index: 5;\n}\n\n.plugin-overlay {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n pointer-events: none;\n}\n\n/* Individual overlay children manage their own pointer-events.\n Do NOT set pointer-events: auto here \u2014 it overrides overlay containers\n that need pointer-events: none to let clicks pass through to the editor. */\n";
|
|
1080
|
+
/**
|
|
1081
|
+
* PluginHost Component
|
|
1082
|
+
*
|
|
1083
|
+
* Wraps the editor and provides:
|
|
1084
|
+
* - Plugin state management
|
|
1085
|
+
* - Panel rendering for each plugin
|
|
1086
|
+
* - CSS injection for plugin styles
|
|
1087
|
+
* - Callbacks for editor interaction
|
|
1088
|
+
*/
|
|
1089
|
+
declare const PluginHost: React$1.ForwardRefExoticComponent<PluginHostProps & React$1.RefAttributes<PluginHostRef>>;
|
|
1090
|
+
|
|
1091
|
+
export { getPreviousZoomPreset as $, type UseClipboardReturn as A, type UseSelectionHighlightOptions as B, type UseSelectionHighlightReturn as C, DEFAULT_SELECTION_STYLE as D, type EditorMode as E, type UseTableSelectionOptions as F, type UseTableSelectionReturn as G, HIGH_CONTRAST_SELECTION_STYLE as H, type UseWheelZoomOptions as I, type UseWheelZoomReturn as J, areSelectionStylesInjected as K, clampZoom as L, clearSelection as M, createSelectionChangeHandler as N, findNearestZoomPreset as O, PLUGIN_HOST_STYLES as P, formatZoom as Q, type ReactEditorPlugin as R, SELECTION_CSS_VARS as S, type TableSelectionState as T, UnsupportedFeatureWarning as U, generateOverlayElements as V, generateSelectionCSS as W, getHighlightRectStyle as X, getMergedSelectionRects as Y, ZOOM_PRESETS as Z, getNextZoomPreset as _, DocxEditor as a, getSelectedText as a0, getSelectionBoundingRect as a1, getSelectionRects as a2, getUserFriendlyMessage as a3, getZoomPresets as a4, hasActiveSelection as a5, highlightTextRange as a6, injectSelectionStyles as a7, isParseError as a8, isSelectionBackwards as a9, isSelectionWithin as aa, isZoomPreset as ab, mergeAdjacentRects as ac, normalizeSelectionDirection as ad, parseZoom as ae, removeSelectionStyles as af, renderAsync as ag, selectRange as ah, useAutoSave as ai, useClipboard as aj, useErrorNotifications as ak, useSelectionHighlight as al, useTableSelection as am, useWheelZoom as an, type DocxEditorHandle as b, type DocxEditorProps as c, type DocxEditorRef as d, type EditorPlugin as e, ErrorBoundary as f, type ErrorBoundaryProps as g, type ErrorContextValue as h, ErrorProvider as i, type HighlightRect as j, ParseErrorDisplay as k, type ParseErrorDisplayProps as l, type PluginContext as m, PluginHost as n, type PluginHostProps as o, type PluginHostRef as p, type ReactSidebarItem as q, type RenderAsyncOptions as r, type SelectionHighlightConfig as s, type SelectionOverlayProps as t, type SelectionRange as u, type SidebarItemRenderProps as v, type UnsupportedFeatureWarningProps as w, type UseAutoSaveOptions as x, type UseAutoSaveReturn as y, type UseClipboardOptions as z };
|