@taskon/widget-react 0.0.1-beta.2 → 0.0.1-beta.4
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/README.md +56 -17
- package/dist/CommunityTaskList.css +1593 -1741
- package/dist/EligibilityInfo.css +1275 -582
- package/dist/LeaderboardWidget.css +355 -152
- package/dist/PageBuilder.css +0 -2
- package/dist/Quest.css +1140 -903
- package/dist/TaskOnProvider.css +50 -31
- package/dist/UserCenterWidget.css +108 -237
- package/dist/UserCenterWidget2.css +2016 -711
- package/dist/chunks/{CommunityTaskList-BlH1Wdd5.js → CommunityTaskList-C9Gv8KOF.js} +962 -827
- package/dist/chunks/{EligibilityInfo-C7GZ2G5u.js → EligibilityInfo-D-Fuy9GE.js} +1137 -449
- package/dist/chunks/{LeaderboardWidget-CmYfDeHV.js → LeaderboardWidget-BV2D2q1N.js} +15 -10
- package/dist/chunks/{PageBuilder-Bw0zSkFh.js → PageBuilder-DQoU4Mwf.js} +5 -5
- package/dist/chunks/{Quest-DKFZ-pPU.js → Quest-B5NyVr3o.js} +516 -325
- package/dist/chunks/{TaskOnProvider-BD6Vp2x8.js → TaskOnProvider-93UxARFo.js} +2 -207
- package/dist/chunks/{ThemeProvider-wnSXrNQb.js → ThemeProvider-CPI_roeh.js} +249 -57
- package/dist/chunks/{UserCenterWidget-Cw6h_5hT.js → UserCenterWidget-BRtigY_S.js} +206 -1002
- package/dist/chunks/UserCenterWidget-cADBSVg7.js +8358 -0
- package/dist/chunks/{WidgetShell-D_5OjvNZ.js → dynamic-import-helper-DwXlQC0S.js} +607 -40
- package/dist/chunks/useToast-CaRkylKe.js +304 -0
- package/dist/chunks/{usercenter-ja-uu-XfVF9.js → usercenter-ja-B2465c1O.js} +4 -10
- package/dist/chunks/{usercenter-ko-DYgUOVzd.js → usercenter-ko-xAEYxqLg.js} +4 -10
- package/dist/community-task.d.ts +34 -3
- package/dist/community-task.js +1 -1
- package/dist/core.d.ts +40 -3
- package/dist/core.js +9 -10
- package/dist/dynamic-import-helper.css +596 -289
- package/dist/index.d.ts +207 -10
- package/dist/index.js +21 -19
- package/dist/leaderboard.d.ts +8 -1
- package/dist/leaderboard.js +2 -2
- package/dist/page-builder.js +1 -1
- package/dist/quest.d.ts +8 -2
- package/dist/quest.js +1 -1
- package/dist/user-center.d.ts +20 -136
- package/dist/user-center.js +19 -236
- package/package.json +10 -2
- package/dist/TipPopover.css +0 -210
- package/dist/WidgetShell.css +0 -182
- package/dist/chunks/TipPopover-BrW8jo71.js +0 -2926
- package/dist/chunks/UserCenterWidget-BE329iS7.js +0 -3546
- package/dist/chunks/dynamic-import-helper-DxEFwm31.js +0 -537
- package/dist/chunks/useToast-B-wyO5zL.js +0 -93
- package/dist/chunks/useWidgetLocale-JDelxtt8.js +0 -74
|
@@ -1,2926 +0,0 @@
|
|
|
1
|
-
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
-
import * as React from "react";
|
|
3
|
-
import { forwardRef, useRef, useCallback, useImperativeHandle, useEffect, useContext, useState, useMemo, useLayoutEffect } from "react";
|
|
4
|
-
import { createUserApi } from "@taskon/core";
|
|
5
|
-
import { d as TaskOnContext, b as useTaskOnContext, P as Primitive, e as useLayoutEffect2, f as createContextScope, g as useComposedRefs, h as useCallbackRef, i as useControllableState, j as composeEventHandlers, k as Presence, l as Portal$1, m as createSlot, D as DismissableLayer } from "./ThemeProvider-wnSXrNQb.js";
|
|
6
|
-
import { b as useToast } from "./useToast-B-wyO5zL.js";
|
|
7
|
-
import { a as useId, h as hideOthers, R as ReactRemoveScroll, b as useFocusGuards, F as FocusScope } from "./WidgetShell-D_5OjvNZ.js";
|
|
8
|
-
import * as ReactDOM from "react-dom";
|
|
9
|
-
import '../TipPopover.css';const Input = forwardRef(
|
|
10
|
-
function Input2({
|
|
11
|
-
value,
|
|
12
|
-
onChange,
|
|
13
|
-
type = "text",
|
|
14
|
-
inputMode,
|
|
15
|
-
maxLength,
|
|
16
|
-
disabled = false,
|
|
17
|
-
placeholder,
|
|
18
|
-
hasError = false,
|
|
19
|
-
error,
|
|
20
|
-
className,
|
|
21
|
-
autoFocus = false,
|
|
22
|
-
onBlur,
|
|
23
|
-
onFocus,
|
|
24
|
-
onEnter,
|
|
25
|
-
rightSlot,
|
|
26
|
-
formatValue
|
|
27
|
-
}, ref) {
|
|
28
|
-
const inputRef = useRef(null);
|
|
29
|
-
const isError = hasError || !!error;
|
|
30
|
-
const focus = useCallback(() => {
|
|
31
|
-
var _a;
|
|
32
|
-
(_a = inputRef.current) == null ? void 0 : _a.focus();
|
|
33
|
-
}, []);
|
|
34
|
-
const blur = useCallback(() => {
|
|
35
|
-
var _a;
|
|
36
|
-
(_a = inputRef.current) == null ? void 0 : _a.blur();
|
|
37
|
-
}, []);
|
|
38
|
-
const getElement = useCallback(() => {
|
|
39
|
-
return inputRef.current;
|
|
40
|
-
}, []);
|
|
41
|
-
useImperativeHandle(
|
|
42
|
-
ref,
|
|
43
|
-
() => ({
|
|
44
|
-
focus,
|
|
45
|
-
blur,
|
|
46
|
-
getElement
|
|
47
|
-
}),
|
|
48
|
-
[focus, blur, getElement]
|
|
49
|
-
);
|
|
50
|
-
useEffect(() => {
|
|
51
|
-
var _a;
|
|
52
|
-
if (autoFocus) {
|
|
53
|
-
(_a = inputRef.current) == null ? void 0 : _a.focus();
|
|
54
|
-
}
|
|
55
|
-
}, [autoFocus]);
|
|
56
|
-
const handleChange = useCallback(
|
|
57
|
-
(e) => {
|
|
58
|
-
let newValue = e.target.value;
|
|
59
|
-
if (formatValue) {
|
|
60
|
-
newValue = formatValue(newValue);
|
|
61
|
-
}
|
|
62
|
-
onChange(newValue);
|
|
63
|
-
},
|
|
64
|
-
[onChange, formatValue]
|
|
65
|
-
);
|
|
66
|
-
const handleKeyDown = useCallback(
|
|
67
|
-
(e) => {
|
|
68
|
-
if (e.key === "Enter" && onEnter) {
|
|
69
|
-
onEnter(e);
|
|
70
|
-
}
|
|
71
|
-
},
|
|
72
|
-
[onEnter]
|
|
73
|
-
);
|
|
74
|
-
const needWrapper = rightSlot || error;
|
|
75
|
-
const inputElement = /* @__PURE__ */ jsx(
|
|
76
|
-
"input",
|
|
77
|
-
{
|
|
78
|
-
ref: inputRef,
|
|
79
|
-
className: `taskon-input ${isError ? "taskon-input--error" : ""} ${!needWrapper ? className || "" : ""}`,
|
|
80
|
-
type,
|
|
81
|
-
inputMode,
|
|
82
|
-
value,
|
|
83
|
-
onChange: handleChange,
|
|
84
|
-
maxLength,
|
|
85
|
-
disabled,
|
|
86
|
-
placeholder,
|
|
87
|
-
onBlur,
|
|
88
|
-
onFocus,
|
|
89
|
-
onKeyDown: handleKeyDown
|
|
90
|
-
}
|
|
91
|
-
);
|
|
92
|
-
if (!needWrapper) {
|
|
93
|
-
return inputElement;
|
|
94
|
-
}
|
|
95
|
-
return /* @__PURE__ */ jsxs("div", { className: `taskon-input-wrapper ${className || ""}`, children: [
|
|
96
|
-
/* @__PURE__ */ jsxs("div", { className: `taskon-input-container ${isError ? "taskon-input-container--error" : ""}`, children: [
|
|
97
|
-
/* @__PURE__ */ jsx(
|
|
98
|
-
"input",
|
|
99
|
-
{
|
|
100
|
-
ref: inputRef,
|
|
101
|
-
className: "taskon-input taskon-input--in-container",
|
|
102
|
-
type,
|
|
103
|
-
inputMode,
|
|
104
|
-
value,
|
|
105
|
-
onChange: handleChange,
|
|
106
|
-
maxLength,
|
|
107
|
-
disabled,
|
|
108
|
-
placeholder,
|
|
109
|
-
onBlur,
|
|
110
|
-
onFocus,
|
|
111
|
-
onKeyDown: handleKeyDown
|
|
112
|
-
}
|
|
113
|
-
),
|
|
114
|
-
rightSlot && /* @__PURE__ */ jsx("div", { className: "taskon-input-slot", children: rightSlot })
|
|
115
|
-
] }),
|
|
116
|
-
error && /* @__PURE__ */ jsx("p", { className: "taskon-input-error", children: error })
|
|
117
|
-
] });
|
|
118
|
-
}
|
|
119
|
-
);
|
|
120
|
-
const DEFAULT_OAUTH_TOOL_URL = "https://generalauthservice.com";
|
|
121
|
-
const OAUTH_POPUP_CONFIG = {
|
|
122
|
-
/** 窗口宽度 */
|
|
123
|
-
width: 600,
|
|
124
|
-
/** 窗口高度 */
|
|
125
|
-
height: 700,
|
|
126
|
-
/** 窗口名称(同名窗口会复用) */
|
|
127
|
-
name: "taskon-oauth"
|
|
128
|
-
};
|
|
129
|
-
function getPopupPosition(width, height) {
|
|
130
|
-
const screenLeft = window.screenLeft ?? window.screenX ?? 0;
|
|
131
|
-
const screenTop = window.screenTop ?? window.screenY ?? 0;
|
|
132
|
-
const left = Math.max(0, (window.screen.width - width) / 2 + screenLeft);
|
|
133
|
-
const top = Math.max(0, (window.screen.height - height) / 2 + screenTop);
|
|
134
|
-
return { left: Math.round(left), top: Math.round(top) };
|
|
135
|
-
}
|
|
136
|
-
function getOAuthToolUrl(snsType, baseUrl) {
|
|
137
|
-
const url = baseUrl || DEFAULT_OAUTH_TOOL_URL;
|
|
138
|
-
return `${url}/${snsType.toLowerCase()}`;
|
|
139
|
-
}
|
|
140
|
-
function openOAuthPopup(snsType, baseUrl) {
|
|
141
|
-
const url = getOAuthToolUrl(snsType, baseUrl);
|
|
142
|
-
const { width, height, name } = OAUTH_POPUP_CONFIG;
|
|
143
|
-
const { left, top } = getPopupPosition(width, height);
|
|
144
|
-
const features = [
|
|
145
|
-
`width=${width}`,
|
|
146
|
-
`height=${height}`,
|
|
147
|
-
`left=${left}`,
|
|
148
|
-
`top=${top}`,
|
|
149
|
-
"scrollbars=yes",
|
|
150
|
-
"resizable=yes"
|
|
151
|
-
].join(",");
|
|
152
|
-
return window.open(url, name, features);
|
|
153
|
-
}
|
|
154
|
-
function useBindSocialAccount({
|
|
155
|
-
snsType,
|
|
156
|
-
onSuccess,
|
|
157
|
-
onFailed,
|
|
158
|
-
onAuthSuccess
|
|
159
|
-
}) {
|
|
160
|
-
var _a;
|
|
161
|
-
const { toast } = useToast();
|
|
162
|
-
const context = useContext(TaskOnContext);
|
|
163
|
-
const client = (context == null ? void 0 : context.client) ?? null;
|
|
164
|
-
const userInfo = (context == null ? void 0 : context.userInfo) ?? null;
|
|
165
|
-
const refreshUserInfo = context == null ? void 0 : context.refreshUserInfo;
|
|
166
|
-
const oauthToolUrl = (_a = context == null ? void 0 : context.config) == null ? void 0 : _a.oauthToolUrl;
|
|
167
|
-
const [isWaitingAuth, setIsWaitingAuth] = useState(false);
|
|
168
|
-
const popupRef = useRef(null);
|
|
169
|
-
const isReAuthRef = useRef(false);
|
|
170
|
-
const bindWaitResolveRef = useRef(null);
|
|
171
|
-
const userApi = useMemo(() => {
|
|
172
|
-
if (!client) return null;
|
|
173
|
-
return createUserApi(client);
|
|
174
|
-
}, [client]);
|
|
175
|
-
const isBound = useMemo(() => {
|
|
176
|
-
if (!snsType || !(userInfo == null ? void 0 : userInfo.sns)) return false;
|
|
177
|
-
const snsTypeLower = snsType.toLowerCase();
|
|
178
|
-
return userInfo.sns.some((item) => item.sns_type.toLowerCase() === snsTypeLower);
|
|
179
|
-
}, [snsType, userInfo]);
|
|
180
|
-
const handleSuccess = useCallback(async () => {
|
|
181
|
-
var _a2;
|
|
182
|
-
await (onSuccess == null ? void 0 : onSuccess());
|
|
183
|
-
(_a2 = bindWaitResolveRef.current) == null ? void 0 : _a2.call(bindWaitResolveRef, true);
|
|
184
|
-
bindWaitResolveRef.current = null;
|
|
185
|
-
}, [onSuccess]);
|
|
186
|
-
const handleFailed = useCallback((error) => {
|
|
187
|
-
var _a2;
|
|
188
|
-
toast.error(error);
|
|
189
|
-
onFailed == null ? void 0 : onFailed(error);
|
|
190
|
-
(_a2 = bindWaitResolveRef.current) == null ? void 0 : _a2.call(bindWaitResolveRef, false);
|
|
191
|
-
bindWaitResolveRef.current = null;
|
|
192
|
-
}, [onFailed, toast]);
|
|
193
|
-
const startOAuth = useCallback(async (isReAuth, targetSnsType) => {
|
|
194
|
-
const effectiveSnsType = targetSnsType || snsType;
|
|
195
|
-
if (!effectiveSnsType) {
|
|
196
|
-
if (!isReAuth) {
|
|
197
|
-
await handleSuccess();
|
|
198
|
-
}
|
|
199
|
-
return;
|
|
200
|
-
}
|
|
201
|
-
if (!context || !userApi) {
|
|
202
|
-
if (!isReAuth) {
|
|
203
|
-
await handleSuccess();
|
|
204
|
-
}
|
|
205
|
-
return;
|
|
206
|
-
}
|
|
207
|
-
isReAuthRef.current = isReAuth;
|
|
208
|
-
const popup = openOAuthPopup(effectiveSnsType, oauthToolUrl);
|
|
209
|
-
if (!popup || popup.closed) {
|
|
210
|
-
handleFailed("Please allow popups to complete authorization");
|
|
211
|
-
return;
|
|
212
|
-
}
|
|
213
|
-
popupRef.current = popup;
|
|
214
|
-
setIsWaitingAuth(true);
|
|
215
|
-
let messageHandled = false;
|
|
216
|
-
const checkPopupClosed = setInterval(() => {
|
|
217
|
-
if (popup.closed) {
|
|
218
|
-
clearInterval(checkPopupClosed);
|
|
219
|
-
if (!messageHandled) {
|
|
220
|
-
setIsWaitingAuth(false);
|
|
221
|
-
window.removeEventListener("message", handleMessage);
|
|
222
|
-
handleFailed("Authorization cancelled");
|
|
223
|
-
}
|
|
224
|
-
}
|
|
225
|
-
}, 200);
|
|
226
|
-
const allowedOrigin = (oauthToolUrl || DEFAULT_OAUTH_TOOL_URL).replace(/\/$/, "");
|
|
227
|
-
const handleMessage = async (event) => {
|
|
228
|
-
var _a2;
|
|
229
|
-
if (event.source !== popup) return;
|
|
230
|
-
if (event.origin !== allowedOrigin) {
|
|
231
|
-
console.warn(`[TaskOn OAuth] Invalid origin: ${event.origin}, expected: ${allowedOrigin}`);
|
|
232
|
-
return;
|
|
233
|
-
}
|
|
234
|
-
const data = event.data;
|
|
235
|
-
if ((data == null ? void 0 : data.type) !== "taskon-oauth-result") return;
|
|
236
|
-
if (((_a2 = data.snsType) == null ? void 0 : _a2.toLowerCase()) !== (effectiveSnsType == null ? void 0 : effectiveSnsType.toLowerCase())) return;
|
|
237
|
-
messageHandled = true;
|
|
238
|
-
clearInterval(checkPopupClosed);
|
|
239
|
-
window.removeEventListener("message", handleMessage);
|
|
240
|
-
setIsWaitingAuth(false);
|
|
241
|
-
if (data.error || !data.token) {
|
|
242
|
-
handleFailed(data.error || "Authorization failed");
|
|
243
|
-
return;
|
|
244
|
-
}
|
|
245
|
-
if (isReAuthRef.current) {
|
|
246
|
-
await (onAuthSuccess == null ? void 0 : onAuthSuccess(data.token));
|
|
247
|
-
return;
|
|
248
|
-
}
|
|
249
|
-
try {
|
|
250
|
-
const isTelegram = effectiveSnsType.toLowerCase() === "telegram";
|
|
251
|
-
const result = await userApi.bindSNS({
|
|
252
|
-
sns_type: effectiveSnsType,
|
|
253
|
-
token: isTelegram ? "" : data.token,
|
|
254
|
-
tg_data: isTelegram ? JSON.parse(data.token) : void 0
|
|
255
|
-
});
|
|
256
|
-
if (result.result) {
|
|
257
|
-
await (refreshUserInfo == null ? void 0 : refreshUserInfo());
|
|
258
|
-
await handleSuccess();
|
|
259
|
-
} else if (result.email) {
|
|
260
|
-
handleFailed(`This account is already bound to ${result.email}`);
|
|
261
|
-
} else {
|
|
262
|
-
handleFailed("Failed to bind account");
|
|
263
|
-
}
|
|
264
|
-
} catch (e) {
|
|
265
|
-
const error = e;
|
|
266
|
-
handleFailed(error.message || "Failed to bind account");
|
|
267
|
-
}
|
|
268
|
-
};
|
|
269
|
-
window.addEventListener("message", handleMessage);
|
|
270
|
-
}, [snsType, context, userApi, oauthToolUrl, refreshUserInfo, handleSuccess, handleFailed, onAuthSuccess]);
|
|
271
|
-
const bindIfNeed = useCallback(async (targetSnsType) => {
|
|
272
|
-
const effectiveSnsType = targetSnsType || snsType;
|
|
273
|
-
if (effectiveSnsType && (userInfo == null ? void 0 : userInfo.sns)) {
|
|
274
|
-
const snsTypeLower = effectiveSnsType.toLowerCase();
|
|
275
|
-
const alreadyBound = userInfo.sns.some((item) => item.sns_type.toLowerCase() === snsTypeLower);
|
|
276
|
-
if (alreadyBound) {
|
|
277
|
-
await handleSuccess();
|
|
278
|
-
return;
|
|
279
|
-
}
|
|
280
|
-
} else if (!effectiveSnsType) {
|
|
281
|
-
await handleSuccess();
|
|
282
|
-
return;
|
|
283
|
-
}
|
|
284
|
-
await startOAuth(false, effectiveSnsType);
|
|
285
|
-
}, [snsType, userInfo, startOAuth, handleSuccess]);
|
|
286
|
-
const bindAndWait = useCallback(async (targetSnsType) => {
|
|
287
|
-
const effectiveSnsType = targetSnsType || snsType;
|
|
288
|
-
if (effectiveSnsType && (userInfo == null ? void 0 : userInfo.sns)) {
|
|
289
|
-
const snsTypeLower = effectiveSnsType.toLowerCase();
|
|
290
|
-
const alreadyBound = userInfo.sns.some((item) => item.sns_type.toLowerCase() === snsTypeLower);
|
|
291
|
-
if (alreadyBound) {
|
|
292
|
-
return true;
|
|
293
|
-
}
|
|
294
|
-
} else if (!effectiveSnsType) {
|
|
295
|
-
return true;
|
|
296
|
-
}
|
|
297
|
-
return new Promise((resolve) => {
|
|
298
|
-
bindWaitResolveRef.current = resolve;
|
|
299
|
-
startOAuth(false, effectiveSnsType);
|
|
300
|
-
});
|
|
301
|
-
}, [snsType, userInfo, startOAuth]);
|
|
302
|
-
const reAuth = useCallback(async () => {
|
|
303
|
-
await startOAuth(true);
|
|
304
|
-
}, [startOAuth]);
|
|
305
|
-
return {
|
|
306
|
-
bindIfNeed,
|
|
307
|
-
bindAndWait,
|
|
308
|
-
reAuth,
|
|
309
|
-
isWaitingAuth,
|
|
310
|
-
isBound
|
|
311
|
-
};
|
|
312
|
-
}
|
|
313
|
-
function useChainMap() {
|
|
314
|
-
const { chains } = useTaskOnContext();
|
|
315
|
-
const chainMap = useMemo(() => {
|
|
316
|
-
return Object.fromEntries(
|
|
317
|
-
chains.map((chain) => [chain.name.toLowerCase(), chain])
|
|
318
|
-
);
|
|
319
|
-
}, [chains]);
|
|
320
|
-
const getChainType = useMemo(() => {
|
|
321
|
-
return (chainName, defaultType) => {
|
|
322
|
-
if (!chainName) return defaultType;
|
|
323
|
-
const chain = chainMap[chainName.toLowerCase()];
|
|
324
|
-
return (chain == null ? void 0 : chain.chain_type) ?? defaultType;
|
|
325
|
-
};
|
|
326
|
-
}, [chainMap]);
|
|
327
|
-
return {
|
|
328
|
-
chainMap,
|
|
329
|
-
getChainType,
|
|
330
|
-
isLoaded: chains.length > 0
|
|
331
|
-
};
|
|
332
|
-
}
|
|
333
|
-
const sides = ["top", "right", "bottom", "left"];
|
|
334
|
-
const min = Math.min;
|
|
335
|
-
const max = Math.max;
|
|
336
|
-
const round = Math.round;
|
|
337
|
-
const floor = Math.floor;
|
|
338
|
-
const createCoords = (v) => ({
|
|
339
|
-
x: v,
|
|
340
|
-
y: v
|
|
341
|
-
});
|
|
342
|
-
const oppositeSideMap = {
|
|
343
|
-
left: "right",
|
|
344
|
-
right: "left",
|
|
345
|
-
bottom: "top",
|
|
346
|
-
top: "bottom"
|
|
347
|
-
};
|
|
348
|
-
const oppositeAlignmentMap = {
|
|
349
|
-
start: "end",
|
|
350
|
-
end: "start"
|
|
351
|
-
};
|
|
352
|
-
function clamp(start, value, end) {
|
|
353
|
-
return max(start, min(value, end));
|
|
354
|
-
}
|
|
355
|
-
function evaluate(value, param) {
|
|
356
|
-
return typeof value === "function" ? value(param) : value;
|
|
357
|
-
}
|
|
358
|
-
function getSide(placement) {
|
|
359
|
-
return placement.split("-")[0];
|
|
360
|
-
}
|
|
361
|
-
function getAlignment(placement) {
|
|
362
|
-
return placement.split("-")[1];
|
|
363
|
-
}
|
|
364
|
-
function getOppositeAxis(axis) {
|
|
365
|
-
return axis === "x" ? "y" : "x";
|
|
366
|
-
}
|
|
367
|
-
function getAxisLength(axis) {
|
|
368
|
-
return axis === "y" ? "height" : "width";
|
|
369
|
-
}
|
|
370
|
-
const yAxisSides = /* @__PURE__ */ new Set(["top", "bottom"]);
|
|
371
|
-
function getSideAxis(placement) {
|
|
372
|
-
return yAxisSides.has(getSide(placement)) ? "y" : "x";
|
|
373
|
-
}
|
|
374
|
-
function getAlignmentAxis(placement) {
|
|
375
|
-
return getOppositeAxis(getSideAxis(placement));
|
|
376
|
-
}
|
|
377
|
-
function getAlignmentSides(placement, rects, rtl) {
|
|
378
|
-
if (rtl === void 0) {
|
|
379
|
-
rtl = false;
|
|
380
|
-
}
|
|
381
|
-
const alignment = getAlignment(placement);
|
|
382
|
-
const alignmentAxis = getAlignmentAxis(placement);
|
|
383
|
-
const length = getAxisLength(alignmentAxis);
|
|
384
|
-
let mainAlignmentSide = alignmentAxis === "x" ? alignment === (rtl ? "end" : "start") ? "right" : "left" : alignment === "start" ? "bottom" : "top";
|
|
385
|
-
if (rects.reference[length] > rects.floating[length]) {
|
|
386
|
-
mainAlignmentSide = getOppositePlacement(mainAlignmentSide);
|
|
387
|
-
}
|
|
388
|
-
return [mainAlignmentSide, getOppositePlacement(mainAlignmentSide)];
|
|
389
|
-
}
|
|
390
|
-
function getExpandedPlacements(placement) {
|
|
391
|
-
const oppositePlacement = getOppositePlacement(placement);
|
|
392
|
-
return [getOppositeAlignmentPlacement(placement), oppositePlacement, getOppositeAlignmentPlacement(oppositePlacement)];
|
|
393
|
-
}
|
|
394
|
-
function getOppositeAlignmentPlacement(placement) {
|
|
395
|
-
return placement.replace(/start|end/g, (alignment) => oppositeAlignmentMap[alignment]);
|
|
396
|
-
}
|
|
397
|
-
const lrPlacement = ["left", "right"];
|
|
398
|
-
const rlPlacement = ["right", "left"];
|
|
399
|
-
const tbPlacement = ["top", "bottom"];
|
|
400
|
-
const btPlacement = ["bottom", "top"];
|
|
401
|
-
function getSideList(side, isStart, rtl) {
|
|
402
|
-
switch (side) {
|
|
403
|
-
case "top":
|
|
404
|
-
case "bottom":
|
|
405
|
-
if (rtl) return isStart ? rlPlacement : lrPlacement;
|
|
406
|
-
return isStart ? lrPlacement : rlPlacement;
|
|
407
|
-
case "left":
|
|
408
|
-
case "right":
|
|
409
|
-
return isStart ? tbPlacement : btPlacement;
|
|
410
|
-
default:
|
|
411
|
-
return [];
|
|
412
|
-
}
|
|
413
|
-
}
|
|
414
|
-
function getOppositeAxisPlacements(placement, flipAlignment, direction, rtl) {
|
|
415
|
-
const alignment = getAlignment(placement);
|
|
416
|
-
let list = getSideList(getSide(placement), direction === "start", rtl);
|
|
417
|
-
if (alignment) {
|
|
418
|
-
list = list.map((side) => side + "-" + alignment);
|
|
419
|
-
if (flipAlignment) {
|
|
420
|
-
list = list.concat(list.map(getOppositeAlignmentPlacement));
|
|
421
|
-
}
|
|
422
|
-
}
|
|
423
|
-
return list;
|
|
424
|
-
}
|
|
425
|
-
function getOppositePlacement(placement) {
|
|
426
|
-
return placement.replace(/left|right|bottom|top/g, (side) => oppositeSideMap[side]);
|
|
427
|
-
}
|
|
428
|
-
function expandPaddingObject(padding) {
|
|
429
|
-
return {
|
|
430
|
-
top: 0,
|
|
431
|
-
right: 0,
|
|
432
|
-
bottom: 0,
|
|
433
|
-
left: 0,
|
|
434
|
-
...padding
|
|
435
|
-
};
|
|
436
|
-
}
|
|
437
|
-
function getPaddingObject(padding) {
|
|
438
|
-
return typeof padding !== "number" ? expandPaddingObject(padding) : {
|
|
439
|
-
top: padding,
|
|
440
|
-
right: padding,
|
|
441
|
-
bottom: padding,
|
|
442
|
-
left: padding
|
|
443
|
-
};
|
|
444
|
-
}
|
|
445
|
-
function rectToClientRect(rect) {
|
|
446
|
-
const {
|
|
447
|
-
x,
|
|
448
|
-
y,
|
|
449
|
-
width,
|
|
450
|
-
height
|
|
451
|
-
} = rect;
|
|
452
|
-
return {
|
|
453
|
-
width,
|
|
454
|
-
height,
|
|
455
|
-
top: y,
|
|
456
|
-
left: x,
|
|
457
|
-
right: x + width,
|
|
458
|
-
bottom: y + height,
|
|
459
|
-
x,
|
|
460
|
-
y
|
|
461
|
-
};
|
|
462
|
-
}
|
|
463
|
-
function computeCoordsFromPlacement(_ref, placement, rtl) {
|
|
464
|
-
let {
|
|
465
|
-
reference,
|
|
466
|
-
floating
|
|
467
|
-
} = _ref;
|
|
468
|
-
const sideAxis = getSideAxis(placement);
|
|
469
|
-
const alignmentAxis = getAlignmentAxis(placement);
|
|
470
|
-
const alignLength = getAxisLength(alignmentAxis);
|
|
471
|
-
const side = getSide(placement);
|
|
472
|
-
const isVertical = sideAxis === "y";
|
|
473
|
-
const commonX = reference.x + reference.width / 2 - floating.width / 2;
|
|
474
|
-
const commonY = reference.y + reference.height / 2 - floating.height / 2;
|
|
475
|
-
const commonAlign = reference[alignLength] / 2 - floating[alignLength] / 2;
|
|
476
|
-
let coords;
|
|
477
|
-
switch (side) {
|
|
478
|
-
case "top":
|
|
479
|
-
coords = {
|
|
480
|
-
x: commonX,
|
|
481
|
-
y: reference.y - floating.height
|
|
482
|
-
};
|
|
483
|
-
break;
|
|
484
|
-
case "bottom":
|
|
485
|
-
coords = {
|
|
486
|
-
x: commonX,
|
|
487
|
-
y: reference.y + reference.height
|
|
488
|
-
};
|
|
489
|
-
break;
|
|
490
|
-
case "right":
|
|
491
|
-
coords = {
|
|
492
|
-
x: reference.x + reference.width,
|
|
493
|
-
y: commonY
|
|
494
|
-
};
|
|
495
|
-
break;
|
|
496
|
-
case "left":
|
|
497
|
-
coords = {
|
|
498
|
-
x: reference.x - floating.width,
|
|
499
|
-
y: commonY
|
|
500
|
-
};
|
|
501
|
-
break;
|
|
502
|
-
default:
|
|
503
|
-
coords = {
|
|
504
|
-
x: reference.x,
|
|
505
|
-
y: reference.y
|
|
506
|
-
};
|
|
507
|
-
}
|
|
508
|
-
switch (getAlignment(placement)) {
|
|
509
|
-
case "start":
|
|
510
|
-
coords[alignmentAxis] -= commonAlign * (rtl && isVertical ? -1 : 1);
|
|
511
|
-
break;
|
|
512
|
-
case "end":
|
|
513
|
-
coords[alignmentAxis] += commonAlign * (rtl && isVertical ? -1 : 1);
|
|
514
|
-
break;
|
|
515
|
-
}
|
|
516
|
-
return coords;
|
|
517
|
-
}
|
|
518
|
-
const computePosition$1 = async (reference, floating, config) => {
|
|
519
|
-
const {
|
|
520
|
-
placement = "bottom",
|
|
521
|
-
strategy = "absolute",
|
|
522
|
-
middleware = [],
|
|
523
|
-
platform: platform2
|
|
524
|
-
} = config;
|
|
525
|
-
const validMiddleware = middleware.filter(Boolean);
|
|
526
|
-
const rtl = await (platform2.isRTL == null ? void 0 : platform2.isRTL(floating));
|
|
527
|
-
let rects = await platform2.getElementRects({
|
|
528
|
-
reference,
|
|
529
|
-
floating,
|
|
530
|
-
strategy
|
|
531
|
-
});
|
|
532
|
-
let {
|
|
533
|
-
x,
|
|
534
|
-
y
|
|
535
|
-
} = computeCoordsFromPlacement(rects, placement, rtl);
|
|
536
|
-
let statefulPlacement = placement;
|
|
537
|
-
let middlewareData = {};
|
|
538
|
-
let resetCount = 0;
|
|
539
|
-
for (let i = 0; i < validMiddleware.length; i++) {
|
|
540
|
-
const {
|
|
541
|
-
name,
|
|
542
|
-
fn
|
|
543
|
-
} = validMiddleware[i];
|
|
544
|
-
const {
|
|
545
|
-
x: nextX,
|
|
546
|
-
y: nextY,
|
|
547
|
-
data,
|
|
548
|
-
reset
|
|
549
|
-
} = await fn({
|
|
550
|
-
x,
|
|
551
|
-
y,
|
|
552
|
-
initialPlacement: placement,
|
|
553
|
-
placement: statefulPlacement,
|
|
554
|
-
strategy,
|
|
555
|
-
middlewareData,
|
|
556
|
-
rects,
|
|
557
|
-
platform: platform2,
|
|
558
|
-
elements: {
|
|
559
|
-
reference,
|
|
560
|
-
floating
|
|
561
|
-
}
|
|
562
|
-
});
|
|
563
|
-
x = nextX != null ? nextX : x;
|
|
564
|
-
y = nextY != null ? nextY : y;
|
|
565
|
-
middlewareData = {
|
|
566
|
-
...middlewareData,
|
|
567
|
-
[name]: {
|
|
568
|
-
...middlewareData[name],
|
|
569
|
-
...data
|
|
570
|
-
}
|
|
571
|
-
};
|
|
572
|
-
if (reset && resetCount <= 50) {
|
|
573
|
-
resetCount++;
|
|
574
|
-
if (typeof reset === "object") {
|
|
575
|
-
if (reset.placement) {
|
|
576
|
-
statefulPlacement = reset.placement;
|
|
577
|
-
}
|
|
578
|
-
if (reset.rects) {
|
|
579
|
-
rects = reset.rects === true ? await platform2.getElementRects({
|
|
580
|
-
reference,
|
|
581
|
-
floating,
|
|
582
|
-
strategy
|
|
583
|
-
}) : reset.rects;
|
|
584
|
-
}
|
|
585
|
-
({
|
|
586
|
-
x,
|
|
587
|
-
y
|
|
588
|
-
} = computeCoordsFromPlacement(rects, statefulPlacement, rtl));
|
|
589
|
-
}
|
|
590
|
-
i = -1;
|
|
591
|
-
}
|
|
592
|
-
}
|
|
593
|
-
return {
|
|
594
|
-
x,
|
|
595
|
-
y,
|
|
596
|
-
placement: statefulPlacement,
|
|
597
|
-
strategy,
|
|
598
|
-
middlewareData
|
|
599
|
-
};
|
|
600
|
-
};
|
|
601
|
-
async function detectOverflow(state, options) {
|
|
602
|
-
var _await$platform$isEle;
|
|
603
|
-
if (options === void 0) {
|
|
604
|
-
options = {};
|
|
605
|
-
}
|
|
606
|
-
const {
|
|
607
|
-
x,
|
|
608
|
-
y,
|
|
609
|
-
platform: platform2,
|
|
610
|
-
rects,
|
|
611
|
-
elements,
|
|
612
|
-
strategy
|
|
613
|
-
} = state;
|
|
614
|
-
const {
|
|
615
|
-
boundary = "clippingAncestors",
|
|
616
|
-
rootBoundary = "viewport",
|
|
617
|
-
elementContext = "floating",
|
|
618
|
-
altBoundary = false,
|
|
619
|
-
padding = 0
|
|
620
|
-
} = evaluate(options, state);
|
|
621
|
-
const paddingObject = getPaddingObject(padding);
|
|
622
|
-
const altContext = elementContext === "floating" ? "reference" : "floating";
|
|
623
|
-
const element = elements[altBoundary ? altContext : elementContext];
|
|
624
|
-
const clippingClientRect = rectToClientRect(await platform2.getClippingRect({
|
|
625
|
-
element: ((_await$platform$isEle = await (platform2.isElement == null ? void 0 : platform2.isElement(element))) != null ? _await$platform$isEle : true) ? element : element.contextElement || await (platform2.getDocumentElement == null ? void 0 : platform2.getDocumentElement(elements.floating)),
|
|
626
|
-
boundary,
|
|
627
|
-
rootBoundary,
|
|
628
|
-
strategy
|
|
629
|
-
}));
|
|
630
|
-
const rect = elementContext === "floating" ? {
|
|
631
|
-
x,
|
|
632
|
-
y,
|
|
633
|
-
width: rects.floating.width,
|
|
634
|
-
height: rects.floating.height
|
|
635
|
-
} : rects.reference;
|
|
636
|
-
const offsetParent = await (platform2.getOffsetParent == null ? void 0 : platform2.getOffsetParent(elements.floating));
|
|
637
|
-
const offsetScale = await (platform2.isElement == null ? void 0 : platform2.isElement(offsetParent)) ? await (platform2.getScale == null ? void 0 : platform2.getScale(offsetParent)) || {
|
|
638
|
-
x: 1,
|
|
639
|
-
y: 1
|
|
640
|
-
} : {
|
|
641
|
-
x: 1,
|
|
642
|
-
y: 1
|
|
643
|
-
};
|
|
644
|
-
const elementClientRect = rectToClientRect(platform2.convertOffsetParentRelativeRectToViewportRelativeRect ? await platform2.convertOffsetParentRelativeRectToViewportRelativeRect({
|
|
645
|
-
elements,
|
|
646
|
-
rect,
|
|
647
|
-
offsetParent,
|
|
648
|
-
strategy
|
|
649
|
-
}) : rect);
|
|
650
|
-
return {
|
|
651
|
-
top: (clippingClientRect.top - elementClientRect.top + paddingObject.top) / offsetScale.y,
|
|
652
|
-
bottom: (elementClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom) / offsetScale.y,
|
|
653
|
-
left: (clippingClientRect.left - elementClientRect.left + paddingObject.left) / offsetScale.x,
|
|
654
|
-
right: (elementClientRect.right - clippingClientRect.right + paddingObject.right) / offsetScale.x
|
|
655
|
-
};
|
|
656
|
-
}
|
|
657
|
-
const arrow$3 = (options) => ({
|
|
658
|
-
name: "arrow",
|
|
659
|
-
options,
|
|
660
|
-
async fn(state) {
|
|
661
|
-
const {
|
|
662
|
-
x,
|
|
663
|
-
y,
|
|
664
|
-
placement,
|
|
665
|
-
rects,
|
|
666
|
-
platform: platform2,
|
|
667
|
-
elements,
|
|
668
|
-
middlewareData
|
|
669
|
-
} = state;
|
|
670
|
-
const {
|
|
671
|
-
element,
|
|
672
|
-
padding = 0
|
|
673
|
-
} = evaluate(options, state) || {};
|
|
674
|
-
if (element == null) {
|
|
675
|
-
return {};
|
|
676
|
-
}
|
|
677
|
-
const paddingObject = getPaddingObject(padding);
|
|
678
|
-
const coords = {
|
|
679
|
-
x,
|
|
680
|
-
y
|
|
681
|
-
};
|
|
682
|
-
const axis = getAlignmentAxis(placement);
|
|
683
|
-
const length = getAxisLength(axis);
|
|
684
|
-
const arrowDimensions = await platform2.getDimensions(element);
|
|
685
|
-
const isYAxis = axis === "y";
|
|
686
|
-
const minProp = isYAxis ? "top" : "left";
|
|
687
|
-
const maxProp = isYAxis ? "bottom" : "right";
|
|
688
|
-
const clientProp = isYAxis ? "clientHeight" : "clientWidth";
|
|
689
|
-
const endDiff = rects.reference[length] + rects.reference[axis] - coords[axis] - rects.floating[length];
|
|
690
|
-
const startDiff = coords[axis] - rects.reference[axis];
|
|
691
|
-
const arrowOffsetParent = await (platform2.getOffsetParent == null ? void 0 : platform2.getOffsetParent(element));
|
|
692
|
-
let clientSize = arrowOffsetParent ? arrowOffsetParent[clientProp] : 0;
|
|
693
|
-
if (!clientSize || !await (platform2.isElement == null ? void 0 : platform2.isElement(arrowOffsetParent))) {
|
|
694
|
-
clientSize = elements.floating[clientProp] || rects.floating[length];
|
|
695
|
-
}
|
|
696
|
-
const centerToReference = endDiff / 2 - startDiff / 2;
|
|
697
|
-
const largestPossiblePadding = clientSize / 2 - arrowDimensions[length] / 2 - 1;
|
|
698
|
-
const minPadding = min(paddingObject[minProp], largestPossiblePadding);
|
|
699
|
-
const maxPadding = min(paddingObject[maxProp], largestPossiblePadding);
|
|
700
|
-
const min$1 = minPadding;
|
|
701
|
-
const max2 = clientSize - arrowDimensions[length] - maxPadding;
|
|
702
|
-
const center = clientSize / 2 - arrowDimensions[length] / 2 + centerToReference;
|
|
703
|
-
const offset2 = clamp(min$1, center, max2);
|
|
704
|
-
const shouldAddOffset = !middlewareData.arrow && getAlignment(placement) != null && center !== offset2 && rects.reference[length] / 2 - (center < min$1 ? minPadding : maxPadding) - arrowDimensions[length] / 2 < 0;
|
|
705
|
-
const alignmentOffset = shouldAddOffset ? center < min$1 ? center - min$1 : center - max2 : 0;
|
|
706
|
-
return {
|
|
707
|
-
[axis]: coords[axis] + alignmentOffset,
|
|
708
|
-
data: {
|
|
709
|
-
[axis]: offset2,
|
|
710
|
-
centerOffset: center - offset2 - alignmentOffset,
|
|
711
|
-
...shouldAddOffset && {
|
|
712
|
-
alignmentOffset
|
|
713
|
-
}
|
|
714
|
-
},
|
|
715
|
-
reset: shouldAddOffset
|
|
716
|
-
};
|
|
717
|
-
}
|
|
718
|
-
});
|
|
719
|
-
const flip$2 = function(options) {
|
|
720
|
-
if (options === void 0) {
|
|
721
|
-
options = {};
|
|
722
|
-
}
|
|
723
|
-
return {
|
|
724
|
-
name: "flip",
|
|
725
|
-
options,
|
|
726
|
-
async fn(state) {
|
|
727
|
-
var _middlewareData$arrow, _middlewareData$flip;
|
|
728
|
-
const {
|
|
729
|
-
placement,
|
|
730
|
-
middlewareData,
|
|
731
|
-
rects,
|
|
732
|
-
initialPlacement,
|
|
733
|
-
platform: platform2,
|
|
734
|
-
elements
|
|
735
|
-
} = state;
|
|
736
|
-
const {
|
|
737
|
-
mainAxis: checkMainAxis = true,
|
|
738
|
-
crossAxis: checkCrossAxis = true,
|
|
739
|
-
fallbackPlacements: specifiedFallbackPlacements,
|
|
740
|
-
fallbackStrategy = "bestFit",
|
|
741
|
-
fallbackAxisSideDirection = "none",
|
|
742
|
-
flipAlignment = true,
|
|
743
|
-
...detectOverflowOptions
|
|
744
|
-
} = evaluate(options, state);
|
|
745
|
-
if ((_middlewareData$arrow = middlewareData.arrow) != null && _middlewareData$arrow.alignmentOffset) {
|
|
746
|
-
return {};
|
|
747
|
-
}
|
|
748
|
-
const side = getSide(placement);
|
|
749
|
-
const initialSideAxis = getSideAxis(initialPlacement);
|
|
750
|
-
const isBasePlacement = getSide(initialPlacement) === initialPlacement;
|
|
751
|
-
const rtl = await (platform2.isRTL == null ? void 0 : platform2.isRTL(elements.floating));
|
|
752
|
-
const fallbackPlacements = specifiedFallbackPlacements || (isBasePlacement || !flipAlignment ? [getOppositePlacement(initialPlacement)] : getExpandedPlacements(initialPlacement));
|
|
753
|
-
const hasFallbackAxisSideDirection = fallbackAxisSideDirection !== "none";
|
|
754
|
-
if (!specifiedFallbackPlacements && hasFallbackAxisSideDirection) {
|
|
755
|
-
fallbackPlacements.push(...getOppositeAxisPlacements(initialPlacement, flipAlignment, fallbackAxisSideDirection, rtl));
|
|
756
|
-
}
|
|
757
|
-
const placements = [initialPlacement, ...fallbackPlacements];
|
|
758
|
-
const overflow = await detectOverflow(state, detectOverflowOptions);
|
|
759
|
-
const overflows = [];
|
|
760
|
-
let overflowsData = ((_middlewareData$flip = middlewareData.flip) == null ? void 0 : _middlewareData$flip.overflows) || [];
|
|
761
|
-
if (checkMainAxis) {
|
|
762
|
-
overflows.push(overflow[side]);
|
|
763
|
-
}
|
|
764
|
-
if (checkCrossAxis) {
|
|
765
|
-
const sides2 = getAlignmentSides(placement, rects, rtl);
|
|
766
|
-
overflows.push(overflow[sides2[0]], overflow[sides2[1]]);
|
|
767
|
-
}
|
|
768
|
-
overflowsData = [...overflowsData, {
|
|
769
|
-
placement,
|
|
770
|
-
overflows
|
|
771
|
-
}];
|
|
772
|
-
if (!overflows.every((side2) => side2 <= 0)) {
|
|
773
|
-
var _middlewareData$flip2, _overflowsData$filter;
|
|
774
|
-
const nextIndex = (((_middlewareData$flip2 = middlewareData.flip) == null ? void 0 : _middlewareData$flip2.index) || 0) + 1;
|
|
775
|
-
const nextPlacement = placements[nextIndex];
|
|
776
|
-
if (nextPlacement) {
|
|
777
|
-
const ignoreCrossAxisOverflow = checkCrossAxis === "alignment" ? initialSideAxis !== getSideAxis(nextPlacement) : false;
|
|
778
|
-
if (!ignoreCrossAxisOverflow || // We leave the current main axis only if every placement on that axis
|
|
779
|
-
// overflows the main axis.
|
|
780
|
-
overflowsData.every((d) => getSideAxis(d.placement) === initialSideAxis ? d.overflows[0] > 0 : true)) {
|
|
781
|
-
return {
|
|
782
|
-
data: {
|
|
783
|
-
index: nextIndex,
|
|
784
|
-
overflows: overflowsData
|
|
785
|
-
},
|
|
786
|
-
reset: {
|
|
787
|
-
placement: nextPlacement
|
|
788
|
-
}
|
|
789
|
-
};
|
|
790
|
-
}
|
|
791
|
-
}
|
|
792
|
-
let resetPlacement = (_overflowsData$filter = overflowsData.filter((d) => d.overflows[0] <= 0).sort((a, b) => a.overflows[1] - b.overflows[1])[0]) == null ? void 0 : _overflowsData$filter.placement;
|
|
793
|
-
if (!resetPlacement) {
|
|
794
|
-
switch (fallbackStrategy) {
|
|
795
|
-
case "bestFit": {
|
|
796
|
-
var _overflowsData$filter2;
|
|
797
|
-
const placement2 = (_overflowsData$filter2 = overflowsData.filter((d) => {
|
|
798
|
-
if (hasFallbackAxisSideDirection) {
|
|
799
|
-
const currentSideAxis = getSideAxis(d.placement);
|
|
800
|
-
return currentSideAxis === initialSideAxis || // Create a bias to the `y` side axis due to horizontal
|
|
801
|
-
// reading directions favoring greater width.
|
|
802
|
-
currentSideAxis === "y";
|
|
803
|
-
}
|
|
804
|
-
return true;
|
|
805
|
-
}).map((d) => [d.placement, d.overflows.filter((overflow2) => overflow2 > 0).reduce((acc, overflow2) => acc + overflow2, 0)]).sort((a, b) => a[1] - b[1])[0]) == null ? void 0 : _overflowsData$filter2[0];
|
|
806
|
-
if (placement2) {
|
|
807
|
-
resetPlacement = placement2;
|
|
808
|
-
}
|
|
809
|
-
break;
|
|
810
|
-
}
|
|
811
|
-
case "initialPlacement":
|
|
812
|
-
resetPlacement = initialPlacement;
|
|
813
|
-
break;
|
|
814
|
-
}
|
|
815
|
-
}
|
|
816
|
-
if (placement !== resetPlacement) {
|
|
817
|
-
return {
|
|
818
|
-
reset: {
|
|
819
|
-
placement: resetPlacement
|
|
820
|
-
}
|
|
821
|
-
};
|
|
822
|
-
}
|
|
823
|
-
}
|
|
824
|
-
return {};
|
|
825
|
-
}
|
|
826
|
-
};
|
|
827
|
-
};
|
|
828
|
-
function getSideOffsets(overflow, rect) {
|
|
829
|
-
return {
|
|
830
|
-
top: overflow.top - rect.height,
|
|
831
|
-
right: overflow.right - rect.width,
|
|
832
|
-
bottom: overflow.bottom - rect.height,
|
|
833
|
-
left: overflow.left - rect.width
|
|
834
|
-
};
|
|
835
|
-
}
|
|
836
|
-
function isAnySideFullyClipped(overflow) {
|
|
837
|
-
return sides.some((side) => overflow[side] >= 0);
|
|
838
|
-
}
|
|
839
|
-
const hide$2 = function(options) {
|
|
840
|
-
if (options === void 0) {
|
|
841
|
-
options = {};
|
|
842
|
-
}
|
|
843
|
-
return {
|
|
844
|
-
name: "hide",
|
|
845
|
-
options,
|
|
846
|
-
async fn(state) {
|
|
847
|
-
const {
|
|
848
|
-
rects
|
|
849
|
-
} = state;
|
|
850
|
-
const {
|
|
851
|
-
strategy = "referenceHidden",
|
|
852
|
-
...detectOverflowOptions
|
|
853
|
-
} = evaluate(options, state);
|
|
854
|
-
switch (strategy) {
|
|
855
|
-
case "referenceHidden": {
|
|
856
|
-
const overflow = await detectOverflow(state, {
|
|
857
|
-
...detectOverflowOptions,
|
|
858
|
-
elementContext: "reference"
|
|
859
|
-
});
|
|
860
|
-
const offsets = getSideOffsets(overflow, rects.reference);
|
|
861
|
-
return {
|
|
862
|
-
data: {
|
|
863
|
-
referenceHiddenOffsets: offsets,
|
|
864
|
-
referenceHidden: isAnySideFullyClipped(offsets)
|
|
865
|
-
}
|
|
866
|
-
};
|
|
867
|
-
}
|
|
868
|
-
case "escaped": {
|
|
869
|
-
const overflow = await detectOverflow(state, {
|
|
870
|
-
...detectOverflowOptions,
|
|
871
|
-
altBoundary: true
|
|
872
|
-
});
|
|
873
|
-
const offsets = getSideOffsets(overflow, rects.floating);
|
|
874
|
-
return {
|
|
875
|
-
data: {
|
|
876
|
-
escapedOffsets: offsets,
|
|
877
|
-
escaped: isAnySideFullyClipped(offsets)
|
|
878
|
-
}
|
|
879
|
-
};
|
|
880
|
-
}
|
|
881
|
-
default: {
|
|
882
|
-
return {};
|
|
883
|
-
}
|
|
884
|
-
}
|
|
885
|
-
}
|
|
886
|
-
};
|
|
887
|
-
};
|
|
888
|
-
const originSides = /* @__PURE__ */ new Set(["left", "top"]);
|
|
889
|
-
async function convertValueToCoords(state, options) {
|
|
890
|
-
const {
|
|
891
|
-
placement,
|
|
892
|
-
platform: platform2,
|
|
893
|
-
elements
|
|
894
|
-
} = state;
|
|
895
|
-
const rtl = await (platform2.isRTL == null ? void 0 : platform2.isRTL(elements.floating));
|
|
896
|
-
const side = getSide(placement);
|
|
897
|
-
const alignment = getAlignment(placement);
|
|
898
|
-
const isVertical = getSideAxis(placement) === "y";
|
|
899
|
-
const mainAxisMulti = originSides.has(side) ? -1 : 1;
|
|
900
|
-
const crossAxisMulti = rtl && isVertical ? -1 : 1;
|
|
901
|
-
const rawValue = evaluate(options, state);
|
|
902
|
-
let {
|
|
903
|
-
mainAxis,
|
|
904
|
-
crossAxis,
|
|
905
|
-
alignmentAxis
|
|
906
|
-
} = typeof rawValue === "number" ? {
|
|
907
|
-
mainAxis: rawValue,
|
|
908
|
-
crossAxis: 0,
|
|
909
|
-
alignmentAxis: null
|
|
910
|
-
} : {
|
|
911
|
-
mainAxis: rawValue.mainAxis || 0,
|
|
912
|
-
crossAxis: rawValue.crossAxis || 0,
|
|
913
|
-
alignmentAxis: rawValue.alignmentAxis
|
|
914
|
-
};
|
|
915
|
-
if (alignment && typeof alignmentAxis === "number") {
|
|
916
|
-
crossAxis = alignment === "end" ? alignmentAxis * -1 : alignmentAxis;
|
|
917
|
-
}
|
|
918
|
-
return isVertical ? {
|
|
919
|
-
x: crossAxis * crossAxisMulti,
|
|
920
|
-
y: mainAxis * mainAxisMulti
|
|
921
|
-
} : {
|
|
922
|
-
x: mainAxis * mainAxisMulti,
|
|
923
|
-
y: crossAxis * crossAxisMulti
|
|
924
|
-
};
|
|
925
|
-
}
|
|
926
|
-
const offset$2 = function(options) {
|
|
927
|
-
if (options === void 0) {
|
|
928
|
-
options = 0;
|
|
929
|
-
}
|
|
930
|
-
return {
|
|
931
|
-
name: "offset",
|
|
932
|
-
options,
|
|
933
|
-
async fn(state) {
|
|
934
|
-
var _middlewareData$offse, _middlewareData$arrow;
|
|
935
|
-
const {
|
|
936
|
-
x,
|
|
937
|
-
y,
|
|
938
|
-
placement,
|
|
939
|
-
middlewareData
|
|
940
|
-
} = state;
|
|
941
|
-
const diffCoords = await convertValueToCoords(state, options);
|
|
942
|
-
if (placement === ((_middlewareData$offse = middlewareData.offset) == null ? void 0 : _middlewareData$offse.placement) && (_middlewareData$arrow = middlewareData.arrow) != null && _middlewareData$arrow.alignmentOffset) {
|
|
943
|
-
return {};
|
|
944
|
-
}
|
|
945
|
-
return {
|
|
946
|
-
x: x + diffCoords.x,
|
|
947
|
-
y: y + diffCoords.y,
|
|
948
|
-
data: {
|
|
949
|
-
...diffCoords,
|
|
950
|
-
placement
|
|
951
|
-
}
|
|
952
|
-
};
|
|
953
|
-
}
|
|
954
|
-
};
|
|
955
|
-
};
|
|
956
|
-
const shift$2 = function(options) {
|
|
957
|
-
if (options === void 0) {
|
|
958
|
-
options = {};
|
|
959
|
-
}
|
|
960
|
-
return {
|
|
961
|
-
name: "shift",
|
|
962
|
-
options,
|
|
963
|
-
async fn(state) {
|
|
964
|
-
const {
|
|
965
|
-
x,
|
|
966
|
-
y,
|
|
967
|
-
placement
|
|
968
|
-
} = state;
|
|
969
|
-
const {
|
|
970
|
-
mainAxis: checkMainAxis = true,
|
|
971
|
-
crossAxis: checkCrossAxis = false,
|
|
972
|
-
limiter = {
|
|
973
|
-
fn: (_ref) => {
|
|
974
|
-
let {
|
|
975
|
-
x: x2,
|
|
976
|
-
y: y2
|
|
977
|
-
} = _ref;
|
|
978
|
-
return {
|
|
979
|
-
x: x2,
|
|
980
|
-
y: y2
|
|
981
|
-
};
|
|
982
|
-
}
|
|
983
|
-
},
|
|
984
|
-
...detectOverflowOptions
|
|
985
|
-
} = evaluate(options, state);
|
|
986
|
-
const coords = {
|
|
987
|
-
x,
|
|
988
|
-
y
|
|
989
|
-
};
|
|
990
|
-
const overflow = await detectOverflow(state, detectOverflowOptions);
|
|
991
|
-
const crossAxis = getSideAxis(getSide(placement));
|
|
992
|
-
const mainAxis = getOppositeAxis(crossAxis);
|
|
993
|
-
let mainAxisCoord = coords[mainAxis];
|
|
994
|
-
let crossAxisCoord = coords[crossAxis];
|
|
995
|
-
if (checkMainAxis) {
|
|
996
|
-
const minSide = mainAxis === "y" ? "top" : "left";
|
|
997
|
-
const maxSide = mainAxis === "y" ? "bottom" : "right";
|
|
998
|
-
const min2 = mainAxisCoord + overflow[minSide];
|
|
999
|
-
const max2 = mainAxisCoord - overflow[maxSide];
|
|
1000
|
-
mainAxisCoord = clamp(min2, mainAxisCoord, max2);
|
|
1001
|
-
}
|
|
1002
|
-
if (checkCrossAxis) {
|
|
1003
|
-
const minSide = crossAxis === "y" ? "top" : "left";
|
|
1004
|
-
const maxSide = crossAxis === "y" ? "bottom" : "right";
|
|
1005
|
-
const min2 = crossAxisCoord + overflow[minSide];
|
|
1006
|
-
const max2 = crossAxisCoord - overflow[maxSide];
|
|
1007
|
-
crossAxisCoord = clamp(min2, crossAxisCoord, max2);
|
|
1008
|
-
}
|
|
1009
|
-
const limitedCoords = limiter.fn({
|
|
1010
|
-
...state,
|
|
1011
|
-
[mainAxis]: mainAxisCoord,
|
|
1012
|
-
[crossAxis]: crossAxisCoord
|
|
1013
|
-
});
|
|
1014
|
-
return {
|
|
1015
|
-
...limitedCoords,
|
|
1016
|
-
data: {
|
|
1017
|
-
x: limitedCoords.x - x,
|
|
1018
|
-
y: limitedCoords.y - y,
|
|
1019
|
-
enabled: {
|
|
1020
|
-
[mainAxis]: checkMainAxis,
|
|
1021
|
-
[crossAxis]: checkCrossAxis
|
|
1022
|
-
}
|
|
1023
|
-
}
|
|
1024
|
-
};
|
|
1025
|
-
}
|
|
1026
|
-
};
|
|
1027
|
-
};
|
|
1028
|
-
const limitShift$2 = function(options) {
|
|
1029
|
-
if (options === void 0) {
|
|
1030
|
-
options = {};
|
|
1031
|
-
}
|
|
1032
|
-
return {
|
|
1033
|
-
options,
|
|
1034
|
-
fn(state) {
|
|
1035
|
-
const {
|
|
1036
|
-
x,
|
|
1037
|
-
y,
|
|
1038
|
-
placement,
|
|
1039
|
-
rects,
|
|
1040
|
-
middlewareData
|
|
1041
|
-
} = state;
|
|
1042
|
-
const {
|
|
1043
|
-
offset: offset2 = 0,
|
|
1044
|
-
mainAxis: checkMainAxis = true,
|
|
1045
|
-
crossAxis: checkCrossAxis = true
|
|
1046
|
-
} = evaluate(options, state);
|
|
1047
|
-
const coords = {
|
|
1048
|
-
x,
|
|
1049
|
-
y
|
|
1050
|
-
};
|
|
1051
|
-
const crossAxis = getSideAxis(placement);
|
|
1052
|
-
const mainAxis = getOppositeAxis(crossAxis);
|
|
1053
|
-
let mainAxisCoord = coords[mainAxis];
|
|
1054
|
-
let crossAxisCoord = coords[crossAxis];
|
|
1055
|
-
const rawOffset = evaluate(offset2, state);
|
|
1056
|
-
const computedOffset = typeof rawOffset === "number" ? {
|
|
1057
|
-
mainAxis: rawOffset,
|
|
1058
|
-
crossAxis: 0
|
|
1059
|
-
} : {
|
|
1060
|
-
mainAxis: 0,
|
|
1061
|
-
crossAxis: 0,
|
|
1062
|
-
...rawOffset
|
|
1063
|
-
};
|
|
1064
|
-
if (checkMainAxis) {
|
|
1065
|
-
const len = mainAxis === "y" ? "height" : "width";
|
|
1066
|
-
const limitMin = rects.reference[mainAxis] - rects.floating[len] + computedOffset.mainAxis;
|
|
1067
|
-
const limitMax = rects.reference[mainAxis] + rects.reference[len] - computedOffset.mainAxis;
|
|
1068
|
-
if (mainAxisCoord < limitMin) {
|
|
1069
|
-
mainAxisCoord = limitMin;
|
|
1070
|
-
} else if (mainAxisCoord > limitMax) {
|
|
1071
|
-
mainAxisCoord = limitMax;
|
|
1072
|
-
}
|
|
1073
|
-
}
|
|
1074
|
-
if (checkCrossAxis) {
|
|
1075
|
-
var _middlewareData$offse, _middlewareData$offse2;
|
|
1076
|
-
const len = mainAxis === "y" ? "width" : "height";
|
|
1077
|
-
const isOriginSide = originSides.has(getSide(placement));
|
|
1078
|
-
const limitMin = rects.reference[crossAxis] - rects.floating[len] + (isOriginSide ? ((_middlewareData$offse = middlewareData.offset) == null ? void 0 : _middlewareData$offse[crossAxis]) || 0 : 0) + (isOriginSide ? 0 : computedOffset.crossAxis);
|
|
1079
|
-
const limitMax = rects.reference[crossAxis] + rects.reference[len] + (isOriginSide ? 0 : ((_middlewareData$offse2 = middlewareData.offset) == null ? void 0 : _middlewareData$offse2[crossAxis]) || 0) - (isOriginSide ? computedOffset.crossAxis : 0);
|
|
1080
|
-
if (crossAxisCoord < limitMin) {
|
|
1081
|
-
crossAxisCoord = limitMin;
|
|
1082
|
-
} else if (crossAxisCoord > limitMax) {
|
|
1083
|
-
crossAxisCoord = limitMax;
|
|
1084
|
-
}
|
|
1085
|
-
}
|
|
1086
|
-
return {
|
|
1087
|
-
[mainAxis]: mainAxisCoord,
|
|
1088
|
-
[crossAxis]: crossAxisCoord
|
|
1089
|
-
};
|
|
1090
|
-
}
|
|
1091
|
-
};
|
|
1092
|
-
};
|
|
1093
|
-
const size$2 = function(options) {
|
|
1094
|
-
if (options === void 0) {
|
|
1095
|
-
options = {};
|
|
1096
|
-
}
|
|
1097
|
-
return {
|
|
1098
|
-
name: "size",
|
|
1099
|
-
options,
|
|
1100
|
-
async fn(state) {
|
|
1101
|
-
var _state$middlewareData, _state$middlewareData2;
|
|
1102
|
-
const {
|
|
1103
|
-
placement,
|
|
1104
|
-
rects,
|
|
1105
|
-
platform: platform2,
|
|
1106
|
-
elements
|
|
1107
|
-
} = state;
|
|
1108
|
-
const {
|
|
1109
|
-
apply = () => {
|
|
1110
|
-
},
|
|
1111
|
-
...detectOverflowOptions
|
|
1112
|
-
} = evaluate(options, state);
|
|
1113
|
-
const overflow = await detectOverflow(state, detectOverflowOptions);
|
|
1114
|
-
const side = getSide(placement);
|
|
1115
|
-
const alignment = getAlignment(placement);
|
|
1116
|
-
const isYAxis = getSideAxis(placement) === "y";
|
|
1117
|
-
const {
|
|
1118
|
-
width,
|
|
1119
|
-
height
|
|
1120
|
-
} = rects.floating;
|
|
1121
|
-
let heightSide;
|
|
1122
|
-
let widthSide;
|
|
1123
|
-
if (side === "top" || side === "bottom") {
|
|
1124
|
-
heightSide = side;
|
|
1125
|
-
widthSide = alignment === (await (platform2.isRTL == null ? void 0 : platform2.isRTL(elements.floating)) ? "start" : "end") ? "left" : "right";
|
|
1126
|
-
} else {
|
|
1127
|
-
widthSide = side;
|
|
1128
|
-
heightSide = alignment === "end" ? "top" : "bottom";
|
|
1129
|
-
}
|
|
1130
|
-
const maximumClippingHeight = height - overflow.top - overflow.bottom;
|
|
1131
|
-
const maximumClippingWidth = width - overflow.left - overflow.right;
|
|
1132
|
-
const overflowAvailableHeight = min(height - overflow[heightSide], maximumClippingHeight);
|
|
1133
|
-
const overflowAvailableWidth = min(width - overflow[widthSide], maximumClippingWidth);
|
|
1134
|
-
const noShift = !state.middlewareData.shift;
|
|
1135
|
-
let availableHeight = overflowAvailableHeight;
|
|
1136
|
-
let availableWidth = overflowAvailableWidth;
|
|
1137
|
-
if ((_state$middlewareData = state.middlewareData.shift) != null && _state$middlewareData.enabled.x) {
|
|
1138
|
-
availableWidth = maximumClippingWidth;
|
|
1139
|
-
}
|
|
1140
|
-
if ((_state$middlewareData2 = state.middlewareData.shift) != null && _state$middlewareData2.enabled.y) {
|
|
1141
|
-
availableHeight = maximumClippingHeight;
|
|
1142
|
-
}
|
|
1143
|
-
if (noShift && !alignment) {
|
|
1144
|
-
const xMin = max(overflow.left, 0);
|
|
1145
|
-
const xMax = max(overflow.right, 0);
|
|
1146
|
-
const yMin = max(overflow.top, 0);
|
|
1147
|
-
const yMax = max(overflow.bottom, 0);
|
|
1148
|
-
if (isYAxis) {
|
|
1149
|
-
availableWidth = width - 2 * (xMin !== 0 || xMax !== 0 ? xMin + xMax : max(overflow.left, overflow.right));
|
|
1150
|
-
} else {
|
|
1151
|
-
availableHeight = height - 2 * (yMin !== 0 || yMax !== 0 ? yMin + yMax : max(overflow.top, overflow.bottom));
|
|
1152
|
-
}
|
|
1153
|
-
}
|
|
1154
|
-
await apply({
|
|
1155
|
-
...state,
|
|
1156
|
-
availableWidth,
|
|
1157
|
-
availableHeight
|
|
1158
|
-
});
|
|
1159
|
-
const nextDimensions = await platform2.getDimensions(elements.floating);
|
|
1160
|
-
if (width !== nextDimensions.width || height !== nextDimensions.height) {
|
|
1161
|
-
return {
|
|
1162
|
-
reset: {
|
|
1163
|
-
rects: true
|
|
1164
|
-
}
|
|
1165
|
-
};
|
|
1166
|
-
}
|
|
1167
|
-
return {};
|
|
1168
|
-
}
|
|
1169
|
-
};
|
|
1170
|
-
};
|
|
1171
|
-
function hasWindow() {
|
|
1172
|
-
return typeof window !== "undefined";
|
|
1173
|
-
}
|
|
1174
|
-
function getNodeName(node) {
|
|
1175
|
-
if (isNode(node)) {
|
|
1176
|
-
return (node.nodeName || "").toLowerCase();
|
|
1177
|
-
}
|
|
1178
|
-
return "#document";
|
|
1179
|
-
}
|
|
1180
|
-
function getWindow(node) {
|
|
1181
|
-
var _node$ownerDocument;
|
|
1182
|
-
return (node == null || (_node$ownerDocument = node.ownerDocument) == null ? void 0 : _node$ownerDocument.defaultView) || window;
|
|
1183
|
-
}
|
|
1184
|
-
function getDocumentElement(node) {
|
|
1185
|
-
var _ref;
|
|
1186
|
-
return (_ref = (isNode(node) ? node.ownerDocument : node.document) || window.document) == null ? void 0 : _ref.documentElement;
|
|
1187
|
-
}
|
|
1188
|
-
function isNode(value) {
|
|
1189
|
-
if (!hasWindow()) {
|
|
1190
|
-
return false;
|
|
1191
|
-
}
|
|
1192
|
-
return value instanceof Node || value instanceof getWindow(value).Node;
|
|
1193
|
-
}
|
|
1194
|
-
function isElement(value) {
|
|
1195
|
-
if (!hasWindow()) {
|
|
1196
|
-
return false;
|
|
1197
|
-
}
|
|
1198
|
-
return value instanceof Element || value instanceof getWindow(value).Element;
|
|
1199
|
-
}
|
|
1200
|
-
function isHTMLElement(value) {
|
|
1201
|
-
if (!hasWindow()) {
|
|
1202
|
-
return false;
|
|
1203
|
-
}
|
|
1204
|
-
return value instanceof HTMLElement || value instanceof getWindow(value).HTMLElement;
|
|
1205
|
-
}
|
|
1206
|
-
function isShadowRoot(value) {
|
|
1207
|
-
if (!hasWindow() || typeof ShadowRoot === "undefined") {
|
|
1208
|
-
return false;
|
|
1209
|
-
}
|
|
1210
|
-
return value instanceof ShadowRoot || value instanceof getWindow(value).ShadowRoot;
|
|
1211
|
-
}
|
|
1212
|
-
const invalidOverflowDisplayValues = /* @__PURE__ */ new Set(["inline", "contents"]);
|
|
1213
|
-
function isOverflowElement(element) {
|
|
1214
|
-
const {
|
|
1215
|
-
overflow,
|
|
1216
|
-
overflowX,
|
|
1217
|
-
overflowY,
|
|
1218
|
-
display
|
|
1219
|
-
} = getComputedStyle$1(element);
|
|
1220
|
-
return /auto|scroll|overlay|hidden|clip/.test(overflow + overflowY + overflowX) && !invalidOverflowDisplayValues.has(display);
|
|
1221
|
-
}
|
|
1222
|
-
const tableElements = /* @__PURE__ */ new Set(["table", "td", "th"]);
|
|
1223
|
-
function isTableElement(element) {
|
|
1224
|
-
return tableElements.has(getNodeName(element));
|
|
1225
|
-
}
|
|
1226
|
-
const topLayerSelectors = [":popover-open", ":modal"];
|
|
1227
|
-
function isTopLayer(element) {
|
|
1228
|
-
return topLayerSelectors.some((selector) => {
|
|
1229
|
-
try {
|
|
1230
|
-
return element.matches(selector);
|
|
1231
|
-
} catch (_e) {
|
|
1232
|
-
return false;
|
|
1233
|
-
}
|
|
1234
|
-
});
|
|
1235
|
-
}
|
|
1236
|
-
const transformProperties = ["transform", "translate", "scale", "rotate", "perspective"];
|
|
1237
|
-
const willChangeValues = ["transform", "translate", "scale", "rotate", "perspective", "filter"];
|
|
1238
|
-
const containValues = ["paint", "layout", "strict", "content"];
|
|
1239
|
-
function isContainingBlock(elementOrCss) {
|
|
1240
|
-
const webkit = isWebKit();
|
|
1241
|
-
const css = isElement(elementOrCss) ? getComputedStyle$1(elementOrCss) : elementOrCss;
|
|
1242
|
-
return transformProperties.some((value) => css[value] ? css[value] !== "none" : false) || (css.containerType ? css.containerType !== "normal" : false) || !webkit && (css.backdropFilter ? css.backdropFilter !== "none" : false) || !webkit && (css.filter ? css.filter !== "none" : false) || willChangeValues.some((value) => (css.willChange || "").includes(value)) || containValues.some((value) => (css.contain || "").includes(value));
|
|
1243
|
-
}
|
|
1244
|
-
function getContainingBlock(element) {
|
|
1245
|
-
let currentNode = getParentNode(element);
|
|
1246
|
-
while (isHTMLElement(currentNode) && !isLastTraversableNode(currentNode)) {
|
|
1247
|
-
if (isContainingBlock(currentNode)) {
|
|
1248
|
-
return currentNode;
|
|
1249
|
-
} else if (isTopLayer(currentNode)) {
|
|
1250
|
-
return null;
|
|
1251
|
-
}
|
|
1252
|
-
currentNode = getParentNode(currentNode);
|
|
1253
|
-
}
|
|
1254
|
-
return null;
|
|
1255
|
-
}
|
|
1256
|
-
function isWebKit() {
|
|
1257
|
-
if (typeof CSS === "undefined" || !CSS.supports) return false;
|
|
1258
|
-
return CSS.supports("-webkit-backdrop-filter", "none");
|
|
1259
|
-
}
|
|
1260
|
-
const lastTraversableNodeNames = /* @__PURE__ */ new Set(["html", "body", "#document"]);
|
|
1261
|
-
function isLastTraversableNode(node) {
|
|
1262
|
-
return lastTraversableNodeNames.has(getNodeName(node));
|
|
1263
|
-
}
|
|
1264
|
-
function getComputedStyle$1(element) {
|
|
1265
|
-
return getWindow(element).getComputedStyle(element);
|
|
1266
|
-
}
|
|
1267
|
-
function getNodeScroll(element) {
|
|
1268
|
-
if (isElement(element)) {
|
|
1269
|
-
return {
|
|
1270
|
-
scrollLeft: element.scrollLeft,
|
|
1271
|
-
scrollTop: element.scrollTop
|
|
1272
|
-
};
|
|
1273
|
-
}
|
|
1274
|
-
return {
|
|
1275
|
-
scrollLeft: element.scrollX,
|
|
1276
|
-
scrollTop: element.scrollY
|
|
1277
|
-
};
|
|
1278
|
-
}
|
|
1279
|
-
function getParentNode(node) {
|
|
1280
|
-
if (getNodeName(node) === "html") {
|
|
1281
|
-
return node;
|
|
1282
|
-
}
|
|
1283
|
-
const result = (
|
|
1284
|
-
// Step into the shadow DOM of the parent of a slotted node.
|
|
1285
|
-
node.assignedSlot || // DOM Element detected.
|
|
1286
|
-
node.parentNode || // ShadowRoot detected.
|
|
1287
|
-
isShadowRoot(node) && node.host || // Fallback.
|
|
1288
|
-
getDocumentElement(node)
|
|
1289
|
-
);
|
|
1290
|
-
return isShadowRoot(result) ? result.host : result;
|
|
1291
|
-
}
|
|
1292
|
-
function getNearestOverflowAncestor(node) {
|
|
1293
|
-
const parentNode = getParentNode(node);
|
|
1294
|
-
if (isLastTraversableNode(parentNode)) {
|
|
1295
|
-
return node.ownerDocument ? node.ownerDocument.body : node.body;
|
|
1296
|
-
}
|
|
1297
|
-
if (isHTMLElement(parentNode) && isOverflowElement(parentNode)) {
|
|
1298
|
-
return parentNode;
|
|
1299
|
-
}
|
|
1300
|
-
return getNearestOverflowAncestor(parentNode);
|
|
1301
|
-
}
|
|
1302
|
-
function getOverflowAncestors(node, list, traverseIframes) {
|
|
1303
|
-
var _node$ownerDocument2;
|
|
1304
|
-
if (list === void 0) {
|
|
1305
|
-
list = [];
|
|
1306
|
-
}
|
|
1307
|
-
if (traverseIframes === void 0) {
|
|
1308
|
-
traverseIframes = true;
|
|
1309
|
-
}
|
|
1310
|
-
const scrollableAncestor = getNearestOverflowAncestor(node);
|
|
1311
|
-
const isBody = scrollableAncestor === ((_node$ownerDocument2 = node.ownerDocument) == null ? void 0 : _node$ownerDocument2.body);
|
|
1312
|
-
const win = getWindow(scrollableAncestor);
|
|
1313
|
-
if (isBody) {
|
|
1314
|
-
const frameElement = getFrameElement(win);
|
|
1315
|
-
return list.concat(win, win.visualViewport || [], isOverflowElement(scrollableAncestor) ? scrollableAncestor : [], frameElement && traverseIframes ? getOverflowAncestors(frameElement) : []);
|
|
1316
|
-
}
|
|
1317
|
-
return list.concat(scrollableAncestor, getOverflowAncestors(scrollableAncestor, [], traverseIframes));
|
|
1318
|
-
}
|
|
1319
|
-
function getFrameElement(win) {
|
|
1320
|
-
return win.parent && Object.getPrototypeOf(win.parent) ? win.frameElement : null;
|
|
1321
|
-
}
|
|
1322
|
-
function getCssDimensions(element) {
|
|
1323
|
-
const css = getComputedStyle$1(element);
|
|
1324
|
-
let width = parseFloat(css.width) || 0;
|
|
1325
|
-
let height = parseFloat(css.height) || 0;
|
|
1326
|
-
const hasOffset = isHTMLElement(element);
|
|
1327
|
-
const offsetWidth = hasOffset ? element.offsetWidth : width;
|
|
1328
|
-
const offsetHeight = hasOffset ? element.offsetHeight : height;
|
|
1329
|
-
const shouldFallback = round(width) !== offsetWidth || round(height) !== offsetHeight;
|
|
1330
|
-
if (shouldFallback) {
|
|
1331
|
-
width = offsetWidth;
|
|
1332
|
-
height = offsetHeight;
|
|
1333
|
-
}
|
|
1334
|
-
return {
|
|
1335
|
-
width,
|
|
1336
|
-
height,
|
|
1337
|
-
$: shouldFallback
|
|
1338
|
-
};
|
|
1339
|
-
}
|
|
1340
|
-
function unwrapElement(element) {
|
|
1341
|
-
return !isElement(element) ? element.contextElement : element;
|
|
1342
|
-
}
|
|
1343
|
-
function getScale(element) {
|
|
1344
|
-
const domElement = unwrapElement(element);
|
|
1345
|
-
if (!isHTMLElement(domElement)) {
|
|
1346
|
-
return createCoords(1);
|
|
1347
|
-
}
|
|
1348
|
-
const rect = domElement.getBoundingClientRect();
|
|
1349
|
-
const {
|
|
1350
|
-
width,
|
|
1351
|
-
height,
|
|
1352
|
-
$
|
|
1353
|
-
} = getCssDimensions(domElement);
|
|
1354
|
-
let x = ($ ? round(rect.width) : rect.width) / width;
|
|
1355
|
-
let y = ($ ? round(rect.height) : rect.height) / height;
|
|
1356
|
-
if (!x || !Number.isFinite(x)) {
|
|
1357
|
-
x = 1;
|
|
1358
|
-
}
|
|
1359
|
-
if (!y || !Number.isFinite(y)) {
|
|
1360
|
-
y = 1;
|
|
1361
|
-
}
|
|
1362
|
-
return {
|
|
1363
|
-
x,
|
|
1364
|
-
y
|
|
1365
|
-
};
|
|
1366
|
-
}
|
|
1367
|
-
const noOffsets = /* @__PURE__ */ createCoords(0);
|
|
1368
|
-
function getVisualOffsets(element) {
|
|
1369
|
-
const win = getWindow(element);
|
|
1370
|
-
if (!isWebKit() || !win.visualViewport) {
|
|
1371
|
-
return noOffsets;
|
|
1372
|
-
}
|
|
1373
|
-
return {
|
|
1374
|
-
x: win.visualViewport.offsetLeft,
|
|
1375
|
-
y: win.visualViewport.offsetTop
|
|
1376
|
-
};
|
|
1377
|
-
}
|
|
1378
|
-
function shouldAddVisualOffsets(element, isFixed, floatingOffsetParent) {
|
|
1379
|
-
if (isFixed === void 0) {
|
|
1380
|
-
isFixed = false;
|
|
1381
|
-
}
|
|
1382
|
-
if (!floatingOffsetParent || isFixed && floatingOffsetParent !== getWindow(element)) {
|
|
1383
|
-
return false;
|
|
1384
|
-
}
|
|
1385
|
-
return isFixed;
|
|
1386
|
-
}
|
|
1387
|
-
function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetParent) {
|
|
1388
|
-
if (includeScale === void 0) {
|
|
1389
|
-
includeScale = false;
|
|
1390
|
-
}
|
|
1391
|
-
if (isFixedStrategy === void 0) {
|
|
1392
|
-
isFixedStrategy = false;
|
|
1393
|
-
}
|
|
1394
|
-
const clientRect = element.getBoundingClientRect();
|
|
1395
|
-
const domElement = unwrapElement(element);
|
|
1396
|
-
let scale = createCoords(1);
|
|
1397
|
-
if (includeScale) {
|
|
1398
|
-
if (offsetParent) {
|
|
1399
|
-
if (isElement(offsetParent)) {
|
|
1400
|
-
scale = getScale(offsetParent);
|
|
1401
|
-
}
|
|
1402
|
-
} else {
|
|
1403
|
-
scale = getScale(element);
|
|
1404
|
-
}
|
|
1405
|
-
}
|
|
1406
|
-
const visualOffsets = shouldAddVisualOffsets(domElement, isFixedStrategy, offsetParent) ? getVisualOffsets(domElement) : createCoords(0);
|
|
1407
|
-
let x = (clientRect.left + visualOffsets.x) / scale.x;
|
|
1408
|
-
let y = (clientRect.top + visualOffsets.y) / scale.y;
|
|
1409
|
-
let width = clientRect.width / scale.x;
|
|
1410
|
-
let height = clientRect.height / scale.y;
|
|
1411
|
-
if (domElement) {
|
|
1412
|
-
const win = getWindow(domElement);
|
|
1413
|
-
const offsetWin = offsetParent && isElement(offsetParent) ? getWindow(offsetParent) : offsetParent;
|
|
1414
|
-
let currentWin = win;
|
|
1415
|
-
let currentIFrame = getFrameElement(currentWin);
|
|
1416
|
-
while (currentIFrame && offsetParent && offsetWin !== currentWin) {
|
|
1417
|
-
const iframeScale = getScale(currentIFrame);
|
|
1418
|
-
const iframeRect = currentIFrame.getBoundingClientRect();
|
|
1419
|
-
const css = getComputedStyle$1(currentIFrame);
|
|
1420
|
-
const left = iframeRect.left + (currentIFrame.clientLeft + parseFloat(css.paddingLeft)) * iframeScale.x;
|
|
1421
|
-
const top = iframeRect.top + (currentIFrame.clientTop + parseFloat(css.paddingTop)) * iframeScale.y;
|
|
1422
|
-
x *= iframeScale.x;
|
|
1423
|
-
y *= iframeScale.y;
|
|
1424
|
-
width *= iframeScale.x;
|
|
1425
|
-
height *= iframeScale.y;
|
|
1426
|
-
x += left;
|
|
1427
|
-
y += top;
|
|
1428
|
-
currentWin = getWindow(currentIFrame);
|
|
1429
|
-
currentIFrame = getFrameElement(currentWin);
|
|
1430
|
-
}
|
|
1431
|
-
}
|
|
1432
|
-
return rectToClientRect({
|
|
1433
|
-
width,
|
|
1434
|
-
height,
|
|
1435
|
-
x,
|
|
1436
|
-
y
|
|
1437
|
-
});
|
|
1438
|
-
}
|
|
1439
|
-
function getWindowScrollBarX(element, rect) {
|
|
1440
|
-
const leftScroll = getNodeScroll(element).scrollLeft;
|
|
1441
|
-
if (!rect) {
|
|
1442
|
-
return getBoundingClientRect(getDocumentElement(element)).left + leftScroll;
|
|
1443
|
-
}
|
|
1444
|
-
return rect.left + leftScroll;
|
|
1445
|
-
}
|
|
1446
|
-
function getHTMLOffset(documentElement, scroll) {
|
|
1447
|
-
const htmlRect = documentElement.getBoundingClientRect();
|
|
1448
|
-
const x = htmlRect.left + scroll.scrollLeft - getWindowScrollBarX(documentElement, htmlRect);
|
|
1449
|
-
const y = htmlRect.top + scroll.scrollTop;
|
|
1450
|
-
return {
|
|
1451
|
-
x,
|
|
1452
|
-
y
|
|
1453
|
-
};
|
|
1454
|
-
}
|
|
1455
|
-
function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
|
|
1456
|
-
let {
|
|
1457
|
-
elements,
|
|
1458
|
-
rect,
|
|
1459
|
-
offsetParent,
|
|
1460
|
-
strategy
|
|
1461
|
-
} = _ref;
|
|
1462
|
-
const isFixed = strategy === "fixed";
|
|
1463
|
-
const documentElement = getDocumentElement(offsetParent);
|
|
1464
|
-
const topLayer = elements ? isTopLayer(elements.floating) : false;
|
|
1465
|
-
if (offsetParent === documentElement || topLayer && isFixed) {
|
|
1466
|
-
return rect;
|
|
1467
|
-
}
|
|
1468
|
-
let scroll = {
|
|
1469
|
-
scrollLeft: 0,
|
|
1470
|
-
scrollTop: 0
|
|
1471
|
-
};
|
|
1472
|
-
let scale = createCoords(1);
|
|
1473
|
-
const offsets = createCoords(0);
|
|
1474
|
-
const isOffsetParentAnElement = isHTMLElement(offsetParent);
|
|
1475
|
-
if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
|
|
1476
|
-
if (getNodeName(offsetParent) !== "body" || isOverflowElement(documentElement)) {
|
|
1477
|
-
scroll = getNodeScroll(offsetParent);
|
|
1478
|
-
}
|
|
1479
|
-
if (isHTMLElement(offsetParent)) {
|
|
1480
|
-
const offsetRect = getBoundingClientRect(offsetParent);
|
|
1481
|
-
scale = getScale(offsetParent);
|
|
1482
|
-
offsets.x = offsetRect.x + offsetParent.clientLeft;
|
|
1483
|
-
offsets.y = offsetRect.y + offsetParent.clientTop;
|
|
1484
|
-
}
|
|
1485
|
-
}
|
|
1486
|
-
const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
|
|
1487
|
-
return {
|
|
1488
|
-
width: rect.width * scale.x,
|
|
1489
|
-
height: rect.height * scale.y,
|
|
1490
|
-
x: rect.x * scale.x - scroll.scrollLeft * scale.x + offsets.x + htmlOffset.x,
|
|
1491
|
-
y: rect.y * scale.y - scroll.scrollTop * scale.y + offsets.y + htmlOffset.y
|
|
1492
|
-
};
|
|
1493
|
-
}
|
|
1494
|
-
function getClientRects(element) {
|
|
1495
|
-
return Array.from(element.getClientRects());
|
|
1496
|
-
}
|
|
1497
|
-
function getDocumentRect(element) {
|
|
1498
|
-
const html = getDocumentElement(element);
|
|
1499
|
-
const scroll = getNodeScroll(element);
|
|
1500
|
-
const body = element.ownerDocument.body;
|
|
1501
|
-
const width = max(html.scrollWidth, html.clientWidth, body.scrollWidth, body.clientWidth);
|
|
1502
|
-
const height = max(html.scrollHeight, html.clientHeight, body.scrollHeight, body.clientHeight);
|
|
1503
|
-
let x = -scroll.scrollLeft + getWindowScrollBarX(element);
|
|
1504
|
-
const y = -scroll.scrollTop;
|
|
1505
|
-
if (getComputedStyle$1(body).direction === "rtl") {
|
|
1506
|
-
x += max(html.clientWidth, body.clientWidth) - width;
|
|
1507
|
-
}
|
|
1508
|
-
return {
|
|
1509
|
-
width,
|
|
1510
|
-
height,
|
|
1511
|
-
x,
|
|
1512
|
-
y
|
|
1513
|
-
};
|
|
1514
|
-
}
|
|
1515
|
-
const SCROLLBAR_MAX = 25;
|
|
1516
|
-
function getViewportRect(element, strategy) {
|
|
1517
|
-
const win = getWindow(element);
|
|
1518
|
-
const html = getDocumentElement(element);
|
|
1519
|
-
const visualViewport = win.visualViewport;
|
|
1520
|
-
let width = html.clientWidth;
|
|
1521
|
-
let height = html.clientHeight;
|
|
1522
|
-
let x = 0;
|
|
1523
|
-
let y = 0;
|
|
1524
|
-
if (visualViewport) {
|
|
1525
|
-
width = visualViewport.width;
|
|
1526
|
-
height = visualViewport.height;
|
|
1527
|
-
const visualViewportBased = isWebKit();
|
|
1528
|
-
if (!visualViewportBased || visualViewportBased && strategy === "fixed") {
|
|
1529
|
-
x = visualViewport.offsetLeft;
|
|
1530
|
-
y = visualViewport.offsetTop;
|
|
1531
|
-
}
|
|
1532
|
-
}
|
|
1533
|
-
const windowScrollbarX = getWindowScrollBarX(html);
|
|
1534
|
-
if (windowScrollbarX <= 0) {
|
|
1535
|
-
const doc = html.ownerDocument;
|
|
1536
|
-
const body = doc.body;
|
|
1537
|
-
const bodyStyles = getComputedStyle(body);
|
|
1538
|
-
const bodyMarginInline = doc.compatMode === "CSS1Compat" ? parseFloat(bodyStyles.marginLeft) + parseFloat(bodyStyles.marginRight) || 0 : 0;
|
|
1539
|
-
const clippingStableScrollbarWidth = Math.abs(html.clientWidth - body.clientWidth - bodyMarginInline);
|
|
1540
|
-
if (clippingStableScrollbarWidth <= SCROLLBAR_MAX) {
|
|
1541
|
-
width -= clippingStableScrollbarWidth;
|
|
1542
|
-
}
|
|
1543
|
-
} else if (windowScrollbarX <= SCROLLBAR_MAX) {
|
|
1544
|
-
width += windowScrollbarX;
|
|
1545
|
-
}
|
|
1546
|
-
return {
|
|
1547
|
-
width,
|
|
1548
|
-
height,
|
|
1549
|
-
x,
|
|
1550
|
-
y
|
|
1551
|
-
};
|
|
1552
|
-
}
|
|
1553
|
-
const absoluteOrFixed = /* @__PURE__ */ new Set(["absolute", "fixed"]);
|
|
1554
|
-
function getInnerBoundingClientRect(element, strategy) {
|
|
1555
|
-
const clientRect = getBoundingClientRect(element, true, strategy === "fixed");
|
|
1556
|
-
const top = clientRect.top + element.clientTop;
|
|
1557
|
-
const left = clientRect.left + element.clientLeft;
|
|
1558
|
-
const scale = isHTMLElement(element) ? getScale(element) : createCoords(1);
|
|
1559
|
-
const width = element.clientWidth * scale.x;
|
|
1560
|
-
const height = element.clientHeight * scale.y;
|
|
1561
|
-
const x = left * scale.x;
|
|
1562
|
-
const y = top * scale.y;
|
|
1563
|
-
return {
|
|
1564
|
-
width,
|
|
1565
|
-
height,
|
|
1566
|
-
x,
|
|
1567
|
-
y
|
|
1568
|
-
};
|
|
1569
|
-
}
|
|
1570
|
-
function getClientRectFromClippingAncestor(element, clippingAncestor, strategy) {
|
|
1571
|
-
let rect;
|
|
1572
|
-
if (clippingAncestor === "viewport") {
|
|
1573
|
-
rect = getViewportRect(element, strategy);
|
|
1574
|
-
} else if (clippingAncestor === "document") {
|
|
1575
|
-
rect = getDocumentRect(getDocumentElement(element));
|
|
1576
|
-
} else if (isElement(clippingAncestor)) {
|
|
1577
|
-
rect = getInnerBoundingClientRect(clippingAncestor, strategy);
|
|
1578
|
-
} else {
|
|
1579
|
-
const visualOffsets = getVisualOffsets(element);
|
|
1580
|
-
rect = {
|
|
1581
|
-
x: clippingAncestor.x - visualOffsets.x,
|
|
1582
|
-
y: clippingAncestor.y - visualOffsets.y,
|
|
1583
|
-
width: clippingAncestor.width,
|
|
1584
|
-
height: clippingAncestor.height
|
|
1585
|
-
};
|
|
1586
|
-
}
|
|
1587
|
-
return rectToClientRect(rect);
|
|
1588
|
-
}
|
|
1589
|
-
function hasFixedPositionAncestor(element, stopNode) {
|
|
1590
|
-
const parentNode = getParentNode(element);
|
|
1591
|
-
if (parentNode === stopNode || !isElement(parentNode) || isLastTraversableNode(parentNode)) {
|
|
1592
|
-
return false;
|
|
1593
|
-
}
|
|
1594
|
-
return getComputedStyle$1(parentNode).position === "fixed" || hasFixedPositionAncestor(parentNode, stopNode);
|
|
1595
|
-
}
|
|
1596
|
-
function getClippingElementAncestors(element, cache) {
|
|
1597
|
-
const cachedResult = cache.get(element);
|
|
1598
|
-
if (cachedResult) {
|
|
1599
|
-
return cachedResult;
|
|
1600
|
-
}
|
|
1601
|
-
let result = getOverflowAncestors(element, [], false).filter((el) => isElement(el) && getNodeName(el) !== "body");
|
|
1602
|
-
let currentContainingBlockComputedStyle = null;
|
|
1603
|
-
const elementIsFixed = getComputedStyle$1(element).position === "fixed";
|
|
1604
|
-
let currentNode = elementIsFixed ? getParentNode(element) : element;
|
|
1605
|
-
while (isElement(currentNode) && !isLastTraversableNode(currentNode)) {
|
|
1606
|
-
const computedStyle = getComputedStyle$1(currentNode);
|
|
1607
|
-
const currentNodeIsContaining = isContainingBlock(currentNode);
|
|
1608
|
-
if (!currentNodeIsContaining && computedStyle.position === "fixed") {
|
|
1609
|
-
currentContainingBlockComputedStyle = null;
|
|
1610
|
-
}
|
|
1611
|
-
const shouldDropCurrentNode = elementIsFixed ? !currentNodeIsContaining && !currentContainingBlockComputedStyle : !currentNodeIsContaining && computedStyle.position === "static" && !!currentContainingBlockComputedStyle && absoluteOrFixed.has(currentContainingBlockComputedStyle.position) || isOverflowElement(currentNode) && !currentNodeIsContaining && hasFixedPositionAncestor(element, currentNode);
|
|
1612
|
-
if (shouldDropCurrentNode) {
|
|
1613
|
-
result = result.filter((ancestor) => ancestor !== currentNode);
|
|
1614
|
-
} else {
|
|
1615
|
-
currentContainingBlockComputedStyle = computedStyle;
|
|
1616
|
-
}
|
|
1617
|
-
currentNode = getParentNode(currentNode);
|
|
1618
|
-
}
|
|
1619
|
-
cache.set(element, result);
|
|
1620
|
-
return result;
|
|
1621
|
-
}
|
|
1622
|
-
function getClippingRect(_ref) {
|
|
1623
|
-
let {
|
|
1624
|
-
element,
|
|
1625
|
-
boundary,
|
|
1626
|
-
rootBoundary,
|
|
1627
|
-
strategy
|
|
1628
|
-
} = _ref;
|
|
1629
|
-
const elementClippingAncestors = boundary === "clippingAncestors" ? isTopLayer(element) ? [] : getClippingElementAncestors(element, this._c) : [].concat(boundary);
|
|
1630
|
-
const clippingAncestors = [...elementClippingAncestors, rootBoundary];
|
|
1631
|
-
const firstClippingAncestor = clippingAncestors[0];
|
|
1632
|
-
const clippingRect = clippingAncestors.reduce((accRect, clippingAncestor) => {
|
|
1633
|
-
const rect = getClientRectFromClippingAncestor(element, clippingAncestor, strategy);
|
|
1634
|
-
accRect.top = max(rect.top, accRect.top);
|
|
1635
|
-
accRect.right = min(rect.right, accRect.right);
|
|
1636
|
-
accRect.bottom = min(rect.bottom, accRect.bottom);
|
|
1637
|
-
accRect.left = max(rect.left, accRect.left);
|
|
1638
|
-
return accRect;
|
|
1639
|
-
}, getClientRectFromClippingAncestor(element, firstClippingAncestor, strategy));
|
|
1640
|
-
return {
|
|
1641
|
-
width: clippingRect.right - clippingRect.left,
|
|
1642
|
-
height: clippingRect.bottom - clippingRect.top,
|
|
1643
|
-
x: clippingRect.left,
|
|
1644
|
-
y: clippingRect.top
|
|
1645
|
-
};
|
|
1646
|
-
}
|
|
1647
|
-
function getDimensions(element) {
|
|
1648
|
-
const {
|
|
1649
|
-
width,
|
|
1650
|
-
height
|
|
1651
|
-
} = getCssDimensions(element);
|
|
1652
|
-
return {
|
|
1653
|
-
width,
|
|
1654
|
-
height
|
|
1655
|
-
};
|
|
1656
|
-
}
|
|
1657
|
-
function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
|
|
1658
|
-
const isOffsetParentAnElement = isHTMLElement(offsetParent);
|
|
1659
|
-
const documentElement = getDocumentElement(offsetParent);
|
|
1660
|
-
const isFixed = strategy === "fixed";
|
|
1661
|
-
const rect = getBoundingClientRect(element, true, isFixed, offsetParent);
|
|
1662
|
-
let scroll = {
|
|
1663
|
-
scrollLeft: 0,
|
|
1664
|
-
scrollTop: 0
|
|
1665
|
-
};
|
|
1666
|
-
const offsets = createCoords(0);
|
|
1667
|
-
function setLeftRTLScrollbarOffset() {
|
|
1668
|
-
offsets.x = getWindowScrollBarX(documentElement);
|
|
1669
|
-
}
|
|
1670
|
-
if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
|
|
1671
|
-
if (getNodeName(offsetParent) !== "body" || isOverflowElement(documentElement)) {
|
|
1672
|
-
scroll = getNodeScroll(offsetParent);
|
|
1673
|
-
}
|
|
1674
|
-
if (isOffsetParentAnElement) {
|
|
1675
|
-
const offsetRect = getBoundingClientRect(offsetParent, true, isFixed, offsetParent);
|
|
1676
|
-
offsets.x = offsetRect.x + offsetParent.clientLeft;
|
|
1677
|
-
offsets.y = offsetRect.y + offsetParent.clientTop;
|
|
1678
|
-
} else if (documentElement) {
|
|
1679
|
-
setLeftRTLScrollbarOffset();
|
|
1680
|
-
}
|
|
1681
|
-
}
|
|
1682
|
-
if (isFixed && !isOffsetParentAnElement && documentElement) {
|
|
1683
|
-
setLeftRTLScrollbarOffset();
|
|
1684
|
-
}
|
|
1685
|
-
const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
|
|
1686
|
-
const x = rect.left + scroll.scrollLeft - offsets.x - htmlOffset.x;
|
|
1687
|
-
const y = rect.top + scroll.scrollTop - offsets.y - htmlOffset.y;
|
|
1688
|
-
return {
|
|
1689
|
-
x,
|
|
1690
|
-
y,
|
|
1691
|
-
width: rect.width,
|
|
1692
|
-
height: rect.height
|
|
1693
|
-
};
|
|
1694
|
-
}
|
|
1695
|
-
function isStaticPositioned(element) {
|
|
1696
|
-
return getComputedStyle$1(element).position === "static";
|
|
1697
|
-
}
|
|
1698
|
-
function getTrueOffsetParent(element, polyfill) {
|
|
1699
|
-
if (!isHTMLElement(element) || getComputedStyle$1(element).position === "fixed") {
|
|
1700
|
-
return null;
|
|
1701
|
-
}
|
|
1702
|
-
if (polyfill) {
|
|
1703
|
-
return polyfill(element);
|
|
1704
|
-
}
|
|
1705
|
-
let rawOffsetParent = element.offsetParent;
|
|
1706
|
-
if (getDocumentElement(element) === rawOffsetParent) {
|
|
1707
|
-
rawOffsetParent = rawOffsetParent.ownerDocument.body;
|
|
1708
|
-
}
|
|
1709
|
-
return rawOffsetParent;
|
|
1710
|
-
}
|
|
1711
|
-
function getOffsetParent(element, polyfill) {
|
|
1712
|
-
const win = getWindow(element);
|
|
1713
|
-
if (isTopLayer(element)) {
|
|
1714
|
-
return win;
|
|
1715
|
-
}
|
|
1716
|
-
if (!isHTMLElement(element)) {
|
|
1717
|
-
let svgOffsetParent = getParentNode(element);
|
|
1718
|
-
while (svgOffsetParent && !isLastTraversableNode(svgOffsetParent)) {
|
|
1719
|
-
if (isElement(svgOffsetParent) && !isStaticPositioned(svgOffsetParent)) {
|
|
1720
|
-
return svgOffsetParent;
|
|
1721
|
-
}
|
|
1722
|
-
svgOffsetParent = getParentNode(svgOffsetParent);
|
|
1723
|
-
}
|
|
1724
|
-
return win;
|
|
1725
|
-
}
|
|
1726
|
-
let offsetParent = getTrueOffsetParent(element, polyfill);
|
|
1727
|
-
while (offsetParent && isTableElement(offsetParent) && isStaticPositioned(offsetParent)) {
|
|
1728
|
-
offsetParent = getTrueOffsetParent(offsetParent, polyfill);
|
|
1729
|
-
}
|
|
1730
|
-
if (offsetParent && isLastTraversableNode(offsetParent) && isStaticPositioned(offsetParent) && !isContainingBlock(offsetParent)) {
|
|
1731
|
-
return win;
|
|
1732
|
-
}
|
|
1733
|
-
return offsetParent || getContainingBlock(element) || win;
|
|
1734
|
-
}
|
|
1735
|
-
const getElementRects = async function(data) {
|
|
1736
|
-
const getOffsetParentFn = this.getOffsetParent || getOffsetParent;
|
|
1737
|
-
const getDimensionsFn = this.getDimensions;
|
|
1738
|
-
const floatingDimensions = await getDimensionsFn(data.floating);
|
|
1739
|
-
return {
|
|
1740
|
-
reference: getRectRelativeToOffsetParent(data.reference, await getOffsetParentFn(data.floating), data.strategy),
|
|
1741
|
-
floating: {
|
|
1742
|
-
x: 0,
|
|
1743
|
-
y: 0,
|
|
1744
|
-
width: floatingDimensions.width,
|
|
1745
|
-
height: floatingDimensions.height
|
|
1746
|
-
}
|
|
1747
|
-
};
|
|
1748
|
-
};
|
|
1749
|
-
function isRTL(element) {
|
|
1750
|
-
return getComputedStyle$1(element).direction === "rtl";
|
|
1751
|
-
}
|
|
1752
|
-
const platform = {
|
|
1753
|
-
convertOffsetParentRelativeRectToViewportRelativeRect,
|
|
1754
|
-
getDocumentElement,
|
|
1755
|
-
getClippingRect,
|
|
1756
|
-
getOffsetParent,
|
|
1757
|
-
getElementRects,
|
|
1758
|
-
getClientRects,
|
|
1759
|
-
getDimensions,
|
|
1760
|
-
getScale,
|
|
1761
|
-
isElement,
|
|
1762
|
-
isRTL
|
|
1763
|
-
};
|
|
1764
|
-
function rectsAreEqual(a, b) {
|
|
1765
|
-
return a.x === b.x && a.y === b.y && a.width === b.width && a.height === b.height;
|
|
1766
|
-
}
|
|
1767
|
-
function observeMove(element, onMove) {
|
|
1768
|
-
let io = null;
|
|
1769
|
-
let timeoutId;
|
|
1770
|
-
const root = getDocumentElement(element);
|
|
1771
|
-
function cleanup() {
|
|
1772
|
-
var _io;
|
|
1773
|
-
clearTimeout(timeoutId);
|
|
1774
|
-
(_io = io) == null || _io.disconnect();
|
|
1775
|
-
io = null;
|
|
1776
|
-
}
|
|
1777
|
-
function refresh(skip, threshold) {
|
|
1778
|
-
if (skip === void 0) {
|
|
1779
|
-
skip = false;
|
|
1780
|
-
}
|
|
1781
|
-
if (threshold === void 0) {
|
|
1782
|
-
threshold = 1;
|
|
1783
|
-
}
|
|
1784
|
-
cleanup();
|
|
1785
|
-
const elementRectForRootMargin = element.getBoundingClientRect();
|
|
1786
|
-
const {
|
|
1787
|
-
left,
|
|
1788
|
-
top,
|
|
1789
|
-
width,
|
|
1790
|
-
height
|
|
1791
|
-
} = elementRectForRootMargin;
|
|
1792
|
-
if (!skip) {
|
|
1793
|
-
onMove();
|
|
1794
|
-
}
|
|
1795
|
-
if (!width || !height) {
|
|
1796
|
-
return;
|
|
1797
|
-
}
|
|
1798
|
-
const insetTop = floor(top);
|
|
1799
|
-
const insetRight = floor(root.clientWidth - (left + width));
|
|
1800
|
-
const insetBottom = floor(root.clientHeight - (top + height));
|
|
1801
|
-
const insetLeft = floor(left);
|
|
1802
|
-
const rootMargin = -insetTop + "px " + -insetRight + "px " + -insetBottom + "px " + -insetLeft + "px";
|
|
1803
|
-
const options = {
|
|
1804
|
-
rootMargin,
|
|
1805
|
-
threshold: max(0, min(1, threshold)) || 1
|
|
1806
|
-
};
|
|
1807
|
-
let isFirstUpdate = true;
|
|
1808
|
-
function handleObserve(entries) {
|
|
1809
|
-
const ratio = entries[0].intersectionRatio;
|
|
1810
|
-
if (ratio !== threshold) {
|
|
1811
|
-
if (!isFirstUpdate) {
|
|
1812
|
-
return refresh();
|
|
1813
|
-
}
|
|
1814
|
-
if (!ratio) {
|
|
1815
|
-
timeoutId = setTimeout(() => {
|
|
1816
|
-
refresh(false, 1e-7);
|
|
1817
|
-
}, 1e3);
|
|
1818
|
-
} else {
|
|
1819
|
-
refresh(false, ratio);
|
|
1820
|
-
}
|
|
1821
|
-
}
|
|
1822
|
-
if (ratio === 1 && !rectsAreEqual(elementRectForRootMargin, element.getBoundingClientRect())) {
|
|
1823
|
-
refresh();
|
|
1824
|
-
}
|
|
1825
|
-
isFirstUpdate = false;
|
|
1826
|
-
}
|
|
1827
|
-
try {
|
|
1828
|
-
io = new IntersectionObserver(handleObserve, {
|
|
1829
|
-
...options,
|
|
1830
|
-
// Handle <iframe>s
|
|
1831
|
-
root: root.ownerDocument
|
|
1832
|
-
});
|
|
1833
|
-
} catch (_e) {
|
|
1834
|
-
io = new IntersectionObserver(handleObserve, options);
|
|
1835
|
-
}
|
|
1836
|
-
io.observe(element);
|
|
1837
|
-
}
|
|
1838
|
-
refresh(true);
|
|
1839
|
-
return cleanup;
|
|
1840
|
-
}
|
|
1841
|
-
function autoUpdate(reference, floating, update, options) {
|
|
1842
|
-
if (options === void 0) {
|
|
1843
|
-
options = {};
|
|
1844
|
-
}
|
|
1845
|
-
const {
|
|
1846
|
-
ancestorScroll = true,
|
|
1847
|
-
ancestorResize = true,
|
|
1848
|
-
elementResize = typeof ResizeObserver === "function",
|
|
1849
|
-
layoutShift = typeof IntersectionObserver === "function",
|
|
1850
|
-
animationFrame = false
|
|
1851
|
-
} = options;
|
|
1852
|
-
const referenceEl = unwrapElement(reference);
|
|
1853
|
-
const ancestors = ancestorScroll || ancestorResize ? [...referenceEl ? getOverflowAncestors(referenceEl) : [], ...getOverflowAncestors(floating)] : [];
|
|
1854
|
-
ancestors.forEach((ancestor) => {
|
|
1855
|
-
ancestorScroll && ancestor.addEventListener("scroll", update, {
|
|
1856
|
-
passive: true
|
|
1857
|
-
});
|
|
1858
|
-
ancestorResize && ancestor.addEventListener("resize", update);
|
|
1859
|
-
});
|
|
1860
|
-
const cleanupIo = referenceEl && layoutShift ? observeMove(referenceEl, update) : null;
|
|
1861
|
-
let reobserveFrame = -1;
|
|
1862
|
-
let resizeObserver = null;
|
|
1863
|
-
if (elementResize) {
|
|
1864
|
-
resizeObserver = new ResizeObserver((_ref) => {
|
|
1865
|
-
let [firstEntry] = _ref;
|
|
1866
|
-
if (firstEntry && firstEntry.target === referenceEl && resizeObserver) {
|
|
1867
|
-
resizeObserver.unobserve(floating);
|
|
1868
|
-
cancelAnimationFrame(reobserveFrame);
|
|
1869
|
-
reobserveFrame = requestAnimationFrame(() => {
|
|
1870
|
-
var _resizeObserver;
|
|
1871
|
-
(_resizeObserver = resizeObserver) == null || _resizeObserver.observe(floating);
|
|
1872
|
-
});
|
|
1873
|
-
}
|
|
1874
|
-
update();
|
|
1875
|
-
});
|
|
1876
|
-
if (referenceEl && !animationFrame) {
|
|
1877
|
-
resizeObserver.observe(referenceEl);
|
|
1878
|
-
}
|
|
1879
|
-
resizeObserver.observe(floating);
|
|
1880
|
-
}
|
|
1881
|
-
let frameId;
|
|
1882
|
-
let prevRefRect = animationFrame ? getBoundingClientRect(reference) : null;
|
|
1883
|
-
if (animationFrame) {
|
|
1884
|
-
frameLoop();
|
|
1885
|
-
}
|
|
1886
|
-
function frameLoop() {
|
|
1887
|
-
const nextRefRect = getBoundingClientRect(reference);
|
|
1888
|
-
if (prevRefRect && !rectsAreEqual(prevRefRect, nextRefRect)) {
|
|
1889
|
-
update();
|
|
1890
|
-
}
|
|
1891
|
-
prevRefRect = nextRefRect;
|
|
1892
|
-
frameId = requestAnimationFrame(frameLoop);
|
|
1893
|
-
}
|
|
1894
|
-
update();
|
|
1895
|
-
return () => {
|
|
1896
|
-
var _resizeObserver2;
|
|
1897
|
-
ancestors.forEach((ancestor) => {
|
|
1898
|
-
ancestorScroll && ancestor.removeEventListener("scroll", update);
|
|
1899
|
-
ancestorResize && ancestor.removeEventListener("resize", update);
|
|
1900
|
-
});
|
|
1901
|
-
cleanupIo == null || cleanupIo();
|
|
1902
|
-
(_resizeObserver2 = resizeObserver) == null || _resizeObserver2.disconnect();
|
|
1903
|
-
resizeObserver = null;
|
|
1904
|
-
if (animationFrame) {
|
|
1905
|
-
cancelAnimationFrame(frameId);
|
|
1906
|
-
}
|
|
1907
|
-
};
|
|
1908
|
-
}
|
|
1909
|
-
const offset$1 = offset$2;
|
|
1910
|
-
const shift$1 = shift$2;
|
|
1911
|
-
const flip$1 = flip$2;
|
|
1912
|
-
const size$1 = size$2;
|
|
1913
|
-
const hide$1 = hide$2;
|
|
1914
|
-
const arrow$2 = arrow$3;
|
|
1915
|
-
const limitShift$1 = limitShift$2;
|
|
1916
|
-
const computePosition = (reference, floating, options) => {
|
|
1917
|
-
const cache = /* @__PURE__ */ new Map();
|
|
1918
|
-
const mergedOptions = {
|
|
1919
|
-
platform,
|
|
1920
|
-
...options
|
|
1921
|
-
};
|
|
1922
|
-
const platformWithCache = {
|
|
1923
|
-
...mergedOptions.platform,
|
|
1924
|
-
_c: cache
|
|
1925
|
-
};
|
|
1926
|
-
return computePosition$1(reference, floating, {
|
|
1927
|
-
...mergedOptions,
|
|
1928
|
-
platform: platformWithCache
|
|
1929
|
-
});
|
|
1930
|
-
};
|
|
1931
|
-
var isClient = typeof document !== "undefined";
|
|
1932
|
-
var noop = function noop2() {
|
|
1933
|
-
};
|
|
1934
|
-
var index = isClient ? useLayoutEffect : noop;
|
|
1935
|
-
function deepEqual(a, b) {
|
|
1936
|
-
if (a === b) {
|
|
1937
|
-
return true;
|
|
1938
|
-
}
|
|
1939
|
-
if (typeof a !== typeof b) {
|
|
1940
|
-
return false;
|
|
1941
|
-
}
|
|
1942
|
-
if (typeof a === "function" && a.toString() === b.toString()) {
|
|
1943
|
-
return true;
|
|
1944
|
-
}
|
|
1945
|
-
let length;
|
|
1946
|
-
let i;
|
|
1947
|
-
let keys;
|
|
1948
|
-
if (a && b && typeof a === "object") {
|
|
1949
|
-
if (Array.isArray(a)) {
|
|
1950
|
-
length = a.length;
|
|
1951
|
-
if (length !== b.length) return false;
|
|
1952
|
-
for (i = length; i-- !== 0; ) {
|
|
1953
|
-
if (!deepEqual(a[i], b[i])) {
|
|
1954
|
-
return false;
|
|
1955
|
-
}
|
|
1956
|
-
}
|
|
1957
|
-
return true;
|
|
1958
|
-
}
|
|
1959
|
-
keys = Object.keys(a);
|
|
1960
|
-
length = keys.length;
|
|
1961
|
-
if (length !== Object.keys(b).length) {
|
|
1962
|
-
return false;
|
|
1963
|
-
}
|
|
1964
|
-
for (i = length; i-- !== 0; ) {
|
|
1965
|
-
if (!{}.hasOwnProperty.call(b, keys[i])) {
|
|
1966
|
-
return false;
|
|
1967
|
-
}
|
|
1968
|
-
}
|
|
1969
|
-
for (i = length; i-- !== 0; ) {
|
|
1970
|
-
const key = keys[i];
|
|
1971
|
-
if (key === "_owner" && a.$$typeof) {
|
|
1972
|
-
continue;
|
|
1973
|
-
}
|
|
1974
|
-
if (!deepEqual(a[key], b[key])) {
|
|
1975
|
-
return false;
|
|
1976
|
-
}
|
|
1977
|
-
}
|
|
1978
|
-
return true;
|
|
1979
|
-
}
|
|
1980
|
-
return a !== a && b !== b;
|
|
1981
|
-
}
|
|
1982
|
-
function getDPR(element) {
|
|
1983
|
-
if (typeof window === "undefined") {
|
|
1984
|
-
return 1;
|
|
1985
|
-
}
|
|
1986
|
-
const win = element.ownerDocument.defaultView || window;
|
|
1987
|
-
return win.devicePixelRatio || 1;
|
|
1988
|
-
}
|
|
1989
|
-
function roundByDPR(element, value) {
|
|
1990
|
-
const dpr = getDPR(element);
|
|
1991
|
-
return Math.round(value * dpr) / dpr;
|
|
1992
|
-
}
|
|
1993
|
-
function useLatestRef(value) {
|
|
1994
|
-
const ref = React.useRef(value);
|
|
1995
|
-
index(() => {
|
|
1996
|
-
ref.current = value;
|
|
1997
|
-
});
|
|
1998
|
-
return ref;
|
|
1999
|
-
}
|
|
2000
|
-
function useFloating(options) {
|
|
2001
|
-
if (options === void 0) {
|
|
2002
|
-
options = {};
|
|
2003
|
-
}
|
|
2004
|
-
const {
|
|
2005
|
-
placement = "bottom",
|
|
2006
|
-
strategy = "absolute",
|
|
2007
|
-
middleware = [],
|
|
2008
|
-
platform: platform2,
|
|
2009
|
-
elements: {
|
|
2010
|
-
reference: externalReference,
|
|
2011
|
-
floating: externalFloating
|
|
2012
|
-
} = {},
|
|
2013
|
-
transform = true,
|
|
2014
|
-
whileElementsMounted,
|
|
2015
|
-
open
|
|
2016
|
-
} = options;
|
|
2017
|
-
const [data, setData] = React.useState({
|
|
2018
|
-
x: 0,
|
|
2019
|
-
y: 0,
|
|
2020
|
-
strategy,
|
|
2021
|
-
placement,
|
|
2022
|
-
middlewareData: {},
|
|
2023
|
-
isPositioned: false
|
|
2024
|
-
});
|
|
2025
|
-
const [latestMiddleware, setLatestMiddleware] = React.useState(middleware);
|
|
2026
|
-
if (!deepEqual(latestMiddleware, middleware)) {
|
|
2027
|
-
setLatestMiddleware(middleware);
|
|
2028
|
-
}
|
|
2029
|
-
const [_reference, _setReference] = React.useState(null);
|
|
2030
|
-
const [_floating, _setFloating] = React.useState(null);
|
|
2031
|
-
const setReference = React.useCallback((node) => {
|
|
2032
|
-
if (node !== referenceRef.current) {
|
|
2033
|
-
referenceRef.current = node;
|
|
2034
|
-
_setReference(node);
|
|
2035
|
-
}
|
|
2036
|
-
}, []);
|
|
2037
|
-
const setFloating = React.useCallback((node) => {
|
|
2038
|
-
if (node !== floatingRef.current) {
|
|
2039
|
-
floatingRef.current = node;
|
|
2040
|
-
_setFloating(node);
|
|
2041
|
-
}
|
|
2042
|
-
}, []);
|
|
2043
|
-
const referenceEl = externalReference || _reference;
|
|
2044
|
-
const floatingEl = externalFloating || _floating;
|
|
2045
|
-
const referenceRef = React.useRef(null);
|
|
2046
|
-
const floatingRef = React.useRef(null);
|
|
2047
|
-
const dataRef = React.useRef(data);
|
|
2048
|
-
const hasWhileElementsMounted = whileElementsMounted != null;
|
|
2049
|
-
const whileElementsMountedRef = useLatestRef(whileElementsMounted);
|
|
2050
|
-
const platformRef = useLatestRef(platform2);
|
|
2051
|
-
const openRef = useLatestRef(open);
|
|
2052
|
-
const update = React.useCallback(() => {
|
|
2053
|
-
if (!referenceRef.current || !floatingRef.current) {
|
|
2054
|
-
return;
|
|
2055
|
-
}
|
|
2056
|
-
const config = {
|
|
2057
|
-
placement,
|
|
2058
|
-
strategy,
|
|
2059
|
-
middleware: latestMiddleware
|
|
2060
|
-
};
|
|
2061
|
-
if (platformRef.current) {
|
|
2062
|
-
config.platform = platformRef.current;
|
|
2063
|
-
}
|
|
2064
|
-
computePosition(referenceRef.current, floatingRef.current, config).then((data2) => {
|
|
2065
|
-
const fullData = {
|
|
2066
|
-
...data2,
|
|
2067
|
-
// The floating element's position may be recomputed while it's closed
|
|
2068
|
-
// but still mounted (such as when transitioning out). To ensure
|
|
2069
|
-
// `isPositioned` will be `false` initially on the next open, avoid
|
|
2070
|
-
// setting it to `true` when `open === false` (must be specified).
|
|
2071
|
-
isPositioned: openRef.current !== false
|
|
2072
|
-
};
|
|
2073
|
-
if (isMountedRef.current && !deepEqual(dataRef.current, fullData)) {
|
|
2074
|
-
dataRef.current = fullData;
|
|
2075
|
-
ReactDOM.flushSync(() => {
|
|
2076
|
-
setData(fullData);
|
|
2077
|
-
});
|
|
2078
|
-
}
|
|
2079
|
-
});
|
|
2080
|
-
}, [latestMiddleware, placement, strategy, platformRef, openRef]);
|
|
2081
|
-
index(() => {
|
|
2082
|
-
if (open === false && dataRef.current.isPositioned) {
|
|
2083
|
-
dataRef.current.isPositioned = false;
|
|
2084
|
-
setData((data2) => ({
|
|
2085
|
-
...data2,
|
|
2086
|
-
isPositioned: false
|
|
2087
|
-
}));
|
|
2088
|
-
}
|
|
2089
|
-
}, [open]);
|
|
2090
|
-
const isMountedRef = React.useRef(false);
|
|
2091
|
-
index(() => {
|
|
2092
|
-
isMountedRef.current = true;
|
|
2093
|
-
return () => {
|
|
2094
|
-
isMountedRef.current = false;
|
|
2095
|
-
};
|
|
2096
|
-
}, []);
|
|
2097
|
-
index(() => {
|
|
2098
|
-
if (referenceEl) referenceRef.current = referenceEl;
|
|
2099
|
-
if (floatingEl) floatingRef.current = floatingEl;
|
|
2100
|
-
if (referenceEl && floatingEl) {
|
|
2101
|
-
if (whileElementsMountedRef.current) {
|
|
2102
|
-
return whileElementsMountedRef.current(referenceEl, floatingEl, update);
|
|
2103
|
-
}
|
|
2104
|
-
update();
|
|
2105
|
-
}
|
|
2106
|
-
}, [referenceEl, floatingEl, update, whileElementsMountedRef, hasWhileElementsMounted]);
|
|
2107
|
-
const refs = React.useMemo(() => ({
|
|
2108
|
-
reference: referenceRef,
|
|
2109
|
-
floating: floatingRef,
|
|
2110
|
-
setReference,
|
|
2111
|
-
setFloating
|
|
2112
|
-
}), [setReference, setFloating]);
|
|
2113
|
-
const elements = React.useMemo(() => ({
|
|
2114
|
-
reference: referenceEl,
|
|
2115
|
-
floating: floatingEl
|
|
2116
|
-
}), [referenceEl, floatingEl]);
|
|
2117
|
-
const floatingStyles = React.useMemo(() => {
|
|
2118
|
-
const initialStyles = {
|
|
2119
|
-
position: strategy,
|
|
2120
|
-
left: 0,
|
|
2121
|
-
top: 0
|
|
2122
|
-
};
|
|
2123
|
-
if (!elements.floating) {
|
|
2124
|
-
return initialStyles;
|
|
2125
|
-
}
|
|
2126
|
-
const x = roundByDPR(elements.floating, data.x);
|
|
2127
|
-
const y = roundByDPR(elements.floating, data.y);
|
|
2128
|
-
if (transform) {
|
|
2129
|
-
return {
|
|
2130
|
-
...initialStyles,
|
|
2131
|
-
transform: "translate(" + x + "px, " + y + "px)",
|
|
2132
|
-
...getDPR(elements.floating) >= 1.5 && {
|
|
2133
|
-
willChange: "transform"
|
|
2134
|
-
}
|
|
2135
|
-
};
|
|
2136
|
-
}
|
|
2137
|
-
return {
|
|
2138
|
-
position: strategy,
|
|
2139
|
-
left: x,
|
|
2140
|
-
top: y
|
|
2141
|
-
};
|
|
2142
|
-
}, [strategy, transform, elements.floating, data.x, data.y]);
|
|
2143
|
-
return React.useMemo(() => ({
|
|
2144
|
-
...data,
|
|
2145
|
-
update,
|
|
2146
|
-
refs,
|
|
2147
|
-
elements,
|
|
2148
|
-
floatingStyles
|
|
2149
|
-
}), [data, update, refs, elements, floatingStyles]);
|
|
2150
|
-
}
|
|
2151
|
-
const arrow$1 = (options) => {
|
|
2152
|
-
function isRef(value) {
|
|
2153
|
-
return {}.hasOwnProperty.call(value, "current");
|
|
2154
|
-
}
|
|
2155
|
-
return {
|
|
2156
|
-
name: "arrow",
|
|
2157
|
-
options,
|
|
2158
|
-
fn(state) {
|
|
2159
|
-
const {
|
|
2160
|
-
element,
|
|
2161
|
-
padding
|
|
2162
|
-
} = typeof options === "function" ? options(state) : options;
|
|
2163
|
-
if (element && isRef(element)) {
|
|
2164
|
-
if (element.current != null) {
|
|
2165
|
-
return arrow$2({
|
|
2166
|
-
element: element.current,
|
|
2167
|
-
padding
|
|
2168
|
-
}).fn(state);
|
|
2169
|
-
}
|
|
2170
|
-
return {};
|
|
2171
|
-
}
|
|
2172
|
-
if (element) {
|
|
2173
|
-
return arrow$2({
|
|
2174
|
-
element,
|
|
2175
|
-
padding
|
|
2176
|
-
}).fn(state);
|
|
2177
|
-
}
|
|
2178
|
-
return {};
|
|
2179
|
-
}
|
|
2180
|
-
};
|
|
2181
|
-
};
|
|
2182
|
-
const offset = (options, deps) => ({
|
|
2183
|
-
...offset$1(options),
|
|
2184
|
-
options: [options, deps]
|
|
2185
|
-
});
|
|
2186
|
-
const shift = (options, deps) => ({
|
|
2187
|
-
...shift$1(options),
|
|
2188
|
-
options: [options, deps]
|
|
2189
|
-
});
|
|
2190
|
-
const limitShift = (options, deps) => ({
|
|
2191
|
-
...limitShift$1(options),
|
|
2192
|
-
options: [options, deps]
|
|
2193
|
-
});
|
|
2194
|
-
const flip = (options, deps) => ({
|
|
2195
|
-
...flip$1(options),
|
|
2196
|
-
options: [options, deps]
|
|
2197
|
-
});
|
|
2198
|
-
const size = (options, deps) => ({
|
|
2199
|
-
...size$1(options),
|
|
2200
|
-
options: [options, deps]
|
|
2201
|
-
});
|
|
2202
|
-
const hide = (options, deps) => ({
|
|
2203
|
-
...hide$1(options),
|
|
2204
|
-
options: [options, deps]
|
|
2205
|
-
});
|
|
2206
|
-
const arrow = (options, deps) => ({
|
|
2207
|
-
...arrow$1(options),
|
|
2208
|
-
options: [options, deps]
|
|
2209
|
-
});
|
|
2210
|
-
var NAME = "Arrow";
|
|
2211
|
-
var Arrow$1 = React.forwardRef((props, forwardedRef) => {
|
|
2212
|
-
const { children, width = 10, height = 5, ...arrowProps } = props;
|
|
2213
|
-
return /* @__PURE__ */ jsx(
|
|
2214
|
-
Primitive.svg,
|
|
2215
|
-
{
|
|
2216
|
-
...arrowProps,
|
|
2217
|
-
ref: forwardedRef,
|
|
2218
|
-
width,
|
|
2219
|
-
height,
|
|
2220
|
-
viewBox: "0 0 30 10",
|
|
2221
|
-
preserveAspectRatio: "none",
|
|
2222
|
-
children: props.asChild ? children : /* @__PURE__ */ jsx("polygon", { points: "0,0 30,0 15,10" })
|
|
2223
|
-
}
|
|
2224
|
-
);
|
|
2225
|
-
});
|
|
2226
|
-
Arrow$1.displayName = NAME;
|
|
2227
|
-
var Root = Arrow$1;
|
|
2228
|
-
function useSize(element) {
|
|
2229
|
-
const [size2, setSize] = React.useState(void 0);
|
|
2230
|
-
useLayoutEffect2(() => {
|
|
2231
|
-
if (element) {
|
|
2232
|
-
setSize({ width: element.offsetWidth, height: element.offsetHeight });
|
|
2233
|
-
const resizeObserver = new ResizeObserver((entries) => {
|
|
2234
|
-
if (!Array.isArray(entries)) {
|
|
2235
|
-
return;
|
|
2236
|
-
}
|
|
2237
|
-
if (!entries.length) {
|
|
2238
|
-
return;
|
|
2239
|
-
}
|
|
2240
|
-
const entry = entries[0];
|
|
2241
|
-
let width;
|
|
2242
|
-
let height;
|
|
2243
|
-
if ("borderBoxSize" in entry) {
|
|
2244
|
-
const borderSizeEntry = entry["borderBoxSize"];
|
|
2245
|
-
const borderSize = Array.isArray(borderSizeEntry) ? borderSizeEntry[0] : borderSizeEntry;
|
|
2246
|
-
width = borderSize["inlineSize"];
|
|
2247
|
-
height = borderSize["blockSize"];
|
|
2248
|
-
} else {
|
|
2249
|
-
width = element.offsetWidth;
|
|
2250
|
-
height = element.offsetHeight;
|
|
2251
|
-
}
|
|
2252
|
-
setSize({ width, height });
|
|
2253
|
-
});
|
|
2254
|
-
resizeObserver.observe(element, { box: "border-box" });
|
|
2255
|
-
return () => resizeObserver.unobserve(element);
|
|
2256
|
-
} else {
|
|
2257
|
-
setSize(void 0);
|
|
2258
|
-
}
|
|
2259
|
-
}, [element]);
|
|
2260
|
-
return size2;
|
|
2261
|
-
}
|
|
2262
|
-
var POPPER_NAME = "Popper";
|
|
2263
|
-
var [createPopperContext, createPopperScope] = createContextScope(POPPER_NAME);
|
|
2264
|
-
var [PopperProvider, usePopperContext] = createPopperContext(POPPER_NAME);
|
|
2265
|
-
var Popper = (props) => {
|
|
2266
|
-
const { __scopePopper, children } = props;
|
|
2267
|
-
const [anchor, setAnchor] = React.useState(null);
|
|
2268
|
-
return /* @__PURE__ */ jsx(PopperProvider, { scope: __scopePopper, anchor, onAnchorChange: setAnchor, children });
|
|
2269
|
-
};
|
|
2270
|
-
Popper.displayName = POPPER_NAME;
|
|
2271
|
-
var ANCHOR_NAME$1 = "PopperAnchor";
|
|
2272
|
-
var PopperAnchor = React.forwardRef(
|
|
2273
|
-
(props, forwardedRef) => {
|
|
2274
|
-
const { __scopePopper, virtualRef, ...anchorProps } = props;
|
|
2275
|
-
const context = usePopperContext(ANCHOR_NAME$1, __scopePopper);
|
|
2276
|
-
const ref = React.useRef(null);
|
|
2277
|
-
const composedRefs = useComposedRefs(forwardedRef, ref);
|
|
2278
|
-
const anchorRef = React.useRef(null);
|
|
2279
|
-
React.useEffect(() => {
|
|
2280
|
-
const previousAnchor = anchorRef.current;
|
|
2281
|
-
anchorRef.current = (virtualRef == null ? void 0 : virtualRef.current) || ref.current;
|
|
2282
|
-
if (previousAnchor !== anchorRef.current) {
|
|
2283
|
-
context.onAnchorChange(anchorRef.current);
|
|
2284
|
-
}
|
|
2285
|
-
});
|
|
2286
|
-
return virtualRef ? null : /* @__PURE__ */ jsx(Primitive.div, { ...anchorProps, ref: composedRefs });
|
|
2287
|
-
}
|
|
2288
|
-
);
|
|
2289
|
-
PopperAnchor.displayName = ANCHOR_NAME$1;
|
|
2290
|
-
var CONTENT_NAME$1 = "PopperContent";
|
|
2291
|
-
var [PopperContentProvider, useContentContext] = createPopperContext(CONTENT_NAME$1);
|
|
2292
|
-
var PopperContent = React.forwardRef(
|
|
2293
|
-
(props, forwardedRef) => {
|
|
2294
|
-
var _a, _b, _c, _d, _e, _f;
|
|
2295
|
-
const {
|
|
2296
|
-
__scopePopper,
|
|
2297
|
-
side = "bottom",
|
|
2298
|
-
sideOffset = 0,
|
|
2299
|
-
align = "center",
|
|
2300
|
-
alignOffset = 0,
|
|
2301
|
-
arrowPadding = 0,
|
|
2302
|
-
avoidCollisions = true,
|
|
2303
|
-
collisionBoundary = [],
|
|
2304
|
-
collisionPadding: collisionPaddingProp = 0,
|
|
2305
|
-
sticky = "partial",
|
|
2306
|
-
hideWhenDetached = false,
|
|
2307
|
-
updatePositionStrategy = "optimized",
|
|
2308
|
-
onPlaced,
|
|
2309
|
-
...contentProps
|
|
2310
|
-
} = props;
|
|
2311
|
-
const context = usePopperContext(CONTENT_NAME$1, __scopePopper);
|
|
2312
|
-
const [content, setContent] = React.useState(null);
|
|
2313
|
-
const composedRefs = useComposedRefs(forwardedRef, (node) => setContent(node));
|
|
2314
|
-
const [arrow$12, setArrow] = React.useState(null);
|
|
2315
|
-
const arrowSize = useSize(arrow$12);
|
|
2316
|
-
const arrowWidth = (arrowSize == null ? void 0 : arrowSize.width) ?? 0;
|
|
2317
|
-
const arrowHeight = (arrowSize == null ? void 0 : arrowSize.height) ?? 0;
|
|
2318
|
-
const desiredPlacement = side + (align !== "center" ? "-" + align : "");
|
|
2319
|
-
const collisionPadding = typeof collisionPaddingProp === "number" ? collisionPaddingProp : { top: 0, right: 0, bottom: 0, left: 0, ...collisionPaddingProp };
|
|
2320
|
-
const boundary = Array.isArray(collisionBoundary) ? collisionBoundary : [collisionBoundary];
|
|
2321
|
-
const hasExplicitBoundaries = boundary.length > 0;
|
|
2322
|
-
const detectOverflowOptions = {
|
|
2323
|
-
padding: collisionPadding,
|
|
2324
|
-
boundary: boundary.filter(isNotNull),
|
|
2325
|
-
// with `strategy: 'fixed'`, this is the only way to get it to respect boundaries
|
|
2326
|
-
altBoundary: hasExplicitBoundaries
|
|
2327
|
-
};
|
|
2328
|
-
const { refs, floatingStyles, placement, isPositioned, middlewareData } = useFloating({
|
|
2329
|
-
// default to `fixed` strategy so users don't have to pick and we also avoid focus scroll issues
|
|
2330
|
-
strategy: "fixed",
|
|
2331
|
-
placement: desiredPlacement,
|
|
2332
|
-
whileElementsMounted: (...args) => {
|
|
2333
|
-
const cleanup = autoUpdate(...args, {
|
|
2334
|
-
animationFrame: updatePositionStrategy === "always"
|
|
2335
|
-
});
|
|
2336
|
-
return cleanup;
|
|
2337
|
-
},
|
|
2338
|
-
elements: {
|
|
2339
|
-
reference: context.anchor
|
|
2340
|
-
},
|
|
2341
|
-
middleware: [
|
|
2342
|
-
offset({ mainAxis: sideOffset + arrowHeight, alignmentAxis: alignOffset }),
|
|
2343
|
-
avoidCollisions && shift({
|
|
2344
|
-
mainAxis: true,
|
|
2345
|
-
crossAxis: false,
|
|
2346
|
-
limiter: sticky === "partial" ? limitShift() : void 0,
|
|
2347
|
-
...detectOverflowOptions
|
|
2348
|
-
}),
|
|
2349
|
-
avoidCollisions && flip({ ...detectOverflowOptions }),
|
|
2350
|
-
size({
|
|
2351
|
-
...detectOverflowOptions,
|
|
2352
|
-
apply: ({ elements, rects, availableWidth, availableHeight }) => {
|
|
2353
|
-
const { width: anchorWidth, height: anchorHeight } = rects.reference;
|
|
2354
|
-
const contentStyle = elements.floating.style;
|
|
2355
|
-
contentStyle.setProperty("--radix-popper-available-width", `${availableWidth}px`);
|
|
2356
|
-
contentStyle.setProperty("--radix-popper-available-height", `${availableHeight}px`);
|
|
2357
|
-
contentStyle.setProperty("--radix-popper-anchor-width", `${anchorWidth}px`);
|
|
2358
|
-
contentStyle.setProperty("--radix-popper-anchor-height", `${anchorHeight}px`);
|
|
2359
|
-
}
|
|
2360
|
-
}),
|
|
2361
|
-
arrow$12 && arrow({ element: arrow$12, padding: arrowPadding }),
|
|
2362
|
-
transformOrigin({ arrowWidth, arrowHeight }),
|
|
2363
|
-
hideWhenDetached && hide({ strategy: "referenceHidden", ...detectOverflowOptions })
|
|
2364
|
-
]
|
|
2365
|
-
});
|
|
2366
|
-
const [placedSide, placedAlign] = getSideAndAlignFromPlacement(placement);
|
|
2367
|
-
const handlePlaced = useCallbackRef(onPlaced);
|
|
2368
|
-
useLayoutEffect2(() => {
|
|
2369
|
-
if (isPositioned) {
|
|
2370
|
-
handlePlaced == null ? void 0 : handlePlaced();
|
|
2371
|
-
}
|
|
2372
|
-
}, [isPositioned, handlePlaced]);
|
|
2373
|
-
const arrowX = (_a = middlewareData.arrow) == null ? void 0 : _a.x;
|
|
2374
|
-
const arrowY = (_b = middlewareData.arrow) == null ? void 0 : _b.y;
|
|
2375
|
-
const cannotCenterArrow = ((_c = middlewareData.arrow) == null ? void 0 : _c.centerOffset) !== 0;
|
|
2376
|
-
const [contentZIndex, setContentZIndex] = React.useState();
|
|
2377
|
-
useLayoutEffect2(() => {
|
|
2378
|
-
if (content) setContentZIndex(window.getComputedStyle(content).zIndex);
|
|
2379
|
-
}, [content]);
|
|
2380
|
-
return /* @__PURE__ */ jsx(
|
|
2381
|
-
"div",
|
|
2382
|
-
{
|
|
2383
|
-
ref: refs.setFloating,
|
|
2384
|
-
"data-radix-popper-content-wrapper": "",
|
|
2385
|
-
style: {
|
|
2386
|
-
...floatingStyles,
|
|
2387
|
-
transform: isPositioned ? floatingStyles.transform : "translate(0, -200%)",
|
|
2388
|
-
// keep off the page when measuring
|
|
2389
|
-
minWidth: "max-content",
|
|
2390
|
-
zIndex: contentZIndex,
|
|
2391
|
-
["--radix-popper-transform-origin"]: [
|
|
2392
|
-
(_d = middlewareData.transformOrigin) == null ? void 0 : _d.x,
|
|
2393
|
-
(_e = middlewareData.transformOrigin) == null ? void 0 : _e.y
|
|
2394
|
-
].join(" "),
|
|
2395
|
-
// hide the content if using the hide middleware and should be hidden
|
|
2396
|
-
// set visibility to hidden and disable pointer events so the UI behaves
|
|
2397
|
-
// as if the PopperContent isn't there at all
|
|
2398
|
-
...((_f = middlewareData.hide) == null ? void 0 : _f.referenceHidden) && {
|
|
2399
|
-
visibility: "hidden",
|
|
2400
|
-
pointerEvents: "none"
|
|
2401
|
-
}
|
|
2402
|
-
},
|
|
2403
|
-
dir: props.dir,
|
|
2404
|
-
children: /* @__PURE__ */ jsx(
|
|
2405
|
-
PopperContentProvider,
|
|
2406
|
-
{
|
|
2407
|
-
scope: __scopePopper,
|
|
2408
|
-
placedSide,
|
|
2409
|
-
onArrowChange: setArrow,
|
|
2410
|
-
arrowX,
|
|
2411
|
-
arrowY,
|
|
2412
|
-
shouldHideArrow: cannotCenterArrow,
|
|
2413
|
-
children: /* @__PURE__ */ jsx(
|
|
2414
|
-
Primitive.div,
|
|
2415
|
-
{
|
|
2416
|
-
"data-side": placedSide,
|
|
2417
|
-
"data-align": placedAlign,
|
|
2418
|
-
...contentProps,
|
|
2419
|
-
ref: composedRefs,
|
|
2420
|
-
style: {
|
|
2421
|
-
...contentProps.style,
|
|
2422
|
-
// if the PopperContent hasn't been placed yet (not all measurements done)
|
|
2423
|
-
// we prevent animations so that users's animation don't kick in too early referring wrong sides
|
|
2424
|
-
animation: !isPositioned ? "none" : void 0
|
|
2425
|
-
}
|
|
2426
|
-
}
|
|
2427
|
-
)
|
|
2428
|
-
}
|
|
2429
|
-
)
|
|
2430
|
-
}
|
|
2431
|
-
);
|
|
2432
|
-
}
|
|
2433
|
-
);
|
|
2434
|
-
PopperContent.displayName = CONTENT_NAME$1;
|
|
2435
|
-
var ARROW_NAME$1 = "PopperArrow";
|
|
2436
|
-
var OPPOSITE_SIDE = {
|
|
2437
|
-
top: "bottom",
|
|
2438
|
-
right: "left",
|
|
2439
|
-
bottom: "top",
|
|
2440
|
-
left: "right"
|
|
2441
|
-
};
|
|
2442
|
-
var PopperArrow = React.forwardRef(function PopperArrow2(props, forwardedRef) {
|
|
2443
|
-
const { __scopePopper, ...arrowProps } = props;
|
|
2444
|
-
const contentContext = useContentContext(ARROW_NAME$1, __scopePopper);
|
|
2445
|
-
const baseSide = OPPOSITE_SIDE[contentContext.placedSide];
|
|
2446
|
-
return (
|
|
2447
|
-
// we have to use an extra wrapper because `ResizeObserver` (used by `useSize`)
|
|
2448
|
-
// doesn't report size as we'd expect on SVG elements.
|
|
2449
|
-
// it reports their bounding box which is effectively the largest path inside the SVG.
|
|
2450
|
-
/* @__PURE__ */ jsx(
|
|
2451
|
-
"span",
|
|
2452
|
-
{
|
|
2453
|
-
ref: contentContext.onArrowChange,
|
|
2454
|
-
style: {
|
|
2455
|
-
position: "absolute",
|
|
2456
|
-
left: contentContext.arrowX,
|
|
2457
|
-
top: contentContext.arrowY,
|
|
2458
|
-
[baseSide]: 0,
|
|
2459
|
-
transformOrigin: {
|
|
2460
|
-
top: "",
|
|
2461
|
-
right: "0 0",
|
|
2462
|
-
bottom: "center 0",
|
|
2463
|
-
left: "100% 0"
|
|
2464
|
-
}[contentContext.placedSide],
|
|
2465
|
-
transform: {
|
|
2466
|
-
top: "translateY(100%)",
|
|
2467
|
-
right: "translateY(50%) rotate(90deg) translateX(-50%)",
|
|
2468
|
-
bottom: `rotate(180deg)`,
|
|
2469
|
-
left: "translateY(50%) rotate(-90deg) translateX(50%)"
|
|
2470
|
-
}[contentContext.placedSide],
|
|
2471
|
-
visibility: contentContext.shouldHideArrow ? "hidden" : void 0
|
|
2472
|
-
},
|
|
2473
|
-
children: /* @__PURE__ */ jsx(
|
|
2474
|
-
Root,
|
|
2475
|
-
{
|
|
2476
|
-
...arrowProps,
|
|
2477
|
-
ref: forwardedRef,
|
|
2478
|
-
style: {
|
|
2479
|
-
...arrowProps.style,
|
|
2480
|
-
// ensures the element can be measured correctly (mostly for if SVG)
|
|
2481
|
-
display: "block"
|
|
2482
|
-
}
|
|
2483
|
-
}
|
|
2484
|
-
)
|
|
2485
|
-
}
|
|
2486
|
-
)
|
|
2487
|
-
);
|
|
2488
|
-
});
|
|
2489
|
-
PopperArrow.displayName = ARROW_NAME$1;
|
|
2490
|
-
function isNotNull(value) {
|
|
2491
|
-
return value !== null;
|
|
2492
|
-
}
|
|
2493
|
-
var transformOrigin = (options) => ({
|
|
2494
|
-
name: "transformOrigin",
|
|
2495
|
-
options,
|
|
2496
|
-
fn(data) {
|
|
2497
|
-
var _a, _b, _c;
|
|
2498
|
-
const { placement, rects, middlewareData } = data;
|
|
2499
|
-
const cannotCenterArrow = ((_a = middlewareData.arrow) == null ? void 0 : _a.centerOffset) !== 0;
|
|
2500
|
-
const isArrowHidden = cannotCenterArrow;
|
|
2501
|
-
const arrowWidth = isArrowHidden ? 0 : options.arrowWidth;
|
|
2502
|
-
const arrowHeight = isArrowHidden ? 0 : options.arrowHeight;
|
|
2503
|
-
const [placedSide, placedAlign] = getSideAndAlignFromPlacement(placement);
|
|
2504
|
-
const noArrowAlign = { start: "0%", center: "50%", end: "100%" }[placedAlign];
|
|
2505
|
-
const arrowXCenter = (((_b = middlewareData.arrow) == null ? void 0 : _b.x) ?? 0) + arrowWidth / 2;
|
|
2506
|
-
const arrowYCenter = (((_c = middlewareData.arrow) == null ? void 0 : _c.y) ?? 0) + arrowHeight / 2;
|
|
2507
|
-
let x = "";
|
|
2508
|
-
let y = "";
|
|
2509
|
-
if (placedSide === "bottom") {
|
|
2510
|
-
x = isArrowHidden ? noArrowAlign : `${arrowXCenter}px`;
|
|
2511
|
-
y = `${-arrowHeight}px`;
|
|
2512
|
-
} else if (placedSide === "top") {
|
|
2513
|
-
x = isArrowHidden ? noArrowAlign : `${arrowXCenter}px`;
|
|
2514
|
-
y = `${rects.floating.height + arrowHeight}px`;
|
|
2515
|
-
} else if (placedSide === "right") {
|
|
2516
|
-
x = `${-arrowHeight}px`;
|
|
2517
|
-
y = isArrowHidden ? noArrowAlign : `${arrowYCenter}px`;
|
|
2518
|
-
} else if (placedSide === "left") {
|
|
2519
|
-
x = `${rects.floating.width + arrowHeight}px`;
|
|
2520
|
-
y = isArrowHidden ? noArrowAlign : `${arrowYCenter}px`;
|
|
2521
|
-
}
|
|
2522
|
-
return { data: { x, y } };
|
|
2523
|
-
}
|
|
2524
|
-
});
|
|
2525
|
-
function getSideAndAlignFromPlacement(placement) {
|
|
2526
|
-
const [side, align = "center"] = placement.split("-");
|
|
2527
|
-
return [side, align];
|
|
2528
|
-
}
|
|
2529
|
-
var Root2$1 = Popper;
|
|
2530
|
-
var Anchor = PopperAnchor;
|
|
2531
|
-
var Content = PopperContent;
|
|
2532
|
-
var Arrow = PopperArrow;
|
|
2533
|
-
var POPOVER_NAME = "Popover";
|
|
2534
|
-
var [createPopoverContext] = createContextScope(POPOVER_NAME, [
|
|
2535
|
-
createPopperScope
|
|
2536
|
-
]);
|
|
2537
|
-
var usePopperScope = createPopperScope();
|
|
2538
|
-
var [PopoverProvider, usePopoverContext] = createPopoverContext(POPOVER_NAME);
|
|
2539
|
-
var Popover = (props) => {
|
|
2540
|
-
const {
|
|
2541
|
-
__scopePopover,
|
|
2542
|
-
children,
|
|
2543
|
-
open: openProp,
|
|
2544
|
-
defaultOpen,
|
|
2545
|
-
onOpenChange,
|
|
2546
|
-
modal = false
|
|
2547
|
-
} = props;
|
|
2548
|
-
const popperScope = usePopperScope(__scopePopover);
|
|
2549
|
-
const triggerRef = React.useRef(null);
|
|
2550
|
-
const [hasCustomAnchor, setHasCustomAnchor] = React.useState(false);
|
|
2551
|
-
const [open, setOpen] = useControllableState({
|
|
2552
|
-
prop: openProp,
|
|
2553
|
-
defaultProp: defaultOpen ?? false,
|
|
2554
|
-
onChange: onOpenChange,
|
|
2555
|
-
caller: POPOVER_NAME
|
|
2556
|
-
});
|
|
2557
|
-
return /* @__PURE__ */ jsx(Root2$1, { ...popperScope, children: /* @__PURE__ */ jsx(
|
|
2558
|
-
PopoverProvider,
|
|
2559
|
-
{
|
|
2560
|
-
scope: __scopePopover,
|
|
2561
|
-
contentId: useId(),
|
|
2562
|
-
triggerRef,
|
|
2563
|
-
open,
|
|
2564
|
-
onOpenChange: setOpen,
|
|
2565
|
-
onOpenToggle: React.useCallback(() => setOpen((prevOpen) => !prevOpen), [setOpen]),
|
|
2566
|
-
hasCustomAnchor,
|
|
2567
|
-
onCustomAnchorAdd: React.useCallback(() => setHasCustomAnchor(true), []),
|
|
2568
|
-
onCustomAnchorRemove: React.useCallback(() => setHasCustomAnchor(false), []),
|
|
2569
|
-
modal,
|
|
2570
|
-
children
|
|
2571
|
-
}
|
|
2572
|
-
) });
|
|
2573
|
-
};
|
|
2574
|
-
Popover.displayName = POPOVER_NAME;
|
|
2575
|
-
var ANCHOR_NAME = "PopoverAnchor";
|
|
2576
|
-
var PopoverAnchor = React.forwardRef(
|
|
2577
|
-
(props, forwardedRef) => {
|
|
2578
|
-
const { __scopePopover, ...anchorProps } = props;
|
|
2579
|
-
const context = usePopoverContext(ANCHOR_NAME, __scopePopover);
|
|
2580
|
-
const popperScope = usePopperScope(__scopePopover);
|
|
2581
|
-
const { onCustomAnchorAdd, onCustomAnchorRemove } = context;
|
|
2582
|
-
React.useEffect(() => {
|
|
2583
|
-
onCustomAnchorAdd();
|
|
2584
|
-
return () => onCustomAnchorRemove();
|
|
2585
|
-
}, [onCustomAnchorAdd, onCustomAnchorRemove]);
|
|
2586
|
-
return /* @__PURE__ */ jsx(Anchor, { ...popperScope, ...anchorProps, ref: forwardedRef });
|
|
2587
|
-
}
|
|
2588
|
-
);
|
|
2589
|
-
PopoverAnchor.displayName = ANCHOR_NAME;
|
|
2590
|
-
var TRIGGER_NAME = "PopoverTrigger";
|
|
2591
|
-
var PopoverTrigger = React.forwardRef(
|
|
2592
|
-
(props, forwardedRef) => {
|
|
2593
|
-
const { __scopePopover, ...triggerProps } = props;
|
|
2594
|
-
const context = usePopoverContext(TRIGGER_NAME, __scopePopover);
|
|
2595
|
-
const popperScope = usePopperScope(__scopePopover);
|
|
2596
|
-
const composedTriggerRef = useComposedRefs(forwardedRef, context.triggerRef);
|
|
2597
|
-
const trigger = /* @__PURE__ */ jsx(
|
|
2598
|
-
Primitive.button,
|
|
2599
|
-
{
|
|
2600
|
-
type: "button",
|
|
2601
|
-
"aria-haspopup": "dialog",
|
|
2602
|
-
"aria-expanded": context.open,
|
|
2603
|
-
"aria-controls": context.contentId,
|
|
2604
|
-
"data-state": getState(context.open),
|
|
2605
|
-
...triggerProps,
|
|
2606
|
-
ref: composedTriggerRef,
|
|
2607
|
-
onClick: composeEventHandlers(props.onClick, context.onOpenToggle)
|
|
2608
|
-
}
|
|
2609
|
-
);
|
|
2610
|
-
return context.hasCustomAnchor ? trigger : /* @__PURE__ */ jsx(Anchor, { asChild: true, ...popperScope, children: trigger });
|
|
2611
|
-
}
|
|
2612
|
-
);
|
|
2613
|
-
PopoverTrigger.displayName = TRIGGER_NAME;
|
|
2614
|
-
var PORTAL_NAME = "PopoverPortal";
|
|
2615
|
-
var [PortalProvider, usePortalContext] = createPopoverContext(PORTAL_NAME, {
|
|
2616
|
-
forceMount: void 0
|
|
2617
|
-
});
|
|
2618
|
-
var PopoverPortal = (props) => {
|
|
2619
|
-
const { __scopePopover, forceMount, children, container } = props;
|
|
2620
|
-
const context = usePopoverContext(PORTAL_NAME, __scopePopover);
|
|
2621
|
-
return /* @__PURE__ */ jsx(PortalProvider, { scope: __scopePopover, forceMount, children: /* @__PURE__ */ jsx(Presence, { present: forceMount || context.open, children: /* @__PURE__ */ jsx(Portal$1, { asChild: true, container, children }) }) });
|
|
2622
|
-
};
|
|
2623
|
-
PopoverPortal.displayName = PORTAL_NAME;
|
|
2624
|
-
var CONTENT_NAME = "PopoverContent";
|
|
2625
|
-
var PopoverContent = React.forwardRef(
|
|
2626
|
-
(props, forwardedRef) => {
|
|
2627
|
-
const portalContext = usePortalContext(CONTENT_NAME, props.__scopePopover);
|
|
2628
|
-
const { forceMount = portalContext.forceMount, ...contentProps } = props;
|
|
2629
|
-
const context = usePopoverContext(CONTENT_NAME, props.__scopePopover);
|
|
2630
|
-
return /* @__PURE__ */ jsx(Presence, { present: forceMount || context.open, children: context.modal ? /* @__PURE__ */ jsx(PopoverContentModal, { ...contentProps, ref: forwardedRef }) : /* @__PURE__ */ jsx(PopoverContentNonModal, { ...contentProps, ref: forwardedRef }) });
|
|
2631
|
-
}
|
|
2632
|
-
);
|
|
2633
|
-
PopoverContent.displayName = CONTENT_NAME;
|
|
2634
|
-
var Slot = createSlot("PopoverContent.RemoveScroll");
|
|
2635
|
-
var PopoverContentModal = React.forwardRef(
|
|
2636
|
-
(props, forwardedRef) => {
|
|
2637
|
-
const context = usePopoverContext(CONTENT_NAME, props.__scopePopover);
|
|
2638
|
-
const contentRef = React.useRef(null);
|
|
2639
|
-
const composedRefs = useComposedRefs(forwardedRef, contentRef);
|
|
2640
|
-
const isRightClickOutsideRef = React.useRef(false);
|
|
2641
|
-
React.useEffect(() => {
|
|
2642
|
-
const content = contentRef.current;
|
|
2643
|
-
if (content) return hideOthers(content);
|
|
2644
|
-
}, []);
|
|
2645
|
-
return /* @__PURE__ */ jsx(ReactRemoveScroll, { as: Slot, allowPinchZoom: true, children: /* @__PURE__ */ jsx(
|
|
2646
|
-
PopoverContentImpl,
|
|
2647
|
-
{
|
|
2648
|
-
...props,
|
|
2649
|
-
ref: composedRefs,
|
|
2650
|
-
trapFocus: context.open,
|
|
2651
|
-
disableOutsidePointerEvents: true,
|
|
2652
|
-
onCloseAutoFocus: composeEventHandlers(props.onCloseAutoFocus, (event) => {
|
|
2653
|
-
var _a;
|
|
2654
|
-
event.preventDefault();
|
|
2655
|
-
if (!isRightClickOutsideRef.current) (_a = context.triggerRef.current) == null ? void 0 : _a.focus();
|
|
2656
|
-
}),
|
|
2657
|
-
onPointerDownOutside: composeEventHandlers(
|
|
2658
|
-
props.onPointerDownOutside,
|
|
2659
|
-
(event) => {
|
|
2660
|
-
const originalEvent = event.detail.originalEvent;
|
|
2661
|
-
const ctrlLeftClick = originalEvent.button === 0 && originalEvent.ctrlKey === true;
|
|
2662
|
-
const isRightClick = originalEvent.button === 2 || ctrlLeftClick;
|
|
2663
|
-
isRightClickOutsideRef.current = isRightClick;
|
|
2664
|
-
},
|
|
2665
|
-
{ checkForDefaultPrevented: false }
|
|
2666
|
-
),
|
|
2667
|
-
onFocusOutside: composeEventHandlers(
|
|
2668
|
-
props.onFocusOutside,
|
|
2669
|
-
(event) => event.preventDefault(),
|
|
2670
|
-
{ checkForDefaultPrevented: false }
|
|
2671
|
-
)
|
|
2672
|
-
}
|
|
2673
|
-
) });
|
|
2674
|
-
}
|
|
2675
|
-
);
|
|
2676
|
-
var PopoverContentNonModal = React.forwardRef(
|
|
2677
|
-
(props, forwardedRef) => {
|
|
2678
|
-
const context = usePopoverContext(CONTENT_NAME, props.__scopePopover);
|
|
2679
|
-
const hasInteractedOutsideRef = React.useRef(false);
|
|
2680
|
-
const hasPointerDownOutsideRef = React.useRef(false);
|
|
2681
|
-
return /* @__PURE__ */ jsx(
|
|
2682
|
-
PopoverContentImpl,
|
|
2683
|
-
{
|
|
2684
|
-
...props,
|
|
2685
|
-
ref: forwardedRef,
|
|
2686
|
-
trapFocus: false,
|
|
2687
|
-
disableOutsidePointerEvents: false,
|
|
2688
|
-
onCloseAutoFocus: (event) => {
|
|
2689
|
-
var _a, _b;
|
|
2690
|
-
(_a = props.onCloseAutoFocus) == null ? void 0 : _a.call(props, event);
|
|
2691
|
-
if (!event.defaultPrevented) {
|
|
2692
|
-
if (!hasInteractedOutsideRef.current) (_b = context.triggerRef.current) == null ? void 0 : _b.focus();
|
|
2693
|
-
event.preventDefault();
|
|
2694
|
-
}
|
|
2695
|
-
hasInteractedOutsideRef.current = false;
|
|
2696
|
-
hasPointerDownOutsideRef.current = false;
|
|
2697
|
-
},
|
|
2698
|
-
onInteractOutside: (event) => {
|
|
2699
|
-
var _a, _b;
|
|
2700
|
-
(_a = props.onInteractOutside) == null ? void 0 : _a.call(props, event);
|
|
2701
|
-
if (!event.defaultPrevented) {
|
|
2702
|
-
hasInteractedOutsideRef.current = true;
|
|
2703
|
-
if (event.detail.originalEvent.type === "pointerdown") {
|
|
2704
|
-
hasPointerDownOutsideRef.current = true;
|
|
2705
|
-
}
|
|
2706
|
-
}
|
|
2707
|
-
const target = event.target;
|
|
2708
|
-
const targetIsTrigger = (_b = context.triggerRef.current) == null ? void 0 : _b.contains(target);
|
|
2709
|
-
if (targetIsTrigger) event.preventDefault();
|
|
2710
|
-
if (event.detail.originalEvent.type === "focusin" && hasPointerDownOutsideRef.current) {
|
|
2711
|
-
event.preventDefault();
|
|
2712
|
-
}
|
|
2713
|
-
}
|
|
2714
|
-
}
|
|
2715
|
-
);
|
|
2716
|
-
}
|
|
2717
|
-
);
|
|
2718
|
-
var PopoverContentImpl = React.forwardRef(
|
|
2719
|
-
(props, forwardedRef) => {
|
|
2720
|
-
const {
|
|
2721
|
-
__scopePopover,
|
|
2722
|
-
trapFocus,
|
|
2723
|
-
onOpenAutoFocus,
|
|
2724
|
-
onCloseAutoFocus,
|
|
2725
|
-
disableOutsidePointerEvents,
|
|
2726
|
-
onEscapeKeyDown,
|
|
2727
|
-
onPointerDownOutside,
|
|
2728
|
-
onFocusOutside,
|
|
2729
|
-
onInteractOutside,
|
|
2730
|
-
...contentProps
|
|
2731
|
-
} = props;
|
|
2732
|
-
const context = usePopoverContext(CONTENT_NAME, __scopePopover);
|
|
2733
|
-
const popperScope = usePopperScope(__scopePopover);
|
|
2734
|
-
useFocusGuards();
|
|
2735
|
-
return /* @__PURE__ */ jsx(
|
|
2736
|
-
FocusScope,
|
|
2737
|
-
{
|
|
2738
|
-
asChild: true,
|
|
2739
|
-
loop: true,
|
|
2740
|
-
trapped: trapFocus,
|
|
2741
|
-
onMountAutoFocus: onOpenAutoFocus,
|
|
2742
|
-
onUnmountAutoFocus: onCloseAutoFocus,
|
|
2743
|
-
children: /* @__PURE__ */ jsx(
|
|
2744
|
-
DismissableLayer,
|
|
2745
|
-
{
|
|
2746
|
-
asChild: true,
|
|
2747
|
-
disableOutsidePointerEvents,
|
|
2748
|
-
onInteractOutside,
|
|
2749
|
-
onEscapeKeyDown,
|
|
2750
|
-
onPointerDownOutside,
|
|
2751
|
-
onFocusOutside,
|
|
2752
|
-
onDismiss: () => context.onOpenChange(false),
|
|
2753
|
-
children: /* @__PURE__ */ jsx(
|
|
2754
|
-
Content,
|
|
2755
|
-
{
|
|
2756
|
-
"data-state": getState(context.open),
|
|
2757
|
-
role: "dialog",
|
|
2758
|
-
id: context.contentId,
|
|
2759
|
-
...popperScope,
|
|
2760
|
-
...contentProps,
|
|
2761
|
-
ref: forwardedRef,
|
|
2762
|
-
style: {
|
|
2763
|
-
...contentProps.style,
|
|
2764
|
-
// re-namespace exposed content custom properties
|
|
2765
|
-
...{
|
|
2766
|
-
"--radix-popover-content-transform-origin": "var(--radix-popper-transform-origin)",
|
|
2767
|
-
"--radix-popover-content-available-width": "var(--radix-popper-available-width)",
|
|
2768
|
-
"--radix-popover-content-available-height": "var(--radix-popper-available-height)",
|
|
2769
|
-
"--radix-popover-trigger-width": "var(--radix-popper-anchor-width)",
|
|
2770
|
-
"--radix-popover-trigger-height": "var(--radix-popper-anchor-height)"
|
|
2771
|
-
}
|
|
2772
|
-
}
|
|
2773
|
-
}
|
|
2774
|
-
)
|
|
2775
|
-
}
|
|
2776
|
-
)
|
|
2777
|
-
}
|
|
2778
|
-
);
|
|
2779
|
-
}
|
|
2780
|
-
);
|
|
2781
|
-
var CLOSE_NAME = "PopoverClose";
|
|
2782
|
-
var PopoverClose = React.forwardRef(
|
|
2783
|
-
(props, forwardedRef) => {
|
|
2784
|
-
const { __scopePopover, ...closeProps } = props;
|
|
2785
|
-
const context = usePopoverContext(CLOSE_NAME, __scopePopover);
|
|
2786
|
-
return /* @__PURE__ */ jsx(
|
|
2787
|
-
Primitive.button,
|
|
2788
|
-
{
|
|
2789
|
-
type: "button",
|
|
2790
|
-
...closeProps,
|
|
2791
|
-
ref: forwardedRef,
|
|
2792
|
-
onClick: composeEventHandlers(props.onClick, () => context.onOpenChange(false))
|
|
2793
|
-
}
|
|
2794
|
-
);
|
|
2795
|
-
}
|
|
2796
|
-
);
|
|
2797
|
-
PopoverClose.displayName = CLOSE_NAME;
|
|
2798
|
-
var ARROW_NAME = "PopoverArrow";
|
|
2799
|
-
var PopoverArrow = React.forwardRef(
|
|
2800
|
-
(props, forwardedRef) => {
|
|
2801
|
-
const { __scopePopover, ...arrowProps } = props;
|
|
2802
|
-
const popperScope = usePopperScope(__scopePopover);
|
|
2803
|
-
return /* @__PURE__ */ jsx(Arrow, { ...popperScope, ...arrowProps, ref: forwardedRef });
|
|
2804
|
-
}
|
|
2805
|
-
);
|
|
2806
|
-
PopoverArrow.displayName = ARROW_NAME;
|
|
2807
|
-
function getState(open) {
|
|
2808
|
-
return open ? "open" : "closed";
|
|
2809
|
-
}
|
|
2810
|
-
var Root2 = Popover;
|
|
2811
|
-
var Trigger = PopoverTrigger;
|
|
2812
|
-
var Portal = PopoverPortal;
|
|
2813
|
-
var Content2 = PopoverContent;
|
|
2814
|
-
var Arrow2 = PopoverArrow;
|
|
2815
|
-
function InfoIcon({
|
|
2816
|
-
size: size2 = 12,
|
|
2817
|
-
color = "currentColor",
|
|
2818
|
-
className
|
|
2819
|
-
}) {
|
|
2820
|
-
return /* @__PURE__ */ jsxs(
|
|
2821
|
-
"svg",
|
|
2822
|
-
{
|
|
2823
|
-
width: size2,
|
|
2824
|
-
height: size2,
|
|
2825
|
-
viewBox: "0 0 12 12",
|
|
2826
|
-
fill: "none",
|
|
2827
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
2828
|
-
className,
|
|
2829
|
-
"aria-hidden": "true",
|
|
2830
|
-
children: [
|
|
2831
|
-
/* @__PURE__ */ jsx(
|
|
2832
|
-
"circle",
|
|
2833
|
-
{
|
|
2834
|
-
cx: "6",
|
|
2835
|
-
cy: "6",
|
|
2836
|
-
r: "5.25",
|
|
2837
|
-
stroke: color,
|
|
2838
|
-
strokeWidth: "1.5",
|
|
2839
|
-
strokeLinecap: "round",
|
|
2840
|
-
strokeLinejoin: "round",
|
|
2841
|
-
fill: "none"
|
|
2842
|
-
}
|
|
2843
|
-
),
|
|
2844
|
-
/* @__PURE__ */ jsx("circle", { cx: "6", cy: "3.5", r: "0.75", fill: color }),
|
|
2845
|
-
/* @__PURE__ */ jsx(
|
|
2846
|
-
"line",
|
|
2847
|
-
{
|
|
2848
|
-
x1: "6",
|
|
2849
|
-
y1: "5.5",
|
|
2850
|
-
x2: "6",
|
|
2851
|
-
y2: "8.5",
|
|
2852
|
-
stroke: color,
|
|
2853
|
-
strokeWidth: "1.5",
|
|
2854
|
-
strokeLinecap: "round"
|
|
2855
|
-
}
|
|
2856
|
-
)
|
|
2857
|
-
]
|
|
2858
|
-
}
|
|
2859
|
-
);
|
|
2860
|
-
}
|
|
2861
|
-
function TipPopover({
|
|
2862
|
-
content,
|
|
2863
|
-
side = "top",
|
|
2864
|
-
iconSize = 14,
|
|
2865
|
-
className,
|
|
2866
|
-
children
|
|
2867
|
-
}) {
|
|
2868
|
-
const [open, setOpen] = useState(false);
|
|
2869
|
-
const timeoutRef = useRef(null);
|
|
2870
|
-
const handleMouseEnter = () => {
|
|
2871
|
-
if (timeoutRef.current) {
|
|
2872
|
-
clearTimeout(timeoutRef.current);
|
|
2873
|
-
}
|
|
2874
|
-
setOpen(true);
|
|
2875
|
-
};
|
|
2876
|
-
const handleMouseLeave = () => {
|
|
2877
|
-
timeoutRef.current = setTimeout(() => {
|
|
2878
|
-
setOpen(false);
|
|
2879
|
-
}, 100);
|
|
2880
|
-
};
|
|
2881
|
-
const triggerClassName = [
|
|
2882
|
-
"taskon-tip-popover-trigger",
|
|
2883
|
-
children ? "taskon-tip-popover-trigger--custom" : "",
|
|
2884
|
-
className || ""
|
|
2885
|
-
].filter(Boolean).join(" ");
|
|
2886
|
-
return /* @__PURE__ */ jsxs(Root2, { open, onOpenChange: setOpen, children: [
|
|
2887
|
-
/* @__PURE__ */ jsx(Trigger, { asChild: true, children: /* @__PURE__ */ jsx(
|
|
2888
|
-
"button",
|
|
2889
|
-
{
|
|
2890
|
-
type: "button",
|
|
2891
|
-
className: triggerClassName,
|
|
2892
|
-
"aria-label": "More information",
|
|
2893
|
-
onMouseEnter: handleMouseEnter,
|
|
2894
|
-
onMouseLeave: handleMouseLeave,
|
|
2895
|
-
children: children || /* @__PURE__ */ jsx(InfoIcon, { size: iconSize })
|
|
2896
|
-
}
|
|
2897
|
-
) }),
|
|
2898
|
-
/* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsxs(
|
|
2899
|
-
Content2,
|
|
2900
|
-
{
|
|
2901
|
-
className: "taskon-tip-popover-content",
|
|
2902
|
-
side,
|
|
2903
|
-
sideOffset: 8,
|
|
2904
|
-
align: "center",
|
|
2905
|
-
onMouseEnter: handleMouseEnter,
|
|
2906
|
-
onMouseLeave: handleMouseLeave,
|
|
2907
|
-
children: [
|
|
2908
|
-
content,
|
|
2909
|
-
/* @__PURE__ */ jsx(Arrow2, { className: "taskon-tip-popover-arrow" })
|
|
2910
|
-
]
|
|
2911
|
-
}
|
|
2912
|
-
) })
|
|
2913
|
-
] });
|
|
2914
|
-
}
|
|
2915
|
-
export {
|
|
2916
|
-
Arrow2 as A,
|
|
2917
|
-
Content2 as C,
|
|
2918
|
-
Input as I,
|
|
2919
|
-
Portal as P,
|
|
2920
|
-
Root2 as R,
|
|
2921
|
-
TipPopover as T,
|
|
2922
|
-
useBindSocialAccount as a,
|
|
2923
|
-
Trigger as b,
|
|
2924
|
-
InfoIcon as c,
|
|
2925
|
-
useChainMap as u
|
|
2926
|
-
};
|