@zag-js/tabs 1.8.0 → 1.8.2

package/dist/index.js

@@ -489,15 +489,16 @@ var machine = core.createMachine({
         const triggerEl = getTriggerEl(scope, value);
         const indicatorEl = getIndicatorEl(scope);
         if (!triggerEl || !indicatorEl) return;
-        const exec = () => {
-          const rect = getOffsetRect(triggerEl);
-          context.set("indicatorRect", resolveRect(rect));
-        };
-        exec();
-        const win = scope.getWin();
-        const obs = new win.ResizeObserver(exec);
-        obs.observe(triggerEl);
-        refs.set("indicatorCleanup", () => obs.disconnect());
+        const indicatorCleanup = domQuery.trackElementRect([triggerEl], {
+          measure(el) {
+            return getOffsetRect(el);
+          },
+          onEntry({ rects }) {
+            const [rect] = rects;
+            context.set("indicatorRect", resolveRect(rect));
+          }
+        });
+        refs.set("indicatorCleanup", indicatorCleanup);
       },
       navigateIfNeeded({ context, prop, scope }) {
         const value = context.get("value");

package/dist/index.mjs

@@ -1,5 +1,5 @@
 import { createAnatomy } from '@zag-js/anatomy';
-import { isAnchorElement, nextTick, raf, getFocusables, prevById, nextById, clickIfLink, itemById, queryAll, dataAttr, isSafari, isSelfTarget, isComposingEvent, getEventKey } from '@zag-js/dom-query';
+import { isAnchorElement, trackElementRect, nextTick, raf, getFocusables, prevById, nextById, clickIfLink, itemById, queryAll, dataAttr, isSafari, isSelfTarget, isComposingEvent, getEventKey } from '@zag-js/dom-query';
 import { last, first, createSplitProps } from '@zag-js/utils';
 import { createGuards, createMachine } from '@zag-js/core';
 import { createProps } from '@zag-js/types';
@@ -487,15 +487,16 @@ var machine = createMachine({
         const triggerEl = getTriggerEl(scope, value);
         const indicatorEl = getIndicatorEl(scope);
         if (!triggerEl || !indicatorEl) return;
-        const exec = () => {
-          const rect = getOffsetRect(triggerEl);
-          context.set("indicatorRect", resolveRect(rect));
-        };
-        exec();
-        const win = scope.getWin();
-        const obs = new win.ResizeObserver(exec);
-        obs.observe(triggerEl);
-        refs.set("indicatorCleanup", () => obs.disconnect());
+        const indicatorCleanup = trackElementRect([triggerEl], {
+          measure(el) {
+            return getOffsetRect(el);
+          },
+          onEntry({ rects }) {
+            const [rect] = rects;
+            context.set("indicatorRect", resolveRect(rect));
+          }
+        });
+        refs.set("indicatorCleanup", indicatorCleanup);
       },
       navigateIfNeeded({ context, prop, scope }) {
         const value = context.get("value");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zag-js/tabs",
-  "version": "1.8.0",
+  "version": "1.8.2",
   "description": "Core logic for the tabs widget implemented as a state machine",
   "keywords": [
     "js",
@@ -26,12 +26,11 @@
     "url": "https://github.com/chakra-ui/zag/issues"
   },
   "dependencies": {
-    "@zag-js/anatomy": "1.8.0",
-    "@zag-js/dom-query": "1.8.0",
-    "@zag-js/element-rect": "1.8.0",
-    "@zag-js/utils": "1.8.0",
-    "@zag-js/core": "1.8.0",
-    "@zag-js/types": "1.8.0"
+    "@zag-js/anatomy": "1.8.2",
+    "@zag-js/dom-query": "1.8.2",
+    "@zag-js/utils": "1.8.2",
+    "@zag-js/core": "1.8.2",
+    "@zag-js/types": "1.8.2"
   },
   "devDependencies": {
     "clean-package": "2.2.0"