react-tooltip 5.10.1-beta.5 → 5.10.2-beta.1

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.
@@ -1,1393 +0,0 @@
1
- "use strict";
2
- var __create = Object.create;
3
- var __defProp = Object.defineProperty;
4
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
- var __getOwnPropNames = Object.getOwnPropertyNames;
6
- var __getProtoOf = Object.getPrototypeOf;
7
- var __hasOwnProp = Object.prototype.hasOwnProperty;
8
- var __commonJS = (cb, mod) => function __require() {
9
- return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
10
- };
11
- var __export = (target, all) => {
12
- for (var name in all)
13
- __defProp(target, name, { get: all[name], enumerable: true });
14
- };
15
- var __copyProps = (to, from, except, desc) => {
16
- if (from && typeof from === "object" || typeof from === "function") {
17
- for (let key of __getOwnPropNames(from))
18
- if (!__hasOwnProp.call(to, key) && key !== except)
19
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
20
- }
21
- return to;
22
- };
23
- var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
24
- // If the importer is in node compatibility mode or this is not an ESM
25
- // file that has been converted to a CommonJS file using a Babel-
26
- // compatible transform (i.e. "__esModule" has not been set), then set
27
- // "default" to the CommonJS "module.exports" for node compatibility.
28
- isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
29
- mod
30
- ));
31
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
32
-
33
- // node_modules/classnames/index.js
34
- var require_classnames = __commonJS({
35
- "node_modules/classnames/index.js"(exports, module2) {
36
- (function() {
37
- "use strict";
38
- var hasOwn = {}.hasOwnProperty;
39
- var nativeCodeString = "[native code]";
40
- function classNames3() {
41
- var classes = [];
42
- for (var i3 = 0; i3 < arguments.length; i3++) {
43
- var arg = arguments[i3];
44
- if (!arg)
45
- continue;
46
- var argType = typeof arg;
47
- if (argType === "string" || argType === "number") {
48
- classes.push(arg);
49
- } else if (Array.isArray(arg)) {
50
- if (arg.length) {
51
- var inner = classNames3.apply(null, arg);
52
- if (inner) {
53
- classes.push(inner);
54
- }
55
- }
56
- } else if (argType === "object") {
57
- if (arg.toString !== Object.prototype.toString && !arg.toString.toString().includes("[native code]")) {
58
- classes.push(arg.toString());
59
- continue;
60
- }
61
- for (var key in arg) {
62
- if (hasOwn.call(arg, key) && arg[key]) {
63
- classes.push(key);
64
- }
65
- }
66
- }
67
- }
68
- return classes.join(" ");
69
- }
70
- if (typeof module2 !== "undefined" && module2.exports) {
71
- classNames3.default = classNames3;
72
- module2.exports = classNames3;
73
- } else if (typeof define === "function" && typeof define.amd === "object" && define.amd) {
74
- define("classnames", [], function() {
75
- return classNames3;
76
- });
77
- } else {
78
- window.classNames = classNames3;
79
- }
80
- })();
81
- }
82
- });
83
-
84
- // src/index.tsx
85
- var src_exports = {};
86
- __export(src_exports, {
87
- Tooltip: () => TooltipController_default,
88
- TooltipProvider: () => TooltipProvider_default,
89
- TooltipWrapper: () => TooltipWrapper_default
90
- });
91
- module.exports = __toCommonJS(src_exports);
92
-
93
- // src/components/TooltipController/TooltipController.tsx
94
- var import_react5 = require("react");
95
-
96
- // src/components/Tooltip/Tooltip.tsx
97
- var import_react4 = require("react");
98
- var import_classnames2 = __toESM(require_classnames());
99
-
100
- // src/utils/debounce.ts
101
- var debounce = (func, wait, immediate) => {
102
- let timeout = null;
103
- return function debounced(...args) {
104
- const later = () => {
105
- timeout = null;
106
- if (!immediate) {
107
- func.apply(this, args);
108
- }
109
- };
110
- if (timeout) {
111
- clearTimeout(timeout);
112
- }
113
- timeout = setTimeout(later, wait);
114
- };
115
- };
116
- var debounce_default = debounce;
117
-
118
- // src/components/TooltipProvider/TooltipProvider.tsx
119
- var import_react = require("react");
120
- var import_jsx_runtime = require("react/jsx-runtime");
121
- var DEFAULT_TOOLTIP_ID = "DEFAULT_TOOLTIP_ID";
122
- var DEFAULT_CONTEXT_DATA = {
123
- anchorRefs: /* @__PURE__ */ new Set(),
124
- activeAnchor: { current: null },
125
- attach: () => {
126
- },
127
- detach: () => {
128
- },
129
- setActiveAnchor: () => {
130
- }
131
- };
132
- var DEFAULT_CONTEXT_DATA_WRAPPER = {
133
- getTooltipData: () => DEFAULT_CONTEXT_DATA
134
- };
135
- var TooltipContext = (0, import_react.createContext)(DEFAULT_CONTEXT_DATA_WRAPPER);
136
- var TooltipProvider = ({ children }) => {
137
- const [anchorRefMap, setAnchorRefMap] = (0, import_react.useState)({
138
- [DEFAULT_TOOLTIP_ID]: /* @__PURE__ */ new Set()
139
- });
140
- const [activeAnchorMap, setActiveAnchorMap] = (0, import_react.useState)({
141
- [DEFAULT_TOOLTIP_ID]: { current: null }
142
- });
143
- const attach = (tooltipId, ...refs) => {
144
- setAnchorRefMap((oldMap) => {
145
- var _a;
146
- const tooltipRefs = (_a = oldMap[tooltipId]) != null ? _a : /* @__PURE__ */ new Set();
147
- refs.forEach((ref) => tooltipRefs.add(ref));
148
- return { ...oldMap, [tooltipId]: new Set(tooltipRefs) };
149
- });
150
- };
151
- const detach = (tooltipId, ...refs) => {
152
- setAnchorRefMap((oldMap) => {
153
- const tooltipRefs = oldMap[tooltipId];
154
- if (!tooltipRefs) {
155
- return oldMap;
156
- }
157
- refs.forEach((ref) => tooltipRefs.delete(ref));
158
- return { ...oldMap };
159
- });
160
- };
161
- const setActiveAnchor = (tooltipId, ref) => {
162
- setActiveAnchorMap((oldMap) => {
163
- var _a;
164
- if (((_a = oldMap[tooltipId]) == null ? void 0 : _a.current) === ref.current) {
165
- return oldMap;
166
- }
167
- return { ...oldMap, [tooltipId]: ref };
168
- });
169
- };
170
- const getTooltipData = (0, import_react.useCallback)(
171
- (tooltipId = DEFAULT_TOOLTIP_ID) => {
172
- var _a, _b;
173
- return {
174
- anchorRefs: (_a = anchorRefMap[tooltipId]) != null ? _a : /* @__PURE__ */ new Set(),
175
- activeAnchor: (_b = activeAnchorMap[tooltipId]) != null ? _b : { current: null },
176
- attach: (...refs) => attach(tooltipId, ...refs),
177
- detach: (...refs) => detach(tooltipId, ...refs),
178
- setActiveAnchor: (ref) => setActiveAnchor(tooltipId, ref)
179
- };
180
- },
181
- [anchorRefMap, activeAnchorMap, attach, detach]
182
- );
183
- const context = (0, import_react.useMemo)(() => {
184
- return {
185
- getTooltipData
186
- };
187
- }, [getTooltipData]);
188
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TooltipContext.Provider, { value: context, children });
189
- };
190
- function useTooltip(tooltipId = DEFAULT_TOOLTIP_ID) {
191
- return (0, import_react.useContext)(TooltipContext).getTooltipData(tooltipId);
192
- }
193
- var TooltipProvider_default = TooltipProvider;
194
-
195
- // src/components/TooltipProvider/TooltipWrapper.tsx
196
- var import_react2 = require("react");
197
- var import_classnames = __toESM(require_classnames());
198
- var import_jsx_runtime2 = require("react/jsx-runtime");
199
- var TooltipWrapper = ({
200
- tooltipId,
201
- children,
202
- className,
203
- place,
204
- content,
205
- html,
206
- variant,
207
- offset,
208
- wrapper,
209
- events,
210
- positionStrategy,
211
- delayShow,
212
- delayHide
213
- }) => {
214
- const { attach, detach } = useTooltip(tooltipId);
215
- const anchorRef = (0, import_react2.useRef)(null);
216
- (0, import_react2.useEffect)(() => {
217
- attach(anchorRef);
218
- return () => {
219
- detach(anchorRef);
220
- };
221
- }, []);
222
- return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
223
- "span",
224
- {
225
- ref: anchorRef,
226
- className: (0, import_classnames.default)("react-tooltip-wrapper", className),
227
- "data-tooltip-place": place,
228
- "data-tooltip-content": content,
229
- "data-tooltip-html": html,
230
- "data-tooltip-variant": variant,
231
- "data-tooltip-offset": offset,
232
- "data-tooltip-wrapper": wrapper,
233
- "data-tooltip-events": events,
234
- "data-tooltip-position-strategy": positionStrategy,
235
- "data-tooltip-delay-show": delayShow,
236
- "data-tooltip-delay-hide": delayHide,
237
- children
238
- }
239
- );
240
- };
241
- var TooltipWrapper_default = TooltipWrapper;
242
-
243
- // src/utils/use-isomorphic-layout-effect.ts
244
- var import_react3 = require("react");
245
- var useIsomorphicLayoutEffect = typeof window !== "undefined" ? import_react3.useLayoutEffect : import_react3.useEffect;
246
- var use_isomorphic_layout_effect_default = useIsomorphicLayoutEffect;
247
-
248
- // node_modules/@floating-ui/core/dist/floating-ui.core.browser.min.mjs
249
- function t(t2) {
250
- return t2.split("-")[1];
251
- }
252
- function e(t2) {
253
- return "y" === t2 ? "height" : "width";
254
- }
255
- function n(t2) {
256
- return t2.split("-")[0];
257
- }
258
- function o(t2) {
259
- return ["top", "bottom"].includes(n(t2)) ? "x" : "y";
260
- }
261
- function i(i3, r3, a3) {
262
- let { reference: l3, floating: s3 } = i3;
263
- const c3 = l3.x + l3.width / 2 - s3.width / 2, f3 = l3.y + l3.height / 2 - s3.height / 2, m3 = o(r3), u3 = e(m3), g3 = l3[u3] / 2 - s3[u3] / 2, d3 = "x" === m3;
264
- let p3;
265
- switch (n(r3)) {
266
- case "top":
267
- p3 = { x: c3, y: l3.y - s3.height };
268
- break;
269
- case "bottom":
270
- p3 = { x: c3, y: l3.y + l3.height };
271
- break;
272
- case "right":
273
- p3 = { x: l3.x + l3.width, y: f3 };
274
- break;
275
- case "left":
276
- p3 = { x: l3.x - s3.width, y: f3 };
277
- break;
278
- default:
279
- p3 = { x: l3.x, y: l3.y };
280
- }
281
- switch (t(r3)) {
282
- case "start":
283
- p3[m3] -= g3 * (a3 && d3 ? -1 : 1);
284
- break;
285
- case "end":
286
- p3[m3] += g3 * (a3 && d3 ? -1 : 1);
287
- }
288
- return p3;
289
- }
290
- var r = async (t2, e2, n3) => {
291
- const { placement: o3 = "bottom", strategy: r3 = "absolute", middleware: a3 = [], platform: l3 } = n3, s3 = a3.filter(Boolean), c3 = await (null == l3.isRTL ? void 0 : l3.isRTL(e2));
292
- let f3 = await l3.getElementRects({ reference: t2, floating: e2, strategy: r3 }), { x: m3, y: u3 } = i(f3, o3, c3), g3 = o3, d3 = {}, p3 = 0;
293
- for (let n4 = 0; n4 < s3.length; n4++) {
294
- const { name: a4, fn: h3 } = s3[n4], { x: y3, y: x3, data: w3, reset: v3 } = await h3({ x: m3, y: u3, initialPlacement: o3, placement: g3, strategy: r3, middlewareData: d3, rects: f3, platform: l3, elements: { reference: t2, floating: e2 } });
295
- m3 = null != y3 ? y3 : m3, u3 = null != x3 ? x3 : u3, d3 = { ...d3, [a4]: { ...d3[a4], ...w3 } }, v3 && p3 <= 50 && (p3++, "object" == typeof v3 && (v3.placement && (g3 = v3.placement), v3.rects && (f3 = true === v3.rects ? await l3.getElementRects({ reference: t2, floating: e2, strategy: r3 }) : v3.rects), { x: m3, y: u3 } = i(f3, g3, c3)), n4 = -1);
296
- }
297
- return { x: m3, y: u3, placement: g3, strategy: r3, middlewareData: d3 };
298
- };
299
- function a(t2) {
300
- return "number" != typeof t2 ? function(t3) {
301
- return { top: 0, right: 0, bottom: 0, left: 0, ...t3 };
302
- }(t2) : { top: t2, right: t2, bottom: t2, left: t2 };
303
- }
304
- function l(t2) {
305
- return { ...t2, top: t2.y, left: t2.x, right: t2.x + t2.width, bottom: t2.y + t2.height };
306
- }
307
- async function s(t2, e2) {
308
- var n3;
309
- void 0 === e2 && (e2 = {});
310
- const { x: o3, y: i3, platform: r3, rects: s3, elements: c3, strategy: f3 } = t2, { boundary: m3 = "clippingAncestors", rootBoundary: u3 = "viewport", elementContext: g3 = "floating", altBoundary: d3 = false, padding: p3 = 0 } = e2, h3 = a(p3), y3 = c3[d3 ? "floating" === g3 ? "reference" : "floating" : g3], x3 = l(await r3.getClippingRect({ element: null == (n3 = await (null == r3.isElement ? void 0 : r3.isElement(y3))) || n3 ? y3 : y3.contextElement || await (null == r3.getDocumentElement ? void 0 : r3.getDocumentElement(c3.floating)), boundary: m3, rootBoundary: u3, strategy: f3 })), w3 = "floating" === g3 ? { ...s3.floating, x: o3, y: i3 } : s3.reference, v3 = await (null == r3.getOffsetParent ? void 0 : r3.getOffsetParent(c3.floating)), b3 = await (null == r3.isElement ? void 0 : r3.isElement(v3)) && await (null == r3.getScale ? void 0 : r3.getScale(v3)) || { x: 1, y: 1 }, R2 = l(r3.convertOffsetParentRelativeRectToViewportRelativeRect ? await r3.convertOffsetParentRelativeRectToViewportRelativeRect({ rect: w3, offsetParent: v3, strategy: f3 }) : w3);
311
- return { top: (x3.top - R2.top + h3.top) / b3.y, bottom: (R2.bottom - x3.bottom + h3.bottom) / b3.y, left: (x3.left - R2.left + h3.left) / b3.x, right: (R2.right - x3.right + h3.right) / b3.x };
312
- }
313
- var c = Math.min;
314
- var f = Math.max;
315
- function m(t2, e2, n3) {
316
- return f(t2, c(e2, n3));
317
- }
318
- var u = (n3) => ({ name: "arrow", options: n3, async fn(i3) {
319
- const { element: r3, padding: l3 = 0 } = n3 || {}, { x: s3, y: c3, placement: f3, rects: u3, platform: g3, elements: d3 } = i3;
320
- if (null == r3)
321
- return {};
322
- const p3 = a(l3), h3 = { x: s3, y: c3 }, y3 = o(f3), x3 = e(y3), w3 = await g3.getDimensions(r3), v3 = "y" === y3, b3 = v3 ? "top" : "left", R2 = v3 ? "bottom" : "right", A2 = v3 ? "clientHeight" : "clientWidth", P2 = u3.reference[x3] + u3.reference[y3] - h3[y3] - u3.floating[x3], T3 = h3[y3] - u3.reference[y3], O3 = await (null == g3.getOffsetParent ? void 0 : g3.getOffsetParent(r3));
323
- let E3 = O3 ? O3[A2] : 0;
324
- E3 && await (null == g3.isElement ? void 0 : g3.isElement(O3)) || (E3 = d3.floating[A2] || u3.floating[x3]);
325
- const D3 = P2 / 2 - T3 / 2, L3 = p3[b3], k2 = E3 - w3[x3] - p3[R2], B = E3 / 2 - w3[x3] / 2 + D3, C2 = m(L3, B, k2), H2 = null != t(f3) && B != C2 && u3.reference[x3] / 2 - (B < L3 ? p3[b3] : p3[R2]) - w3[x3] / 2 < 0;
326
- return { [y3]: h3[y3] - (H2 ? B < L3 ? L3 - B : k2 - B : 0), data: { [y3]: C2, centerOffset: B - C2 } };
327
- } });
328
- var g = ["top", "right", "bottom", "left"];
329
- var d = g.reduce((t2, e2) => t2.concat(e2, e2 + "-start", e2 + "-end"), []);
330
- var p = { left: "right", right: "left", bottom: "top", top: "bottom" };
331
- function h(t2) {
332
- return t2.replace(/left|right|bottom|top/g, (t3) => p[t3]);
333
- }
334
- function y(n3, i3, r3) {
335
- void 0 === r3 && (r3 = false);
336
- const a3 = t(n3), l3 = o(n3), s3 = e(l3);
337
- let c3 = "x" === l3 ? a3 === (r3 ? "end" : "start") ? "right" : "left" : "start" === a3 ? "bottom" : "top";
338
- return i3.reference[s3] > i3.floating[s3] && (c3 = h(c3)), { main: c3, cross: h(c3) };
339
- }
340
- var x = { start: "end", end: "start" };
341
- function w(t2) {
342
- return t2.replace(/start|end/g, (t3) => x[t3]);
343
- }
344
- var b = function(e2) {
345
- return void 0 === e2 && (e2 = {}), { name: "flip", options: e2, async fn(o3) {
346
- var i3;
347
- const { placement: r3, middlewareData: a3, rects: l3, initialPlacement: c3, platform: f3, elements: m3 } = o3, { mainAxis: u3 = true, crossAxis: g3 = true, fallbackPlacements: d3, fallbackStrategy: p3 = "bestFit", fallbackAxisSideDirection: x3 = "none", flipAlignment: v3 = true, ...b3 } = e2, R2 = n(r3), A2 = n(c3) === c3, P2 = await (null == f3.isRTL ? void 0 : f3.isRTL(m3.floating)), T3 = d3 || (A2 || !v3 ? [h(c3)] : function(t2) {
348
- const e3 = h(t2);
349
- return [w(t2), e3, w(e3)];
350
- }(c3));
351
- d3 || "none" === x3 || T3.push(...function(e3, o4, i4, r4) {
352
- const a4 = t(e3);
353
- let l4 = function(t2, e4, n3) {
354
- const o5 = ["left", "right"], i5 = ["right", "left"], r5 = ["top", "bottom"], a5 = ["bottom", "top"];
355
- switch (t2) {
356
- case "top":
357
- case "bottom":
358
- return n3 ? e4 ? i5 : o5 : e4 ? o5 : i5;
359
- case "left":
360
- case "right":
361
- return e4 ? r5 : a5;
362
- default:
363
- return [];
364
- }
365
- }(n(e3), "start" === i4, r4);
366
- return a4 && (l4 = l4.map((t2) => t2 + "-" + a4), o4 && (l4 = l4.concat(l4.map(w)))), l4;
367
- }(c3, v3, x3, P2));
368
- const O3 = [c3, ...T3], E3 = await s(o3, b3), D3 = [];
369
- let L3 = (null == (i3 = a3.flip) ? void 0 : i3.overflows) || [];
370
- if (u3 && D3.push(E3[R2]), g3) {
371
- const { main: t2, cross: e3 } = y(r3, l3, P2);
372
- D3.push(E3[t2], E3[e3]);
373
- }
374
- if (L3 = [...L3, { placement: r3, overflows: D3 }], !D3.every((t2) => t2 <= 0)) {
375
- var k2, B;
376
- const t2 = ((null == (k2 = a3.flip) ? void 0 : k2.index) || 0) + 1, e3 = O3[t2];
377
- if (e3)
378
- return { data: { index: t2, overflows: L3 }, reset: { placement: e3 } };
379
- let n3 = null == (B = L3.filter((t3) => t3.overflows[0] <= 0).sort((t3, e4) => t3.overflows[1] - e4.overflows[1])[0]) ? void 0 : B.placement;
380
- if (!n3)
381
- switch (p3) {
382
- case "bestFit": {
383
- var C2;
384
- const t3 = null == (C2 = L3.map((t4) => [t4.placement, t4.overflows.filter((t5) => t5 > 0).reduce((t5, e4) => t5 + e4, 0)]).sort((t4, e4) => t4[1] - e4[1])[0]) ? void 0 : C2[0];
385
- t3 && (n3 = t3);
386
- break;
387
- }
388
- case "initialPlacement":
389
- n3 = c3;
390
- }
391
- if (r3 !== n3)
392
- return { reset: { placement: n3 } };
393
- }
394
- return {};
395
- } };
396
- };
397
- var O = function(e2) {
398
- return void 0 === e2 && (e2 = 0), { name: "offset", options: e2, async fn(i3) {
399
- const { x: r3, y: a3 } = i3, l3 = await async function(e3, i4) {
400
- const { placement: r4, platform: a4, elements: l4 } = e3, s3 = await (null == a4.isRTL ? void 0 : a4.isRTL(l4.floating)), c3 = n(r4), f3 = t(r4), m3 = "x" === o(r4), u3 = ["left", "top"].includes(c3) ? -1 : 1, g3 = s3 && m3 ? -1 : 1, d3 = "function" == typeof i4 ? i4(e3) : i4;
401
- let { mainAxis: p3, crossAxis: h3, alignmentAxis: y3 } = "number" == typeof d3 ? { mainAxis: d3, crossAxis: 0, alignmentAxis: null } : { mainAxis: 0, crossAxis: 0, alignmentAxis: null, ...d3 };
402
- return f3 && "number" == typeof y3 && (h3 = "end" === f3 ? -1 * y3 : y3), m3 ? { x: h3 * g3, y: p3 * u3 } : { x: p3 * u3, y: h3 * g3 };
403
- }(i3, e2);
404
- return { x: r3 + l3.x, y: a3 + l3.y, data: l3 };
405
- } };
406
- };
407
- function E(t2) {
408
- return "x" === t2 ? "y" : "x";
409
- }
410
- var D = function(t2) {
411
- return void 0 === t2 && (t2 = {}), { name: "shift", options: t2, async fn(e2) {
412
- const { x: i3, y: r3, placement: a3 } = e2, { mainAxis: l3 = true, crossAxis: c3 = false, limiter: f3 = { fn: (t3) => {
413
- let { x: e3, y: n3 } = t3;
414
- return { x: e3, y: n3 };
415
- } }, ...u3 } = t2, g3 = { x: i3, y: r3 }, d3 = await s(e2, u3), p3 = o(n(a3)), h3 = E(p3);
416
- let y3 = g3[p3], x3 = g3[h3];
417
- if (l3) {
418
- const t3 = "y" === p3 ? "bottom" : "right";
419
- y3 = m(y3 + d3["y" === p3 ? "top" : "left"], y3, y3 - d3[t3]);
420
- }
421
- if (c3) {
422
- const t3 = "y" === h3 ? "bottom" : "right";
423
- x3 = m(x3 + d3["y" === h3 ? "top" : "left"], x3, x3 - d3[t3]);
424
- }
425
- const w3 = f3.fn({ ...e2, [p3]: y3, [h3]: x3 });
426
- return { ...w3, data: { x: w3.x - i3, y: w3.y - r3 } };
427
- } };
428
- };
429
-
430
- // node_modules/@floating-ui/dom/dist/floating-ui.dom.browser.min.mjs
431
- function n2(t2) {
432
- var e2;
433
- return (null == (e2 = t2.ownerDocument) ? void 0 : e2.defaultView) || window;
434
- }
435
- function o2(t2) {
436
- return n2(t2).getComputedStyle(t2);
437
- }
438
- var i2 = Math.min;
439
- var r2 = Math.max;
440
- var l2 = Math.round;
441
- function c2(t2) {
442
- const e2 = o2(t2);
443
- let n3 = parseFloat(e2.width), i3 = parseFloat(e2.height);
444
- const r3 = t2.offsetWidth, c3 = t2.offsetHeight, s3 = l2(n3) !== r3 || l2(i3) !== c3;
445
- return s3 && (n3 = r3, i3 = c3), { width: n3, height: i3, fallback: s3 };
446
- }
447
- function s2(t2) {
448
- return h2(t2) ? (t2.nodeName || "").toLowerCase() : "";
449
- }
450
- var f2;
451
- function u2() {
452
- if (f2)
453
- return f2;
454
- const t2 = navigator.userAgentData;
455
- return t2 && Array.isArray(t2.brands) ? (f2 = t2.brands.map((t3) => t3.brand + "/" + t3.version).join(" "), f2) : navigator.userAgent;
456
- }
457
- function a2(t2) {
458
- return t2 instanceof n2(t2).HTMLElement;
459
- }
460
- function d2(t2) {
461
- return t2 instanceof n2(t2).Element;
462
- }
463
- function h2(t2) {
464
- return t2 instanceof n2(t2).Node;
465
- }
466
- function p2(t2) {
467
- if ("undefined" == typeof ShadowRoot)
468
- return false;
469
- return t2 instanceof n2(t2).ShadowRoot || t2 instanceof ShadowRoot;
470
- }
471
- function g2(t2) {
472
- const { overflow: e2, overflowX: n3, overflowY: i3, display: r3 } = o2(t2);
473
- return /auto|scroll|overlay|hidden|clip/.test(e2 + i3 + n3) && !["inline", "contents"].includes(r3);
474
- }
475
- function m2(t2) {
476
- return ["table", "td", "th"].includes(s2(t2));
477
- }
478
- function y2(t2) {
479
- const e2 = /firefox/i.test(u2()), n3 = o2(t2), i3 = n3.backdropFilter || n3.WebkitBackdropFilter;
480
- return "none" !== n3.transform || "none" !== n3.perspective || !!i3 && "none" !== i3 || e2 && "filter" === n3.willChange || e2 && !!n3.filter && "none" !== n3.filter || ["transform", "perspective"].some((t3) => n3.willChange.includes(t3)) || ["paint", "layout", "strict", "content"].some((t3) => {
481
- const e3 = n3.contain;
482
- return null != e3 && e3.includes(t3);
483
- });
484
- }
485
- function x2() {
486
- return /^((?!chrome|android).)*safari/i.test(u2());
487
- }
488
- function w2(t2) {
489
- return ["html", "body", "#document"].includes(s2(t2));
490
- }
491
- function v2(t2) {
492
- return d2(t2) ? t2 : t2.contextElement;
493
- }
494
- var b2 = { x: 1, y: 1 };
495
- function L2(t2) {
496
- const e2 = v2(t2);
497
- if (!a2(e2))
498
- return b2;
499
- const n3 = e2.getBoundingClientRect(), { width: o3, height: i3, fallback: r3 } = c2(e2);
500
- let s3 = (r3 ? l2(n3.width) : n3.width) / o3, f3 = (r3 ? l2(n3.height) : n3.height) / i3;
501
- return s3 && Number.isFinite(s3) || (s3 = 1), f3 && Number.isFinite(f3) || (f3 = 1), { x: s3, y: f3 };
502
- }
503
- function E2(e2, o3, i3, r3) {
504
- var l3, c3;
505
- void 0 === o3 && (o3 = false), void 0 === i3 && (i3 = false);
506
- const s3 = e2.getBoundingClientRect(), f3 = v2(e2);
507
- let u3 = b2;
508
- o3 && (r3 ? d2(r3) && (u3 = L2(r3)) : u3 = L2(e2));
509
- const a3 = f3 ? n2(f3) : window, h3 = x2() && i3;
510
- let p3 = (s3.left + (h3 && (null == (l3 = a3.visualViewport) ? void 0 : l3.offsetLeft) || 0)) / u3.x, g3 = (s3.top + (h3 && (null == (c3 = a3.visualViewport) ? void 0 : c3.offsetTop) || 0)) / u3.y, m3 = s3.width / u3.x, y3 = s3.height / u3.y;
511
- if (f3) {
512
- const t2 = n2(f3), e3 = r3 && d2(r3) ? n2(r3) : r3;
513
- let o4 = t2.frameElement;
514
- for (; o4 && r3 && e3 !== t2; ) {
515
- const t3 = L2(o4), e4 = o4.getBoundingClientRect(), i4 = getComputedStyle(o4);
516
- e4.x += (o4.clientLeft + parseFloat(i4.paddingLeft)) * t3.x, e4.y += (o4.clientTop + parseFloat(i4.paddingTop)) * t3.y, p3 *= t3.x, g3 *= t3.y, m3 *= t3.x, y3 *= t3.y, p3 += e4.x, g3 += e4.y, o4 = n2(o4).frameElement;
517
- }
518
- }
519
- return l({ width: m3, height: y3, x: p3, y: g3 });
520
- }
521
- function R(t2) {
522
- return ((h2(t2) ? t2.ownerDocument : t2.document) || window.document).documentElement;
523
- }
524
- function T2(t2) {
525
- return d2(t2) ? { scrollLeft: t2.scrollLeft, scrollTop: t2.scrollTop } : { scrollLeft: t2.pageXOffset, scrollTop: t2.pageYOffset };
526
- }
527
- function C(t2) {
528
- return E2(R(t2)).left + T2(t2).scrollLeft;
529
- }
530
- function F(t2) {
531
- if ("html" === s2(t2))
532
- return t2;
533
- const e2 = t2.assignedSlot || t2.parentNode || p2(t2) && t2.host || R(t2);
534
- return p2(e2) ? e2.host : e2;
535
- }
536
- function W(t2) {
537
- const e2 = F(t2);
538
- return w2(e2) ? e2.ownerDocument.body : a2(e2) && g2(e2) ? e2 : W(e2);
539
- }
540
- function D2(t2, e2) {
541
- var o3;
542
- void 0 === e2 && (e2 = []);
543
- const i3 = W(t2), r3 = i3 === (null == (o3 = t2.ownerDocument) ? void 0 : o3.body), l3 = n2(i3);
544
- return r3 ? e2.concat(l3, l3.visualViewport || [], g2(i3) ? i3 : []) : e2.concat(i3, D2(i3));
545
- }
546
- function S(e2, i3, l3) {
547
- let c3;
548
- if ("viewport" === i3)
549
- c3 = function(t2, e3) {
550
- const o3 = n2(t2), i4 = R(t2), r3 = o3.visualViewport;
551
- let l4 = i4.clientWidth, c4 = i4.clientHeight, s4 = 0, f4 = 0;
552
- if (r3) {
553
- l4 = r3.width, c4 = r3.height;
554
- const t3 = x2();
555
- (!t3 || t3 && "fixed" === e3) && (s4 = r3.offsetLeft, f4 = r3.offsetTop);
556
- }
557
- return { width: l4, height: c4, x: s4, y: f4 };
558
- }(e2, l3);
559
- else if ("document" === i3)
560
- c3 = function(t2) {
561
- const e3 = R(t2), n3 = T2(t2), i4 = t2.ownerDocument.body, l4 = r2(e3.scrollWidth, e3.clientWidth, i4.scrollWidth, i4.clientWidth), c4 = r2(e3.scrollHeight, e3.clientHeight, i4.scrollHeight, i4.clientHeight);
562
- let s4 = -n3.scrollLeft + C(t2);
563
- const f4 = -n3.scrollTop;
564
- return "rtl" === o2(i4).direction && (s4 += r2(e3.clientWidth, i4.clientWidth) - l4), { width: l4, height: c4, x: s4, y: f4 };
565
- }(R(e2));
566
- else if (d2(i3))
567
- c3 = function(t2, e3) {
568
- const n3 = E2(t2, true, "fixed" === e3), o3 = n3.top + t2.clientTop, i4 = n3.left + t2.clientLeft, r3 = a2(t2) ? L2(t2) : { x: 1, y: 1 };
569
- return { width: t2.clientWidth * r3.x, height: t2.clientHeight * r3.y, x: i4 * r3.x, y: o3 * r3.y };
570
- }(i3, l3);
571
- else {
572
- const t2 = { ...i3 };
573
- if (x2()) {
574
- var s3, f3;
575
- const o3 = n2(e2);
576
- t2.x -= (null == (s3 = o3.visualViewport) ? void 0 : s3.offsetLeft) || 0, t2.y -= (null == (f3 = o3.visualViewport) ? void 0 : f3.offsetTop) || 0;
577
- }
578
- c3 = t2;
579
- }
580
- return l(c3);
581
- }
582
- function A(t2, e2) {
583
- return a2(t2) && "fixed" !== o2(t2).position ? e2 ? e2(t2) : t2.offsetParent : null;
584
- }
585
- function H(t2, e2) {
586
- const i3 = n2(t2);
587
- if (!a2(t2))
588
- return i3;
589
- let r3 = A(t2, e2);
590
- for (; r3 && m2(r3) && "static" === o2(r3).position; )
591
- r3 = A(r3, e2);
592
- return r3 && ("html" === s2(r3) || "body" === s2(r3) && "static" === o2(r3).position && !y2(r3)) ? i3 : r3 || function(t3) {
593
- let e3 = F(t3);
594
- for (; a2(e3) && !w2(e3); ) {
595
- if (y2(e3))
596
- return e3;
597
- e3 = F(e3);
598
- }
599
- return null;
600
- }(t2) || i3;
601
- }
602
- function V(t2, e2, n3) {
603
- const o3 = a2(e2), i3 = R(e2), r3 = E2(t2, true, "fixed" === n3, e2);
604
- let l3 = { scrollLeft: 0, scrollTop: 0 };
605
- const c3 = { x: 0, y: 0 };
606
- if (o3 || !o3 && "fixed" !== n3)
607
- if (("body" !== s2(e2) || g2(i3)) && (l3 = T2(e2)), a2(e2)) {
608
- const t3 = E2(e2, true);
609
- c3.x = t3.x + e2.clientLeft, c3.y = t3.y + e2.clientTop;
610
- } else
611
- i3 && (c3.x = C(i3));
612
- return { x: r3.left + l3.scrollLeft - c3.x, y: r3.top + l3.scrollTop - c3.y, width: r3.width, height: r3.height };
613
- }
614
- var O2 = { getClippingRect: function(t2) {
615
- let { element: e2, boundary: n3, rootBoundary: l3, strategy: c3 } = t2;
616
- const f3 = "clippingAncestors" === n3 ? function(t3, e3) {
617
- const n4 = e3.get(t3);
618
- if (n4)
619
- return n4;
620
- let i3 = D2(t3).filter((t4) => d2(t4) && "body" !== s2(t4)), r3 = null;
621
- const l4 = "fixed" === o2(t3).position;
622
- let c4 = l4 ? F(t3) : t3;
623
- for (; d2(c4) && !w2(c4); ) {
624
- const t4 = o2(c4), e4 = y2(c4);
625
- "fixed" === t4.position ? r3 = null : (l4 ? e4 || r3 : e4 || "static" !== t4.position || !r3 || !["absolute", "fixed"].includes(r3.position)) ? r3 = t4 : i3 = i3.filter((t5) => t5 !== c4), c4 = F(c4);
626
- }
627
- return e3.set(t3, i3), i3;
628
- }(e2, this._c) : [].concat(n3), u3 = [...f3, l3], a3 = u3[0], h3 = u3.reduce((t3, n4) => {
629
- const o3 = S(e2, n4, c3);
630
- return t3.top = r2(o3.top, t3.top), t3.right = i2(o3.right, t3.right), t3.bottom = i2(o3.bottom, t3.bottom), t3.left = r2(o3.left, t3.left), t3;
631
- }, S(e2, a3, c3));
632
- return { width: h3.right - h3.left, height: h3.bottom - h3.top, x: h3.left, y: h3.top };
633
- }, convertOffsetParentRelativeRectToViewportRelativeRect: function(t2) {
634
- let { rect: e2, offsetParent: n3, strategy: o3 } = t2;
635
- const i3 = a2(n3), r3 = R(n3);
636
- if (n3 === r3)
637
- return e2;
638
- let l3 = { scrollLeft: 0, scrollTop: 0 }, c3 = { x: 1, y: 1 };
639
- const f3 = { x: 0, y: 0 };
640
- if ((i3 || !i3 && "fixed" !== o3) && (("body" !== s2(n3) || g2(r3)) && (l3 = T2(n3)), a2(n3))) {
641
- const t3 = E2(n3);
642
- c3 = L2(n3), f3.x = t3.x + n3.clientLeft, f3.y = t3.y + n3.clientTop;
643
- }
644
- return { width: e2.width * c3.x, height: e2.height * c3.y, x: e2.x * c3.x - l3.scrollLeft * c3.x + f3.x, y: e2.y * c3.y - l3.scrollTop * c3.y + f3.y };
645
- }, isElement: d2, getDimensions: function(t2) {
646
- return a2(t2) ? c2(t2) : t2.getBoundingClientRect();
647
- }, getOffsetParent: H, getDocumentElement: R, getScale: L2, async getElementRects(t2) {
648
- let { reference: e2, floating: n3, strategy: o3 } = t2;
649
- const i3 = this.getOffsetParent || H, r3 = this.getDimensions;
650
- return { reference: V(e2, await i3(n3), o3), floating: { x: 0, y: 0, ...await r3(n3) } };
651
- }, getClientRects: (t2) => Array.from(t2.getClientRects()), isRTL: (t2) => "rtl" === o2(t2).direction };
652
- var z = (t2, n3, o3) => {
653
- const i3 = /* @__PURE__ */ new Map(), r3 = { platform: O2, ...o3 }, l3 = { ...r3.platform, _c: i3 };
654
- return r(t2, n3, { ...r3, platform: l3 });
655
- };
656
-
657
- // src/utils/compute-positions.ts
658
- var computeTooltipPosition = async ({
659
- elementReference = null,
660
- tooltipReference = null,
661
- tooltipArrowReference = null,
662
- place = "top",
663
- offset: offsetValue = 10,
664
- strategy = "absolute",
665
- middlewares = [O(Number(offsetValue)), b(), D({ padding: 5 })]
666
- }) => {
667
- if (!elementReference) {
668
- return { tooltipStyles: {}, tooltipArrowStyles: {}, place };
669
- }
670
- if (tooltipReference === null) {
671
- return { tooltipStyles: {}, tooltipArrowStyles: {}, place };
672
- }
673
- const middleware = middlewares;
674
- if (tooltipArrowReference) {
675
- middleware.push(u({ element: tooltipArrowReference, padding: 5 }));
676
- return z(elementReference, tooltipReference, {
677
- placement: place,
678
- strategy,
679
- middleware
680
- }).then(({ x: x3, y: y3, placement, middlewareData }) => {
681
- var _a, _b;
682
- const styles = { left: `${x3}px`, top: `${y3}px` };
683
- const { x: arrowX, y: arrowY } = (_a = middlewareData.arrow) != null ? _a : { x: 0, y: 0 };
684
- const staticSide = (_b = {
685
- top: "bottom",
686
- right: "left",
687
- bottom: "top",
688
- left: "right"
689
- }[placement.split("-")[0]]) != null ? _b : "bottom";
690
- const arrowStyle = {
691
- left: arrowX != null ? `${arrowX}px` : "",
692
- top: arrowY != null ? `${arrowY}px` : "",
693
- right: "",
694
- bottom: "",
695
- [staticSide]: "-4px"
696
- };
697
- return { tooltipStyles: styles, tooltipArrowStyles: arrowStyle, place: placement };
698
- });
699
- }
700
- return z(elementReference, tooltipReference, {
701
- placement: "bottom",
702
- strategy,
703
- middleware
704
- }).then(({ x: x3, y: y3, placement }) => {
705
- const styles = { left: `${x3}px`, top: `${y3}px` };
706
- return { tooltipStyles: styles, tooltipArrowStyles: {}, place: placement };
707
- });
708
- };
709
-
710
- // esbuild-css-modules-plugin-namespace:./src/components/Tooltip/styles.module.css?esbuild-css-modules-plugin-building
711
- var styles_module_default = { "arrow": "react-tooltip__arrow_KtSkBq", "clickable": "react-tooltip__clickable_KtSkBq", "dark": "react-tooltip__dark_KtSkBq", "error": "react-tooltip__error_KtSkBq", "fixed": "react-tooltip__fixed_KtSkBq", "info": "react-tooltip__info_KtSkBq", "light": "react-tooltip__light_KtSkBq", "noArrow": "react-tooltip__no-arrow_KtSkBq", "show": "react-tooltip__show_KtSkBq", "success": "react-tooltip__success_KtSkBq", "tooltip": "react-tooltip__tooltip_KtSkBq", "warning": "react-tooltip__warning_KtSkBq" };
712
-
713
- // src/components/Tooltip/Tooltip.tsx
714
- var import_jsx_runtime3 = require("react/jsx-runtime");
715
- var Tooltip = ({
716
- // props
717
- id,
718
- className,
719
- classNameArrow,
720
- variant = "dark",
721
- anchorId,
722
- anchorSelect,
723
- place = "top",
724
- offset = 10,
725
- events = ["hover"],
726
- openOnClick = false,
727
- positionStrategy = "absolute",
728
- middlewares,
729
- wrapper: WrapperElement,
730
- delayShow = 0,
731
- delayHide = 0,
732
- float = false,
733
- noArrow = false,
734
- clickable = false,
735
- closeOnEsc = false,
736
- style: externalStyles,
737
- position,
738
- afterShow,
739
- afterHide,
740
- // props handled by controller
741
- content,
742
- isOpen,
743
- setIsOpen,
744
- activeAnchor,
745
- setActiveAnchor
746
- }) => {
747
- const tooltipRef = (0, import_react4.useRef)(null);
748
- const tooltipArrowRef = (0, import_react4.useRef)(null);
749
- const tooltipShowDelayTimerRef = (0, import_react4.useRef)(null);
750
- const tooltipHideDelayTimerRef = (0, import_react4.useRef)(null);
751
- const [actualPlacement, setActualPlacement] = (0, import_react4.useState)(place);
752
- const [inlineStyles, setInlineStyles] = (0, import_react4.useState)({});
753
- const [inlineArrowStyles, setInlineArrowStyles] = (0, import_react4.useState)({});
754
- const [show, setShow] = (0, import_react4.useState)(false);
755
- const [rendered, setRendered] = (0, import_react4.useState)(false);
756
- const wasShowing = (0, import_react4.useRef)(false);
757
- const lastFloatPosition = (0, import_react4.useRef)(null);
758
- const { anchorRefs, setActiveAnchor: setProviderActiveAnchor } = useTooltip(id);
759
- const hoveringTooltip = (0, import_react4.useRef)(false);
760
- const [anchorsBySelect, setAnchorsBySelect] = (0, import_react4.useState)([]);
761
- const mounted = (0, import_react4.useRef)(false);
762
- const shouldOpenOnClick = openOnClick || events.includes("click");
763
- use_isomorphic_layout_effect_default(() => {
764
- mounted.current = true;
765
- return () => {
766
- mounted.current = false;
767
- };
768
- }, []);
769
- (0, import_react4.useEffect)(() => {
770
- if (!show) {
771
- const timeout = setTimeout(() => {
772
- setRendered(false);
773
- }, 150);
774
- return () => {
775
- clearTimeout(timeout);
776
- };
777
- }
778
- return () => null;
779
- }, [show]);
780
- const handleShow = (value) => {
781
- if (!mounted.current) {
782
- return;
783
- }
784
- if (value) {
785
- setRendered(true);
786
- }
787
- setTimeout(() => {
788
- if (!mounted.current) {
789
- return;
790
- }
791
- setIsOpen == null ? void 0 : setIsOpen(value);
792
- if (isOpen === void 0) {
793
- setShow(value);
794
- }
795
- }, 10);
796
- };
797
- (0, import_react4.useEffect)(() => {
798
- if (isOpen === void 0) {
799
- return () => null;
800
- }
801
- if (isOpen) {
802
- setRendered(true);
803
- }
804
- const timeout = setTimeout(() => {
805
- setShow(isOpen);
806
- }, 10);
807
- return () => {
808
- clearTimeout(timeout);
809
- };
810
- }, [isOpen]);
811
- (0, import_react4.useEffect)(() => {
812
- if (show === wasShowing.current) {
813
- return;
814
- }
815
- wasShowing.current = show;
816
- if (show) {
817
- afterShow == null ? void 0 : afterShow();
818
- } else {
819
- afterHide == null ? void 0 : afterHide();
820
- }
821
- }, [show]);
822
- const handleShowTooltipDelayed = () => {
823
- if (tooltipShowDelayTimerRef.current) {
824
- clearTimeout(tooltipShowDelayTimerRef.current);
825
- }
826
- tooltipShowDelayTimerRef.current = setTimeout(() => {
827
- handleShow(true);
828
- }, delayShow);
829
- };
830
- const handleHideTooltipDelayed = (delay = delayHide) => {
831
- if (tooltipHideDelayTimerRef.current) {
832
- clearTimeout(tooltipHideDelayTimerRef.current);
833
- }
834
- tooltipHideDelayTimerRef.current = setTimeout(() => {
835
- if (hoveringTooltip.current) {
836
- return;
837
- }
838
- handleShow(false);
839
- }, delay);
840
- };
841
- const handleShowTooltip = (event) => {
842
- var _a;
843
- if (!event) {
844
- return;
845
- }
846
- if (delayShow) {
847
- handleShowTooltipDelayed();
848
- } else {
849
- handleShow(true);
850
- }
851
- const target = (_a = event.currentTarget) != null ? _a : event.target;
852
- setActiveAnchor(target);
853
- setProviderActiveAnchor({ current: target });
854
- if (tooltipHideDelayTimerRef.current) {
855
- clearTimeout(tooltipHideDelayTimerRef.current);
856
- }
857
- };
858
- const handleHideTooltip = () => {
859
- if (clickable) {
860
- handleHideTooltipDelayed(delayHide || 100);
861
- } else if (delayHide) {
862
- handleHideTooltipDelayed();
863
- } else {
864
- handleShow(false);
865
- }
866
- if (tooltipShowDelayTimerRef.current) {
867
- clearTimeout(tooltipShowDelayTimerRef.current);
868
- }
869
- };
870
- const handleTooltipPosition = ({ x: x3, y: y3 }) => {
871
- const virtualElement = {
872
- getBoundingClientRect() {
873
- return {
874
- x: x3,
875
- y: y3,
876
- width: 0,
877
- height: 0,
878
- top: y3,
879
- left: x3,
880
- right: x3,
881
- bottom: y3
882
- };
883
- }
884
- };
885
- computeTooltipPosition({
886
- place,
887
- offset,
888
- elementReference: virtualElement,
889
- tooltipReference: tooltipRef.current,
890
- tooltipArrowReference: tooltipArrowRef.current,
891
- strategy: positionStrategy,
892
- middlewares
893
- }).then((computedStylesData) => {
894
- if (Object.keys(computedStylesData.tooltipStyles).length) {
895
- setInlineStyles(computedStylesData.tooltipStyles);
896
- }
897
- if (Object.keys(computedStylesData.tooltipArrowStyles).length) {
898
- setInlineArrowStyles(computedStylesData.tooltipArrowStyles);
899
- }
900
- setActualPlacement(computedStylesData.place);
901
- });
902
- };
903
- const handleMouseMove = (event) => {
904
- if (!event) {
905
- return;
906
- }
907
- const mouseEvent = event;
908
- const mousePosition = {
909
- x: mouseEvent.clientX,
910
- y: mouseEvent.clientY
911
- };
912
- handleTooltipPosition(mousePosition);
913
- lastFloatPosition.current = mousePosition;
914
- };
915
- const handleClickTooltipAnchor = (event) => {
916
- handleShowTooltip(event);
917
- if (delayHide) {
918
- handleHideTooltipDelayed();
919
- }
920
- };
921
- const handleClickOutsideAnchors = (event) => {
922
- var _a;
923
- const anchorById = document.querySelector(`[id='${anchorId}']`);
924
- const anchors = [anchorById, ...anchorsBySelect];
925
- if (anchors.some((anchor) => anchor == null ? void 0 : anchor.contains(event.target))) {
926
- return;
927
- }
928
- if ((_a = tooltipRef.current) == null ? void 0 : _a.contains(event.target)) {
929
- return;
930
- }
931
- handleShow(false);
932
- };
933
- const handleEsc = (event) => {
934
- if (event.key !== "Escape") {
935
- return;
936
- }
937
- handleShow(false);
938
- };
939
- const debouncedHandleShowTooltip = debounce_default(handleShowTooltip, 50);
940
- const debouncedHandleHideTooltip = debounce_default(handleHideTooltip, 50);
941
- (0, import_react4.useEffect)(() => {
942
- var _a, _b;
943
- const elementRefs = new Set(anchorRefs);
944
- anchorsBySelect.forEach((anchor) => {
945
- elementRefs.add({ current: anchor });
946
- });
947
- const anchorById = document.querySelector(`[id='${anchorId}']`);
948
- if (anchorById) {
949
- elementRefs.add({ current: anchorById });
950
- }
951
- if (closeOnEsc) {
952
- window.addEventListener("keydown", handleEsc);
953
- }
954
- const enabledEvents = [];
955
- if (shouldOpenOnClick) {
956
- window.addEventListener("click", handleClickOutsideAnchors);
957
- enabledEvents.push({ event: "click", listener: handleClickTooltipAnchor });
958
- } else {
959
- enabledEvents.push(
960
- { event: "mouseenter", listener: debouncedHandleShowTooltip },
961
- { event: "mouseleave", listener: debouncedHandleHideTooltip },
962
- { event: "focus", listener: debouncedHandleShowTooltip },
963
- { event: "blur", listener: debouncedHandleHideTooltip }
964
- );
965
- if (float) {
966
- enabledEvents.push({
967
- event: "mousemove",
968
- listener: handleMouseMove
969
- });
970
- }
971
- }
972
- const handleMouseEnterTooltip = () => {
973
- hoveringTooltip.current = true;
974
- };
975
- const handleMouseLeaveTooltip = () => {
976
- hoveringTooltip.current = false;
977
- handleHideTooltip();
978
- };
979
- if (clickable && !shouldOpenOnClick) {
980
- (_a = tooltipRef.current) == null ? void 0 : _a.addEventListener("mouseenter", handleMouseEnterTooltip);
981
- (_b = tooltipRef.current) == null ? void 0 : _b.addEventListener("mouseleave", handleMouseLeaveTooltip);
982
- }
983
- enabledEvents.forEach(({ event, listener }) => {
984
- elementRefs.forEach((ref) => {
985
- var _a2;
986
- (_a2 = ref.current) == null ? void 0 : _a2.addEventListener(event, listener);
987
- });
988
- });
989
- return () => {
990
- var _a2, _b2;
991
- if (shouldOpenOnClick) {
992
- window.removeEventListener("click", handleClickOutsideAnchors);
993
- }
994
- if (closeOnEsc) {
995
- window.removeEventListener("keydown", handleEsc);
996
- }
997
- if (clickable && !shouldOpenOnClick) {
998
- (_a2 = tooltipRef.current) == null ? void 0 : _a2.removeEventListener("mouseenter", handleMouseEnterTooltip);
999
- (_b2 = tooltipRef.current) == null ? void 0 : _b2.removeEventListener("mouseleave", handleMouseLeaveTooltip);
1000
- }
1001
- enabledEvents.forEach(({ event, listener }) => {
1002
- elementRefs.forEach((ref) => {
1003
- var _a3;
1004
- (_a3 = ref.current) == null ? void 0 : _a3.removeEventListener(event, listener);
1005
- });
1006
- });
1007
- };
1008
- }, [rendered, anchorRefs, anchorsBySelect, closeOnEsc, events]);
1009
- (0, import_react4.useEffect)(() => {
1010
- let selector = anchorSelect != null ? anchorSelect : "";
1011
- if (!selector && id) {
1012
- selector = `[data-tooltip-id='${id}']`;
1013
- }
1014
- const documentObserverCallback = (mutationList) => {
1015
- const newAnchors = [];
1016
- mutationList.forEach((mutation) => {
1017
- if (mutation.type === "attributes" && mutation.attributeName === "data-tooltip-id") {
1018
- const newId = mutation.target.getAttribute("data-tooltip-id");
1019
- if (newId === id) {
1020
- newAnchors.push(mutation.target);
1021
- }
1022
- }
1023
- if (mutation.type !== "childList") {
1024
- return;
1025
- }
1026
- if (activeAnchor) {
1027
- ;
1028
- [...mutation.removedNodes].some((node) => {
1029
- if (node.contains(activeAnchor)) {
1030
- setRendered(false);
1031
- handleShow(false);
1032
- setActiveAnchor(null);
1033
- return true;
1034
- }
1035
- return false;
1036
- });
1037
- }
1038
- if (!selector) {
1039
- return;
1040
- }
1041
- try {
1042
- const elements = [...mutation.addedNodes].filter((node) => node.nodeType === 1);
1043
- newAnchors.push(
1044
- ...elements.filter(
1045
- (element) => element.matches(selector)
1046
- )
1047
- );
1048
- newAnchors.push(
1049
- ...elements.flatMap(
1050
- (element) => [...element.querySelectorAll(selector)]
1051
- )
1052
- );
1053
- } catch (e2) {
1054
- }
1055
- });
1056
- if (newAnchors.length) {
1057
- setAnchorsBySelect((anchors) => [...anchors, ...newAnchors]);
1058
- }
1059
- };
1060
- const documentObserver = new MutationObserver(documentObserverCallback);
1061
- documentObserver.observe(document.body, {
1062
- childList: true,
1063
- subtree: true,
1064
- attributes: true,
1065
- attributeFilter: ["data-tooltip-id"]
1066
- });
1067
- return () => {
1068
- documentObserver.disconnect();
1069
- };
1070
- }, [id, anchorSelect, activeAnchor]);
1071
- (0, import_react4.useEffect)(() => {
1072
- if (position) {
1073
- handleTooltipPosition(position);
1074
- return;
1075
- }
1076
- if (float) {
1077
- if (lastFloatPosition.current) {
1078
- handleTooltipPosition(lastFloatPosition.current);
1079
- }
1080
- return;
1081
- }
1082
- computeTooltipPosition({
1083
- place,
1084
- offset,
1085
- elementReference: activeAnchor,
1086
- tooltipReference: tooltipRef.current,
1087
- tooltipArrowReference: tooltipArrowRef.current,
1088
- strategy: positionStrategy,
1089
- middlewares
1090
- }).then((computedStylesData) => {
1091
- if (!mounted.current) {
1092
- return;
1093
- }
1094
- if (Object.keys(computedStylesData.tooltipStyles).length) {
1095
- setInlineStyles(computedStylesData.tooltipStyles);
1096
- }
1097
- if (Object.keys(computedStylesData.tooltipArrowStyles).length) {
1098
- setInlineArrowStyles(computedStylesData.tooltipArrowStyles);
1099
- }
1100
- setActualPlacement(computedStylesData.place);
1101
- });
1102
- }, [show, activeAnchor, content, place, offset, positionStrategy, position]);
1103
- (0, import_react4.useEffect)(() => {
1104
- var _a;
1105
- const anchorById = document.querySelector(`[id='${anchorId}']`);
1106
- const anchors = [...anchorsBySelect, anchorById];
1107
- if (!activeAnchor || !anchors.includes(activeAnchor)) {
1108
- setActiveAnchor((_a = anchorsBySelect[0]) != null ? _a : anchorById);
1109
- }
1110
- }, [anchorId, anchorsBySelect, activeAnchor]);
1111
- (0, import_react4.useEffect)(() => {
1112
- return () => {
1113
- if (tooltipShowDelayTimerRef.current) {
1114
- clearTimeout(tooltipShowDelayTimerRef.current);
1115
- }
1116
- if (tooltipHideDelayTimerRef.current) {
1117
- clearTimeout(tooltipHideDelayTimerRef.current);
1118
- }
1119
- };
1120
- }, []);
1121
- (0, import_react4.useEffect)(() => {
1122
- let selector = anchorSelect;
1123
- if (!selector && id) {
1124
- selector = `[data-tooltip-id='${id}']`;
1125
- }
1126
- if (!selector) {
1127
- return;
1128
- }
1129
- try {
1130
- const anchors = Array.from(document.querySelectorAll(selector));
1131
- setAnchorsBySelect(anchors);
1132
- } catch (e2) {
1133
- setAnchorsBySelect([]);
1134
- }
1135
- }, [id, anchorSelect]);
1136
- const canShow = content && show && Object.keys(inlineStyles).length > 0;
1137
- return rendered ? /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
1138
- WrapperElement,
1139
- {
1140
- id,
1141
- role: "tooltip",
1142
- className: (0, import_classnames2.default)(
1143
- "react-tooltip",
1144
- styles_module_default["tooltip"],
1145
- styles_module_default[variant],
1146
- className,
1147
- `react-tooltip__place-${actualPlacement}`,
1148
- {
1149
- [styles_module_default["show"]]: canShow,
1150
- [styles_module_default["fixed"]]: positionStrategy === "fixed",
1151
- [styles_module_default["clickable"]]: clickable
1152
- }
1153
- ),
1154
- style: { ...externalStyles, ...inlineStyles },
1155
- ref: tooltipRef,
1156
- children: [
1157
- content,
1158
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
1159
- WrapperElement,
1160
- {
1161
- className: (0, import_classnames2.default)("react-tooltip-arrow", styles_module_default["arrow"], classNameArrow, {
1162
- /**
1163
- * changed from dash `no-arrow` to camelcase because of:
1164
- * https://github.com/indooorsman/esbuild-css-modules-plugin/issues/42
1165
- */
1166
- [styles_module_default["noArrow"]]: noArrow
1167
- }),
1168
- style: inlineArrowStyles,
1169
- ref: tooltipArrowRef
1170
- }
1171
- )
1172
- ]
1173
- }
1174
- ) : null;
1175
- };
1176
- var Tooltip_default = Tooltip;
1177
-
1178
- // src/components/TooltipContent/TooltipContent.tsx
1179
- var import_jsx_runtime4 = require("react/jsx-runtime");
1180
- var TooltipContent = ({ content }) => {
1181
- return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { dangerouslySetInnerHTML: { __html: content } });
1182
- };
1183
- var TooltipContent_default = TooltipContent;
1184
-
1185
- // src/components/TooltipController/TooltipController.tsx
1186
- var import_jsx_runtime5 = require("react/jsx-runtime");
1187
- var TooltipController = ({
1188
- id,
1189
- anchorId,
1190
- anchorSelect,
1191
- content,
1192
- html,
1193
- render,
1194
- className,
1195
- classNameArrow,
1196
- variant = "dark",
1197
- place = "top",
1198
- offset = 10,
1199
- wrapper = "div",
1200
- children = null,
1201
- events = ["hover"],
1202
- openOnClick = false,
1203
- positionStrategy = "absolute",
1204
- middlewares,
1205
- delayShow = 0,
1206
- delayHide = 0,
1207
- float = false,
1208
- noArrow = false,
1209
- clickable = false,
1210
- closeOnEsc = false,
1211
- style,
1212
- position,
1213
- isOpen,
1214
- setIsOpen,
1215
- afterShow,
1216
- afterHide
1217
- }) => {
1218
- const [tooltipContent, setTooltipContent] = (0, import_react5.useState)(content);
1219
- const [tooltipHtml, setTooltipHtml] = (0, import_react5.useState)(html);
1220
- const [tooltipPlace, setTooltipPlace] = (0, import_react5.useState)(place);
1221
- const [tooltipVariant, setTooltipVariant] = (0, import_react5.useState)(variant);
1222
- const [tooltipOffset, setTooltipOffset] = (0, import_react5.useState)(offset);
1223
- const [tooltipDelayShow, setTooltipDelayShow] = (0, import_react5.useState)(delayShow);
1224
- const [tooltipDelayHide, setTooltipDelayHide] = (0, import_react5.useState)(delayHide);
1225
- const [tooltipFloat, setTooltipFloat] = (0, import_react5.useState)(float);
1226
- const [tooltipWrapper, setTooltipWrapper] = (0, import_react5.useState)(wrapper);
1227
- const [tooltipEvents, setTooltipEvents] = (0, import_react5.useState)(events);
1228
- const [tooltipPositionStrategy, setTooltipPositionStrategy] = (0, import_react5.useState)(positionStrategy);
1229
- const [activeAnchor, setActiveAnchor] = (0, import_react5.useState)(null);
1230
- const { anchorRefs, activeAnchor: providerActiveAnchor } = useTooltip(id);
1231
- const getDataAttributesFromAnchorElement = (elementReference) => {
1232
- const dataAttributes = elementReference == null ? void 0 : elementReference.getAttributeNames().reduce((acc, name) => {
1233
- var _a;
1234
- if (name.startsWith("data-tooltip-")) {
1235
- const parsedAttribute = name.replace(/^data-tooltip-/, "");
1236
- acc[parsedAttribute] = (_a = elementReference == null ? void 0 : elementReference.getAttribute(name)) != null ? _a : null;
1237
- }
1238
- return acc;
1239
- }, {});
1240
- return dataAttributes;
1241
- };
1242
- const applyAllDataAttributesFromAnchorElement = (dataAttributes) => {
1243
- const handleDataAttributes = {
1244
- place: (value) => {
1245
- setTooltipPlace(value != null ? value : place);
1246
- },
1247
- content: (value) => {
1248
- setTooltipContent(value != null ? value : content);
1249
- },
1250
- html: (value) => {
1251
- setTooltipHtml(value != null ? value : html);
1252
- },
1253
- variant: (value) => {
1254
- setTooltipVariant(value != null ? value : variant);
1255
- },
1256
- offset: (value) => {
1257
- setTooltipOffset(value === null ? offset : Number(value));
1258
- },
1259
- wrapper: (value) => {
1260
- setTooltipWrapper(value != null ? value : wrapper);
1261
- },
1262
- events: (value) => {
1263
- const parsed = value == null ? void 0 : value.split(" ");
1264
- setTooltipEvents(parsed != null ? parsed : events);
1265
- },
1266
- "position-strategy": (value) => {
1267
- setTooltipPositionStrategy(value != null ? value : positionStrategy);
1268
- },
1269
- "delay-show": (value) => {
1270
- setTooltipDelayShow(value === null ? delayShow : Number(value));
1271
- },
1272
- "delay-hide": (value) => {
1273
- setTooltipDelayHide(value === null ? delayHide : Number(value));
1274
- },
1275
- float: (value) => {
1276
- setTooltipFloat(value === null ? float : value === "true");
1277
- }
1278
- };
1279
- Object.values(handleDataAttributes).forEach((handler) => handler(null));
1280
- Object.entries(dataAttributes).forEach(([key, value]) => {
1281
- var _a;
1282
- (_a = handleDataAttributes[key]) == null ? void 0 : _a.call(handleDataAttributes, value);
1283
- });
1284
- };
1285
- (0, import_react5.useEffect)(() => {
1286
- setTooltipContent(content);
1287
- }, [content]);
1288
- (0, import_react5.useEffect)(() => {
1289
- setTooltipHtml(html);
1290
- }, [html]);
1291
- (0, import_react5.useEffect)(() => {
1292
- setTooltipPlace(place);
1293
- }, [place]);
1294
- (0, import_react5.useEffect)(() => {
1295
- var _a;
1296
- const elementRefs = new Set(anchorRefs);
1297
- let selector = anchorSelect;
1298
- if (!selector && id) {
1299
- selector = `[data-tooltip-id='${id}']`;
1300
- }
1301
- if (selector) {
1302
- try {
1303
- const anchorsBySelect = document.querySelectorAll(selector);
1304
- anchorsBySelect.forEach((anchor) => {
1305
- elementRefs.add({ current: anchor });
1306
- });
1307
- } catch (e2) {
1308
- if (true) {
1309
- console.warn(`[react-tooltip] "${anchorSelect}" is not a valid CSS selector`);
1310
- }
1311
- }
1312
- }
1313
- const anchorById = document.querySelector(`[id='${anchorId}']`);
1314
- if (anchorById) {
1315
- elementRefs.add({ current: anchorById });
1316
- }
1317
- if (!elementRefs.size) {
1318
- return () => null;
1319
- }
1320
- const anchorElement = (_a = activeAnchor != null ? activeAnchor : anchorById) != null ? _a : providerActiveAnchor.current;
1321
- const observerCallback = (mutationList) => {
1322
- mutationList.forEach((mutation) => {
1323
- var _a2;
1324
- if (!anchorElement || mutation.type !== "attributes" || !((_a2 = mutation.attributeName) == null ? void 0 : _a2.startsWith("data-tooltip-"))) {
1325
- return;
1326
- }
1327
- const dataAttributes = getDataAttributesFromAnchorElement(anchorElement);
1328
- applyAllDataAttributesFromAnchorElement(dataAttributes);
1329
- });
1330
- };
1331
- const observer = new MutationObserver(observerCallback);
1332
- const observerConfig = { attributes: true, childList: false, subtree: false };
1333
- if (anchorElement) {
1334
- const dataAttributes = getDataAttributesFromAnchorElement(anchorElement);
1335
- applyAllDataAttributesFromAnchorElement(dataAttributes);
1336
- observer.observe(anchorElement, observerConfig);
1337
- }
1338
- return () => {
1339
- observer.disconnect();
1340
- };
1341
- }, [anchorRefs, providerActiveAnchor, activeAnchor, anchorId, anchorSelect]);
1342
- let renderedContent = children;
1343
- if (render) {
1344
- renderedContent = render({ content: tooltipContent != null ? tooltipContent : null, activeAnchor });
1345
- } else if (tooltipContent) {
1346
- renderedContent = tooltipContent;
1347
- }
1348
- if (tooltipHtml) {
1349
- renderedContent = /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(TooltipContent_default, { content: tooltipHtml });
1350
- }
1351
- const props = {
1352
- id,
1353
- anchorId,
1354
- anchorSelect,
1355
- className,
1356
- classNameArrow,
1357
- content: renderedContent,
1358
- place: tooltipPlace,
1359
- variant: tooltipVariant,
1360
- offset: tooltipOffset,
1361
- wrapper: tooltipWrapper,
1362
- events: tooltipEvents,
1363
- openOnClick,
1364
- positionStrategy: tooltipPositionStrategy,
1365
- middlewares,
1366
- delayShow: tooltipDelayShow,
1367
- delayHide: tooltipDelayHide,
1368
- float: tooltipFloat,
1369
- noArrow,
1370
- clickable,
1371
- closeOnEsc,
1372
- style,
1373
- position,
1374
- isOpen,
1375
- setIsOpen,
1376
- afterShow,
1377
- afterHide,
1378
- activeAnchor,
1379
- setActiveAnchor: (anchor) => setActiveAnchor(anchor)
1380
- };
1381
- return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Tooltip_default, { ...props });
1382
- };
1383
- var TooltipController_default = TooltipController;
1384
- /*! Bundled license information:
1385
-
1386
- classnames/index.js:
1387
- (*!
1388
- Copyright (c) 2018 Jed Watson.
1389
- Licensed under the MIT License (MIT), see
1390
- http://jedwatson.github.io/classnames
1391
- *)
1392
- */
1393
- //# sourceMappingURL=react-tooltip.cjs.js.map