@proveanything/smartlinks-utils-ui 0.12.20 → 0.12.22

package/dist/components/RecordsAdmin/index.js

@@ -8840,6 +8840,8 @@ function PreviewReopenPill({
   side = "right",
   vAlign = "center"
 }) {
+  const EDGE_INSET = 0;
+  const TUCK_OFFSET = -12;
   const [pos, setPos] = useState(null);
   const rafRef = useRef(null);
   const getViewportCenterY = () => {
@@ -8853,25 +8855,26 @@ function PreviewReopenPill({
     const TOP_INSET = 0;
     const fallbackTop = () => vAlign === "top" ? TOP_INSET : vAlign === "bottom" ? Math.max(0, window.innerHeight - TOP_INSET) : getViewportCenterY();
     if (!el) {
-      setPos({ top: fallbackTop(), right: 8, left: 8 });
+      setPos({ top: fallbackTop(), right: EDGE_INSET, left: EDGE_INSET });
       return;
     }
+    const applyMeasurement = () => {
+      const rect = el.getBoundingClientRect();
+      if (rect.width === 0 && rect.height === 0) {
+        return;
+      }
+      const top = vAlign === "top" ? rect.top + TOP_INSET : vAlign === "bottom" ? rect.bottom - TOP_INSET : getViewportCenterY();
+      setPos({
+        top,
+        right: EDGE_INSET,
+        left: EDGE_INSET
+      });
+    };
     const measure = () => {
       if (rafRef.current != null) cancelAnimationFrame(rafRef.current);
-      rafRef.current = requestAnimationFrame(() => {
-        const rect = el.getBoundingClientRect();
-        if (rect.width === 0 && rect.height === 0) {
-          return;
-        }
-        const top = vAlign === "top" ? rect.top + TOP_INSET : vAlign === "bottom" ? rect.bottom - TOP_INSET : getViewportCenterY();
-        setPos({
-          top,
-          right: 0,
-          left: 0
-        });
-      });
+      rafRef.current = requestAnimationFrame(applyMeasurement);
     };
-    measure();
+    applyMeasurement();
     const ro = new ResizeObserver(measure);
     ro.observe(el);
     ro.observe(document.body);
@@ -8887,12 +8890,12 @@ function PreviewReopenPill({
       window.visualViewport?.removeEventListener("scroll", measure);
       if (rafRef.current != null) cancelAnimationFrame(rafRef.current);
     };
-  }, [anchorRef, vAlign]);
+  }, [anchorRef, vAlign, EDGE_INSET]);
   if (typeof document === "undefined") return null;
   const effectivePos = pos ?? {
     top: typeof window !== "undefined" ? vAlign === "top" ? 14 : vAlign === "bottom" ? window.innerHeight - 14 : getViewportCenterY() : 200,
-    right: 8,
-    left: 8
+    right: EDGE_INSET,
+    left: EDGE_INSET
   };
   const translateY = vAlign === "center" ? "-50%" : "0";
   return createPortal(
@@ -8907,10 +8910,12 @@ function PreviewReopenPill({
         style: {
           position: "fixed",
           top: effectivePos.top,
-          ...side === "right" ? { right: effectivePos.right } : { left: effectivePos.left },
-          // Pull half the pill width out into the gutter so it visually
-          // anchors *to* the editor edge rather than sitting inside it.
-          transform: side === "right" ? `translate(50%, ${translateY})` : `translate(-50%, ${translateY})`
+          ...side === "right" ? { right: effectivePos.right + TUCK_OFFSET } : { left: effectivePos.left + TUCK_OFFSET },
+          // Use a fixed tuck amount instead of percentage-based horizontal
+          // translation. Percentage shifts depend on the pill's live width,
+          // which differs across remount/close paths and caused the rail +
+          // drawer variants to hide too much before a refresh.
+          transform: `translateY(${translateY})`
         },
         children
       }