@zag-js/tooltip 0.1.9 → 0.1.10

package/dist/index.js

@@ -43,6 +43,22 @@ __export(src_exports, {
 module.exports = __toCommonJS(src_exports);
 
 // ../../utilities/dom/dist/index.mjs
+var __defProp2 = Object.defineProperty;
+var __getOwnPropSymbols2 = Object.getOwnPropertySymbols;
+var __hasOwnProp2 = Object.prototype.hasOwnProperty;
+var __propIsEnum2 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp2 = (obj, key, value) => key in obj ? __defProp2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues2 = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp2.call(b, prop))
+      __defNormalProp2(a, prop, b[prop]);
+  if (__getOwnPropSymbols2)
+    for (var prop of __getOwnPropSymbols2(b)) {
+      if (__propIsEnum2.call(b, prop))
+        __defNormalProp2(a, prop, b[prop]);
+    }
+  return a;
+};
 var dataAttr = (guard) => {
   return guard ? "" : void 0;
 };
@@ -81,6 +97,9 @@ 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]";
 }
@@ -88,6 +107,8 @@ 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;
 }
 function getWindow(el) {
@@ -104,6 +125,22 @@ function getParent(el) {
     return el;
   return el.assignedSlot || el.parentElement || doc.documentElement;
 }
+function defineDomHelpers(helpers) {
+  const dom2 = {
+    getRootNode: (ctx) => {
+      var _a, _b;
+      return (_b = (_a = ctx.getRootNode) == null ? void 0 : _a.call(ctx)) != null ? _b : document;
+    },
+    getDoc: (ctx) => getDocument(dom2.getRootNode(ctx)),
+    getWin: (ctx) => {
+      var _a;
+      return (_a = dom2.getDoc(ctx).defaultView) != null ? _a : window;
+    },
+    getActiveElement: (ctx) => dom2.getDoc(ctx).activeElement,
+    getById: (ctx, id) => dom2.getRootNode(ctx).getElementById(id)
+  };
+  return __spreadValues2(__spreadValues2({}, 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";
 }
@@ -175,18 +212,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() {
@@ -219,24 +244,24 @@ 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
 var import_popper = require("@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`;
@@ -248,10 +273,10 @@ var dom = {
   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) => {
@@ -259,7 +284,7 @@ var dom = {
     portal.id = dom.portalId;
     return portal;
   }
-};
+});
 
 // src/tooltip.store.ts
 var import_core = require("@zag-js/core");
@@ -379,18 +404,11 @@ function connect(state, send, normalize) {
 // src/tooltip.machine.ts
 var import_core2 = require("@zag-js/core");
 var import_popper2 = require("@zag-js/popper");
-
-// ../../utilities/core/dist/index.mjs
-var noop = () => {
-};
-
-// src/tooltip.machine.ts
-function machine(ctx = {}) {
+function machine(ctx) {
   return (0, import_core2.createMachine)({
     id: "tooltip",
     initial: "unknown",
     context: __spreadProps(__spreadValues({
-      id: "",
       openDelay: 1e3,
       closeDelay: 500,
       closeOnPointerDown: true,
@@ -412,10 +430,7 @@ function machine(ctx = {}) {
     states: {
       unknown: {
         on: {
-          SETUP: {
-            target: "closed",
-            actions: "setupDocument"
-          }
+          SETUP: "closed"
         }
       },
       closed: {
@@ -543,7 +558,7 @@ function machine(ctx = {}) {
       },
       trackDisabledTriggerOnSafari(ctx2, _evt, { send }) {
         if (!isSafari())
-          return noop;
+          return;
         const doc = dom.getDoc(ctx2);
         return addPointerEvent(doc, "pointermove", (event) => {
           const selector = "[data-part=trigger][data-expanded]";

package/dist/index.mjs

@@ -19,6 +19,22 @@ var __spreadValues = (a, b) => {
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 
 // ../../utilities/dom/dist/index.mjs
+var __defProp2 = Object.defineProperty;
+var __getOwnPropSymbols2 = Object.getOwnPropertySymbols;
+var __hasOwnProp2 = Object.prototype.hasOwnProperty;
+var __propIsEnum2 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp2 = (obj, key, value) => key in obj ? __defProp2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues2 = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp2.call(b, prop))
+      __defNormalProp2(a, prop, b[prop]);
+  if (__getOwnPropSymbols2)
+    for (var prop of __getOwnPropSymbols2(b)) {
+      if (__propIsEnum2.call(b, prop))
+        __defNormalProp2(a, prop, b[prop]);
+    }
+  return a;
+};
 var dataAttr = (guard) => {
   return guard ? "" : void 0;
 };
@@ -57,6 +73,9 @@ 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]";
 }
@@ -64,6 +83,8 @@ 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;
 }
 function getWindow(el) {
@@ -80,6 +101,22 @@ function getParent(el) {
     return el;
   return el.assignedSlot || el.parentElement || doc.documentElement;
 }
+function defineDomHelpers(helpers) {
+  const dom2 = {
+    getRootNode: (ctx) => {
+      var _a, _b;
+      return (_b = (_a = ctx.getRootNode) == null ? void 0 : _a.call(ctx)) != null ? _b : document;
+    },
+    getDoc: (ctx) => getDocument(dom2.getRootNode(ctx)),
+    getWin: (ctx) => {
+      var _a;
+      return (_a = dom2.getDoc(ctx).defaultView) != null ? _a : window;
+    },
+    getActiveElement: (ctx) => dom2.getDoc(ctx).activeElement,
+    getById: (ctx, id) => dom2.getRootNode(ctx).getElementById(id)
+  };
+  return __spreadValues2(__spreadValues2({}, 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";
 }
@@ -151,18 +188,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,24 +220,24 @@ 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`;
@@ -224,10 +249,10 @@ var dom = {
   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 +260,7 @@ var dom = {
     portal.id = dom.portalId;
     return portal;
   }
-};
+});
 
 // src/tooltip.store.ts
 import { proxy } from "@zag-js/core";
@@ -355,18 +380,11 @@ function connect(state, send, normalize) {
 // src/tooltip.machine.ts
 import { createMachine, ref, 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 = {}) {
+function machine(ctx) {
   return createMachine({
     id: "tooltip",
     initial: "unknown",
     context: __spreadProps(__spreadValues({
-      id: "",
       openDelay: 1e3,
       closeDelay: 500,
       closeOnPointerDown: true,
@@ -388,10 +406,7 @@ function machine(ctx = {}) {
     states: {
       unknown: {
         on: {
-          SETUP: {
-            target: "closed",
-            actions: "setupDocument"
-          }
+          SETUP: "closed"
         }
       },
       closed: {
@@ -519,7 +534,7 @@ function machine(ctx = {}) {
       },
       trackDisabledTriggerOnSafari(ctx2, _evt, { send }) {
         if (!isSafari())
-          return noop;
+          return;
         const doc = dom.getDoc(ctx2);
         return addPointerEvent(doc, "pointermove", (event) => {
           const selector = "[data-part=trigger][data-expanded]";

package/dist/tooltip.dom.d.ts

@@ -1,8 +1,21 @@
 import type { MachineContext as Ctx } from "./tooltip.types";
 export declare const dom: {
-    getDoc: (ctx: Ctx) => Document;
-    getWin: (ctx: Ctx) => Window & typeof globalThis;
-    getRootNode: (ctx: Ctx) => Document | ShadowRoot;
+    getRootNode: (ctx: {
+        getRootNode?: () => Document | Node | ShadowRoot;
+    }) => Document | ShadowRoot;
+    getDoc: (ctx: {
+        getRootNode?: () => Document | Node | ShadowRoot;
+    }) => Document;
+    getWin: (ctx: {
+        getRootNode?: () => Document | Node | ShadowRoot;
+    }) => Window & typeof globalThis;
+    getActiveElement: (ctx: {
+        getRootNode?: () => Document | Node | ShadowRoot;
+    }) => HTMLElement;
+    getById: <T_1 = HTMLElement>(ctx: {
+        getRootNode?: () => Document | Node | ShadowRoot;
+    }, id: string) => T_1;
+} & {
     getTriggerId: (ctx: Ctx) => string;
     getContentId: (ctx: Ctx) => string;
     getArrowId: (ctx: Ctx) => string;

package/dist/tooltip.machine.d.ts

@@ -1,2 +1,2 @@
 import type { MachineContext, MachineState, UserDefinedContext } from "./tooltip.types";
-export declare function machine(ctx?: UserDefinedContext): import("@zag-js/core").Machine<MachineContext, MachineState, import("@zag-js/core").StateMachine.AnyEventObject>;
+export declare function machine(ctx: UserDefinedContext): import("@zag-js/core").Machine<MachineContext, MachineState, import("@zag-js/core").StateMachine.AnyEventObject>;

package/dist/tooltip.types.d.ts

@@ -1,11 +1,11 @@
 import type { StateMachine as S } from "@zag-js/core";
 import type { Placement, PositioningOptions } from "@zag-js/popper";
-import type { RootProperties } from "@zag-js/types";
+import type { CommonProperties, RequiredBy, RootProperties } from "@zag-js/types";
 declare type ElementIds = Partial<{
     trigger: string;
     content: string;
 }>;
-declare type PublicContext = {
+declare type PublicContext = CommonProperties & {
     /**
      * The ids of the elements in the tooltip. Useful for composition.
      */
@@ -53,7 +53,7 @@ declare type PublicContext = {
      */
     positioning: PositioningOptions;
 };
-export declare type UserDefinedContext = Partial<PublicContext>;
+export declare type UserDefinedContext = RequiredBy<PublicContext, "id">;
 declare type ComputedContext = Readonly<{
     /**
      * @computed Whether an `aria-label` is set.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zag-js/tooltip",
-  "version": "0.1.9",
+  "version": "0.1.10",
   "description": "Core logic for the tooltip widget implemented as a state machine",
   "keywords": [
     "js",
@@ -29,10 +29,13 @@
     "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.8",
+    "@zag-js/popper": "0.1.8",
+    "@zag-js/types": "0.2.2"
+  },
+  "devDependencies": {
+    "@zag-js/dom-utils": "0.1.7",
+    "@zag-js/utils": "0.1.2"
   },
   "scripts": {
     "build:fast": "zag build",