@zag-js/tooltip 0.2.13 → 0.5.0

package/dist/{chunk-W3OSVXCZ.mjs → chunk-CTBIJ67E.mjs}

@@ -20,7 +20,6 @@ function connect(state, send, normalize) {
   const contentId = dom.getContentId(state.context);
   const isDisabled = state.context.disabled;
   const popperStyles = getPlacementStyles({
-    measured: !!state.context.isPlacementComplete,
     placement: state.context.currentPlacement
   });
   return {
@@ -49,6 +48,12 @@ function connect(state, send, normalize) {
         exit: store.id === null
       };
     },
+    /**
+     * Function to reposition the popover
+     */
+    setPositioning(options) {
+      send({ type: "SET_POSITIONING", options });
+    },
     triggerProps: normalize.button({
       ...parts.trigger.attrs,
       id: triggerId,

package/dist/{chunk-463EFHFN.mjs → chunk-YRDFBCFW.mjs}

@@ -34,7 +34,8 @@ function machine(userContext) {
         hasAriaLabel: (ctx2) => !!ctx2["aria-label"]
       },
       watch: {
-        disabled: ["closeIfDisabled"]
+        disabled: ["closeIfDisabled"],
+        open: ["toggleVisibility"]
       },
       on: {
         OPEN: "open",
@@ -79,7 +80,7 @@ function machine(userContext) {
             "trackDisabledTriggerOnSafari",
             "trackScroll",
             "trackPointerlockChange",
-            "computePlacement"
+            "trackPositioning"
           ],
           entry: ["setGlobalId", "invokeOnOpen"],
           on: {
@@ -102,12 +103,15 @@ function machine(userContext) {
               guard: "closeOnPointerDown",
               target: "closed"
             },
-            CLICK: "closed"
+            CLICK: "closed",
+            SET_POSITIONING: {
+              actions: "setPositioning"
+            }
           }
         },
         closing: {
           tags: ["open"],
-          activities: ["trackStore", "computePlacement"],
+          activities: ["trackStore", "trackPositioning"],
           after: {
             CLOSE_DELAY: "closed"
           },
@@ -124,7 +128,7 @@ function machine(userContext) {
     },
     {
       activities: {
-        computePlacement(ctx2) {
+        trackPositioning(ctx2) {
           ctx2.currentPlacement = ctx2.positioning.placement;
           let cleanup;
           raf(() => {
@@ -132,15 +136,13 @@ function machine(userContext) {
               ...ctx2.positioning,
               onComplete(data) {
                 ctx2.currentPlacement = data.placement;
-                ctx2.isPlacementComplete = true;
               },
               onCleanup() {
                 ctx2.currentPlacement = void 0;
-                ctx2.isPlacementComplete = false;
               }
             });
           });
-          return cleanup;
+          return () => cleanup?.();
         },
         trackPointerlockChange(ctx2, _evt, { send }) {
           const onChange = () => send("POINTER_LOCK_CHANGE");
@@ -209,6 +211,18 @@ function machine(userContext) {
           if (ctx2.disabled) {
             send("CLOSE");
           }
+        },
+        setPositioning(ctx2, evt) {
+          raf(() => {
+            getPlacement(dom.getTriggerEl(ctx2), dom.getPositionerEl(ctx2), {
+              ...ctx2.positioning,
+              ...evt.options,
+              listeners: false
+            });
+          });
+        },
+        toggleVisibility(ctx2, _evt, { send }) {
+          send({ type: ctx2.open ? "OPEN" : "CLOSE", src: "controlled" });
         }
       },
       guards: {

package/dist/index.d.ts

@@ -3,6 +3,6 @@ export { connect } from './tooltip.connect.js';
 export { machine } from './tooltip.machine.js';
 export { UserDefinedContext as Context } from './tooltip.types.js';
 import '@zag-js/anatomy';
+import '@zag-js/popper';
 import '@zag-js/types';
 import '@zag-js/core';
-import '@zag-js/popper';

package/dist/index.js

@@ -70,7 +70,6 @@ function connect(state, send, normalize) {
   const contentId = dom.getContentId(state.context);
   const isDisabled = state.context.disabled;
   const popperStyles = (0, import_popper.getPlacementStyles)({
-    measured: !!state.context.isPlacementComplete,
     placement: state.context.currentPlacement
   });
   return {
@@ -99,6 +98,12 @@ function connect(state, send, normalize) {
         exit: store.id === null
       };
     },
+    /**
+     * Function to reposition the popover
+     */
+    setPositioning(options) {
+      send({ type: "SET_POSITIONING", options });
+    },
     triggerProps: normalize.button({
       ...parts.trigger.attrs,
       id: triggerId,
@@ -207,7 +212,8 @@ function machine(userContext) {
         hasAriaLabel: (ctx2) => !!ctx2["aria-label"]
       },
       watch: {
-        disabled: ["closeIfDisabled"]
+        disabled: ["closeIfDisabled"],
+        open: ["toggleVisibility"]
       },
       on: {
         OPEN: "open",
@@ -252,7 +258,7 @@ function machine(userContext) {
             "trackDisabledTriggerOnSafari",
             "trackScroll",
             "trackPointerlockChange",
-            "computePlacement"
+            "trackPositioning"
           ],
           entry: ["setGlobalId", "invokeOnOpen"],
           on: {
@@ -275,12 +281,15 @@ function machine(userContext) {
               guard: "closeOnPointerDown",
               target: "closed"
             },
-            CLICK: "closed"
+            CLICK: "closed",
+            SET_POSITIONING: {
+              actions: "setPositioning"
+            }
           }
         },
         closing: {
           tags: ["open"],
-          activities: ["trackStore", "computePlacement"],
+          activities: ["trackStore", "trackPositioning"],
           after: {
             CLOSE_DELAY: "closed"
           },
@@ -297,7 +306,7 @@ function machine(userContext) {
     },
     {
       activities: {
-        computePlacement(ctx2) {
+        trackPositioning(ctx2) {
           ctx2.currentPlacement = ctx2.positioning.placement;
           let cleanup;
           (0, import_dom_query3.raf)(() => {
@@ -305,15 +314,13 @@ function machine(userContext) {
               ...ctx2.positioning,
               onComplete(data) {
                 ctx2.currentPlacement = data.placement;
-                ctx2.isPlacementComplete = true;
               },
               onCleanup() {
                 ctx2.currentPlacement = void 0;
-                ctx2.isPlacementComplete = false;
               }
             });
           });
-          return cleanup;
+          return () => cleanup?.();
         },
         trackPointerlockChange(ctx2, _evt, { send }) {
           const onChange = () => send("POINTER_LOCK_CHANGE");
@@ -382,6 +389,18 @@ function machine(userContext) {
           if (ctx2.disabled) {
             send("CLOSE");
           }
+        },
+        setPositioning(ctx2, evt) {
+          (0, import_dom_query3.raf)(() => {
+            (0, import_popper2.getPlacement)(dom.getTriggerEl(ctx2), dom.getPositionerEl(ctx2), {
+              ...ctx2.positioning,
+              ...evt.options,
+              listeners: false
+            });
+          });
+        },
+        toggleVisibility(ctx2, _evt, { send }) {
+          send({ type: ctx2.open ? "OPEN" : "CLOSE", src: "controlled" });
         }
       },
       guards: {

package/dist/index.mjs

@@ -1,12 +1,12 @@
 import {
   connect
-} from "./chunk-W3OSVXCZ.mjs";
+} from "./chunk-CTBIJ67E.mjs";
 import {
   anatomy
 } from "./chunk-RRQRIZBA.mjs";
 import {
   machine
-} from "./chunk-463EFHFN.mjs";
+} from "./chunk-YRDFBCFW.mjs";
 import "./chunk-3LXHM7BW.mjs";
 import "./chunk-GQYNO326.mjs";
 export {

package/dist/tooltip.connect.d.ts

@@ -1,7 +1,7 @@
+import { PositioningOptions } from '@zag-js/popper';
 import { PropTypes, NormalizeProps } from '@zag-js/types';
 import { State, Send } from './tooltip.types.js';
 import '@zag-js/core';
-import '@zag-js/popper';
 
 declare function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>): {
     /**
@@ -23,6 +23,10 @@ declare function connect<T extends PropTypes>(state: State, send: Send, normaliz
         enter: boolean;
         exit: boolean;
     };
+    /**
+     * Function to reposition the popover
+     */
+    setPositioning(options: Partial<PositioningOptions>): void;
     triggerProps: T["button"];
     arrowProps: T["element"];
     arrowTipProps: T["element"];

package/dist/tooltip.connect.js

@@ -66,7 +66,6 @@ function connect(state, send, normalize) {
   const contentId = dom.getContentId(state.context);
   const isDisabled = state.context.disabled;
   const popperStyles = (0, import_popper.getPlacementStyles)({
-    measured: !!state.context.isPlacementComplete,
     placement: state.context.currentPlacement
   });
   return {
@@ -95,6 +94,12 @@ function connect(state, send, normalize) {
         exit: store.id === null
       };
     },
+    /**
+     * Function to reposition the popover
+     */
+    setPositioning(options) {
+      send({ type: "SET_POSITIONING", options });
+    },
     triggerProps: normalize.button({
       ...parts.trigger.attrs,
       id: triggerId,

package/dist/tooltip.connect.mjs

@@ -1,6 +1,6 @@
 import {
   connect
-} from "./chunk-W3OSVXCZ.mjs";
+} from "./chunk-CTBIJ67E.mjs";
 import "./chunk-RRQRIZBA.mjs";
 import "./chunk-3LXHM7BW.mjs";
 import "./chunk-GQYNO326.mjs";

package/dist/tooltip.machine.js

@@ -78,7 +78,8 @@ function machine(userContext) {
         hasAriaLabel: (ctx2) => !!ctx2["aria-label"]
       },
       watch: {
-        disabled: ["closeIfDisabled"]
+        disabled: ["closeIfDisabled"],
+        open: ["toggleVisibility"]
       },
       on: {
         OPEN: "open",
@@ -123,7 +124,7 @@ function machine(userContext) {
             "trackDisabledTriggerOnSafari",
             "trackScroll",
             "trackPointerlockChange",
-            "computePlacement"
+            "trackPositioning"
           ],
           entry: ["setGlobalId", "invokeOnOpen"],
           on: {
@@ -146,12 +147,15 @@ function machine(userContext) {
               guard: "closeOnPointerDown",
               target: "closed"
             },
-            CLICK: "closed"
+            CLICK: "closed",
+            SET_POSITIONING: {
+              actions: "setPositioning"
+            }
           }
         },
         closing: {
           tags: ["open"],
-          activities: ["trackStore", "computePlacement"],
+          activities: ["trackStore", "trackPositioning"],
           after: {
             CLOSE_DELAY: "closed"
           },
@@ -168,7 +172,7 @@ function machine(userContext) {
     },
     {
       activities: {
-        computePlacement(ctx2) {
+        trackPositioning(ctx2) {
           ctx2.currentPlacement = ctx2.positioning.placement;
           let cleanup;
           (0, import_dom_query2.raf)(() => {
@@ -176,15 +180,13 @@ function machine(userContext) {
               ...ctx2.positioning,
               onComplete(data) {
                 ctx2.currentPlacement = data.placement;
-                ctx2.isPlacementComplete = true;
               },
               onCleanup() {
                 ctx2.currentPlacement = void 0;
-                ctx2.isPlacementComplete = false;
               }
             });
           });
-          return cleanup;
+          return () => cleanup?.();
         },
         trackPointerlockChange(ctx2, _evt, { send }) {
           const onChange = () => send("POINTER_LOCK_CHANGE");
@@ -253,6 +255,18 @@ function machine(userContext) {
           if (ctx2.disabled) {
             send("CLOSE");
           }
+        },
+        setPositioning(ctx2, evt) {
+          (0, import_dom_query2.raf)(() => {
+            (0, import_popper.getPlacement)(dom.getTriggerEl(ctx2), dom.getPositionerEl(ctx2), {
+              ...ctx2.positioning,
+              ...evt.options,
+              listeners: false
+            });
+          });
+        },
+        toggleVisibility(ctx2, _evt, { send }) {
+          send({ type: ctx2.open ? "OPEN" : "CLOSE", src: "controlled" });
         }
       },
       guards: {

package/dist/tooltip.machine.mjs

@@ -1,6 +1,6 @@
 import {
   machine
-} from "./chunk-463EFHFN.mjs";
+} from "./chunk-YRDFBCFW.mjs";
 import "./chunk-3LXHM7BW.mjs";
 import "./chunk-GQYNO326.mjs";
 export {

package/dist/tooltip.types.d.ts

@@ -57,6 +57,10 @@ type PublicContext = CommonProperties & {
      * Whether the tooltip is disabled
      */
     disabled?: boolean;
+    /**
+     * Whether the tooltip is open
+     */
+    open?: boolean;
 };
 type UserDefinedContext = RequiredBy<PublicContext, "id">;
 type ComputedContext = Readonly<{

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zag-js/tooltip",
-  "version": "0.2.13",
+  "version": "0.5.0",
   "description": "Core logic for the tooltip widget implemented as a state machine",
   "keywords": [
     "js",
@@ -27,13 +27,13 @@
   },
   "dependencies": {
     "@zag-js/anatomy": "0.1.4",
-    "@zag-js/core": "0.2.10",
-    "@zag-js/popper": "0.2.5",
+    "@zag-js/core": "0.5.0",
+    "@zag-js/popper": "0.2.7",
     "@zag-js/dom-query": "0.1.4",
-    "@zag-js/dom-event": "0.0.1",
-    "@zag-js/utils": "0.3.3",
+    "@zag-js/dom-event": "0.5.0",
+    "@zag-js/utils": "0.3.4",
     "@zag-js/visually-hidden": "0.0.1",
-    "@zag-js/types": "0.3.4"
+    "@zag-js/types": "0.5.0"
   },
   "devDependencies": {
     "clean-package": "2.2.0"