@cookill/wallet-adapter 2.5.3 → 3.0.0
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 +178 -122
- package/dist/ErrorBoundary.cjs +45 -82
- package/dist/ErrorBoundary.cjs.map +1 -1
- package/dist/ErrorBoundary.d.cts +11 -7
- package/dist/ErrorBoundary.d.ts +11 -7
- package/dist/ErrorBoundary.js +45 -80
- package/dist/ErrorBoundary.js.map +1 -1
- package/dist/LoadingStates.cjs +124 -235
- package/dist/LoadingStates.cjs.map +1 -1
- package/dist/LoadingStates.d.cts +11 -15
- package/dist/LoadingStates.d.ts +11 -15
- package/dist/LoadingStates.js +125 -233
- package/dist/LoadingStates.js.map +1 -1
- package/dist/index.cjs +275 -115
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +111 -63
- package/dist/index.d.ts +111 -63
- package/dist/index.js +265 -111
- package/dist/index.js.map +1 -1
- package/dist/react.cjs +245 -1005
- package/dist/react.cjs.map +1 -1
- package/dist/react.d.cts +1 -118
- package/dist/react.d.ts +1 -118
- package/dist/react.js +243 -978
- package/dist/react.js.map +1 -1
- package/dist/standard.cjs +115 -81
- package/dist/standard.cjs.map +1 -1
- package/dist/standard.d.cts +6 -44
- package/dist/standard.d.ts +6 -44
- package/dist/standard.js +116 -81
- package/dist/standard.js.map +1 -1
- package/package.json +42 -35
package/dist/LoadingStates.d.cts
CHANGED
|
@@ -1,15 +1,22 @@
|
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
2
|
|
|
3
3
|
/**
|
|
4
|
-
* @cookill/wallet-adapter
|
|
5
|
-
* Loading
|
|
4
|
+
* @cookill/wallet-adapter/react v3.0.0
|
|
5
|
+
* Loading and status indicator components
|
|
6
6
|
*/
|
|
7
7
|
interface LoadingSpinnerProps {
|
|
8
8
|
size?: 'sm' | 'md' | 'lg';
|
|
9
9
|
color?: string;
|
|
10
10
|
className?: string;
|
|
11
11
|
}
|
|
12
|
-
declare function LoadingSpinner({ size, color, className }: LoadingSpinnerProps): react_jsx_runtime.JSX.Element;
|
|
12
|
+
declare function LoadingSpinner({ size, color, className, }: LoadingSpinnerProps): react_jsx_runtime.JSX.Element;
|
|
13
|
+
type ConnectionStatusType = 'idle' | 'connecting' | 'approving' | 'signing' | 'success' | 'error';
|
|
14
|
+
interface ConnectionStatusProps {
|
|
15
|
+
status: ConnectionStatusType;
|
|
16
|
+
message?: string;
|
|
17
|
+
onRetry?: () => void;
|
|
18
|
+
}
|
|
19
|
+
declare function ConnectionStatus({ status, message, onRetry }: ConnectionStatusProps): react_jsx_runtime.JSX.Element;
|
|
13
20
|
interface ApprovalPendingProps {
|
|
14
21
|
title?: string;
|
|
15
22
|
message?: string;
|
|
@@ -17,16 +24,5 @@ interface ApprovalPendingProps {
|
|
|
17
24
|
onCancel?: () => void;
|
|
18
25
|
}
|
|
19
26
|
declare function ApprovalPending({ title, message, walletName, onCancel, }: ApprovalPendingProps): react_jsx_runtime.JSX.Element;
|
|
20
|
-
interface ConnectionStatusProps {
|
|
21
|
-
status: 'connecting' | 'approving' | 'signing' | 'success' | 'error';
|
|
22
|
-
message?: string;
|
|
23
|
-
onRetry?: () => void;
|
|
24
|
-
}
|
|
25
|
-
declare function ConnectionStatus({ status, message, onRetry }: ConnectionStatusProps): react_jsx_runtime.JSX.Element;
|
|
26
|
-
declare const _default: {
|
|
27
|
-
LoadingSpinner: typeof LoadingSpinner;
|
|
28
|
-
ApprovalPending: typeof ApprovalPending;
|
|
29
|
-
ConnectionStatus: typeof ConnectionStatus;
|
|
30
|
-
};
|
|
31
27
|
|
|
32
|
-
export { ApprovalPending, ConnectionStatus, LoadingSpinner,
|
|
28
|
+
export { ApprovalPending, type ApprovalPendingProps, ConnectionStatus, type ConnectionStatusProps, type ConnectionStatusType, LoadingSpinner, type LoadingSpinnerProps };
|
package/dist/LoadingStates.d.ts
CHANGED
|
@@ -1,15 +1,22 @@
|
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
2
|
|
|
3
3
|
/**
|
|
4
|
-
* @cookill/wallet-adapter
|
|
5
|
-
* Loading
|
|
4
|
+
* @cookill/wallet-adapter/react v3.0.0
|
|
5
|
+
* Loading and status indicator components
|
|
6
6
|
*/
|
|
7
7
|
interface LoadingSpinnerProps {
|
|
8
8
|
size?: 'sm' | 'md' | 'lg';
|
|
9
9
|
color?: string;
|
|
10
10
|
className?: string;
|
|
11
11
|
}
|
|
12
|
-
declare function LoadingSpinner({ size, color, className }: LoadingSpinnerProps): react_jsx_runtime.JSX.Element;
|
|
12
|
+
declare function LoadingSpinner({ size, color, className, }: LoadingSpinnerProps): react_jsx_runtime.JSX.Element;
|
|
13
|
+
type ConnectionStatusType = 'idle' | 'connecting' | 'approving' | 'signing' | 'success' | 'error';
|
|
14
|
+
interface ConnectionStatusProps {
|
|
15
|
+
status: ConnectionStatusType;
|
|
16
|
+
message?: string;
|
|
17
|
+
onRetry?: () => void;
|
|
18
|
+
}
|
|
19
|
+
declare function ConnectionStatus({ status, message, onRetry }: ConnectionStatusProps): react_jsx_runtime.JSX.Element;
|
|
13
20
|
interface ApprovalPendingProps {
|
|
14
21
|
title?: string;
|
|
15
22
|
message?: string;
|
|
@@ -17,16 +24,5 @@ interface ApprovalPendingProps {
|
|
|
17
24
|
onCancel?: () => void;
|
|
18
25
|
}
|
|
19
26
|
declare function ApprovalPending({ title, message, walletName, onCancel, }: ApprovalPendingProps): react_jsx_runtime.JSX.Element;
|
|
20
|
-
interface ConnectionStatusProps {
|
|
21
|
-
status: 'connecting' | 'approving' | 'signing' | 'success' | 'error';
|
|
22
|
-
message?: string;
|
|
23
|
-
onRetry?: () => void;
|
|
24
|
-
}
|
|
25
|
-
declare function ConnectionStatus({ status, message, onRetry }: ConnectionStatusProps): react_jsx_runtime.JSX.Element;
|
|
26
|
-
declare const _default: {
|
|
27
|
-
LoadingSpinner: typeof LoadingSpinner;
|
|
28
|
-
ApprovalPending: typeof ApprovalPending;
|
|
29
|
-
ConnectionStatus: typeof ConnectionStatus;
|
|
30
|
-
};
|
|
31
27
|
|
|
32
|
-
export { ApprovalPending, ConnectionStatus, LoadingSpinner,
|
|
28
|
+
export { ApprovalPending, type ApprovalPendingProps, ConnectionStatus, type ConnectionStatusProps, type ConnectionStatusType, LoadingSpinner, type LoadingSpinnerProps };
|
package/dist/LoadingStates.js
CHANGED
|
@@ -1,262 +1,154 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
const { container, stroke } = sizes[size];
|
|
11
|
-
const radius = (container - stroke) / 2;
|
|
12
|
-
const circumference = radius * 2 * Math.PI;
|
|
3
|
+
function LoadingSpinner({
|
|
4
|
+
size = "md",
|
|
5
|
+
color = "#6EB9A8",
|
|
6
|
+
className
|
|
7
|
+
}) {
|
|
8
|
+
const sizeMap = { sm: 16, md: 24, lg: 32 };
|
|
9
|
+
const px = sizeMap[size];
|
|
13
10
|
return /* @__PURE__ */ jsxs(
|
|
14
11
|
"svg",
|
|
15
12
|
{
|
|
16
|
-
width: container,
|
|
17
|
-
height: container,
|
|
18
|
-
viewBox: `0 0 ${container} ${container}`,
|
|
19
13
|
className,
|
|
20
|
-
|
|
14
|
+
width: px,
|
|
15
|
+
height: px,
|
|
16
|
+
viewBox: "0 0 24 24",
|
|
17
|
+
fill: "none",
|
|
18
|
+
style: { animation: "spin 1s linear infinite" },
|
|
21
19
|
children: [
|
|
22
|
-
/* @__PURE__ */ jsx("style", { children: `
|
|
23
|
-
@keyframes wallet-spin {
|
|
24
|
-
from { transform: rotate(0deg); }
|
|
25
|
-
to { transform: rotate(360deg); }
|
|
26
|
-
}
|
|
27
|
-
` }),
|
|
20
|
+
/* @__PURE__ */ jsx("style", { children: `@keyframes spin { to { transform: rotate(360deg); } }` }),
|
|
28
21
|
/* @__PURE__ */ jsx(
|
|
29
22
|
"circle",
|
|
30
23
|
{
|
|
31
|
-
cx:
|
|
32
|
-
cy:
|
|
33
|
-
r:
|
|
34
|
-
fill: "none",
|
|
24
|
+
cx: "12",
|
|
25
|
+
cy: "12",
|
|
26
|
+
r: "10",
|
|
35
27
|
stroke: color,
|
|
36
|
-
strokeWidth:
|
|
37
|
-
strokeOpacity: 0.2
|
|
38
|
-
}
|
|
39
|
-
),
|
|
40
|
-
/* @__PURE__ */ jsx(
|
|
41
|
-
"circle",
|
|
42
|
-
{
|
|
43
|
-
cx: container / 2,
|
|
44
|
-
cy: container / 2,
|
|
45
|
-
r: radius,
|
|
28
|
+
strokeWidth: "2.5",
|
|
46
29
|
fill: "none",
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
strokeLinecap: "round",
|
|
50
|
-
strokeDasharray: circumference,
|
|
51
|
-
strokeDashoffset: circumference * 0.75
|
|
30
|
+
strokeDasharray: "50 20",
|
|
31
|
+
strokeLinecap: "round"
|
|
52
32
|
}
|
|
53
33
|
)
|
|
54
34
|
]
|
|
55
35
|
}
|
|
56
36
|
);
|
|
57
37
|
}
|
|
38
|
+
function ConnectionStatus({ status, message, onRetry }) {
|
|
39
|
+
const configs = {
|
|
40
|
+
idle: { color: "#64748b", label: "Ready" },
|
|
41
|
+
connecting: { color: "#6EB9A8", label: "Connecting..." },
|
|
42
|
+
approving: { color: "#f59e0b", label: "Waiting for approval..." },
|
|
43
|
+
signing: { color: "#6EB9A8", label: "Signing..." },
|
|
44
|
+
success: { color: "#22c55e", label: "Connected" },
|
|
45
|
+
error: { color: "#ef4444", label: "Error" }
|
|
46
|
+
};
|
|
47
|
+
const config = configs[status];
|
|
48
|
+
return /* @__PURE__ */ jsxs("div", { style: {
|
|
49
|
+
display: "flex",
|
|
50
|
+
alignItems: "center",
|
|
51
|
+
gap: "12px",
|
|
52
|
+
padding: "12px 16px",
|
|
53
|
+
backgroundColor: `${config.color}15`,
|
|
54
|
+
borderRadius: "10px",
|
|
55
|
+
border: `1px solid ${config.color}30`
|
|
56
|
+
}, children: [
|
|
57
|
+
(status === "connecting" || status === "approving" || status === "signing") && /* @__PURE__ */ jsx(LoadingSpinner, { size: "sm", color: config.color }),
|
|
58
|
+
/* @__PURE__ */ jsxs("div", { style: { flex: 1 }, children: [
|
|
59
|
+
/* @__PURE__ */ jsx("div", { style: { color: config.color, fontWeight: 500, fontSize: "14px" }, children: config.label }),
|
|
60
|
+
message && /* @__PURE__ */ jsx("div", { style: { color: "#94a3b8", fontSize: "12px", marginTop: "2px" }, children: message })
|
|
61
|
+
] }),
|
|
62
|
+
status === "error" && onRetry && /* @__PURE__ */ jsx(
|
|
63
|
+
"button",
|
|
64
|
+
{
|
|
65
|
+
onClick: onRetry,
|
|
66
|
+
style: {
|
|
67
|
+
padding: "6px 12px",
|
|
68
|
+
backgroundColor: config.color,
|
|
69
|
+
color: "#ffffff",
|
|
70
|
+
border: "none",
|
|
71
|
+
borderRadius: "6px",
|
|
72
|
+
cursor: "pointer",
|
|
73
|
+
fontSize: "12px",
|
|
74
|
+
fontWeight: 500
|
|
75
|
+
},
|
|
76
|
+
children: "Retry"
|
|
77
|
+
}
|
|
78
|
+
)
|
|
79
|
+
] });
|
|
80
|
+
}
|
|
58
81
|
function ApprovalPending({
|
|
59
82
|
title = "Waiting for Approval",
|
|
60
83
|
message = "Please approve the request in your wallet",
|
|
61
84
|
walletName = "Sheep Wallet",
|
|
62
85
|
onCancel
|
|
63
86
|
}) {
|
|
64
|
-
return /* @__PURE__ */ jsxs(
|
|
65
|
-
"
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
backgroundColor: "#011B29",
|
|
84
|
-
display: "flex",
|
|
85
|
-
alignItems: "center",
|
|
86
|
-
justifyContent: "center",
|
|
87
|
-
position: "relative"
|
|
88
|
-
},
|
|
89
|
-
children: [
|
|
90
|
-
/* @__PURE__ */ jsx(LoadingSpinner, { size: "lg" }),
|
|
91
|
-
/* @__PURE__ */ jsx(
|
|
92
|
-
"div",
|
|
93
|
-
{
|
|
94
|
-
style: {
|
|
95
|
-
position: "absolute",
|
|
96
|
-
inset: "-4px",
|
|
97
|
-
borderRadius: "50%",
|
|
98
|
-
border: "2px solid transparent",
|
|
99
|
-
borderTopColor: "#6EB9A8",
|
|
100
|
-
animation: "wallet-spin 2s linear infinite"
|
|
101
|
-
}
|
|
102
|
-
}
|
|
103
|
-
)
|
|
104
|
-
]
|
|
105
|
-
}
|
|
106
|
-
),
|
|
107
|
-
/* @__PURE__ */ jsx(
|
|
108
|
-
"h3",
|
|
109
|
-
{
|
|
110
|
-
style: {
|
|
111
|
-
margin: "0 0 8px",
|
|
112
|
-
fontSize: "18px",
|
|
113
|
-
fontWeight: 600,
|
|
114
|
-
color: "#0f172a"
|
|
115
|
-
},
|
|
116
|
-
children: title
|
|
117
|
-
}
|
|
118
|
-
),
|
|
119
|
-
/* @__PURE__ */ jsx(
|
|
120
|
-
"p",
|
|
121
|
-
{
|
|
122
|
-
style: {
|
|
123
|
-
margin: "0 0 8px",
|
|
124
|
-
fontSize: "14px",
|
|
125
|
-
color: "#64748b"
|
|
126
|
-
},
|
|
127
|
-
children: message
|
|
128
|
-
}
|
|
129
|
-
),
|
|
130
|
-
/* @__PURE__ */ jsxs(
|
|
131
|
-
"p",
|
|
132
|
-
{
|
|
133
|
-
style: {
|
|
134
|
-
margin: "0 0 24px",
|
|
135
|
-
fontSize: "12px",
|
|
136
|
-
color: "#94a3b8"
|
|
137
|
-
},
|
|
138
|
-
children: [
|
|
139
|
-
"Open ",
|
|
140
|
-
walletName,
|
|
141
|
-
" extension to continue"
|
|
142
|
-
]
|
|
143
|
-
}
|
|
144
|
-
),
|
|
145
|
-
onCancel && /* @__PURE__ */ jsx(
|
|
146
|
-
"button",
|
|
147
|
-
{
|
|
148
|
-
onClick: onCancel,
|
|
149
|
-
style: {
|
|
150
|
-
padding: "10px 24px",
|
|
151
|
-
borderRadius: "10px",
|
|
152
|
-
border: "1px solid #e2e8f0",
|
|
153
|
-
backgroundColor: "white",
|
|
154
|
-
color: "#64748b",
|
|
155
|
-
cursor: "pointer",
|
|
156
|
-
fontSize: "14px",
|
|
157
|
-
fontWeight: 500,
|
|
158
|
-
transition: "all 0.2s ease"
|
|
159
|
-
},
|
|
160
|
-
onMouseEnter: (e) => {
|
|
161
|
-
e.currentTarget.style.backgroundColor = "#f1f5f9";
|
|
162
|
-
e.currentTarget.style.borderColor = "#cbd5e1";
|
|
163
|
-
},
|
|
164
|
-
onMouseLeave: (e) => {
|
|
165
|
-
e.currentTarget.style.backgroundColor = "white";
|
|
166
|
-
e.currentTarget.style.borderColor = "#e2e8f0";
|
|
167
|
-
},
|
|
168
|
-
children: "Cancel"
|
|
169
|
-
}
|
|
170
|
-
)
|
|
171
|
-
]
|
|
172
|
-
}
|
|
173
|
-
);
|
|
174
|
-
}
|
|
175
|
-
function ConnectionStatus({ status, message, onRetry }) {
|
|
176
|
-
const statusConfig = {
|
|
177
|
-
connecting: {
|
|
178
|
-
title: "Connecting",
|
|
179
|
-
defaultMessage: "Establishing connection to wallet...",
|
|
180
|
-
color: "#6EB9A8"
|
|
181
|
-
},
|
|
182
|
-
approving: {
|
|
183
|
-
title: "Approval Required",
|
|
184
|
-
defaultMessage: "Please approve the connection in Sheep Wallet",
|
|
185
|
-
color: "#f59e0b"
|
|
186
|
-
},
|
|
187
|
-
signing: {
|
|
188
|
-
title: "Signature Required",
|
|
189
|
-
defaultMessage: "Please sign the transaction in your wallet",
|
|
190
|
-
color: "#6EB9A8"
|
|
191
|
-
},
|
|
192
|
-
success: {
|
|
193
|
-
title: "Connected",
|
|
194
|
-
defaultMessage: "Successfully connected to wallet",
|
|
195
|
-
color: "#22c55e"
|
|
196
|
-
},
|
|
197
|
-
error: {
|
|
198
|
-
title: "Connection Failed",
|
|
199
|
-
defaultMessage: "Unable to connect. Please try again.",
|
|
200
|
-
color: "#ef4444"
|
|
201
|
-
}
|
|
202
|
-
};
|
|
203
|
-
const config = statusConfig[status];
|
|
204
|
-
return /* @__PURE__ */ jsxs(
|
|
205
|
-
"div",
|
|
206
|
-
{
|
|
207
|
-
style: {
|
|
208
|
-
padding: "20px",
|
|
209
|
-
borderRadius: "12px",
|
|
210
|
-
backgroundColor: `${config.color}10`,
|
|
211
|
-
border: `1px solid ${config.color}30`,
|
|
212
|
-
textAlign: "center"
|
|
213
|
-
},
|
|
214
|
-
children: [
|
|
215
|
-
/* @__PURE__ */ jsx(
|
|
216
|
-
"div",
|
|
217
|
-
{
|
|
218
|
-
style: {
|
|
219
|
-
width: "48px",
|
|
220
|
-
height: "48px",
|
|
221
|
-
margin: "0 auto 12px",
|
|
222
|
-
borderRadius: "50%",
|
|
223
|
-
backgroundColor: `${config.color}20`,
|
|
224
|
-
display: "flex",
|
|
225
|
-
alignItems: "center",
|
|
226
|
-
justifyContent: "center"
|
|
227
|
-
},
|
|
228
|
-
children: status === "success" ? /* @__PURE__ */ jsx("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: config.color, strokeWidth: "2", children: /* @__PURE__ */ jsx("polyline", { points: "20,6 9,17 4,12" }) }) : status === "error" ? /* @__PURE__ */ jsxs("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: config.color, strokeWidth: "2", children: [
|
|
229
|
-
/* @__PURE__ */ jsx("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
|
|
230
|
-
/* @__PURE__ */ jsx("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
|
|
231
|
-
] }) : /* @__PURE__ */ jsx(LoadingSpinner, { size: "sm", color: config.color })
|
|
232
|
-
}
|
|
233
|
-
),
|
|
234
|
-
/* @__PURE__ */ jsx("h4", { style: { margin: "0 0 4px", fontSize: "14px", fontWeight: 600, color: config.color }, children: config.title }),
|
|
235
|
-
/* @__PURE__ */ jsx("p", { style: { margin: 0, fontSize: "12px", color: "#64748b" }, children: message || config.defaultMessage }),
|
|
236
|
-
status === "error" && onRetry && /* @__PURE__ */ jsx(
|
|
237
|
-
"button",
|
|
238
|
-
{
|
|
239
|
-
onClick: onRetry,
|
|
240
|
-
style: {
|
|
241
|
-
marginTop: "12px",
|
|
242
|
-
padding: "6px 16px",
|
|
243
|
-
borderRadius: "6px",
|
|
244
|
-
border: "none",
|
|
245
|
-
backgroundColor: config.color,
|
|
246
|
-
color: "white",
|
|
247
|
-
cursor: "pointer",
|
|
248
|
-
fontSize: "12px",
|
|
249
|
-
fontWeight: 500
|
|
250
|
-
},
|
|
251
|
-
children: "Retry"
|
|
87
|
+
return /* @__PURE__ */ jsxs("div", { style: {
|
|
88
|
+
textAlign: "center",
|
|
89
|
+
padding: "32px 24px"
|
|
90
|
+
}, children: [
|
|
91
|
+
/* @__PURE__ */ jsxs("div", { style: {
|
|
92
|
+
width: "64px",
|
|
93
|
+
height: "64px",
|
|
94
|
+
margin: "0 auto 20px",
|
|
95
|
+
borderRadius: "16px",
|
|
96
|
+
backgroundColor: "#6EB9A815",
|
|
97
|
+
display: "flex",
|
|
98
|
+
alignItems: "center",
|
|
99
|
+
justifyContent: "center",
|
|
100
|
+
animation: "pulse 2s ease-in-out infinite"
|
|
101
|
+
}, children: [
|
|
102
|
+
/* @__PURE__ */ jsx("style", { children: `
|
|
103
|
+
@keyframes pulse {
|
|
104
|
+
0%, 100% { transform: scale(1); opacity: 1; }
|
|
105
|
+
50% { transform: scale(1.05); opacity: 0.8; }
|
|
252
106
|
}
|
|
253
|
-
)
|
|
254
|
-
|
|
255
|
-
}
|
|
256
|
-
|
|
107
|
+
` }),
|
|
108
|
+
/* @__PURE__ */ jsx(LoadingSpinner, { size: "lg" })
|
|
109
|
+
] }),
|
|
110
|
+
/* @__PURE__ */ jsx("h3", { style: {
|
|
111
|
+
color: "#ffffff",
|
|
112
|
+
margin: "0 0 8px 0",
|
|
113
|
+
fontSize: "18px",
|
|
114
|
+
fontWeight: 600
|
|
115
|
+
}, children: title }),
|
|
116
|
+
/* @__PURE__ */ jsx("p", { style: {
|
|
117
|
+
color: "#94a3b8",
|
|
118
|
+
margin: "0 0 24px 0",
|
|
119
|
+
fontSize: "14px"
|
|
120
|
+
}, children: message }),
|
|
121
|
+
/* @__PURE__ */ jsxs("div", { style: {
|
|
122
|
+
padding: "12px 16px",
|
|
123
|
+
backgroundColor: "#1a3a4d",
|
|
124
|
+
borderRadius: "10px",
|
|
125
|
+
color: "#6EB9A8",
|
|
126
|
+
fontSize: "13px",
|
|
127
|
+
marginBottom: "20px"
|
|
128
|
+
}, children: [
|
|
129
|
+
"Check ",
|
|
130
|
+
walletName,
|
|
131
|
+
" extension"
|
|
132
|
+
] }),
|
|
133
|
+
onCancel && /* @__PURE__ */ jsx(
|
|
134
|
+
"button",
|
|
135
|
+
{
|
|
136
|
+
onClick: onCancel,
|
|
137
|
+
style: {
|
|
138
|
+
padding: "10px 24px",
|
|
139
|
+
backgroundColor: "transparent",
|
|
140
|
+
border: "1px solid #374151",
|
|
141
|
+
borderRadius: "8px",
|
|
142
|
+
color: "#9ca3af",
|
|
143
|
+
cursor: "pointer",
|
|
144
|
+
fontSize: "14px"
|
|
145
|
+
},
|
|
146
|
+
children: "Cancel"
|
|
147
|
+
}
|
|
148
|
+
)
|
|
149
|
+
] });
|
|
257
150
|
}
|
|
258
|
-
var LoadingStates_default = { LoadingSpinner, ApprovalPending, ConnectionStatus };
|
|
259
151
|
|
|
260
|
-
export { ApprovalPending, ConnectionStatus, LoadingSpinner
|
|
152
|
+
export { ApprovalPending, ConnectionStatus, LoadingSpinner };
|
|
261
153
|
//# sourceMappingURL=LoadingStates.js.map
|
|
262
154
|
//# sourceMappingURL=LoadingStates.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/LoadingStates.tsx"],"names":[],"mappings":"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","file":"LoadingStates.js","sourcesContent":["/**\n * @cookill/wallet-adapter - Loading States\n * Loading spinners and approval pending states for dApps\n */\n\nimport React from 'react';\n\ninterface LoadingSpinnerProps {\n size?: 'sm' | 'md' | 'lg';\n color?: string;\n className?: string;\n}\n\nexport function LoadingSpinner({ size = 'md', color = '#6EB9A8', className = '' }: LoadingSpinnerProps) {\n const sizes = {\n sm: { container: 20, stroke: 2 },\n md: { container: 32, stroke: 3 },\n lg: { container: 48, stroke: 4 },\n };\n\n const { container, stroke } = sizes[size];\n const radius = (container - stroke) / 2;\n const circumference = radius * 2 * Math.PI;\n\n return (\n <svg\n width={container}\n height={container}\n viewBox={`0 0 ${container} ${container}`}\n className={className}\n style={{ animation: 'wallet-spin 1s linear infinite' }}\n >\n <style>\n {`\n @keyframes wallet-spin {\n from { transform: rotate(0deg); }\n to { transform: rotate(360deg); }\n }\n `}\n </style>\n <circle\n cx={container / 2}\n cy={container / 2}\n r={radius}\n fill=\"none\"\n stroke={color}\n strokeWidth={stroke}\n strokeOpacity={0.2}\n />\n <circle\n cx={container / 2}\n cy={container / 2}\n r={radius}\n fill=\"none\"\n stroke={color}\n strokeWidth={stroke}\n strokeLinecap=\"round\"\n strokeDasharray={circumference}\n strokeDashoffset={circumference * 0.75}\n />\n </svg>\n );\n}\n\ninterface ApprovalPendingProps {\n title?: string;\n message?: string;\n walletName?: string;\n onCancel?: () => void;\n}\n\nexport function ApprovalPending({\n title = 'Waiting for Approval',\n message = 'Please approve the request in your wallet',\n walletName = 'Sheep Wallet',\n onCancel,\n}: ApprovalPendingProps) {\n return (\n <div\n style={{\n padding: '32px 24px',\n textAlign: 'center',\n backgroundColor: '#f8fafc',\n borderRadius: '16px',\n border: '1px solid #e2e8f0',\n }}\n >\n <div\n style={{\n width: '80px',\n height: '80px',\n margin: '0 auto 20px',\n borderRadius: '50%',\n backgroundColor: '#011B29',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n position: 'relative',\n }}\n >\n <LoadingSpinner size=\"lg\" />\n <div\n style={{\n position: 'absolute',\n inset: '-4px',\n borderRadius: '50%',\n border: '2px solid transparent',\n borderTopColor: '#6EB9A8',\n animation: 'wallet-spin 2s linear infinite',\n }}\n />\n </div>\n\n <h3\n style={{\n margin: '0 0 8px',\n fontSize: '18px',\n fontWeight: 600,\n color: '#0f172a',\n }}\n >\n {title}\n </h3>\n\n <p\n style={{\n margin: '0 0 8px',\n fontSize: '14px',\n color: '#64748b',\n }}\n >\n {message}\n </p>\n\n <p\n style={{\n margin: '0 0 24px',\n fontSize: '12px',\n color: '#94a3b8',\n }}\n >\n Open {walletName} extension to continue\n </p>\n\n {onCancel && (\n <button\n onClick={onCancel}\n style={{\n padding: '10px 24px',\n borderRadius: '10px',\n border: '1px solid #e2e8f0',\n backgroundColor: 'white',\n color: '#64748b',\n cursor: 'pointer',\n fontSize: '14px',\n fontWeight: 500,\n transition: 'all 0.2s ease',\n }}\n onMouseEnter={(e) => {\n e.currentTarget.style.backgroundColor = '#f1f5f9';\n e.currentTarget.style.borderColor = '#cbd5e1';\n }}\n onMouseLeave={(e) => {\n e.currentTarget.style.backgroundColor = 'white';\n e.currentTarget.style.borderColor = '#e2e8f0';\n }}\n >\n Cancel\n </button>\n )}\n </div>\n );\n}\n\ninterface ConnectionStatusProps {\n status: 'connecting' | 'approving' | 'signing' | 'success' | 'error';\n message?: string;\n onRetry?: () => void;\n}\n\nexport function ConnectionStatus({ status, message, onRetry }: ConnectionStatusProps) {\n const statusConfig = {\n connecting: {\n title: 'Connecting',\n defaultMessage: 'Establishing connection to wallet...',\n color: '#6EB9A8',\n },\n approving: {\n title: 'Approval Required',\n defaultMessage: 'Please approve the connection in Sheep Wallet',\n color: '#f59e0b',\n },\n signing: {\n title: 'Signature Required',\n defaultMessage: 'Please sign the transaction in your wallet',\n color: '#6EB9A8',\n },\n success: {\n title: 'Connected',\n defaultMessage: 'Successfully connected to wallet',\n color: '#22c55e',\n },\n error: {\n title: 'Connection Failed',\n defaultMessage: 'Unable to connect. Please try again.',\n color: '#ef4444',\n },\n };\n\n const config = statusConfig[status];\n\n return (\n <div\n style={{\n padding: '20px',\n borderRadius: '12px',\n backgroundColor: `${config.color}10`,\n border: `1px solid ${config.color}30`,\n textAlign: 'center',\n }}\n >\n <div\n style={{\n width: '48px',\n height: '48px',\n margin: '0 auto 12px',\n borderRadius: '50%',\n backgroundColor: `${config.color}20`,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n }}\n >\n {status === 'success' ? (\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke={config.color} strokeWidth=\"2\">\n <polyline points=\"20,6 9,17 4,12\" />\n </svg>\n ) : status === 'error' ? (\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke={config.color} strokeWidth=\"2\">\n <line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\" />\n <line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\" />\n </svg>\n ) : (\n <LoadingSpinner size=\"sm\" color={config.color} />\n )}\n </div>\n\n <h4 style={{ margin: '0 0 4px', fontSize: '14px', fontWeight: 600, color: config.color }}>\n {config.title}\n </h4>\n\n <p style={{ margin: 0, fontSize: '12px', color: '#64748b' }}>\n {message || config.defaultMessage}\n </p>\n\n {status === 'error' && onRetry && (\n <button\n onClick={onRetry}\n style={{\n marginTop: '12px',\n padding: '6px 16px',\n borderRadius: '6px',\n border: 'none',\n backgroundColor: config.color,\n color: 'white',\n cursor: 'pointer',\n fontSize: '12px',\n fontWeight: 500,\n }}\n >\n Retry\n </button>\n )}\n </div>\n );\n}\n\nexport default { LoadingSpinner, ApprovalPending, ConnectionStatus };\n"]}
|
|
1
|
+
{"version":3,"sources":["../src/react/LoadingStates.tsx"],"names":[],"mappings":"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","file":"LoadingStates.js","sourcesContent":["/**\n * @cookill/wallet-adapter/react v3.0.0\n * Loading and status indicator components\n */\n\nimport React from 'react';\n\n// ============================================================================\n// LoadingSpinner\n// ============================================================================\n\nexport interface LoadingSpinnerProps {\n size?: 'sm' | 'md' | 'lg';\n color?: string;\n className?: string;\n}\n\nexport function LoadingSpinner({ \n size = 'md', \n color = '#6EB9A8',\n className,\n}: LoadingSpinnerProps) {\n const sizeMap = { sm: 16, md: 24, lg: 32 };\n const px = sizeMap[size];\n\n return (\n <svg\n className={className}\n width={px}\n height={px}\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n style={{ animation: 'spin 1s linear infinite' }}\n >\n <style>{`@keyframes spin { to { transform: rotate(360deg); } }`}</style>\n <circle\n cx=\"12\"\n cy=\"12\"\n r=\"10\"\n stroke={color}\n strokeWidth=\"2.5\"\n fill=\"none\"\n strokeDasharray=\"50 20\"\n strokeLinecap=\"round\"\n />\n </svg>\n );\n}\n\n// ============================================================================\n// ConnectionStatus\n// ============================================================================\n\nexport type ConnectionStatusType = \n | 'idle' \n | 'connecting' \n | 'approving' \n | 'signing' \n | 'success' \n | 'error';\n\nexport interface ConnectionStatusProps {\n status: ConnectionStatusType;\n message?: string;\n onRetry?: () => void;\n}\n\nexport function ConnectionStatus({ status, message, onRetry }: ConnectionStatusProps) {\n const configs: Record<ConnectionStatusType, { color: string; label: string }> = {\n idle: { color: '#64748b', label: 'Ready' },\n connecting: { color: '#6EB9A8', label: 'Connecting...' },\n approving: { color: '#f59e0b', label: 'Waiting for approval...' },\n signing: { color: '#6EB9A8', label: 'Signing...' },\n success: { color: '#22c55e', label: 'Connected' },\n error: { color: '#ef4444', label: 'Error' },\n };\n\n const config = configs[status];\n\n return (\n <div style={{\n display: 'flex',\n alignItems: 'center',\n gap: '12px',\n padding: '12px 16px',\n backgroundColor: `${config.color}15`,\n borderRadius: '10px',\n border: `1px solid ${config.color}30`,\n }}>\n {(status === 'connecting' || status === 'approving' || status === 'signing') && (\n <LoadingSpinner size=\"sm\" color={config.color} />\n )}\n \n <div style={{ flex: 1 }}>\n <div style={{ color: config.color, fontWeight: 500, fontSize: '14px' }}>\n {config.label}\n </div>\n {message && (\n <div style={{ color: '#94a3b8', fontSize: '12px', marginTop: '2px' }}>\n {message}\n </div>\n )}\n </div>\n\n {status === 'error' && onRetry && (\n <button\n onClick={onRetry}\n style={{\n padding: '6px 12px',\n backgroundColor: config.color,\n color: '#ffffff',\n border: 'none',\n borderRadius: '6px',\n cursor: 'pointer',\n fontSize: '12px',\n fontWeight: 500,\n }}\n >\n Retry\n </button>\n )}\n </div>\n );\n}\n\n// ============================================================================\n// ApprovalPending\n// ============================================================================\n\nexport interface ApprovalPendingProps {\n title?: string;\n message?: string;\n walletName?: string;\n onCancel?: () => void;\n}\n\nexport function ApprovalPending({\n title = 'Waiting for Approval',\n message = 'Please approve the request in your wallet',\n walletName = 'Sheep Wallet',\n onCancel,\n}: ApprovalPendingProps) {\n return (\n <div style={{\n textAlign: 'center',\n padding: '32px 24px',\n }}>\n {/* Animated wallet icon */}\n <div style={{\n width: '64px',\n height: '64px',\n margin: '0 auto 20px',\n borderRadius: '16px',\n backgroundColor: '#6EB9A815',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n animation: 'pulse 2s ease-in-out infinite',\n }}>\n <style>{`\n @keyframes pulse {\n 0%, 100% { transform: scale(1); opacity: 1; }\n 50% { transform: scale(1.05); opacity: 0.8; }\n }\n `}</style>\n <LoadingSpinner size=\"lg\" />\n </div>\n\n <h3 style={{ \n color: '#ffffff', \n margin: '0 0 8px 0',\n fontSize: '18px',\n fontWeight: 600,\n }}>\n {title}\n </h3>\n \n <p style={{ \n color: '#94a3b8', \n margin: '0 0 24px 0',\n fontSize: '14px',\n }}>\n {message}\n </p>\n\n <div style={{\n padding: '12px 16px',\n backgroundColor: '#1a3a4d',\n borderRadius: '10px',\n color: '#6EB9A8',\n fontSize: '13px',\n marginBottom: '20px',\n }}>\n Check {walletName} extension\n </div>\n\n {onCancel && (\n <button\n onClick={onCancel}\n style={{\n padding: '10px 24px',\n backgroundColor: 'transparent',\n border: '1px solid #374151',\n borderRadius: '8px',\n color: '#9ca3af',\n cursor: 'pointer',\n fontSize: '14px',\n }}\n >\n Cancel\n </button>\n )}\n </div>\n );\n}\n"]}
|