@zag-js/tooltip 0.1.9 → 0.1.12

package/dist/index.mjs

@@ -1,23 +1,3 @@
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-
 // ../../utilities/dom/dist/index.mjs
 var dataAttr = (guard) => {
   return guard ? "" : void 0;
@@ -28,13 +8,12 @@ function getCache() {
   return g.__styleCache;
 }
 function getComputedStyle(el) {
-  var _a;
   if (!el)
     return {};
   const cache = getCache();
   let style = cache.get(el);
   if (!style) {
-    const win = (_a = el == null ? void 0 : el.ownerDocument.defaultView) != null ? _a : window;
+    const win = (el == null ? void 0 : el.ownerDocument.defaultView) ?? window;
     style = win.getComputedStyle(el);
     cache.set(el, style);
   }
@@ -42,37 +21,38 @@ function getComputedStyle(el) {
 }
 var runIfFn = (v, ...a) => {
   const res = typeof v === "function" ? v(...a) : v;
-  return res != null ? res : void 0;
+  return res ?? void 0;
 };
 var isArray = (v) => Array.isArray(v);
 var isObject = (v) => !(v == null || typeof v !== "object" || isArray(v));
 var hasProp = (obj, prop) => Object.prototype.hasOwnProperty.call(obj, prop);
 var isDom = () => typeof window !== "undefined";
 function getPlatform() {
-  var _a;
   const agent = navigator.userAgentData;
-  return (_a = agent == null ? void 0 : agent.platform) != null ? _a : navigator.platform;
+  return (agent == null ? void 0 : agent.platform) ?? navigator.platform;
 }
 var pt = (v) => isDom() && v.test(getPlatform());
 var vn = (v) => isDom() && v.test(navigator.vendor);
 var isSafari = () => isApple() && vn(/apple/i);
 var isApple = () => pt(/mac|iphone|ipad|ipod/i);
+function isDocument(el) {
+  return el.nodeType === Node.DOCUMENT_NODE;
+}
 function isWindow(value) {
   return (value == null ? void 0 : value.toString()) === "[object Window]";
 }
 function getDocument(el) {
-  var _a;
   if (isWindow(el))
     return el.document;
-  return (_a = el == null ? void 0 : el.ownerDocument) != null ? _a : document;
+  if (isDocument(el))
+    return el;
+  return (el == null ? void 0 : el.ownerDocument) ?? document;
 }
 function getWindow(el) {
-  var _a;
-  return (_a = el == null ? void 0 : el.ownerDocument.defaultView) != null ? _a : window;
+  return (el == null ? void 0 : el.ownerDocument.defaultView) ?? window;
 }
 function getNodeName(node) {
-  var _a;
-  return isWindow(node) ? "" : (_a = node == null ? void 0 : node.localName) != null ? _a : "";
+  return isWindow(node) ? "" : (node == null ? void 0 : node.localName) ?? "";
 }
 function getParent(el) {
   const doc = getDocument(el);
@@ -80,6 +60,22 @@ function getParent(el) {
     return el;
   return el.assignedSlot || el.parentElement || doc.documentElement;
 }
+function defineDomHelpers(helpers) {
+  const dom2 = {
+    getRootNode: (ctx) => {
+      var _a;
+      return ((_a = ctx.getRootNode) == null ? void 0 : _a.call(ctx)) ?? document;
+    },
+    getDoc: (ctx) => getDocument(dom2.getRootNode(ctx)),
+    getWin: (ctx) => dom2.getDoc(ctx).defaultView ?? window,
+    getActiveElement: (ctx) => dom2.getDoc(ctx).activeElement,
+    getById: (ctx, id) => dom2.getRootNode(ctx).getElementById(id)
+  };
+  return {
+    ...dom2,
+    ...helpers
+  };
+}
 function isHTMLElement(v) {
   return typeof v === "object" && (v == null ? void 0 : v.nodeType) === Node.ELEMENT_NODE && typeof (v == null ? void 0 : v.nodeName) === "string";
 }
@@ -106,8 +102,7 @@ function addDomEvent(target, eventName, handler, options) {
   };
 }
 function addPointerEvent(target, event, listener, options) {
-  var _a;
-  const type = (_a = getEventName(event)) != null ? _a : event;
+  const type = getEventName(event) ?? event;
   return addDomEvent(target, type, wrapHandler(listener, event === "pointerdown"), options);
 }
 function wrapHandler(fn, filter = false) {
@@ -118,8 +113,7 @@ function wrapHandler(fn, filter = false) {
 }
 function filterPrimaryPointer(fn) {
   return (event) => {
-    var _a;
-    const win = (_a = event.view) != null ? _a : window;
+    const win = event.view ?? window;
     const isMouseEvent2 = event instanceof win.MouseEvent;
     const isPrimary = !isMouseEvent2 || isMouseEvent2 && event.button === 0;
     if (isPrimary)
@@ -151,18 +145,6 @@ function getEventName(evt) {
     return mouseEventNames[evt];
   return evt;
 }
-var visuallyHiddenStyle = {
-  border: "0",
-  clip: "rect(0 0 0 0)",
-  height: "1px",
-  margin: "-1px",
-  overflow: "hidden",
-  padding: "0",
-  position: "absolute",
-  width: "1px",
-  whiteSpace: "nowrap",
-  wordWrap: "normal"
-};
 function raf(fn) {
   const id = globalThis.requestAnimationFrame(fn);
   return function cleanup() {
@@ -195,39 +177,39 @@ function getScrollParents(el, list = []) {
     return parents;
   return parents.concat(getScrollParents(getParent(target)));
 }
+var visuallyHiddenStyle = {
+  border: "0",
+  clip: "rect(0 0 0 0)",
+  height: "1px",
+  margin: "-1px",
+  overflow: "hidden",
+  padding: "0",
+  position: "absolute",
+  width: "1px",
+  whiteSpace: "nowrap",
+  wordWrap: "normal"
+};
 
 // src/tooltip.connect.ts
 import { getPlacementStyles } from "@zag-js/popper";
 
 // src/tooltip.dom.ts
-var dom = {
-  getDoc: (ctx) => {
-    var _a;
-    return (_a = ctx.doc) != null ? _a : document;
-  },
-  getWin: (ctx) => {
-    var _a, _b;
-    return (_b = (_a = ctx.doc) == null ? void 0 : _a.defaultView) != null ? _b : window;
-  },
-  getRootNode: (ctx) => {
-    var _a;
-    return (_a = ctx.rootNode) != null ? _a : dom.getDoc(ctx);
-  },
+var dom = defineDomHelpers({
   getTriggerId: (ctx) => {
-    var _a, _b;
-    return (_b = (_a = ctx.ids) == null ? void 0 : _a.trigger) != null ? _b : `tooltip:${ctx.id}:trigger`;
+    var _a;
+    return ((_a = ctx.ids) == null ? void 0 : _a.trigger) ?? `tooltip:${ctx.id}:trigger`;
   },
   getContentId: (ctx) => {
-    var _a, _b;
-    return (_b = (_a = ctx.ids) == null ? void 0 : _a.content) != null ? _b : `tooltip:${ctx.id}:content`;
+    var _a;
+    return ((_a = ctx.ids) == null ? void 0 : _a.content) ?? `tooltip:${ctx.id}:content`;
   },
   getArrowId: (ctx) => `tooltip:${ctx.id}:arrow`,
   getPositionerId: (ctx) => `tooltip:${ctx.id}:popper`,
   portalId: "tooltip-portal",
-  getTriggerEl: (ctx) => dom.getRootNode(ctx).getElementById(dom.getTriggerId(ctx)),
-  getContentEl: (ctx) => dom.getRootNode(ctx).getElementById(dom.getContentId(ctx)),
-  getPositionerEl: (ctx) => dom.getRootNode(ctx).getElementById(dom.getPositionerId(ctx)),
-  getArrowEl: (ctx) => dom.getRootNode(ctx).getElementById(dom.getArrowId(ctx)),
+  getTriggerEl: (ctx) => dom.getById(ctx, dom.getTriggerId(ctx)),
+  getContentEl: (ctx) => dom.getById(ctx, dom.getContentId(ctx)),
+  getPositionerEl: (ctx) => dom.getById(ctx, dom.getPositionerId(ctx)),
+  getArrowEl: (ctx) => dom.getById(ctx, dom.getArrowId(ctx)),
   getScrollParent: (ctx) => getScrollParent(dom.getTriggerEl(ctx)),
   getPortalEl: (ctx) => dom.getDoc(ctx).getElementById(dom.portalId),
   createPortalEl: (ctx) => {
@@ -235,7 +217,7 @@ var dom = {
     portal.id = dom.portalId;
     return portal;
   }
-};
+});
 
 // src/tooltip.store.ts
 import { proxy } from "@zag-js/core";
@@ -353,234 +335,222 @@ function connect(state, send, normalize) {
 }
 
 // src/tooltip.machine.ts
-import { createMachine, ref, subscribe } from "@zag-js/core";
+import { createMachine, subscribe } from "@zag-js/core";
 import { getPlacement } from "@zag-js/popper";
-
-// ../../utilities/core/dist/index.mjs
-var noop = () => {
-};
-
-// src/tooltip.machine.ts
-function machine(ctx = {}) {
-  return createMachine({
-    id: "tooltip",
-    initial: "unknown",
-    context: __spreadProps(__spreadValues({
-      id: "",
-      openDelay: 1e3,
-      closeDelay: 500,
-      closeOnPointerDown: true,
-      closeOnEsc: true,
-      interactive: true,
-      currentPlacement: void 0
-    }, ctx), {
-      positioning: __spreadValues({
-        placement: "bottom"
-      }, ctx.positioning)
-    }),
-    computed: {
-      hasAriaLabel: (ctx2) => !!ctx2["aria-label"]
-    },
-    on: {
-      OPEN: "open",
-      CLOSE: "closed"
-    },
-    states: {
-      unknown: {
-        on: {
-          SETUP: {
-            target: "closed",
-            actions: "setupDocument"
-          }
+function machine(ctx) {
+  return createMachine(
+    {
+      id: "tooltip",
+      initial: "unknown",
+      context: {
+        openDelay: 1e3,
+        closeDelay: 500,
+        closeOnPointerDown: true,
+        closeOnEsc: true,
+        interactive: true,
+        currentPlacement: void 0,
+        ...ctx,
+        positioning: {
+          placement: "bottom",
+          ...ctx.positioning
         }
       },
-      closed: {
-        tags: ["closed"],
-        entry: ["clearGlobalId", "invokeOnClose"],
-        on: {
-          FOCUS: "open",
-          POINTER_ENTER: [
-            {
-              guard: "noVisibleTooltip",
-              target: "opening"
-            },
-            { target: "open" }
-          ]
-        }
+      computed: {
+        hasAriaLabel: (ctx2) => !!ctx2["aria-label"]
       },
-      opening: {
-        tags: ["closed"],
-        activities: ["trackScroll", "trackPointerlockChange"],
-        after: {
-          OPEN_DELAY: "open"
+      on: {
+        OPEN: "open",
+        CLOSE: "closed"
+      },
+      states: {
+        unknown: {
+          on: {
+            SETUP: "closed"
+          }
         },
-        on: {
-          POINTER_LEAVE: "closed",
-          BLUR: "closed",
-          SCROLL: "closed",
-          POINTER_LOCK_CHANGE: "closed",
-          POINTER_DOWN: {
-            guard: "closeOnPointerDown",
-            target: "closed"
+        closed: {
+          tags: ["closed"],
+          entry: ["clearGlobalId", "invokeOnClose"],
+          on: {
+            FOCUS: "open",
+            POINTER_ENTER: [
+              {
+                guard: "noVisibleTooltip",
+                target: "opening"
+              },
+              { target: "open" }
+            ]
           }
-        }
-      },
-      open: {
-        tags: ["open"],
-        activities: [
-          "trackEscapeKey",
-          "trackDisabledTriggerOnSafari",
-          "trackScroll",
-          "trackPointerlockChange",
-          "computePlacement"
-        ],
-        entry: ["setGlobalId", "invokeOnOpen"],
-        on: {
-          POINTER_LEAVE: [
-            {
-              guard: "isVisible",
+        },
+        opening: {
+          tags: ["closed"],
+          activities: ["trackScroll", "trackPointerlockChange"],
+          after: {
+            OPEN_DELAY: "open"
+          },
+          on: {
+            POINTER_LEAVE: "closed",
+            BLUR: "closed",
+            SCROLL: "closed",
+            POINTER_LOCK_CHANGE: "closed",
+            POINTER_DOWN: {
+              guard: "closeOnPointerDown",
+              target: "closed"
+            }
+          }
+        },
+        open: {
+          tags: ["open"],
+          activities: [
+            "trackEscapeKey",
+            "trackDisabledTriggerOnSafari",
+            "trackScroll",
+            "trackPointerlockChange",
+            "computePlacement"
+          ],
+          entry: ["setGlobalId", "invokeOnOpen"],
+          on: {
+            POINTER_LEAVE: [
+              {
+                guard: "isVisible",
+                target: "closing"
+              },
+              { target: "closed" }
+            ],
+            BLUR: "closed",
+            ESCAPE: "closed",
+            SCROLL: "closed",
+            POINTER_LOCK_CHANGE: "closed",
+            TOOLTIP_POINTER_LEAVE: {
+              guard: "isInteractive",
               target: "closing"
             },
-            { target: "closed" }
-          ],
-          BLUR: "closed",
-          ESCAPE: "closed",
-          SCROLL: "closed",
-          POINTER_LOCK_CHANGE: "closed",
-          TOOLTIP_POINTER_LEAVE: {
-            guard: "isInteractive",
-            target: "closing"
-          },
-          POINTER_DOWN: {
-            guard: "closeOnPointerDown",
-            target: "closed"
-          },
-          CLICK: "closed"
-        }
-      },
-      closing: {
-        tags: ["open"],
-        activities: ["trackStore", "computePlacement"],
-        after: {
-          CLOSE_DELAY: "closed"
+            POINTER_DOWN: {
+              guard: "closeOnPointerDown",
+              target: "closed"
+            },
+            CLICK: "closed"
+          }
         },
-        on: {
-          FORCE_CLOSE: "closed",
-          POINTER_ENTER: "open",
-          TOOLTIP_POINTER_ENTER: {
-            guard: "isInteractive",
-            target: "open"
+        closing: {
+          tags: ["open"],
+          activities: ["trackStore", "computePlacement"],
+          after: {
+            CLOSE_DELAY: "closed"
+          },
+          on: {
+            FORCE_CLOSE: "closed",
+            POINTER_ENTER: "open",
+            TOOLTIP_POINTER_ENTER: {
+              guard: "isInteractive",
+              target: "open"
+            }
           }
         }
       }
-    }
-  }, {
-    activities: {
-      computePlacement(ctx2) {
-        ctx2.currentPlacement = ctx2.positioning.placement;
-        let cleanup;
-        raf(() => {
-          cleanup = getPlacement(dom.getTriggerEl(ctx2), dom.getPositionerEl(ctx2), __spreadProps(__spreadValues({}, ctx2.positioning), {
-            onComplete(data) {
-              ctx2.currentPlacement = data.placement;
-              ctx2.isPlacementComplete = true;
-            },
-            onCleanup() {
-              ctx2.currentPlacement = void 0;
-              ctx2.isPlacementComplete = false;
+    },
+    {
+      activities: {
+        computePlacement(ctx2) {
+          ctx2.currentPlacement = ctx2.positioning.placement;
+          let cleanup;
+          raf(() => {
+            cleanup = getPlacement(dom.getTriggerEl(ctx2), dom.getPositionerEl(ctx2), {
+              ...ctx2.positioning,
+              onComplete(data) {
+                ctx2.currentPlacement = data.placement;
+                ctx2.isPlacementComplete = true;
+              },
+              onCleanup() {
+                ctx2.currentPlacement = void 0;
+                ctx2.isPlacementComplete = false;
+              }
+            });
+          });
+          return cleanup;
+        },
+        trackPointerlockChange(ctx2, _evt, { send }) {
+          return addPointerlockChangeListener(dom.getDoc(ctx2), () => {
+            send("POINTER_LOCK_CHANGE");
+          });
+        },
+        trackScroll(ctx2, _evt, { send }) {
+          const trigger = dom.getTriggerEl(ctx2);
+          if (!trigger)
+            return;
+          const cleanups = getScrollParents(trigger).map((el) => {
+            const opts = { passive: true, capture: true };
+            return addDomEvent(el, "scroll", () => send("SCROLL"), opts);
+          });
+          return () => {
+            cleanups.forEach((fn) => fn == null ? void 0 : fn());
+          };
+        },
+        trackStore(ctx2, _evt, { send }) {
+          return subscribe(store, () => {
+            if (store.id !== ctx2.id) {
+              send("FORCE_CLOSE");
             }
-          }));
-        });
-        return cleanup;
-      },
-      trackPointerlockChange(ctx2, _evt, { send }) {
-        return addPointerlockChangeListener(dom.getDoc(ctx2), () => {
-          send("POINTER_LOCK_CHANGE");
-        });
-      },
-      trackScroll(ctx2, _evt, { send }) {
-        const trigger = dom.getTriggerEl(ctx2);
-        if (!trigger)
-          return;
-        const cleanups = getScrollParents(trigger).map((el) => {
-          const opts = { passive: true, capture: true };
-          return addDomEvent(el, "scroll", () => send("SCROLL"), opts);
-        });
-        return () => {
-          cleanups.forEach((fn) => fn == null ? void 0 : fn());
-        };
-      },
-      trackStore(ctx2, _evt, { send }) {
-        return subscribe(store, () => {
-          if (store.id !== ctx2.id) {
-            send("FORCE_CLOSE");
-          }
-        });
-      },
-      trackDisabledTriggerOnSafari(ctx2, _evt, { send }) {
-        if (!isSafari())
-          return noop;
-        const doc = dom.getDoc(ctx2);
-        return addPointerEvent(doc, "pointermove", (event) => {
-          const selector = "[data-part=trigger][data-expanded]";
-          if (isHTMLElement(event.target) && event.target.closest(selector))
+          });
+        },
+        trackDisabledTriggerOnSafari(ctx2, _evt, { send }) {
+          if (!isSafari())
+            return;
+          const doc = dom.getDoc(ctx2);
+          return addPointerEvent(doc, "pointermove", (event) => {
+            const selector = "[data-part=trigger][data-expanded]";
+            if (isHTMLElement(event.target) && event.target.closest(selector))
+              return;
+            send("POINTER_LEAVE");
+          });
+        },
+        trackEscapeKey(ctx2, _evt, { send }) {
+          if (!ctx2.closeOnEsc)
             return;
-          send("POINTER_LEAVE");
-        });
+          const doc = dom.getDoc(ctx2);
+          return addDomEvent(doc, "keydown", (event) => {
+            if (event.key === "Escape") {
+              send("ESCAPE");
+            }
+          });
+        }
       },
-      trackEscapeKey(ctx2, _evt, { send }) {
-        if (!ctx2.closeOnEsc)
-          return;
-        const doc = dom.getDoc(ctx2);
-        return addDomEvent(doc, "keydown", (event) => {
-          if (event.key === "Escape") {
-            send("ESCAPE");
+      actions: {
+        setGlobalId(ctx2) {
+          store.setId(ctx2.id);
+        },
+        clearGlobalId(ctx2) {
+          if (ctx2.id === store.id) {
+            store.setId(null);
+          }
+        },
+        invokeOnOpen(ctx2, evt) {
+          var _a;
+          const omit = ["TOOLTIP_POINTER_ENTER", "POINTER_ENTER"];
+          if (!omit.includes(evt.type)) {
+            (_a = ctx2.onOpen) == null ? void 0 : _a.call(ctx2);
+          }
+        },
+        invokeOnClose(ctx2, evt) {
+          var _a;
+          const omit = ["SETUP"];
+          if (!omit.includes(evt.type)) {
+            (_a = ctx2.onClose) == null ? void 0 : _a.call(ctx2);
           }
-        });
-      }
-    },
-    actions: {
-      setupDocument(ctx2, evt) {
-        ctx2.id = evt.id;
-        if (evt.doc)
-          ctx2.doc = ref(evt.doc);
-        if (evt.root)
-          ctx2.rootNode = ref(evt.root);
-      },
-      setGlobalId(ctx2) {
-        store.setId(ctx2.id);
-      },
-      clearGlobalId(ctx2) {
-        if (ctx2.id === store.id) {
-          store.setId(null);
         }
       },
-      invokeOnOpen(ctx2, evt) {
-        var _a;
-        const omit = ["TOOLTIP_POINTER_ENTER", "POINTER_ENTER"];
-        if (!omit.includes(evt.type)) {
-          (_a = ctx2.onOpen) == null ? void 0 : _a.call(ctx2);
-        }
+      guards: {
+        closeOnPointerDown: (ctx2) => ctx2.closeOnPointerDown,
+        noVisibleTooltip: () => store.id === null,
+        isVisible: (ctx2) => ctx2.id === store.id,
+        isInteractive: (ctx2) => ctx2.interactive
       },
-      invokeOnClose(ctx2, evt) {
-        var _a;
-        const omit = ["SETUP"];
-        if (!omit.includes(evt.type)) {
-          (_a = ctx2.onClose) == null ? void 0 : _a.call(ctx2);
-        }
+      delays: {
+        OPEN_DELAY: (ctx2) => ctx2.openDelay,
+        CLOSE_DELAY: (ctx2) => ctx2.closeDelay
       }
-    },
-    guards: {
-      closeOnPointerDown: (ctx2) => ctx2.closeOnPointerDown,
-      noVisibleTooltip: () => store.id === null,
-      isVisible: (ctx2) => ctx2.id === store.id,
-      isInteractive: (ctx2) => ctx2.interactive
-    },
-    delays: {
-      OPEN_DELAY: (ctx2) => ctx2.openDelay,
-      CLOSE_DELAY: (ctx2) => ctx2.closeDelay
     }
-  });
+  );
 }
 export {
   connect,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zag-js/tooltip",
-  "version": "0.1.9",
+  "version": "0.1.12",
   "description": "Core logic for the tooltip widget implemented as a state machine",
   "keywords": [
     "js",
@@ -29,18 +29,22 @@
     "url": "https://github.com/chakra-ui/zag/issues"
   },
   "dependencies": {
-    "@zag-js/core": "0.1.7",
-    "@zag-js/dom-utils": "0.1.6",
-    "@zag-js/popper": "0.1.7",
-    "@zag-js/types": "0.2.1"
+    "@zag-js/core": "0.1.9",
+    "@zag-js/popper": "0.1.10",
+    "@zag-js/types": "0.2.3"
+  },
+  "devDependencies": {
+    "@zag-js/dom-utils": "0.1.9",
+    "@zag-js/utils": "0.1.3"
   },
   "scripts": {
-    "build:fast": "zag build",
-    "start": "zag build --watch",
-    "build": "zag build --prod",
+    "build-fast": "tsup src/index.ts --format=esm,cjs",
+    "start": "pnpm build --watch",
+    "build": "tsup src/index.ts --format=esm,cjs --dts",
     "test": "jest --config ../../../jest.config.js --rootDir . --passWithNoTests",
     "lint": "eslint src --ext .ts,.tsx",
-    "test:ci": "yarn test --ci --runInBand",
-    "test:watch": "yarn test --watch --updateSnapshot"
+    "test-ci": "pnpm test --ci --runInBand",
+    "test-watch": "pnpm test --watch -u",
+    "typecheck": "tsc --noEmit"
   }
-}
+}