@zag-js/tooltip 0.0.0-dev-20230221113221 → 0.0.0-dev-20230222120620
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/chunk-3LXHM7BW.mjs +17 -0
- package/dist/{chunk-YCQQKYLH.mjs → chunk-463EFHFN.mjs} +8 -124
- package/dist/{chunk-VTDFWXSY.mjs → chunk-SCZY7ISD.mjs} +3 -20
- package/dist/index.js +20 -241
- package/dist/index.mjs +3 -3
- package/dist/tooltip.connect.js +7 -105
- package/dist/tooltip.connect.mjs +2 -2
- package/dist/tooltip.dom.d.ts +2 -2
- package/dist/tooltip.dom.js +3 -84
- package/dist/tooltip.dom.mjs +1 -1
- package/dist/tooltip.machine.js +16 -222
- package/dist/tooltip.machine.mjs +2 -2
- package/package.json +8 -6
- package/dist/chunk-DYQY5P2O.mjs +0 -111
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
// src/tooltip.dom.ts
|
|
2
|
+
import { createScope, getScrollParent } from "@zag-js/dom-query";
|
|
3
|
+
var dom = createScope({
|
|
4
|
+
getTriggerId: (ctx) => ctx.ids?.trigger ?? `tooltip:${ctx.id}:trigger`,
|
|
5
|
+
getContentId: (ctx) => ctx.ids?.content ?? `tooltip:${ctx.id}:content`,
|
|
6
|
+
getArrowId: (ctx) => `tooltip:${ctx.id}:arrow`,
|
|
7
|
+
getPositionerId: (ctx) => `tooltip:${ctx.id}:popper`,
|
|
8
|
+
getTriggerEl: (ctx) => dom.getById(ctx, dom.getTriggerId(ctx)),
|
|
9
|
+
getContentEl: (ctx) => dom.getById(ctx, dom.getContentId(ctx)),
|
|
10
|
+
getPositionerEl: (ctx) => dom.getById(ctx, dom.getPositionerId(ctx)),
|
|
11
|
+
getArrowEl: (ctx) => dom.getById(ctx, dom.getArrowId(ctx)),
|
|
12
|
+
getScrollParent: (ctx) => getScrollParent(dom.getTriggerEl(ctx))
|
|
13
|
+
});
|
|
14
|
+
|
|
15
|
+
export {
|
|
16
|
+
dom
|
|
17
|
+
};
|
|
@@ -1,131 +1,16 @@
|
|
|
1
1
|
import {
|
|
2
|
-
dom
|
|
3
|
-
|
|
4
|
-
isHTMLElement
|
|
5
|
-
} from "./chunk-DYQY5P2O.mjs";
|
|
2
|
+
dom
|
|
3
|
+
} from "./chunk-3LXHM7BW.mjs";
|
|
6
4
|
import {
|
|
7
5
|
store
|
|
8
6
|
} from "./chunk-GQYNO326.mjs";
|
|
9
7
|
|
|
10
8
|
// src/tooltip.machine.ts
|
|
11
9
|
import { createMachine, subscribe } from "@zag-js/core";
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
var runIfFn = (v, ...a) => {
|
|
15
|
-
const res = typeof v === "function" ? v(...a) : v;
|
|
16
|
-
return res ?? void 0;
|
|
17
|
-
};
|
|
18
|
-
|
|
19
|
-
// ../../utilities/core/src/guard.ts
|
|
20
|
-
var isArray = (v) => Array.isArray(v);
|
|
21
|
-
var isObject = (v) => !(v == null || typeof v !== "object" || isArray(v));
|
|
22
|
-
var hasProp = (obj, prop) => Object.prototype.hasOwnProperty.call(obj, prop);
|
|
23
|
-
|
|
24
|
-
// ../../utilities/core/src/object.ts
|
|
25
|
-
function compact(obj) {
|
|
26
|
-
if (obj === void 0)
|
|
27
|
-
return obj;
|
|
28
|
-
return Object.fromEntries(
|
|
29
|
-
Object.entries(obj).filter(([, value]) => value !== void 0).map(([key, value]) => [key, isObject(value) ? compact(value) : value])
|
|
30
|
-
);
|
|
31
|
-
}
|
|
32
|
-
|
|
33
|
-
// ../../utilities/dom/src/platform.ts
|
|
34
|
-
var isDom = () => typeof window !== "undefined";
|
|
35
|
-
function getPlatform() {
|
|
36
|
-
const agent = navigator.userAgentData;
|
|
37
|
-
return agent?.platform ?? navigator.platform;
|
|
38
|
-
}
|
|
39
|
-
var pt = (v) => isDom() && v.test(getPlatform());
|
|
40
|
-
var vn = (v) => isDom() && v.test(navigator.vendor);
|
|
41
|
-
var isSafari = () => isApple() && vn(/apple/i);
|
|
42
|
-
var isApple = () => pt(/mac|iphone|ipad|ipod/i);
|
|
43
|
-
|
|
44
|
-
// ../../utilities/dom/src/event.ts
|
|
45
|
-
var supportsPointerEvent = () => isDom() && window.onpointerdown === null;
|
|
46
|
-
var supportsTouchEvent = () => isDom() && window.ontouchstart === null;
|
|
47
|
-
var supportsMouseEvent = () => isDom() && window.onmousedown === null;
|
|
48
|
-
var isTouchEvent = (v) => isObject(v) && hasProp(v, "touches");
|
|
49
|
-
|
|
50
|
-
// ../../utilities/dom/src/listener.ts
|
|
51
|
-
var isRef = (v) => hasProp(v, "current");
|
|
52
|
-
var fallback = { pageX: 0, pageY: 0, clientX: 0, clientY: 0 };
|
|
53
|
-
function extractInfo(event, type = "page") {
|
|
54
|
-
const point = isTouchEvent(event) ? event.touches[0] || event.changedTouches[0] || fallback : event;
|
|
55
|
-
return {
|
|
56
|
-
point: {
|
|
57
|
-
x: point[`${type}X`],
|
|
58
|
-
y: point[`${type}Y`]
|
|
59
|
-
}
|
|
60
|
-
};
|
|
61
|
-
}
|
|
62
|
-
function addDomEvent(target, eventName, handler, options) {
|
|
63
|
-
const node = isRef(target) ? target.current : runIfFn(target);
|
|
64
|
-
node?.addEventListener(eventName, handler, options);
|
|
65
|
-
return () => {
|
|
66
|
-
node?.removeEventListener(eventName, handler, options);
|
|
67
|
-
};
|
|
68
|
-
}
|
|
69
|
-
function addPointerEvent(target, event, listener, options) {
|
|
70
|
-
const type = getEventName(event) ?? event;
|
|
71
|
-
return addDomEvent(target, type, wrapHandler(listener, event === "pointerdown"), options);
|
|
72
|
-
}
|
|
73
|
-
function wrapHandler(fn, filter = false) {
|
|
74
|
-
const listener = (event) => {
|
|
75
|
-
fn(event, extractInfo(event));
|
|
76
|
-
};
|
|
77
|
-
return filter ? filterPrimaryPointer(listener) : listener;
|
|
78
|
-
}
|
|
79
|
-
function filterPrimaryPointer(fn) {
|
|
80
|
-
return (event) => {
|
|
81
|
-
const win = event.view ?? window;
|
|
82
|
-
const isMouseEvent = event instanceof win.MouseEvent;
|
|
83
|
-
const isPrimary = !isMouseEvent || isMouseEvent && event.button === 0;
|
|
84
|
-
if (isPrimary)
|
|
85
|
-
fn(event);
|
|
86
|
-
};
|
|
87
|
-
}
|
|
88
|
-
var mouseEventNames = {
|
|
89
|
-
pointerdown: "mousedown",
|
|
90
|
-
pointermove: "mousemove",
|
|
91
|
-
pointerup: "mouseup",
|
|
92
|
-
pointercancel: "mousecancel",
|
|
93
|
-
pointerover: "mouseover",
|
|
94
|
-
pointerout: "mouseout",
|
|
95
|
-
pointerenter: "mouseenter",
|
|
96
|
-
pointerleave: "mouseleave"
|
|
97
|
-
};
|
|
98
|
-
var touchEventNames = {
|
|
99
|
-
pointerdown: "touchstart",
|
|
100
|
-
pointermove: "touchmove",
|
|
101
|
-
pointerup: "touchend",
|
|
102
|
-
pointercancel: "touchcancel"
|
|
103
|
-
};
|
|
104
|
-
function getEventName(evt) {
|
|
105
|
-
if (supportsPointerEvent())
|
|
106
|
-
return evt;
|
|
107
|
-
if (supportsTouchEvent())
|
|
108
|
-
return touchEventNames[evt];
|
|
109
|
-
if (supportsMouseEvent())
|
|
110
|
-
return mouseEventNames[evt];
|
|
111
|
-
return evt;
|
|
112
|
-
}
|
|
113
|
-
|
|
114
|
-
// ../../utilities/dom/src/next-tick.ts
|
|
115
|
-
function raf(fn) {
|
|
116
|
-
const id = globalThis.requestAnimationFrame(fn);
|
|
117
|
-
return function cleanup() {
|
|
118
|
-
globalThis.cancelAnimationFrame(id);
|
|
119
|
-
};
|
|
120
|
-
}
|
|
121
|
-
|
|
122
|
-
// ../../utilities/dom/src/pointerlock.ts
|
|
123
|
-
function addPointerlockChangeListener(doc, fn) {
|
|
124
|
-
return addDomEvent(doc, "pointerlockchange", fn, false);
|
|
125
|
-
}
|
|
126
|
-
|
|
127
|
-
// src/tooltip.machine.ts
|
|
10
|
+
import { addDomEvent } from "@zag-js/dom-event";
|
|
11
|
+
import { getScrollParents, isHTMLElement, isSafari, raf } from "@zag-js/dom-query";
|
|
128
12
|
import { getPlacement } from "@zag-js/popper";
|
|
13
|
+
import { compact } from "@zag-js/utils";
|
|
129
14
|
function machine(userContext) {
|
|
130
15
|
const ctx = compact(userContext);
|
|
131
16
|
return createMachine(
|
|
@@ -258,9 +143,8 @@ function machine(userContext) {
|
|
|
258
143
|
return cleanup;
|
|
259
144
|
},
|
|
260
145
|
trackPointerlockChange(ctx2, _evt, { send }) {
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
});
|
|
146
|
+
const onChange = () => send("POINTER_LOCK_CHANGE");
|
|
147
|
+
return addDomEvent(dom.getDoc(ctx2), "pointerlockchange", onChange, false);
|
|
264
148
|
},
|
|
265
149
|
trackScroll(ctx2, _evt, { send }) {
|
|
266
150
|
const trigger = dom.getTriggerEl(ctx2);
|
|
@@ -285,7 +169,7 @@ function machine(userContext) {
|
|
|
285
169
|
if (!isSafari())
|
|
286
170
|
return;
|
|
287
171
|
const doc = dom.getDoc(ctx2);
|
|
288
|
-
return
|
|
172
|
+
return addDomEvent(doc, "pointermove", (event) => {
|
|
289
173
|
const selector = "[data-part=trigger][data-expanded]";
|
|
290
174
|
if (isHTMLElement(event.target) && event.target.closest(selector))
|
|
291
175
|
return;
|
|
@@ -3,32 +3,15 @@ import {
|
|
|
3
3
|
} from "./chunk-RRQRIZBA.mjs";
|
|
4
4
|
import {
|
|
5
5
|
dom
|
|
6
|
-
} from "./chunk-
|
|
6
|
+
} from "./chunk-3LXHM7BW.mjs";
|
|
7
7
|
import {
|
|
8
8
|
store
|
|
9
9
|
} from "./chunk-GQYNO326.mjs";
|
|
10
10
|
|
|
11
|
-
// ../../utilities/dom/src/attrs.ts
|
|
12
|
-
var dataAttr = (guard) => {
|
|
13
|
-
return guard ? "" : void 0;
|
|
14
|
-
};
|
|
15
|
-
|
|
16
|
-
// ../../utilities/dom/src/visually-hidden.ts
|
|
17
|
-
var visuallyHiddenStyle = {
|
|
18
|
-
border: "0",
|
|
19
|
-
clip: "rect(0 0 0 0)",
|
|
20
|
-
height: "1px",
|
|
21
|
-
margin: "-1px",
|
|
22
|
-
overflow: "hidden",
|
|
23
|
-
padding: "0",
|
|
24
|
-
position: "absolute",
|
|
25
|
-
width: "1px",
|
|
26
|
-
whiteSpace: "nowrap",
|
|
27
|
-
wordWrap: "normal"
|
|
28
|
-
};
|
|
29
|
-
|
|
30
11
|
// src/tooltip.connect.ts
|
|
12
|
+
import { dataAttr } from "@zag-js/dom-query";
|
|
31
13
|
import { getPlacementStyles } from "@zag-js/popper";
|
|
14
|
+
import { visuallyHiddenStyle } from "@zag-js/visually-hidden";
|
|
32
15
|
function connect(state, send, normalize) {
|
|
33
16
|
const id = state.context.id;
|
|
34
17
|
const hasAriaLabel = state.context.hasAriaLabel;
|
package/dist/index.js
CHANGED
|
@@ -31,237 +31,14 @@ var import_anatomy = require("@zag-js/anatomy");
|
|
|
31
31
|
var anatomy = (0, import_anatomy.createAnatomy)("tooltip").parts("trigger", "arrow", "arrowTip", "positioner", "content", "label");
|
|
32
32
|
var parts = anatomy.build();
|
|
33
33
|
|
|
34
|
-
// ../../utilities/dom/src/attrs.ts
|
|
35
|
-
var dataAttr = (guard) => {
|
|
36
|
-
return guard ? "" : void 0;
|
|
37
|
-
};
|
|
38
|
-
|
|
39
|
-
// ../../utilities/dom/src/get-computed-style.ts
|
|
40
|
-
function getCache() {
|
|
41
|
-
const g = globalThis;
|
|
42
|
-
g.__styleCache = g.__styleCache || /* @__PURE__ */ new WeakMap();
|
|
43
|
-
return g.__styleCache;
|
|
44
|
-
}
|
|
45
|
-
function getComputedStyle(el) {
|
|
46
|
-
if (!el)
|
|
47
|
-
return {};
|
|
48
|
-
const cache = getCache();
|
|
49
|
-
let style = cache.get(el);
|
|
50
|
-
if (!style) {
|
|
51
|
-
const win = el?.ownerDocument.defaultView ?? window;
|
|
52
|
-
style = win.getComputedStyle(el);
|
|
53
|
-
cache.set(el, style);
|
|
54
|
-
}
|
|
55
|
-
return style;
|
|
56
|
-
}
|
|
57
|
-
|
|
58
|
-
// ../../utilities/core/src/functions.ts
|
|
59
|
-
var runIfFn = (v, ...a) => {
|
|
60
|
-
const res = typeof v === "function" ? v(...a) : v;
|
|
61
|
-
return res ?? void 0;
|
|
62
|
-
};
|
|
63
|
-
|
|
64
|
-
// ../../utilities/core/src/guard.ts
|
|
65
|
-
var isArray = (v) => Array.isArray(v);
|
|
66
|
-
var isObject = (v) => !(v == null || typeof v !== "object" || isArray(v));
|
|
67
|
-
var hasProp = (obj, prop) => Object.prototype.hasOwnProperty.call(obj, prop);
|
|
68
|
-
|
|
69
|
-
// ../../utilities/core/src/object.ts
|
|
70
|
-
function compact(obj) {
|
|
71
|
-
if (obj === void 0)
|
|
72
|
-
return obj;
|
|
73
|
-
return Object.fromEntries(
|
|
74
|
-
Object.entries(obj).filter(([, value]) => value !== void 0).map(([key, value]) => [key, isObject(value) ? compact(value) : value])
|
|
75
|
-
);
|
|
76
|
-
}
|
|
77
|
-
|
|
78
|
-
// ../../utilities/dom/src/platform.ts
|
|
79
|
-
var isDom = () => typeof window !== "undefined";
|
|
80
|
-
function getPlatform() {
|
|
81
|
-
const agent = navigator.userAgentData;
|
|
82
|
-
return agent?.platform ?? navigator.platform;
|
|
83
|
-
}
|
|
84
|
-
var pt = (v) => isDom() && v.test(getPlatform());
|
|
85
|
-
var vn = (v) => isDom() && v.test(navigator.vendor);
|
|
86
|
-
var isSafari = () => isApple() && vn(/apple/i);
|
|
87
|
-
var isApple = () => pt(/mac|iphone|ipad|ipod/i);
|
|
88
|
-
|
|
89
|
-
// ../../utilities/dom/src/query.ts
|
|
90
|
-
function isDocument(el) {
|
|
91
|
-
return el.nodeType === Node.DOCUMENT_NODE;
|
|
92
|
-
}
|
|
93
|
-
function isWindow(value) {
|
|
94
|
-
return value?.toString() === "[object Window]";
|
|
95
|
-
}
|
|
96
|
-
function getDocument(el) {
|
|
97
|
-
if (isWindow(el))
|
|
98
|
-
return el.document;
|
|
99
|
-
if (isDocument(el))
|
|
100
|
-
return el;
|
|
101
|
-
return el?.ownerDocument ?? document;
|
|
102
|
-
}
|
|
103
|
-
function getWindow(el) {
|
|
104
|
-
return el?.ownerDocument.defaultView ?? window;
|
|
105
|
-
}
|
|
106
|
-
function getNodeName(node) {
|
|
107
|
-
return isWindow(node) ? "" : node?.localName ?? "";
|
|
108
|
-
}
|
|
109
|
-
function getParent(el) {
|
|
110
|
-
const doc = getDocument(el);
|
|
111
|
-
if (getNodeName(el) === "html")
|
|
112
|
-
return el;
|
|
113
|
-
return el.assignedSlot || el.parentElement || doc.documentElement;
|
|
114
|
-
}
|
|
115
|
-
function defineDomHelpers(helpers) {
|
|
116
|
-
const dom2 = {
|
|
117
|
-
getRootNode: (ctx) => ctx.getRootNode?.() ?? document,
|
|
118
|
-
getDoc: (ctx) => getDocument(dom2.getRootNode(ctx)),
|
|
119
|
-
getWin: (ctx) => dom2.getDoc(ctx).defaultView ?? window,
|
|
120
|
-
getActiveElement: (ctx) => dom2.getDoc(ctx).activeElement,
|
|
121
|
-
getById: (ctx, id) => dom2.getRootNode(ctx).getElementById(id),
|
|
122
|
-
queryById: (ctx, id) => {
|
|
123
|
-
const el = dom2.getById(ctx, id);
|
|
124
|
-
if (!el)
|
|
125
|
-
throw new Error(`Element with id "${id}" not found.`);
|
|
126
|
-
return el;
|
|
127
|
-
}
|
|
128
|
-
};
|
|
129
|
-
return {
|
|
130
|
-
...dom2,
|
|
131
|
-
...helpers
|
|
132
|
-
};
|
|
133
|
-
}
|
|
134
|
-
function isHTMLElement(v) {
|
|
135
|
-
return typeof v === "object" && v?.nodeType === Node.ELEMENT_NODE && typeof v?.nodeName === "string";
|
|
136
|
-
}
|
|
137
|
-
|
|
138
|
-
// ../../utilities/dom/src/event.ts
|
|
139
|
-
var supportsPointerEvent = () => isDom() && window.onpointerdown === null;
|
|
140
|
-
var supportsTouchEvent = () => isDom() && window.ontouchstart === null;
|
|
141
|
-
var supportsMouseEvent = () => isDom() && window.onmousedown === null;
|
|
142
|
-
var isTouchEvent = (v) => isObject(v) && hasProp(v, "touches");
|
|
143
|
-
|
|
144
|
-
// ../../utilities/dom/src/listener.ts
|
|
145
|
-
var isRef = (v) => hasProp(v, "current");
|
|
146
|
-
var fallback = { pageX: 0, pageY: 0, clientX: 0, clientY: 0 };
|
|
147
|
-
function extractInfo(event, type = "page") {
|
|
148
|
-
const point = isTouchEvent(event) ? event.touches[0] || event.changedTouches[0] || fallback : event;
|
|
149
|
-
return {
|
|
150
|
-
point: {
|
|
151
|
-
x: point[`${type}X`],
|
|
152
|
-
y: point[`${type}Y`]
|
|
153
|
-
}
|
|
154
|
-
};
|
|
155
|
-
}
|
|
156
|
-
function addDomEvent(target, eventName, handler, options) {
|
|
157
|
-
const node = isRef(target) ? target.current : runIfFn(target);
|
|
158
|
-
node?.addEventListener(eventName, handler, options);
|
|
159
|
-
return () => {
|
|
160
|
-
node?.removeEventListener(eventName, handler, options);
|
|
161
|
-
};
|
|
162
|
-
}
|
|
163
|
-
function addPointerEvent(target, event, listener, options) {
|
|
164
|
-
const type = getEventName(event) ?? event;
|
|
165
|
-
return addDomEvent(target, type, wrapHandler(listener, event === "pointerdown"), options);
|
|
166
|
-
}
|
|
167
|
-
function wrapHandler(fn, filter = false) {
|
|
168
|
-
const listener = (event) => {
|
|
169
|
-
fn(event, extractInfo(event));
|
|
170
|
-
};
|
|
171
|
-
return filter ? filterPrimaryPointer(listener) : listener;
|
|
172
|
-
}
|
|
173
|
-
function filterPrimaryPointer(fn) {
|
|
174
|
-
return (event) => {
|
|
175
|
-
const win = event.view ?? window;
|
|
176
|
-
const isMouseEvent = event instanceof win.MouseEvent;
|
|
177
|
-
const isPrimary = !isMouseEvent || isMouseEvent && event.button === 0;
|
|
178
|
-
if (isPrimary)
|
|
179
|
-
fn(event);
|
|
180
|
-
};
|
|
181
|
-
}
|
|
182
|
-
var mouseEventNames = {
|
|
183
|
-
pointerdown: "mousedown",
|
|
184
|
-
pointermove: "mousemove",
|
|
185
|
-
pointerup: "mouseup",
|
|
186
|
-
pointercancel: "mousecancel",
|
|
187
|
-
pointerover: "mouseover",
|
|
188
|
-
pointerout: "mouseout",
|
|
189
|
-
pointerenter: "mouseenter",
|
|
190
|
-
pointerleave: "mouseleave"
|
|
191
|
-
};
|
|
192
|
-
var touchEventNames = {
|
|
193
|
-
pointerdown: "touchstart",
|
|
194
|
-
pointermove: "touchmove",
|
|
195
|
-
pointerup: "touchend",
|
|
196
|
-
pointercancel: "touchcancel"
|
|
197
|
-
};
|
|
198
|
-
function getEventName(evt) {
|
|
199
|
-
if (supportsPointerEvent())
|
|
200
|
-
return evt;
|
|
201
|
-
if (supportsTouchEvent())
|
|
202
|
-
return touchEventNames[evt];
|
|
203
|
-
if (supportsMouseEvent())
|
|
204
|
-
return mouseEventNames[evt];
|
|
205
|
-
return evt;
|
|
206
|
-
}
|
|
207
|
-
|
|
208
|
-
// ../../utilities/dom/src/next-tick.ts
|
|
209
|
-
function raf(fn) {
|
|
210
|
-
const id = globalThis.requestAnimationFrame(fn);
|
|
211
|
-
return function cleanup() {
|
|
212
|
-
globalThis.cancelAnimationFrame(id);
|
|
213
|
-
};
|
|
214
|
-
}
|
|
215
|
-
|
|
216
|
-
// ../../utilities/dom/src/pointerlock.ts
|
|
217
|
-
function addPointerlockChangeListener(doc, fn) {
|
|
218
|
-
return addDomEvent(doc, "pointerlockchange", fn, false);
|
|
219
|
-
}
|
|
220
|
-
|
|
221
|
-
// ../../utilities/dom/src/scrollable.ts
|
|
222
|
-
function isScrollParent(el) {
|
|
223
|
-
const { overflow, overflowX, overflowY } = getComputedStyle(el);
|
|
224
|
-
return /auto|scroll|overlay|hidden/.test(overflow + overflowY + overflowX);
|
|
225
|
-
}
|
|
226
|
-
function getScrollParent(el) {
|
|
227
|
-
if (["html", "body", "#document"].includes(getNodeName(el))) {
|
|
228
|
-
return getDocument(el).body;
|
|
229
|
-
}
|
|
230
|
-
if (isHTMLElement(el) && isScrollParent(el)) {
|
|
231
|
-
return el;
|
|
232
|
-
}
|
|
233
|
-
return getScrollParent(getParent(el));
|
|
234
|
-
}
|
|
235
|
-
function getScrollParents(el, list = []) {
|
|
236
|
-
const scrollParent = getScrollParent(el);
|
|
237
|
-
const isBody = scrollParent === getDocument(el).body;
|
|
238
|
-
const win = getWindow(scrollParent);
|
|
239
|
-
const target = isBody ? [win].concat(win.visualViewport || [], isScrollParent(scrollParent) ? scrollParent : []) : scrollParent;
|
|
240
|
-
const parents = list.concat(target);
|
|
241
|
-
if (isBody)
|
|
242
|
-
return parents;
|
|
243
|
-
return parents.concat(getScrollParents(getParent(target)));
|
|
244
|
-
}
|
|
245
|
-
|
|
246
|
-
// ../../utilities/dom/src/visually-hidden.ts
|
|
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"
|
|
258
|
-
};
|
|
259
|
-
|
|
260
34
|
// src/tooltip.connect.ts
|
|
35
|
+
var import_dom_query2 = require("@zag-js/dom-query");
|
|
261
36
|
var import_popper = require("@zag-js/popper");
|
|
37
|
+
var import_visually_hidden = require("@zag-js/visually-hidden");
|
|
262
38
|
|
|
263
39
|
// src/tooltip.dom.ts
|
|
264
|
-
var
|
|
40
|
+
var import_dom_query = require("@zag-js/dom-query");
|
|
41
|
+
var dom = (0, import_dom_query.createScope)({
|
|
265
42
|
getTriggerId: (ctx) => ctx.ids?.trigger ?? `tooltip:${ctx.id}:trigger`,
|
|
266
43
|
getContentId: (ctx) => ctx.ids?.content ?? `tooltip:${ctx.id}:content`,
|
|
267
44
|
getArrowId: (ctx) => `tooltip:${ctx.id}:arrow`,
|
|
@@ -270,7 +47,7 @@ var dom = defineDomHelpers({
|
|
|
270
47
|
getContentEl: (ctx) => dom.getById(ctx, dom.getContentId(ctx)),
|
|
271
48
|
getPositionerEl: (ctx) => dom.getById(ctx, dom.getPositionerId(ctx)),
|
|
272
49
|
getArrowEl: (ctx) => dom.getById(ctx, dom.getArrowId(ctx)),
|
|
273
|
-
getScrollParent: (ctx) => getScrollParent(dom.getTriggerEl(ctx))
|
|
50
|
+
getScrollParent: (ctx) => (0, import_dom_query.getScrollParent)(dom.getTriggerEl(ctx))
|
|
274
51
|
});
|
|
275
52
|
|
|
276
53
|
// src/tooltip.store.ts
|
|
@@ -313,7 +90,7 @@ function connect(state, send, normalize) {
|
|
|
313
90
|
triggerProps: normalize.button({
|
|
314
91
|
...parts.trigger.attrs,
|
|
315
92
|
id: triggerId,
|
|
316
|
-
"data-expanded": dataAttr(isOpen),
|
|
93
|
+
"data-expanded": (0, import_dom_query2.dataAttr)(isOpen),
|
|
317
94
|
"aria-describedby": isOpen ? contentId : void 0,
|
|
318
95
|
onClick() {
|
|
319
96
|
send("CLICK");
|
|
@@ -383,7 +160,7 @@ function connect(state, send, normalize) {
|
|
|
383
160
|
...parts.label.attrs,
|
|
384
161
|
id: contentId,
|
|
385
162
|
role: "tooltip",
|
|
386
|
-
style: visuallyHiddenStyle,
|
|
163
|
+
style: import_visually_hidden.visuallyHiddenStyle,
|
|
387
164
|
children: state.context["aria-label"]
|
|
388
165
|
})
|
|
389
166
|
};
|
|
@@ -391,9 +168,12 @@ function connect(state, send, normalize) {
|
|
|
391
168
|
|
|
392
169
|
// src/tooltip.machine.ts
|
|
393
170
|
var import_core2 = require("@zag-js/core");
|
|
171
|
+
var import_dom_event = require("@zag-js/dom-event");
|
|
172
|
+
var import_dom_query3 = require("@zag-js/dom-query");
|
|
394
173
|
var import_popper2 = require("@zag-js/popper");
|
|
174
|
+
var import_utils = require("@zag-js/utils");
|
|
395
175
|
function machine(userContext) {
|
|
396
|
-
const ctx = compact(userContext);
|
|
176
|
+
const ctx = (0, import_utils.compact)(userContext);
|
|
397
177
|
return (0, import_core2.createMachine)(
|
|
398
178
|
{
|
|
399
179
|
id: "tooltip",
|
|
@@ -508,7 +288,7 @@ function machine(userContext) {
|
|
|
508
288
|
computePlacement(ctx2) {
|
|
509
289
|
ctx2.currentPlacement = ctx2.positioning.placement;
|
|
510
290
|
let cleanup;
|
|
511
|
-
raf(() => {
|
|
291
|
+
(0, import_dom_query3.raf)(() => {
|
|
512
292
|
cleanup = (0, import_popper2.getPlacement)(dom.getTriggerEl(ctx2), dom.getPositionerEl(ctx2), {
|
|
513
293
|
...ctx2.positioning,
|
|
514
294
|
onComplete(data) {
|
|
@@ -524,17 +304,16 @@ function machine(userContext) {
|
|
|
524
304
|
return cleanup;
|
|
525
305
|
},
|
|
526
306
|
trackPointerlockChange(ctx2, _evt, { send }) {
|
|
527
|
-
|
|
528
|
-
|
|
529
|
-
});
|
|
307
|
+
const onChange = () => send("POINTER_LOCK_CHANGE");
|
|
308
|
+
return (0, import_dom_event.addDomEvent)(dom.getDoc(ctx2), "pointerlockchange", onChange, false);
|
|
530
309
|
},
|
|
531
310
|
trackScroll(ctx2, _evt, { send }) {
|
|
532
311
|
const trigger = dom.getTriggerEl(ctx2);
|
|
533
312
|
if (!trigger)
|
|
534
313
|
return;
|
|
535
|
-
const cleanups = getScrollParents(trigger).map((el) => {
|
|
314
|
+
const cleanups = (0, import_dom_query3.getScrollParents)(trigger).map((el) => {
|
|
536
315
|
const opts = { passive: true, capture: true };
|
|
537
|
-
return addDomEvent(el, "scroll", () => send("SCROLL"), opts);
|
|
316
|
+
return (0, import_dom_event.addDomEvent)(el, "scroll", () => send("SCROLL"), opts);
|
|
538
317
|
});
|
|
539
318
|
return () => {
|
|
540
319
|
cleanups.forEach((fn) => fn?.());
|
|
@@ -548,12 +327,12 @@ function machine(userContext) {
|
|
|
548
327
|
});
|
|
549
328
|
},
|
|
550
329
|
trackDisabledTriggerOnSafari(ctx2, _evt, { send }) {
|
|
551
|
-
if (!isSafari())
|
|
330
|
+
if (!(0, import_dom_query3.isSafari)())
|
|
552
331
|
return;
|
|
553
332
|
const doc = dom.getDoc(ctx2);
|
|
554
|
-
return
|
|
333
|
+
return (0, import_dom_event.addDomEvent)(doc, "pointermove", (event) => {
|
|
555
334
|
const selector = "[data-part=trigger][data-expanded]";
|
|
556
|
-
if (isHTMLElement(event.target) && event.target.closest(selector))
|
|
335
|
+
if ((0, import_dom_query3.isHTMLElement)(event.target) && event.target.closest(selector))
|
|
557
336
|
return;
|
|
558
337
|
send("POINTER_LEAVE");
|
|
559
338
|
});
|
|
@@ -562,7 +341,7 @@ function machine(userContext) {
|
|
|
562
341
|
if (!ctx2.closeOnEsc)
|
|
563
342
|
return;
|
|
564
343
|
const doc = dom.getDoc(ctx2);
|
|
565
|
-
return addDomEvent(doc, "keydown", (event) => {
|
|
344
|
+
return (0, import_dom_event.addDomEvent)(doc, "keydown", (event) => {
|
|
566
345
|
if (event.key === "Escape") {
|
|
567
346
|
send("ESCAPE");
|
|
568
347
|
}
|
package/dist/index.mjs
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import {
|
|
2
2
|
connect
|
|
3
|
-
} from "./chunk-
|
|
3
|
+
} from "./chunk-SCZY7ISD.mjs";
|
|
4
4
|
import {
|
|
5
5
|
anatomy
|
|
6
6
|
} from "./chunk-RRQRIZBA.mjs";
|
|
7
7
|
import {
|
|
8
8
|
machine
|
|
9
|
-
} from "./chunk-
|
|
10
|
-
import "./chunk-
|
|
9
|
+
} from "./chunk-463EFHFN.mjs";
|
|
10
|
+
import "./chunk-3LXHM7BW.mjs";
|
|
11
11
|
import "./chunk-GQYNO326.mjs";
|
|
12
12
|
export {
|
|
13
13
|
anatomy,
|
package/dist/tooltip.connect.js
CHANGED
|
@@ -23,108 +23,9 @@ __export(tooltip_connect_exports, {
|
|
|
23
23
|
connect: () => connect
|
|
24
24
|
});
|
|
25
25
|
module.exports = __toCommonJS(tooltip_connect_exports);
|
|
26
|
-
|
|
27
|
-
// ../../utilities/dom/src/attrs.ts
|
|
28
|
-
var dataAttr = (guard) => {
|
|
29
|
-
return guard ? "" : void 0;
|
|
30
|
-
};
|
|
31
|
-
|
|
32
|
-
// ../../utilities/dom/src/get-computed-style.ts
|
|
33
|
-
function getCache() {
|
|
34
|
-
const g = globalThis;
|
|
35
|
-
g.__styleCache = g.__styleCache || /* @__PURE__ */ new WeakMap();
|
|
36
|
-
return g.__styleCache;
|
|
37
|
-
}
|
|
38
|
-
function getComputedStyle(el) {
|
|
39
|
-
if (!el)
|
|
40
|
-
return {};
|
|
41
|
-
const cache = getCache();
|
|
42
|
-
let style = cache.get(el);
|
|
43
|
-
if (!style) {
|
|
44
|
-
const win = el?.ownerDocument.defaultView ?? window;
|
|
45
|
-
style = win.getComputedStyle(el);
|
|
46
|
-
cache.set(el, style);
|
|
47
|
-
}
|
|
48
|
-
return style;
|
|
49
|
-
}
|
|
50
|
-
|
|
51
|
-
// ../../utilities/dom/src/query.ts
|
|
52
|
-
function isDocument(el) {
|
|
53
|
-
return el.nodeType === Node.DOCUMENT_NODE;
|
|
54
|
-
}
|
|
55
|
-
function isWindow(value) {
|
|
56
|
-
return value?.toString() === "[object Window]";
|
|
57
|
-
}
|
|
58
|
-
function getDocument(el) {
|
|
59
|
-
if (isWindow(el))
|
|
60
|
-
return el.document;
|
|
61
|
-
if (isDocument(el))
|
|
62
|
-
return el;
|
|
63
|
-
return el?.ownerDocument ?? document;
|
|
64
|
-
}
|
|
65
|
-
function getNodeName(node) {
|
|
66
|
-
return isWindow(node) ? "" : node?.localName ?? "";
|
|
67
|
-
}
|
|
68
|
-
function getParent(el) {
|
|
69
|
-
const doc = getDocument(el);
|
|
70
|
-
if (getNodeName(el) === "html")
|
|
71
|
-
return el;
|
|
72
|
-
return el.assignedSlot || el.parentElement || doc.documentElement;
|
|
73
|
-
}
|
|
74
|
-
function defineDomHelpers(helpers) {
|
|
75
|
-
const dom2 = {
|
|
76
|
-
getRootNode: (ctx) => ctx.getRootNode?.() ?? document,
|
|
77
|
-
getDoc: (ctx) => getDocument(dom2.getRootNode(ctx)),
|
|
78
|
-
getWin: (ctx) => dom2.getDoc(ctx).defaultView ?? window,
|
|
79
|
-
getActiveElement: (ctx) => dom2.getDoc(ctx).activeElement,
|
|
80
|
-
getById: (ctx, id) => dom2.getRootNode(ctx).getElementById(id),
|
|
81
|
-
queryById: (ctx, id) => {
|
|
82
|
-
const el = dom2.getById(ctx, id);
|
|
83
|
-
if (!el)
|
|
84
|
-
throw new Error(`Element with id "${id}" not found.`);
|
|
85
|
-
return el;
|
|
86
|
-
}
|
|
87
|
-
};
|
|
88
|
-
return {
|
|
89
|
-
...dom2,
|
|
90
|
-
...helpers
|
|
91
|
-
};
|
|
92
|
-
}
|
|
93
|
-
function isHTMLElement(v) {
|
|
94
|
-
return typeof v === "object" && v?.nodeType === Node.ELEMENT_NODE && typeof v?.nodeName === "string";
|
|
95
|
-
}
|
|
96
|
-
|
|
97
|
-
// ../../utilities/dom/src/scrollable.ts
|
|
98
|
-
function isScrollParent(el) {
|
|
99
|
-
const { overflow, overflowX, overflowY } = getComputedStyle(el);
|
|
100
|
-
return /auto|scroll|overlay|hidden/.test(overflow + overflowY + overflowX);
|
|
101
|
-
}
|
|
102
|
-
function getScrollParent(el) {
|
|
103
|
-
if (["html", "body", "#document"].includes(getNodeName(el))) {
|
|
104
|
-
return getDocument(el).body;
|
|
105
|
-
}
|
|
106
|
-
if (isHTMLElement(el) && isScrollParent(el)) {
|
|
107
|
-
return el;
|
|
108
|
-
}
|
|
109
|
-
return getScrollParent(getParent(el));
|
|
110
|
-
}
|
|
111
|
-
|
|
112
|
-
// ../../utilities/dom/src/visually-hidden.ts
|
|
113
|
-
var visuallyHiddenStyle = {
|
|
114
|
-
border: "0",
|
|
115
|
-
clip: "rect(0 0 0 0)",
|
|
116
|
-
height: "1px",
|
|
117
|
-
margin: "-1px",
|
|
118
|
-
overflow: "hidden",
|
|
119
|
-
padding: "0",
|
|
120
|
-
position: "absolute",
|
|
121
|
-
width: "1px",
|
|
122
|
-
whiteSpace: "nowrap",
|
|
123
|
-
wordWrap: "normal"
|
|
124
|
-
};
|
|
125
|
-
|
|
126
|
-
// src/tooltip.connect.ts
|
|
26
|
+
var import_dom_query2 = require("@zag-js/dom-query");
|
|
127
27
|
var import_popper = require("@zag-js/popper");
|
|
28
|
+
var import_visually_hidden = require("@zag-js/visually-hidden");
|
|
128
29
|
|
|
129
30
|
// src/tooltip.anatomy.ts
|
|
130
31
|
var import_anatomy = require("@zag-js/anatomy");
|
|
@@ -132,7 +33,8 @@ var anatomy = (0, import_anatomy.createAnatomy)("tooltip").parts("trigger", "arr
|
|
|
132
33
|
var parts = anatomy.build();
|
|
133
34
|
|
|
134
35
|
// src/tooltip.dom.ts
|
|
135
|
-
var
|
|
36
|
+
var import_dom_query = require("@zag-js/dom-query");
|
|
37
|
+
var dom = (0, import_dom_query.createScope)({
|
|
136
38
|
getTriggerId: (ctx) => ctx.ids?.trigger ?? `tooltip:${ctx.id}:trigger`,
|
|
137
39
|
getContentId: (ctx) => ctx.ids?.content ?? `tooltip:${ctx.id}:content`,
|
|
138
40
|
getArrowId: (ctx) => `tooltip:${ctx.id}:arrow`,
|
|
@@ -141,7 +43,7 @@ var dom = defineDomHelpers({
|
|
|
141
43
|
getContentEl: (ctx) => dom.getById(ctx, dom.getContentId(ctx)),
|
|
142
44
|
getPositionerEl: (ctx) => dom.getById(ctx, dom.getPositionerId(ctx)),
|
|
143
45
|
getArrowEl: (ctx) => dom.getById(ctx, dom.getArrowId(ctx)),
|
|
144
|
-
getScrollParent: (ctx) => getScrollParent(dom.getTriggerEl(ctx))
|
|
46
|
+
getScrollParent: (ctx) => (0, import_dom_query.getScrollParent)(dom.getTriggerEl(ctx))
|
|
145
47
|
});
|
|
146
48
|
|
|
147
49
|
// src/tooltip.store.ts
|
|
@@ -184,7 +86,7 @@ function connect(state, send, normalize) {
|
|
|
184
86
|
triggerProps: normalize.button({
|
|
185
87
|
...parts.trigger.attrs,
|
|
186
88
|
id: triggerId,
|
|
187
|
-
"data-expanded": dataAttr(isOpen),
|
|
89
|
+
"data-expanded": (0, import_dom_query2.dataAttr)(isOpen),
|
|
188
90
|
"aria-describedby": isOpen ? contentId : void 0,
|
|
189
91
|
onClick() {
|
|
190
92
|
send("CLICK");
|
|
@@ -254,7 +156,7 @@ function connect(state, send, normalize) {
|
|
|
254
156
|
...parts.label.attrs,
|
|
255
157
|
id: contentId,
|
|
256
158
|
role: "tooltip",
|
|
257
|
-
style: visuallyHiddenStyle,
|
|
159
|
+
style: import_visually_hidden.visuallyHiddenStyle,
|
|
258
160
|
children: state.context["aria-label"]
|
|
259
161
|
})
|
|
260
162
|
};
|
package/dist/tooltip.connect.mjs
CHANGED
package/dist/tooltip.dom.d.ts
CHANGED
|
@@ -16,10 +16,10 @@ declare const dom: {
|
|
|
16
16
|
getActiveElement: (ctx: {
|
|
17
17
|
getRootNode?: (() => Node | Document | ShadowRoot) | undefined;
|
|
18
18
|
}) => HTMLElement | null;
|
|
19
|
-
getById: <T = HTMLElement>(ctx: {
|
|
19
|
+
getById: <T extends HTMLElement = HTMLElement>(ctx: {
|
|
20
20
|
getRootNode?: (() => Node | Document | ShadowRoot) | undefined;
|
|
21
21
|
}, id: string) => T | null;
|
|
22
|
-
queryById: <T_1 = HTMLElement>(ctx: {
|
|
22
|
+
queryById: <T_1 extends HTMLElement = HTMLElement>(ctx: {
|
|
23
23
|
getRootNode?: (() => Node | Document | ShadowRoot) | undefined;
|
|
24
24
|
}, id: string) => T_1;
|
|
25
25
|
} & {
|
package/dist/tooltip.dom.js
CHANGED
|
@@ -23,89 +23,8 @@ __export(tooltip_dom_exports, {
|
|
|
23
23
|
dom: () => dom
|
|
24
24
|
});
|
|
25
25
|
module.exports = __toCommonJS(tooltip_dom_exports);
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
function getCache() {
|
|
29
|
-
const g = globalThis;
|
|
30
|
-
g.__styleCache = g.__styleCache || /* @__PURE__ */ new WeakMap();
|
|
31
|
-
return g.__styleCache;
|
|
32
|
-
}
|
|
33
|
-
function getComputedStyle(el) {
|
|
34
|
-
if (!el)
|
|
35
|
-
return {};
|
|
36
|
-
const cache = getCache();
|
|
37
|
-
let style = cache.get(el);
|
|
38
|
-
if (!style) {
|
|
39
|
-
const win = el?.ownerDocument.defaultView ?? window;
|
|
40
|
-
style = win.getComputedStyle(el);
|
|
41
|
-
cache.set(el, style);
|
|
42
|
-
}
|
|
43
|
-
return style;
|
|
44
|
-
}
|
|
45
|
-
|
|
46
|
-
// ../../utilities/dom/src/query.ts
|
|
47
|
-
function isDocument(el) {
|
|
48
|
-
return el.nodeType === Node.DOCUMENT_NODE;
|
|
49
|
-
}
|
|
50
|
-
function isWindow(value) {
|
|
51
|
-
return value?.toString() === "[object Window]";
|
|
52
|
-
}
|
|
53
|
-
function getDocument(el) {
|
|
54
|
-
if (isWindow(el))
|
|
55
|
-
return el.document;
|
|
56
|
-
if (isDocument(el))
|
|
57
|
-
return el;
|
|
58
|
-
return el?.ownerDocument ?? document;
|
|
59
|
-
}
|
|
60
|
-
function getNodeName(node) {
|
|
61
|
-
return isWindow(node) ? "" : node?.localName ?? "";
|
|
62
|
-
}
|
|
63
|
-
function getParent(el) {
|
|
64
|
-
const doc = getDocument(el);
|
|
65
|
-
if (getNodeName(el) === "html")
|
|
66
|
-
return el;
|
|
67
|
-
return el.assignedSlot || el.parentElement || doc.documentElement;
|
|
68
|
-
}
|
|
69
|
-
function defineDomHelpers(helpers) {
|
|
70
|
-
const dom2 = {
|
|
71
|
-
getRootNode: (ctx) => ctx.getRootNode?.() ?? document,
|
|
72
|
-
getDoc: (ctx) => getDocument(dom2.getRootNode(ctx)),
|
|
73
|
-
getWin: (ctx) => dom2.getDoc(ctx).defaultView ?? window,
|
|
74
|
-
getActiveElement: (ctx) => dom2.getDoc(ctx).activeElement,
|
|
75
|
-
getById: (ctx, id) => dom2.getRootNode(ctx).getElementById(id),
|
|
76
|
-
queryById: (ctx, id) => {
|
|
77
|
-
const el = dom2.getById(ctx, id);
|
|
78
|
-
if (!el)
|
|
79
|
-
throw new Error(`Element with id "${id}" not found.`);
|
|
80
|
-
return el;
|
|
81
|
-
}
|
|
82
|
-
};
|
|
83
|
-
return {
|
|
84
|
-
...dom2,
|
|
85
|
-
...helpers
|
|
86
|
-
};
|
|
87
|
-
}
|
|
88
|
-
function isHTMLElement(v) {
|
|
89
|
-
return typeof v === "object" && v?.nodeType === Node.ELEMENT_NODE && typeof v?.nodeName === "string";
|
|
90
|
-
}
|
|
91
|
-
|
|
92
|
-
// ../../utilities/dom/src/scrollable.ts
|
|
93
|
-
function isScrollParent(el) {
|
|
94
|
-
const { overflow, overflowX, overflowY } = getComputedStyle(el);
|
|
95
|
-
return /auto|scroll|overlay|hidden/.test(overflow + overflowY + overflowX);
|
|
96
|
-
}
|
|
97
|
-
function getScrollParent(el) {
|
|
98
|
-
if (["html", "body", "#document"].includes(getNodeName(el))) {
|
|
99
|
-
return getDocument(el).body;
|
|
100
|
-
}
|
|
101
|
-
if (isHTMLElement(el) && isScrollParent(el)) {
|
|
102
|
-
return el;
|
|
103
|
-
}
|
|
104
|
-
return getScrollParent(getParent(el));
|
|
105
|
-
}
|
|
106
|
-
|
|
107
|
-
// src/tooltip.dom.ts
|
|
108
|
-
var dom = defineDomHelpers({
|
|
26
|
+
var import_dom_query = require("@zag-js/dom-query");
|
|
27
|
+
var dom = (0, import_dom_query.createScope)({
|
|
109
28
|
getTriggerId: (ctx) => ctx.ids?.trigger ?? `tooltip:${ctx.id}:trigger`,
|
|
110
29
|
getContentId: (ctx) => ctx.ids?.content ?? `tooltip:${ctx.id}:content`,
|
|
111
30
|
getArrowId: (ctx) => `tooltip:${ctx.id}:arrow`,
|
|
@@ -114,7 +33,7 @@ var dom = defineDomHelpers({
|
|
|
114
33
|
getContentEl: (ctx) => dom.getById(ctx, dom.getContentId(ctx)),
|
|
115
34
|
getPositionerEl: (ctx) => dom.getById(ctx, dom.getPositionerId(ctx)),
|
|
116
35
|
getArrowEl: (ctx) => dom.getById(ctx, dom.getArrowId(ctx)),
|
|
117
|
-
getScrollParent: (ctx) => getScrollParent(dom.getTriggerEl(ctx))
|
|
36
|
+
getScrollParent: (ctx) => (0, import_dom_query.getScrollParent)(dom.getTriggerEl(ctx))
|
|
118
37
|
});
|
|
119
38
|
// Annotate the CommonJS export names for ESM import in node:
|
|
120
39
|
0 && (module.exports = {
|
package/dist/tooltip.dom.mjs
CHANGED
package/dist/tooltip.machine.js
CHANGED
|
@@ -24,219 +24,14 @@ __export(tooltip_machine_exports, {
|
|
|
24
24
|
});
|
|
25
25
|
module.exports = __toCommonJS(tooltip_machine_exports);
|
|
26
26
|
var import_core2 = require("@zag-js/core");
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
function getCache() {
|
|
30
|
-
const g = globalThis;
|
|
31
|
-
g.__styleCache = g.__styleCache || /* @__PURE__ */ new WeakMap();
|
|
32
|
-
return g.__styleCache;
|
|
33
|
-
}
|
|
34
|
-
function getComputedStyle(el) {
|
|
35
|
-
if (!el)
|
|
36
|
-
return {};
|
|
37
|
-
const cache = getCache();
|
|
38
|
-
let style = cache.get(el);
|
|
39
|
-
if (!style) {
|
|
40
|
-
const win = el?.ownerDocument.defaultView ?? window;
|
|
41
|
-
style = win.getComputedStyle(el);
|
|
42
|
-
cache.set(el, style);
|
|
43
|
-
}
|
|
44
|
-
return style;
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
// ../../utilities/core/src/functions.ts
|
|
48
|
-
var runIfFn = (v, ...a) => {
|
|
49
|
-
const res = typeof v === "function" ? v(...a) : v;
|
|
50
|
-
return res ?? void 0;
|
|
51
|
-
};
|
|
52
|
-
|
|
53
|
-
// ../../utilities/core/src/guard.ts
|
|
54
|
-
var isArray = (v) => Array.isArray(v);
|
|
55
|
-
var isObject = (v) => !(v == null || typeof v !== "object" || isArray(v));
|
|
56
|
-
var hasProp = (obj, prop) => Object.prototype.hasOwnProperty.call(obj, prop);
|
|
57
|
-
|
|
58
|
-
// ../../utilities/core/src/object.ts
|
|
59
|
-
function compact(obj) {
|
|
60
|
-
if (obj === void 0)
|
|
61
|
-
return obj;
|
|
62
|
-
return Object.fromEntries(
|
|
63
|
-
Object.entries(obj).filter(([, value]) => value !== void 0).map(([key, value]) => [key, isObject(value) ? compact(value) : value])
|
|
64
|
-
);
|
|
65
|
-
}
|
|
66
|
-
|
|
67
|
-
// ../../utilities/dom/src/platform.ts
|
|
68
|
-
var isDom = () => typeof window !== "undefined";
|
|
69
|
-
function getPlatform() {
|
|
70
|
-
const agent = navigator.userAgentData;
|
|
71
|
-
return agent?.platform ?? navigator.platform;
|
|
72
|
-
}
|
|
73
|
-
var pt = (v) => isDom() && v.test(getPlatform());
|
|
74
|
-
var vn = (v) => isDom() && v.test(navigator.vendor);
|
|
75
|
-
var isSafari = () => isApple() && vn(/apple/i);
|
|
76
|
-
var isApple = () => pt(/mac|iphone|ipad|ipod/i);
|
|
77
|
-
|
|
78
|
-
// ../../utilities/dom/src/query.ts
|
|
79
|
-
function isDocument(el) {
|
|
80
|
-
return el.nodeType === Node.DOCUMENT_NODE;
|
|
81
|
-
}
|
|
82
|
-
function isWindow(value) {
|
|
83
|
-
return value?.toString() === "[object Window]";
|
|
84
|
-
}
|
|
85
|
-
function getDocument(el) {
|
|
86
|
-
if (isWindow(el))
|
|
87
|
-
return el.document;
|
|
88
|
-
if (isDocument(el))
|
|
89
|
-
return el;
|
|
90
|
-
return el?.ownerDocument ?? document;
|
|
91
|
-
}
|
|
92
|
-
function getWindow(el) {
|
|
93
|
-
return el?.ownerDocument.defaultView ?? window;
|
|
94
|
-
}
|
|
95
|
-
function getNodeName(node) {
|
|
96
|
-
return isWindow(node) ? "" : node?.localName ?? "";
|
|
97
|
-
}
|
|
98
|
-
function getParent(el) {
|
|
99
|
-
const doc = getDocument(el);
|
|
100
|
-
if (getNodeName(el) === "html")
|
|
101
|
-
return el;
|
|
102
|
-
return el.assignedSlot || el.parentElement || doc.documentElement;
|
|
103
|
-
}
|
|
104
|
-
function defineDomHelpers(helpers) {
|
|
105
|
-
const dom2 = {
|
|
106
|
-
getRootNode: (ctx) => ctx.getRootNode?.() ?? document,
|
|
107
|
-
getDoc: (ctx) => getDocument(dom2.getRootNode(ctx)),
|
|
108
|
-
getWin: (ctx) => dom2.getDoc(ctx).defaultView ?? window,
|
|
109
|
-
getActiveElement: (ctx) => dom2.getDoc(ctx).activeElement,
|
|
110
|
-
getById: (ctx, id) => dom2.getRootNode(ctx).getElementById(id),
|
|
111
|
-
queryById: (ctx, id) => {
|
|
112
|
-
const el = dom2.getById(ctx, id);
|
|
113
|
-
if (!el)
|
|
114
|
-
throw new Error(`Element with id "${id}" not found.`);
|
|
115
|
-
return el;
|
|
116
|
-
}
|
|
117
|
-
};
|
|
118
|
-
return {
|
|
119
|
-
...dom2,
|
|
120
|
-
...helpers
|
|
121
|
-
};
|
|
122
|
-
}
|
|
123
|
-
function isHTMLElement(v) {
|
|
124
|
-
return typeof v === "object" && v?.nodeType === Node.ELEMENT_NODE && typeof v?.nodeName === "string";
|
|
125
|
-
}
|
|
126
|
-
|
|
127
|
-
// ../../utilities/dom/src/event.ts
|
|
128
|
-
var supportsPointerEvent = () => isDom() && window.onpointerdown === null;
|
|
129
|
-
var supportsTouchEvent = () => isDom() && window.ontouchstart === null;
|
|
130
|
-
var supportsMouseEvent = () => isDom() && window.onmousedown === null;
|
|
131
|
-
var isTouchEvent = (v) => isObject(v) && hasProp(v, "touches");
|
|
132
|
-
|
|
133
|
-
// ../../utilities/dom/src/listener.ts
|
|
134
|
-
var isRef = (v) => hasProp(v, "current");
|
|
135
|
-
var fallback = { pageX: 0, pageY: 0, clientX: 0, clientY: 0 };
|
|
136
|
-
function extractInfo(event, type = "page") {
|
|
137
|
-
const point = isTouchEvent(event) ? event.touches[0] || event.changedTouches[0] || fallback : event;
|
|
138
|
-
return {
|
|
139
|
-
point: {
|
|
140
|
-
x: point[`${type}X`],
|
|
141
|
-
y: point[`${type}Y`]
|
|
142
|
-
}
|
|
143
|
-
};
|
|
144
|
-
}
|
|
145
|
-
function addDomEvent(target, eventName, handler, options) {
|
|
146
|
-
const node = isRef(target) ? target.current : runIfFn(target);
|
|
147
|
-
node?.addEventListener(eventName, handler, options);
|
|
148
|
-
return () => {
|
|
149
|
-
node?.removeEventListener(eventName, handler, options);
|
|
150
|
-
};
|
|
151
|
-
}
|
|
152
|
-
function addPointerEvent(target, event, listener, options) {
|
|
153
|
-
const type = getEventName(event) ?? event;
|
|
154
|
-
return addDomEvent(target, type, wrapHandler(listener, event === "pointerdown"), options);
|
|
155
|
-
}
|
|
156
|
-
function wrapHandler(fn, filter = false) {
|
|
157
|
-
const listener = (event) => {
|
|
158
|
-
fn(event, extractInfo(event));
|
|
159
|
-
};
|
|
160
|
-
return filter ? filterPrimaryPointer(listener) : listener;
|
|
161
|
-
}
|
|
162
|
-
function filterPrimaryPointer(fn) {
|
|
163
|
-
return (event) => {
|
|
164
|
-
const win = event.view ?? window;
|
|
165
|
-
const isMouseEvent = event instanceof win.MouseEvent;
|
|
166
|
-
const isPrimary = !isMouseEvent || isMouseEvent && event.button === 0;
|
|
167
|
-
if (isPrimary)
|
|
168
|
-
fn(event);
|
|
169
|
-
};
|
|
170
|
-
}
|
|
171
|
-
var mouseEventNames = {
|
|
172
|
-
pointerdown: "mousedown",
|
|
173
|
-
pointermove: "mousemove",
|
|
174
|
-
pointerup: "mouseup",
|
|
175
|
-
pointercancel: "mousecancel",
|
|
176
|
-
pointerover: "mouseover",
|
|
177
|
-
pointerout: "mouseout",
|
|
178
|
-
pointerenter: "mouseenter",
|
|
179
|
-
pointerleave: "mouseleave"
|
|
180
|
-
};
|
|
181
|
-
var touchEventNames = {
|
|
182
|
-
pointerdown: "touchstart",
|
|
183
|
-
pointermove: "touchmove",
|
|
184
|
-
pointerup: "touchend",
|
|
185
|
-
pointercancel: "touchcancel"
|
|
186
|
-
};
|
|
187
|
-
function getEventName(evt) {
|
|
188
|
-
if (supportsPointerEvent())
|
|
189
|
-
return evt;
|
|
190
|
-
if (supportsTouchEvent())
|
|
191
|
-
return touchEventNames[evt];
|
|
192
|
-
if (supportsMouseEvent())
|
|
193
|
-
return mouseEventNames[evt];
|
|
194
|
-
return evt;
|
|
195
|
-
}
|
|
196
|
-
|
|
197
|
-
// ../../utilities/dom/src/next-tick.ts
|
|
198
|
-
function raf(fn) {
|
|
199
|
-
const id = globalThis.requestAnimationFrame(fn);
|
|
200
|
-
return function cleanup() {
|
|
201
|
-
globalThis.cancelAnimationFrame(id);
|
|
202
|
-
};
|
|
203
|
-
}
|
|
204
|
-
|
|
205
|
-
// ../../utilities/dom/src/pointerlock.ts
|
|
206
|
-
function addPointerlockChangeListener(doc, fn) {
|
|
207
|
-
return addDomEvent(doc, "pointerlockchange", fn, false);
|
|
208
|
-
}
|
|
209
|
-
|
|
210
|
-
// ../../utilities/dom/src/scrollable.ts
|
|
211
|
-
function isScrollParent(el) {
|
|
212
|
-
const { overflow, overflowX, overflowY } = getComputedStyle(el);
|
|
213
|
-
return /auto|scroll|overlay|hidden/.test(overflow + overflowY + overflowX);
|
|
214
|
-
}
|
|
215
|
-
function getScrollParent(el) {
|
|
216
|
-
if (["html", "body", "#document"].includes(getNodeName(el))) {
|
|
217
|
-
return getDocument(el).body;
|
|
218
|
-
}
|
|
219
|
-
if (isHTMLElement(el) && isScrollParent(el)) {
|
|
220
|
-
return el;
|
|
221
|
-
}
|
|
222
|
-
return getScrollParent(getParent(el));
|
|
223
|
-
}
|
|
224
|
-
function getScrollParents(el, list = []) {
|
|
225
|
-
const scrollParent = getScrollParent(el);
|
|
226
|
-
const isBody = scrollParent === getDocument(el).body;
|
|
227
|
-
const win = getWindow(scrollParent);
|
|
228
|
-
const target = isBody ? [win].concat(win.visualViewport || [], isScrollParent(scrollParent) ? scrollParent : []) : scrollParent;
|
|
229
|
-
const parents = list.concat(target);
|
|
230
|
-
if (isBody)
|
|
231
|
-
return parents;
|
|
232
|
-
return parents.concat(getScrollParents(getParent(target)));
|
|
233
|
-
}
|
|
234
|
-
|
|
235
|
-
// src/tooltip.machine.ts
|
|
27
|
+
var import_dom_event = require("@zag-js/dom-event");
|
|
28
|
+
var import_dom_query2 = require("@zag-js/dom-query");
|
|
236
29
|
var import_popper = require("@zag-js/popper");
|
|
30
|
+
var import_utils = require("@zag-js/utils");
|
|
237
31
|
|
|
238
32
|
// src/tooltip.dom.ts
|
|
239
|
-
var
|
|
33
|
+
var import_dom_query = require("@zag-js/dom-query");
|
|
34
|
+
var dom = (0, import_dom_query.createScope)({
|
|
240
35
|
getTriggerId: (ctx) => ctx.ids?.trigger ?? `tooltip:${ctx.id}:trigger`,
|
|
241
36
|
getContentId: (ctx) => ctx.ids?.content ?? `tooltip:${ctx.id}:content`,
|
|
242
37
|
getArrowId: (ctx) => `tooltip:${ctx.id}:arrow`,
|
|
@@ -245,7 +40,7 @@ var dom = defineDomHelpers({
|
|
|
245
40
|
getContentEl: (ctx) => dom.getById(ctx, dom.getContentId(ctx)),
|
|
246
41
|
getPositionerEl: (ctx) => dom.getById(ctx, dom.getPositionerId(ctx)),
|
|
247
42
|
getArrowEl: (ctx) => dom.getById(ctx, dom.getArrowId(ctx)),
|
|
248
|
-
getScrollParent: (ctx) => getScrollParent(dom.getTriggerEl(ctx))
|
|
43
|
+
getScrollParent: (ctx) => (0, import_dom_query.getScrollParent)(dom.getTriggerEl(ctx))
|
|
249
44
|
});
|
|
250
45
|
|
|
251
46
|
// src/tooltip.store.ts
|
|
@@ -261,7 +56,7 @@ var store = (0, import_core.proxy)({
|
|
|
261
56
|
|
|
262
57
|
// src/tooltip.machine.ts
|
|
263
58
|
function machine(userContext) {
|
|
264
|
-
const ctx = compact(userContext);
|
|
59
|
+
const ctx = (0, import_utils.compact)(userContext);
|
|
265
60
|
return (0, import_core2.createMachine)(
|
|
266
61
|
{
|
|
267
62
|
id: "tooltip",
|
|
@@ -376,7 +171,7 @@ function machine(userContext) {
|
|
|
376
171
|
computePlacement(ctx2) {
|
|
377
172
|
ctx2.currentPlacement = ctx2.positioning.placement;
|
|
378
173
|
let cleanup;
|
|
379
|
-
raf(() => {
|
|
174
|
+
(0, import_dom_query2.raf)(() => {
|
|
380
175
|
cleanup = (0, import_popper.getPlacement)(dom.getTriggerEl(ctx2), dom.getPositionerEl(ctx2), {
|
|
381
176
|
...ctx2.positioning,
|
|
382
177
|
onComplete(data) {
|
|
@@ -392,17 +187,16 @@ function machine(userContext) {
|
|
|
392
187
|
return cleanup;
|
|
393
188
|
},
|
|
394
189
|
trackPointerlockChange(ctx2, _evt, { send }) {
|
|
395
|
-
|
|
396
|
-
|
|
397
|
-
});
|
|
190
|
+
const onChange = () => send("POINTER_LOCK_CHANGE");
|
|
191
|
+
return (0, import_dom_event.addDomEvent)(dom.getDoc(ctx2), "pointerlockchange", onChange, false);
|
|
398
192
|
},
|
|
399
193
|
trackScroll(ctx2, _evt, { send }) {
|
|
400
194
|
const trigger = dom.getTriggerEl(ctx2);
|
|
401
195
|
if (!trigger)
|
|
402
196
|
return;
|
|
403
|
-
const cleanups = getScrollParents(trigger).map((el) => {
|
|
197
|
+
const cleanups = (0, import_dom_query2.getScrollParents)(trigger).map((el) => {
|
|
404
198
|
const opts = { passive: true, capture: true };
|
|
405
|
-
return addDomEvent(el, "scroll", () => send("SCROLL"), opts);
|
|
199
|
+
return (0, import_dom_event.addDomEvent)(el, "scroll", () => send("SCROLL"), opts);
|
|
406
200
|
});
|
|
407
201
|
return () => {
|
|
408
202
|
cleanups.forEach((fn) => fn?.());
|
|
@@ -416,12 +210,12 @@ function machine(userContext) {
|
|
|
416
210
|
});
|
|
417
211
|
},
|
|
418
212
|
trackDisabledTriggerOnSafari(ctx2, _evt, { send }) {
|
|
419
|
-
if (!isSafari())
|
|
213
|
+
if (!(0, import_dom_query2.isSafari)())
|
|
420
214
|
return;
|
|
421
215
|
const doc = dom.getDoc(ctx2);
|
|
422
|
-
return
|
|
216
|
+
return (0, import_dom_event.addDomEvent)(doc, "pointermove", (event) => {
|
|
423
217
|
const selector = "[data-part=trigger][data-expanded]";
|
|
424
|
-
if (isHTMLElement(event.target) && event.target.closest(selector))
|
|
218
|
+
if ((0, import_dom_query2.isHTMLElement)(event.target) && event.target.closest(selector))
|
|
425
219
|
return;
|
|
426
220
|
send("POINTER_LEAVE");
|
|
427
221
|
});
|
|
@@ -430,7 +224,7 @@ function machine(userContext) {
|
|
|
430
224
|
if (!ctx2.closeOnEsc)
|
|
431
225
|
return;
|
|
432
226
|
const doc = dom.getDoc(ctx2);
|
|
433
|
-
return addDomEvent(doc, "keydown", (event) => {
|
|
227
|
+
return (0, import_dom_event.addDomEvent)(doc, "keydown", (event) => {
|
|
434
228
|
if (event.key === "Escape") {
|
|
435
229
|
send("ESCAPE");
|
|
436
230
|
}
|
package/dist/tooltip.machine.mjs
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@zag-js/tooltip",
|
|
3
|
-
"version": "0.0.0-dev-
|
|
3
|
+
"version": "0.0.0-dev-20230222120620",
|
|
4
4
|
"description": "Core logic for the tooltip widget implemented as a state machine",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"js",
|
|
@@ -27,14 +27,16 @@
|
|
|
27
27
|
},
|
|
28
28
|
"dependencies": {
|
|
29
29
|
"@zag-js/anatomy": "0.1.4",
|
|
30
|
-
"@zag-js/core": "0.0.0-dev-
|
|
31
|
-
"@zag-js/popper": "0.0.0-dev-
|
|
30
|
+
"@zag-js/core": "0.0.0-dev-20230222120620",
|
|
31
|
+
"@zag-js/popper": "0.0.0-dev-20230222120620",
|
|
32
|
+
"@zag-js/dom-query": "0.0.0-dev-20230222120620",
|
|
33
|
+
"@zag-js/dom-event": "0.0.0-dev-20230222120620",
|
|
34
|
+
"@zag-js/utils": "0.3.3",
|
|
35
|
+
"@zag-js/visually-hidden": "0.0.0-dev-20230222120620",
|
|
32
36
|
"@zag-js/types": "0.3.4"
|
|
33
37
|
},
|
|
34
38
|
"devDependencies": {
|
|
35
|
-
"clean-package": "2.2.0"
|
|
36
|
-
"@zag-js/dom-utils": "0.2.4",
|
|
37
|
-
"@zag-js/utils": "0.3.3"
|
|
39
|
+
"clean-package": "2.2.0"
|
|
38
40
|
},
|
|
39
41
|
"clean-package": "../../../clean-package.config.json",
|
|
40
42
|
"main": "dist/index.js",
|
package/dist/chunk-DYQY5P2O.mjs
DELETED
|
@@ -1,111 +0,0 @@
|
|
|
1
|
-
// ../../utilities/dom/src/get-computed-style.ts
|
|
2
|
-
function getCache() {
|
|
3
|
-
const g = globalThis;
|
|
4
|
-
g.__styleCache = g.__styleCache || /* @__PURE__ */ new WeakMap();
|
|
5
|
-
return g.__styleCache;
|
|
6
|
-
}
|
|
7
|
-
function getComputedStyle(el) {
|
|
8
|
-
if (!el)
|
|
9
|
-
return {};
|
|
10
|
-
const cache = getCache();
|
|
11
|
-
let style = cache.get(el);
|
|
12
|
-
if (!style) {
|
|
13
|
-
const win = el?.ownerDocument.defaultView ?? window;
|
|
14
|
-
style = win.getComputedStyle(el);
|
|
15
|
-
cache.set(el, style);
|
|
16
|
-
}
|
|
17
|
-
return style;
|
|
18
|
-
}
|
|
19
|
-
|
|
20
|
-
// ../../utilities/dom/src/query.ts
|
|
21
|
-
function isDocument(el) {
|
|
22
|
-
return el.nodeType === Node.DOCUMENT_NODE;
|
|
23
|
-
}
|
|
24
|
-
function isWindow(value) {
|
|
25
|
-
return value?.toString() === "[object Window]";
|
|
26
|
-
}
|
|
27
|
-
function getDocument(el) {
|
|
28
|
-
if (isWindow(el))
|
|
29
|
-
return el.document;
|
|
30
|
-
if (isDocument(el))
|
|
31
|
-
return el;
|
|
32
|
-
return el?.ownerDocument ?? document;
|
|
33
|
-
}
|
|
34
|
-
function getWindow(el) {
|
|
35
|
-
return el?.ownerDocument.defaultView ?? window;
|
|
36
|
-
}
|
|
37
|
-
function getNodeName(node) {
|
|
38
|
-
return isWindow(node) ? "" : node?.localName ?? "";
|
|
39
|
-
}
|
|
40
|
-
function getParent(el) {
|
|
41
|
-
const doc = getDocument(el);
|
|
42
|
-
if (getNodeName(el) === "html")
|
|
43
|
-
return el;
|
|
44
|
-
return el.assignedSlot || el.parentElement || doc.documentElement;
|
|
45
|
-
}
|
|
46
|
-
function defineDomHelpers(helpers) {
|
|
47
|
-
const dom2 = {
|
|
48
|
-
getRootNode: (ctx) => ctx.getRootNode?.() ?? document,
|
|
49
|
-
getDoc: (ctx) => getDocument(dom2.getRootNode(ctx)),
|
|
50
|
-
getWin: (ctx) => dom2.getDoc(ctx).defaultView ?? window,
|
|
51
|
-
getActiveElement: (ctx) => dom2.getDoc(ctx).activeElement,
|
|
52
|
-
getById: (ctx, id) => dom2.getRootNode(ctx).getElementById(id),
|
|
53
|
-
queryById: (ctx, id) => {
|
|
54
|
-
const el = dom2.getById(ctx, id);
|
|
55
|
-
if (!el)
|
|
56
|
-
throw new Error(`Element with id "${id}" not found.`);
|
|
57
|
-
return el;
|
|
58
|
-
}
|
|
59
|
-
};
|
|
60
|
-
return {
|
|
61
|
-
...dom2,
|
|
62
|
-
...helpers
|
|
63
|
-
};
|
|
64
|
-
}
|
|
65
|
-
function isHTMLElement(v) {
|
|
66
|
-
return typeof v === "object" && v?.nodeType === Node.ELEMENT_NODE && typeof v?.nodeName === "string";
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
// ../../utilities/dom/src/scrollable.ts
|
|
70
|
-
function isScrollParent(el) {
|
|
71
|
-
const { overflow, overflowX, overflowY } = getComputedStyle(el);
|
|
72
|
-
return /auto|scroll|overlay|hidden/.test(overflow + overflowY + overflowX);
|
|
73
|
-
}
|
|
74
|
-
function getScrollParent(el) {
|
|
75
|
-
if (["html", "body", "#document"].includes(getNodeName(el))) {
|
|
76
|
-
return getDocument(el).body;
|
|
77
|
-
}
|
|
78
|
-
if (isHTMLElement(el) && isScrollParent(el)) {
|
|
79
|
-
return el;
|
|
80
|
-
}
|
|
81
|
-
return getScrollParent(getParent(el));
|
|
82
|
-
}
|
|
83
|
-
function getScrollParents(el, list = []) {
|
|
84
|
-
const scrollParent = getScrollParent(el);
|
|
85
|
-
const isBody = scrollParent === getDocument(el).body;
|
|
86
|
-
const win = getWindow(scrollParent);
|
|
87
|
-
const target = isBody ? [win].concat(win.visualViewport || [], isScrollParent(scrollParent) ? scrollParent : []) : scrollParent;
|
|
88
|
-
const parents = list.concat(target);
|
|
89
|
-
if (isBody)
|
|
90
|
-
return parents;
|
|
91
|
-
return parents.concat(getScrollParents(getParent(target)));
|
|
92
|
-
}
|
|
93
|
-
|
|
94
|
-
// src/tooltip.dom.ts
|
|
95
|
-
var dom = defineDomHelpers({
|
|
96
|
-
getTriggerId: (ctx) => ctx.ids?.trigger ?? `tooltip:${ctx.id}:trigger`,
|
|
97
|
-
getContentId: (ctx) => ctx.ids?.content ?? `tooltip:${ctx.id}:content`,
|
|
98
|
-
getArrowId: (ctx) => `tooltip:${ctx.id}:arrow`,
|
|
99
|
-
getPositionerId: (ctx) => `tooltip:${ctx.id}:popper`,
|
|
100
|
-
getTriggerEl: (ctx) => dom.getById(ctx, dom.getTriggerId(ctx)),
|
|
101
|
-
getContentEl: (ctx) => dom.getById(ctx, dom.getContentId(ctx)),
|
|
102
|
-
getPositionerEl: (ctx) => dom.getById(ctx, dom.getPositionerId(ctx)),
|
|
103
|
-
getArrowEl: (ctx) => dom.getById(ctx, dom.getArrowId(ctx)),
|
|
104
|
-
getScrollParent: (ctx) => getScrollParent(dom.getTriggerEl(ctx))
|
|
105
|
-
});
|
|
106
|
-
|
|
107
|
-
export {
|
|
108
|
-
isHTMLElement,
|
|
109
|
-
getScrollParents,
|
|
110
|
-
dom
|
|
111
|
-
};
|