@tensor_1/react 2.41.0 → 2.42.0

package/dist/rich-text.cjs

@@ -1373,11 +1373,16 @@ function translationOf(el) {
   if (!t || t === "none" || typeof DOMMatrixReadOnly === "undefined") return { x: 0, y: 0 };
   try {
     const m = new DOMMatrixReadOnly(t);
-    return { x: m.m41, y: m.m42 };
+    const z = zoomOf(el);
+    return { x: m.m41 * z, y: m.m42 * z };
   } catch {
     return { x: 0, y: 0 };
   }
 }
+function zoomOf(el) {
+  const z = el.currentCSSZoom;
+  return typeof z === "number" && Number.isFinite(z) && z > 0 ? z : 1;
+}
 var signed = (n) => `${n < 0 ? "-" : "+"} ${Math.round(Math.abs(n) * 100) / 100}px`;
 var prepared = /* @__PURE__ */ new WeakSet();
 function useAnchoredPosition(anchor, floatingRef, { open, placement = "bottom-start", offset = 6, padding = 8, shiftMainAxis = true, capHeight = false, onAnchorHidden }) {
@@ -1402,8 +1407,9 @@ function useAnchoredPosition(anchor, floatingRef, { open, placement = "bottom-st
       const s = floating.style;
       if (keepPlace && current.anchor.isConnected) {
         const a = current.anchor.getBoundingClientRect();
-        s.top = `${Math.round((current.yEdge === "bottom" ? a.bottom : a.top) + current.dy)}px`;
-        s.left = `${Math.round((current.xEdge === "right" ? a.right : a.left) + current.dx)}px`;
+        const z = zoomOf(floating);
+        s.top = `${Math.round(((current.yEdge === "bottom" ? a.bottom : a.top) + current.dy) / z)}px`;
+        s.left = `${Math.round(((current.xEdge === "right" ? a.right : a.left) + current.dx) / z)}px`;
       }
       s.removeProperty("position-anchor");
     }
@@ -1431,6 +1437,7 @@ function useAnchoredPosition(anchor, floatingRef, { open, placement = "bottom-st
       written.current = "";
     }
     const { placement: p, offset: o, padding: pad, shiftMainAxis: keepInView, capHeight: cap } = opts.current;
+    const zoom = floating.getClientRects().length > 0 ? zoomOf(floating) : zoomOf(anchorEl);
     if (cap) {
       if (!heightCap.current) {
         const own = getComputedStyle(floating);
@@ -1444,7 +1451,7 @@ function useAnchoredPosition(anchor, floatingRef, { open, placement = "bottom-st
         };
         if (setOverflow) s.overflowY = "auto";
       }
-      const room = `${Math.max(0, window.innerHeight - 2 * pad)}px`;
+      const room = `${Math.max(0, (window.innerHeight - 2 * pad * zoom) / zoom)}px`;
       const max = heightCap.current.ownMaxHeight ? `min(${room}, ${heightCap.current.ownMaxHeight})` : room;
       if (max !== heightCap.current.written) {
         s.maxHeight = max;
@@ -1454,19 +1461,19 @@ function useAnchoredPosition(anchor, floatingRef, { open, placement = "bottom-st
       uncap();
     }
     const a = anchorEl.getBoundingClientRect();
-    const size = { width: floating.offsetWidth, height: floating.offsetHeight };
+    const size = { width: floating.offsetWidth * zoom, height: floating.offsetHeight * zoom };
     const pos = computePosition(
       { x: a.x, y: a.y, width: a.width, height: a.height },
       size,
       { width: window.innerWidth, height: window.innerHeight },
-      { placement: p, offset: o, padding: pad, shiftMainAxis: keepInView, stickySide: side.current ?? void 0 }
+      { placement: p, offset: o * zoom, padding: pad * zoom, shiftMainAxis: keepInView, stickySide: side.current ?? void 0 }
     );
     const measured = size.width > 0 || size.height > 0;
     if (measured && session.current) side.current = pos.side;
     if (floating.dataset.placement !== pos.placement) floating.dataset.placement = pos.placement;
     const writeFixed = (at) => {
-      const left2 = `${Math.round(at.x)}px`;
-      const top2 = `${Math.round(at.y)}px`;
+      const left2 = `${Math.round(at.x / zoom)}px`;
+      const top2 = `${Math.round(at.y / zoom)}px`;
       const key2 = `fixed ${left2} ${top2}`;
       if (key2 === written.current) return;
       s.left = left2;
@@ -1493,8 +1500,8 @@ function useAnchoredPosition(anchor, floatingRef, { open, placement = "bottom-st
     current.xEdge = pos.side === "right" ? "right" : "left";
     current.dy = pos.y - (current.yEdge === "bottom" ? a.bottom : a.top);
     current.dx = pos.x - (current.xEdge === "right" ? a.right : a.left);
-    const top = `round(anchor(${current.yEdge}) ${signed(current.dy)}, 1px)`;
-    const left = `round(anchor(${current.xEdge}) ${signed(current.dx)}, 1px)`;
+    const top = `round(anchor(${current.yEdge}) ${signed(current.dy / zoom)}, 1px)`;
+    const left = `round(anchor(${current.xEdge}) ${signed(current.dx / zoom)}, 1px)`;
     const key = `anchored ${top} ${left}`;
     if (key !== written.current) {
       s.top = top;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tensor_1/react",
-  "version": "2.41.0",
+  "version": "2.42.0",
   "description": "Thin React wrappers over the UIx v2 CSS component library.",
   "license": "UNLICENSED",
   "type": "module",