@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.
Files changed (66) hide show
  1. package/README.md +118 -64
  2. package/dist/CommunityTaskList.css +2694 -2951
  3. package/dist/EligibilityInfo.css +2221 -1332
  4. package/dist/LeaderboardWidget.css +403 -198
  5. package/dist/PageBuilder.css +57 -0
  6. package/dist/Quest.css +1347 -1477
  7. package/dist/TaskOnProvider.css +337 -29
  8. package/dist/ThemeProvider.css +228 -0
  9. package/dist/UserCenterWidget.css +168 -0
  10. package/dist/UserCenterWidget2.css +4917 -0
  11. package/dist/WidgetShell.css +417 -130
  12. package/dist/chunks/{CommunityTaskList-CrH6r4Av.js → CommunityTaskList-2nFy6l6m.js} +2612 -2074
  13. package/dist/chunks/{EligibilityInfo-DesW9-k9.js → EligibilityInfo-CKTl_cdU.js} +2714 -4077
  14. package/dist/chunks/{LeaderboardWidget-BSGpHKTk.js → LeaderboardWidget-DyoiiNS6.js} +288 -349
  15. package/dist/chunks/PageBuilder-DHM3Il6f.js +150 -0
  16. package/dist/chunks/{Quest-uSIVq78I.js → Quest-Dqx4OCat.js} +1380 -726
  17. package/dist/chunks/TaskOnProvider-CxtFIs3n.js +2072 -0
  18. package/dist/chunks/{WidgetShell-NlOgn1x5.js → ThemeProvider-CulHkqqY.js} +1397 -103
  19. package/dist/chunks/UserCenterWidget-SE5hqpnZ.js +8335 -0
  20. package/dist/chunks/UserCenterWidget-XL6LZRZM.js +3259 -0
  21. package/dist/chunks/{Table-CWGf2FKV.js → WidgetShell-8xn-Jivw.js} +237 -27
  22. package/dist/chunks/communitytask-es-CBNnS4o2.js +521 -0
  23. package/dist/chunks/communitytask-ja-GRf9cbdx.js +521 -0
  24. package/dist/chunks/communitytask-ko-Bf24PQKI.js +521 -0
  25. package/dist/chunks/communitytask-ru-CZm2CPoV.js +521 -0
  26. package/dist/chunks/leaderboardwidget-es-vKjrjQaz.js +146 -0
  27. package/dist/chunks/leaderboardwidget-ja-Q6u0HxKG.js +146 -0
  28. package/dist/chunks/leaderboardwidget-ko-CG6SWgxf.js +146 -0
  29. package/dist/chunks/leaderboardwidget-ru-DCcHcJGz.js +146 -0
  30. package/dist/chunks/quest-es-Dyyy0zaw.js +863 -0
  31. package/dist/chunks/quest-ja-Depog33y.js +863 -0
  32. package/dist/chunks/quest-ko-BMu3uRQJ.js +863 -0
  33. package/dist/chunks/quest-ru-xne814Rw.js +863 -0
  34. package/dist/chunks/taskwidget-es-Do9b3Mqw.js +245 -0
  35. package/dist/chunks/taskwidget-ja-CqSu-yWA.js +245 -0
  36. package/dist/chunks/taskwidget-ko-EHgXFV4B.js +245 -0
  37. package/dist/chunks/taskwidget-ru-CMbLQDK4.js +245 -0
  38. package/dist/chunks/useIsMobile-D6Ybur-6.js +30 -0
  39. package/dist/chunks/usercenter-es-Dz3Wp2vV.js +512 -0
  40. package/dist/chunks/usercenter-ja-CKE4DJC6.js +512 -0
  41. package/dist/chunks/usercenter-ko-Dtpkn2qb.js +512 -0
  42. package/dist/chunks/usercenter-ru-DnBGee45.js +512 -0
  43. package/dist/community-task.d.ts +29 -388
  44. package/dist/community-task.js +2 -7
  45. package/dist/core.d.ts +95 -28
  46. package/dist/core.js +11 -12
  47. package/dist/index.d.ts +260 -602
  48. package/dist/index.js +28 -7361
  49. package/dist/leaderboard.d.ts +5 -496
  50. package/dist/leaderboard.js +2 -15
  51. package/dist/page-builder.d.ts +20 -0
  52. package/dist/page-builder.js +4 -0
  53. package/dist/quest.d.ts +20 -292
  54. package/dist/quest.js +2 -5
  55. package/dist/user-center.d.ts +56 -0
  56. package/dist/user-center.js +4 -0
  57. package/package.json +22 -3
  58. package/dist/Table.css +0 -389
  59. package/dist/chunks/TaskOnProvider-QMwxGL44.js +0 -1435
  60. package/dist/chunks/ThemeProvider-Cs8IUVQj.js +0 -1118
  61. package/dist/chunks/leaderboardwidget-ja-Bj6gz6y1.js +0 -119
  62. package/dist/chunks/leaderboardwidget-ko-f1cLO9ic.js +0 -119
  63. package/dist/chunks/useWidgetLocale-BVcopbZS.js +0 -74
  64. package/dist/chunks/usercenter-ja-DBj_dtuz.js +0 -329
  65. package/dist/chunks/usercenter-ko-DYTkHAld.js +0 -329
  66. 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
- };