polen 0.10.0-next.12 → 0.10.0-next.14

package/build/lib/graphql-document/components/graphql-document-styles.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Minimal styles for GraphQL Document interactive code blocks
+ */
+export declare const graphqlDocumentStyles = "\n/* Container styles */\n.graphql-document {\n  position: relative;\n}\n\n.graphql-interaction-layer {\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  pointer-events: none;\n}\n\n.graphql-interaction-layer > * {\n  pointer-events: auto;\n}\n\n/* Identifier overlay styles */\n.graphql-identifier-overlay {\n  transition: background-color 0.2s ease;\n}\n\n/* Clickable identifiers get visual feedback */\n.graphql-identifier-overlay.graphql-clickable {\n  /* Subtle underline effect using box-shadow to not affect layout */\n  box-shadow: 0 1px 0 0 rgba(var(--accent-9), 0.3);\n  transition: box-shadow 0.2s ease, background-color 0.2s ease;\n}\n\n.graphql-identifier-overlay.graphql-clickable:hover {\n  background-color: rgba(var(--accent-3), 0.5);\n  box-shadow: 0 1px 0 0 rgba(var(--accent-9), 0.6);\n}\n\n/* Active/open state */\n.graphql-identifier-overlay.graphql-tooltip-open {\n  background-color: rgba(var(--accent-3), 0.5);\n  box-shadow: 0 1px 0 0 var(--accent-9);\n}\n\n/* Error state */\n.graphql-identifier-overlay.graphql-error {\n  box-shadow: 0 1.5px 0 0 var(--red-9);\n}\n\n.graphql-identifier-overlay.graphql-error:hover {\n  background-color: rgba(var(--red-3), 0.5);\n}\n\n/* Deprecated state */\n.graphql-identifier-overlay.graphql-deprecated {\n  text-decoration: line-through;\n  opacity: 0.7;\n}\n\n/* Debug mode */\n.graphql-identifier-overlay.graphql-debug {\n  background-color: rgba(59, 130, 246, 0.1) !important;\n  border: 1px solid rgba(59, 130, 246, 0.3) !important;\n}\n\n/* Kind-specific colors */\n.graphql-identifier-overlay.graphql-type.graphql-clickable {\n  box-shadow: 0 1px 0 0 rgba(var(--blue-9), 0.3);\n}\n\n.graphql-identifier-overlay.graphql-field.graphql-clickable {\n  box-shadow: 0 1px 0 0 rgba(var(--green-9), 0.3);\n}\n\n.graphql-identifier-overlay.graphql-argument.graphql-clickable {\n  box-shadow: 0 1px 0 0 rgba(var(--orange-9), 0.3);\n}\n\n.graphql-identifier-overlay.graphql-variable {\n  box-shadow: 0 1px 0 0 rgba(var(--purple-9), 0.3);\n}\n\n.graphql-identifier-overlay.graphql-directive.graphql-clickable {\n  box-shadow: 0 1px 0 0 rgba(var(--amber-9), 0.3);\n}\n\n/* Popover animation */\n.graphql-identifier-popover {\n  animation: graphql-popover-show 150ms ease-out;\n}\n\n@keyframes graphql-popover-show {\n  from {\n    opacity: 0;\n    transform: translateY(2px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n/* Validation errors */\n.graphql-validation-errors {\n  margin-top: 1rem;\n  padding: 0.5rem;\n  background-color: var(--red-2);\n  border: 1px solid var(--red-6);\n  border-radius: 4px;\n}\n\n.graphql-error {\n  color: var(--red-11);\n  font-size: 0.875rem;\n  margin: 0.25rem 0;\n}\n\n/* Loading state */\n.graphql-document.graphql-loading {\n  opacity: 0.6;\n  pointer-events: none;\n}\n\n.graphql-document.graphql-loading::after {\n  content: '';\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  width: 20px;\n  height: 20px;\n  margin: -10px 0 0 -10px;\n  border: 2px solid var(--gray-6);\n  border-top-color: var(--accent-9);\n  border-radius: 50%;\n  animation: graphql-spinner 0.8s linear infinite;\n}\n\n@keyframes graphql-spinner {\n  to {\n    transform: rotate(360deg);\n  }\n}\n\n/* Copy button */\n.graphql-document-copy {\n  position: absolute;\n  top: 1rem;\n  right: 1rem;\n  opacity: 0;\n  transition: opacity 0.2s ease;\n  z-index: 10;\n}\n\n.graphql-document:hover .graphql-document-copy {\n  opacity: 0.8;\n}\n\n.graphql-document-copy:hover {\n  opacity: 1 !important;\n}\n\n.graphql-document-copy[data-copied=\"true\"] {\n  opacity: 1 !important;\n  color: var(--green-9);\n}";
+//# sourceMappingURL=graphql-document-styles.d.ts.map

package/build/lib/graphql-document/components/graphql-document-styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"graphql-document-styles.d.ts","sourceRoot":"","sources":["../../../../src/lib/graphql-document/components/graphql-document-styles.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,eAAO,MAAM,qBAAqB,wjHAkKhC,CAAA"}

package/build/lib/graphql-document/components/graphql-document-styles.js

@@ -0,0 +1,167 @@
+/**
+ * Minimal styles for GraphQL Document interactive code blocks
+ */
+export const graphqlDocumentStyles = `
+/* Container styles */
+.graphql-document {
+  position: relative;
+}
+
+.graphql-interaction-layer {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  pointer-events: none;
+}
+
+.graphql-interaction-layer > * {
+  pointer-events: auto;
+}
+
+/* Identifier overlay styles */
+.graphql-identifier-overlay {
+  transition: background-color 0.2s ease;
+}
+
+/* Clickable identifiers get visual feedback */
+.graphql-identifier-overlay.graphql-clickable {
+  /* Subtle underline effect using box-shadow to not affect layout */
+  box-shadow: 0 1px 0 0 rgba(var(--accent-9), 0.3);
+  transition: box-shadow 0.2s ease, background-color 0.2s ease;
+}
+
+.graphql-identifier-overlay.graphql-clickable:hover {
+  background-color: rgba(var(--accent-3), 0.5);
+  box-shadow: 0 1px 0 0 rgba(var(--accent-9), 0.6);
+}
+
+/* Active/open state */
+.graphql-identifier-overlay.graphql-tooltip-open {
+  background-color: rgba(var(--accent-3), 0.5);
+  box-shadow: 0 1px 0 0 var(--accent-9);
+}
+
+/* Error state */
+.graphql-identifier-overlay.graphql-error {
+  box-shadow: 0 1.5px 0 0 var(--red-9);
+}
+
+.graphql-identifier-overlay.graphql-error:hover {
+  background-color: rgba(var(--red-3), 0.5);
+}
+
+/* Deprecated state */
+.graphql-identifier-overlay.graphql-deprecated {
+  text-decoration: line-through;
+  opacity: 0.7;
+}
+
+/* Debug mode */
+.graphql-identifier-overlay.graphql-debug {
+  background-color: rgba(59, 130, 246, 0.1) !important;
+  border: 1px solid rgba(59, 130, 246, 0.3) !important;
+}
+
+/* Kind-specific colors */
+.graphql-identifier-overlay.graphql-type.graphql-clickable {
+  box-shadow: 0 1px 0 0 rgba(var(--blue-9), 0.3);
+}
+
+.graphql-identifier-overlay.graphql-field.graphql-clickable {
+  box-shadow: 0 1px 0 0 rgba(var(--green-9), 0.3);
+}
+
+.graphql-identifier-overlay.graphql-argument.graphql-clickable {
+  box-shadow: 0 1px 0 0 rgba(var(--orange-9), 0.3);
+}
+
+.graphql-identifier-overlay.graphql-variable {
+  box-shadow: 0 1px 0 0 rgba(var(--purple-9), 0.3);
+}
+
+.graphql-identifier-overlay.graphql-directive.graphql-clickable {
+  box-shadow: 0 1px 0 0 rgba(var(--amber-9), 0.3);
+}
+
+/* Popover animation */
+.graphql-identifier-popover {
+  animation: graphql-popover-show 150ms ease-out;
+}
+
+@keyframes graphql-popover-show {
+  from {
+    opacity: 0;
+    transform: translateY(2px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+/* Validation errors */
+.graphql-validation-errors {
+  margin-top: 1rem;
+  padding: 0.5rem;
+  background-color: var(--red-2);
+  border: 1px solid var(--red-6);
+  border-radius: 4px;
+}
+
+.graphql-error {
+  color: var(--red-11);
+  font-size: 0.875rem;
+  margin: 0.25rem 0;
+}
+
+/* Loading state */
+.graphql-document.graphql-loading {
+  opacity: 0.6;
+  pointer-events: none;
+}
+
+.graphql-document.graphql-loading::after {
+  content: '';
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  width: 20px;
+  height: 20px;
+  margin: -10px 0 0 -10px;
+  border: 2px solid var(--gray-6);
+  border-top-color: var(--accent-9);
+  border-radius: 50%;
+  animation: graphql-spinner 0.8s linear infinite;
+}
+
+@keyframes graphql-spinner {
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+/* Copy button */
+.graphql-document-copy {
+  position: absolute;
+  top: 1rem;
+  right: 1rem;
+  opacity: 0;
+  transition: opacity 0.2s ease;
+  z-index: 10;
+}
+
+.graphql-document:hover .graphql-document-copy {
+  opacity: 0.8;
+}
+
+.graphql-document-copy:hover {
+  opacity: 1 !important;
+}
+
+.graphql-document-copy[data-copied="true"] {
+  opacity: 1 !important;
+  color: var(--green-9);
+}`;
+//# sourceMappingURL=graphql-document-styles.js.map

package/build/lib/graphql-document/components/graphql-document-styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"graphql-document-styles.js","sourceRoot":"","sources":["../../../../src/lib/graphql-document/components/graphql-document-styles.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,MAAM,CAAC,MAAM,qBAAqB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAkKnC,CAAA"}

package/build/lib/graphql-document/components/index.d.ts

@@ -1,5 +1,6 @@
+export * from './CopyButton.tsx';
 export * from './GraphQLDocument.tsx';
 export * from './GraphQLDocumentWithSchema.tsx';
-export * from './HoverTooltip.tsx';
+export * from './GraphQLIdentifierPopover.tsx';
 export * from './IdentifierLink.tsx';
 //# sourceMappingURL=index.d.ts.map

package/build/lib/graphql-document/components/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/lib/graphql-document/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAA;AACrC,cAAc,iCAAiC,CAAA;AAC/C,cAAc,oBAAoB,CAAA;AAClC,cAAc,sBAAsB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/lib/graphql-document/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,kBAAkB,CAAA;AAChC,cAAc,uBAAuB,CAAA;AACrC,cAAc,iCAAiC,CAAA;AAC/C,cAAc,gCAAgC,CAAA;AAC9C,cAAc,sBAAsB,CAAA"}

package/build/lib/graphql-document/components/index.js

@@ -1,5 +1,6 @@
+export * from "./CopyButton.js";
 export * from "./GraphQLDocument.js";
 export * from "./GraphQLDocumentWithSchema.js";
-export * from "./HoverTooltip.js";
+export * from "./GraphQLIdentifierPopover.js";
 export * from "./IdentifierLink.js";
 //# sourceMappingURL=index.js.map

package/build/lib/graphql-document/components/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/lib/graphql-document/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,sBAAuB,CAAA;AACrC,cAAc,gCAAiC,CAAA;AAC/C,cAAc,mBAAoB,CAAA;AAClC,cAAc,qBAAsB,CAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/lib/graphql-document/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAkB,CAAA;AAChC,cAAc,sBAAuB,CAAA;AACrC,cAAc,gCAAiC,CAAA;AAC/C,cAAc,+BAAgC,CAAA;AAC9C,cAAc,qBAAsB,CAAA"}

package/build/lib/graphql-document/hooks/use-tooltip-state.d.ts

@@ -0,0 +1,43 @@
+/**
+ * State management for GraphQL document tooltips
+ *
+ * Handles hover delays, pinning, and multiple tooltip coordination
+ */
+export interface TooltipState {
+    /** Currently visible tooltip (via hover) */
+    hoveredId: string | null;
+    /** Set of pinned tooltip IDs */
+    pinnedIds: Set<string>;
+    /** ID pending show (waiting for delay) */
+    pendingShowId: string | null;
+    /** ID pending hide (waiting for grace period) */
+    pendingHideId: string | null;
+}
+export interface UseTooltipStateOptions {
+    /** Delay before showing tooltip on hover (ms) */
+    showDelay?: number;
+    /** Delay before hiding tooltip on mouse leave (ms) */
+    hideDelay?: number;
+    /** Whether to allow multiple pinned tooltips */
+    allowMultiplePins?: boolean;
+}
+export interface UseTooltipStateReturn {
+    /** Check if a tooltip should be visible */
+    isOpen: (id: string) => boolean;
+    /** Check if a tooltip is pinned */
+    isPinned: (id: string) => boolean;
+    /** Handle hover start */
+    onHoverStart: (id: string) => void;
+    /** Handle hover end */
+    onHoverEnd: (id: string) => void;
+    /** Handle click (toggle pin) */
+    onTogglePin: (id: string) => void;
+    /** Handle tooltip content hover (cancels hide) */
+    onTooltipHover: (id: string) => void;
+    /** Unpin a specific tooltip */
+    unpin: (id: string) => void;
+    /** Unpin all tooltips */
+    unpinAll: () => void;
+}
+export declare const useTooltipState: (options?: UseTooltipStateOptions) => UseTooltipStateReturn;
+//# sourceMappingURL=use-tooltip-state.d.ts.map

package/build/lib/graphql-document/hooks/use-tooltip-state.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-tooltip-state.d.ts","sourceRoot":"","sources":["../../../../src/lib/graphql-document/hooks/use-tooltip-state.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAIH,MAAM,WAAW,YAAY;IAC3B,4CAA4C;IAC5C,SAAS,EAAE,MAAM,GAAG,IAAI,CAAA;IACxB,gCAAgC;IAChC,SAAS,EAAE,GAAG,CAAC,MAAM,CAAC,CAAA;IACtB,0CAA0C;IAC1C,aAAa,EAAE,MAAM,GAAG,IAAI,CAAA;IAC5B,iDAAiD;IACjD,aAAa,EAAE,MAAM,GAAG,IAAI,CAAA;CAC7B;AAED,MAAM,WAAW,sBAAsB;IACrC,iDAAiD;IACjD,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,sDAAsD;IACtD,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,gDAAgD;IAChD,iBAAiB,CAAC,EAAE,OAAO,CAAA;CAC5B;AAED,MAAM,WAAW,qBAAqB;IACpC,2CAA2C;IAC3C,MAAM,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,OAAO,CAAA;IAC/B,mCAAmC;IACnC,QAAQ,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,OAAO,CAAA;IACjC,yBAAyB;IACzB,YAAY,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAA;IAClC,uBAAuB;IACvB,UAAU,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAA;IAChC,gCAAgC;IAChC,WAAW,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAA;IACjC,kDAAkD;IAClD,cAAc,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAA;IACpC,+BAA+B;IAC/B,KAAK,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAA;IAC3B,yBAAyB;IACzB,QAAQ,EAAE,MAAM,IAAI,CAAA;CACrB;AAED,eAAO,MAAM,eAAe,GAAI,UAAS,sBAA2B,KAAG,qBA+ItE,CAAA"}

package/build/lib/graphql-document/hooks/use-tooltip-state.js

@@ -0,0 +1,132 @@
+/**
+ * State management for GraphQL document tooltips
+ *
+ * Handles hover delays, pinning, and multiple tooltip coordination
+ */
+import { React } from '#dep/react/index';
+export const useTooltipState = (options = {}) => {
+    const { showDelay = 300, hideDelay = 200, allowMultiplePins = true, } = options;
+    const [hoveredId, setHoveredId] = React.useState(null);
+    const [pinnedIds, setPinnedIds] = React.useState(new Set());
+    const [pendingShowId, setPendingShowId] = React.useState(null);
+    const [pendingHideId, setPendingHideId] = React.useState(null);
+    // Timer refs
+    const showTimerRef = React.useRef(null);
+    const hideTimerRef = React.useRef(null);
+    // Clear any pending timers
+    const clearTimers = React.useCallback(() => {
+        if (showTimerRef.current) {
+            clearTimeout(showTimerRef.current);
+            showTimerRef.current = null;
+        }
+        if (hideTimerRef.current) {
+            clearTimeout(hideTimerRef.current);
+            hideTimerRef.current = null;
+        }
+        setPendingShowId(null);
+        setPendingHideId(null);
+    }, []);
+    // Check if tooltip should be visible
+    const isOpen = React.useCallback((id) => {
+        return hoveredId === id || pinnedIds.has(id);
+    }, [hoveredId, pinnedIds]);
+    // Check if tooltip is pinned
+    const isPinned = React.useCallback((id) => {
+        return pinnedIds.has(id);
+    }, [pinnedIds]);
+    // Handle hover start
+    const onHoverStart = React.useCallback((id) => {
+        // Don't show if already pinned
+        if (pinnedIds.has(id))
+            return;
+        // Cancel any pending hide for this ID
+        if (pendingHideId === id) {
+            clearTimeout(hideTimerRef.current);
+            hideTimerRef.current = null;
+            setPendingHideId(null);
+            return;
+        }
+        // Clear any other pending operations
+        clearTimers();
+        // Schedule show
+        setPendingShowId(id);
+        showTimerRef.current = setTimeout(() => {
+            setHoveredId(id);
+            setPendingShowId(null);
+        }, showDelay);
+    }, [pinnedIds, pendingHideId, clearTimers, showDelay]);
+    // Handle hover end
+    const onHoverEnd = React.useCallback((id) => {
+        // Don't hide if pinned
+        if (pinnedIds.has(id))
+            return;
+        // Cancel pending show if still waiting
+        if (pendingShowId === id) {
+            clearTimeout(showTimerRef.current);
+            showTimerRef.current = null;
+            setPendingShowId(null);
+            return;
+        }
+        // Only hide if currently showing this tooltip
+        if (hoveredId === id) {
+            setPendingHideId(id);
+            hideTimerRef.current = setTimeout(() => {
+                // First set hovered to null to trigger close animation
+                setHoveredId(null);
+                setPendingHideId(null);
+            }, hideDelay);
+        }
+    }, [pinnedIds, pendingShowId, hoveredId, hideDelay]);
+    // Handle tooltip content hover (cancels hide)
+    const onTooltipHover = React.useCallback((id) => {
+        if (pendingHideId === id) {
+            clearTimeout(hideTimerRef.current);
+            hideTimerRef.current = null;
+            setPendingHideId(null);
+        }
+    }, [pendingHideId]);
+    // Toggle pin state
+    const onTogglePin = React.useCallback((id) => {
+        clearTimers();
+        setPinnedIds((prev) => {
+            const next = new Set(prev);
+            if (next.has(id)) {
+                // Unpin
+                next.delete(id);
+                setHoveredId(null); // Also clear hover state
+            }
+            else {
+                // Pin
+                if (!allowMultiplePins) {
+                    next.clear(); // Clear other pins
+                }
+                next.add(id);
+                setHoveredId(null); // Clear hover state since it's now pinned
+            }
+            return next;
+        });
+    }, [clearTimers, allowMultiplePins]);
+    // Unpin specific tooltip
+    const unpin = React.useCallback((id) => {
+        setPinnedIds((prev) => {
+            const next = new Set(prev);
+            next.delete(id);
+            return next;
+        });
+    }, []);
+    // Unpin all tooltips
+    const unpinAll = React.useCallback(() => {
+        setPinnedIds(new Set());
+    }, []);
+    return {
+        isOpen,
+        isPinned,
+        onHoverStart,
+        onHoverEnd,
+        onTogglePin,
+        onTooltipHover,
+        unpin,
+        unpinAll,
+    };
+};
+//# sourceMappingURL=use-tooltip-state.js.map

package/build/lib/graphql-document/hooks/use-tooltip-state.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-tooltip-state.js","sourceRoot":"","sources":["../../../../src/lib/graphql-document/hooks/use-tooltip-state.ts"],"names":[],"mappings":"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"}

package/build/lib/graphql-document/positioning-simple.d.ts

@@ -47,11 +47,6 @@ export declare class SimplePositionCalculator {
      * Get positions of all wrapped identifiers
      */
     getIdentifierPositions(containerElement: Element, relativeToElement?: Element): Map<string, PositionResult>;
-    /**
-     * Wrap an identifier in a span for positioning
-     * Returns true if the identifier was successfully wrapped
-     */
-    private wrapIdentifier;
 }
 /**
  * Create invisible overlay for a position

package/build/lib/graphql-document/positioning-simple.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"positioning-simple.d.ts","sourceRoot":"","sources":["../../../src/lib/graphql-document/positioning-simple.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,YAAY,CAAA;AAE5C;;GAEG;AACH,MAAM,WAAW,WAAW;IAC1B,+CAA+C;IAC/C,GAAG,EAAE,MAAM,CAAA;IACX,gDAAgD;IAChD,IAAI,EAAE,MAAM,CAAA;IACZ,wCAAwC;IACxC,KAAK,EAAE,MAAM,CAAA;IACb,yCAAyC;IACzC,MAAM,EAAE,MAAM,CAAA;CACf;AAED;;GAEG;AACH,MAAM,WAAW,cAAc;IAC7B,kCAAkC;IAClC,QAAQ,EAAE,WAAW,CAAA;IACrB,0CAA0C;IAC1C,UAAU,EAAE,UAAU,CAAA;CACvB;AAED;;;;;;;;;;GAUG;AACH,qBAAa,wBAAwB;IACnC;;OAEG;IACH,gBAAgB,CACd,gBAAgB,EAAE,OAAO,EACzB,WAAW,EAAE,UAAU,EAAE,GACxB,IAAI;IAmBP;;OAEG;IACH,sBAAsB,CACpB,gBAAgB,EAAE,OAAO,EACzB,iBAAiB,CAAC,EAAE,OAAO,GAC1B,GAAG,CAAC,MAAM,EAAE,cAAc,CAAC;IA4C9B;;;OAGG;IACH,OAAO,CAAC,cAAc;CAyFvB;AAED;;GAEG;AACH,eAAO,MAAM,mBAAmB,GAC9B,UAAU,WAAW,EACrB,YAAY,UAAU,EACtB,UAAU;IACR,OAAO,CAAC,EAAE,CAAC,UAAU,EAAE,UAAU,KAAK,IAAI,CAAA;IAC1C,OAAO,CAAC,EAAE,CAAC,UAAU,EAAE,UAAU,EAAE,KAAK,EAAE,UAAU,KAAK,IAAI,CAAA;IAC7D,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,KACA,WAqCF,CAAA;AAED;;GAEG;AACH,eAAO,MAAM,8BAA8B,QAAO,wBAEjD,CAAA"}
+{"version":3,"file":"positioning-simple.d.ts","sourceRoot":"","sources":["../../../src/lib/graphql-document/positioning-simple.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,YAAY,CAAA;AAE5C;;GAEG;AACH,MAAM,WAAW,WAAW;IAC1B,+CAA+C;IAC/C,GAAG,EAAE,MAAM,CAAA;IACX,gDAAgD;IAChD,IAAI,EAAE,MAAM,CAAA;IACZ,wCAAwC;IACxC,KAAK,EAAE,MAAM,CAAA;IACb,yCAAyC;IACzC,MAAM,EAAE,MAAM,CAAA;CACf;AAED;;GAEG;AACH,MAAM,WAAW,cAAc;IAC7B,kCAAkC;IAClC,QAAQ,EAAE,WAAW,CAAA;IACrB,0CAA0C;IAC1C,UAAU,EAAE,UAAU,CAAA;CACvB;AAED;;;;;;;;;;GAUG;AACH,qBAAa,wBAAwB;IACnC;;OAEG;IACH,gBAAgB,CACd,gBAAgB,EAAE,OAAO,EACzB,WAAW,EAAE,UAAU,EAAE,GACxB,IAAI;IAsGP;;OAEG;IACH,sBAAsB,CACpB,gBAAgB,EAAE,OAAO,EACzB,iBAAiB,CAAC,EAAE,OAAO,GAC1B,GAAG,CAAC,MAAM,EAAE,cAAc,CAAC;CA2C/B;AAED;;GAEG;AACH,eAAO,MAAM,mBAAmB,GAC9B,UAAU,WAAW,EACrB,YAAY,UAAU,EACtB,UAAU;IACR,OAAO,CAAC,EAAE,CAAC,UAAU,EAAE,UAAU,KAAK,IAAI,CAAA;IAC1C,OAAO,CAAC,EAAE,CAAC,UAAU,EAAE,UAAU,EAAE,KAAK,EAAE,UAAU,KAAK,IAAI,CAAA;IAC7D,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,KACA,WAqCF,CAAA;AAED;;GAEG;AACH,eAAO,MAAM,8BAA8B,QAAO,wBAEjD,CAAA"}

package/build/lib/graphql-document/positioning-simple.js

@@ -20,21 +20,85 @@ export class SimplePositionCalculator {
      * Prepare a code block for positioning by wrapping identifiers in spans
      */
     prepareCodeBlock(containerElement, identifiers) {
-        // Sort all identifiers by position (right to left, bottom to top)
-        const sortedIdentifiers = [...identifiers].sort((a, b) => {
-            // Sort by line first (bottom to top)
-            if (a.position.line !== b.position.line) {
-                return b.position.line - a.position.line;
+        // Get the full text content of the container
+        const fullText = containerElement.textContent || '';
+        const lines = fullText.split('\n');
+        // Build a map of line start positions in the full text
+        const lineStartPositions = [0];
+        for (let i = 0; i < lines.length - 1; i++) {
+            const lineLength = lines[i]?.length ?? 0;
+            lineStartPositions.push(lineStartPositions[i] + lineLength + 1); // +1 for newline
+        }
+        // Process identifiers by line
+        for (const identifier of identifiers) {
+            const lineIndex = identifier.position.line - 1;
+            if (lineIndex >= lines.length || lineIndex < 0)
+                continue;
+            const lineText = lines[lineIndex];
+            if (!lineText)
+                continue;
+            const columnIndex = identifier.position.column - 1;
+            // Check if the identifier exists at the expected position
+            if (lineText.substring(columnIndex).startsWith(identifier.name)) {
+                // Calculate the absolute position in the full text
+                const lineStartPosition = lineStartPositions[lineIndex] ?? 0;
+                const absolutePosition = lineStartPosition + columnIndex;
+                // Check if already wrapped at this specific position
+                const existingWrapped = containerElement.querySelectorAll(`[data-graphql-id]`);
+                let alreadyWrapped = false;
+                for (const wrapped of existingWrapped) {
+                    if (wrapped.textContent === identifier.name) {
+                        const startPos = parseInt(wrapped.getAttribute('data-graphql-start') || '0');
+                        if (startPos === identifier.position.start) {
+                            alreadyWrapped = true;
+                            break;
+                        }
+                    }
+                }
+                if (alreadyWrapped)
+                    continue;
+                // Create wrapper span
+                const wrapper = document.createElement('span');
+                const id = `${identifier.position.start}-${identifier.name}-${identifier.kind}`;
+                wrapper.setAttribute('data-graphql-id', id);
+                wrapper.setAttribute('data-graphql-name', identifier.name);
+                wrapper.setAttribute('data-graphql-kind', identifier.kind);
+                wrapper.setAttribute('data-graphql-start', String(identifier.position.start));
+                wrapper.setAttribute('data-graphql-end', String(identifier.position.end));
+                wrapper.setAttribute('data-graphql-line', String(identifier.position.line));
+                wrapper.setAttribute('data-graphql-column', String(identifier.position.column));
+                wrapper.setAttribute('data-graphql-path', identifier.schemaPath.join(','));
+                // Find the position in the container and wrap the text
+                const walker = document.createTreeWalker(containerElement, NodeFilter.SHOW_TEXT, null);
+                let currentPos = 0;
+                let node;
+                while (node = walker.nextNode()) {
+                    const textNode = node;
+                    const text = textNode.textContent || '';
+                    // Check if this text node contains our identifier
+                    if (currentPos <= absolutePosition && absolutePosition < currentPos + text.length) {
+                        const relativePos = absolutePosition - currentPos;
+                        if (text.substring(relativePos).startsWith(identifier.name)) {
+                            // Split the text node
+                            const before = text.substring(0, relativePos);
+                            const identifierText = identifier.name;
+                            const after = text.substring(relativePos + identifierText.length);
+                            const parent = textNode.parentNode;
+                            if (before) {
+                                parent.insertBefore(document.createTextNode(before), textNode);
+                            }
+                            wrapper.textContent = identifierText;
+                            parent.insertBefore(wrapper, textNode);
+                            if (after) {
+                                parent.insertBefore(document.createTextNode(after), textNode);
+                            }
+                            parent.removeChild(textNode);
+                            break;
+                        }
+                    }
+                    currentPos += text.length;
+                }
             }
-            // Then by column (right to left)
-            return b.position.column - a.position.column;
-        });
-        // Process all identifiers
-        let wrappedCount = 0;
-        for (const identifier of sortedIdentifiers) {
-            const wrapped = this.wrapIdentifier(containerElement, identifier);
-            if (wrapped)
-                wrappedCount++;
         }
     }
     /**
@@ -76,82 +140,6 @@ export class SimplePositionCalculator {
         }
         return results;
     }
-    /**
-     * Wrap an identifier in a span for positioning
-     * Returns true if the identifier was successfully wrapped
-     */
-    wrapIdentifier(containerElement, identifier) {
-        const walker = document.createTreeWalker(containerElement, NodeFilter.SHOW_TEXT, null);
-        let currentLine = 1;
-        let currentColumn = 1;
-        let node;
-        while (node = walker.nextNode()) {
-            const textNode = node;
-            const text = textNode.textContent || '';
-            // Check if already wrapped
-            if (textNode.parentElement?.hasAttribute('data-graphql-id')) {
-                // Update position tracking and continue
-                for (const char of text) {
-                    if (char === '\n') {
-                        currentLine++;
-                        currentColumn = 1;
-                    }
-                    else {
-                        currentColumn++;
-                    }
-                }
-                continue;
-            }
-            // Track position in the text
-            let textIndex = 0;
-            while (textIndex < text.length) {
-                // Check if we're at the identifier's position
-                if (currentLine === identifier.position.line
-                    && currentColumn === identifier.position.column) {
-                    // Verify it's actually our identifier
-                    const remainingText = text.substring(textIndex);
-                    if (remainingText.startsWith(identifier.name)) {
-                        // Create a unique ID for this identifier
-                        const id = `${identifier.position.start}-${identifier.name}-${identifier.kind}`;
-                        // Split the text node and wrap the identifier
-                        const before = text.substring(0, textIndex);
-                        const after = text.substring(textIndex + identifier.name.length);
-                        const span = document.createElement('span');
-                        span.setAttribute('data-graphql-id', id);
-                        span.setAttribute('data-graphql-name', identifier.name);
-                        span.setAttribute('data-graphql-kind', identifier.kind);
-                        span.setAttribute('data-graphql-start', String(identifier.position.start));
-                        span.setAttribute('data-graphql-end', String(identifier.position.end));
-                        span.setAttribute('data-graphql-line', String(identifier.position.line));
-                        span.setAttribute('data-graphql-column', String(identifier.position.column));
-                        span.setAttribute('data-graphql-path', identifier.schemaPath.join(','));
-                        span.textContent = identifier.name;
-                        const parent = textNode.parentNode;
-                        if (before) {
-                            parent.insertBefore(document.createTextNode(before), textNode);
-                        }
-                        parent.insertBefore(span, textNode);
-                        if (after) {
-                            parent.insertBefore(document.createTextNode(after), textNode);
-                        }
-                        parent.removeChild(textNode);
-                        return true;
-                    }
-                }
-                // Update position tracking
-                const char = text[textIndex];
-                if (char === '\n') {
-                    currentLine++;
-                    currentColumn = 1;
-                }
-                else {
-                    currentColumn++;
-                }
-                textIndex++;
-            }
-        }
-        return false; // Identifier not found
-    }
 }
 /**
  * Create invisible overlay for a position