@critique.work/agentation 2.3.0 → 2.4.0

package/dist/index.d.mts

@@ -33,6 +33,9 @@ type Annotation = {
     }>;
     drawingIndex?: number;
     strokeId?: string;
+    lineText?: string;
+    contextBefore?: string[];
+    contextAfter?: string[];
     sessionId?: string;
     url?: string;
     intent?: AnnotationIntent;
@@ -273,6 +276,21 @@ declare function identifyElement(target: HTMLElement): {
  * Gets text content from element and siblings for context
  */
 declare function getNearbyText(element: HTMLElement): string;
+/**
+ * Surrounding context from sibling nodes in a repeated structure.
+ * Walks up the DOM to find the nearest ancestor that is one of many
+ * siblings (e.g. lines in a diff, rows in a table, items in a list),
+ * then collects text from N siblings before and after.
+ */
+interface SurroundingContext {
+    /** Text of the node the annotation is on */
+    lineText: string;
+    /** Text of preceding sibling nodes (oldest first) */
+    contextBefore: string[];
+    /** Text of following sibling nodes (closest first) */
+    contextAfter: string[];
+}
+declare function getSurroundingNodes(element: HTMLElement, radius?: number): SurroundingContext | null;
 /**
  * Simplified element identifier for animation feedback (less verbose)
  */
@@ -286,4 +304,4 @@ declare function getStorageKey(pathname: string): string;
 declare function loadAnnotations<T = Annotation>(pathname: string): T[];
 declare function saveAnnotations<T = Annotation>(pathname: string, annotations: T[]): void;
 
-export { PageFeedbackToolbarCSS as Agentation, type AgentationProps, AnimatedBunny, type Annotation, AnnotationPopupCSS, type AnnotationPopupCSSHandle, type AnnotationPopupCSSProps, type DemoAnnotation, IconChatEllipsis, IconCheck, IconCheckSmall, IconCheckSmallAnimated, IconCheckmark, IconCheckmarkCircle, IconCheckmarkLarge, IconChevronLeft, IconChevronRight, IconClose, IconCopyAlt, IconCopyAnimated, IconEdit, IconEye, IconEyeAlt, IconEyeAnimated, IconEyeClosed, IconEyeMinus, IconGear, IconHelp, IconListSparkle, IconMoon, IconPause, IconPauseAlt, IconPausePlayAnimated, IconPencil, IconPlayAlt, IconPlus, IconSendAnimated, IconSendArrow, IconSun, IconTrash, IconTrashAlt, IconXmark, IconXmarkLarge, PageFeedbackToolbarCSS, closestCrossingShadow, getElementClasses, getElementPath, getNearbyText, getShadowHost, getStorageKey, identifyAnimationElement, identifyElement, isInShadowDOM, loadAnnotations, saveAnnotations };
+export { PageFeedbackToolbarCSS as Agentation, type AgentationProps, AnimatedBunny, type Annotation, AnnotationPopupCSS, type AnnotationPopupCSSHandle, type AnnotationPopupCSSProps, type DemoAnnotation, IconChatEllipsis, IconCheck, IconCheckSmall, IconCheckSmallAnimated, IconCheckmark, IconCheckmarkCircle, IconCheckmarkLarge, IconChevronLeft, IconChevronRight, IconClose, IconCopyAlt, IconCopyAnimated, IconEdit, IconEye, IconEyeAlt, IconEyeAnimated, IconEyeClosed, IconEyeMinus, IconGear, IconHelp, IconListSparkle, IconMoon, IconPause, IconPauseAlt, IconPausePlayAnimated, IconPencil, IconPlayAlt, IconPlus, IconSendAnimated, IconSendArrow, IconSun, IconTrash, IconTrashAlt, IconXmark, IconXmarkLarge, PageFeedbackToolbarCSS, type SurroundingContext, closestCrossingShadow, getElementClasses, getElementPath, getNearbyText, getShadowHost, getStorageKey, getSurroundingNodes, identifyAnimationElement, identifyElement, isInShadowDOM, loadAnnotations, saveAnnotations };

package/dist/index.d.ts

@@ -33,6 +33,9 @@ type Annotation = {
     }>;
     drawingIndex?: number;
     strokeId?: string;
+    lineText?: string;
+    contextBefore?: string[];
+    contextAfter?: string[];
     sessionId?: string;
     url?: string;
     intent?: AnnotationIntent;
@@ -273,6 +276,21 @@ declare function identifyElement(target: HTMLElement): {
  * Gets text content from element and siblings for context
  */
 declare function getNearbyText(element: HTMLElement): string;
+/**
+ * Surrounding context from sibling nodes in a repeated structure.
+ * Walks up the DOM to find the nearest ancestor that is one of many
+ * siblings (e.g. lines in a diff, rows in a table, items in a list),
+ * then collects text from N siblings before and after.
+ */
+interface SurroundingContext {
+    /** Text of the node the annotation is on */
+    lineText: string;
+    /** Text of preceding sibling nodes (oldest first) */
+    contextBefore: string[];
+    /** Text of following sibling nodes (closest first) */
+    contextAfter: string[];
+}
+declare function getSurroundingNodes(element: HTMLElement, radius?: number): SurroundingContext | null;
 /**
  * Simplified element identifier for animation feedback (less verbose)
  */
@@ -286,4 +304,4 @@ declare function getStorageKey(pathname: string): string;
 declare function loadAnnotations<T = Annotation>(pathname: string): T[];
 declare function saveAnnotations<T = Annotation>(pathname: string, annotations: T[]): void;
 
-export { PageFeedbackToolbarCSS as Agentation, type AgentationProps, AnimatedBunny, type Annotation, AnnotationPopupCSS, type AnnotationPopupCSSHandle, type AnnotationPopupCSSProps, type DemoAnnotation, IconChatEllipsis, IconCheck, IconCheckSmall, IconCheckSmallAnimated, IconCheckmark, IconCheckmarkCircle, IconCheckmarkLarge, IconChevronLeft, IconChevronRight, IconClose, IconCopyAlt, IconCopyAnimated, IconEdit, IconEye, IconEyeAlt, IconEyeAnimated, IconEyeClosed, IconEyeMinus, IconGear, IconHelp, IconListSparkle, IconMoon, IconPause, IconPauseAlt, IconPausePlayAnimated, IconPencil, IconPlayAlt, IconPlus, IconSendAnimated, IconSendArrow, IconSun, IconTrash, IconTrashAlt, IconXmark, IconXmarkLarge, PageFeedbackToolbarCSS, closestCrossingShadow, getElementClasses, getElementPath, getNearbyText, getShadowHost, getStorageKey, identifyAnimationElement, identifyElement, isInShadowDOM, loadAnnotations, saveAnnotations };
+export { PageFeedbackToolbarCSS as Agentation, type AgentationProps, AnimatedBunny, type Annotation, AnnotationPopupCSS, type AnnotationPopupCSSHandle, type AnnotationPopupCSSProps, type DemoAnnotation, IconChatEllipsis, IconCheck, IconCheckSmall, IconCheckSmallAnimated, IconCheckmark, IconCheckmarkCircle, IconCheckmarkLarge, IconChevronLeft, IconChevronRight, IconClose, IconCopyAlt, IconCopyAnimated, IconEdit, IconEye, IconEyeAlt, IconEyeAnimated, IconEyeClosed, IconEyeMinus, IconGear, IconHelp, IconListSparkle, IconMoon, IconPause, IconPauseAlt, IconPausePlayAnimated, IconPencil, IconPlayAlt, IconPlus, IconSendAnimated, IconSendArrow, IconSun, IconTrash, IconTrashAlt, IconXmark, IconXmarkLarge, PageFeedbackToolbarCSS, type SurroundingContext, closestCrossingShadow, getElementClasses, getElementPath, getNearbyText, getShadowHost, getStorageKey, getSurroundingNodes, identifyAnimationElement, identifyElement, isInShadowDOM, loadAnnotations, saveAnnotations };

package/dist/index.js

@@ -66,6 +66,7 @@ __export(index_exports, {
   getNearbyText: () => getNearbyText,
   getShadowHost: () => getShadowHost,
   getStorageKey: () => getStorageKey,
+  getSurroundingNodes: () => getSurroundingNodes,
   identifyAnimationElement: () => identifyAnimationElement,
   identifyElement: () => identifyElement,
   isInShadowDOM: () => isInShadowDOM,
@@ -2230,6 +2231,32 @@ function getNearbyText(element) {
   }
   return texts.join(" ");
 }
+var MIN_SIBLINGS = 3;
+function getSurroundingNodes(element, radius = 3) {
+  let node = element;
+  while (node) {
+    const parent = node.parentElement;
+    if (parent && parent.children.length >= MIN_SIBLINGS) break;
+    node = node.parentElement;
+  }
+  if (!node) return null;
+  const lineText = (node.textContent ?? "").replace(/\n/g, " ").trim();
+  const contextBefore = [];
+  let prev = node.previousElementSibling;
+  for (let i3 = 0; i3 < radius && prev; i3++) {
+    const text = (prev.textContent ?? "").replace(/\n/g, " ").trim();
+    if (text) contextBefore.unshift(text);
+    prev = prev.previousElementSibling;
+  }
+  const contextAfter = [];
+  let next = node.nextElementSibling;
+  for (let i3 = 0; i3 < radius && next; i3++) {
+    const text = (next.textContent ?? "").replace(/\n/g, " ").trim();
+    if (text) contextAfter.push(text);
+    next = next.nextElementSibling;
+  }
+  return { lineText, contextBefore, contextAfter };
+}
 function identifyAnimationElement(target) {
   if (target.dataset.element) return target.dataset.element;
   const tag = target.tagName.toLowerCase();
@@ -4010,7 +4037,8 @@ function PageFeedbackToolbarCSS({
         nearbyElements: getNearbyElements(firstEl),
         cssClasses: getElementClasses(firstEl),
         nearbyText: getNearbyText(firstEl),
-        reactComponents: firstItem.reactComponents
+        reactComponents: firstItem.reactComponents,
+        ...getSurroundingNodes(firstEl)
       });
     } else {
       const bounds = {
@@ -4057,7 +4085,8 @@ function PageFeedbackToolbarCSS({
         computedStylesObj: getDetailedComputedStyles(firstEl),
         nearbyElements: getNearbyElements(firstEl),
         cssClasses: getElementClasses(firstEl),
-        nearbyText: getNearbyText(firstEl)
+        nearbyText: getNearbyText(firstEl),
+        ...getSurroundingNodes(firstEl)
       });
     }
     setPendingMultiSelectElements([]);
@@ -4297,7 +4326,8 @@ function PageFeedbackToolbarCSS({
             reactComponents: reactComponents2 ?? void 0,
             targetElement: elementUnder2 ?? void 0,
             drawingIndex: strokeIdx,
-            strokeId: stroke.id
+            strokeId: stroke.id,
+            ...elementUnder2 ? getSurroundingNodes(elementUnder2) : {}
           });
           setHoverInfo(null);
           setHoveredDrawingIdx(null);
@@ -4399,8 +4429,9 @@ function PageFeedbackToolbarCSS({
         computedStylesObj,
         nearbyElements: getNearbyElements(elementUnder),
         reactComponents: reactComponents ?? void 0,
-        targetElement: elementUnder
+        targetElement: elementUnder,
         // Store for live position queries
+        ...getSurroundingNodes(elementUnder)
       });
       setHoverInfo(null);
     };
@@ -4717,7 +4748,8 @@ function PageFeedbackToolbarCSS({
             computedStylesObj: firstElementComputedStyles,
             nearbyElements: getNearbyElements(firstElement),
             cssClasses: getElementClasses(firstElement),
-            nearbyText: getNearbyText(firstElement)
+            nearbyText: getNearbyText(firstElement),
+            ...getSurroundingNodes(firstElement)
           });
         } else {
           const width = Math.abs(right - left);
@@ -4921,7 +4953,8 @@ function PageFeedbackToolbarCSS({
             reactComponents: reactComponents ?? void 0,
             targetElement: elementUnder ?? void 0,
             drawingIndex: strokeIdx,
-            strokeId: stroke.id
+            strokeId: stroke.id,
+            ...elementUnder ? getSurroundingNodes(elementUnder) : {}
           });
           setHoverInfo(null);
           setHoveredDrawingIdx(null);
@@ -5024,7 +5057,8 @@ function PageFeedbackToolbarCSS({
           reactComponents: reactComponents ?? void 0,
           targetElement: centerEl ?? void 0,
           drawingIndex: newStrokeIdx,
-          strokeId: newStrokeId
+          strokeId: newStrokeId,
+          ...centerEl ? getSurroundingNodes(centerEl) : {}
         });
         setHoverInfo(null);
       }
@@ -5151,6 +5185,9 @@ function PageFeedbackToolbarCSS({
         elementBoundingBoxes: pendingAnnotation.elementBoundingBoxes,
         drawingIndex: pendingAnnotation.drawingIndex,
         strokeId: pendingAnnotation.strokeId,
+        lineText: pendingAnnotation.lineText,
+        contextBefore: pendingAnnotation.contextBefore,
+        contextAfter: pendingAnnotation.contextAfter,
         // Protocol fields for server sync
         ...endpoint && currentSessionId ? {
           sessionId: currentSessionId,
@@ -6109,7 +6146,7 @@ function PageFeedbackToolbarCSS({
                                   ] }),
                                   /* @__PURE__ */ u3("span", { className: styles_module_default2.settingsVersion, children: [
                                     "v",
-                                    "2.3.0"
+                                    "2.4.0"
                                   ] }),
                                   /* @__PURE__ */ u3(
                                     "button",
@@ -7102,6 +7139,7 @@ function PageFeedbackToolbarCSS({
   getNearbyText,
   getShadowHost,
   getStorageKey,
+  getSurroundingNodes,
   identifyAnimationElement,
   identifyElement,
   isInShadowDOM,