@semiont/react-ui 0.2.33-build.79 → 0.2.33-build.81

package/dist/EventBusContext-CJjL_cCf.d.mts

@@ -0,0 +1,462 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ReactNode } from 'react';
+import mitt from 'mitt';
+import { ResourceEvent } from '@semiont/core';
+import { GenerationProgress as GenerationProgress$1, Selector, components, ResourceUri, GenerationContext } from '@semiont/api-client';
+
+/**
+ * Open Resources Manager Interface
+ *
+ * Manages a list of open resources (documents/files) with persistence.
+ * This interface allows apps to provide their own implementation of resource management
+ * (localStorage, sessionStorage, database, etc.) while components remain framework-agnostic.
+ *
+ * Components accept this manager as a prop instead of consuming from Context.
+ *
+ * @example
+ * ```tsx
+ * // In app (e.g., frontend/src/hooks/useOpenResourcesManager.ts)
+ * export function useOpenResourcesManager(): OpenResourcesManager {
+ *   const [openResources, setOpenResources] = useState<OpenResource[]>([]);
+ *
+ *   // Implementation details...
+ *
+ *   return {
+ *     openResources,
+ *     addResource,
+ *     removeResource,
+ *     updateResourceName,
+ *     reorderResources
+ *   };
+ * }
+ *
+ * // Pass to components as props
+ * <KnowledgeNavigation openResourcesManager={openResourcesManager} />
+ * ```
+ */
+interface OpenResource {
+    /** Unique identifier for the resource */
+    id: string;
+    /** Display name of the resource */
+    name: string;
+    /** Timestamp when the resource was opened */
+    openedAt: number;
+    /** Order/position for manual sorting (optional for backward compatibility) */
+    order?: number;
+    /** Media type for icon display (e.g., 'application/pdf', 'text/plain') */
+    mediaType?: string;
+}
+interface OpenResourcesManager {
+    /** List of currently open resources */
+    openResources: OpenResource[];
+    /**
+     * Add a new resource to the open list or update if already exists
+     * @param id - Unique resource identifier
+     * @param name - Display name of the resource
+     * @param mediaType - Optional media type for icon display
+     */
+    addResource: (id: string, name: string, mediaType?: string) => void;
+    /**
+     * Remove a resource from the open list
+     * @param id - Resource identifier to remove
+     */
+    removeResource: (id: string) => void;
+    /**
+     * Update the display name of an open resource
+     * @param id - Resource identifier
+     * @param name - New display name
+     */
+    updateResourceName: (id: string, name: string) => void;
+    /**
+     * Reorder resources by moving from one index to another
+     * @param oldIndex - Current position index
+     * @param newIndex - Desired position index
+     */
+    reorderResources: (oldIndex: number, newIndex: number) => void;
+}
+
+/**
+ * Session management interface for handling authentication state and session expiry
+ * Apps implement this interface and pass it to SessionProvider
+ */
+interface SessionState {
+    /** Whether the user is currently authenticated */
+    isAuthenticated: boolean;
+    /** When the session expires (null if not authenticated) */
+    expiresAt: Date | null;
+    /** Time in milliseconds until session expires (null if not authenticated) */
+    timeUntilExpiry: number | null;
+    /** Whether the session is expiring soon (< 5 minutes) */
+    isExpiringSoon: boolean;
+}
+interface SessionManager extends SessionState {
+}
+
+/**
+ * Translation management interface
+ * Apps implement this to provide translations using their preferred i18n library
+ */
+interface TranslationManager {
+    /**
+     * Translate a key within a namespace
+     * @param namespace - Translation namespace (e.g., 'Toolbar', 'ResourceViewer')
+     * @param key - Translation key within the namespace
+     * @param params - Optional parameters for interpolation
+     * @returns Translated string
+     */
+    t: (namespace: string, key: string, params?: Record<string, any>) => string;
+}
+
+/**
+ * Progress type definitions for detection and generation flows
+ */
+
+/**
+ * Common detection progress fields shared across all motivation types.
+ *
+ * The five motivations have different SSE progress shapes
+ * (ReferenceDetectionProgress uses entity-type steps; the others use percentage).
+ * This local type captures the subset of fields used by the detection UI
+ * (DetectionProgressWidget, useDetectionFlow).
+ */
+interface DetectionProgress {
+    status: string;
+    message?: string;
+    /** Reference detection: currently scanning entity type */
+    currentEntityType?: string;
+    /** Reference detection: completed entity types with counts (frontend-only) */
+    completedEntityTypes?: Array<{
+        entityType: string;
+        foundCount: number;
+    }>;
+    /** Percentage-based motivations (highlight, assessment, comment, tag) */
+    percentage?: number;
+    /** Category-based motivations (tag) */
+    currentCategory?: string;
+    processedCategories?: number;
+    totalCategories?: number;
+    /** Request parameters for display in progress UI (frontend-only, added by annotation-registry) */
+    requestParams?: Array<{
+        label: string;
+        value: string;
+    }>;
+}
+/**
+ * Generation progress type (no extensions needed, re-export API type)
+ */
+type GenerationProgress = GenerationProgress$1;
+
+type Annotation = components['schemas']['Annotation'];
+type Motivation = components['schemas']['Motivation'];
+interface SelectionData {
+    exact: string;
+    start: number;
+    end: number;
+    svgSelector?: string;
+    fragmentSelector?: string;
+    conformsTo?: string;
+    prefix?: string;
+    suffix?: string;
+}
+/**
+ * Unified event map for all application events
+ *
+ * Consolidates events from:
+ * - MakeMeaningEventBus (document/annotation operations)
+ * - NavigationEventBus (navigation and sidebar UI)
+ * - GlobalSettingsEventBus (app-wide settings)
+ */
+type EventMap = {
+    'make-meaning:event': ResourceEvent;
+    'detection:started': Extract<ResourceEvent, {
+        type: 'job.started';
+    }>;
+    'detection:entity-found': Extract<ResourceEvent, {
+        type: 'annotation.added';
+    }>;
+    'detection:completed': Extract<ResourceEvent, {
+        type: 'job.completed';
+    }>;
+    'detection:failed': Extract<ResourceEvent, {
+        type: 'job.failed';
+    }>;
+    'detection:progress': DetectionProgress;
+    'annotation:added': Extract<ResourceEvent, {
+        type: 'annotation.added';
+    }>;
+    'annotation:removed': Extract<ResourceEvent, {
+        type: 'annotation.removed';
+    }>;
+    'annotation:updated': Extract<ResourceEvent, {
+        type: 'annotation.body.updated';
+    }>;
+    'entity-tag:added': Extract<ResourceEvent, {
+        type: 'entitytag.added';
+    }>;
+    'entity-tag:removed': Extract<ResourceEvent, {
+        type: 'entitytag.removed';
+    }>;
+    'resource:archived': Extract<ResourceEvent, {
+        type: 'resource.archived';
+    }>;
+    'resource:unarchived': Extract<ResourceEvent, {
+        type: 'resource.unarchived';
+    }>;
+    'selection:comment-requested': SelectionData;
+    'selection:tag-requested': SelectionData;
+    'selection:assessment-requested': SelectionData;
+    'selection:reference-requested': SelectionData;
+    'annotation:requested': {
+        selector: Selector | Selector[];
+        motivation: Motivation;
+    };
+    'annotation:cancel-pending': void;
+    'annotation:hover': {
+        annotationId: string | null;
+    };
+    'annotation:click': {
+        annotationId: string;
+        motivation: Motivation;
+    };
+    'annotation:focus': {
+        annotationId: string | null;
+    };
+    'annotation:sparkle': {
+        annotationId: string;
+    };
+    'panel:toggle': {
+        panel: string;
+    };
+    'panel:open': {
+        panel: string;
+        scrollToAnnotationId?: string;
+        motivation?: string;
+    };
+    'panel:close': void;
+    'view:mode-toggled': void;
+    'toolbar:selection-changed': {
+        motivation: string | null;
+    };
+    'toolbar:click-changed': {
+        action: string;
+    };
+    'toolbar:shape-changed': {
+        shape: string;
+    };
+    'navigation:sidebar-toggle': void;
+    'navigation:resource-close': {
+        resourceId: string;
+    };
+    'navigation:resource-reorder': {
+        oldIndex: number;
+        newIndex: number;
+    };
+    'navigation:link-clicked': {
+        href: string;
+        label?: string;
+    };
+    'navigation:router-push': {
+        path: string;
+        reason?: string;
+    };
+    'navigation:external-navigate': {
+        url: string;
+        resourceId?: string;
+        cancelFallback: () => void;
+    };
+    'navigation:reference-navigate': {
+        documentId: string;
+    };
+    'navigation:entity-type-clicked': {
+        entityType: string;
+    };
+    'settings:theme-changed': {
+        theme: 'light' | 'dark' | 'system';
+    };
+    'settings:line-numbers-toggled': void;
+    'settings:locale-changed': {
+        locale: string;
+    };
+    'resource:archive': void;
+    'resource:unarchive': void;
+    'resource:clone': void;
+    'job:cancel-requested': {
+        jobType: 'detection' | 'generation';
+    };
+    'annotation:create': {
+        motivation: Motivation;
+        selector: Selector | Selector[];
+        body: components['schemas']['AnnotationBody'][];
+    };
+    'annotation:created': {
+        annotation: Annotation;
+    };
+    'annotation:create-failed': {
+        error: Error;
+    };
+    'annotation:delete': {
+        annotationId: string;
+    };
+    'annotation:deleted': {
+        annotationId: string;
+    };
+    'annotation:delete-failed': {
+        error: Error;
+    };
+    'annotation:update-body': {
+        annotationUri: string;
+        resourceId: string;
+        operations: Array<{
+            op: 'add' | 'remove' | 'replace';
+            item?: components['schemas']['AnnotationBody'];
+            oldItem?: components['schemas']['AnnotationBody'];
+            newItem?: components['schemas']['AnnotationBody'];
+        }>;
+    };
+    'annotation:body-updated': {
+        annotationUri: string;
+    };
+    'annotation:body-update-failed': {
+        error: Error;
+    };
+    'detection:start': {
+        motivation: Motivation;
+        options: {
+            instructions?: string;
+            /** Comment tone */
+            tone?: 'scholarly' | 'explanatory' | 'conversational' | 'technical' | 'analytical' | 'critical' | 'balanced' | 'constructive';
+            density?: number;
+            entityTypes?: string[];
+            includeDescriptiveReferences?: boolean;
+            schemaId?: string;
+            categories?: string[];
+        };
+    };
+    'detection:complete': {
+        motivation?: Motivation;
+        resourceUri?: ResourceUri;
+        progress?: DetectionProgress;
+    };
+    'detection:cancelled': void;
+    'detection:dismiss-progress': void;
+    'generation:start': {
+        annotationUri: string;
+        resourceUri: string;
+        options: {
+            title: string;
+            prompt?: string;
+            language?: string;
+            temperature?: number;
+            maxTokens?: number;
+            context: GenerationContext;
+        };
+    };
+    'generation:progress': GenerationProgress;
+    'generation:complete': {
+        annotationUri: string;
+        progress: GenerationProgress;
+    };
+    'generation:failed': {
+        error: Error;
+    };
+    'generation:modal-open': {
+        annotationUri: string;
+        resourceUri: string;
+        defaultTitle: string;
+    };
+    'reference:create-manual': {
+        annotationUri: string;
+        title: string;
+        entityTypes: string[];
+    };
+    'reference:link': {
+        annotationUri: string;
+        searchTerm: string;
+    };
+    'resolution:search-requested': {
+        referenceId: string;
+        searchTerm: string;
+    };
+    'context:retrieval-requested': {
+        annotationUri: string;
+        resourceUri: string;
+    };
+    'context:retrieval-complete': {
+        annotationUri: string;
+        context: GenerationContext;
+    };
+    'context:retrieval-failed': {
+        annotationUri: string;
+        error: Error;
+    };
+};
+type EventBus = ReturnType<typeof mitt<EventMap>> & {
+    busId: string;
+};
+/**
+ * Reset the global event bus - FOR TESTING ONLY.
+ *
+ * Call this in test setup (beforeEach) to ensure test isolation.
+ * Each test gets a fresh event bus with no lingering subscriptions.
+ *
+ * @example
+ * ```typescript
+ * beforeEach(() => {
+ *   resetEventBusForTesting();
+ * });
+ * ```
+ */
+declare function resetEventBusForTesting(): void;
+interface EventBusProviderProps {
+    children: ReactNode;
+}
+/**
+ * Unified event bus provider for all application events
+ *
+ * Consolidates three previous event buses:
+ * - MakeMeaningEventBus (document/annotation operations)
+ * - NavigationEventBus (navigation and sidebar UI)
+ * - GlobalSettingsEventBus (app-wide settings)
+ *
+ * Benefits:
+ * - Single import: useEventBus()
+ * - No decision fatigue about which bus to use
+ * - Easier cross-domain coordination
+ * - Simpler provider hierarchy
+ *
+ * NOTE: This provider uses a global singleton event bus to ensure all components
+ * share the same instance. Multiple providers in the tree will all reference the
+ * same global bus.
+ *
+ * Operation handlers (API calls triggered by events) are set up separately via
+ * the useResolutionFlow hook, which should be called at the resource page level.
+ */
+declare function EventBusProvider({ children, }: EventBusProviderProps): react_jsx_runtime.JSX.Element;
+/**
+ * Hook to access the unified event bus
+ *
+ * Use this everywhere instead of:
+ * - useMakeMeaningEvents()
+ * - useNavigationEvents()
+ * - useGlobalSettingsEvents()
+ *
+ * @example
+ * ```typescript
+ * const eventBus = useEventBus();
+ *
+ * // Emit any event
+ * eventBus.emit('annotation:hover', { annotationId: '123' });
+ * eventBus.emit('navigation:sidebar-toggle', undefined);
+ * eventBus.emit('settings:theme-changed', { theme: 'dark' });
+ *
+ * // Subscribe to any event
+ * useEffect(() => {
+ *   const handler = ({ annotationId }) => console.log(annotationId);
+ *   eventBus.on('annotation:hover', handler);
+ *   return () => eventBus.off('annotation:hover', handler);
+ * }, []);
+ * ```
+ */
+declare function useEventBus(): EventBus;
+
+export { type DetectionProgress as D, type EventBus as E, type GenerationProgress as G, type OpenResourcesManager as O, type SessionManager as S, type TranslationManager as T, type EventMap as a, type OpenResource as b, type SessionState as c, type EventBusProviderProps as d, EventBusProvider as e, resetEventBusForTesting as r, useEventBus as u };

package/dist/{PdfAnnotationCanvas.client-ADC4FFSE.mjs → PdfAnnotationCanvas.client-RAJRPQLU.mjs}

@@ -3,7 +3,7 @@
 import "./chunk-3JTO27MH.mjs";
 
 // src/components/pdf-annotation/PdfAnnotationCanvas.tsx
-import { useRef, useState, useCallback, useEffect } from "react";
+import { useRef, useState, useCallback, useEffect, useMemo } from "react";
 import { getTargetSelector } from "@semiont/api-client";
 
 // src/lib/pdf-coordinates.ts
@@ -151,14 +151,14 @@ function PdfAnnotationCanvas({
   existingAnnotations = [],
   drawingMode,
   selectedMotivation,
-  onAnnotationCreate,
-  onAnnotationClick,
-  onAnnotationHover,
+  eventBus,
   hoveredAnnotationId,
   selectedAnnotationId
 }) {
-  const resourceId = resourceUri.split("/").pop();
-  const pdfUrl = `/api/resources/${resourceId}`;
+  const pdfUrl = useMemo(() => {
+    const resourceId = resourceUri.split("/").pop();
+    return `/api/resources/${resourceId}`;
+  }, [resourceUri]);
   const [pdfDoc, setPdfDoc] = useState(null);
   const [numPages, setNumPages] = useState(0);
   const [pageNumber, setPageNumber] = useState(1);
@@ -172,6 +172,7 @@ function PdfAnnotationCanvas({
   const [selection, setSelection] = useState(null);
   const containerRef = useRef(null);
   const imageRef = useRef(null);
+  const currentHover = useRef(null);
   useEffect(() => {
     let cancelled = false;
     async function loadPdf() {
@@ -274,7 +275,7 @@ function PdfAnnotationCanvas({
     });
   }, [isDrawing, selection]);
   const handleMouseUp = useCallback(() => {
-    if (!isDrawing || !selection || !pageDimensions || !displayDimensions || !onAnnotationCreate) {
+    if (!isDrawing || !selection || !pageDimensions || !displayDimensions || !eventBus) {
       setIsDrawing(false);
       setSelection(null);
       return;
@@ -284,23 +285,23 @@ function PdfAnnotationCanvas({
     );
     const MIN_DRAG_DISTANCE = 10;
     if (dragDistance < MIN_DRAG_DISTANCE) {
-      if (onAnnotationClick && existingAnnotations.length > 0) {
+      if (existingAnnotations.length > 0) {
         const clickedAnnotation = pageAnnotations.find((ann) => {
           const fragmentSel = getFragmentSelector(ann.target);
           if (!fragmentSel) return false;
           const pdfCoord2 = parseFragmentSelector(fragmentSel.value);
           if (!pdfCoord2) return false;
-          const rect2 = pdfToCanvasCoordinates(pdfCoord2, pageDimensions.height, 1);
+          const rect = pdfToCanvasCoordinates(pdfCoord2, pageDimensions.height, 1);
           const scaleX2 = displayDimensions.width / pageDimensions.width;
           const scaleY2 = displayDimensions.height / pageDimensions.height;
-          const displayX = rect2.x * scaleX2;
-          const displayY = rect2.y * scaleY2;
-          const displayWidth = rect2.width * scaleX2;
-          const displayHeight = rect2.height * scaleY2;
+          const displayX = rect.x * scaleX2;
+          const displayY = rect.y * scaleY2;
+          const displayWidth = rect.width * scaleX2;
+          const displayHeight = rect.height * scaleY2;
           return selection.endX >= displayX && selection.endX <= displayX + displayWidth && selection.endY >= displayY && selection.endY <= displayY + displayHeight;
         });
         if (clickedAnnotation) {
-          onAnnotationClick(clickedAnnotation);
+          eventBus?.emit("annotation:click", { annotationId: clickedAnnotation.id, motivation: clickedAnnotation.motivation });
           setIsDrawing(false);
           setSelection(null);
           return;
@@ -327,16 +328,18 @@ function PdfAnnotationCanvas({
       // Use scale 1.0 since we already scaled to native coords
     );
     const fragmentSelector = createFragmentSelector(pdfCoord);
-    const centerX = (selection.startX + selection.endX) / 2;
-    const centerY = (selection.startY + selection.endY) / 2;
-    const rect = imageRef.current?.getBoundingClientRect();
-    const screenPosition = rect ? {
-      x: rect.left + centerX,
-      y: rect.top + centerY
-    } : void 0;
-    onAnnotationCreate(fragmentSelector, screenPosition);
+    if (selectedMotivation) {
+      eventBus.emit("annotation:requested", {
+        selector: {
+          type: "FragmentSelector",
+          conformsTo: "http://tools.ietf.org/rfc/rfc3778",
+          value: fragmentSelector
+        },
+        motivation: selectedMotivation
+      });
+    }
     setIsDrawing(false);
-  }, [isDrawing, selection, pageNumber, pageDimensions, displayDimensions, onAnnotationCreate, onAnnotationClick, existingAnnotations]);
+  }, [isDrawing, selection, pageNumber, pageDimensions, displayDimensions, selectedMotivation, existingAnnotations]);
   const getFragmentSelector = (target) => {
     const selector = getTargetSelector(target);
     if (!selector) return null;
@@ -351,6 +354,18 @@ function PdfAnnotationCanvas({
     const page = getPageFromFragment(fragmentSel.value);
     return page === pageNumber;
   });
+  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 { stroke, fill } = getMotivationColor(selectedMotivation ?? null);
   if (error) {
     return /* @__PURE__ */ jsx("div", { className: "semiont-pdf-annotation-canvas__error", children: error });
@@ -431,9 +446,9 @@ function PdfAnnotationCanvas({
                         cursor: "pointer",
                         opacity: isSelected ? 1 : isHovered ? 0.9 : 0.7
                       },
-                      onClick: () => onAnnotationClick?.(ann),
-                      onMouseEnter: () => onAnnotationHover?.(ann.id),
-                      onMouseLeave: () => onAnnotationHover?.(null)
+                      onClick: () => eventBus?.emit("annotation:click", { annotationId: ann.id, motivation: ann.motivation }),
+                      onMouseEnter: () => handleMouseEnter(ann.id),
+                      onMouseLeave: handleMouseLeave
                     },
                     ann.id
                   );
@@ -495,4 +510,4 @@ function PdfAnnotationCanvas({
 export {
   PdfAnnotationCanvas
 };
-//# sourceMappingURL=PdfAnnotationCanvas.client-ADC4FFSE.mjs.map
+//# sourceMappingURL=PdfAnnotationCanvas.client-RAJRPQLU.mjs.map