oasis-editor 0.0.12 → 0.0.13

package/dist/ui/OasisEditorEditor.d.ts

@@ -2,7 +2,7 @@ import { Accessor, JSX } from '../solid-js';
 import { ToolbarHost } from '../components/Toolbar/state/createToolbarApi.js';
 import { EditorLayoutParagraph, EditorState } from '../../core/model.js';
 import { ImportProgressState } from '../../app/controllers/useEditorDocumentIO.js';
-import { CaretBox, InputBox, LayoutOptionsOverlay, RevisionBox, SelectedImageBox, SelectedTextBoxBox, SelectionBox } from '../editorUiTypes.js';
+import { CaretBox, CommentHighlightBox, InputBox, LayoutOptionsOverlay, RevisionBox, SelectedImageBox, SelectedTextBoxBox, SelectionBox } from '../editorUiTypes.js';
 import { ResizeHandleDirection } from '../resizeGeometry.js';
 
 type ImportProgress = ImportProgressState;
@@ -17,6 +17,7 @@ export interface OasisEditorEditorLayoutProps {
 }
 export interface OasisEditorEditorOverlayProps {
     selectionBoxes: Accessor<SelectionBox[]>;
+    commentHighlights: Accessor<CommentHighlightBox[]>;
     selectedImageBox: Accessor<SelectedImageBox | null>;
     selectedTextBoxBox: Accessor<SelectedTextBoxBox | null>;
     caretBox: Accessor<CaretBox>;

package/dist/ui/app/buildEditorViewProps.d.ts

@@ -1,5 +1,5 @@
 import { Accessor, JSX } from '../../solid-js';
-import { CaretBox, InputBox, LayoutOptionsOverlay, RevisionBox, SelectedImageBox, SelectedTextBoxBox, SelectionBox } from '../../../editorUiTypes.js';
+import { CaretBox, CommentHighlightBox, InputBox, LayoutOptionsOverlay, RevisionBox, SelectedImageBox, SelectedTextBoxBox, SelectionBox } from '../../../editorUiTypes.js';
 import { OasisEditorEditorFileHandlers, OasisEditorEditorInputHandlers, OasisEditorEditorLayoutProps, OasisEditorEditorOverlayProps, OasisEditorEditorRefProps, OasisEditorEditorSurfaceHandlers } from '../../../OasisEditorEditor.js';
 import { createEditorFocusController } from '../../useEditorFocus.js';
 import { createEditorSurfaceEvents } from '../../../../app/controllers/useEditorSurfaceEvents.js';
@@ -20,6 +20,7 @@ export interface EditorViewPropsContext {
     className: string | undefined;
     style: JSX.CSSProperties | undefined;
     selectionBoxes: Accessor<SelectionBox[]>;
+    commentHighlights: Accessor<CommentHighlightBox[]>;
     selectedImageBox: Accessor<SelectedImageBox | null>;
     selectedTextBoxBox: Accessor<SelectedTextBoxBox | null>;
     layoutOptions: LayoutOptionsOverlay;

package/dist/ui/canvas/CanvasCommentGeometry.d.ts

@@ -0,0 +1,13 @@
+import { EditorState } from '../../../../core/model.js';
+import { CommentHighlightBox } from '../../../editorUiTypes.js';
+import { CanvasLayoutSnapshot } from '../../CanvasLayoutSnapshot.js';
+
+/**
+ * Project each document comment's start/end anchors into highlight rectangles
+ * over the commented text, reusing the canvas layout snapshot's per-line slot
+ * positions (the same machinery `computeCanvasSelectionGeometry` uses for the
+ * live selection). Multi-line and cross-paragraph comments yield one box per
+ * covered line; every box carries its `commentId` so the overlay can group them
+ * and resolve the popup body on hover.
+ */
+export declare function computeCommentHighlights(snapshot: CanvasLayoutSnapshot, state: EditorState): CommentHighlightBox[];

package/dist/ui/components/CommentHighlightOverlay.d.ts

@@ -0,0 +1,16 @@
+import { Accessor } from '../../solid-js';
+import { EditorComment } from '../../../../core/model.js';
+import { CommentHighlightBox } from '../../../editorUiTypes.js';
+
+export interface CommentHighlightOverlayProps {
+    boxes: Accessor<CommentHighlightBox[]>;
+    /** Comment bodies keyed by their editor-local id, for the hover popup. */
+    commentsById: Accessor<Record<string, EditorComment>>;
+}
+/**
+ * Renders the highlight rectangles over commented text and, on hover/click of a
+ * highlight, a small popup with the comment's author/date/text (mirroring the
+ * track-changes `RevisionOverlay`). Hit-testing happens on the overlay divs
+ * themselves (`pointer-events: auto`), so no canvas hit-test plumbing is needed.
+ */
+export declare function CommentHighlightOverlay(props: CommentHighlightOverlayProps): import("solid-js").JSX.Element;

package/dist/ui/editorUiTypes.d.ts

@@ -48,6 +48,14 @@ export interface RevisionBox {
     left: number;
     top: number;
 }
+/** One highlight rectangle over a commented text range, tagged with its id. */
+export interface CommentHighlightBox {
+    commentId: string;
+    left: number;
+    top: number;
+    width: number;
+    height: number;
+}
 /**
  * State and actions backing the Word-style "Layout Options" popup for the
  * selected image or text box.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "oasis-editor",
-  "version": "0.0.12",
+  "version": "0.0.13",
   "type": "module",
   "repository": {
     "type": "git",