@zag-js/tooltip 0.1.7 → 0.1.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.ts CHANGED
@@ -1,4 +1,3 @@
1
1
  export { connect } from "./tooltip.connect";
2
2
  export { machine } from "./tooltip.machine";
3
3
  export type { UserDefinedContext as Context } from "./tooltip.types";
4
- //# sourceMappingURL=index.d.ts.map
package/dist/index.js CHANGED
@@ -1,3 +1,4 @@
1
+ "use strict";
1
2
  var __defProp = Object.defineProperty;
2
3
  var __defProps = Object.defineProperties;
3
4
  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
@@ -42,19 +43,35 @@ __export(src_exports, {
42
43
  module.exports = __toCommonJS(src_exports);
43
44
 
44
45
  // ../../utilities/dom/dist/index.mjs
46
+ var __defProp2 = Object.defineProperty;
47
+ var __getOwnPropSymbols2 = Object.getOwnPropertySymbols;
48
+ var __hasOwnProp2 = Object.prototype.hasOwnProperty;
49
+ var __propIsEnum2 = Object.prototype.propertyIsEnumerable;
50
+ var __defNormalProp2 = (obj, key, value) => key in obj ? __defProp2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
51
+ var __spreadValues2 = (a, b) => {
52
+ for (var prop in b || (b = {}))
53
+ if (__hasOwnProp2.call(b, prop))
54
+ __defNormalProp2(a, prop, b[prop]);
55
+ if (__getOwnPropSymbols2)
56
+ for (var prop of __getOwnPropSymbols2(b)) {
57
+ if (__propIsEnum2.call(b, prop))
58
+ __defNormalProp2(a, prop, b[prop]);
59
+ }
60
+ return a;
61
+ };
45
62
  var dataAttr = (guard) => {
46
63
  return guard ? "" : void 0;
47
64
  };
48
- function getStyleCache() {
49
- ;
50
- globalThis.__styleCache__ = globalThis.__styleCache__ || /* @__PURE__ */ new WeakMap();
51
- return globalThis.__styleCache__;
65
+ function getCache() {
66
+ const g = globalThis;
67
+ g.__styleCache = g.__styleCache || /* @__PURE__ */ new WeakMap();
68
+ return g.__styleCache;
52
69
  }
53
- function getComputedStyle2(el) {
70
+ function getComputedStyle(el) {
54
71
  var _a;
55
72
  if (!el)
56
73
  return {};
57
- const cache = getStyleCache();
74
+ const cache = getCache();
58
75
  let style = cache.get(el);
59
76
  if (!style) {
60
77
  const win = (_a = el == null ? void 0 : el.ownerDocument.defaultView) != null ? _a : window;
@@ -63,93 +80,78 @@ function getComputedStyle2(el) {
63
80
  }
64
81
  return style;
65
82
  }
66
- function raf(fn) {
67
- const id = globalThis.requestAnimationFrame(fn);
68
- return function cleanup() {
69
- globalThis.cancelAnimationFrame(id);
70
- };
71
- }
72
- var isDom = () => typeof window !== "undefined";
73
- var isArray = (v) => Array.isArray(v);
74
- var isObject = (v) => !(v == null || typeof v !== "object" || isArray(v));
75
- var hasProp = (obj, prop) => Object.prototype.hasOwnProperty.call(obj, prop);
76
- var isTouchDevice = isDom() && !!navigator.maxTouchPoints;
77
- var supportsPointerEvent = () => isDom() && window.onpointerdown === null;
78
- var supportsTouchEvent = () => isDom() && window.ontouchstart === null;
79
- var supportsMouseEvent = () => isDom() && window.onmousedown === null;
80
- var isTouchEvent = (v) => isObject(v) && hasProp(v, "touches");
81
83
  var runIfFn = (v, ...a) => {
82
84
  const res = typeof v === "function" ? v(...a) : v;
83
85
  return res != null ? res : void 0;
84
86
  };
85
- var noop = () => {
86
- };
87
- function getListenerElements() {
88
- ;
89
- globalThis.__listenerElements__ = globalThis.__listenerElements__ || /* @__PURE__ */ new Map();
90
- return globalThis.__listenerElements__;
87
+ var isArray = (v) => Array.isArray(v);
88
+ var isObject = (v) => !(v == null || typeof v !== "object" || isArray(v));
89
+ var hasProp = (obj, prop) => Object.prototype.hasOwnProperty.call(obj, prop);
90
+ var isDom = () => typeof window !== "undefined";
91
+ function getPlatform() {
92
+ var _a;
93
+ const agent = navigator.userAgentData;
94
+ return (_a = agent == null ? void 0 : agent.platform) != null ? _a : navigator.platform;
95
+ }
96
+ var pt = (v) => isDom() && v.test(getPlatform());
97
+ var vn = (v) => isDom() && v.test(navigator.vendor);
98
+ var isSafari = () => isApple() && vn(/apple/i);
99
+ var isApple = () => pt(/mac|iphone|ipad|ipod/i);
100
+ function isDocument(el) {
101
+ return el.nodeType === Node.DOCUMENT_NODE;
91
102
  }
92
- function getListenerCache() {
93
- ;
94
- globalThis.__listenerCache__ = globalThis.__listenerCache__ || /* @__PURE__ */ new Map();
95
- return globalThis.__listenerCache__;
103
+ function isWindow(value) {
104
+ return (value == null ? void 0 : value.toString()) === "[object Window]";
96
105
  }
97
- function addGlobalEventListener(node, type, handler, options) {
106
+ function getDocument(el) {
98
107
  var _a;
99
- if (!node)
100
- return noop;
101
- const hash = JSON.stringify({ type, options });
102
- const listenerElements = getListenerElements();
103
- const listenerCache = getListenerCache();
104
- const group = listenerElements.get(node);
105
- if (!listenerElements.has(node)) {
106
- const group2 = /* @__PURE__ */ new Map([[hash, /* @__PURE__ */ new Set([handler])]]);
107
- listenerElements.set(node, group2);
108
- } else if (group == null ? void 0 : group.has(hash)) {
109
- (_a = group == null ? void 0 : group.get(hash)) == null ? void 0 : _a.add(handler);
110
- } else {
111
- group == null ? void 0 : group.set(hash, /* @__PURE__ */ new Set([handler]));
112
- }
113
- function attach(node2) {
114
- var _a2, _b;
115
- function listener(event) {
116
- var _a3;
117
- const group2 = listenerElements.get(node2);
118
- (_a3 = group2 == null ? void 0 : group2.get(hash)) == null ? void 0 : _a3.forEach((fn) => fn(event));
119
- }
120
- if (!(listenerCache == null ? void 0 : listenerCache.has(node2))) {
121
- listenerCache.set(node2, /* @__PURE__ */ new Map([[hash, listener]]));
122
- node2.addEventListener(type, listener, options);
123
- return;
124
- }
125
- if (!((_a2 = listenerCache == null ? void 0 : listenerCache.get(node2)) == null ? void 0 : _a2.has(hash))) {
126
- (_b = listenerCache.get(node2)) == null ? void 0 : _b.set(hash, listener);
127
- node2.addEventListener(type, listener, options);
128
- }
129
- }
130
- attach(node);
131
- return function remove() {
132
- var _a2, _b, _c, _d;
133
- if (!listenerElements.has(node))
134
- return;
135
- const group2 = listenerElements.get(node);
136
- (_a2 = group2 == null ? void 0 : group2.get(hash)) == null ? void 0 : _a2.delete(handler);
137
- if (((_b = group2 == null ? void 0 : group2.get(hash)) == null ? void 0 : _b.size) === 0) {
138
- const listener = (_c = listenerCache.get(node)) == null ? void 0 : _c.get(hash);
139
- node.removeEventListener(type, listener, options);
140
- group2 == null ? void 0 : group2.delete(hash);
141
- (_d = listenerCache.get(node)) == null ? void 0 : _d.delete(hash);
142
- if ((group2 == null ? void 0 : group2.size) === 0) {
143
- listenerElements.delete(node);
144
- listenerCache.delete(node);
145
- }
146
- }
108
+ if (isWindow(el))
109
+ return el.document;
110
+ if (isDocument(el))
111
+ return el;
112
+ return (_a = el == null ? void 0 : el.ownerDocument) != null ? _a : document;
113
+ }
114
+ function getWindow(el) {
115
+ var _a;
116
+ return (_a = el == null ? void 0 : el.ownerDocument.defaultView) != null ? _a : window;
117
+ }
118
+ function getNodeName(node) {
119
+ var _a;
120
+ return isWindow(node) ? "" : (_a = node == null ? void 0 : node.localName) != null ? _a : "";
121
+ }
122
+ function getParent(el) {
123
+ const doc = getDocument(el);
124
+ if (getNodeName(el) === "html")
125
+ return el;
126
+ return el.assignedSlot || el.parentElement || doc.documentElement;
127
+ }
128
+ function defineDomHelpers(helpers) {
129
+ const dom2 = {
130
+ getRootNode: (ctx) => {
131
+ var _a, _b;
132
+ return (_b = (_a = ctx.getRootNode) == null ? void 0 : _a.call(ctx)) != null ? _b : document;
133
+ },
134
+ getDoc: (ctx) => getDocument(dom2.getRootNode(ctx)),
135
+ getWin: (ctx) => {
136
+ var _a;
137
+ return (_a = dom2.getDoc(ctx).defaultView) != null ? _a : window;
138
+ },
139
+ getActiveElement: (ctx) => dom2.getDoc(ctx).activeElement,
140
+ getById: (ctx, id) => dom2.getRootNode(ctx).getElementById(id)
147
141
  };
142
+ return __spreadValues2(__spreadValues2({}, dom2), helpers);
148
143
  }
144
+ function isHTMLElement(v) {
145
+ return typeof v === "object" && (v == null ? void 0 : v.nodeType) === Node.ELEMENT_NODE && typeof (v == null ? void 0 : v.nodeName) === "string";
146
+ }
147
+ var supportsPointerEvent = () => isDom() && window.onpointerdown === null;
148
+ var supportsTouchEvent = () => isDom() && window.ontouchstart === null;
149
+ var supportsMouseEvent = () => isDom() && window.onmousedown === null;
150
+ var isTouchEvent = (v) => isObject(v) && hasProp(v, "touches");
149
151
  var isRef = (v) => hasProp(v, "current");
150
- var fallback = { pageX: 0, pageY: 0, clientX: 0, clientY: 0 };
152
+ var fallback2 = { pageX: 0, pageY: 0, clientX: 0, clientY: 0 };
151
153
  function extractInfo(event, type = "page") {
152
- const point = isTouchEvent(event) ? event.touches[0] || event.changedTouches[0] || fallback : event;
154
+ const point = isTouchEvent(event) ? event.touches[0] || event.changedTouches[0] || fallback2 : event;
153
155
  return {
154
156
  point: {
155
157
  x: point[`${type}X`],
@@ -157,9 +159,12 @@ function extractInfo(event, type = "page") {
157
159
  }
158
160
  };
159
161
  }
160
- function addDomEvent(target, event, listener, options) {
162
+ function addDomEvent(target, eventName, handler, options) {
161
163
  const node = isRef(target) ? target.current : runIfFn(target);
162
- return addGlobalEventListener(node, event, listener, options);
164
+ node == null ? void 0 : node.addEventListener(eventName, handler, options);
165
+ return () => {
166
+ node == null ? void 0 : node.removeEventListener(eventName, handler, options);
167
+ };
163
168
  }
164
169
  function addPointerEvent(target, event, listener, options) {
165
170
  var _a;
@@ -207,77 +212,22 @@ function getEventName(evt) {
207
212
  return mouseEventNames[evt];
208
213
  return evt;
209
214
  }
210
- function getOwnerDocument(el) {
211
- var _a;
212
- if (isWindow(el))
213
- return el.document;
214
- return (_a = el == null ? void 0 : el.ownerDocument) != null ? _a : document;
215
- }
216
- function getOwnerWindow(el) {
217
- var _a;
218
- return (_a = el == null ? void 0 : el.ownerDocument.defaultView) != null ? _a : window;
219
- }
220
- function getNodeName(node) {
221
- return isWindow(node) ? "" : node ? node.localName || "" : "";
222
- }
223
- function getParent(el) {
224
- const doc = getOwnerDocument(el);
225
- if (getNodeName(el) === "html")
226
- return el;
227
- return el.assignedSlot || el.parentElement || doc.documentElement;
228
- }
229
- function isHTMLElement(v) {
230
- return typeof v === "object" && (v == null ? void 0 : v.nodeType) === Node.ELEMENT_NODE && typeof (v == null ? void 0 : v.nodeName) === "string";
231
- }
232
- function isWindow(value) {
233
- return (value == null ? void 0 : value.toString()) === "[object Window]";
234
- }
235
- var visuallyHiddenStyle = {
236
- border: "0",
237
- clip: "rect(0 0 0 0)",
238
- height: "1px",
239
- margin: "-1px",
240
- overflow: "hidden",
241
- padding: "0",
242
- position: "absolute",
243
- width: "1px",
244
- whiteSpace: "nowrap",
245
- wordWrap: "normal"
246
- };
247
- function itemById(v, id) {
248
- return v.find((node) => node.id === id);
249
- }
250
- function indexOfId(v, id) {
251
- const item = itemById(v, id);
252
- return item ? v.indexOf(item) : -1;
253
- }
254
- var getValueText = (item) => {
255
- var _a, _b;
256
- return (_b = (_a = item.dataset.valuetext) != null ? _a : item.textContent) != null ? _b : "";
257
- };
258
- var match = (valueText, query2) => valueText.toLowerCase().startsWith(query2.toLowerCase());
259
- var wrap = (v, idx) => {
260
- return v.map((_, index) => v[(Math.max(idx, 0) + index) % v.length]);
261
- };
262
- function findByText(v, text, currentId) {
263
- const index = currentId ? indexOfId(v, currentId) : -1;
264
- let items = currentId ? wrap(v, index) : v;
265
- const isSingleKey = text.length === 1;
266
- if (isSingleKey) {
267
- items = items.filter((item) => item.id !== currentId);
268
- }
269
- return items.find((item) => match(getValueText(item), text));
215
+ function raf(fn) {
216
+ const id = globalThis.requestAnimationFrame(fn);
217
+ return function cleanup() {
218
+ globalThis.cancelAnimationFrame(id);
219
+ };
270
220
  }
271
221
  function addPointerlockChangeListener(doc, fn) {
272
222
  return addDomEvent(doc, "pointerlockchange", fn, false);
273
223
  }
274
224
  function isScrollParent(el) {
275
- const { overflow, overflowX, overflowY } = getComputedStyle2(el);
225
+ const { overflow, overflowX, overflowY } = getComputedStyle(el);
276
226
  return /auto|scroll|overlay|hidden/.test(overflow + overflowY + overflowX);
277
227
  }
278
228
  function getScrollParent(el) {
279
229
  if (["html", "body", "#document"].includes(getNodeName(el))) {
280
- return getOwnerDocument(el).body;
230
+ return getDocument(el).body;
281
231
  }
282
232
  if (isHTMLElement(el) && isScrollParent(el)) {
283
233
  return el;
@@ -286,70 +236,32 @@ function getScrollParent(el) {
286
236
  }
287
237
  function getScrollParents(el, list = []) {
288
238
  const scrollParent = getScrollParent(el);
289
- const isBody = scrollParent === getOwnerDocument(el).body;
290
- const win = getOwnerWindow(scrollParent);
239
+ const isBody = scrollParent === getDocument(el).body;
240
+ const win = getWindow(scrollParent);
291
241
  const target = isBody ? [win].concat(win.visualViewport || [], isScrollParent(scrollParent) ? scrollParent : []) : scrollParent;
292
242
  const parents = list.concat(target);
293
243
  if (isBody)
294
244
  return parents;
295
245
  return parents.concat(getScrollParents(getParent(target)));
296
246
  }
297
- function findByTypeahead(_items, options) {
298
- const { state: state2, activeId, key, timeout = 350 } = options;
299
- const search = state2.keysSoFar + key;
300
- const isRepeated = search.length > 1 && Array.from(search).every((char) => char === search[0]);
301
- const query2 = isRepeated ? search[0] : search;
302
- let items = _items.slice();
303
- const next = findByText(items, query2, activeId);
304
- function cleanup() {
305
- clearTimeout(state2.timer);
306
- state2.timer = -1;
307
- }
308
- function update(value) {
309
- state2.keysSoFar = value;
310
- cleanup();
311
- if (value !== "") {
312
- state2.timer = +setTimeout(() => {
313
- update("");
314
- cleanup();
315
- }, timeout);
316
- }
317
- }
318
- update(search);
319
- return next;
320
- }
321
- findByTypeahead.defaultOptions = {
322
- keysSoFar: "",
323
- timer: -1
247
+ var visuallyHiddenStyle = {
248
+ border: "0",
249
+ clip: "rect(0 0 0 0)",
250
+ height: "1px",
251
+ margin: "-1px",
252
+ overflow: "hidden",
253
+ padding: "0",
254
+ position: "absolute",
255
+ width: "1px",
256
+ whiteSpace: "nowrap",
257
+ wordWrap: "normal"
324
258
  };
325
259
 
326
260
  // src/tooltip.connect.ts
327
261
  var import_popper = require("@zag-js/popper");
328
262
 
329
- // ../../types/dist/index.mjs
330
- function createNormalizer(fn) {
331
- return new Proxy({}, {
332
- get() {
333
- return fn;
334
- }
335
- });
336
- }
337
- var normalizeProp = createNormalizer((v) => v);
338
-
339
263
  // src/tooltip.dom.ts
340
- var dom = {
341
- getDoc: (ctx) => {
342
- var _a;
343
- return (_a = ctx.doc) != null ? _a : document;
344
- },
345
- getWin: (ctx) => {
346
- var _a, _b;
347
- return (_b = (_a = ctx.doc) == null ? void 0 : _a.defaultView) != null ? _b : window;
348
- },
349
- getRootNode: (ctx) => {
350
- var _a;
351
- return (_a = ctx.rootNode) != null ? _a : dom.getDoc(ctx);
352
- },
264
+ var dom = defineDomHelpers({
353
265
  getTriggerId: (ctx) => {
354
266
  var _a, _b;
355
267
  return (_b = (_a = ctx.ids) == null ? void 0 : _a.trigger) != null ? _b : `tooltip:${ctx.id}:trigger`;
@@ -361,10 +273,10 @@ var dom = {
361
273
  getArrowId: (ctx) => `tooltip:${ctx.id}:arrow`,
362
274
  getPositionerId: (ctx) => `tooltip:${ctx.id}:popper`,
363
275
  portalId: "tooltip-portal",
364
- getTriggerEl: (ctx) => dom.getRootNode(ctx).getElementById(dom.getTriggerId(ctx)),
365
- getContentEl: (ctx) => dom.getRootNode(ctx).getElementById(dom.getContentId(ctx)),
366
- getPositionerEl: (ctx) => dom.getRootNode(ctx).getElementById(dom.getPositionerId(ctx)),
367
- getArrowEl: (ctx) => dom.getRootNode(ctx).getElementById(dom.getArrowId(ctx)),
276
+ getTriggerEl: (ctx) => dom.getById(ctx, dom.getTriggerId(ctx)),
277
+ getContentEl: (ctx) => dom.getById(ctx, dom.getContentId(ctx)),
278
+ getPositionerEl: (ctx) => dom.getById(ctx, dom.getPositionerId(ctx)),
279
+ getArrowEl: (ctx) => dom.getById(ctx, dom.getArrowId(ctx)),
368
280
  getScrollParent: (ctx) => getScrollParent(dom.getTriggerEl(ctx)),
369
281
  getPortalEl: (ctx) => dom.getDoc(ctx).getElementById(dom.portalId),
370
282
  createPortalEl: (ctx) => {
@@ -372,7 +284,7 @@ var dom = {
372
284
  portal.id = dom.portalId;
373
285
  return portal;
374
286
  }
375
- };
287
+ });
376
288
 
377
289
  // src/tooltip.store.ts
378
290
  var import_core = require("@zag-js/core");
@@ -386,7 +298,7 @@ var store = (0, import_core.proxy)({
386
298
  });
387
299
 
388
300
  // src/tooltip.connect.ts
389
- function connect(state, send, normalize = normalizeProp) {
301
+ function connect(state, send, normalize) {
390
302
  const id = state.context.id;
391
303
  const hasAriaLabel = state.context.hasAriaLabel;
392
304
  const isOpen = state.hasTag("open");
@@ -492,29 +404,11 @@ function connect(state, send, normalize = normalizeProp) {
492
404
  // src/tooltip.machine.ts
493
405
  var import_core2 = require("@zag-js/core");
494
406
  var import_popper2 = require("@zag-js/popper");
495
-
496
- // ../../utilities/core/dist/index.mjs
497
- var isDom2 = () => typeof window !== "undefined";
498
- function getPlatform() {
499
- var _a;
500
- const agent = navigator.userAgentData;
501
- return (_a = agent == null ? void 0 : agent.platform) != null ? _a : navigator.platform;
502
- }
503
- var pt = (v) => isDom2() && v.test(getPlatform());
504
- var vn = (v) => isDom2() && v.test(navigator.vendor);
505
- var isTouchDevice2 = isDom2() && !!navigator.maxTouchPoints;
506
- var isSafari = () => isApple() && vn(/apple/i);
507
- var isApple = () => pt(/mac|iphone|ipad|ipod/i);
508
- var noop2 = () => {
509
- };
510
-
511
- // src/tooltip.machine.ts
512
- function machine(ctx = {}) {
407
+ function machine(ctx) {
513
408
  return (0, import_core2.createMachine)({
514
409
  id: "tooltip",
515
410
  initial: "unknown",
516
411
  context: __spreadProps(__spreadValues({
517
- id: "",
518
412
  openDelay: 1e3,
519
413
  closeDelay: 500,
520
414
  closeOnPointerDown: true,
@@ -536,10 +430,7 @@ function machine(ctx = {}) {
536
430
  states: {
537
431
  unknown: {
538
432
  on: {
539
- SETUP: {
540
- target: "closed",
541
- actions: "setupDocument"
542
- }
433
+ SETUP: "closed"
543
434
  }
544
435
  },
545
436
  closed: {
@@ -667,7 +558,7 @@ function machine(ctx = {}) {
667
558
  },
668
559
  trackDisabledTriggerOnSafari(ctx2, _evt, { send }) {
669
560
  if (!isSafari())
670
- return noop2;
561
+ return;
671
562
  const doc = dom.getDoc(ctx2);
672
563
  return addPointerEvent(doc, "pointermove", (event) => {
673
564
  const selector = "[data-part=trigger][data-expanded]";
@@ -730,4 +621,3 @@ function machine(ctx = {}) {
730
621
  }
731
622
  });
732
623
  }
733
- //# sourceMappingURL=index.js.map