@taskon/widget-react 0.0.1 → 0.0.2
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 +118 -64
- package/dist/CommunityTaskList.css +2694 -2951
- package/dist/EligibilityInfo.css +2221 -1332
- package/dist/LeaderboardWidget.css +403 -198
- package/dist/PageBuilder.css +57 -0
- package/dist/Quest.css +1347 -1477
- package/dist/TaskOnProvider.css +337 -29
- package/dist/ThemeProvider.css +228 -0
- package/dist/UserCenterWidget.css +168 -0
- package/dist/UserCenterWidget2.css +4917 -0
- package/dist/WidgetShell.css +417 -130
- package/dist/chunks/{CommunityTaskList-CrH6r4Av.js → CommunityTaskList-2nFy6l6m.js} +2612 -2074
- package/dist/chunks/{EligibilityInfo-DesW9-k9.js → EligibilityInfo-CKTl_cdU.js} +2714 -4077
- package/dist/chunks/{LeaderboardWidget-BSGpHKTk.js → LeaderboardWidget-DyoiiNS6.js} +288 -349
- package/dist/chunks/PageBuilder-DHM3Il6f.js +150 -0
- package/dist/chunks/{Quest-uSIVq78I.js → Quest-Dqx4OCat.js} +1380 -726
- package/dist/chunks/TaskOnProvider-CxtFIs3n.js +2072 -0
- package/dist/chunks/{WidgetShell-NlOgn1x5.js → ThemeProvider-CulHkqqY.js} +1397 -103
- package/dist/chunks/UserCenterWidget-SE5hqpnZ.js +8335 -0
- package/dist/chunks/UserCenterWidget-XL6LZRZM.js +3259 -0
- package/dist/chunks/{Table-CWGf2FKV.js → WidgetShell-8xn-Jivw.js} +237 -27
- package/dist/chunks/communitytask-es-CBNnS4o2.js +521 -0
- package/dist/chunks/communitytask-ja-GRf9cbdx.js +521 -0
- package/dist/chunks/communitytask-ko-Bf24PQKI.js +521 -0
- package/dist/chunks/communitytask-ru-CZm2CPoV.js +521 -0
- package/dist/chunks/leaderboardwidget-es-vKjrjQaz.js +146 -0
- package/dist/chunks/leaderboardwidget-ja-Q6u0HxKG.js +146 -0
- package/dist/chunks/leaderboardwidget-ko-CG6SWgxf.js +146 -0
- package/dist/chunks/leaderboardwidget-ru-DCcHcJGz.js +146 -0
- package/dist/chunks/quest-es-Dyyy0zaw.js +863 -0
- package/dist/chunks/quest-ja-Depog33y.js +863 -0
- package/dist/chunks/quest-ko-BMu3uRQJ.js +863 -0
- package/dist/chunks/quest-ru-xne814Rw.js +863 -0
- package/dist/chunks/taskwidget-es-Do9b3Mqw.js +245 -0
- package/dist/chunks/taskwidget-ja-CqSu-yWA.js +245 -0
- package/dist/chunks/taskwidget-ko-EHgXFV4B.js +245 -0
- package/dist/chunks/taskwidget-ru-CMbLQDK4.js +245 -0
- package/dist/chunks/useIsMobile-D6Ybur-6.js +30 -0
- package/dist/chunks/usercenter-es-Dz3Wp2vV.js +512 -0
- package/dist/chunks/usercenter-ja-CKE4DJC6.js +512 -0
- package/dist/chunks/usercenter-ko-Dtpkn2qb.js +512 -0
- package/dist/chunks/usercenter-ru-DnBGee45.js +512 -0
- package/dist/community-task.d.ts +29 -388
- package/dist/community-task.js +2 -7
- package/dist/core.d.ts +95 -28
- package/dist/core.js +11 -12
- package/dist/index.d.ts +260 -602
- package/dist/index.js +28 -7361
- package/dist/leaderboard.d.ts +5 -496
- package/dist/leaderboard.js +2 -15
- package/dist/page-builder.d.ts +20 -0
- package/dist/page-builder.js +4 -0
- package/dist/quest.d.ts +20 -292
- package/dist/quest.js +2 -5
- package/dist/user-center.d.ts +56 -0
- package/dist/user-center.js +4 -0
- package/package.json +22 -3
- package/dist/Table.css +0 -389
- package/dist/chunks/TaskOnProvider-QMwxGL44.js +0 -1435
- package/dist/chunks/ThemeProvider-Cs8IUVQj.js +0 -1118
- package/dist/chunks/leaderboardwidget-ja-Bj6gz6y1.js +0 -119
- package/dist/chunks/leaderboardwidget-ko-f1cLO9ic.js +0 -119
- package/dist/chunks/useWidgetLocale-BVcopbZS.js +0 -74
- package/dist/chunks/usercenter-ja-DBj_dtuz.js +0 -329
- package/dist/chunks/usercenter-ko-DYTkHAld.js +0 -329
- package/dist/index.css +0 -3662
|
@@ -1,1435 +0,0 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
import React__default, { useState, useRef, useEffect, useMemo, useCallback } from "react";
|
|
3
|
-
import { u as useWidgetLocale } from "./useWidgetLocale-BVcopbZS.js";
|
|
4
|
-
import { jsx, jsxs, Fragment } from "react/jsx-runtime";
|
|
5
|
-
import { createTaskOnClient, createUserApi, createChainApi, createCommunityTaskApi } from "@taskon/core";
|
|
6
|
-
import { d as createContextScope, e as useComposedRefs, f as createSlot, P as Primitive, B as Branch, g as useControllableState, h as Presence, i as composeEventHandlers, j as useCallbackRef, R as Root, k as Portal, l as dispatchDiscreteCustomEvent, m as useLayoutEffect2, n as TaskOnContext } from "./ThemeProvider-Cs8IUVQj.js";
|
|
7
|
-
import { W as WalletContext, b as useToastState, T as ToastContext } from "./useToast-BGJhd3BX.js";
|
|
8
|
-
import * as ReactDOM from "react-dom";
|
|
9
|
-
import '../TaskOnProvider.css';const TOKEN_STORAGE_KEY = "taskon_user_token";
|
|
10
|
-
function isBrowser() {
|
|
11
|
-
return typeof window !== "undefined";
|
|
12
|
-
}
|
|
13
|
-
function getStoredToken() {
|
|
14
|
-
if (!isBrowser()) {
|
|
15
|
-
return null;
|
|
16
|
-
}
|
|
17
|
-
try {
|
|
18
|
-
return localStorage.getItem(TOKEN_STORAGE_KEY);
|
|
19
|
-
} catch {
|
|
20
|
-
return null;
|
|
21
|
-
}
|
|
22
|
-
}
|
|
23
|
-
function setStoredToken(token) {
|
|
24
|
-
if (!isBrowser()) {
|
|
25
|
-
return;
|
|
26
|
-
}
|
|
27
|
-
try {
|
|
28
|
-
localStorage.setItem(TOKEN_STORAGE_KEY, token);
|
|
29
|
-
} catch {
|
|
30
|
-
}
|
|
31
|
-
}
|
|
32
|
-
function removeStoredToken() {
|
|
33
|
-
if (!isBrowser()) {
|
|
34
|
-
return;
|
|
35
|
-
}
|
|
36
|
-
try {
|
|
37
|
-
localStorage.removeItem(TOKEN_STORAGE_KEY);
|
|
38
|
-
} catch {
|
|
39
|
-
}
|
|
40
|
-
}
|
|
41
|
-
function useClientInit({
|
|
42
|
-
apiKey,
|
|
43
|
-
baseURL,
|
|
44
|
-
setUserInfo,
|
|
45
|
-
setUserToken
|
|
46
|
-
}) {
|
|
47
|
-
const [client, setClient] = useState(null);
|
|
48
|
-
const userApiRef = useRef(null);
|
|
49
|
-
const [isInitializing, setIsInitializing] = useState(true);
|
|
50
|
-
const isInitializedRef = useRef(false);
|
|
51
|
-
const configRef = useRef({ apiKey, baseURL });
|
|
52
|
-
configRef.current = { apiKey, baseURL };
|
|
53
|
-
const settersRef = useRef({ setUserInfo, setUserToken });
|
|
54
|
-
settersRef.current = { setUserInfo, setUserToken };
|
|
55
|
-
useEffect(() => {
|
|
56
|
-
if (isInitializedRef.current) {
|
|
57
|
-
return;
|
|
58
|
-
}
|
|
59
|
-
isInitializedRef.current = true;
|
|
60
|
-
const init = async () => {
|
|
61
|
-
try {
|
|
62
|
-
const { apiKey: apiKey2, baseURL: baseURL2 } = configRef.current;
|
|
63
|
-
const { setUserInfo: setUserInfo2, setUserToken: setUserToken2 } = settersRef.current;
|
|
64
|
-
const taskOnClient = createTaskOnClient({
|
|
65
|
-
apiKey: apiKey2,
|
|
66
|
-
baseURL: baseURL2,
|
|
67
|
-
// Unified auth error handler - called when any API returns auth error
|
|
68
|
-
onAuthError: () => {
|
|
69
|
-
taskOnClient.setUserToken(null);
|
|
70
|
-
settersRef.current.setUserInfo(null);
|
|
71
|
-
settersRef.current.setUserToken(null);
|
|
72
|
-
removeStoredToken();
|
|
73
|
-
}
|
|
74
|
-
});
|
|
75
|
-
const userApi = createUserApi(taskOnClient);
|
|
76
|
-
setClient(taskOnClient);
|
|
77
|
-
userApiRef.current = userApi;
|
|
78
|
-
const storedToken = getStoredToken();
|
|
79
|
-
if (storedToken) {
|
|
80
|
-
try {
|
|
81
|
-
taskOnClient.setUserToken(storedToken);
|
|
82
|
-
const info = await userApi.getInfo();
|
|
83
|
-
setUserInfo2(info);
|
|
84
|
-
setUserToken2(storedToken);
|
|
85
|
-
} catch {
|
|
86
|
-
taskOnClient.setUserToken(null);
|
|
87
|
-
}
|
|
88
|
-
}
|
|
89
|
-
} finally {
|
|
90
|
-
setIsInitializing(false);
|
|
91
|
-
}
|
|
92
|
-
};
|
|
93
|
-
init();
|
|
94
|
-
}, []);
|
|
95
|
-
return {
|
|
96
|
-
client,
|
|
97
|
-
userApiRef,
|
|
98
|
-
isInitializing
|
|
99
|
-
};
|
|
100
|
-
}
|
|
101
|
-
function interpolate(template, params) {
|
|
102
|
-
if (!params) {
|
|
103
|
-
return template;
|
|
104
|
-
}
|
|
105
|
-
return template.replace(/\{(\w+)\}/g, (match, key) => {
|
|
106
|
-
const value = params[key];
|
|
107
|
-
if (value === void 0) {
|
|
108
|
-
return match;
|
|
109
|
-
}
|
|
110
|
-
return String(value);
|
|
111
|
-
});
|
|
112
|
-
}
|
|
113
|
-
function createT(messages) {
|
|
114
|
-
return (key, params) => {
|
|
115
|
-
const template = messages[key];
|
|
116
|
-
if (typeof template !== "string") {
|
|
117
|
-
if (process.env.NODE_ENV !== "production") {
|
|
118
|
-
console.warn(`[widget-react] Missing translation key: ${String(key)}`);
|
|
119
|
-
}
|
|
120
|
-
return String(key);
|
|
121
|
-
}
|
|
122
|
-
return interpolate(template, params);
|
|
123
|
-
};
|
|
124
|
-
}
|
|
125
|
-
function createTFunction(messages) {
|
|
126
|
-
return (key, params) => {
|
|
127
|
-
const template = messages[key];
|
|
128
|
-
if (typeof template !== "string") {
|
|
129
|
-
if (process.env.NODE_ENV !== "production") {
|
|
130
|
-
console.warn(`[widget-react] Missing translation key: ${String(key)}`);
|
|
131
|
-
}
|
|
132
|
-
return String(key);
|
|
133
|
-
}
|
|
134
|
-
return interpolate(template, params);
|
|
135
|
-
};
|
|
136
|
-
}
|
|
137
|
-
function useTranslation(options) {
|
|
138
|
-
const { messages, isLoading } = useWidgetLocale(options);
|
|
139
|
-
const t = useMemo(() => createTFunction(messages), [messages]);
|
|
140
|
-
return {
|
|
141
|
-
t,
|
|
142
|
-
messages,
|
|
143
|
-
isLoading
|
|
144
|
-
};
|
|
145
|
-
}
|
|
146
|
-
function createLocaleLoader(defaultMessages, imports) {
|
|
147
|
-
return (locale) => {
|
|
148
|
-
if (locale === "en") {
|
|
149
|
-
return Promise.resolve({ default: defaultMessages });
|
|
150
|
-
}
|
|
151
|
-
const importFn = imports[locale];
|
|
152
|
-
if (importFn) {
|
|
153
|
-
return importFn();
|
|
154
|
-
}
|
|
155
|
-
return Promise.resolve({ default: defaultMessages });
|
|
156
|
-
};
|
|
157
|
-
}
|
|
158
|
-
const registry = /* @__PURE__ */ new Map();
|
|
159
|
-
async function preloadWidgets(widgets, locale) {
|
|
160
|
-
const preloadPromises = widgets.map((name) => {
|
|
161
|
-
const preloadFn = registry.get(name);
|
|
162
|
-
if (!preloadFn) {
|
|
163
|
-
if (process.env.NODE_ENV !== "production") {
|
|
164
|
-
console.warn(
|
|
165
|
-
`[widget-react] Widget "${name}" not found in registry. Make sure to import the widget before using preloadWidgets.`
|
|
166
|
-
);
|
|
167
|
-
}
|
|
168
|
-
return null;
|
|
169
|
-
}
|
|
170
|
-
return preloadFn(locale);
|
|
171
|
-
}).filter(Boolean);
|
|
172
|
-
await Promise.all(preloadPromises);
|
|
173
|
-
}
|
|
174
|
-
const loading = "Loading...";
|
|
175
|
-
const error = "Something went wrong";
|
|
176
|
-
const retry = "Retry";
|
|
177
|
-
const success = "Success";
|
|
178
|
-
const cancel = "Cancel";
|
|
179
|
-
const confirm = "Confirm";
|
|
180
|
-
const enMessages = {
|
|
181
|
-
loading,
|
|
182
|
-
error,
|
|
183
|
-
retry,
|
|
184
|
-
success,
|
|
185
|
-
cancel,
|
|
186
|
-
confirm
|
|
187
|
-
};
|
|
188
|
-
const loadMessages = createLocaleLoader(enMessages, {
|
|
189
|
-
ko: () => import("./common-ko-80ezXsMG.js").then((m) => ({ default: m.default })),
|
|
190
|
-
ja: () => import("./common-ja-DWhTaFHb.js").then((m) => ({ default: m.default }))
|
|
191
|
-
});
|
|
192
|
-
function useCommonLocale() {
|
|
193
|
-
return useWidgetLocale({
|
|
194
|
-
widgetId: "Common",
|
|
195
|
-
defaultMessages: enMessages,
|
|
196
|
-
loadMessages
|
|
197
|
-
});
|
|
198
|
-
}
|
|
199
|
-
const SUPPORTED_LOCALES = ["en", "ko", "ja", "ru", "es"];
|
|
200
|
-
const DEFAULT_LOCALE = "en";
|
|
201
|
-
function detectLocale() {
|
|
202
|
-
if (typeof window === "undefined") {
|
|
203
|
-
return DEFAULT_LOCALE;
|
|
204
|
-
}
|
|
205
|
-
const browserLang = navigator.language.split("-")[0];
|
|
206
|
-
if (SUPPORTED_LOCALES.includes(browserLang)) {
|
|
207
|
-
return browserLang;
|
|
208
|
-
}
|
|
209
|
-
return DEFAULT_LOCALE;
|
|
210
|
-
}
|
|
211
|
-
function useLocaleManager({
|
|
212
|
-
configLocale,
|
|
213
|
-
preloadLocales
|
|
214
|
-
}) {
|
|
215
|
-
const [isPreloading, setIsPreloading] = useState(
|
|
216
|
-
() => preloadLocales !== void 0 && preloadLocales.length > 0
|
|
217
|
-
);
|
|
218
|
-
const preloadLocalesRef = useRef(preloadLocales);
|
|
219
|
-
preloadLocalesRef.current = preloadLocales;
|
|
220
|
-
const locale = useMemo(() => {
|
|
221
|
-
return configLocale ?? detectLocale();
|
|
222
|
-
}, [configLocale]);
|
|
223
|
-
useEffect(() => {
|
|
224
|
-
const widgets = preloadLocalesRef.current;
|
|
225
|
-
if (!widgets || widgets.length === 0) {
|
|
226
|
-
setIsPreloading(false);
|
|
227
|
-
return;
|
|
228
|
-
}
|
|
229
|
-
if (locale === "en") {
|
|
230
|
-
setIsPreloading(false);
|
|
231
|
-
return;
|
|
232
|
-
}
|
|
233
|
-
let isMounted = true;
|
|
234
|
-
preloadWidgets(widgets, locale).finally(() => {
|
|
235
|
-
if (isMounted) {
|
|
236
|
-
setIsPreloading(false);
|
|
237
|
-
}
|
|
238
|
-
});
|
|
239
|
-
return () => {
|
|
240
|
-
isMounted = false;
|
|
241
|
-
};
|
|
242
|
-
}, [locale]);
|
|
243
|
-
return {
|
|
244
|
-
locale,
|
|
245
|
-
isPreloading
|
|
246
|
-
};
|
|
247
|
-
}
|
|
248
|
-
const LOGIN_METHOD_MAP = {
|
|
249
|
-
evm_wallet: {
|
|
250
|
-
apiMethod: "loginWithEvm",
|
|
251
|
-
buildParams: (value, sign, timestamp) => ({ address: value, sign, timestamp })
|
|
252
|
-
},
|
|
253
|
-
email: {
|
|
254
|
-
apiMethod: "loginWithEmail",
|
|
255
|
-
buildParams: (value, sign, timestamp) => ({ email: value, sign, timestamp })
|
|
256
|
-
},
|
|
257
|
-
discord: {
|
|
258
|
-
apiMethod: "loginWithSns",
|
|
259
|
-
buildParams: (value, sign, timestamp) => ({ type: "Discord", token: value, sign, timestamp })
|
|
260
|
-
},
|
|
261
|
-
twitter: {
|
|
262
|
-
apiMethod: "loginWithSns",
|
|
263
|
-
buildParams: (value, sign, timestamp) => ({ type: "Twitter", token: value, sign, timestamp })
|
|
264
|
-
},
|
|
265
|
-
telegram: {
|
|
266
|
-
apiMethod: "loginWithSns",
|
|
267
|
-
buildParams: (value, sign, timestamp) => ({ type: "Telegram", token: value, sign, timestamp })
|
|
268
|
-
}
|
|
269
|
-
};
|
|
270
|
-
function useAuth({
|
|
271
|
-
client,
|
|
272
|
-
userApiRef,
|
|
273
|
-
setUserInfo,
|
|
274
|
-
setUserToken
|
|
275
|
-
}) {
|
|
276
|
-
const setToken = useCallback(
|
|
277
|
-
(token) => {
|
|
278
|
-
if (!client) {
|
|
279
|
-
throw new Error("TaskOn client not initialized");
|
|
280
|
-
}
|
|
281
|
-
client.setUserToken(token);
|
|
282
|
-
setUserToken(token);
|
|
283
|
-
setStoredToken(token);
|
|
284
|
-
},
|
|
285
|
-
[client, setUserToken]
|
|
286
|
-
);
|
|
287
|
-
const login = useCallback(
|
|
288
|
-
async (params) => {
|
|
289
|
-
const userApi = userApiRef.current;
|
|
290
|
-
if (!userApi) {
|
|
291
|
-
throw new Error("TaskOn client not initialized");
|
|
292
|
-
}
|
|
293
|
-
const { method, value, sign, timestamp } = params;
|
|
294
|
-
const methodConfig = LOGIN_METHOD_MAP[method];
|
|
295
|
-
if (!methodConfig) {
|
|
296
|
-
throw new Error(`Unsupported login method: ${method}`);
|
|
297
|
-
}
|
|
298
|
-
const apiParams = methodConfig.buildParams(value, sign, timestamp);
|
|
299
|
-
const result = await userApi[methodConfig.apiMethod](apiParams);
|
|
300
|
-
setToken(result.token);
|
|
301
|
-
try {
|
|
302
|
-
const info = await userApi.getInfo();
|
|
303
|
-
setUserInfo(info);
|
|
304
|
-
} catch {
|
|
305
|
-
}
|
|
306
|
-
},
|
|
307
|
-
[userApiRef, setToken, setUserInfo]
|
|
308
|
-
);
|
|
309
|
-
const logout = useCallback(() => {
|
|
310
|
-
if (client) {
|
|
311
|
-
client.setUserToken(null);
|
|
312
|
-
}
|
|
313
|
-
setUserInfo(null);
|
|
314
|
-
setUserToken(null);
|
|
315
|
-
removeStoredToken();
|
|
316
|
-
}, [client, setUserInfo, setUserToken]);
|
|
317
|
-
return { login, logout };
|
|
318
|
-
}
|
|
319
|
-
let ethersModule = null;
|
|
320
|
-
const interfaceCache = /* @__PURE__ */ new Map();
|
|
321
|
-
async function loadEthers() {
|
|
322
|
-
if (ethersModule) {
|
|
323
|
-
return ethersModule;
|
|
324
|
-
}
|
|
325
|
-
try {
|
|
326
|
-
ethersModule = await import("ethers");
|
|
327
|
-
return ethersModule;
|
|
328
|
-
} catch {
|
|
329
|
-
throw new Error(
|
|
330
|
-
"ethers.js is required for contract invocation. Please install ethers@^6.0.0"
|
|
331
|
-
);
|
|
332
|
-
}
|
|
333
|
-
}
|
|
334
|
-
async function getInterface(abi) {
|
|
335
|
-
const { ethers } = await loadEthers();
|
|
336
|
-
const cacheKey = JSON.stringify(abi);
|
|
337
|
-
let iface = interfaceCache.get(cacheKey);
|
|
338
|
-
if (!iface) {
|
|
339
|
-
iface = new ethers.Interface(abi);
|
|
340
|
-
interfaceCache.set(cacheKey, iface);
|
|
341
|
-
}
|
|
342
|
-
return iface;
|
|
343
|
-
}
|
|
344
|
-
function getEthereumProvider() {
|
|
345
|
-
if (typeof window === "undefined") return null;
|
|
346
|
-
return window.ethereum ?? null;
|
|
347
|
-
}
|
|
348
|
-
function createEthereumAdapter() {
|
|
349
|
-
const provider = getEthereumProvider();
|
|
350
|
-
if (!provider) return null;
|
|
351
|
-
let currentAddress = null;
|
|
352
|
-
let currentChainId = null;
|
|
353
|
-
const adapter = {
|
|
354
|
-
/**
|
|
355
|
-
* Connect wallet
|
|
356
|
-
*
|
|
357
|
-
* TODO: Current implementation directly calls window.ethereum, cannot show wallet selection modal
|
|
358
|
-
* Future improvements needed to integrate Web3Modal or similar solutions to support:
|
|
359
|
-
* 1. Multi-wallet selection (MetaMask, Coinbase, WalletConnect, etc.)
|
|
360
|
-
* 2. Unified connection modal UI
|
|
361
|
-
*/
|
|
362
|
-
connect: async () => {
|
|
363
|
-
const accounts = await provider.request({
|
|
364
|
-
method: "eth_requestAccounts"
|
|
365
|
-
});
|
|
366
|
-
if (!accounts || accounts.length === 0) {
|
|
367
|
-
throw new Error("No accounts found");
|
|
368
|
-
}
|
|
369
|
-
const address = accounts[0];
|
|
370
|
-
if (!address) {
|
|
371
|
-
throw new Error("No accounts found");
|
|
372
|
-
}
|
|
373
|
-
currentAddress = address;
|
|
374
|
-
const chainIdHex = await provider.request({
|
|
375
|
-
method: "eth_chainId"
|
|
376
|
-
});
|
|
377
|
-
currentChainId = parseInt(chainIdHex, 16);
|
|
378
|
-
return address;
|
|
379
|
-
},
|
|
380
|
-
/**
|
|
381
|
-
* Disconnect from wallet
|
|
382
|
-
* Note: Most wallets don't support programmatic disconnect, can only clear local state
|
|
383
|
-
*/
|
|
384
|
-
disconnect: async () => {
|
|
385
|
-
currentAddress = null;
|
|
386
|
-
currentChainId = null;
|
|
387
|
-
},
|
|
388
|
-
/**
|
|
389
|
-
* Sign message (personal_sign)
|
|
390
|
-
*/
|
|
391
|
-
signMessage: async (message) => {
|
|
392
|
-
if (!currentAddress) {
|
|
393
|
-
throw new Error("Wallet not connected");
|
|
394
|
-
}
|
|
395
|
-
const signature = await provider.request({
|
|
396
|
-
method: "personal_sign",
|
|
397
|
-
params: [message, currentAddress]
|
|
398
|
-
});
|
|
399
|
-
return signature;
|
|
400
|
-
},
|
|
401
|
-
/**
|
|
402
|
-
* Get current address
|
|
403
|
-
*/
|
|
404
|
-
getAddress: () => currentAddress,
|
|
405
|
-
/**
|
|
406
|
-
* Get current chain ID
|
|
407
|
-
*/
|
|
408
|
-
getChainId: () => currentChainId,
|
|
409
|
-
/**
|
|
410
|
-
* Switch network
|
|
411
|
-
*/
|
|
412
|
-
switchNetwork: async (chainId) => {
|
|
413
|
-
const chainIdHex = `0x${chainId.toString(16)}`;
|
|
414
|
-
try {
|
|
415
|
-
await provider.request({
|
|
416
|
-
method: "wallet_switchEthereumChain",
|
|
417
|
-
params: [{ chainId: chainIdHex }]
|
|
418
|
-
});
|
|
419
|
-
currentChainId = chainId;
|
|
420
|
-
} catch (error2) {
|
|
421
|
-
const err = error2;
|
|
422
|
-
if (err.code === 4902) {
|
|
423
|
-
throw new Error("Chain not found in wallet. Please add the network manually.");
|
|
424
|
-
}
|
|
425
|
-
throw error2;
|
|
426
|
-
}
|
|
427
|
-
},
|
|
428
|
-
/**
|
|
429
|
-
* Get wallet's native token balance (for gas estimation)
|
|
430
|
-
* @returns Balance in ETH (string, formatted)
|
|
431
|
-
*/
|
|
432
|
-
getBalance: async () => {
|
|
433
|
-
if (!currentAddress) {
|
|
434
|
-
throw new Error("Wallet not connected");
|
|
435
|
-
}
|
|
436
|
-
const balanceHex = await provider.request({
|
|
437
|
-
method: "eth_getBalance",
|
|
438
|
-
params: [currentAddress, "latest"]
|
|
439
|
-
});
|
|
440
|
-
const balanceWei = BigInt(balanceHex);
|
|
441
|
-
const balanceEth = Number(balanceWei) / 1e18;
|
|
442
|
-
return balanceEth.toString();
|
|
443
|
-
},
|
|
444
|
-
/**
|
|
445
|
-
* Invoke a smart contract method
|
|
446
|
-
*
|
|
447
|
-
* 使用 ethers.js 编码合约调用,支持缓存优化:
|
|
448
|
-
* - ethers 模块只加载一次
|
|
449
|
-
* - 相同 ABI 的 Interface 实例会被缓存复用
|
|
450
|
-
*
|
|
451
|
-
* @param params - Contract invocation parameters
|
|
452
|
-
* @returns Transaction hash
|
|
453
|
-
*/
|
|
454
|
-
invokeContract: async (params) => {
|
|
455
|
-
var _a;
|
|
456
|
-
if (!currentAddress) {
|
|
457
|
-
throw new Error("Wallet not connected");
|
|
458
|
-
}
|
|
459
|
-
const { contract, abi, method, params: methodParams, chainId, value } = params;
|
|
460
|
-
if (chainId && currentChainId !== chainId) {
|
|
461
|
-
await ((_a = adapter.switchNetwork) == null ? void 0 : _a.call(adapter, chainId));
|
|
462
|
-
}
|
|
463
|
-
let encodedData;
|
|
464
|
-
try {
|
|
465
|
-
const iface = await getInterface(abi);
|
|
466
|
-
encodedData = iface.encodeFunctionData(method, methodParams);
|
|
467
|
-
} catch (error2) {
|
|
468
|
-
if (error2 instanceof Error && error2.message.includes("ethers.js is required")) {
|
|
469
|
-
throw error2;
|
|
470
|
-
}
|
|
471
|
-
throw new Error(
|
|
472
|
-
`Failed to encode contract call "${method}": ${error2 instanceof Error ? error2.message : String(error2)}`
|
|
473
|
-
);
|
|
474
|
-
}
|
|
475
|
-
const txParams = {
|
|
476
|
-
from: currentAddress,
|
|
477
|
-
to: contract,
|
|
478
|
-
data: encodedData
|
|
479
|
-
};
|
|
480
|
-
if (value) {
|
|
481
|
-
txParams.value = `0x${BigInt(value).toString(16)}`;
|
|
482
|
-
}
|
|
483
|
-
const txHash = await provider.request({
|
|
484
|
-
method: "eth_sendTransaction",
|
|
485
|
-
params: [txParams]
|
|
486
|
-
});
|
|
487
|
-
return txHash;
|
|
488
|
-
},
|
|
489
|
-
/**
|
|
490
|
-
* Listen to account changes
|
|
491
|
-
*/
|
|
492
|
-
onAccountChange: (callback) => {
|
|
493
|
-
var _a;
|
|
494
|
-
const handler = (accounts) => {
|
|
495
|
-
const accountList = accounts;
|
|
496
|
-
currentAddress = accountList[0] ?? null;
|
|
497
|
-
callback(currentAddress);
|
|
498
|
-
};
|
|
499
|
-
(_a = provider.on) == null ? void 0 : _a.call(provider, "accountsChanged", handler);
|
|
500
|
-
return () => {
|
|
501
|
-
var _a2;
|
|
502
|
-
return (_a2 = provider.removeListener) == null ? void 0 : _a2.call(provider, "accountsChanged", handler);
|
|
503
|
-
};
|
|
504
|
-
},
|
|
505
|
-
/**
|
|
506
|
-
* Listen to chain changes
|
|
507
|
-
*/
|
|
508
|
-
onChainChange: (callback) => {
|
|
509
|
-
var _a;
|
|
510
|
-
const handler = (chainIdHex) => {
|
|
511
|
-
currentChainId = parseInt(chainIdHex, 16);
|
|
512
|
-
callback(currentChainId);
|
|
513
|
-
};
|
|
514
|
-
(_a = provider.on) == null ? void 0 : _a.call(provider, "chainChanged", handler);
|
|
515
|
-
return () => {
|
|
516
|
-
var _a2;
|
|
517
|
-
return (_a2 = provider.removeListener) == null ? void 0 : _a2.call(provider, "chainChanged", handler);
|
|
518
|
-
};
|
|
519
|
-
}
|
|
520
|
-
};
|
|
521
|
-
return adapter;
|
|
522
|
-
}
|
|
523
|
-
function WalletProvider({
|
|
524
|
-
children,
|
|
525
|
-
config
|
|
526
|
-
}) {
|
|
527
|
-
const [state, setState] = useState({
|
|
528
|
-
adapter: (config == null ? void 0 : config.evmAdapter) ?? null,
|
|
529
|
-
address: null,
|
|
530
|
-
chainId: null
|
|
531
|
-
});
|
|
532
|
-
useEffect(() => {
|
|
533
|
-
if ((config == null ? void 0 : config.evmAdapter) || (config == null ? void 0 : config.disableAutoDetect)) return;
|
|
534
|
-
const ethereumAdapter = createEthereumAdapter();
|
|
535
|
-
if (ethereumAdapter) {
|
|
536
|
-
setState((prev) => ({
|
|
537
|
-
...prev,
|
|
538
|
-
adapter: ethereumAdapter
|
|
539
|
-
}));
|
|
540
|
-
}
|
|
541
|
-
}, [config == null ? void 0 : config.evmAdapter, config == null ? void 0 : config.disableAutoDetect]);
|
|
542
|
-
const contextValue = useMemo(
|
|
543
|
-
() => ({
|
|
544
|
-
evmAdapter: state.adapter,
|
|
545
|
-
evmAddress: state.address,
|
|
546
|
-
evmChainId: state.chainId,
|
|
547
|
-
isEvmConnected: state.address !== null,
|
|
548
|
-
isDetecting: false,
|
|
549
|
-
// Actions - delegate to adapter
|
|
550
|
-
connectEvm: async () => {
|
|
551
|
-
if (!state.adapter) return null;
|
|
552
|
-
try {
|
|
553
|
-
const address = await state.adapter.connect();
|
|
554
|
-
setState((prev) => {
|
|
555
|
-
var _a, _b;
|
|
556
|
-
return {
|
|
557
|
-
...prev,
|
|
558
|
-
address,
|
|
559
|
-
chainId: ((_b = (_a = state.adapter) == null ? void 0 : _a.getChainId) == null ? void 0 : _b.call(_a)) ?? null
|
|
560
|
-
};
|
|
561
|
-
});
|
|
562
|
-
return address;
|
|
563
|
-
} catch {
|
|
564
|
-
return null;
|
|
565
|
-
}
|
|
566
|
-
},
|
|
567
|
-
disconnectEvm: async () => {
|
|
568
|
-
var _a;
|
|
569
|
-
await ((_a = state.adapter) == null ? void 0 : _a.disconnect());
|
|
570
|
-
setState((prev) => ({
|
|
571
|
-
...prev,
|
|
572
|
-
address: null
|
|
573
|
-
}));
|
|
574
|
-
},
|
|
575
|
-
signEvmMessage: async (message) => {
|
|
576
|
-
if (!state.adapter) return null;
|
|
577
|
-
try {
|
|
578
|
-
return await state.adapter.signMessage(message);
|
|
579
|
-
} catch {
|
|
580
|
-
return null;
|
|
581
|
-
}
|
|
582
|
-
}
|
|
583
|
-
}),
|
|
584
|
-
[state]
|
|
585
|
-
);
|
|
586
|
-
return /* @__PURE__ */ jsx(WalletContext.Provider, { value: contextValue, children });
|
|
587
|
-
}
|
|
588
|
-
function createCollection(name) {
|
|
589
|
-
const PROVIDER_NAME2 = name + "CollectionProvider";
|
|
590
|
-
const [createCollectionContext, createCollectionScope2] = createContextScope(PROVIDER_NAME2);
|
|
591
|
-
const [CollectionProviderImpl, useCollectionContext] = createCollectionContext(
|
|
592
|
-
PROVIDER_NAME2,
|
|
593
|
-
{ collectionRef: { current: null }, itemMap: /* @__PURE__ */ new Map() }
|
|
594
|
-
);
|
|
595
|
-
const CollectionProvider = (props) => {
|
|
596
|
-
const { scope, children } = props;
|
|
597
|
-
const ref = React__default.useRef(null);
|
|
598
|
-
const itemMap = React__default.useRef(/* @__PURE__ */ new Map()).current;
|
|
599
|
-
return /* @__PURE__ */ jsx(CollectionProviderImpl, { scope, itemMap, collectionRef: ref, children });
|
|
600
|
-
};
|
|
601
|
-
CollectionProvider.displayName = PROVIDER_NAME2;
|
|
602
|
-
const COLLECTION_SLOT_NAME = name + "CollectionSlot";
|
|
603
|
-
const CollectionSlotImpl = createSlot(COLLECTION_SLOT_NAME);
|
|
604
|
-
const CollectionSlot = React__default.forwardRef(
|
|
605
|
-
(props, forwardedRef) => {
|
|
606
|
-
const { scope, children } = props;
|
|
607
|
-
const context = useCollectionContext(COLLECTION_SLOT_NAME, scope);
|
|
608
|
-
const composedRefs = useComposedRefs(forwardedRef, context.collectionRef);
|
|
609
|
-
return /* @__PURE__ */ jsx(CollectionSlotImpl, { ref: composedRefs, children });
|
|
610
|
-
}
|
|
611
|
-
);
|
|
612
|
-
CollectionSlot.displayName = COLLECTION_SLOT_NAME;
|
|
613
|
-
const ITEM_SLOT_NAME = name + "CollectionItemSlot";
|
|
614
|
-
const ITEM_DATA_ATTR = "data-radix-collection-item";
|
|
615
|
-
const CollectionItemSlotImpl = createSlot(ITEM_SLOT_NAME);
|
|
616
|
-
const CollectionItemSlot = React__default.forwardRef(
|
|
617
|
-
(props, forwardedRef) => {
|
|
618
|
-
const { scope, children, ...itemData } = props;
|
|
619
|
-
const ref = React__default.useRef(null);
|
|
620
|
-
const composedRefs = useComposedRefs(forwardedRef, ref);
|
|
621
|
-
const context = useCollectionContext(ITEM_SLOT_NAME, scope);
|
|
622
|
-
React__default.useEffect(() => {
|
|
623
|
-
context.itemMap.set(ref, { ref, ...itemData });
|
|
624
|
-
return () => void context.itemMap.delete(ref);
|
|
625
|
-
});
|
|
626
|
-
return /* @__PURE__ */ jsx(CollectionItemSlotImpl, { ...{ [ITEM_DATA_ATTR]: "" }, ref: composedRefs, children });
|
|
627
|
-
}
|
|
628
|
-
);
|
|
629
|
-
CollectionItemSlot.displayName = ITEM_SLOT_NAME;
|
|
630
|
-
function useCollection2(scope) {
|
|
631
|
-
const context = useCollectionContext(name + "CollectionConsumer", scope);
|
|
632
|
-
const getItems = React__default.useCallback(() => {
|
|
633
|
-
const collectionNode = context.collectionRef.current;
|
|
634
|
-
if (!collectionNode) return [];
|
|
635
|
-
const orderedNodes = Array.from(collectionNode.querySelectorAll(`[${ITEM_DATA_ATTR}]`));
|
|
636
|
-
const items = Array.from(context.itemMap.values());
|
|
637
|
-
const orderedItems = items.sort(
|
|
638
|
-
(a, b) => orderedNodes.indexOf(a.ref.current) - orderedNodes.indexOf(b.ref.current)
|
|
639
|
-
);
|
|
640
|
-
return orderedItems;
|
|
641
|
-
}, [context.collectionRef, context.itemMap]);
|
|
642
|
-
return getItems;
|
|
643
|
-
}
|
|
644
|
-
return [
|
|
645
|
-
{ Provider: CollectionProvider, Slot: CollectionSlot, ItemSlot: CollectionItemSlot },
|
|
646
|
-
useCollection2,
|
|
647
|
-
createCollectionScope2
|
|
648
|
-
];
|
|
649
|
-
}
|
|
650
|
-
var VISUALLY_HIDDEN_STYLES = Object.freeze({
|
|
651
|
-
// See: https://github.com/twbs/bootstrap/blob/main/scss/mixins/_visually-hidden.scss
|
|
652
|
-
position: "absolute",
|
|
653
|
-
border: 0,
|
|
654
|
-
width: 1,
|
|
655
|
-
height: 1,
|
|
656
|
-
padding: 0,
|
|
657
|
-
margin: -1,
|
|
658
|
-
overflow: "hidden",
|
|
659
|
-
clip: "rect(0, 0, 0, 0)",
|
|
660
|
-
whiteSpace: "nowrap",
|
|
661
|
-
wordWrap: "normal"
|
|
662
|
-
});
|
|
663
|
-
var NAME = "VisuallyHidden";
|
|
664
|
-
var VisuallyHidden = React.forwardRef(
|
|
665
|
-
(props, forwardedRef) => {
|
|
666
|
-
return /* @__PURE__ */ jsx(
|
|
667
|
-
Primitive.span,
|
|
668
|
-
{
|
|
669
|
-
...props,
|
|
670
|
-
ref: forwardedRef,
|
|
671
|
-
style: { ...VISUALLY_HIDDEN_STYLES, ...props.style }
|
|
672
|
-
}
|
|
673
|
-
);
|
|
674
|
-
}
|
|
675
|
-
);
|
|
676
|
-
VisuallyHidden.displayName = NAME;
|
|
677
|
-
var PROVIDER_NAME = "ToastProvider";
|
|
678
|
-
var [Collection, useCollection, createCollectionScope] = createCollection("Toast");
|
|
679
|
-
var [createToastContext] = createContextScope("Toast", [createCollectionScope]);
|
|
680
|
-
var [ToastProviderProvider, useToastProviderContext] = createToastContext(PROVIDER_NAME);
|
|
681
|
-
var ToastProvider$1 = (props) => {
|
|
682
|
-
const {
|
|
683
|
-
__scopeToast,
|
|
684
|
-
label = "Notification",
|
|
685
|
-
duration = 5e3,
|
|
686
|
-
swipeDirection = "right",
|
|
687
|
-
swipeThreshold = 50,
|
|
688
|
-
children
|
|
689
|
-
} = props;
|
|
690
|
-
const [viewport, setViewport] = React.useState(null);
|
|
691
|
-
const [toastCount, setToastCount] = React.useState(0);
|
|
692
|
-
const isFocusedToastEscapeKeyDownRef = React.useRef(false);
|
|
693
|
-
const isClosePausedRef = React.useRef(false);
|
|
694
|
-
if (!label.trim()) {
|
|
695
|
-
console.error(
|
|
696
|
-
`Invalid prop \`label\` supplied to \`${PROVIDER_NAME}\`. Expected non-empty \`string\`.`
|
|
697
|
-
);
|
|
698
|
-
}
|
|
699
|
-
return /* @__PURE__ */ jsx(Collection.Provider, { scope: __scopeToast, children: /* @__PURE__ */ jsx(
|
|
700
|
-
ToastProviderProvider,
|
|
701
|
-
{
|
|
702
|
-
scope: __scopeToast,
|
|
703
|
-
label,
|
|
704
|
-
duration,
|
|
705
|
-
swipeDirection,
|
|
706
|
-
swipeThreshold,
|
|
707
|
-
toastCount,
|
|
708
|
-
viewport,
|
|
709
|
-
onViewportChange: setViewport,
|
|
710
|
-
onToastAdd: React.useCallback(() => setToastCount((prevCount) => prevCount + 1), []),
|
|
711
|
-
onToastRemove: React.useCallback(() => setToastCount((prevCount) => prevCount - 1), []),
|
|
712
|
-
isFocusedToastEscapeKeyDownRef,
|
|
713
|
-
isClosePausedRef,
|
|
714
|
-
children
|
|
715
|
-
}
|
|
716
|
-
) });
|
|
717
|
-
};
|
|
718
|
-
ToastProvider$1.displayName = PROVIDER_NAME;
|
|
719
|
-
var VIEWPORT_NAME = "ToastViewport";
|
|
720
|
-
var VIEWPORT_DEFAULT_HOTKEY = ["F8"];
|
|
721
|
-
var VIEWPORT_PAUSE = "toast.viewportPause";
|
|
722
|
-
var VIEWPORT_RESUME = "toast.viewportResume";
|
|
723
|
-
var ToastViewport$1 = React.forwardRef(
|
|
724
|
-
(props, forwardedRef) => {
|
|
725
|
-
const {
|
|
726
|
-
__scopeToast,
|
|
727
|
-
hotkey = VIEWPORT_DEFAULT_HOTKEY,
|
|
728
|
-
label = "Notifications ({hotkey})",
|
|
729
|
-
...viewportProps
|
|
730
|
-
} = props;
|
|
731
|
-
const context = useToastProviderContext(VIEWPORT_NAME, __scopeToast);
|
|
732
|
-
const getItems = useCollection(__scopeToast);
|
|
733
|
-
const wrapperRef = React.useRef(null);
|
|
734
|
-
const headFocusProxyRef = React.useRef(null);
|
|
735
|
-
const tailFocusProxyRef = React.useRef(null);
|
|
736
|
-
const ref = React.useRef(null);
|
|
737
|
-
const composedRefs = useComposedRefs(forwardedRef, ref, context.onViewportChange);
|
|
738
|
-
const hotkeyLabel = hotkey.join("+").replace(/Key/g, "").replace(/Digit/g, "");
|
|
739
|
-
const hasToasts = context.toastCount > 0;
|
|
740
|
-
React.useEffect(() => {
|
|
741
|
-
const handleKeyDown = (event) => {
|
|
742
|
-
var _a;
|
|
743
|
-
const isHotkeyPressed = hotkey.length !== 0 && hotkey.every((key) => event[key] || event.code === key);
|
|
744
|
-
if (isHotkeyPressed) (_a = ref.current) == null ? void 0 : _a.focus();
|
|
745
|
-
};
|
|
746
|
-
document.addEventListener("keydown", handleKeyDown);
|
|
747
|
-
return () => document.removeEventListener("keydown", handleKeyDown);
|
|
748
|
-
}, [hotkey]);
|
|
749
|
-
React.useEffect(() => {
|
|
750
|
-
const wrapper = wrapperRef.current;
|
|
751
|
-
const viewport = ref.current;
|
|
752
|
-
if (hasToasts && wrapper && viewport) {
|
|
753
|
-
const handlePause = () => {
|
|
754
|
-
if (!context.isClosePausedRef.current) {
|
|
755
|
-
const pauseEvent = new CustomEvent(VIEWPORT_PAUSE);
|
|
756
|
-
viewport.dispatchEvent(pauseEvent);
|
|
757
|
-
context.isClosePausedRef.current = true;
|
|
758
|
-
}
|
|
759
|
-
};
|
|
760
|
-
const handleResume = () => {
|
|
761
|
-
if (context.isClosePausedRef.current) {
|
|
762
|
-
const resumeEvent = new CustomEvent(VIEWPORT_RESUME);
|
|
763
|
-
viewport.dispatchEvent(resumeEvent);
|
|
764
|
-
context.isClosePausedRef.current = false;
|
|
765
|
-
}
|
|
766
|
-
};
|
|
767
|
-
const handleFocusOutResume = (event) => {
|
|
768
|
-
const isFocusMovingOutside = !wrapper.contains(event.relatedTarget);
|
|
769
|
-
if (isFocusMovingOutside) handleResume();
|
|
770
|
-
};
|
|
771
|
-
const handlePointerLeaveResume = () => {
|
|
772
|
-
const isFocusInside = wrapper.contains(document.activeElement);
|
|
773
|
-
if (!isFocusInside) handleResume();
|
|
774
|
-
};
|
|
775
|
-
wrapper.addEventListener("focusin", handlePause);
|
|
776
|
-
wrapper.addEventListener("focusout", handleFocusOutResume);
|
|
777
|
-
wrapper.addEventListener("pointermove", handlePause);
|
|
778
|
-
wrapper.addEventListener("pointerleave", handlePointerLeaveResume);
|
|
779
|
-
window.addEventListener("blur", handlePause);
|
|
780
|
-
window.addEventListener("focus", handleResume);
|
|
781
|
-
return () => {
|
|
782
|
-
wrapper.removeEventListener("focusin", handlePause);
|
|
783
|
-
wrapper.removeEventListener("focusout", handleFocusOutResume);
|
|
784
|
-
wrapper.removeEventListener("pointermove", handlePause);
|
|
785
|
-
wrapper.removeEventListener("pointerleave", handlePointerLeaveResume);
|
|
786
|
-
window.removeEventListener("blur", handlePause);
|
|
787
|
-
window.removeEventListener("focus", handleResume);
|
|
788
|
-
};
|
|
789
|
-
}
|
|
790
|
-
}, [hasToasts, context.isClosePausedRef]);
|
|
791
|
-
const getSortedTabbableCandidates = React.useCallback(
|
|
792
|
-
({ tabbingDirection }) => {
|
|
793
|
-
const toastItems = getItems();
|
|
794
|
-
const tabbableCandidates = toastItems.map((toastItem) => {
|
|
795
|
-
const toastNode = toastItem.ref.current;
|
|
796
|
-
const toastTabbableCandidates = [toastNode, ...getTabbableCandidates(toastNode)];
|
|
797
|
-
return tabbingDirection === "forwards" ? toastTabbableCandidates : toastTabbableCandidates.reverse();
|
|
798
|
-
});
|
|
799
|
-
return (tabbingDirection === "forwards" ? tabbableCandidates.reverse() : tabbableCandidates).flat();
|
|
800
|
-
},
|
|
801
|
-
[getItems]
|
|
802
|
-
);
|
|
803
|
-
React.useEffect(() => {
|
|
804
|
-
const viewport = ref.current;
|
|
805
|
-
if (viewport) {
|
|
806
|
-
const handleKeyDown = (event) => {
|
|
807
|
-
var _a, _b, _c;
|
|
808
|
-
const isMetaKey = event.altKey || event.ctrlKey || event.metaKey;
|
|
809
|
-
const isTabKey = event.key === "Tab" && !isMetaKey;
|
|
810
|
-
if (isTabKey) {
|
|
811
|
-
const focusedElement = document.activeElement;
|
|
812
|
-
const isTabbingBackwards = event.shiftKey;
|
|
813
|
-
const targetIsViewport = event.target === viewport;
|
|
814
|
-
if (targetIsViewport && isTabbingBackwards) {
|
|
815
|
-
(_a = headFocusProxyRef.current) == null ? void 0 : _a.focus();
|
|
816
|
-
return;
|
|
817
|
-
}
|
|
818
|
-
const tabbingDirection = isTabbingBackwards ? "backwards" : "forwards";
|
|
819
|
-
const sortedCandidates = getSortedTabbableCandidates({ tabbingDirection });
|
|
820
|
-
const index = sortedCandidates.findIndex((candidate) => candidate === focusedElement);
|
|
821
|
-
if (focusFirst(sortedCandidates.slice(index + 1))) {
|
|
822
|
-
event.preventDefault();
|
|
823
|
-
} else {
|
|
824
|
-
isTabbingBackwards ? (_b = headFocusProxyRef.current) == null ? void 0 : _b.focus() : (_c = tailFocusProxyRef.current) == null ? void 0 : _c.focus();
|
|
825
|
-
}
|
|
826
|
-
}
|
|
827
|
-
};
|
|
828
|
-
viewport.addEventListener("keydown", handleKeyDown);
|
|
829
|
-
return () => viewport.removeEventListener("keydown", handleKeyDown);
|
|
830
|
-
}
|
|
831
|
-
}, [getItems, getSortedTabbableCandidates]);
|
|
832
|
-
return /* @__PURE__ */ jsxs(
|
|
833
|
-
Branch,
|
|
834
|
-
{
|
|
835
|
-
ref: wrapperRef,
|
|
836
|
-
role: "region",
|
|
837
|
-
"aria-label": label.replace("{hotkey}", hotkeyLabel),
|
|
838
|
-
tabIndex: -1,
|
|
839
|
-
style: { pointerEvents: hasToasts ? void 0 : "none" },
|
|
840
|
-
children: [
|
|
841
|
-
hasToasts && /* @__PURE__ */ jsx(
|
|
842
|
-
FocusProxy,
|
|
843
|
-
{
|
|
844
|
-
ref: headFocusProxyRef,
|
|
845
|
-
onFocusFromOutsideViewport: () => {
|
|
846
|
-
const tabbableCandidates = getSortedTabbableCandidates({
|
|
847
|
-
tabbingDirection: "forwards"
|
|
848
|
-
});
|
|
849
|
-
focusFirst(tabbableCandidates);
|
|
850
|
-
}
|
|
851
|
-
}
|
|
852
|
-
),
|
|
853
|
-
/* @__PURE__ */ jsx(Collection.Slot, { scope: __scopeToast, children: /* @__PURE__ */ jsx(Primitive.ol, { tabIndex: -1, ...viewportProps, ref: composedRefs }) }),
|
|
854
|
-
hasToasts && /* @__PURE__ */ jsx(
|
|
855
|
-
FocusProxy,
|
|
856
|
-
{
|
|
857
|
-
ref: tailFocusProxyRef,
|
|
858
|
-
onFocusFromOutsideViewport: () => {
|
|
859
|
-
const tabbableCandidates = getSortedTabbableCandidates({
|
|
860
|
-
tabbingDirection: "backwards"
|
|
861
|
-
});
|
|
862
|
-
focusFirst(tabbableCandidates);
|
|
863
|
-
}
|
|
864
|
-
}
|
|
865
|
-
)
|
|
866
|
-
]
|
|
867
|
-
}
|
|
868
|
-
);
|
|
869
|
-
}
|
|
870
|
-
);
|
|
871
|
-
ToastViewport$1.displayName = VIEWPORT_NAME;
|
|
872
|
-
var FOCUS_PROXY_NAME = "ToastFocusProxy";
|
|
873
|
-
var FocusProxy = React.forwardRef(
|
|
874
|
-
(props, forwardedRef) => {
|
|
875
|
-
const { __scopeToast, onFocusFromOutsideViewport, ...proxyProps } = props;
|
|
876
|
-
const context = useToastProviderContext(FOCUS_PROXY_NAME, __scopeToast);
|
|
877
|
-
return /* @__PURE__ */ jsx(
|
|
878
|
-
VisuallyHidden,
|
|
879
|
-
{
|
|
880
|
-
tabIndex: 0,
|
|
881
|
-
...proxyProps,
|
|
882
|
-
ref: forwardedRef,
|
|
883
|
-
style: { position: "fixed" },
|
|
884
|
-
onFocus: (event) => {
|
|
885
|
-
var _a;
|
|
886
|
-
const prevFocusedElement = event.relatedTarget;
|
|
887
|
-
const isFocusFromOutsideViewport = !((_a = context.viewport) == null ? void 0 : _a.contains(prevFocusedElement));
|
|
888
|
-
if (isFocusFromOutsideViewport) onFocusFromOutsideViewport();
|
|
889
|
-
}
|
|
890
|
-
}
|
|
891
|
-
);
|
|
892
|
-
}
|
|
893
|
-
);
|
|
894
|
-
FocusProxy.displayName = FOCUS_PROXY_NAME;
|
|
895
|
-
var TOAST_NAME = "Toast";
|
|
896
|
-
var TOAST_SWIPE_START = "toast.swipeStart";
|
|
897
|
-
var TOAST_SWIPE_MOVE = "toast.swipeMove";
|
|
898
|
-
var TOAST_SWIPE_CANCEL = "toast.swipeCancel";
|
|
899
|
-
var TOAST_SWIPE_END = "toast.swipeEnd";
|
|
900
|
-
var Toast = React.forwardRef(
|
|
901
|
-
(props, forwardedRef) => {
|
|
902
|
-
const { forceMount, open: openProp, defaultOpen, onOpenChange, ...toastProps } = props;
|
|
903
|
-
const [open, setOpen] = useControllableState({
|
|
904
|
-
prop: openProp,
|
|
905
|
-
defaultProp: defaultOpen ?? true,
|
|
906
|
-
onChange: onOpenChange,
|
|
907
|
-
caller: TOAST_NAME
|
|
908
|
-
});
|
|
909
|
-
return /* @__PURE__ */ jsx(Presence, { present: forceMount || open, children: /* @__PURE__ */ jsx(
|
|
910
|
-
ToastImpl,
|
|
911
|
-
{
|
|
912
|
-
open,
|
|
913
|
-
...toastProps,
|
|
914
|
-
ref: forwardedRef,
|
|
915
|
-
onClose: () => setOpen(false),
|
|
916
|
-
onPause: useCallbackRef(props.onPause),
|
|
917
|
-
onResume: useCallbackRef(props.onResume),
|
|
918
|
-
onSwipeStart: composeEventHandlers(props.onSwipeStart, (event) => {
|
|
919
|
-
event.currentTarget.setAttribute("data-swipe", "start");
|
|
920
|
-
}),
|
|
921
|
-
onSwipeMove: composeEventHandlers(props.onSwipeMove, (event) => {
|
|
922
|
-
const { x, y } = event.detail.delta;
|
|
923
|
-
event.currentTarget.setAttribute("data-swipe", "move");
|
|
924
|
-
event.currentTarget.style.setProperty("--radix-toast-swipe-move-x", `${x}px`);
|
|
925
|
-
event.currentTarget.style.setProperty("--radix-toast-swipe-move-y", `${y}px`);
|
|
926
|
-
}),
|
|
927
|
-
onSwipeCancel: composeEventHandlers(props.onSwipeCancel, (event) => {
|
|
928
|
-
event.currentTarget.setAttribute("data-swipe", "cancel");
|
|
929
|
-
event.currentTarget.style.removeProperty("--radix-toast-swipe-move-x");
|
|
930
|
-
event.currentTarget.style.removeProperty("--radix-toast-swipe-move-y");
|
|
931
|
-
event.currentTarget.style.removeProperty("--radix-toast-swipe-end-x");
|
|
932
|
-
event.currentTarget.style.removeProperty("--radix-toast-swipe-end-y");
|
|
933
|
-
}),
|
|
934
|
-
onSwipeEnd: composeEventHandlers(props.onSwipeEnd, (event) => {
|
|
935
|
-
const { x, y } = event.detail.delta;
|
|
936
|
-
event.currentTarget.setAttribute("data-swipe", "end");
|
|
937
|
-
event.currentTarget.style.removeProperty("--radix-toast-swipe-move-x");
|
|
938
|
-
event.currentTarget.style.removeProperty("--radix-toast-swipe-move-y");
|
|
939
|
-
event.currentTarget.style.setProperty("--radix-toast-swipe-end-x", `${x}px`);
|
|
940
|
-
event.currentTarget.style.setProperty("--radix-toast-swipe-end-y", `${y}px`);
|
|
941
|
-
setOpen(false);
|
|
942
|
-
})
|
|
943
|
-
}
|
|
944
|
-
) });
|
|
945
|
-
}
|
|
946
|
-
);
|
|
947
|
-
Toast.displayName = TOAST_NAME;
|
|
948
|
-
var [ToastInteractiveProvider, useToastInteractiveContext] = createToastContext(TOAST_NAME, {
|
|
949
|
-
onClose() {
|
|
950
|
-
}
|
|
951
|
-
});
|
|
952
|
-
var ToastImpl = React.forwardRef(
|
|
953
|
-
(props, forwardedRef) => {
|
|
954
|
-
const {
|
|
955
|
-
__scopeToast,
|
|
956
|
-
type = "foreground",
|
|
957
|
-
duration: durationProp,
|
|
958
|
-
open,
|
|
959
|
-
onClose,
|
|
960
|
-
onEscapeKeyDown,
|
|
961
|
-
onPause,
|
|
962
|
-
onResume,
|
|
963
|
-
onSwipeStart,
|
|
964
|
-
onSwipeMove,
|
|
965
|
-
onSwipeCancel,
|
|
966
|
-
onSwipeEnd,
|
|
967
|
-
...toastProps
|
|
968
|
-
} = props;
|
|
969
|
-
const context = useToastProviderContext(TOAST_NAME, __scopeToast);
|
|
970
|
-
const [node, setNode] = React.useState(null);
|
|
971
|
-
const composedRefs = useComposedRefs(forwardedRef, (node2) => setNode(node2));
|
|
972
|
-
const pointerStartRef = React.useRef(null);
|
|
973
|
-
const swipeDeltaRef = React.useRef(null);
|
|
974
|
-
const duration = durationProp || context.duration;
|
|
975
|
-
const closeTimerStartTimeRef = React.useRef(0);
|
|
976
|
-
const closeTimerRemainingTimeRef = React.useRef(duration);
|
|
977
|
-
const closeTimerRef = React.useRef(0);
|
|
978
|
-
const { onToastAdd, onToastRemove } = context;
|
|
979
|
-
const handleClose = useCallbackRef(() => {
|
|
980
|
-
var _a;
|
|
981
|
-
const isFocusInToast = node == null ? void 0 : node.contains(document.activeElement);
|
|
982
|
-
if (isFocusInToast) (_a = context.viewport) == null ? void 0 : _a.focus();
|
|
983
|
-
onClose();
|
|
984
|
-
});
|
|
985
|
-
const startTimer = React.useCallback(
|
|
986
|
-
(duration2) => {
|
|
987
|
-
if (!duration2 || duration2 === Infinity) return;
|
|
988
|
-
window.clearTimeout(closeTimerRef.current);
|
|
989
|
-
closeTimerStartTimeRef.current = (/* @__PURE__ */ new Date()).getTime();
|
|
990
|
-
closeTimerRef.current = window.setTimeout(handleClose, duration2);
|
|
991
|
-
},
|
|
992
|
-
[handleClose]
|
|
993
|
-
);
|
|
994
|
-
React.useEffect(() => {
|
|
995
|
-
const viewport = context.viewport;
|
|
996
|
-
if (viewport) {
|
|
997
|
-
const handleResume = () => {
|
|
998
|
-
startTimer(closeTimerRemainingTimeRef.current);
|
|
999
|
-
onResume == null ? void 0 : onResume();
|
|
1000
|
-
};
|
|
1001
|
-
const handlePause = () => {
|
|
1002
|
-
const elapsedTime = (/* @__PURE__ */ new Date()).getTime() - closeTimerStartTimeRef.current;
|
|
1003
|
-
closeTimerRemainingTimeRef.current = closeTimerRemainingTimeRef.current - elapsedTime;
|
|
1004
|
-
window.clearTimeout(closeTimerRef.current);
|
|
1005
|
-
onPause == null ? void 0 : onPause();
|
|
1006
|
-
};
|
|
1007
|
-
viewport.addEventListener(VIEWPORT_PAUSE, handlePause);
|
|
1008
|
-
viewport.addEventListener(VIEWPORT_RESUME, handleResume);
|
|
1009
|
-
return () => {
|
|
1010
|
-
viewport.removeEventListener(VIEWPORT_PAUSE, handlePause);
|
|
1011
|
-
viewport.removeEventListener(VIEWPORT_RESUME, handleResume);
|
|
1012
|
-
};
|
|
1013
|
-
}
|
|
1014
|
-
}, [context.viewport, duration, onPause, onResume, startTimer]);
|
|
1015
|
-
React.useEffect(() => {
|
|
1016
|
-
if (open && !context.isClosePausedRef.current) startTimer(duration);
|
|
1017
|
-
}, [open, duration, context.isClosePausedRef, startTimer]);
|
|
1018
|
-
React.useEffect(() => {
|
|
1019
|
-
onToastAdd();
|
|
1020
|
-
return () => onToastRemove();
|
|
1021
|
-
}, [onToastAdd, onToastRemove]);
|
|
1022
|
-
const announceTextContent = React.useMemo(() => {
|
|
1023
|
-
return node ? getAnnounceTextContent(node) : null;
|
|
1024
|
-
}, [node]);
|
|
1025
|
-
if (!context.viewport) return null;
|
|
1026
|
-
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
1027
|
-
announceTextContent && /* @__PURE__ */ jsx(
|
|
1028
|
-
ToastAnnounce,
|
|
1029
|
-
{
|
|
1030
|
-
__scopeToast,
|
|
1031
|
-
role: "status",
|
|
1032
|
-
"aria-live": type === "foreground" ? "assertive" : "polite",
|
|
1033
|
-
children: announceTextContent
|
|
1034
|
-
}
|
|
1035
|
-
),
|
|
1036
|
-
/* @__PURE__ */ jsx(ToastInteractiveProvider, { scope: __scopeToast, onClose: handleClose, children: ReactDOM.createPortal(
|
|
1037
|
-
/* @__PURE__ */ jsx(Collection.ItemSlot, { scope: __scopeToast, children: /* @__PURE__ */ jsx(
|
|
1038
|
-
Root,
|
|
1039
|
-
{
|
|
1040
|
-
asChild: true,
|
|
1041
|
-
onEscapeKeyDown: composeEventHandlers(onEscapeKeyDown, () => {
|
|
1042
|
-
if (!context.isFocusedToastEscapeKeyDownRef.current) handleClose();
|
|
1043
|
-
context.isFocusedToastEscapeKeyDownRef.current = false;
|
|
1044
|
-
}),
|
|
1045
|
-
children: /* @__PURE__ */ jsx(
|
|
1046
|
-
Primitive.li,
|
|
1047
|
-
{
|
|
1048
|
-
tabIndex: 0,
|
|
1049
|
-
"data-state": open ? "open" : "closed",
|
|
1050
|
-
"data-swipe-direction": context.swipeDirection,
|
|
1051
|
-
...toastProps,
|
|
1052
|
-
ref: composedRefs,
|
|
1053
|
-
style: { userSelect: "none", touchAction: "none", ...props.style },
|
|
1054
|
-
onKeyDown: composeEventHandlers(props.onKeyDown, (event) => {
|
|
1055
|
-
if (event.key !== "Escape") return;
|
|
1056
|
-
onEscapeKeyDown == null ? void 0 : onEscapeKeyDown(event.nativeEvent);
|
|
1057
|
-
if (!event.nativeEvent.defaultPrevented) {
|
|
1058
|
-
context.isFocusedToastEscapeKeyDownRef.current = true;
|
|
1059
|
-
handleClose();
|
|
1060
|
-
}
|
|
1061
|
-
}),
|
|
1062
|
-
onPointerDown: composeEventHandlers(props.onPointerDown, (event) => {
|
|
1063
|
-
if (event.button !== 0) return;
|
|
1064
|
-
pointerStartRef.current = { x: event.clientX, y: event.clientY };
|
|
1065
|
-
}),
|
|
1066
|
-
onPointerMove: composeEventHandlers(props.onPointerMove, (event) => {
|
|
1067
|
-
if (!pointerStartRef.current) return;
|
|
1068
|
-
const x = event.clientX - pointerStartRef.current.x;
|
|
1069
|
-
const y = event.clientY - pointerStartRef.current.y;
|
|
1070
|
-
const hasSwipeMoveStarted = Boolean(swipeDeltaRef.current);
|
|
1071
|
-
const isHorizontalSwipe = ["left", "right"].includes(context.swipeDirection);
|
|
1072
|
-
const clamp = ["left", "up"].includes(context.swipeDirection) ? Math.min : Math.max;
|
|
1073
|
-
const clampedX = isHorizontalSwipe ? clamp(0, x) : 0;
|
|
1074
|
-
const clampedY = !isHorizontalSwipe ? clamp(0, y) : 0;
|
|
1075
|
-
const moveStartBuffer = event.pointerType === "touch" ? 10 : 2;
|
|
1076
|
-
const delta = { x: clampedX, y: clampedY };
|
|
1077
|
-
const eventDetail = { originalEvent: event, delta };
|
|
1078
|
-
if (hasSwipeMoveStarted) {
|
|
1079
|
-
swipeDeltaRef.current = delta;
|
|
1080
|
-
handleAndDispatchCustomEvent(TOAST_SWIPE_MOVE, onSwipeMove, eventDetail, {
|
|
1081
|
-
discrete: false
|
|
1082
|
-
});
|
|
1083
|
-
} else if (isDeltaInDirection(delta, context.swipeDirection, moveStartBuffer)) {
|
|
1084
|
-
swipeDeltaRef.current = delta;
|
|
1085
|
-
handleAndDispatchCustomEvent(TOAST_SWIPE_START, onSwipeStart, eventDetail, {
|
|
1086
|
-
discrete: false
|
|
1087
|
-
});
|
|
1088
|
-
event.target.setPointerCapture(event.pointerId);
|
|
1089
|
-
} else if (Math.abs(x) > moveStartBuffer || Math.abs(y) > moveStartBuffer) {
|
|
1090
|
-
pointerStartRef.current = null;
|
|
1091
|
-
}
|
|
1092
|
-
}),
|
|
1093
|
-
onPointerUp: composeEventHandlers(props.onPointerUp, (event) => {
|
|
1094
|
-
const delta = swipeDeltaRef.current;
|
|
1095
|
-
const target = event.target;
|
|
1096
|
-
if (target.hasPointerCapture(event.pointerId)) {
|
|
1097
|
-
target.releasePointerCapture(event.pointerId);
|
|
1098
|
-
}
|
|
1099
|
-
swipeDeltaRef.current = null;
|
|
1100
|
-
pointerStartRef.current = null;
|
|
1101
|
-
if (delta) {
|
|
1102
|
-
const toast = event.currentTarget;
|
|
1103
|
-
const eventDetail = { originalEvent: event, delta };
|
|
1104
|
-
if (isDeltaInDirection(delta, context.swipeDirection, context.swipeThreshold)) {
|
|
1105
|
-
handleAndDispatchCustomEvent(TOAST_SWIPE_END, onSwipeEnd, eventDetail, {
|
|
1106
|
-
discrete: true
|
|
1107
|
-
});
|
|
1108
|
-
} else {
|
|
1109
|
-
handleAndDispatchCustomEvent(
|
|
1110
|
-
TOAST_SWIPE_CANCEL,
|
|
1111
|
-
onSwipeCancel,
|
|
1112
|
-
eventDetail,
|
|
1113
|
-
{
|
|
1114
|
-
discrete: true
|
|
1115
|
-
}
|
|
1116
|
-
);
|
|
1117
|
-
}
|
|
1118
|
-
toast.addEventListener("click", (event2) => event2.preventDefault(), {
|
|
1119
|
-
once: true
|
|
1120
|
-
});
|
|
1121
|
-
}
|
|
1122
|
-
})
|
|
1123
|
-
}
|
|
1124
|
-
)
|
|
1125
|
-
}
|
|
1126
|
-
) }),
|
|
1127
|
-
context.viewport
|
|
1128
|
-
) })
|
|
1129
|
-
] });
|
|
1130
|
-
}
|
|
1131
|
-
);
|
|
1132
|
-
var ToastAnnounce = (props) => {
|
|
1133
|
-
const { __scopeToast, children, ...announceProps } = props;
|
|
1134
|
-
const context = useToastProviderContext(TOAST_NAME, __scopeToast);
|
|
1135
|
-
const [renderAnnounceText, setRenderAnnounceText] = React.useState(false);
|
|
1136
|
-
const [isAnnounced, setIsAnnounced] = React.useState(false);
|
|
1137
|
-
useNextFrame(() => setRenderAnnounceText(true));
|
|
1138
|
-
React.useEffect(() => {
|
|
1139
|
-
const timer = window.setTimeout(() => setIsAnnounced(true), 1e3);
|
|
1140
|
-
return () => window.clearTimeout(timer);
|
|
1141
|
-
}, []);
|
|
1142
|
-
return isAnnounced ? null : /* @__PURE__ */ jsx(Portal, { asChild: true, children: /* @__PURE__ */ jsx(VisuallyHidden, { ...announceProps, children: renderAnnounceText && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
1143
|
-
context.label,
|
|
1144
|
-
" ",
|
|
1145
|
-
children
|
|
1146
|
-
] }) }) });
|
|
1147
|
-
};
|
|
1148
|
-
var TITLE_NAME = "ToastTitle";
|
|
1149
|
-
var ToastTitle = React.forwardRef(
|
|
1150
|
-
(props, forwardedRef) => {
|
|
1151
|
-
const { __scopeToast, ...titleProps } = props;
|
|
1152
|
-
return /* @__PURE__ */ jsx(Primitive.div, { ...titleProps, ref: forwardedRef });
|
|
1153
|
-
}
|
|
1154
|
-
);
|
|
1155
|
-
ToastTitle.displayName = TITLE_NAME;
|
|
1156
|
-
var DESCRIPTION_NAME = "ToastDescription";
|
|
1157
|
-
var ToastDescription = React.forwardRef(
|
|
1158
|
-
(props, forwardedRef) => {
|
|
1159
|
-
const { __scopeToast, ...descriptionProps } = props;
|
|
1160
|
-
return /* @__PURE__ */ jsx(Primitive.div, { ...descriptionProps, ref: forwardedRef });
|
|
1161
|
-
}
|
|
1162
|
-
);
|
|
1163
|
-
ToastDescription.displayName = DESCRIPTION_NAME;
|
|
1164
|
-
var ACTION_NAME = "ToastAction";
|
|
1165
|
-
var ToastAction = React.forwardRef(
|
|
1166
|
-
(props, forwardedRef) => {
|
|
1167
|
-
const { altText, ...actionProps } = props;
|
|
1168
|
-
if (!altText.trim()) {
|
|
1169
|
-
console.error(
|
|
1170
|
-
`Invalid prop \`altText\` supplied to \`${ACTION_NAME}\`. Expected non-empty \`string\`.`
|
|
1171
|
-
);
|
|
1172
|
-
return null;
|
|
1173
|
-
}
|
|
1174
|
-
return /* @__PURE__ */ jsx(ToastAnnounceExclude, { altText, asChild: true, children: /* @__PURE__ */ jsx(ToastClose, { ...actionProps, ref: forwardedRef }) });
|
|
1175
|
-
}
|
|
1176
|
-
);
|
|
1177
|
-
ToastAction.displayName = ACTION_NAME;
|
|
1178
|
-
var CLOSE_NAME = "ToastClose";
|
|
1179
|
-
var ToastClose = React.forwardRef(
|
|
1180
|
-
(props, forwardedRef) => {
|
|
1181
|
-
const { __scopeToast, ...closeProps } = props;
|
|
1182
|
-
const interactiveContext = useToastInteractiveContext(CLOSE_NAME, __scopeToast);
|
|
1183
|
-
return /* @__PURE__ */ jsx(ToastAnnounceExclude, { asChild: true, children: /* @__PURE__ */ jsx(
|
|
1184
|
-
Primitive.button,
|
|
1185
|
-
{
|
|
1186
|
-
type: "button",
|
|
1187
|
-
...closeProps,
|
|
1188
|
-
ref: forwardedRef,
|
|
1189
|
-
onClick: composeEventHandlers(props.onClick, interactiveContext.onClose)
|
|
1190
|
-
}
|
|
1191
|
-
) });
|
|
1192
|
-
}
|
|
1193
|
-
);
|
|
1194
|
-
ToastClose.displayName = CLOSE_NAME;
|
|
1195
|
-
var ToastAnnounceExclude = React.forwardRef((props, forwardedRef) => {
|
|
1196
|
-
const { __scopeToast, altText, ...announceExcludeProps } = props;
|
|
1197
|
-
return /* @__PURE__ */ jsx(
|
|
1198
|
-
Primitive.div,
|
|
1199
|
-
{
|
|
1200
|
-
"data-radix-toast-announce-exclude": "",
|
|
1201
|
-
"data-radix-toast-announce-alt": altText || void 0,
|
|
1202
|
-
...announceExcludeProps,
|
|
1203
|
-
ref: forwardedRef
|
|
1204
|
-
}
|
|
1205
|
-
);
|
|
1206
|
-
});
|
|
1207
|
-
function getAnnounceTextContent(container) {
|
|
1208
|
-
const textContent = [];
|
|
1209
|
-
const childNodes = Array.from(container.childNodes);
|
|
1210
|
-
childNodes.forEach((node) => {
|
|
1211
|
-
if (node.nodeType === node.TEXT_NODE && node.textContent) textContent.push(node.textContent);
|
|
1212
|
-
if (isHTMLElement(node)) {
|
|
1213
|
-
const isHidden = node.ariaHidden || node.hidden || node.style.display === "none";
|
|
1214
|
-
const isExcluded = node.dataset.radixToastAnnounceExclude === "";
|
|
1215
|
-
if (!isHidden) {
|
|
1216
|
-
if (isExcluded) {
|
|
1217
|
-
const altText = node.dataset.radixToastAnnounceAlt;
|
|
1218
|
-
if (altText) textContent.push(altText);
|
|
1219
|
-
} else {
|
|
1220
|
-
textContent.push(...getAnnounceTextContent(node));
|
|
1221
|
-
}
|
|
1222
|
-
}
|
|
1223
|
-
}
|
|
1224
|
-
});
|
|
1225
|
-
return textContent;
|
|
1226
|
-
}
|
|
1227
|
-
function handleAndDispatchCustomEvent(name, handler, detail, { discrete }) {
|
|
1228
|
-
const currentTarget = detail.originalEvent.currentTarget;
|
|
1229
|
-
const event = new CustomEvent(name, { bubbles: true, cancelable: true, detail });
|
|
1230
|
-
if (handler) currentTarget.addEventListener(name, handler, { once: true });
|
|
1231
|
-
if (discrete) {
|
|
1232
|
-
dispatchDiscreteCustomEvent(currentTarget, event);
|
|
1233
|
-
} else {
|
|
1234
|
-
currentTarget.dispatchEvent(event);
|
|
1235
|
-
}
|
|
1236
|
-
}
|
|
1237
|
-
var isDeltaInDirection = (delta, direction, threshold = 0) => {
|
|
1238
|
-
const deltaX = Math.abs(delta.x);
|
|
1239
|
-
const deltaY = Math.abs(delta.y);
|
|
1240
|
-
const isDeltaX = deltaX > deltaY;
|
|
1241
|
-
if (direction === "left" || direction === "right") {
|
|
1242
|
-
return isDeltaX && deltaX > threshold;
|
|
1243
|
-
} else {
|
|
1244
|
-
return !isDeltaX && deltaY > threshold;
|
|
1245
|
-
}
|
|
1246
|
-
};
|
|
1247
|
-
function useNextFrame(callback = () => {
|
|
1248
|
-
}) {
|
|
1249
|
-
const fn = useCallbackRef(callback);
|
|
1250
|
-
useLayoutEffect2(() => {
|
|
1251
|
-
let raf1 = 0;
|
|
1252
|
-
let raf2 = 0;
|
|
1253
|
-
raf1 = window.requestAnimationFrame(() => raf2 = window.requestAnimationFrame(fn));
|
|
1254
|
-
return () => {
|
|
1255
|
-
window.cancelAnimationFrame(raf1);
|
|
1256
|
-
window.cancelAnimationFrame(raf2);
|
|
1257
|
-
};
|
|
1258
|
-
}, [fn]);
|
|
1259
|
-
}
|
|
1260
|
-
function isHTMLElement(node) {
|
|
1261
|
-
return node.nodeType === node.ELEMENT_NODE;
|
|
1262
|
-
}
|
|
1263
|
-
function getTabbableCandidates(container) {
|
|
1264
|
-
const nodes = [];
|
|
1265
|
-
const walker = document.createTreeWalker(container, NodeFilter.SHOW_ELEMENT, {
|
|
1266
|
-
acceptNode: (node) => {
|
|
1267
|
-
const isHiddenInput = node.tagName === "INPUT" && node.type === "hidden";
|
|
1268
|
-
if (node.disabled || node.hidden || isHiddenInput) return NodeFilter.FILTER_SKIP;
|
|
1269
|
-
return node.tabIndex >= 0 ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP;
|
|
1270
|
-
}
|
|
1271
|
-
});
|
|
1272
|
-
while (walker.nextNode()) nodes.push(walker.currentNode);
|
|
1273
|
-
return nodes;
|
|
1274
|
-
}
|
|
1275
|
-
function focusFirst(candidates) {
|
|
1276
|
-
const previouslyFocusedElement = document.activeElement;
|
|
1277
|
-
return candidates.some((candidate) => {
|
|
1278
|
-
if (candidate === previouslyFocusedElement) return true;
|
|
1279
|
-
candidate.focus();
|
|
1280
|
-
return document.activeElement !== previouslyFocusedElement;
|
|
1281
|
-
});
|
|
1282
|
-
}
|
|
1283
|
-
var Provider = ToastProvider$1;
|
|
1284
|
-
var Viewport = ToastViewport$1;
|
|
1285
|
-
var Root2 = Toast;
|
|
1286
|
-
var Description = ToastDescription;
|
|
1287
|
-
function getToastIcon(type) {
|
|
1288
|
-
switch (type) {
|
|
1289
|
-
case "success":
|
|
1290
|
-
return "✓";
|
|
1291
|
-
case "error":
|
|
1292
|
-
return "✕";
|
|
1293
|
-
case "warning":
|
|
1294
|
-
return "⚠";
|
|
1295
|
-
case "info":
|
|
1296
|
-
default:
|
|
1297
|
-
return "ℹ";
|
|
1298
|
-
}
|
|
1299
|
-
}
|
|
1300
|
-
function ToastItem({ toast, onOpenChange }) {
|
|
1301
|
-
return /* @__PURE__ */ jsxs(
|
|
1302
|
-
Root2,
|
|
1303
|
-
{
|
|
1304
|
-
className: `taskon-toast taskon-toast--${toast.type}`,
|
|
1305
|
-
duration: toast.duration ?? 3e3,
|
|
1306
|
-
onOpenChange,
|
|
1307
|
-
children: [
|
|
1308
|
-
/* @__PURE__ */ jsx("div", { className: "taskon-toast-icon", children: getToastIcon(toast.type) }),
|
|
1309
|
-
/* @__PURE__ */ jsx(Description, { className: "taskon-toast-message", children: toast.message })
|
|
1310
|
-
]
|
|
1311
|
-
}
|
|
1312
|
-
);
|
|
1313
|
-
}
|
|
1314
|
-
function ToastViewport({
|
|
1315
|
-
toasts,
|
|
1316
|
-
onRemove
|
|
1317
|
-
}) {
|
|
1318
|
-
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
1319
|
-
toasts.map((toast) => /* @__PURE__ */ jsx(
|
|
1320
|
-
ToastItem,
|
|
1321
|
-
{
|
|
1322
|
-
toast,
|
|
1323
|
-
onOpenChange: (open) => {
|
|
1324
|
-
if (!open) {
|
|
1325
|
-
onRemove(toast.id);
|
|
1326
|
-
}
|
|
1327
|
-
}
|
|
1328
|
-
},
|
|
1329
|
-
toast.id
|
|
1330
|
-
)),
|
|
1331
|
-
/* @__PURE__ */ jsx(Viewport, { className: "taskon-toast-viewport" })
|
|
1332
|
-
] });
|
|
1333
|
-
}
|
|
1334
|
-
const ToastProvider = Provider;
|
|
1335
|
-
function TaskOnProvider({
|
|
1336
|
-
config,
|
|
1337
|
-
children,
|
|
1338
|
-
preloadLocales
|
|
1339
|
-
}) {
|
|
1340
|
-
const [userInfo, setUserInfo] = useState(null);
|
|
1341
|
-
const [userToken, setUserToken] = useState(null);
|
|
1342
|
-
const [chains, setChains] = useState([]);
|
|
1343
|
-
const [communityInfo, setCommunityInfo] = useState(null);
|
|
1344
|
-
const toastState = useToastState();
|
|
1345
|
-
const { locale } = useLocaleManager({
|
|
1346
|
-
configLocale: config.locale,
|
|
1347
|
-
preloadLocales
|
|
1348
|
-
});
|
|
1349
|
-
const { client, userApiRef, isInitializing } = useClientInit({
|
|
1350
|
-
apiKey: config.apiKey,
|
|
1351
|
-
baseURL: config.baseURL,
|
|
1352
|
-
setUserInfo,
|
|
1353
|
-
setUserToken
|
|
1354
|
-
});
|
|
1355
|
-
const { login, logout } = useAuth({
|
|
1356
|
-
client,
|
|
1357
|
-
userApiRef,
|
|
1358
|
-
setUserInfo,
|
|
1359
|
-
setUserToken
|
|
1360
|
-
});
|
|
1361
|
-
const requestLogin = useCallback(() => {
|
|
1362
|
-
var _a;
|
|
1363
|
-
(_a = config.onRequestLogin) == null ? void 0 : _a.call(config);
|
|
1364
|
-
}, [config]);
|
|
1365
|
-
const refreshUserInfo = useCallback(async () => {
|
|
1366
|
-
const userApi = userApiRef.current;
|
|
1367
|
-
if (!userApi) return;
|
|
1368
|
-
try {
|
|
1369
|
-
const info = await userApi.getInfo();
|
|
1370
|
-
setUserInfo(info);
|
|
1371
|
-
} catch {
|
|
1372
|
-
}
|
|
1373
|
-
}, [userApiRef]);
|
|
1374
|
-
useEffect(() => {
|
|
1375
|
-
if (!client) return;
|
|
1376
|
-
const loadChains = async () => {
|
|
1377
|
-
try {
|
|
1378
|
-
const chainApi = createChainApi(client);
|
|
1379
|
-
const chainList = await chainApi.getChainInfo();
|
|
1380
|
-
setChains(chainList);
|
|
1381
|
-
} catch {
|
|
1382
|
-
}
|
|
1383
|
-
};
|
|
1384
|
-
loadChains();
|
|
1385
|
-
}, [client]);
|
|
1386
|
-
useEffect(() => {
|
|
1387
|
-
if (!client) return;
|
|
1388
|
-
const loadCommunityInfo = async () => {
|
|
1389
|
-
try {
|
|
1390
|
-
const communityTaskApi = createCommunityTaskApi(client);
|
|
1391
|
-
const info = await communityTaskApi.getCommunityInfo();
|
|
1392
|
-
setCommunityInfo(info);
|
|
1393
|
-
} catch {
|
|
1394
|
-
}
|
|
1395
|
-
};
|
|
1396
|
-
loadCommunityInfo();
|
|
1397
|
-
}, [client]);
|
|
1398
|
-
const contextValue = useMemo(
|
|
1399
|
-
() => ({
|
|
1400
|
-
config,
|
|
1401
|
-
client,
|
|
1402
|
-
isInitializing,
|
|
1403
|
-
locale,
|
|
1404
|
-
userId: (userInfo == null ? void 0 : userInfo.id) ?? null,
|
|
1405
|
-
userInfo,
|
|
1406
|
-
userToken,
|
|
1407
|
-
isLoggedIn: userInfo !== null && userToken !== null,
|
|
1408
|
-
login,
|
|
1409
|
-
logout,
|
|
1410
|
-
requestLogin,
|
|
1411
|
-
refreshUserInfo,
|
|
1412
|
-
chains,
|
|
1413
|
-
communityInfo
|
|
1414
|
-
}),
|
|
1415
|
-
[config, client, isInitializing, locale, userInfo, userToken, login, logout, requestLogin, refreshUserInfo, chains, communityInfo]
|
|
1416
|
-
);
|
|
1417
|
-
return /* @__PURE__ */ jsx(TaskOnContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(ToastContext.Provider, { value: toastState, children: /* @__PURE__ */ jsxs(ToastProvider, { children: [
|
|
1418
|
-
/* @__PURE__ */ jsx(WalletProvider, { config: config.walletConfig, children }),
|
|
1419
|
-
/* @__PURE__ */ jsx(
|
|
1420
|
-
ToastViewport,
|
|
1421
|
-
{
|
|
1422
|
-
toasts: toastState.toasts,
|
|
1423
|
-
onRemove: toastState.removeToast
|
|
1424
|
-
}
|
|
1425
|
-
)
|
|
1426
|
-
] }) }) });
|
|
1427
|
-
}
|
|
1428
|
-
export {
|
|
1429
|
-
TaskOnProvider as T,
|
|
1430
|
-
useCommonLocale as a,
|
|
1431
|
-
createT as b,
|
|
1432
|
-
createLocaleLoader as c,
|
|
1433
|
-
interpolate as i,
|
|
1434
|
-
useTranslation as u
|
|
1435
|
-
};
|