@zag-js/tooltip 0.2.8 → 0.2.10

package/dist/{chunk-7JKEQJM5.mjs → chunk-ILEFGJ44.mjs}

@@ -2,10 +2,10 @@ import {
   dom,
   getScrollParents,
   isHTMLElement
-} from "./chunk-3CVVHJEG.mjs";
+} from "./chunk-W5WZYXHV.mjs";
 import {
   store
-} from "./chunk-U6APNBZA.mjs";
+} from "./chunk-GQYNO326.mjs";
 
 // src/tooltip.machine.ts
 import { createMachine, subscribe } from "@zag-js/core";
@@ -13,7 +13,7 @@ import { createMachine, subscribe } from "@zag-js/core";
 // ../../utilities/core/src/functions.ts
 var runIfFn = (v, ...a) => {
   const res = typeof v === "function" ? v(...a) : v;
-  return res != null ? res : void 0;
+  return res ?? void 0;
 };
 
 // ../../utilities/core/src/guard.ts
@@ -33,9 +33,8 @@ function compact(obj) {
 // ../../utilities/dom/src/platform.ts
 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?.platform ?? navigator.platform;
 }
 var pt = (v) => isDom() && v.test(getPlatform());
 var vn = (v) => isDom() && v.test(navigator.vendor);
@@ -62,14 +61,13 @@ function extractInfo(event, type = "page") {
 }
 function addDomEvent(target, eventName, handler, options) {
   const node = isRef(target) ? target.current : runIfFn(target);
-  node == null ? void 0 : node.addEventListener(eventName, handler, options);
+  node?.addEventListener(eventName, handler, options);
   return () => {
-    node == null ? void 0 : node.removeEventListener(eventName, handler, options);
+    node?.removeEventListener(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) {
@@ -80,8 +78,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 isMouseEvent = event instanceof win.MouseEvent;
     const isPrimary = !isMouseEvent || isMouseEvent && event.button === 0;
     if (isPrimary)
@@ -134,7 +131,7 @@ function machine(userContext) {
   return createMachine(
     {
       id: "tooltip",
-      initial: "unknown",
+      initial: "closed",
       context: {
         openDelay: 1e3,
         closeDelay: 500,
@@ -159,11 +156,6 @@ function machine(userContext) {
         CLOSE: "closed"
       },
       states: {
-        unknown: {
-          on: {
-            SETUP: "closed"
-          }
-        },
         closed: {
           tags: ["closed"],
           entry: ["clearGlobalId", "invokeOnClose"],
@@ -279,7 +271,7 @@ function machine(userContext) {
             return addDomEvent(el, "scroll", () => send("SCROLL"), opts);
           });
           return () => {
-            cleanups.forEach((fn) => fn == null ? void 0 : fn());
+            cleanups.forEach((fn) => fn?.());
           };
         },
         trackStore(ctx2, _evt, { send }) {
@@ -321,18 +313,13 @@ function machine(userContext) {
           }
         },
         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);
+            ctx2.onOpen?.();
           }
         },
-        invokeOnClose(ctx2, evt) {
-          var _a;
-          const omit = ["SETUP"];
-          if (!omit.includes(evt.type)) {
-            (_a = ctx2.onClose) == null ? void 0 : _a.call(ctx2);
-          }
+        invokeOnClose(ctx2) {
+          ctx2.onClose?.();
         },
         closeIfDisabled(ctx2, _evt, { send }) {
           if (ctx2.disabled) {

package/dist/{chunk-JUJSXBJJ.mjs → chunk-V3RC3IDL.mjs}

@@ -1,12 +1,12 @@
 import {
   parts
-} from "./chunk-Z2SSSXHP.mjs";
+} from "./chunk-RRQRIZBA.mjs";
 import {
   dom
-} from "./chunk-3CVVHJEG.mjs";
+} from "./chunk-W5WZYXHV.mjs";
 import {
   store
-} from "./chunk-U6APNBZA.mjs";
+} from "./chunk-GQYNO326.mjs";
 
 // ../../utilities/dom/src/attrs.ts
 var dataAttr = (guard) => {
@@ -129,16 +129,7 @@ function connect(state, send, normalize) {
       role: "tooltip",
       style: visuallyHiddenStyle,
       children: state.context["aria-label"]
-    }),
-    createPortal() {
-      const doc = dom.getDoc(state.context);
-      const exist = dom.getPortalEl(state.context);
-      if (exist)
-        return exist;
-      const portal = dom.createPortalEl(state.context);
-      doc.body.appendChild(portal);
-      return portal;
-    }
+    })
   };
 }
 

package/dist/{chunk-3CVVHJEG.mjs → chunk-W5WZYXHV.mjs}

@@ -5,13 +5,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?.ownerDocument.defaultView ?? window;
     style = win.getComputedStyle(el);
     cache.set(el, style);
   }
@@ -23,23 +22,20 @@ function isDocument(el) {
   return el.nodeType === Node.DOCUMENT_NODE;
 }
 function isWindow(value) {
-  return (value == null ? void 0 : value.toString()) === "[object Window]";
+  return value?.toString() === "[object Window]";
 }
 function getDocument(el) {
-  var _a;
   if (isWindow(el))
     return el.document;
   if (isDocument(el))
     return el;
-  return (_a = el == null ? void 0 : el.ownerDocument) != null ? _a : document;
+  return el?.ownerDocument ?? document;
 }
 function getWindow(el) {
-  var _a;
-  return (_a = el == null ? void 0 : el.ownerDocument.defaultView) != null ? _a : window;
+  return 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?.localName ?? "";
 }
 function getParent(el) {
   const doc = getDocument(el);
@@ -49,15 +45,9 @@ function getParent(el) {
 }
 function defineDomHelpers(helpers) {
   const dom2 = {
-    getRootNode: (ctx) => {
-      var _a, _b;
-      return (_b = (_a = ctx.getRootNode) == null ? void 0 : _a.call(ctx)) != null ? _b : document;
-    },
+    getRootNode: (ctx) => ctx.getRootNode?.() ?? document,
     getDoc: (ctx) => getDocument(dom2.getRootNode(ctx)),
-    getWin: (ctx) => {
-      var _a;
-      return (_a = dom2.getDoc(ctx).defaultView) != null ? _a : window;
-    },
+    getWin: (ctx) => dom2.getDoc(ctx).defaultView ?? window,
     getActiveElement: (ctx) => dom2.getDoc(ctx).activeElement,
     getById: (ctx, id) => dom2.getRootNode(ctx).getElementById(id)
   };
@@ -67,7 +57,7 @@ function defineDomHelpers(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";
+  return typeof v === "object" && v?.nodeType === Node.ELEMENT_NODE && typeof v?.nodeName === "string";
 }
 
 // ../../utilities/dom/src/scrollable.ts
@@ -97,28 +87,15 @@ function getScrollParents(el, list = []) {
 
 // src/tooltip.dom.ts
 var dom = defineDomHelpers({
-  getTriggerId: (ctx) => {
-    var _a, _b;
-    return (_b = (_a = ctx.ids) == null ? void 0 : _a.trigger) != null ? _b : `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`;
-  },
+  getTriggerId: (ctx) => ctx.ids?.trigger ?? `tooltip:${ctx.id}:trigger`,
+  getContentId: (ctx) => ctx.ids?.content ?? `tooltip:${ctx.id}:content`,
   getArrowId: (ctx) => `tooltip:${ctx.id}:arrow`,
   getPositionerId: (ctx) => `tooltip:${ctx.id}:popper`,
-  portalId: "tooltip-portal",
   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) => {
-    const portal = dom.getDoc(ctx).createElement(dom.portalId);
-    portal.id = dom.portalId;
-    return portal;
-  }
+  getScrollParent: (ctx) => getScrollParent(dom.getTriggerEl(ctx))
 });
 
 export {

package/dist/index.js

@@ -43,13 +43,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?.ownerDocument.defaultView ?? window;
     style = win.getComputedStyle(el);
     cache.set(el, style);
   }
@@ -59,7 +58,7 @@ function getComputedStyle(el) {
 // ../../utilities/core/src/functions.ts
 var runIfFn = (v, ...a) => {
   const res = typeof v === "function" ? v(...a) : v;
-  return res != null ? res : void 0;
+  return res ?? void 0;
 };
 
 // ../../utilities/core/src/guard.ts
@@ -79,9 +78,8 @@ function compact(obj) {
 // ../../utilities/dom/src/platform.ts
 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?.platform ?? navigator.platform;
 }
 var pt = (v) => isDom() && v.test(getPlatform());
 var vn = (v) => isDom() && v.test(navigator.vendor);
@@ -93,23 +91,20 @@ function isDocument(el) {
   return el.nodeType === Node.DOCUMENT_NODE;
 }
 function isWindow(value) {
-  return (value == null ? void 0 : value.toString()) === "[object Window]";
+  return value?.toString() === "[object Window]";
 }
 function getDocument(el) {
-  var _a;
   if (isWindow(el))
     return el.document;
   if (isDocument(el))
     return el;
-  return (_a = el == null ? void 0 : el.ownerDocument) != null ? _a : document;
+  return el?.ownerDocument ?? document;
 }
 function getWindow(el) {
-  var _a;
-  return (_a = el == null ? void 0 : el.ownerDocument.defaultView) != null ? _a : window;
+  return 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?.localName ?? "";
 }
 function getParent(el) {
   const doc = getDocument(el);
@@ -119,15 +114,9 @@ function getParent(el) {
 }
 function defineDomHelpers(helpers) {
   const dom2 = {
-    getRootNode: (ctx) => {
-      var _a, _b;
-      return (_b = (_a = ctx.getRootNode) == null ? void 0 : _a.call(ctx)) != null ? _b : document;
-    },
+    getRootNode: (ctx) => ctx.getRootNode?.() ?? document,
     getDoc: (ctx) => getDocument(dom2.getRootNode(ctx)),
-    getWin: (ctx) => {
-      var _a;
-      return (_a = dom2.getDoc(ctx).defaultView) != null ? _a : window;
-    },
+    getWin: (ctx) => dom2.getDoc(ctx).defaultView ?? window,
     getActiveElement: (ctx) => dom2.getDoc(ctx).activeElement,
     getById: (ctx, id) => dom2.getRootNode(ctx).getElementById(id)
   };
@@ -137,7 +126,7 @@ function defineDomHelpers(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";
+  return typeof v === "object" && v?.nodeType === Node.ELEMENT_NODE && typeof v?.nodeName === "string";
 }
 
 // ../../utilities/dom/src/event.ts
@@ -160,14 +149,13 @@ function extractInfo(event, type = "page") {
 }
 function addDomEvent(target, eventName, handler, options) {
   const node = isRef(target) ? target.current : runIfFn(target);
-  node == null ? void 0 : node.addEventListener(eventName, handler, options);
+  node?.addEventListener(eventName, handler, options);
   return () => {
-    node == null ? void 0 : node.removeEventListener(eventName, handler, options);
+    node?.removeEventListener(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) {
@@ -178,8 +166,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 isMouseEvent = event instanceof win.MouseEvent;
     const isPrimary = !isMouseEvent || isMouseEvent && event.button === 0;
     if (isPrimary)
@@ -269,28 +256,15 @@ var import_popper = require("@zag-js/popper");
 
 // src/tooltip.dom.ts
 var dom = defineDomHelpers({
-  getTriggerId: (ctx) => {
-    var _a, _b;
-    return (_b = (_a = ctx.ids) == null ? void 0 : _a.trigger) != null ? _b : `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`;
-  },
+  getTriggerId: (ctx) => ctx.ids?.trigger ?? `tooltip:${ctx.id}:trigger`,
+  getContentId: (ctx) => ctx.ids?.content ?? `tooltip:${ctx.id}:content`,
   getArrowId: (ctx) => `tooltip:${ctx.id}:arrow`,
   getPositionerId: (ctx) => `tooltip:${ctx.id}:popper`,
-  portalId: "tooltip-portal",
   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) => {
-    const portal = dom.getDoc(ctx).createElement(dom.portalId);
-    portal.id = dom.portalId;
-    return portal;
-  }
+  getScrollParent: (ctx) => getScrollParent(dom.getTriggerEl(ctx))
 });
 
 // src/tooltip.store.ts
@@ -405,16 +379,7 @@ function connect(state, send, normalize) {
       role: "tooltip",
       style: visuallyHiddenStyle,
       children: state.context["aria-label"]
-    }),
-    createPortal() {
-      const doc = dom.getDoc(state.context);
-      const exist = dom.getPortalEl(state.context);
-      if (exist)
-        return exist;
-      const portal = dom.createPortalEl(state.context);
-      doc.body.appendChild(portal);
-      return portal;
-    }
+    })
   };
 }
 
@@ -426,7 +391,7 @@ function machine(userContext) {
   return (0, import_core2.createMachine)(
     {
       id: "tooltip",
-      initial: "unknown",
+      initial: "closed",
       context: {
         openDelay: 1e3,
         closeDelay: 500,
@@ -451,11 +416,6 @@ function machine(userContext) {
         CLOSE: "closed"
       },
       states: {
-        unknown: {
-          on: {
-            SETUP: "closed"
-          }
-        },
         closed: {
           tags: ["closed"],
           entry: ["clearGlobalId", "invokeOnClose"],
@@ -571,7 +531,7 @@ function machine(userContext) {
             return addDomEvent(el, "scroll", () => send("SCROLL"), opts);
           });
           return () => {
-            cleanups.forEach((fn) => fn == null ? void 0 : fn());
+            cleanups.forEach((fn) => fn?.());
           };
         },
         trackStore(ctx2, _evt, { send }) {
@@ -613,18 +573,13 @@ function machine(userContext) {
           }
         },
         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);
+            ctx2.onOpen?.();
           }
         },
-        invokeOnClose(ctx2, evt) {
-          var _a;
-          const omit = ["SETUP"];
-          if (!omit.includes(evt.type)) {
-            (_a = ctx2.onClose) == null ? void 0 : _a.call(ctx2);
-          }
+        invokeOnClose(ctx2) {
+          ctx2.onClose?.();
         },
         closeIfDisabled(ctx2, _evt, { send }) {
           if (ctx2.disabled) {

package/dist/index.mjs

@@ -1,14 +1,14 @@
 import {
   connect
-} from "./chunk-JUJSXBJJ.mjs";
+} from "./chunk-V3RC3IDL.mjs";
 import {
   anatomy
-} from "./chunk-Z2SSSXHP.mjs";
+} from "./chunk-RRQRIZBA.mjs";
 import {
   machine
-} from "./chunk-7JKEQJM5.mjs";
-import "./chunk-3CVVHJEG.mjs";
-import "./chunk-U6APNBZA.mjs";
+} from "./chunk-ILEFGJ44.mjs";
+import "./chunk-W5WZYXHV.mjs";
+import "./chunk-GQYNO326.mjs";
 export {
   anatomy,
   connect,

package/dist/tooltip.anatomy.mjs

@@ -1,7 +1,7 @@
 import {
   anatomy,
   parts
-} from "./chunk-Z2SSSXHP.mjs";
+} from "./chunk-RRQRIZBA.mjs";
 export {
   anatomy,
   parts

package/dist/tooltip.connect.d.ts

@@ -17,7 +17,6 @@ declare function connect<T extends PropTypes>(state: State, send: Send, normaliz
     positionerProps: T["element"];
     contentProps: T["element"];
     labelProps: T["element"];
-    createPortal(): HTMLElement;
 };
 
 export { connect };

package/dist/tooltip.connect.js

@@ -36,13 +36,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?.ownerDocument.defaultView ?? window;
     style = win.getComputedStyle(el);
     cache.set(el, style);
   }
@@ -54,19 +53,17 @@ function isDocument(el) {
   return el.nodeType === Node.DOCUMENT_NODE;
 }
 function isWindow(value) {
-  return (value == null ? void 0 : value.toString()) === "[object Window]";
+  return value?.toString() === "[object Window]";
 }
 function getDocument(el) {
-  var _a;
   if (isWindow(el))
     return el.document;
   if (isDocument(el))
     return el;
-  return (_a = el == null ? void 0 : el.ownerDocument) != null ? _a : document;
+  return el?.ownerDocument ?? document;
 }
 function getNodeName(node) {
-  var _a;
-  return isWindow(node) ? "" : (_a = node == null ? void 0 : node.localName) != null ? _a : "";
+  return isWindow(node) ? "" : node?.localName ?? "";
 }
 function getParent(el) {
   const doc = getDocument(el);
@@ -76,15 +73,9 @@ function getParent(el) {
 }
 function defineDomHelpers(helpers) {
   const dom2 = {
-    getRootNode: (ctx) => {
-      var _a, _b;
-      return (_b = (_a = ctx.getRootNode) == null ? void 0 : _a.call(ctx)) != null ? _b : document;
-    },
+    getRootNode: (ctx) => ctx.getRootNode?.() ?? document,
     getDoc: (ctx) => getDocument(dom2.getRootNode(ctx)),
-    getWin: (ctx) => {
-      var _a;
-      return (_a = dom2.getDoc(ctx).defaultView) != null ? _a : window;
-    },
+    getWin: (ctx) => dom2.getDoc(ctx).defaultView ?? window,
     getActiveElement: (ctx) => dom2.getDoc(ctx).activeElement,
     getById: (ctx, id) => dom2.getRootNode(ctx).getElementById(id)
   };
@@ -94,7 +85,7 @@ function defineDomHelpers(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";
+  return typeof v === "object" && v?.nodeType === Node.ELEMENT_NODE && typeof v?.nodeName === "string";
 }
 
 // ../../utilities/dom/src/scrollable.ts
@@ -129,30 +120,22 @@ var visuallyHiddenStyle = {
 // src/tooltip.connect.ts
 var import_popper = require("@zag-js/popper");
 
+// src/tooltip.anatomy.ts
+var import_anatomy = require("@zag-js/anatomy");
+var anatomy = (0, import_anatomy.createAnatomy)("tooltip").parts("trigger", "arrow", "arrowTip", "positioner", "content", "label");
+var parts = anatomy.build();
+
 // src/tooltip.dom.ts
 var dom = defineDomHelpers({
-  getTriggerId: (ctx) => {
-    var _a, _b;
-    return (_b = (_a = ctx.ids) == null ? void 0 : _a.trigger) != null ? _b : `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`;
-  },
+  getTriggerId: (ctx) => ctx.ids?.trigger ?? `tooltip:${ctx.id}:trigger`,
+  getContentId: (ctx) => ctx.ids?.content ?? `tooltip:${ctx.id}:content`,
   getArrowId: (ctx) => `tooltip:${ctx.id}:arrow`,
   getPositionerId: (ctx) => `tooltip:${ctx.id}:popper`,
-  portalId: "tooltip-portal",
   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) => {
-    const portal = dom.getDoc(ctx).createElement(dom.portalId);
-    portal.id = dom.portalId;
-    return portal;
-  }
+  getScrollParent: (ctx) => getScrollParent(dom.getTriggerEl(ctx))
 });
 
 // src/tooltip.store.ts
@@ -166,11 +149,6 @@ var store = (0, import_core.proxy)({
   }
 });
 
-// src/tooltip.anatomy.ts
-var import_anatomy = require("@zag-js/anatomy");
-var anatomy = (0, import_anatomy.createAnatomy)("tooltip").parts("trigger", "arrow", "arrowTip", "positioner", "content", "label");
-var parts = anatomy.build();
-
 // src/tooltip.connect.ts
 function connect(state, send, normalize) {
   const id = state.context.id;
@@ -272,16 +250,7 @@ function connect(state, send, normalize) {
       role: "tooltip",
       style: visuallyHiddenStyle,
       children: state.context["aria-label"]
-    }),
-    createPortal() {
-      const doc = dom.getDoc(state.context);
-      const exist = dom.getPortalEl(state.context);
-      if (exist)
-        return exist;
-      const portal = dom.createPortalEl(state.context);
-      doc.body.appendChild(portal);
-      return portal;
-    }
+    })
   };
 }
 // Annotate the CommonJS export names for ESM import in node:

package/dist/tooltip.connect.mjs

@@ -1,9 +1,9 @@
 import {
   connect
-} from "./chunk-JUJSXBJJ.mjs";
-import "./chunk-Z2SSSXHP.mjs";
-import "./chunk-3CVVHJEG.mjs";
-import "./chunk-U6APNBZA.mjs";
+} from "./chunk-V3RC3IDL.mjs";
+import "./chunk-RRQRIZBA.mjs";
+import "./chunk-W5WZYXHV.mjs";
+import "./chunk-GQYNO326.mjs";
 export {
   connect
 };

package/dist/tooltip.dom.d.ts

@@ -24,14 +24,11 @@ declare const dom: {
     getContentId: (ctx: MachineContext) => string;
     getArrowId: (ctx: MachineContext) => string;
     getPositionerId: (ctx: MachineContext) => string;
-    portalId: string;
     getTriggerEl: (ctx: MachineContext) => HTMLElement | null;
     getContentEl: (ctx: MachineContext) => HTMLElement | null;
     getPositionerEl: (ctx: MachineContext) => HTMLElement | null;
     getArrowEl: (ctx: MachineContext) => HTMLElement | null;
     getScrollParent: (ctx: MachineContext) => HTMLElement;
-    getPortalEl: (ctx: MachineContext) => HTMLElement | null;
-    createPortalEl: (ctx: MachineContext) => HTMLElement;
 };
 
 export { dom };

package/dist/tooltip.dom.js

@@ -31,13 +31,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?.ownerDocument.defaultView ?? window;
     style = win.getComputedStyle(el);
     cache.set(el, style);
   }
@@ -49,19 +48,17 @@ function isDocument(el) {
   return el.nodeType === Node.DOCUMENT_NODE;
 }
 function isWindow(value) {
-  return (value == null ? void 0 : value.toString()) === "[object Window]";
+  return value?.toString() === "[object Window]";
 }
 function getDocument(el) {
-  var _a;
   if (isWindow(el))
     return el.document;
   if (isDocument(el))
     return el;
-  return (_a = el == null ? void 0 : el.ownerDocument) != null ? _a : document;
+  return el?.ownerDocument ?? document;
 }
 function getNodeName(node) {
-  var _a;
-  return isWindow(node) ? "" : (_a = node == null ? void 0 : node.localName) != null ? _a : "";
+  return isWindow(node) ? "" : node?.localName ?? "";
 }
 function getParent(el) {
   const doc = getDocument(el);
@@ -71,15 +68,9 @@ function getParent(el) {
 }
 function defineDomHelpers(helpers) {
   const dom2 = {
-    getRootNode: (ctx) => {
-      var _a, _b;
-      return (_b = (_a = ctx.getRootNode) == null ? void 0 : _a.call(ctx)) != null ? _b : document;
-    },
+    getRootNode: (ctx) => ctx.getRootNode?.() ?? document,
     getDoc: (ctx) => getDocument(dom2.getRootNode(ctx)),
-    getWin: (ctx) => {
-      var _a;
-      return (_a = dom2.getDoc(ctx).defaultView) != null ? _a : window;
-    },
+    getWin: (ctx) => dom2.getDoc(ctx).defaultView ?? window,
     getActiveElement: (ctx) => dom2.getDoc(ctx).activeElement,
     getById: (ctx, id) => dom2.getRootNode(ctx).getElementById(id)
   };
@@ -89,7 +80,7 @@ function defineDomHelpers(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";
+  return typeof v === "object" && v?.nodeType === Node.ELEMENT_NODE && typeof v?.nodeName === "string";
 }
 
 // ../../utilities/dom/src/scrollable.ts
@@ -109,28 +100,15 @@ function getScrollParent(el) {
 
 // src/tooltip.dom.ts
 var dom = defineDomHelpers({
-  getTriggerId: (ctx) => {
-    var _a, _b;
-    return (_b = (_a = ctx.ids) == null ? void 0 : _a.trigger) != null ? _b : `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`;
-  },
+  getTriggerId: (ctx) => ctx.ids?.trigger ?? `tooltip:${ctx.id}:trigger`,
+  getContentId: (ctx) => ctx.ids?.content ?? `tooltip:${ctx.id}:content`,
   getArrowId: (ctx) => `tooltip:${ctx.id}:arrow`,
   getPositionerId: (ctx) => `tooltip:${ctx.id}:popper`,
-  portalId: "tooltip-portal",
   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) => {
-    const portal = dom.getDoc(ctx).createElement(dom.portalId);
-    portal.id = dom.portalId;
-    return portal;
-  }
+  getScrollParent: (ctx) => getScrollParent(dom.getTriggerEl(ctx))
 });
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/dist/tooltip.dom.mjs

@@ -1,6 +1,6 @@
 import {
   dom
-} from "./chunk-3CVVHJEG.mjs";
+} from "./chunk-W5WZYXHV.mjs";
 export {
   dom
 };

package/dist/tooltip.machine.js

@@ -32,13 +32,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?.ownerDocument.defaultView ?? window;
     style = win.getComputedStyle(el);
     cache.set(el, style);
   }
@@ -48,7 +47,7 @@ function getComputedStyle(el) {
 // ../../utilities/core/src/functions.ts
 var runIfFn = (v, ...a) => {
   const res = typeof v === "function" ? v(...a) : v;
-  return res != null ? res : void 0;
+  return res ?? void 0;
 };
 
 // ../../utilities/core/src/guard.ts
@@ -68,9 +67,8 @@ function compact(obj) {
 // ../../utilities/dom/src/platform.ts
 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?.platform ?? navigator.platform;
 }
 var pt = (v) => isDom() && v.test(getPlatform());
 var vn = (v) => isDom() && v.test(navigator.vendor);
@@ -82,23 +80,20 @@ function isDocument(el) {
   return el.nodeType === Node.DOCUMENT_NODE;
 }
 function isWindow(value) {
-  return (value == null ? void 0 : value.toString()) === "[object Window]";
+  return value?.toString() === "[object Window]";
 }
 function getDocument(el) {
-  var _a;
   if (isWindow(el))
     return el.document;
   if (isDocument(el))
     return el;
-  return (_a = el == null ? void 0 : el.ownerDocument) != null ? _a : document;
+  return el?.ownerDocument ?? document;
 }
 function getWindow(el) {
-  var _a;
-  return (_a = el == null ? void 0 : el.ownerDocument.defaultView) != null ? _a : window;
+  return 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?.localName ?? "";
 }
 function getParent(el) {
   const doc = getDocument(el);
@@ -108,15 +103,9 @@ function getParent(el) {
 }
 function defineDomHelpers(helpers) {
   const dom2 = {
-    getRootNode: (ctx) => {
-      var _a, _b;
-      return (_b = (_a = ctx.getRootNode) == null ? void 0 : _a.call(ctx)) != null ? _b : document;
-    },
+    getRootNode: (ctx) => ctx.getRootNode?.() ?? document,
     getDoc: (ctx) => getDocument(dom2.getRootNode(ctx)),
-    getWin: (ctx) => {
-      var _a;
-      return (_a = dom2.getDoc(ctx).defaultView) != null ? _a : window;
-    },
+    getWin: (ctx) => dom2.getDoc(ctx).defaultView ?? window,
     getActiveElement: (ctx) => dom2.getDoc(ctx).activeElement,
     getById: (ctx, id) => dom2.getRootNode(ctx).getElementById(id)
   };
@@ -126,7 +115,7 @@ function defineDomHelpers(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";
+  return typeof v === "object" && v?.nodeType === Node.ELEMENT_NODE && typeof v?.nodeName === "string";
 }
 
 // ../../utilities/dom/src/event.ts
@@ -149,14 +138,13 @@ function extractInfo(event, type = "page") {
 }
 function addDomEvent(target, eventName, handler, options) {
   const node = isRef(target) ? target.current : runIfFn(target);
-  node == null ? void 0 : node.addEventListener(eventName, handler, options);
+  node?.addEventListener(eventName, handler, options);
   return () => {
-    node == null ? void 0 : node.removeEventListener(eventName, handler, options);
+    node?.removeEventListener(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) {
@@ -167,8 +155,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 isMouseEvent = event instanceof win.MouseEvent;
     const isPrimary = !isMouseEvent || isMouseEvent && event.button === 0;
     if (isPrimary)
@@ -244,28 +231,15 @@ var import_popper = require("@zag-js/popper");
 
 // src/tooltip.dom.ts
 var dom = defineDomHelpers({
-  getTriggerId: (ctx) => {
-    var _a, _b;
-    return (_b = (_a = ctx.ids) == null ? void 0 : _a.trigger) != null ? _b : `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`;
-  },
+  getTriggerId: (ctx) => ctx.ids?.trigger ?? `tooltip:${ctx.id}:trigger`,
+  getContentId: (ctx) => ctx.ids?.content ?? `tooltip:${ctx.id}:content`,
   getArrowId: (ctx) => `tooltip:${ctx.id}:arrow`,
   getPositionerId: (ctx) => `tooltip:${ctx.id}:popper`,
-  portalId: "tooltip-portal",
   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) => {
-    const portal = dom.getDoc(ctx).createElement(dom.portalId);
-    portal.id = dom.portalId;
-    return portal;
-  }
+  getScrollParent: (ctx) => getScrollParent(dom.getTriggerEl(ctx))
 });
 
 // src/tooltip.store.ts
@@ -285,7 +259,7 @@ function machine(userContext) {
   return (0, import_core2.createMachine)(
     {
       id: "tooltip",
-      initial: "unknown",
+      initial: "closed",
       context: {
         openDelay: 1e3,
         closeDelay: 500,
@@ -310,11 +284,6 @@ function machine(userContext) {
         CLOSE: "closed"
       },
       states: {
-        unknown: {
-          on: {
-            SETUP: "closed"
-          }
-        },
         closed: {
           tags: ["closed"],
           entry: ["clearGlobalId", "invokeOnClose"],
@@ -430,7 +399,7 @@ function machine(userContext) {
             return addDomEvent(el, "scroll", () => send("SCROLL"), opts);
           });
           return () => {
-            cleanups.forEach((fn) => fn == null ? void 0 : fn());
+            cleanups.forEach((fn) => fn?.());
           };
         },
         trackStore(ctx2, _evt, { send }) {
@@ -472,18 +441,13 @@ function machine(userContext) {
           }
         },
         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);
+            ctx2.onOpen?.();
           }
         },
-        invokeOnClose(ctx2, evt) {
-          var _a;
-          const omit = ["SETUP"];
-          if (!omit.includes(evt.type)) {
-            (_a = ctx2.onClose) == null ? void 0 : _a.call(ctx2);
-          }
+        invokeOnClose(ctx2) {
+          ctx2.onClose?.();
         },
         closeIfDisabled(ctx2, _evt, { send }) {
           if (ctx2.disabled) {

package/dist/tooltip.machine.mjs

@@ -1,8 +1,8 @@
 import {
   machine
-} from "./chunk-7JKEQJM5.mjs";
-import "./chunk-3CVVHJEG.mjs";
-import "./chunk-U6APNBZA.mjs";
+} from "./chunk-ILEFGJ44.mjs";
+import "./chunk-W5WZYXHV.mjs";
+import "./chunk-GQYNO326.mjs";
 export {
   machine
 };

package/dist/tooltip.store.mjs

@@ -1,6 +1,6 @@
 import {
   store
-} from "./chunk-U6APNBZA.mjs";
+} from "./chunk-GQYNO326.mjs";
 export {
   store
 };

package/dist/tooltip.types.d.ts

@@ -68,7 +68,7 @@ type ComputedContext = Readonly<{
 type PrivateContext = RootProperties & {};
 type MachineContext = PublicContext & ComputedContext & PrivateContext;
 type MachineState = {
-    value: "unknown" | "opening" | "open" | "closing" | "closed";
+    value: "opening" | "open" | "closing" | "closed";
     tags: "open" | "closed";
 };
 type State = StateMachine.State<MachineContext, MachineState>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zag-js/tooltip",
-  "version": "0.2.8",
+  "version": "0.2.10",
   "description": "Core logic for the tooltip widget implemented as a state machine",
   "keywords": [
     "js",
@@ -26,15 +26,15 @@
     "url": "https://github.com/chakra-ui/zag/issues"
   },
   "dependencies": {
-    "@zag-js/anatomy": "0.1.3",
-    "@zag-js/core": "0.2.6",
-    "@zag-js/popper": "0.2.2",
-    "@zag-js/types": "0.3.3"
+    "@zag-js/anatomy": "0.1.4",
+    "@zag-js/core": "0.2.8",
+    "@zag-js/popper": "0.2.3",
+    "@zag-js/types": "0.3.4"
   },
   "devDependencies": {
     "clean-package": "2.2.0",
-    "@zag-js/dom-utils": "0.2.3",
-    "@zag-js/utils": "0.3.2"
+    "@zag-js/dom-utils": "0.2.4",
+    "@zag-js/utils": "0.3.3"
   },
   "clean-package": "../../../clean-package.config.json",
   "main": "dist/index.js",