oasis-editor 0.0.129 → 0.0.130
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/{OasisEditorApp-CDBzb0Eg.js → OasisEditorApp-BQvsqccA.js} +232 -21
- package/dist/app/controllers/useEditorLayout.d.ts +2 -1
- package/dist/app/controllers/useEditorTableCornerResize.d.ts +56 -0
- package/dist/{index-XyL0Hpf4.js → index-CX5iCo8O.js} +121 -69
- package/dist/oasis-editor.css +1 -1
- package/dist/oasis-editor.js +1 -1
- package/dist/oasis-editor.umd.cjs +4 -4
- package/dist/ui/OasisEditorEditor.d.ts +3 -1
- package/dist/ui/app/EditorDragLayers.d.ts +2 -0
- package/dist/ui/app/buildEditorViewProps.d.ts +4 -1
- package/dist/ui/app/createEditorDocumentRuntime.d.ts +1 -0
- package/dist/ui/app/createEditorInteractionRuntime.d.ts +1 -0
- package/dist/ui/app/useEditorInteractionWiring.d.ts +2 -0
- package/dist/ui/canvas/CanvasSelectionGeometry.d.ts +9 -0
- package/dist/ui/editorUiTypes.d.ts +9 -0
- package/dist/ui/overlays/TableHandlesOverlay.d.ts +22 -0
- package/package.json +1 -1
|
@@ -2,7 +2,7 @@ import { Accessor, JSX } from 'solid-js';
|
|
|
2
2
|
import { ToolbarHost } from './components/Toolbar/state/createToolbarApi.js';
|
|
3
3
|
import { EditorLayoutDocument, EditorLayoutParagraph, EditorState } from '../core/model.js';
|
|
4
4
|
import { ImportProgressState } from '../app/controllers/useEditorDocumentIO.js';
|
|
5
|
-
import { CaretBox, CommentHighlightBox, InputBox, LayoutOptionsOverlay, RevisionBox, SelectedImageBox, SelectedTextBoxBox, SelectionBox } from './editorUiTypes.js';
|
|
5
|
+
import { CaretBox, CommentHighlightBox, InputBox, LayoutOptionsOverlay, RevisionBox, SelectedImageBox, SelectedTextBoxBox, SelectedTableBox, SelectionBox } from './editorUiTypes.js';
|
|
6
6
|
import { ResizeHandleDirection } from './resizeGeometry.js';
|
|
7
7
|
|
|
8
8
|
type ImportProgress = ImportProgressState;
|
|
@@ -24,6 +24,7 @@ export interface OasisEditorEditorOverlayProps {
|
|
|
24
24
|
commentHighlights: Accessor<CommentHighlightBox[]>;
|
|
25
25
|
selectedImageBox: Accessor<SelectedImageBox | null>;
|
|
26
26
|
selectedTextBoxBox: Accessor<SelectedTextBoxBox | null>;
|
|
27
|
+
selectedTableBox: Accessor<SelectedTableBox | null>;
|
|
27
28
|
caretBox: Accessor<CaretBox>;
|
|
28
29
|
inputBox: Accessor<InputBox>;
|
|
29
30
|
hoveredRevision: Accessor<RevisionBox | null>;
|
|
@@ -69,6 +70,7 @@ export interface OasisEditorEditorSurfaceHandlers {
|
|
|
69
70
|
currentTarget: HTMLElement;
|
|
70
71
|
}) => void;
|
|
71
72
|
onTableDragHandleMouseDown: (tableId: string, event: MouseEvent) => void;
|
|
73
|
+
onTableCornerResizeHandleMouseDown: (tableId: string, event: MouseEvent) => void;
|
|
72
74
|
onRevisionMouseEnter: (revisionId: string, event: MouseEvent) => void;
|
|
73
75
|
onRevisionMouseLeave?: (revisionId: string, event: MouseEvent) => void;
|
|
74
76
|
onEditorContextMenu?: (event: MouseEvent) => void;
|
|
@@ -2,6 +2,7 @@ import { EditorLayoutDocument, EditorState } from '../../core/model.js';
|
|
|
2
2
|
import { CanvasLayoutSnapshotProvider } from '../canvas/canvasLayoutSnapshotProvider.js';
|
|
3
3
|
import { createEditorImageOperations } from '../../app/controllers/useEditorImageOperations.js';
|
|
4
4
|
import { createEditorTableResize } from '../../app/controllers/useEditorTableResize.js';
|
|
5
|
+
import { createEditorTableCornerResize } from '../../app/controllers/useEditorTableCornerResize.js';
|
|
5
6
|
import { createEditorTableDrag } from '../../app/controllers/useEditorTableDrag.js';
|
|
6
7
|
import { createEditorTextDrag } from '../../app/controllers/useEditorTextDrag.js';
|
|
7
8
|
import { JSX } from 'solid-js';
|
|
@@ -13,6 +14,7 @@ export interface EditorDragLayersProps {
|
|
|
13
14
|
snapshotProvider: CanvasLayoutSnapshotProvider;
|
|
14
15
|
zoomFactor?: () => number;
|
|
15
16
|
tableResize: ReturnType<typeof createEditorTableResize>;
|
|
17
|
+
tableCornerResize: ReturnType<typeof createEditorTableCornerResize>;
|
|
16
18
|
imageOps: ReturnType<typeof createEditorImageOperations>;
|
|
17
19
|
tableDrag: ReturnType<typeof createEditorTableDrag>;
|
|
18
20
|
textDrag: ReturnType<typeof createEditorTextDrag>;
|
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
import { Accessor, JSX } from 'solid-js';
|
|
2
|
-
import { CaretBox, CommentHighlightBox, InputBox, LayoutOptionsOverlay, RevisionBox, SelectedImageBox, SelectedTextBoxBox, SelectionBox } from '../editorUiTypes.js';
|
|
2
|
+
import { CaretBox, CommentHighlightBox, InputBox, LayoutOptionsOverlay, RevisionBox, SelectedImageBox, SelectedTextBoxBox, SelectedTableBox, SelectionBox } from '../editorUiTypes.js';
|
|
3
3
|
import { EditorLayoutDocument } from '../../core/model.js';
|
|
4
4
|
import { OasisEditorEditorFileHandlers, OasisEditorEditorInputHandlers, OasisEditorEditorLayoutProps, OasisEditorEditorOverlayProps, OasisEditorEditorRefProps, OasisEditorEditorSurfaceHandlers } from '../OasisEditorEditor.js';
|
|
5
5
|
import { createEditorFocusController } from './useEditorFocus.js';
|
|
6
6
|
import { createEditorSurfaceEvents } from '../../app/controllers/useEditorSurfaceEvents.js';
|
|
7
7
|
import { createEditorTableResize } from '../../app/controllers/useEditorTableResize.js';
|
|
8
|
+
import { createEditorTableCornerResize } from '../../app/controllers/useEditorTableCornerResize.js';
|
|
8
9
|
import { createEditorTableDrag } from '../../app/controllers/useEditorTableDrag.js';
|
|
9
10
|
import { createEditorTextInput } from '../../app/controllers/useEditorTextInput.js';
|
|
10
11
|
import { createEditorRevisionController } from '../../app/controllers/useEditorRevision.js';
|
|
@@ -26,6 +27,7 @@ export interface EditorViewOverlayInput {
|
|
|
26
27
|
commentHighlights: Accessor<CommentHighlightBox[]>;
|
|
27
28
|
selectedImageBox: Accessor<SelectedImageBox | null>;
|
|
28
29
|
selectedTextBoxBox: Accessor<SelectedTextBoxBox | null>;
|
|
30
|
+
selectedTableBox: Accessor<SelectedTableBox | null>;
|
|
29
31
|
layoutOptions: LayoutOptionsOverlay;
|
|
30
32
|
caretBox: Accessor<CaretBox>;
|
|
31
33
|
inputBox: Accessor<InputBox>;
|
|
@@ -47,6 +49,7 @@ export interface EditorViewFileInput {
|
|
|
47
49
|
export interface EditorViewSurfaceInput {
|
|
48
50
|
surfaceEvents: ReturnType<typeof createEditorSurfaceEvents>;
|
|
49
51
|
tableResize: ReturnType<typeof createEditorTableResize>;
|
|
52
|
+
tableCornerResize: ReturnType<typeof createEditorTableCornerResize>;
|
|
50
53
|
tableDrag: ReturnType<typeof createEditorTableDrag>;
|
|
51
54
|
revisionController: ReturnType<typeof createEditorRevisionController>;
|
|
52
55
|
handleDrop: OasisEditorEditorSurfaceHandlers["onDrop"];
|
|
@@ -58,6 +58,7 @@ declare function createEditorDocumentRuntimeImpl(deps: EditorDocumentRuntimeDeps
|
|
|
58
58
|
commentHighlights: import('solid-js').Accessor<import('../editorUiTypes.js').CommentHighlightBox[]>;
|
|
59
59
|
selectedImageBox: import('solid-js').Accessor<import('../canvas/CanvasSelectionGeometry.js').SelectedImageSelectionBox | null>;
|
|
60
60
|
selectedTextBoxBox: import('solid-js').Accessor<import('../canvas/CanvasSelectionGeometry.js').SelectedTextBoxSelectionBox | null>;
|
|
61
|
+
selectedTableBox: import('solid-js').Accessor<import('../canvas/CanvasSelectionGeometry.js').SelectedTableBox | null>;
|
|
61
62
|
caretBox: import('solid-js').Accessor<import('../editorUiTypes.js').CaretBox>;
|
|
62
63
|
preferredColumnX: import('solid-js').Accessor<number | null>;
|
|
63
64
|
setPreferredColumnX: import('solid-js').Setter<number | null>;
|
|
@@ -136,6 +136,7 @@ declare function createEditorInteractionRuntimeImpl(deps: EditorInteractionRunti
|
|
|
136
136
|
};
|
|
137
137
|
onEditorMouseDown: (event: MouseEvent) => void;
|
|
138
138
|
tableResize: import('../../app/controllers/useEditorTableResize.js').TableResizeOps;
|
|
139
|
+
tableCornerResize: import('../../app/controllers/useEditorTableCornerResize.js').TableCornerResizeOps;
|
|
139
140
|
tableDrag: {
|
|
140
141
|
dragging: import('solid-js').Accessor<boolean>;
|
|
141
142
|
draggedTableInfo: import('solid-js').Accessor<{
|
|
@@ -2,6 +2,7 @@ import { EditorState } from '../../core/model.js';
|
|
|
2
2
|
import { EditorLogger } from '../../utils/logger.js';
|
|
3
3
|
import { createEditorClipboardController } from '../../app/controllers/useEditorClipboard.js';
|
|
4
4
|
import { createEditorTableResize } from '../../app/controllers/useEditorTableResize.js';
|
|
5
|
+
import { createEditorTableCornerResize } from '../../app/controllers/useEditorTableCornerResize.js';
|
|
5
6
|
import { createEditorTableDrag } from '../../app/controllers/useEditorTableDrag.js';
|
|
6
7
|
import { createEditorSurfaceEvents } from '../../app/controllers/useEditorSurfaceEvents.js';
|
|
7
8
|
import { createEditorTextInput } from '../../app/controllers/useEditorTextInput.js';
|
|
@@ -52,6 +53,7 @@ export interface EditorInteractionWiringContext {
|
|
|
52
53
|
}
|
|
53
54
|
export interface EditorInteractionWiring {
|
|
54
55
|
tableResize: ReturnType<typeof createEditorTableResize>;
|
|
56
|
+
tableCornerResize: ReturnType<typeof createEditorTableCornerResize>;
|
|
55
57
|
tableDrag: ReturnType<typeof createEditorTableDrag>;
|
|
56
58
|
revisionController: ReturnType<typeof createEditorRevisionController>;
|
|
57
59
|
textDrag: ReturnType<typeof createEditorTextDrag>;
|
|
@@ -26,11 +26,20 @@ export interface SelectedTextBoxSelectionBox {
|
|
|
26
26
|
/** True when the selected text box is a floating (anchored) drawing. */
|
|
27
27
|
floating: boolean;
|
|
28
28
|
}
|
|
29
|
+
/** Bounding box of the table containing the caret, for the move/resize handles. */
|
|
30
|
+
export interface SelectedTableBox {
|
|
31
|
+
tableId: string;
|
|
32
|
+
left: number;
|
|
33
|
+
top: number;
|
|
34
|
+
width: number;
|
|
35
|
+
height: number;
|
|
36
|
+
}
|
|
29
37
|
export interface CanvasSelectionGeometryResult {
|
|
30
38
|
selectionBoxes: SelectionBox[];
|
|
31
39
|
caretBox: CaretBox;
|
|
32
40
|
inputBox: InputBox;
|
|
33
41
|
selectedImageBox: SelectedImageSelectionBox | null;
|
|
34
42
|
selectedTextBoxBox: SelectedTextBoxSelectionBox | null;
|
|
43
|
+
selectedTableBox: SelectedTableBox | null;
|
|
35
44
|
}
|
|
36
45
|
export declare function computeCanvasSelectionGeometry(snapshot: CanvasLayoutSnapshot, state: EditorState): CanvasSelectionGeometryResult;
|
|
@@ -40,6 +40,14 @@ export interface SelectedTextBoxBox {
|
|
|
40
40
|
/** True when the text box is a floating (anchored) drawing. */
|
|
41
41
|
floating: boolean;
|
|
42
42
|
}
|
|
43
|
+
/** Bounding box of the table containing the caret (move/resize handles). */
|
|
44
|
+
export interface SelectedTableBox {
|
|
45
|
+
tableId: string;
|
|
46
|
+
left: number;
|
|
47
|
+
top: number;
|
|
48
|
+
width: number;
|
|
49
|
+
height: number;
|
|
50
|
+
}
|
|
43
51
|
export interface RevisionBox {
|
|
44
52
|
revisionId: string;
|
|
45
53
|
author: string;
|
|
@@ -100,6 +108,7 @@ export interface EditorSurfaceProps {
|
|
|
100
108
|
currentTarget: HTMLElement;
|
|
101
109
|
}) => void;
|
|
102
110
|
onTableDragHandleMouseDown: (tableId: string, event: MouseEvent) => void;
|
|
111
|
+
onTableCornerResizeHandleMouseDown: (tableId: string, event: MouseEvent) => void;
|
|
103
112
|
onRevisionMouseEnter: (revisionId: string, event: MouseEvent) => void;
|
|
104
113
|
onRevisionMouseLeave?: (revisionId: string, event: MouseEvent) => void;
|
|
105
114
|
}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { JSX } from 'solid-js';
|
|
2
|
+
import { SelectedTableBox } from '../editorUiTypes.js';
|
|
3
|
+
|
|
4
|
+
export interface TableHandlesOverlayProps {
|
|
5
|
+
/** Bounding box of the table containing the caret, or `null`. */
|
|
6
|
+
box: () => SelectedTableBox | null;
|
|
7
|
+
readOnly: boolean;
|
|
8
|
+
/** Press on the top-left move handle (drag/reorder the whole table). */
|
|
9
|
+
onMoveStart: (event: MouseEvent & {
|
|
10
|
+
currentTarget: HTMLElement;
|
|
11
|
+
}) => void;
|
|
12
|
+
/** Press on the bottom-right corner handle (proportional resize). */
|
|
13
|
+
onResizeStart: (event: MouseEvent & {
|
|
14
|
+
currentTarget: HTMLElement;
|
|
15
|
+
}) => void;
|
|
16
|
+
}
|
|
17
|
+
/**
|
|
18
|
+
* Word-style table handles: a move grip at the top-left and a resize grip at
|
|
19
|
+
* the bottom-right, shown while the caret is inside a table. Positioned in the
|
|
20
|
+
* same surface-relative content space as the image/text-box selection overlay.
|
|
21
|
+
*/
|
|
22
|
+
export declare function TableHandlesOverlay(props: TableHandlesOverlayProps): JSX.Element;
|