@semiont/react-ui 0.2.33-build.82 → 0.2.33-build.83

package/dist/index.mjs

@@ -1,22 +1,32 @@
 'use client';
+import {
+  HOVER_DELAY_MS,
+  createHoverHandlers,
+  useAttentionFlow,
+  useEventSubscription,
+  useEventSubscriptions,
+  useHoverEmitter
+} from "./chunk-FC6SGLLT.mjs";
 import {
   AVAILABLE_LOCALES,
   ApiClientProvider,
-  EventBusProvider,
   OpenResourcesProvider,
   SessionProvider,
   ToastContainer,
   ToastProvider,
   TranslationProvider,
-  resetEventBusForTesting,
   useApiClient,
-  useEventBus,
   useOpenResources,
   usePreloadTranslations,
   useSessionContext,
   useToast,
   useTranslations
-} from "./chunk-QB52Q7EQ.mjs";
+} from "./chunk-YPYLOBA2.mjs";
+import {
+  EventBusProvider,
+  resetEventBusForTesting,
+  useEventBus
+} from "./chunk-XS27QKGP.mjs";
 import "./chunk-D7NBW4RV.mjs";
 import {
   __commonJS,
@@ -18930,59 +18940,8 @@ function useCacheManager() {
   return context;
 }
 
-// src/contexts/useEventSubscription.ts
-import { useEffect as useEffect10, useRef as useRef7, useMemo } from "react";
-function useEventSubscription(eventName, handler) {
-  const eventBus = useEventBus();
-  const handlerRef = useRef7(handler);
-  useEffect10(() => {
-    handlerRef.current = handler;
-  });
-  useEffect10(() => {
-    const stableHandler = (payload) => {
-      handlerRef.current(payload);
-    };
-    eventBus.on(eventName, stableHandler);
-    return () => {
-      eventBus.off(eventName, stableHandler);
-    };
-  }, [eventName]);
-}
-function useEventSubscriptions(subscriptions) {
-  const eventBus = useEventBus();
-  const handlersRef = useRef7(subscriptions);
-  useEffect10(() => {
-    handlersRef.current = subscriptions;
-  });
-  const eventNames = useMemo(
-    () => Object.keys(subscriptions).sort(),
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [Object.keys(subscriptions).sort().join(",")]
-  );
-  useEffect10(() => {
-    const stableHandlers = /* @__PURE__ */ new Map();
-    for (const eventName of eventNames) {
-      const stableHandler = (payload) => {
-        const currentHandler = handlersRef.current[eventName];
-        if (currentHandler) {
-          currentHandler(payload);
-        } else {
-          console.warn("[useEventSubscriptions] No current handler found for:", eventName);
-        }
-      };
-      stableHandlers.set(eventName, stableHandler);
-      eventBus.on(eventName, stableHandler);
-    }
-    return () => {
-      for (const [eventName, stableHandler] of stableHandlers) {
-        eventBus.off(eventName, stableHandler);
-      }
-    };
-  }, [eventNames]);
-}
-
 // src/contexts/ResourceAnnotationsContext.tsx
-import { createContext as createContext6, useContext as useContext6, useState as useState9, useCallback as useCallback9, useMemo as useMemo2 } from "react";
+import { createContext as createContext6, useContext as useContext6, useState as useState9, useCallback as useCallback9, useMemo } from "react";
 
 // src/components/LiveRegion.tsx
 import { useState as useState8, createContext as createContext5, useContext as useContext5, useCallback as useCallback8 } from "react";
@@ -19198,7 +19157,7 @@ function ResourceAnnotationsProvider({ children }) {
       });
     }, 6e3);
   }, []);
-  const contextValue = useMemo2(
+  const contextValue = useMemo(
     () => ({
       newAnnotationIds,
       createAnnotation,
@@ -19218,7 +19177,7 @@ function useResourceAnnotations() {
 }
 
 // src/components/CodeMirrorRenderer.tsx
-import { useEffect as useEffect11, useRef as useRef8 } from "react";
+import { useEffect as useEffect10, useRef as useRef7 } from "react";
 
 // ../../node_modules/@codemirror/autocomplete/dist/index.js
 var CompletionContext = class {
@@ -26693,18 +26652,18 @@ function CodeMirrorRenderer({
   getTargetDocumentName,
   generatingReferenceId
 }) {
-  const containerRef = useRef8(null);
-  const viewRef = useRef8(null);
-  const contentRef = useRef8(content4);
+  const containerRef = useRef7(null);
+  const viewRef = useRef7(null);
+  const contentRef = useRef7(content4);
   const convertedSegments = convertSegmentPositions(segments, content4);
-  const segmentsRef = useRef8(convertedSegments);
-  const lineNumbersCompartment = useRef8(new Compartment());
-  const eventBusRef = useRef8(eventBus);
-  const getTargetDocumentNameRef = useRef8(getTargetDocumentName);
+  const segmentsRef = useRef7(convertedSegments);
+  const lineNumbersCompartment = useRef7(new Compartment());
+  const eventBusRef = useRef7(eventBus);
+  const getTargetDocumentNameRef = useRef7(getTargetDocumentName);
   segmentsRef.current = segments;
   eventBusRef.current = eventBus;
   getTargetDocumentNameRef.current = getTargetDocumentName;
-  useEffect11(() => {
+  useEffect10(() => {
     if (!containerRef.current || viewRef.current) return;
     const annotationDecorationsField = createAnnotationDecorationsField();
     const state = EditorState.create({
@@ -26794,31 +26753,31 @@ function CodeMirrorRenderer({
     contentRef.current = content4;
     containerRef.current.__cmView = view;
     const container = view.dom;
+    const { handleMouseEnter, handleMouseLeave, cleanup: cleanupHover } = createHoverHandlers(
+      (annotationId) => eventBusRef.current?.emit("annotation:hover", { annotationId })
+    );
     const handleMouseOver = (e6) => {
       const target = e6.target;
       const annotationElement = target.closest("[data-annotation-id]");
       const annotationId = annotationElement?.getAttribute("data-annotation-id");
-      if (annotationId && eventBusRef.current) {
-        eventBusRef.current.emit("annotation:hover", { annotationId });
-      }
+      if (annotationId) handleMouseEnter(annotationId);
     };
     const handleMouseOut = (e6) => {
       const target = e6.target;
       const annotationElement = target.closest("[data-annotation-id]");
-      if (annotationElement && eventBusRef.current) {
-        eventBusRef.current.emit("annotation:hover", { annotationId: null });
-      }
+      if (annotationElement) handleMouseLeave();
     };
     container.addEventListener("mouseover", handleMouseOver);
     container.addEventListener("mouseout", handleMouseOut);
     return () => {
       container.removeEventListener("mouseover", handleMouseOver);
       container.removeEventListener("mouseout", handleMouseOut);
+      cleanupHover();
       view.destroy();
       viewRef.current = null;
     };
   }, []);
-  useEffect11(() => {
+  useEffect10(() => {
     if (!viewRef.current) return;
     const currentContent = viewRef.current.state.doc.toString();
     if (content4 === currentContent) return;
@@ -26834,19 +26793,19 @@ function CodeMirrorRenderer({
     });
     contentRef.current = content4;
   }, [content4]);
-  useEffect11(() => {
+  useEffect10(() => {
     if (!viewRef.current) return;
     viewRef.current.dispatch({
       effects: lineNumbersCompartment.current.reconfigure(showLineNumbers ? lineNumbers() : [])
     });
   }, [showLineNumbers]);
-  useEffect11(() => {
+  useEffect10(() => {
     if (!viewRef.current) return;
     viewRef.current.dispatch({
       effects: updateAnnotationsEffect.of({ segments: convertedSegments, ...newAnnotationIds && { newAnnotationIds } })
     });
   }, [convertedSegments, newAnnotationIds]);
-  useEffect11(() => {
+  useEffect10(() => {
     if (!viewRef.current || !enableWidgets) return;
     viewRef.current.dispatch({
       effects: updateWidgetsEffect.of({
@@ -26858,7 +26817,7 @@ function CodeMirrorRenderer({
       })
     });
   }, [content4, convertedSegments, enableWidgets, generatingReferenceId]);
-  useEffect11(() => {
+  useEffect10(() => {
     if (!viewRef.current || !hoveredAnnotationId) return void 0;
     const view = viewRef.current;
     const element2 = view.contentDOM.querySelector(
@@ -26886,7 +26845,7 @@ function CodeMirrorRenderer({
       element2.classList.remove("annotation-pulse");
     };
   }, [hoveredAnnotationId]);
-  useEffect11(() => {
+  useEffect10(() => {
     if (!viewRef.current || !hoveredCommentId) return void 0;
     const view = viewRef.current;
     const element2 = view.contentDOM.querySelector(
@@ -26914,7 +26873,7 @@ function CodeMirrorRenderer({
       element2.classList.remove("annotation-pulse");
     };
   }, [hoveredCommentId]);
-  useEffect11(() => {
+  useEffect10(() => {
     if (!viewRef.current || !scrollToAnnotationId) return;
     const view = viewRef.current;
     const element2 = view.contentDOM.querySelector(
@@ -27113,7 +27072,7 @@ function AsyncErrorBoundary({ children }) {
 }
 
 // src/components/ResizeHandle.tsx
-import { useRef as useRef9, useCallback as useCallback10, useEffect as useEffect12, useState as useState10 } from "react";
+import { useRef as useRef8, useCallback as useCallback10, useEffect as useEffect11, useState as useState10 } from "react";
 import { jsx as jsx11 } from "react/jsx-runtime";
 function ResizeHandle({
   onResize,
@@ -27123,10 +27082,10 @@ function ResizeHandle({
   ariaLabel = "Resize panel"
 }) {
   const [isDragging, setIsDragging] = useState10(false);
-  const startXRef = useRef9(0);
-  const startWidthRef = useRef9(0);
-  const onResizeRef = useRef9(onResize);
-  useEffect12(() => {
+  const startXRef = useRef8(0);
+  const startWidthRef = useRef8(0);
+  const onResizeRef = useRef8(onResize);
+  useEffect11(() => {
     onResizeRef.current = onResize;
   });
   const handleMouseDown = useCallback10((e6) => {
@@ -27177,7 +27136,7 @@ function ResizeHandle({
       onResizeRef.current(constrainedWidth);
     }
   }, [minWidth, maxWidth, position3]);
-  useEffect12(() => {
+  useEffect11(() => {
     if (isDragging) {
       document.addEventListener("mousemove", handleMouseMove);
       document.addEventListener("mouseup", handleMouseUp);
@@ -27335,7 +27294,7 @@ function Toolbar({
 }
 
 // src/components/settings/SettingsPanel.tsx
-import React6, { useEffect as useEffect13 } from "react";
+import React6, { useEffect as useEffect12 } from "react";
 import { LOCALES } from "@semiont/api-client";
 import { jsx as jsx14, jsxs as jsxs5 } from "react/jsx-runtime";
 function SettingsPanel({
@@ -27353,7 +27312,7 @@ function SettingsPanel({
     announceLanguageChanging(localeName);
     eventBus.emit("settings:locale-changed", { locale: newLocale });
   };
-  useEffect13(() => {
+  useEffect12(() => {
     if (locale !== previousLocale && !isPendingLocaleChange) {
       const localeName = LOCALES.find((l10) => l10.code === locale)?.nativeName || locale;
       announceLanguageChanged(localeName);
@@ -27450,7 +27409,7 @@ function SettingsPanel({
 }
 
 // src/components/annotation/AnnotateToolbar.tsx
-import React7, { useState as useState11, useRef as useRef10, useEffect as useEffect14 } from "react";
+import React7, { useState as useState11, useRef as useRef9, useEffect as useEffect13 } from "react";
 import { Fragment as Fragment2, jsx as jsx15, jsxs as jsxs6 } from "react/jsx-runtime";
 function DropdownGroup({
   label,
@@ -27461,7 +27420,7 @@ function DropdownGroup({
   onPin,
   containerRef
 }) {
-  const dropdownRef = useRef10(null);
+  const dropdownRef = useRef9(null);
   const handleKeyDown = (event) => {
     if (event.key === "Enter" || event.key === " ") {
       event.preventDefault();
@@ -27532,15 +27491,15 @@ function AnnotateToolbar({
   const [selectionPinned, setSelectionPinned] = useState11(false);
   const [shapeHovered, setShapeHovered] = useState11(false);
   const [shapePinned, setShapePinned] = useState11(false);
-  const modeRef = useRef10(null);
-  const clickRef = useRef10(null);
-  const selectionRef = useRef10(null);
-  const shapeRef = useRef10(null);
+  const modeRef = useRef9(null);
+  const clickRef = useRef9(null);
+  const selectionRef = useRef9(null);
+  const shapeRef = useRef9(null);
   const modeExpanded = modeHovered || modePinned;
   const clickExpanded = clickHovered || clickPinned;
   const selectionExpanded = selectionHovered || selectionPinned;
   const shapeExpanded = shapeHovered || shapePinned;
-  useEffect14(() => {
+  useEffect13(() => {
     const handleClickOutside = (event) => {
       if (modePinned && modeRef.current && !modeRef.current.contains(event.target)) {
         setModePinned(false);
@@ -27558,7 +27517,7 @@ function AnnotateToolbar({
     document.addEventListener("mousedown", handleClickOutside);
     return () => document.removeEventListener("mousedown", handleClickOutside);
   }, [modePinned, clickPinned, selectionPinned, shapePinned]);
-  useEffect14(() => {
+  useEffect13(() => {
     const handleEscape = (event) => {
       if (event.key === "Escape") {
         setModePinned(false);
@@ -27658,10 +27617,17 @@ function AnnotateToolbar({
         onHoverChange: setClickHovered,
         onPin: () => setClickPinned(!clickPinned),
         containerRef: clickRef,
-        collapsedContent: /* @__PURE__ */ jsxs6("div", { className: "semiont-dropdown-display", children: [
-          /* @__PURE__ */ jsx15("span", { className: "semiont-dropdown-icon", children: clickActions.find((a15) => a15.action === selectedClick)?.icon }),
-          /* @__PURE__ */ jsx15("span", { className: "semiont-dropdown-label", children: clickActions.find((a15) => a15.action === selectedClick)?.label })
-        ] }),
+        collapsedContent: /* @__PURE__ */ jsxs6(
+          "div",
+          {
+            className: "semiont-dropdown-display",
+            "data-delete": clickActions.find((a15) => a15.action === selectedClick)?.isDelete ? "true" : "false",
+            children: [
+              /* @__PURE__ */ jsx15("span", { className: "semiont-dropdown-icon", children: clickActions.find((a15) => a15.action === selectedClick)?.icon }),
+              /* @__PURE__ */ jsx15("span", { className: "semiont-dropdown-label", children: clickActions.find((a15) => a15.action === selectedClick)?.label })
+            ]
+          }
+        ),
         expandedContent: /* @__PURE__ */ jsx15(Fragment2, { children: clickActions.map(({ action, icon, label, isDelete }) => /* @__PURE__ */ jsx15(React7.Fragment, { children: renderButton(icon, label, selectedClick === action, () => handleClickClick(action), isDelete) }, action)) })
       }
     ),
@@ -27733,7 +27699,7 @@ function AnnotateToolbar({
 }
 
 // src/components/annotation-popups/JsonLdView.tsx
-import { useEffect as useEffect15, useRef as useRef11 } from "react";
+import { useEffect as useEffect14, useRef as useRef10 } from "react";
 
 // ../../node_modules/@lezer/json/dist/index.js
 var jsonHighlighting = styleTags({
@@ -27937,14 +27903,14 @@ var oneDark = [oneDarkTheme, /* @__PURE__ */ syntaxHighlighting(oneDarkHighlight
 // src/components/annotation-popups/JsonLdView.tsx
 import { jsx as jsx16, jsxs as jsxs7 } from "react/jsx-runtime";
 function JsonLdView({ annotation, onBack }) {
-  const editorRef = useRef11(null);
-  const viewRef = useRef11(null);
+  const editorRef = useRef10(null);
+  const viewRef = useRef10(null);
   const { showLineNumbers } = useLineNumbers();
-  const onBackRef = useRef11(onBack);
-  useEffect15(() => {
+  const onBackRef = useRef10(onBack);
+  useEffect14(() => {
     onBackRef.current = onBack;
   });
-  useEffect15(() => {
+  useEffect14(() => {
     const handleKeyDown = (e6) => {
       if (e6.key === "Escape") {
         onBackRef.current();
@@ -27953,7 +27919,7 @@ function JsonLdView({ annotation, onBack }) {
     window.addEventListener("keydown", handleKeyDown);
     return () => window.removeEventListener("keydown", handleKeyDown);
   }, []);
-  useEffect15(() => {
+  useEffect14(() => {
     if (!editorRef.current) return;
     const isDarkMode = document.documentElement.classList.contains("dark");
     const jsonContent = JSON.stringify(annotation, null, 2);
@@ -29623,7 +29589,7 @@ function PopupContainer({ children, position: position3, onClose, isOpen, wide =
 }
 
 // src/components/image-annotation/AnnotationOverlay.tsx
-import { useRef as useRef12 } from "react";
+import { useMemo as useMemo2 } from "react";
 import { getSvgSelector, isHighlight as isHighlight3, isReference as isReference3, isAssessment as isAssessment2, isComment as isComment3, isTag as isTag4, isBodyResolved, isResolvedReference as isResolvedReference3 } from "@semiont/api-client";
 import { parseSvgSelector } from "@semiont/api-client";
 import { jsx as jsx18, jsxs as jsxs9 } from "react/jsx-runtime";
@@ -29669,19 +29635,10 @@ function AnnotationOverlay({
 }) {
   const scaleX = displayWidth / imageWidth;
   const scaleY = displayHeight / imageHeight;
-  const currentHover = useRef12(null);
-  const handleMouseEnter = (annotationId) => {
-    if (currentHover.current !== annotationId) {
-      currentHover.current = annotationId;
-      eventBus?.emit("annotation:hover", { annotationId });
-    }
-  };
-  const handleMouseLeave = () => {
-    if (currentHover.current !== null) {
-      currentHover.current = null;
-      eventBus?.emit("annotation:hover", { annotationId: null });
-    }
-  };
+  const { handleMouseEnter, handleMouseLeave } = useMemo2(
+    () => createHoverHandlers((annotationId) => eventBus?.emit("annotation:hover", { annotationId })),
+    [eventBus]
+  );
   return /* @__PURE__ */ jsx18(
     "svg",
     {
@@ -29847,7 +29804,7 @@ function AnnotationOverlay({
 }
 
 // src/components/image-annotation/SvgDrawingCanvas.tsx
-import { useRef as useRef13, useState as useState13, useEffect as useEffect17, useCallback as useCallback11, useMemo as useMemo3 } from "react";
+import { useRef as useRef11, useState as useState13, useEffect as useEffect16, useCallback as useCallback11, useMemo as useMemo3 } from "react";
 import { createRectangleSvg, createCircleSvg, createPolygonSvg, scaleSvgToNative, parseSvgSelector as parseSvgSelector2 } from "@semiont/api-client";
 import { jsx as jsx19, jsxs as jsxs10 } from "react/jsx-runtime";
 function getMotivationColor(motivation) {
@@ -29884,14 +29841,14 @@ function SvgDrawingCanvas({
     const resourceId = resourceUri2.split("/").pop();
     return `/api/resources/${resourceId}`;
   }, [resourceUri2]);
-  const containerRef = useRef13(null);
-  const imageRef = useRef13(null);
+  const containerRef = useRef11(null);
+  const imageRef = useRef11(null);
   const [imageDimensions, setImageDimensions] = useState13(null);
   const [displayDimensions, setDisplayDimensions] = useState13(null);
   const [isDrawing, setIsDrawing] = useState13(false);
   const [startPoint, setStartPoint] = useState13(null);
   const [currentPoint, setCurrentPoint] = useState13(null);
-  useEffect17(() => {
+  useEffect16(() => {
     const img = new Image();
     img.onload = () => {
       setImageDimensions({
@@ -29901,7 +29858,7 @@ function SvgDrawingCanvas({
     };
     img.src = imageUrl;
   }, [imageUrl]);
-  useEffect17(() => {
+  useEffect16(() => {
     const updateDisplayDimensions = () => {
       if (imageRef.current) {
         setDisplayDimensions({
@@ -30337,7 +30294,7 @@ function KeyboardShortcutsHelpModal({ isOpen, onClose }) {
 }
 
 // src/components/modals/ProposeEntitiesModal.tsx
-import { useEffect as useEffect18, useState as useState14, Fragment as Fragment5 } from "react";
+import { useEffect as useEffect17, useState as useState14, Fragment as Fragment5 } from "react";
 import { jsx as jsx21, jsxs as jsxs12 } from "react/jsx-runtime";
 var STORAGE_KEY = "userPreferredEntityTypes";
 function ProposeEntitiesModal({
@@ -30349,7 +30306,7 @@ function ProposeEntitiesModal({
   const entityTypesAPI = useEntityTypes();
   const { data: entityTypesData } = entityTypesAPI.list.useQuery();
   const allEntityTypes = entityTypesData?.entityTypes || [];
-  useEffect18(() => {
+  useEffect17(() => {
     if (isOpen) {
       try {
         const saved = sessionStorage.getItem(STORAGE_KEY);
@@ -30459,11 +30416,11 @@ function ProposeEntitiesModal({
 }
 
 // src/components/resource/AnnotateView.tsx
-import { useRef as useRef14, useEffect as useEffect19, useCallback as useCallback12, lazy, Suspense } from "react";
+import { useRef as useRef12, useEffect as useEffect18, useCallback as useCallback12, lazy, Suspense } from "react";
 import { getTextPositionSelector, getTextQuoteSelector, getTargetSelector, getMimeCategory, isPdfMimeType as isPdfMimeType2, resourceUri as toResourceUri } from "@semiont/api-client";
 import { findTextWithContext } from "@semiont/api-client";
 import { jsx as jsx22, jsxs as jsxs13 } from "react/jsx-runtime";
-var PdfAnnotationCanvas = lazy(() => import("./PdfAnnotationCanvas.client-RAJRPQLU.mjs").then((mod) => ({ default: mod.PdfAnnotationCanvas })));
+var PdfAnnotationCanvas = lazy(() => import("./PdfAnnotationCanvas.client-FGV33CWN.mjs").then((mod) => ({ default: mod.PdfAnnotationCanvas })));
 function extractContext(content4, start2, end) {
   const CONTEXT_LENGTH = 32;
   const result = {};
@@ -30545,14 +30502,14 @@ function AnnotateView({
   annotateMode
 }) {
   const { newAnnotationIds } = useResourceAnnotations();
-  const containerRef = useRef14(null);
+  const containerRef = useRef12(null);
   const eventBus = useEventBus();
   const category = getMimeCategory(mimeType);
   const { highlights, references, assessments, comments, tags: tags3 } = annotations;
   const allAnnotations = [...highlights, ...references, ...assessments, ...comments, ...tags3];
   const segments = segmentTextWithAnnotations(content4, allAnnotations);
   const { selectedMotivation, selectedClick, selectedShape, hoveredAnnotationId, hoveredCommentId, scrollToAnnotationId } = uiState;
-  const onUIStateChangeRef = useRef14(onUIStateChange);
+  const onUIStateChangeRef = useRef12(onUIStateChange);
   onUIStateChangeRef.current = onUIStateChange;
   const handleToolbarSelectionChanged = useCallback12(({ motivation }) => {
     onUIStateChangeRef.current?.({ selectedMotivation: motivation });
@@ -30572,7 +30529,7 @@ function AnnotateView({
     "toolbar:shape-changed": handleToolbarShapeChanged,
     "annotation:hover": handleAnnotationHover
   });
-  useEffect19(() => {
+  useEffect18(() => {
     const container = containerRef.current;
     if (!container) return;
     let clickedOnAnnotation = false;
@@ -30769,11 +30726,11 @@ function AnnotateView({
 }
 
 // src/components/resource/AnnotationHistory.tsx
-import { useEffect as useEffect21, useRef as useRef16 } from "react";
+import { useEffect as useEffect20, useRef as useRef14 } from "react";
 import { getAnnotationUriFromEvent as getAnnotationUriFromEvent2 } from "@semiont/core";
 
 // src/components/resource/HistoryEvent.tsx
-import { useRef as useRef15, useCallback as useCallback13, useEffect as useEffect20 } from "react";
+import { useRef as useRef13, useCallback as useCallback13, useEffect as useEffect19 } from "react";
 import { getAnnotationUriFromEvent } from "@semiont/core";
 
 // src/components/resource/event-formatting.ts
@@ -31013,9 +30970,9 @@ function HistoryEvent({
   const annotationUri2 = getAnnotationUriFromEvent(event);
   const creationDetails = getResourceCreationDetails(event);
   const entityTypes = getEventEntityTypes(event);
-  const hoverTimeoutRef = useRef15(null);
-  const onEventHoverRef = useRef15(onEventHover);
-  useEffect20(() => {
+  const hoverTimeoutRef = useRef13(null);
+  const onEventHoverRef = useRef13(onEventHover);
+  useEffect19(() => {
     onEventHoverRef.current = onEventHover;
   });
   const handleEmojiMouseEnter = useCallback13(() => {
@@ -31119,15 +31076,15 @@ function AnnotationHistory({ rUri, hoveredAnnotationId, onEventHover, onEventCli
   const { data: eventsData, isLoading: loading, isError: error } = resources.events.useQuery(rUri);
   const { data: annotationsData } = resources.annotations.useQuery(rUri);
   const annotations = annotationsData?.annotations || [];
-  const eventRefs = useRef16(/* @__PURE__ */ new Map());
-  const containerRef = useRef16(null);
+  const eventRefs = useRef14(/* @__PURE__ */ new Map());
+  const containerRef = useRef14(null);
   const events2 = !eventsData?.events ? [] : [...eventsData.events].filter((e6) => {
     const eventType = e6.event.type;
     return eventType !== "job.started" && eventType !== "job.progress" && eventType !== "job.completed";
   }).sort(
     (a15, b8) => a15.metadata.sequenceNumber - b8.metadata.sequenceNumber
   );
-  useEffect21(() => {
+  useEffect20(() => {
     if (containerRef.current && events2.length > 0) {
       requestAnimationFrame(() => {
         if (containerRef.current) {
@@ -31136,7 +31093,7 @@ function AnnotationHistory({ rUri, hoveredAnnotationId, onEventHover, onEventCli
       });
     }
   }, [events2.length]);
-  useEffect21(() => {
+  useEffect20(() => {
     if (!hoveredAnnotationId) return;
     const eventElement = eventRefs.current.get(hoveredAnnotationId);
     if (eventElement && containerRef.current) {
@@ -31194,7 +31151,7 @@ function AnnotationHistory({ rUri, hoveredAnnotationId, onEventHover, onEventCli
 }
 
 // src/components/resource/BrowseView.tsx
-import { useEffect as useEffect23, useRef as useRef17, useCallback as useCallback14, lazy as lazy2, Suspense as Suspense2 } from "react";
+import { useEffect as useEffect22, useRef as useRef15, useCallback as useCallback14, lazy as lazy2, Suspense as Suspense2 } from "react";
 
 // ../../node_modules/devlop/lib/default.js
 function ok2() {
@@ -33069,7 +33026,7 @@ var urlAttributes = {
 
 // ../../node_modules/react-markdown/lib/index.js
 import { Fragment as Fragment6, jsx as jsx25, jsxs as jsxs16 } from "react/jsx-runtime";
-import { useEffect as useEffect22, useState as useState15 } from "react";
+import { useEffect as useEffect21, useState as useState15 } from "react";
 
 // ../../node_modules/mdast-util-to-string/lib/index.js
 var emptyOptions2 = {};
@@ -45527,7 +45484,7 @@ function ImageViewer({ resourceUri: resourceUri2, alt = "Resource image" }) {
 
 // src/components/resource/BrowseView.tsx
 import { jsx as jsx27, jsxs as jsxs17 } from "react/jsx-runtime";
-var PdfAnnotationCanvas2 = lazy2(() => import("./PdfAnnotationCanvas.client-RAJRPQLU.mjs").then((mod) => ({ default: mod.PdfAnnotationCanvas })));
+var PdfAnnotationCanvas2 = lazy2(() => import("./PdfAnnotationCanvas.client-FGV33CWN.mjs").then((mod) => ({ default: mod.PdfAnnotationCanvas })));
 function prepareAnnotations(annotations) {
   return annotations.map((ann) => {
     const targetSelector = getTargetSelector3(ann.target);
@@ -45557,12 +45514,12 @@ function BrowseView({
 }) {
   const { newAnnotationIds } = useResourceAnnotations();
   const eventBus = useEventBus();
-  const containerRef = useRef17(null);
+  const containerRef = useRef15(null);
   const category = getMimeCategory2(mimeType);
   const { highlights, references, assessments, comments, tags: tags3 } = annotations;
   const allAnnotations = [...highlights, ...references, ...assessments, ...comments, ...tags3];
   const preparedAnnotations = prepareAnnotations(allAnnotations);
-  useEffect23(() => {
+  useEffect22(() => {
     if (!containerRef.current) return;
     const container = containerRef.current;
     const handleClick = (e6) => {
@@ -45578,20 +45535,19 @@ function BrowseView({
         }
       }
     };
+    const { handleMouseEnter, handleMouseLeave, cleanup: cleanupHover } = createHoverHandlers(
+      (annotationId) => eventBus.emit("annotation:hover", { annotationId })
+    );
     const handleMouseOver = (e6) => {
       const target = e6.target;
       const annotationElement = target.closest("[data-annotation-id]");
       const annotationId = annotationElement?.getAttribute("data-annotation-id");
-      if (annotationId) {
-        eventBus.emit("annotation:hover", { annotationId });
-      }
+      if (annotationId) handleMouseEnter(annotationId);
     };
     const handleMouseOut = (e6) => {
       const target = e6.target;
       const annotationElement = target.closest("[data-annotation-id]");
-      if (annotationElement) {
-        eventBus.emit("annotation:hover", { annotationId: null });
-      }
+      if (annotationElement) handleMouseLeave();
     };
     if (newAnnotationIds) {
       const annotationSpans = container.querySelectorAll("[data-annotation-id]");
@@ -45609,6 +45565,7 @@ function BrowseView({
       container.removeEventListener("click", handleClick);
       container.removeEventListener("mouseover", handleMouseOver);
       container.removeEventListener("mouseout", handleMouseOut);
+      cleanupHover();
     };
   }, [content4, allAnnotations, newAnnotationIds]);
   const scrollToAnnotation = useCallback14((annotationId, removePulse = false) => {
@@ -45741,7 +45698,7 @@ function BrowseView({
 }
 
 // src/components/resource/ResourceViewer.tsx
-import { useState as useState16, useEffect as useEffect24, useCallback as useCallback15, useRef as useRef18 } from "react";
+import { useState as useState16, useEffect as useEffect23, useCallback as useCallback15, useRef as useRef16 } from "react";
 import { getExactText as getExactText3, getTargetSelector as getTargetSelector4, resourceUri, isHighlight as isHighlight4, isAssessment as isAssessment3, isReference as isReference4, isComment as isComment4, isTag as isTag5, getBodySource as getBodySource4 } from "@semiont/api-client";
 import { jsx as jsx28, jsxs as jsxs18 } from "react/jsx-runtime";
 function ResourceViewer({
@@ -45752,7 +45709,7 @@ function ResourceViewer({
   hoveredAnnotationId: hoveredAnnotationIdProp
 }) {
   const t12 = useTranslations("ResourceViewer");
-  const documentViewerRef = useRef18(null);
+  const documentViewerRef = useRef16(null);
   const eventBus = useEventBus();
   const navigate = useObservableExternalNavigation();
   const { highlights, references, assessments, comments, tags: tags3 } = annotations;
@@ -45774,7 +45731,7 @@ function ResourceViewer({
     }
     return false;
   });
-  useEffect24(() => {
+  useEffect23(() => {
     if (typeof window !== "undefined") {
       localStorage.setItem("annotateMode", annotateMode.toString());
     }
@@ -45831,20 +45788,20 @@ function ResourceViewer({
   const handleToolbarShapeChanged = useCallback15(({ shape }) => {
     setSelectedShape(shape);
   }, []);
-  useEffect24(() => {
+  useEffect23(() => {
     if (selectedMotivation === null) {
       localStorage.setItem("semiont-toolbar-selection", "null");
     } else {
       localStorage.setItem("semiont-toolbar-selection", selectedMotivation);
     }
   }, [selectedMotivation]);
-  useEffect24(() => {
+  useEffect23(() => {
     localStorage.setItem("semiont-toolbar-click", selectedClick);
   }, [selectedClick]);
-  useEffect24(() => {
+  useEffect23(() => {
     saveSelectedShapeForSelectorType(selectorType, selectedShape);
   }, [selectorType, selectedShape]);
-  useEffect24(() => {
+  useEffect23(() => {
     const shapeForType = getSelectedShapeForSelectorType(selectorType);
     if (shapeForType !== selectedShape) {
       setSelectedShape(shapeForType);
@@ -46095,6 +46052,7 @@ var AssessmentEntry = forwardRef(
     isHovered = false
   }, ref) {
     const eventBus = useEventBus();
+    const hoverProps = useHoverEmitter(assessment.id);
     const selectedText = getAnnotationExactText(assessment);
     const assessmentText = getAssessmentText(assessment);
     return /* @__PURE__ */ jsxs19(
@@ -46107,12 +46065,7 @@ var AssessmentEntry = forwardRef(
         onClick: () => {
           eventBus.emit("annotation:click", { annotationId: assessment.id, motivation: assessment.motivation });
         },
-        onMouseEnter: () => {
-          eventBus.emit("annotation:hover", { annotationId: assessment.id });
-        },
-        onMouseLeave: () => {
-          eventBus.emit("annotation:hover", { annotationId: null });
-        },
+        ...hoverProps,
         children: [
           selectedText && /* @__PURE__ */ jsxs19("div", { className: "semiont-annotation-entry__quote", "data-type": "assessment", children: [
             '"',
@@ -46134,11 +46087,11 @@ var AssessmentEntry = forwardRef(
 );
 
 // src/components/resource/panels/AssessmentPanel.tsx
-import { useState as useState18, useEffect as useEffect26, useRef as useRef19, useCallback as useCallback17, useMemo as useMemo4 } from "react";
+import { useState as useState18, useEffect as useEffect25, useRef as useRef17, useCallback as useCallback17, useMemo as useMemo4 } from "react";
 import { getTextPositionSelector as getTextPositionSelector3, getTargetSelector as getTargetSelector5 } from "@semiont/api-client";
 
 // src/components/resource/panels/DetectSection.tsx
-import { useState as useState17, useEffect as useEffect25, useCallback as useCallback16 } from "react";
+import { useState as useState17, useEffect as useEffect24, useCallback as useCallback16 } from "react";
 import { Fragment as Fragment7, jsx as jsx30, jsxs as jsxs20 } from "react/jsx-runtime";
 function DetectSection({
   annotationType,
@@ -46158,7 +46111,7 @@ function DetectSection({
     const stored = localStorage.getItem(`detect-section-expanded-${annotationType}`);
     return stored ? stored === "true" : true;
   });
-  useEffect25(() => {
+  useEffect24(() => {
     if (typeof window === "undefined") return;
     localStorage.setItem(`detect-section-expanded-${annotationType}`, String(isExpanded));
   }, [isExpanded, annotationType]);
@@ -46382,8 +46335,8 @@ function AssessmentPanel({
   const eventBus = useEventBus();
   const [newAssessmentText, setNewAssessmentText] = useState18("");
   const [focusedAnnotationId, setFocusedAnnotationId] = useState18(null);
-  const containerRef = useRef19(null);
-  const entryRefs = useRef19(/* @__PURE__ */ new Map());
+  const containerRef = useRef17(null);
+  const entryRefs = useRef17(/* @__PURE__ */ new Map());
   const sortedAnnotations = useMemo4(() => {
     return [...annotations].sort((a15, b8) => {
       const aSelector = getTextPositionSelector3(getTargetSelector5(a15.target));
@@ -46399,7 +46352,7 @@ function AssessmentPanel({
       entryRefs.current.delete(id2);
     }
   }, []);
-  useEffect26(() => {
+  useEffect25(() => {
     if (!scrollToAnnotationId) return;
     const element2 = entryRefs.current.get(scrollToAnnotationId);
     if (element2 && containerRef.current) {
@@ -46414,7 +46367,7 @@ function AssessmentPanel({
       if (onScrollCompleted) onScrollCompleted();
     }
   }, [scrollToAnnotationId]);
-  useEffect26(() => {
+  useEffect25(() => {
     if (!hoveredAnnotationId) return;
     const element2 = entryRefs.current.get(hoveredAnnotationId);
     if (!element2 || !containerRef.current) return;
@@ -46441,7 +46394,7 @@ function AssessmentPanel({
       setNewAssessmentText("");
     }
   };
-  useEffect26(() => {
+  useEffect25(() => {
     if (!pendingAnnotation) return;
     const handleEscape = (e6) => {
       if (e6.key === "Escape") {
@@ -46613,7 +46566,7 @@ function CollaborationPanel({
 }
 
 // src/components/resource/panels/CommentEntry.tsx
-import { useState as useState19, useEffect as useEffect27, useRef as useRef20, forwardRef as forwardRef2, useImperativeHandle } from "react";
+import { useState as useState19, useEffect as useEffect26, useRef as useRef18, forwardRef as forwardRef2, useImperativeHandle } from "react";
 import { getAnnotationExactText as getAnnotationExactText2, getCommentText } from "@semiont/api-client";
 import { jsx as jsx34, jsxs as jsxs24 } from "react/jsx-runtime";
 function formatRelativeTime3(isoString) {
@@ -46639,13 +46592,14 @@ var CommentEntry = forwardRef2(
   }, ref) {
     const t12 = useTranslations("CommentsPanel");
     const eventBus = useEventBus();
+    const hoverProps = useHoverEmitter(comment2.id);
     const [isEditing, setIsEditing] = useState19(false);
     const [editText, setEditText] = useState19("");
-    const internalRef = useRef20(null);
+    const internalRef = useRef18(null);
     useImperativeHandle(ref, () => internalRef.current);
     const commentText = getCommentText(comment2) || "";
     const selectedText = getAnnotationExactText2(comment2);
-    useEffect27(() => {
+    useEffect26(() => {
       if (isFocused && internalRef.current) {
         internalRef.current.scrollIntoView({
           behavior: "smooth",
@@ -46674,12 +46628,7 @@ var CommentEntry = forwardRef2(
         onClick: () => {
           eventBus.emit("annotation:click", { annotationId: comment2.id, motivation: comment2.motivation });
         },
-        onMouseEnter: () => {
-          eventBus.emit("annotation:hover", { annotationId: comment2.id });
-        },
-        onMouseLeave: () => {
-          eventBus.emit("annotation:hover", { annotationId: null });
-        },
+        ...hoverProps,
         children: [
           selectedText && /* @__PURE__ */ jsxs24("div", { className: "semiont-annotation-entry__quote", "data-type": "comment", children: [
             '"',
@@ -46749,7 +46698,7 @@ var CommentEntry = forwardRef2(
 );
 
 // src/components/resource/panels/CommentsPanel.tsx
-import { useState as useState20, useEffect as useEffect28, useRef as useRef21, useCallback as useCallback18, useMemo as useMemo5 } from "react";
+import { useState as useState20, useEffect as useEffect27, useRef as useRef19, useCallback as useCallback18, useMemo as useMemo5 } from "react";
 import { getTextPositionSelector as getTextPositionSelector4, getTargetSelector as getTargetSelector6 } from "@semiont/api-client";
 import { jsx as jsx35, jsxs as jsxs25 } from "react/jsx-runtime";
 function getSelectorDisplayText2(selector) {
@@ -46779,8 +46728,8 @@ function CommentsPanel({
   const eventBus = useEventBus();
   const [newCommentText, setNewCommentText] = useState20("");
   const [focusedAnnotationId, setFocusedAnnotationId] = useState20(null);
-  const containerRef = useRef21(null);
-  const entryRefs = useRef21(/* @__PURE__ */ new Map());
+  const containerRef = useRef19(null);
+  const entryRefs = useRef19(/* @__PURE__ */ new Map());
   const sortedAnnotations = useMemo5(() => {
     return [...annotations].sort((a15, b8) => {
       const aSelector = getTextPositionSelector4(getTargetSelector6(a15.target));
@@ -46796,7 +46745,7 @@ function CommentsPanel({
       entryRefs.current.delete(id2);
     }
   }, []);
-  useEffect28(() => {
+  useEffect27(() => {
     if (!scrollToAnnotationId) return;
     const element2 = entryRefs.current.get(scrollToAnnotationId);
     if (element2 && containerRef.current) {
@@ -46813,7 +46762,7 @@ function CommentsPanel({
       }
     }
   }, [scrollToAnnotationId]);
-  useEffect28(() => {
+  useEffect27(() => {
     if (!hoveredAnnotationId) return;
     const element2 = entryRefs.current.get(hoveredAnnotationId);
     if (!element2 || !containerRef.current) return;
@@ -46846,7 +46795,7 @@ function CommentsPanel({
       setNewCommentText("");
     }
   };
-  useEffect28(() => {
+  useEffect27(() => {
     if (!pendingAnnotation) return;
     const handleEscape = (e6) => {
       if (e6.key === "Escape") {
@@ -46959,6 +46908,7 @@ var HighlightEntry = forwardRef3(
     isHovered = false
   }, ref) {
     const eventBus = useEventBus();
+    const hoverProps = useHoverEmitter(highlight.id);
     const selectedText = getAnnotationExactText3(highlight);
     return /* @__PURE__ */ jsxs26(
       "div",
@@ -46970,12 +46920,7 @@ var HighlightEntry = forwardRef3(
         onClick: () => {
           eventBus.emit("annotation:click", { annotationId: highlight.id, motivation: highlight.motivation });
         },
-        onMouseEnter: () => {
-          eventBus.emit("annotation:hover", { annotationId: highlight.id });
-        },
-        onMouseLeave: () => {
-          eventBus.emit("annotation:hover", { annotationId: null });
-        },
+        ...hoverProps,
         children: [
           selectedText && /* @__PURE__ */ jsxs26("div", { className: "semiont-annotation-entry__quote", "data-type": "highlight", children: [
             '"',
@@ -46996,7 +46941,7 @@ var HighlightEntry = forwardRef3(
 );
 
 // src/components/resource/panels/HighlightPanel.tsx
-import { useEffect as useEffect29, useState as useState21, useRef as useRef22, useCallback as useCallback19, useMemo as useMemo6 } from "react";
+import { useEffect as useEffect28, useState as useState21, useRef as useRef20, useCallback as useCallback19, useMemo as useMemo6 } from "react";
 import { getTextPositionSelector as getTextPositionSelector5, getTargetSelector as getTargetSelector7 } from "@semiont/api-client";
 import { jsx as jsx36, jsxs as jsxs27 } from "react/jsx-runtime";
 function HighlightPanel({
@@ -47012,8 +46957,8 @@ function HighlightPanel({
   const t12 = useTranslations("HighlightPanel");
   const eventBus = useEventBus();
   const [focusedAnnotationId, setFocusedAnnotationId] = useState21(null);
-  const containerRef = useRef22(null);
-  const entryRefs = useRef22(/* @__PURE__ */ new Map());
+  const containerRef = useRef20(null);
+  const entryRefs = useRef20(/* @__PURE__ */ new Map());
   const sortedAnnotations = useMemo6(() => {
     return [...annotations].sort((a15, b8) => {
       const aSelector = getTextPositionSelector5(getTargetSelector7(a15.target));
@@ -47029,7 +46974,7 @@ function HighlightPanel({
       entryRefs.current.delete(id2);
     }
   }, []);
-  useEffect29(() => {
+  useEffect28(() => {
     if (!scrollToAnnotationId) return;
     const element2 = entryRefs.current.get(scrollToAnnotationId);
     if (element2 && containerRef.current) {
@@ -47044,7 +46989,7 @@ function HighlightPanel({
       if (onScrollCompleted) onScrollCompleted();
     }
   }, [scrollToAnnotationId]);
-  useEffect29(() => {
+  useEffect28(() => {
     if (!hoveredAnnotationId) return;
     const element2 = entryRefs.current.get(hoveredAnnotationId);
     if (!element2 || !containerRef.current) return;
@@ -47067,7 +47012,7 @@ function HighlightPanel({
   useEventSubscriptions({
     "annotation:click": handleAnnotationClick
   });
-  useEffect29(() => {
+  useEffect28(() => {
     if (pendingAnnotation && pendingAnnotation.motivation === "highlighting") {
       eventBus.emit("annotation:create", {
         motivation: "highlighting",
@@ -47102,13 +47047,13 @@ function HighlightPanel({
 }
 
 // src/components/resource/panels/JsonLdPanel.tsx
-import { useEffect as useEffect30, useRef as useRef23 } from "react";
+import { useEffect as useEffect29, useRef as useRef21 } from "react";
 import { jsx as jsx37, jsxs as jsxs28 } from "react/jsx-runtime";
 function JsonLdPanel({ resource: semiontResource }) {
-  const editorRef = useRef23(null);
-  const viewRef = useRef23(null);
+  const editorRef = useRef21(null);
+  const viewRef = useRef21(null);
   const { showLineNumbers } = useLineNumbers();
-  useEffect30(() => {
+  useEffect29(() => {
     if (!editorRef.current) return;
     const isDarkMode = document.documentElement?.classList.contains("dark") ?? false;
     const jsonLdContent = JSON.stringify(semiontResource, null, 2);
@@ -47186,6 +47131,7 @@ var ReferenceEntry = forwardRef4(
     const t12 = useTranslations("ReferencesPanel");
     const eventBus = useEventBus();
     const navigate = useObservableExternalNavigation();
+    const hoverProps = useHoverEmitter(reference.id);
     const selectedText = getAnnotationExactText4(reference) || "";
     const isResolved = isBodyResolved2(reference.body);
     const resolvedResourceUri = isResolved ? getBodySource5(reference.body) : null;
@@ -47248,12 +47194,7 @@ var ReferenceEntry = forwardRef4(
         onClick: () => {
           eventBus.emit("annotation:click", { annotationId: reference.id, motivation: reference.motivation });
         },
-        onMouseEnter: () => {
-          eventBus.emit("annotation:hover", { annotationId: reference.id });
-        },
-        onMouseLeave: () => {
-          eventBus.emit("annotation:hover", { annotationId: null });
-        },
+        ...hoverProps,
         children: [
           /* @__PURE__ */ jsxs29("div", { className: "semiont-annotation-entry__header", children: [
             /* @__PURE__ */ jsx38("span", { className: "semiont-reference-icon", title: isResolved ? t12("resolved") : t12("stub"), children: isResolved ? "\u{1F517}" : "\u2753" }),
@@ -47344,7 +47285,7 @@ var ReferenceEntry = forwardRef4(
 );
 
 // src/components/resource/panels/ReferencesPanel.tsx
-import { useState as useState22, useRef as useRef24, useEffect as useEffect31, useCallback as useCallback20, useMemo as useMemo7 } from "react";
+import { useState as useState22, useRef as useRef22, useEffect as useEffect30, useCallback as useCallback20, useMemo as useMemo7 } from "react";
 import { getTextPositionSelector as getTextPositionSelector6, getTargetSelector as getTargetSelector9 } from "@semiont/api-client";
 import { Fragment as Fragment8, jsx as jsx39, jsxs as jsxs30 } from "react/jsx-runtime";
 function getSelectorDisplayText3(selector) {
@@ -47384,17 +47325,17 @@ function ReferencesPanel({
   const [pendingEntityTypes, setPendingEntityTypes] = useState22([]);
   const [includeDescriptiveReferences, setIncludeDescriptiveReferences] = useState22(false);
   const [focusedAnnotationId, setFocusedAnnotationId] = useState22(null);
-  const containerRef = useRef24(null);
+  const containerRef = useRef22(null);
   const [isDetectExpanded, setIsDetectExpanded] = useState22(() => {
     if (typeof window === "undefined") return true;
     const stored = localStorage.getItem("detect-section-expanded-reference");
     return stored ? stored === "true" : true;
   });
-  useEffect31(() => {
+  useEffect30(() => {
     if (typeof window === "undefined") return;
     localStorage.setItem("detect-section-expanded-reference", String(isDetectExpanded));
   }, [isDetectExpanded]);
-  const entryRefs = useRef24(/* @__PURE__ */ new Map());
+  const entryRefs = useRef22(/* @__PURE__ */ new Map());
   const sortedAnnotations = useMemo7(() => {
     return [...annotations].sort((a15, b8) => {
       const aSelector = getTextPositionSelector6(getTargetSelector9(a15.target));
@@ -47410,7 +47351,7 @@ function ReferencesPanel({
       entryRefs.current.delete(id2);
     }
   }, []);
-  useEffect31(() => {
+  useEffect30(() => {
     if (!scrollToAnnotationId) return;
     const element2 = entryRefs.current.get(scrollToAnnotationId);
     if (element2 && containerRef.current) {
@@ -47429,7 +47370,7 @@ function ReferencesPanel({
       console.warn("[ReferencesPanel] Element not found for scrollToAnnotationId:", scrollToAnnotationId);
     }
   }, [scrollToAnnotationId]);
-  useEffect31(() => {
+  useEffect30(() => {
     if (!hoveredAnnotationId) return;
     const element2 = entryRefs.current.get(hoveredAnnotationId);
     if (!element2 || !containerRef.current) return;
@@ -47462,8 +47403,8 @@ function ReferencesPanel({
       }
     });
   };
-  const hasSavedLogRef = useRef24(false);
-  useEffect31(() => {
+  const hasSavedLogRef = useRef22(false);
+  useEffect30(() => {
     if (isDetecting) {
       hasSavedLogRef.current = false;
       return;
@@ -47490,7 +47431,7 @@ function ReferencesPanel({
       setPendingEntityTypes([]);
     }
   };
-  useEffect31(() => {
+  useEffect30(() => {
     if (!pendingAnnotation) return;
     const handleEscape = (e6) => {
       if (e6.key === "Escape") {
@@ -47881,6 +47822,7 @@ var TagEntry = forwardRef5(
     isHovered = false
   }, ref) {
     const eventBus = useEventBus();
+    const hoverProps = useHoverEmitter(tag.id);
     const selectedText = getAnnotationExactText5(tag);
     const category = getTagCategory(tag);
     const schemaId = getTagSchemaId(tag);
@@ -47892,12 +47834,7 @@ var TagEntry = forwardRef5(
         onClick: () => {
           eventBus.emit("annotation:click", { annotationId: tag.id, motivation: tag.motivation });
         },
-        onMouseEnter: () => {
-          eventBus.emit("annotation:hover", { annotationId: tag.id });
-        },
-        onMouseLeave: () => {
-          eventBus.emit("annotation:hover", { annotationId: null });
-        },
+        ...hoverProps,
         className: `semiont-annotation-entry${isHovered ? " semiont-annotation-pulse" : ""}`,
         "data-type": "tag",
         "data-focused": isFocused ? "true" : "false",
@@ -47919,7 +47856,7 @@ var TagEntry = forwardRef5(
 );
 
 // src/components/resource/panels/TaggingPanel.tsx
-import { useState as useState23, useEffect as useEffect32, useRef as useRef25, useCallback as useCallback21, useMemo as useMemo8 } from "react";
+import { useState as useState23, useEffect as useEffect31, useRef as useRef23, useCallback as useCallback21, useMemo as useMemo8 } from "react";
 import { getTextPositionSelector as getTextPositionSelector7, getTargetSelector as getTargetSelector10 } from "@semiont/api-client";
 import { Fragment as Fragment10, jsx as jsx43, jsxs as jsxs34 } from "react/jsx-runtime";
 function getSelectorDisplayText4(selector) {
@@ -47950,13 +47887,13 @@ function TaggingPanel({
   const [selectedSchemaId, setSelectedSchemaId] = useState23("legal-irac");
   const [selectedCategories, setSelectedCategories] = useState23(/* @__PURE__ */ new Set());
   const [focusedAnnotationId, setFocusedAnnotationId] = useState23(null);
-  const containerRef = useRef25(null);
+  const containerRef = useRef23(null);
   const [isDetectExpanded, setIsDetectExpanded] = useState23(() => {
     if (typeof window === "undefined") return true;
     const stored = localStorage.getItem("detect-section-expanded-tag");
     return stored ? stored === "true" : true;
   });
-  useEffect32(() => {
+  useEffect31(() => {
     if (typeof window === "undefined") return;
     localStorage.setItem("detect-section-expanded-tag", String(isDetectExpanded));
   }, [isDetectExpanded]);
@@ -47967,7 +47904,7 @@ function TaggingPanel({
   useEventSubscriptions({
     "annotation:click": handleAnnotationClick
   });
-  const entryRefs = useRef25(/* @__PURE__ */ new Map());
+  const entryRefs = useRef23(/* @__PURE__ */ new Map());
   const sortedAnnotations = useMemo8(() => {
     return [...annotations].sort((a15, b8) => {
       const aSelector = getTextPositionSelector7(getTargetSelector10(a15.target));
@@ -47983,7 +47920,7 @@ function TaggingPanel({
       entryRefs.current.delete(id2);
     }
   }, []);
-  useEffect32(() => {
+  useEffect31(() => {
     if (!scrollToAnnotationId) return;
     const element2 = entryRefs.current.get(scrollToAnnotationId);
     if (element2 && containerRef.current) {
@@ -47998,7 +47935,7 @@ function TaggingPanel({
       if (onScrollCompleted) onScrollCompleted();
     }
   }, [scrollToAnnotationId]);
-  useEffect32(() => {
+  useEffect31(() => {
     if (!hoveredAnnotationId) return;
     const element2 = entryRefs.current.get(hoveredAnnotationId);
     if (!element2 || !containerRef.current) return;
@@ -48049,7 +47986,7 @@ function TaggingPanel({
       setSelectedCategories(/* @__PURE__ */ new Set());
     }
   };
-  useEffect32(() => {
+  useEffect31(() => {
     if (!pendingAnnotation) return;
     const handleEscape = (e6) => {
       if (e6.key === "Escape") {
@@ -48099,6 +48036,11 @@ function TaggingPanel({
                         type: "TextualBody",
                         value: e6.target.value,
                         purpose: "tagging"
+                      },
+                      {
+                        type: "TextualBody",
+                        value: selectedSchemaId,
+                        purpose: "classifying"
                       }
                     ]
                   });
@@ -48271,7 +48213,7 @@ function TaggingPanel({
 }
 
 // src/components/resource/panels/UnifiedAnnotationsPanel.tsx
-import { useState as useState24, useEffect as useEffect33 } from "react";
+import { useState as useState24, useEffect as useEffect32 } from "react";
 import { jsx as jsx44, jsxs as jsxs35 } from "react/jsx-runtime";
 var TAB_ORDER = ["statistics", "reference", "highlight", "assessment", "comment", "tag"];
 function UnifiedAnnotationsPanel(props) {
@@ -48302,17 +48244,17 @@ function UnifiedAnnotationsPanel(props) {
     }
     return props.initialTab || "statistics";
   });
-  useEffect33(() => {
+  useEffect32(() => {
     if (typeof window === "undefined") return;
     const storageKey = props.resourceId ? `annotations-tab-${props.resourceId}` : "annotations-tab-global";
     localStorage.setItem(storageKey, activeTab);
   }, [activeTab, props.resourceId]);
-  useEffect33(() => {
+  useEffect32(() => {
     if (props.initialTab && props.initialTabGeneration !== void 0) {
       setActiveTab(props.initialTab);
     }
   }, [props.initialTabGeneration]);
-  useEffect33(() => {
+  useEffect32(() => {
     if (props.pendingAnnotation) {
       const motivationToTab = {
         "linking": "reference",
@@ -48601,7 +48543,7 @@ function NavigationMenu({
 }
 
 // src/components/navigation/ObservableLink.tsx
-import { useCallback as useCallback22, useRef as useRef26, useEffect as useEffect34 } from "react";
+import { useCallback as useCallback22, useRef as useRef24, useEffect as useEffect33 } from "react";
 import { jsx as jsx47 } from "react/jsx-runtime";
 function ObservableLink({
   href,
@@ -48611,8 +48553,8 @@ function ObservableLink({
   ...anchorProps
 }) {
   const eventBus = useEventBus();
-  const onClickRef = useRef26(onClick);
-  useEffect34(() => {
+  const onClickRef = useRef24(onClick);
+  useEffect33(() => {
     onClickRef.current = onClick;
   });
   const handleClick = useCallback22((e6) => {
@@ -48634,7 +48576,7 @@ function ObservableLink({
 }
 
 // src/components/navigation/SimpleNavigation.tsx
-import { useState as useState26, useRef as useRef27, useEffect as useEffect35 } from "react";
+import { useState as useState26, useRef as useRef25, useEffect as useEffect34 } from "react";
 import { jsx as jsx48, jsxs as jsxs38 } from "react/jsx-runtime";
 function SimpleNavigation({
   title,
@@ -48650,11 +48592,11 @@ function SimpleNavigation({
   const ChevronLeftIcon = icons.chevronLeft;
   const BarsIcon = icons.bars;
   const [isDropdownOpen, setIsDropdownOpen] = useState26(false);
-  const dropdownRef = useRef27(null);
+  const dropdownRef = useRef25(null);
   const eventBus = useEventBus();
   const toggleDropdown = () => setIsDropdownOpen(!isDropdownOpen);
   const closeDropdown = () => setIsDropdownOpen(false);
-  useEffect35(() => {
+  useEffect34(() => {
     const handleClickOutside = (event) => {
       if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {
         closeDropdown();
@@ -48730,14 +48672,14 @@ function SimpleNavigation({
 }
 
 // src/components/navigation/CollapsibleResourceNavigation.tsx
-import { useCallback as useCallback28, useState as useState30, useRef as useRef32, useEffect as useEffect40 } from "react";
+import { useCallback as useCallback28, useState as useState30, useRef as useRef30, useEffect as useEffect39 } from "react";
 
 // ../../node_modules/@dnd-kit/core/dist/core.esm.js
-import React20, { createContext as createContext7, useContext as useContext7, useEffect as useEffect37, useState as useState28, useCallback as useCallback25, useMemo as useMemo10, useRef as useRef29, memo, useReducer, cloneElement, forwardRef as forwardRef6 } from "react";
+import React20, { createContext as createContext7, useContext as useContext7, useEffect as useEffect36, useState as useState28, useCallback as useCallback25, useMemo as useMemo10, useRef as useRef27, memo, useReducer, cloneElement, forwardRef as forwardRef6 } from "react";
 import { createPortal, unstable_batchedUpdates } from "react-dom";
 
 // ../../node_modules/@dnd-kit/utilities/dist/utilities.esm.js
-import { useMemo as useMemo9, useLayoutEffect, useEffect as useEffect36, useRef as useRef28, useCallback as useCallback23 } from "react";
+import { useMemo as useMemo9, useLayoutEffect, useEffect as useEffect35, useRef as useRef26, useCallback as useCallback23 } from "react";
 function useCombinedRefs() {
   for (var _len = arguments.length, refs = new Array(_len), _key = 0; _key < _len; _key++) {
     refs[_key] = arguments[_key];
@@ -48805,9 +48747,9 @@ function getOwnerDocument(target) {
   }
   return document;
 }
-var useIsomorphicLayoutEffect = canUseDOM ? useLayoutEffect : useEffect36;
+var useIsomorphicLayoutEffect = canUseDOM ? useLayoutEffect : useEffect35;
 function useEvent(handler) {
-  const handlerRef = useRef28(handler);
+  const handlerRef = useRef26(handler);
   useIsomorphicLayoutEffect(() => {
     handlerRef.current = handler;
   });
@@ -48819,7 +48761,7 @@ function useEvent(handler) {
   }, []);
 }
 function useInterval() {
-  const intervalRef = useRef28(null);
+  const intervalRef = useRef26(null);
   const set = useCallback23((listener, duration) => {
     intervalRef.current = setInterval(listener, duration);
   }, []);
@@ -48835,7 +48777,7 @@ function useLatestValue(value, dependencies) {
   if (dependencies === void 0) {
     dependencies = [value];
   }
-  const valueRef = useRef28(value);
+  const valueRef = useRef26(value);
   useIsomorphicLayoutEffect(() => {
     if (valueRef.current !== value) {
       valueRef.current = value;
@@ -48844,7 +48786,7 @@ function useLatestValue(value, dependencies) {
   return valueRef;
 }
 function useLazyMemo(callback, dependencies) {
-  const valueRef = useRef28();
+  const valueRef = useRef26();
   return useMemo9(
     () => {
       const newValue = callback(valueRef.current);
@@ -48857,7 +48799,7 @@ function useLazyMemo(callback, dependencies) {
 }
 function useNodeRef(onChange) {
   const onChangeHandler = useEvent(onChange);
-  const node2 = useRef28(null);
+  const node2 = useRef26(null);
   const setNodeRef = useCallback23(
     (element2) => {
       if (element2 !== node2.current) {
@@ -48871,8 +48813,8 @@ function useNodeRef(onChange) {
   return [node2, setNodeRef];
 }
 function usePrevious(value) {
-  const ref = useRef28();
-  useEffect36(() => {
+  const ref = useRef26();
+  useEffect35(() => {
     ref.current = value;
   }, [value]);
   return ref.current;
@@ -49072,7 +49014,7 @@ function useAnnouncement() {
 var DndMonitorContext = /* @__PURE__ */ createContext7(null);
 function useDndMonitor(listener) {
   const registerListener = useContext7(DndMonitorContext);
-  useEffect37(() => {
+  useEffect36(() => {
     if (!registerListener) {
       throw new Error("useDndMonitor must be used within a children of <DndContext>");
     }
@@ -49148,7 +49090,7 @@ function Accessibility(_ref) {
   } = useAnnouncement();
   const liveRegionId = useUniqueId("DndLiveRegion");
   const [mounted, setMounted] = useState28(false);
-  useEffect37(() => {
+  useEffect36(() => {
     setMounted(true);
   }, []);
   useDndMonitor(useMemo10(() => ({
@@ -50484,11 +50426,11 @@ function useAutoScroller(_ref) {
     disabled: !enabled
   });
   const [setAutoScrollInterval, clearAutoScrollInterval] = useInterval();
-  const scrollSpeed = useRef29({
+  const scrollSpeed = useRef27({
     x: 0,
     y: 0
   });
-  const scrollDirection = useRef29({
+  const scrollDirection = useRef27({
     x: 0,
     y: 0
   });
@@ -50505,7 +50447,7 @@ function useAutoScroller(_ref) {
         return draggingRect;
     }
   }, [activator, draggingRect, pointerCoordinates]);
-  const scrollContainerRef = useRef29(null);
+  const scrollContainerRef = useRef27(null);
   const autoScroll = useCallback25(() => {
     const scrollContainer = scrollContainerRef.current;
     if (!scrollContainer) {
@@ -50516,7 +50458,7 @@ function useAutoScroller(_ref) {
     scrollContainer.scrollBy(scrollLeft, scrollTop);
   }, []);
   const sortedScrollableAncestors = useMemo10(() => order2 === TraversalOrder.TreeOrder ? [...scrollableAncestors].reverse() : scrollableAncestors, [order2, scrollableAncestors]);
-  useEffect37(
+  useEffect36(
     () => {
       if (!enabled || !scrollableAncestors.length || !rect) {
         clearAutoScrollInterval();
@@ -50663,7 +50605,7 @@ function useDroppableMeasuring(containers, _ref) {
     measure,
     strategy
   } = config;
-  const containersRef = useRef29(containers);
+  const containersRef = useRef27(containers);
   const disabled = isDisabled();
   const disabledRef = useLatestValue(disabled);
   const measureDroppableContainers = useCallback25(function(ids2) {
@@ -50680,7 +50622,7 @@ function useDroppableMeasuring(containers, _ref) {
       return value.concat(ids2.filter((id2) => !value.includes(id2)));
     });
   }, [disabledRef]);
-  const timeoutId = useRef29(null);
+  const timeoutId = useRef27(null);
   const droppableRects = useLazyMemo((previousValue) => {
     if (disabled && !dragging) {
       return defaultValue;
@@ -50706,10 +50648,10 @@ function useDroppableMeasuring(containers, _ref) {
     }
     return previousValue;
   }, [containers, queue, dragging, disabled, measure]);
-  useEffect37(() => {
+  useEffect36(() => {
     containersRef.current = containers;
   }, [containers]);
-  useEffect37(
+  useEffect36(
     () => {
       if (disabled) {
         return;
@@ -50719,7 +50661,7 @@ function useDroppableMeasuring(containers, _ref) {
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [dragging, disabled]
   );
-  useEffect37(
+  useEffect36(
     () => {
       if (queue && queue.length > 0) {
         setQueue(null);
@@ -50728,7 +50670,7 @@ function useDroppableMeasuring(containers, _ref) {
     //eslint-disable-next-line react-hooks/exhaustive-deps
     [JSON.stringify(queue)]
   );
-  useEffect37(
+  useEffect36(
     () => {
       if (disabled || typeof frequency !== "number" || timeoutId.current !== null) {
         return;
@@ -50786,7 +50728,7 @@ function useMutationObserver(_ref) {
     } = window;
     return new MutationObserver2(handleMutations);
   }, [handleMutations, disabled]);
-  useEffect37(() => {
+  useEffect36(() => {
     return () => mutationObserver == null ? void 0 : mutationObserver.disconnect();
   }, [mutationObserver]);
   return mutationObserver;
@@ -50810,7 +50752,7 @@ function useResizeObserver(_ref) {
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [disabled]
   );
-  useEffect37(() => {
+  useEffect36(() => {
     return () => resizeObserver == null ? void 0 : resizeObserver.disconnect();
   }, [resizeObserver]);
   return resizeObserver;
@@ -50880,7 +50822,7 @@ function useRectDelta(rect) {
 }
 var defaultValue$1 = [];
 function useScrollableAncestors(node2) {
-  const previousNode = useRef29(node2);
+  const previousNode = useRef27(node2);
   const ancestors = useLazyMemo((previousValue) => {
     if (!node2) {
       return defaultValue$1;
@@ -50890,14 +50832,14 @@ function useScrollableAncestors(node2) {
     }
     return getScrollableAncestors(node2);
   }, [node2]);
-  useEffect37(() => {
+  useEffect36(() => {
     previousNode.current = node2;
   }, [node2]);
   return ancestors;
 }
 function useScrollOffsets(elements) {
   const [scrollCoordinates, setScrollCoordinates] = useState28(null);
-  const prevElements = useRef29(elements);
+  const prevElements = useRef27(elements);
   const handleScroll = useCallback25((event) => {
     const scrollingElement = getScrollableElement(event.target);
     if (!scrollingElement) {
@@ -50911,7 +50853,7 @@ function useScrollOffsets(elements) {
       return new Map(scrollCoordinates2);
     });
   }, []);
-  useEffect37(() => {
+  useEffect36(() => {
     const previousElements = prevElements.current;
     if (elements !== previousElements) {
       cleanup(previousElements);
@@ -50950,15 +50892,15 @@ function useScrollOffsetsDelta(scrollOffsets, dependencies) {
   if (dependencies === void 0) {
     dependencies = [];
   }
-  const initialScrollOffsets = useRef29(null);
-  useEffect37(
+  const initialScrollOffsets = useRef27(null);
+  useEffect36(
     () => {
       initialScrollOffsets.current = null;
     },
     // eslint-disable-next-line react-hooks/exhaustive-deps
     dependencies
   );
-  useEffect37(() => {
+  useEffect36(() => {
     const hasScrollOffsets = scrollOffsets !== defaultCoordinates;
     if (hasScrollOffsets && !initialScrollOffsets.current) {
       initialScrollOffsets.current = scrollOffsets;
@@ -50970,7 +50912,7 @@ function useScrollOffsetsDelta(scrollOffsets, dependencies) {
   return initialScrollOffsets.current ? subtract(scrollOffsets, initialScrollOffsets.current) : defaultCoordinates;
 }
 function useSensorSetup(sensors) {
-  useEffect37(
+  useEffect36(
     () => {
       if (!canUseDOM) {
         return;
@@ -51310,7 +51252,7 @@ function RestoreFocus(_ref) {
   } = useContext7(InternalContext);
   const previousActivatorEvent = usePrevious(activatorEvent);
   const previousActiveId = usePrevious(active == null ? void 0 : active.id);
-  useEffect37(() => {
+  useEffect36(() => {
     if (disabled) {
       return;
     }
@@ -51387,7 +51329,7 @@ function useLayoutShiftScrollCompensation(_ref) {
     initialRect,
     config = true
   } = _ref;
-  const initialized = useRef29(false);
+  const initialized = useRef27(false);
   const {
     x: x8,
     y: y4
@@ -51468,7 +51410,7 @@ var DndContext = /* @__PURE__ */ memo(function DndContext2(_ref) {
     }
   } = state;
   const node2 = activeId != null ? draggableNodes.get(activeId) : null;
-  const activeRects = useRef29({
+  const activeRects = useRef27({
     initial: null,
     translated: null
   });
@@ -51481,7 +51423,7 @@ var DndContext = /* @__PURE__ */ memo(function DndContext2(_ref) {
       rect: activeRects
     } : null;
   }, [activeId, node2]);
-  const activeRef = useRef29(null);
+  const activeRef = useRef27(null);
   const [activeSensor, setActiveSensor] = useState28(null);
   const [activatorEvent, setActivatorEvent] = useState28(null);
   const latestProps = useLatestValue(props, Object.values(props));
@@ -51509,7 +51451,7 @@ var DndContext = /* @__PURE__ */ memo(function DndContext2(_ref) {
   });
   const activeNodeRect = useRect(activeNode, measuringConfiguration.draggable.measure, initialActiveNodeRect);
   const containerNodeRect = useRect(activeNode ? activeNode.parentElement : null);
-  const sensorContext = useRef29({
+  const sensorContext = useRef27({
     activatorEvent: null,
     active: null,
     activeNode,
@@ -51570,7 +51512,7 @@ var DndContext = /* @__PURE__ */ memo(function DndContext2(_ref) {
   const [over, setOver] = useState28(null);
   const appliedTranslate = usesDragOverlay ? modifiedTranslate : add(modifiedTranslate, activeNodeScrollDelta);
   const transform = adjustScale(appliedTranslate, (_over$rect = over == null ? void 0 : over.rect) != null ? _over$rect : null, activeNodeRect);
-  const activeSensorRef = useRef29(null);
+  const activeSensorRef = useRef27(null);
   const instantiateSensor = useCallback25(
     (event, _ref2) => {
       let {
@@ -51761,7 +51703,7 @@ var DndContext = /* @__PURE__ */ memo(function DndContext2(_ref) {
       setStatus(Status.Initialized);
     }
   }, [activeNodeRect, status]);
-  useEffect37(
+  useEffect36(
     () => {
       const {
         onDragMove
@@ -51796,7 +51738,7 @@ var DndContext = /* @__PURE__ */ memo(function DndContext2(_ref) {
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [scrollAdjustedTranslate.x, scrollAdjustedTranslate.y]
   );
-  useEffect37(
+  useEffect36(
     () => {
       const {
         active: active2,
@@ -52029,12 +51971,12 @@ function useDroppable(_ref) {
     over,
     measureDroppableContainers
   } = useContext7(InternalContext);
-  const previous3 = useRef29({
+  const previous3 = useRef27({
     disabled
   });
-  const resizeObserverConnected = useRef29(false);
-  const rect = useRef29(null);
-  const callbackId = useRef29(null);
+  const resizeObserverConnected = useRef27(false);
+  const rect = useRef27(null);
+  const callbackId = useRef27(null);
   const {
     disabled: resizeObserverDisabled,
     updateMeasurementsFor,
@@ -52079,7 +52021,7 @@ function useDroppable(_ref) {
   }, [resizeObserver]);
   const [nodeRef, setNodeRef] = useNodeRef(handleNodeChange);
   const dataRef = useLatestValue(data2);
-  useEffect37(() => {
+  useEffect36(() => {
     if (!resizeObserver || !nodeRef.current) {
       return;
     }
@@ -52087,7 +52029,7 @@ function useDroppable(_ref) {
     resizeObserverConnected.current = false;
     resizeObserver.observe(nodeRef.current);
   }, [nodeRef, resizeObserver]);
-  useEffect37(
+  useEffect36(
     () => {
       dispatch({
         type: Action.RegisterDroppable,
@@ -52109,7 +52051,7 @@ function useDroppable(_ref) {
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [id2]
   );
-  useEffect37(() => {
+  useEffect36(() => {
     if (disabled !== previous3.current.disabled) {
       dispatch({
         type: Action.SetDroppableDisabled,
@@ -52131,7 +52073,7 @@ function useDroppable(_ref) {
 }
 
 // ../../node_modules/@dnd-kit/sortable/dist/sortable.esm.js
-import React21, { useMemo as useMemo11, useRef as useRef30, useEffect as useEffect38, useState as useState29, useContext as useContext8 } from "react";
+import React21, { useMemo as useMemo11, useRef as useRef28, useEffect as useEffect37, useState as useState29, useContext as useContext8 } from "react";
 function arrayMove(array, from, to) {
   const newArray = array.slice();
   newArray.splice(to < 0 ? newArray.length + to : to, 0, newArray.splice(from, 1)[0]);
@@ -52289,7 +52231,7 @@ function SortableContext(_ref) {
   const isDragging = active != null;
   const activeIndex = active ? items.indexOf(active.id) : -1;
   const overIndex = over ? items.indexOf(over.id) : -1;
-  const previousItemsRef = useRef30(items);
+  const previousItemsRef = useRef28(items);
   const itemsHaveChanged = !itemsEqual(items, previousItemsRef.current);
   const disableTransforms = overIndex !== -1 && activeIndex === -1 || itemsHaveChanged;
   const disabled = normalizeDisabled(disabledProp);
@@ -52298,7 +52240,7 @@ function SortableContext(_ref) {
       measureDroppableContainers(items);
     }
   }, [itemsHaveChanged, items, isDragging, measureDroppableContainers]);
-  useEffect38(() => {
+  useEffect37(() => {
     previousItemsRef.current = items;
   }, [items]);
   const contextValue = useMemo11(
@@ -52373,7 +52315,7 @@ function useDerivedTransform(_ref) {
     rect
   } = _ref;
   const [derivedTransform, setDerivedtransform] = useState29(null);
-  const previousIndex = useRef30(index2);
+  const previousIndex = useRef28(index2);
   useIsomorphicLayoutEffect(() => {
     if (!disabled && index2 !== previousIndex.current && node2.current) {
       const initial = rect.current;
@@ -52396,7 +52338,7 @@ function useDerivedTransform(_ref) {
       previousIndex.current = index2;
     }
   }, [disabled, index2, node2, rect]);
-  useEffect38(() => {
+  useEffect37(() => {
     if (derivedTransform) {
       setDerivedtransform(null);
     }
@@ -52491,7 +52433,7 @@ function useSortable(_ref) {
     overIndex
   }) : index2;
   const activeId = active == null ? void 0 : active.id;
-  const previous3 = useRef30({
+  const previous3 = useRef28({
     activeId,
     items,
     newIndex,
@@ -52518,7 +52460,7 @@ function useSortable(_ref) {
     node: node2,
     rect
   });
-  useEffect38(() => {
+  useEffect37(() => {
     if (isSorting && previous3.current.newIndex !== newIndex) {
       previous3.current.newIndex = newIndex;
     }
@@ -52529,7 +52471,7 @@ function useSortable(_ref) {
       previous3.current.items = items;
     }
   }, [isSorting, newIndex, containerId, items]);
-  useEffect38(() => {
+  useEffect37(() => {
     if (activeId === previous3.current.activeId) {
       return;
     }
@@ -52714,7 +52656,7 @@ function isAfter(a15, b8) {
 }
 
 // src/components/navigation/SortableResourceTab.tsx
-import { useCallback as useCallback26, useRef as useRef31, useEffect as useEffect39 } from "react";
+import { useCallback as useCallback26, useRef as useRef29, useEffect as useEffect38 } from "react";
 import { jsx as jsx49, jsxs as jsxs39 } from "react/jsx-runtime";
 function SortableResourceTab({
   resource,
@@ -52737,8 +52679,8 @@ function SortableResourceTab({
     transition,
     isDragging: isSortableDragging
   } = useSortable({ id: resource.id });
-  const onReorderRef = useRef31(onReorder);
-  useEffect39(() => {
+  const onReorderRef = useRef29(onReorder);
+  useEffect38(() => {
     onReorderRef.current = onReorder;
   });
   const style = {
@@ -52865,7 +52807,7 @@ function CollapsibleResourceNavigation({
   const ChevronLeftIcon = icons.chevronLeft;
   const BarsIcon = icons.bars;
   const [isDropdownOpen, setIsDropdownOpen] = useState30(false);
-  const dropdownRef = useRef32(null);
+  const dropdownRef = useRef30(null);
   const { announcePickup, announceDrop, announceKeyboardReorder, announceCannotMove } = useDragAnnouncements();
   const t12 = useTranslations("CollapsibleResourceNavigation");
   const eventBus = useEventBus();
@@ -52880,7 +52822,7 @@ function CollapsibleResourceNavigation({
   };
   const toggleDropdown = () => setIsDropdownOpen(!isDropdownOpen);
   const closeDropdown = () => setIsDropdownOpen(false);
-  useEffect40(() => {
+  useEffect39(() => {
     const handleClickOutside = (event) => {
       if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {
         closeDropdown();
@@ -53078,7 +53020,7 @@ function CollapsibleResourceNavigation({
 }
 
 // src/components/modals/SearchModal.tsx
-import { useState as useState31, useEffect as useEffect41, Fragment as Fragment13 } from "react";
+import { useState as useState31, useEffect as useEffect40, Fragment as Fragment13 } from "react";
 
 // src/hooks/useSearchAnnouncements.ts
 import { useCallback as useCallback29 } from "react";
@@ -53135,7 +53077,7 @@ function SearchModal({
     enter: translations.enter || "Enter",
     esc: translations.esc || "ESC"
   };
-  useEffect41(() => {
+  useEffect40(() => {
     const timer = setTimeout(() => {
       setDebouncedQuery(query);
     }, 300);
@@ -53143,7 +53085,7 @@ function SearchModal({
   }, [query]);
   const searchData = { resources: [], entities: [] };
   const loading = false;
-  useEffect41(() => {
+  useEffect40(() => {
     if (isOpen) {
       setQuery("");
       setDebouncedQuery("");
@@ -53151,7 +53093,7 @@ function SearchModal({
       setSelectedIndex(0);
     }
   }, [isOpen]);
-  useEffect41(() => {
+  useEffect40(() => {
     if (!debouncedQuery.trim()) {
       setResults([]);
       return;
@@ -53282,7 +53224,7 @@ function SearchModal({
 }
 
 // src/components/modals/ResourceSearchModal.tsx
-import { useState as useState32, useEffect as useEffect42, Fragment as Fragment14 } from "react";
+import { useState as useState32, useEffect as useEffect41, Fragment as Fragment14 } from "react";
 import { jsx as jsx52, jsxs as jsxs42 } from "react/jsx-runtime";
 function ResourceSearchModal({
   isOpen,
@@ -53301,7 +53243,7 @@ function ResourceSearchModal({
     noResults: translations.noResults || "No documents found",
     close: translations.close || "\u2715"
   };
-  useEffect42(() => {
+  useEffect41(() => {
     const timer = setTimeout(() => {
       setDebouncedSearch(search2);
     }, 300);
@@ -53323,17 +53265,17 @@ function ResourceSearchModal({
       mediaType
     };
   }) || [];
-  useEffect42(() => {
+  useEffect41(() => {
     if (!loading && debouncedSearch) {
       announceSearchResults(results.length, debouncedSearch);
     }
   }, [loading, results.length, debouncedSearch]);
-  useEffect42(() => {
+  useEffect41(() => {
     if (loading && debouncedSearch) {
       announceSearching();
     }
   }, [loading, debouncedSearch]);
-  useEffect42(() => {
+  useEffect41(() => {
     if (isOpen && searchTerm) {
       setSearch(searchTerm);
       setDebouncedSearch(searchTerm);
@@ -53762,7 +53704,7 @@ function UnifiedHeader({
 }
 
 // src/components/layout/LeftSidebar.tsx
-import { useState as useState34, useEffect as useEffect43 } from "react";
+import { useState as useState34, useEffect as useEffect42 } from "react";
 import { jsx as jsx59, jsxs as jsxs49 } from "react/jsx-runtime";
 function LeftSidebar({
   Link,
@@ -53787,7 +53729,7 @@ function LeftSidebar({
     // 25rem
     storageKey: "semiont-left-sidebar-width"
   });
-  useEffect43(() => {
+  useEffect42(() => {
     if (collapsible) {
       const saved = localStorage.getItem(storageKey);
       if (saved === "true") {
@@ -55892,7 +55834,7 @@ function TagSchemasPage({
 }
 
 // src/features/resource-compose/components/ResourceComposePage.tsx
-import { useState as useState37, useEffect as useEffect44 } from "react";
+import { useState as useState37, useEffect as useEffect43 } from "react";
 import { isImageMimeType, isPdfMimeType as isPdfMimeType4, LOCALES as LOCALES2 } from "@semiont/api-client";
 import { jsx as jsx76, jsxs as jsxs64 } from "react/jsx-runtime";
 function ResourceComposePage({
@@ -55923,7 +55865,7 @@ function ResourceComposePage({
   const [selectedLanguage, setSelectedLanguage] = useState37(initialLocale);
   const [selectedCharset, setSelectedCharset] = useState37("");
   const [archiveOriginal, setArchiveOriginal] = useState37(true);
-  useEffect44(() => {
+  useEffect43(() => {
     if (mode === "clone" && cloneData) {
       setNewResourceName(cloneData.sourceResource.name);
       setNewResourceContent(cloneData.sourceContent);
@@ -55956,7 +55898,7 @@ function ResourceComposePage({
       reader.readAsText(file);
     }
   };
-  useEffect44(() => {
+  useEffect43(() => {
     return () => {
       if (filePreviewUrl) {
         URL.revokeObjectURL(filePreviewUrl);
@@ -56304,7 +56246,7 @@ function ResourceComposePage({
 }
 
 // src/features/resource-discovery/components/ResourceDiscoveryPage.tsx
-import { useState as useState38, useCallback as useCallback30, useRef as useRef33 } from "react";
+import { useState as useState38, useCallback as useCallback30, useRef as useRef31 } from "react";
 import { getResourceId as getResourceId2 } from "@semiont/api-client";
 
 // src/features/resource-discovery/components/ResourceCard.tsx
@@ -56395,7 +56337,7 @@ function ResourceDiscoveryPage({
     { orientation: "grid", cols: 2 }
     // 2 columns on medium+ screens
   );
-  const onNavigateToResourceRef = useRef33(onNavigateToResource);
+  const onNavigateToResourceRef = useRef31(onNavigateToResource);
   onNavigateToResourceRef.current = onNavigateToResource;
   const handleEntityTypeFilter = useCallback30((entityType4) => {
     setSelectedEntityType(entityType4);
@@ -56538,13 +56480,13 @@ function ResourceDiscoveryPage({
 }
 
 // src/features/resource-viewer/components/ResourceViewerPage.tsx
-import { useState as useState45, useEffect as useEffect50, useCallback as useCallback36, useMemo as useMemo12 } from "react";
+import { useState as useState44, useEffect as useEffect49, useCallback as useCallback35, useMemo as useMemo12 } from "react";
 import { useQueryClient as useQueryClient2 } from "@tanstack/react-query";
 import { getLanguage, getPrimaryRepresentation, resourceAnnotationUri as resourceAnnotationUri3, getPrimaryMediaType as getPrimaryMediaType2 } from "@semiont/api-client";
 import { uriToAnnotationId as uriToAnnotationId2 } from "@semiont/core";
 
 // src/hooks/useResolutionFlow.ts
-import { useCallback as useCallback31, useEffect as useEffect45, useRef as useRef34, useState as useState39 } from "react";
+import { useCallback as useCallback31, useEffect as useEffect44, useRef as useRef32, useState as useState39 } from "react";
 import { resourceAnnotationUri, accessToken as accessToken3 } from "@semiont/api-client";
 import { uriToAnnotationIdOrPassthrough } from "@semiont/core";
 function toAccessToken2(token) {
@@ -56559,19 +56501,19 @@ function useResolutionFlow(rUri) {
   const onCloseSearchModal = useCallback31(() => {
     setSearchModalOpen(false);
   }, []);
-  const rUriRef = useRef34(rUri);
-  useEffect45(() => {
+  const rUriRef = useRef32(rUri);
+  useEffect44(() => {
     rUriRef.current = rUri;
   });
-  const clientRef = useRef34(client);
-  useEffect45(() => {
+  const clientRef = useRef32(client);
+  useEffect44(() => {
     clientRef.current = client;
   });
-  const tokenRef = useRef34(token);
-  useEffect45(() => {
+  const tokenRef = useRef32(token);
+  useEffect44(() => {
     tokenRef.current = token;
   });
-  useEffect45(() => {
+  useEffect44(() => {
     const handleAnnotationUpdateBody = async (event) => {
       try {
         const annotationIdSegment = uriToAnnotationIdOrPassthrough(event.annotationUri);
@@ -56599,7 +56541,7 @@ function useResolutionFlow(rUri) {
       eventBus.off("reference:link", handleReferenceLink);
     };
   }, [eventBus]);
-  useEffect45(() => {
+  useEffect44(() => {
     const handleResolutionSearchRequested = (event) => {
       setPendingReferenceId(event.referenceId);
       setSearchModalOpen(true);
@@ -56613,7 +56555,7 @@ function useResolutionFlow(rUri) {
 }
 
 // src/hooks/useDetectionFlow.ts
-import { useState as useState40, useRef as useRef35, useEffect as useEffect46, useCallback as useCallback32 } from "react";
+import { useState as useState40, useRef as useRef33, useEffect as useEffect45, useCallback as useCallback32 } from "react";
 import { resourceAnnotationUri as resourceAnnotationUri2, accessToken as accessToken4, entityType as entityType3 } from "@semiont/api-client";
 import { uriToAnnotationIdOrPassthrough as uriToAnnotationIdOrPassthrough2 } from "@semiont/core";
 function toAccessToken3(token) {
@@ -56623,16 +56565,16 @@ function useDetectionFlow(rUri) {
   const eventBus = useEventBus();
   const client = useApiClient();
   const token = useAuthToken();
-  const clientRef = useRef35(client);
-  const rUriRef = useRef35(rUri);
-  const tokenRef = useRef35(token);
-  useEffect46(() => {
+  const clientRef = useRef33(client);
+  const rUriRef = useRef33(rUri);
+  const tokenRef = useRef33(token);
+  useEffect45(() => {
     clientRef.current = client;
   });
-  useEffect46(() => {
+  useEffect45(() => {
     rUriRef.current = rUri;
   });
-  useEffect46(() => {
+  useEffect45(() => {
     tokenRef.current = token;
   });
   const [pendingAnnotation, setPendingAnnotation] = useState40(null);
@@ -56704,8 +56646,8 @@ function useDetectionFlow(rUri) {
   }, []);
   const [detectingMotivation, setDetectingMotivation] = useState40(null);
   const [detectionProgress, setDetectionProgress] = useState40(null);
-  const detectionStreamRef = useRef35(null);
-  const progressDismissTimeoutRef = useRef35(null);
+  const detectionStreamRef = useRef33(null);
+  const progressDismissTimeoutRef = useRef33(null);
   const handleDetectionProgress = useCallback32((chunk) => {
     setDetectionProgress(chunk);
   }, []);
@@ -56739,7 +56681,7 @@ function useDetectionFlow(rUri) {
     }
     setDetectionProgress(null);
   }, []);
-  useEffect46(() => {
+  useEffect45(() => {
     const handleAnnotationCreate = async (event) => {
       const currentClient = clientRef.current;
       const currentRUri = rUriRef.current;
@@ -56754,6 +56696,7 @@ function useDetectionFlow(rUri) {
           body: event.body
         }, { auth: toAccessToken3(tokenRef.current) });
         if (result.annotation) {
+          setPendingAnnotation(null);
           eventBus.emit("annotation:created", { annotation: result.annotation });
         }
       } catch (error) {
@@ -56925,7 +56868,7 @@ function useDetectionFlow(rUri) {
     "detection:failed": handleDetectionFailed,
     "detection:dismiss-progress": handleDetectionDismissProgress
   });
-  useEffect46(() => {
+  useEffect45(() => {
     return () => {
       if (progressDismissTimeoutRef.current) {
         clearTimeout(progressDismissTimeoutRef.current);
@@ -56940,40 +56883,19 @@ function useDetectionFlow(rUri) {
   };
 }
 
-// src/hooks/useAttentionFlow.ts
-import { useState as useState41, useCallback as useCallback33 } from "react";
-function useAttentionFlow() {
-  const eventBus = useEventBus();
-  const [hoveredAnnotationId, setHoveredAnnotationId] = useState41(null);
-  const handleAnnotationHover = useCallback33(({ annotationId }) => {
-    setHoveredAnnotationId(annotationId);
-    if (annotationId) {
-      eventBus.emit("annotation:sparkle", { annotationId });
-    }
-  }, []);
-  const handleAnnotationClick = useCallback33(({ annotationId }) => {
-    eventBus.emit("annotation:focus", { annotationId });
-  }, []);
-  useEventSubscriptions({
-    "annotation:hover": handleAnnotationHover,
-    "annotation:click": handleAnnotationClick
-  });
-  return { hoveredAnnotationId };
-}
-
 // src/hooks/usePanelNavigation.ts
-import { useState as useState42, useCallback as useCallback34, useEffect as useEffect47 } from "react";
+import { useState as useState41, useCallback as useCallback33, useEffect as useEffect46 } from "react";
 function usePanelNavigation() {
-  const [activePanel, setActivePanel] = useState42(() => {
+  const [activePanel, setActivePanel] = useState41(() => {
     if (typeof window !== "undefined") {
       const saved = localStorage.getItem("activeToolbarPanel");
       return saved || null;
     }
     return null;
   });
-  const [scrollToAnnotationId, setScrollToAnnotationId] = useState42(null);
-  const [panelInitialTab, setPanelInitialTab] = useState42(null);
-  useEffect47(() => {
+  const [scrollToAnnotationId, setScrollToAnnotationId] = useState41(null);
+  const [panelInitialTab, setPanelInitialTab] = useState41(null);
+  useEffect46(() => {
     if (typeof window === "undefined") return;
     if (activePanel) {
       localStorage.setItem("activeToolbarPanel", activePanel);
@@ -56981,13 +56903,13 @@ function usePanelNavigation() {
       localStorage.removeItem("activeToolbarPanel");
     }
   }, [activePanel]);
-  const handleScrollCompleted = useCallback34(() => {
+  const handleScrollCompleted = useCallback33(() => {
     setScrollToAnnotationId(null);
   }, []);
-  const handlePanelToggle = useCallback34(({ panel }) => {
+  const handlePanelToggle = useCallback33(({ panel }) => {
     setActivePanel((current) => current === panel ? null : panel);
   }, []);
-  const handlePanelOpen = useCallback34(({ panel, scrollToAnnotationId: scrollTarget, motivation }) => {
+  const handlePanelOpen = useCallback33(({ panel, scrollToAnnotationId: scrollTarget, motivation }) => {
     if (scrollTarget) {
       setScrollToAnnotationId(scrollTarget);
     }
@@ -57004,7 +56926,7 @@ function usePanelNavigation() {
     }
     setActivePanel(panel);
   }, []);
-  const handlePanelClose = useCallback34(() => {
+  const handlePanelClose = useCallback33(() => {
     setActivePanel(null);
   }, []);
   useEventSubscriptions({
@@ -57021,7 +56943,7 @@ function usePanelNavigation() {
 }
 
 // src/hooks/useGenerationFlow.ts
-import { useState as useState43, useCallback as useCallback35, useEffect as useEffect48, useRef as useRef36 } from "react";
+import { useState as useState42, useCallback as useCallback34, useEffect as useEffect47, useRef as useRef34 } from "react";
 import { annotationUri, accessToken as accessToken5 } from "@semiont/api-client";
 function toAccessToken4(token) {
   return token ? accessToken5(token) : void 0;
@@ -57030,28 +56952,28 @@ function useGenerationFlow(locale, resourceId, showSuccess, showError, cacheMana
   const eventBus = useEventBus();
   const client = useApiClient();
   const token = useAuthToken();
-  const clientRef = useRef36(client);
-  const tokenRef = useRef36(token);
-  useEffect48(() => {
+  const clientRef = useRef34(client);
+  const tokenRef = useRef34(token);
+  useEffect47(() => {
     clientRef.current = client;
   });
-  useEffect48(() => {
+  useEffect47(() => {
     tokenRef.current = token;
   });
-  const generationStreamRef = useRef36(null);
-  const [isGenerating, setIsGenerating] = useState43(false);
-  const [generationProgress, setGenerationProgress] = useState43(null);
-  const handleProgressEvent = useCallback35((chunk) => {
+  const generationStreamRef = useRef34(null);
+  const [isGenerating, setIsGenerating] = useState42(false);
+  const [generationProgress, setGenerationProgress] = useState42(null);
+  const handleProgressEvent = useCallback34((chunk) => {
     setGenerationProgress(chunk);
     setIsGenerating(true);
   }, []);
-  const clearProgress = useCallback35(() => {
+  const clearProgress = useCallback34(() => {
     setGenerationProgress(null);
   }, []);
-  const [generationModalOpen, setGenerationModalOpen] = useState43(false);
-  const [generationReferenceId, setGenerationReferenceId] = useState43(null);
-  const [generationDefaultTitle, setGenerationDefaultTitle] = useState43("");
-  const handleGenerateDocument = useCallback35((referenceId, options) => {
+  const [generationModalOpen, setGenerationModalOpen] = useState42(false);
+  const [generationReferenceId, setGenerationReferenceId] = useState42(null);
+  const [generationDefaultTitle, setGenerationDefaultTitle] = useState42("");
+  const handleGenerateDocument = useCallback34((referenceId, options) => {
     if (!options.context) {
       setGenerationReferenceId(referenceId);
       setGenerationDefaultTitle(options.title);
@@ -57072,16 +56994,16 @@ function useGenerationFlow(locale, resourceId, showSuccess, showError, cacheMana
       }
     });
   }, [resourceId, clearNewAnnotationId, locale]);
-  const handleCloseGenerationModal = useCallback35(() => {
+  const handleCloseGenerationModal = useCallback34(() => {
     setGenerationModalOpen(false);
   }, []);
-  const handleGenerationModalOpen = useCallback35(({ annotationUri: annUri, resourceUri: resourceUri2, defaultTitle }) => {
+  const handleGenerationModalOpen = useCallback34(({ annotationUri: annUri, resourceUri: resourceUri2, defaultTitle }) => {
     setGenerationReferenceId(annUri);
     setGenerationDefaultTitle(defaultTitle);
     setGenerationModalOpen(true);
     eventBus.emit("context:retrieval-requested", { annotationUri: annUri, resourceUri: resourceUri2 });
   }, []);
-  const handleGenerationComplete = useCallback35(({ progress }) => {
+  const handleGenerationComplete = useCallback34(({ progress }) => {
     setGenerationProgress(progress);
     setIsGenerating(false);
     if (progress.resourceName) {
@@ -57094,12 +57016,12 @@ function useGenerationFlow(locale, resourceId, showSuccess, showError, cacheMana
     }
     setTimeout(() => clearProgress(), 2e3);
   }, [showSuccess, cacheManager, clearProgress]);
-  const handleGenerationFailed = useCallback35(({ error }) => {
+  const handleGenerationFailed = useCallback34(({ error }) => {
     setGenerationProgress(null);
     setIsGenerating(false);
     showError(`Resource generation failed: ${error.message}`);
   }, [showError]);
-  useEffect48(() => {
+  useEffect47(() => {
     const handleGenerationStart = async (event) => {
       console.log("[useGenerationFlow] handleGenerationStart called", { annotationUri: event.annotationUri, options: event.options });
       try {
@@ -57180,26 +57102,26 @@ function useGenerationFlow(locale, resourceId, showSuccess, showError, cacheMana
 }
 
 // src/hooks/useContextRetrievalFlow.ts
-import { useState as useState44, useEffect as useEffect49, useRef as useRef37 } from "react";
+import { useState as useState43, useEffect as useEffect48, useRef as useRef35 } from "react";
 import { accessToken as accessToken6 } from "@semiont/api-client";
 function toAccessToken5(token) {
   return token ? accessToken6(token) : void 0;
 }
 function useContextRetrievalFlow(emitter, config) {
   const token = useAuthToken();
-  const [retrievalContext, setRetrievalContext] = useState44(null);
-  const [retrievalLoading, setRetrievalLoading] = useState44(false);
-  const [retrievalError, setRetrievalError] = useState44(null);
-  const [retrievalAnnotationUri, setRetrievalAnnotationUri] = useState44(null);
-  const configRef = useRef37(config);
-  const tokenRef = useRef37(token);
-  useEffect49(() => {
+  const [retrievalContext, setRetrievalContext] = useState43(null);
+  const [retrievalLoading, setRetrievalLoading] = useState43(false);
+  const [retrievalError, setRetrievalError] = useState43(null);
+  const [retrievalAnnotationUri, setRetrievalAnnotationUri] = useState43(null);
+  const configRef = useRef35(config);
+  const tokenRef = useRef35(token);
+  useEffect48(() => {
     configRef.current = config;
   });
-  useEffect49(() => {
+  useEffect48(() => {
     tokenRef.current = token;
   });
-  useEffect49(() => {
+  useEffect48(() => {
     const handleContextRetrievalRequested = async (event) => {
       setRetrievalLoading(true);
       setRetrievalError(null);
@@ -57294,7 +57216,7 @@ function ResourceViewerPage({
     },
     500
   );
-  useEffect50(() => {
+  useEffect49(() => {
     if (resource && rUri) {
       const resourceIdSegment = rUri.split("/").pop() || "";
       const mediaType = getPrimaryMediaType2(resource);
@@ -57308,13 +57230,13 @@ function ResourceViewerPage({
     rUri,
     autoConnect: true,
     // Annotation events - use debounced invalidation to batch rapid updates
-    onAnnotationAdded: useCallback36((_event) => {
+    onAnnotationAdded: useCallback35((_event) => {
       debouncedInvalidateAnnotations();
     }, [debouncedInvalidateAnnotations]),
-    onAnnotationRemoved: useCallback36((_event) => {
+    onAnnotationRemoved: useCallback35((_event) => {
       debouncedInvalidateAnnotations();
     }, [debouncedInvalidateAnnotations]),
-    onAnnotationBodyUpdated: useCallback36((event) => {
+    onAnnotationBodyUpdated: useCallback35((event) => {
       queryClient.setQueryData(QUERY_KEYS.resources.annotations(rUri), (old) => {
         if (!old) return old;
         return {
@@ -57351,30 +57273,30 @@ function ResourceViewerPage({
       queryClient.invalidateQueries({ queryKey: QUERY_KEYS.resources.events(rUri) });
     }, [queryClient, rUri]),
     // Document status events
-    onDocumentArchived: useCallback36((_event) => {
+    onDocumentArchived: useCallback35((_event) => {
       refetchDocument();
       showSuccess("This document has been archived");
       debouncedInvalidateAnnotations();
     }, [refetchDocument, showSuccess, debouncedInvalidateAnnotations]),
-    onDocumentUnarchived: useCallback36((_event) => {
+    onDocumentUnarchived: useCallback35((_event) => {
       refetchDocument();
       showSuccess("This document has been unarchived");
       debouncedInvalidateAnnotations();
     }, [refetchDocument, showSuccess, debouncedInvalidateAnnotations]),
     // Entity tag events
-    onEntityTagAdded: useCallback36((_event) => {
+    onEntityTagAdded: useCallback35((_event) => {
       refetchDocument();
       debouncedInvalidateAnnotations();
     }, [refetchDocument, debouncedInvalidateAnnotations]),
-    onEntityTagRemoved: useCallback36((_event) => {
+    onEntityTagRemoved: useCallback35((_event) => {
       refetchDocument();
       debouncedInvalidateAnnotations();
     }, [refetchDocument, debouncedInvalidateAnnotations]),
-    onError: useCallback36((error) => {
+    onError: useCallback35((error) => {
       console.error("[RealTime] Event stream error:", error);
     }, [])
   });
-  const handleResourceArchive = useCallback36(async () => {
+  const handleResourceArchive = useCallback35(async () => {
     try {
       await resources.update.useMutation().mutateAsync({ rUri, data: { archived: true } });
       await refetchDocument();
@@ -57384,7 +57306,7 @@ function ResourceViewerPage({
       showError("Failed to archive document");
     }
   }, [resources.update, rUri, refetchDocument, showSuccess, showError]);
-  const handleResourceUnarchive = useCallback36(async () => {
+  const handleResourceUnarchive = useCallback35(async () => {
     try {
       await resources.update.useMutation().mutateAsync({ rUri, data: { archived: false } });
       await refetchDocument();
@@ -57394,7 +57316,7 @@ function ResourceViewerPage({
       showError("Failed to unarchive document");
     }
   }, [resources.update, rUri, refetchDocument, showSuccess, showError]);
-  const handleResourceClone = useCallback36(async () => {
+  const handleResourceClone = useCallback35(async () => {
     try {
       const result2 = await resources.generateCloneToken.useMutation().mutateAsync(rUri);
       const token = result2.token;
@@ -57406,34 +57328,34 @@ function ResourceViewerPage({
       showError("Failed to generate clone link");
     }
   }, [resources.generateCloneToken, rUri, showSuccess, showError]);
-  const handleAnnotationSparkle = useCallback36(({ annotationId }) => {
+  const handleAnnotationSparkle = useCallback35(({ annotationId }) => {
     triggerSparkleAnimation(annotationId);
   }, [triggerSparkleAnimation]);
-  const handleAnnotationCreated = useCallback36(({ annotation }) => {
+  const handleAnnotationCreated = useCallback35(({ annotation }) => {
     triggerSparkleAnimation(annotation.id);
     debouncedInvalidateAnnotations();
   }, [triggerSparkleAnimation, debouncedInvalidateAnnotations]);
-  const handleAnnotationCreateFailed = useCallback36(() => showError("Failed to create annotation"), [showError]);
-  const handleAnnotationDeleteFailed = useCallback36(() => showError("Failed to delete annotation"), [showError]);
-  const handleAnnotationBodyUpdated = useCallback36(() => {
+  const handleAnnotationCreateFailed = useCallback35(() => showError("Failed to create annotation"), [showError]);
+  const handleAnnotationDeleteFailed = useCallback35(() => showError("Failed to delete annotation"), [showError]);
+  const handleAnnotationBodyUpdated = useCallback35(() => {
   }, []);
-  const handleAnnotationBodyUpdateFailed = useCallback36(() => showError("Failed to update annotation"), [showError]);
-  const handleSettingsThemeChanged = useCallback36(({ theme: theme3 }) => setTheme(theme3), [setTheme]);
-  const handleDetectionComplete = useCallback36(() => {
+  const handleAnnotationBodyUpdateFailed = useCallback35(() => showError("Failed to update annotation"), [showError]);
+  const handleSettingsThemeChanged = useCallback35(({ theme: theme3 }) => setTheme(theme3), [setTheme]);
+  const handleDetectionComplete = useCallback35(() => {
     showSuccess("Detection complete");
     queryClient.invalidateQueries({ queryKey: QUERY_KEYS.resources.annotations(rUri) });
     queryClient.invalidateQueries({ queryKey: QUERY_KEYS.resources.events(rUri) });
   }, [showSuccess, queryClient, rUri]);
-  const handleDetectionFailed = useCallback36(() => showError("Detection failed"), [showError]);
-  const handleGenerationComplete = useCallback36(() => showSuccess("Document generated"), [showSuccess]);
-  const handleGenerationFailed = useCallback36(() => showError("Failed to generate document"), [showError]);
-  const handleReferenceNavigate = useCallback36(({ documentId }) => {
+  const handleDetectionFailed = useCallback35(() => showError("Detection failed"), [showError]);
+  const handleGenerationComplete = useCallback35(() => showSuccess("Document generated"), [showSuccess]);
+  const handleGenerationFailed = useCallback35(() => showError("Failed to generate document"), [showError]);
+  const handleReferenceNavigate = useCallback35(({ documentId }) => {
     if (routes.resource) {
       const path2 = routes.resource.replace("[resourceId]", encodeURIComponent(documentId));
       eventBus.emit("navigation:router-push", { path: path2, reason: "reference-link" });
     }
   }, [routes.resource]);
-  const handleEntityTypeClicked = useCallback36(({ entityType: entityType4 }) => {
+  const handleEntityTypeClicked = useCallback35(({ entityType: entityType4 }) => {
     if (routes.know) {
       const path2 = `${routes.know}?entityType=${encodeURIComponent(entityType4)}`;
       eventBus.emit("navigation:router-push", { path: path2, reason: "entity-type-filter" });
@@ -57463,7 +57385,7 @@ function ResourceViewerPage({
     announceResourceLoading,
     announceResourceLoaded
   } = useResourceLoadingAnnouncements();
-  useEffect50(() => {
+  useEffect49(() => {
     if (contentLoading) {
       announceResourceLoading(resource.name);
     } else if (content4) {
@@ -57474,7 +57396,7 @@ function ResourceViewerPage({
   const primaryRep = getPrimaryRepresentation(resource);
   const primaryMediaType = primaryRep?.mediaType;
   const primaryByteSize = primaryRep?.byteSize;
-  const [annotateMode, _setAnnotateMode] = useState45(() => {
+  const [annotateMode, _setAnnotateMode] = useState44(() => {
     if (typeof window !== "undefined") {
       return localStorage.getItem("annotateMode") === "true";
     }
@@ -57498,12 +57420,12 @@ function ResourceViewerPage({
   }
   const groups = result;
   const resourceWithContent = { ...resource, content: content4 };
-  const handleEventHover = useCallback36((annotationId) => {
+  const handleEventHover = useCallback35((annotationId) => {
     if (annotationId) {
       eventBus.emit("annotation:sparkle", { annotationId });
     }
   }, []);
-  const handleEventClick = useCallback36((_annotationId) => {
+  const handleEventClick = useCallback35((_annotationId) => {
   }, []);
   return /* @__PURE__ */ jsxs67("div", { className: `semiont-document-viewer${activePanel ? " semiont-document-viewer--panel-open" : ""}`, children: [
     /* @__PURE__ */ jsxs67("div", { className: "semiont-document-viewer__main", children: [
@@ -57701,6 +57623,7 @@ export {
   ErrorBoundary,
   EventBusProvider,
   Footer,
+  HOVER_DELAY_MS,
   HighlightEntry,
   HighlightPanel,
   HistoryEvent,
@@ -57769,6 +57692,7 @@ export {
   buttonStyles,
   createCancelDetectionHandler,
   createDetectionHandler,
+  createHoverHandlers,
   cssVariables,
   dispatch401Error,
   dispatch403Error,
@@ -57819,6 +57743,7 @@ export {
   useFormAnnouncements,
   useGenerationFlow,
   useHealth,
+  useHoverEmitter,
   useIsTyping,
   useKeyboardShortcuts,
   useLanguageChangeAnnouncements,