@varity-labs/ui-kit 2.0.0-beta.6 → 2.0.0-beta.7
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 +15 -17
- package/package.json +20 -21
package/README.md
CHANGED
|
@@ -16,13 +16,13 @@ Peer dependencies: `react` and `react-dom` 18+.
|
|
|
16
16
|
## Quick Start
|
|
17
17
|
|
|
18
18
|
```tsx
|
|
19
|
-
import {
|
|
19
|
+
import { AuthProvider } from '@varity-labs/ui-kit'
|
|
20
20
|
|
|
21
21
|
function App() {
|
|
22
22
|
return (
|
|
23
|
-
<
|
|
23
|
+
<AuthProvider>
|
|
24
24
|
<YourApp />
|
|
25
|
-
</
|
|
25
|
+
</AuthProvider>
|
|
26
26
|
)
|
|
27
27
|
}
|
|
28
28
|
```
|
|
@@ -110,14 +110,14 @@ Authentication, theming, and providers are all configured automatically with zer
|
|
|
110
110
|
Built-in authentication -- email, Google, and social login with zero configuration:
|
|
111
111
|
|
|
112
112
|
```tsx
|
|
113
|
-
import {
|
|
113
|
+
import { AuthProvider, LoginButton } from '@varity-labs/ui-kit'
|
|
114
114
|
import { useAuth } from '@varity-labs/ui-kit'
|
|
115
115
|
|
|
116
116
|
function App() {
|
|
117
117
|
return (
|
|
118
|
-
<
|
|
118
|
+
<AuthProvider>
|
|
119
119
|
<Dashboard />
|
|
120
|
-
</
|
|
120
|
+
</AuthProvider>
|
|
121
121
|
)
|
|
122
122
|
}
|
|
123
123
|
|
|
@@ -141,10 +141,10 @@ function Dashboard() {
|
|
|
141
141
|
|
|
142
142
|
| Component | Description |
|
|
143
143
|
|-----------|-------------|
|
|
144
|
-
| `
|
|
145
|
-
| `
|
|
146
|
-
| `
|
|
147
|
-
| `
|
|
144
|
+
| `LoginButton` | Drop-in login button |
|
|
145
|
+
| `UserProfile` | User profile display |
|
|
146
|
+
| `ProtectedRoute` | Route protection wrapper |
|
|
147
|
+
| `ReadyGate` | Loading gate during initialization |
|
|
148
148
|
|
|
149
149
|
### Auth Hooks
|
|
150
150
|
|
|
@@ -166,7 +166,7 @@ import { PaymentWidget, PaymentGate, useVarityPayment } from '@varity-labs/ui-ki
|
|
|
166
166
|
// Wrap a trigger element -- opens checkout on click
|
|
167
167
|
// appId is a number (from Varity App Registry)
|
|
168
168
|
// price is in cents (e.g., 9900 = $99.00)
|
|
169
|
-
<PaymentWidget appId={123} price={9900} onSuccess={(
|
|
169
|
+
<PaymentWidget appId={123} price={9900} onSuccess={(receipt) => console.log('Paid!', receipt)}>
|
|
170
170
|
<button>Buy Premium - $99</button>
|
|
171
171
|
</PaymentWidget>
|
|
172
172
|
|
|
@@ -206,7 +206,7 @@ function ThemeToggle() {
|
|
|
206
206
|
|
|
207
207
|
```tsx
|
|
208
208
|
import {
|
|
209
|
-
|
|
209
|
+
AuthProvider,
|
|
210
210
|
DashboardLayout,
|
|
211
211
|
DashboardHeader,
|
|
212
212
|
DashboardSidebar,
|
|
@@ -219,7 +219,7 @@ import {
|
|
|
219
219
|
|
|
220
220
|
function App() {
|
|
221
221
|
return (
|
|
222
|
-
<
|
|
222
|
+
<AuthProvider>
|
|
223
223
|
<ToastProvider>
|
|
224
224
|
<DashboardLayout>
|
|
225
225
|
<DashboardSidebar items={sidebarItems} />
|
|
@@ -231,7 +231,7 @@ function App() {
|
|
|
231
231
|
</main>
|
|
232
232
|
</DashboardLayout>
|
|
233
233
|
</ToastProvider>
|
|
234
|
-
</
|
|
234
|
+
</AuthProvider>
|
|
235
235
|
)
|
|
236
236
|
}
|
|
237
237
|
```
|
|
@@ -240,9 +240,7 @@ function App() {
|
|
|
240
240
|
|
|
241
241
|
| Provider | Description |
|
|
242
242
|
|----------|-------------|
|
|
243
|
-
| `
|
|
244
|
-
| `VarityPrivyProvider` | Auth provider (lower-level) |
|
|
245
|
-
| `ZeroDevProvider` | Gas sponsorship provider (automatic in PrivyStack) |
|
|
243
|
+
| `AuthProvider` | All-in-one provider (auth + theme + query client) |
|
|
246
244
|
| `ThemeProvider` | Theme management |
|
|
247
245
|
| `ToastProvider` | Toast notifications |
|
|
248
246
|
| `VarityDashboardProvider` | Dashboard state management |
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@varity-labs/ui-kit",
|
|
3
|
-
"version": "2.0.0-beta.
|
|
3
|
+
"version": "2.0.0-beta.7",
|
|
4
4
|
"description": "React component library for building applications with Varity - Auth, payments, dashboard components",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./dist/index.js",
|
|
@@ -19,21 +19,6 @@
|
|
|
19
19
|
"LICENSE"
|
|
20
20
|
],
|
|
21
21
|
"sideEffects": false,
|
|
22
|
-
"scripts": {
|
|
23
|
-
"build": "tsc",
|
|
24
|
-
"watch": "tsc --watch",
|
|
25
|
-
"test": "jest --coverage",
|
|
26
|
-
"test:watch": "jest --watch",
|
|
27
|
-
"test:unit": "jest --testMatch='**/*.test.ts?(x)'",
|
|
28
|
-
"test:integration": "jest --testMatch='**/*.integration.test.ts?(x)'",
|
|
29
|
-
"clean": "rm -rf dist",
|
|
30
|
-
"storybook": "storybook dev -p 6006",
|
|
31
|
-
"build-storybook": "storybook build",
|
|
32
|
-
"lint": "eslint src --ext .ts,.tsx",
|
|
33
|
-
"lint:fix": "eslint src --ext .ts,.tsx --fix",
|
|
34
|
-
"type-check": "tsc --noEmit",
|
|
35
|
-
"prepublishOnly": "npm run build"
|
|
36
|
-
},
|
|
37
22
|
"keywords": [
|
|
38
23
|
"varity",
|
|
39
24
|
"ui-kit",
|
|
@@ -42,7 +27,7 @@
|
|
|
42
27
|
"auth",
|
|
43
28
|
"payments",
|
|
44
29
|
"dashboard",
|
|
45
|
-
"
|
|
30
|
+
"auth"
|
|
46
31
|
],
|
|
47
32
|
"author": "Varity",
|
|
48
33
|
"license": "MIT",
|
|
@@ -58,11 +43,11 @@
|
|
|
58
43
|
"dependencies": {
|
|
59
44
|
"@privy-io/react-auth": "^1.88.4",
|
|
60
45
|
"@tanstack/react-query": "^5.59.0",
|
|
61
|
-
"@varity-labs/sdk": "workspace:^",
|
|
62
|
-
"@varity-labs/types": "workspace:^",
|
|
63
46
|
"lucide-react": "^0.554.0",
|
|
64
47
|
"react-hot-toast": "^2.6.0",
|
|
65
|
-
"thirdweb": "^5.112.0"
|
|
48
|
+
"thirdweb": "^5.112.0",
|
|
49
|
+
"@varity-labs/sdk": "^2.0.0-beta.4",
|
|
50
|
+
"@varity-labs/types": "^2.0.0-beta.4"
|
|
66
51
|
},
|
|
67
52
|
"optionalDependencies": {
|
|
68
53
|
"@privy-io/wagmi": "^0.2.12",
|
|
@@ -109,5 +94,19 @@
|
|
|
109
94
|
"tailwindcss": "^3.4.0",
|
|
110
95
|
"ts-jest": "^29.4.6",
|
|
111
96
|
"typescript": "^5.3.0"
|
|
97
|
+
},
|
|
98
|
+
"scripts": {
|
|
99
|
+
"build": "tsc",
|
|
100
|
+
"watch": "tsc --watch",
|
|
101
|
+
"test": "jest --coverage",
|
|
102
|
+
"test:watch": "jest --watch",
|
|
103
|
+
"test:unit": "jest --testMatch='**/*.test.ts?(x)'",
|
|
104
|
+
"test:integration": "jest --testMatch='**/*.integration.test.ts?(x)'",
|
|
105
|
+
"clean": "rm -rf dist",
|
|
106
|
+
"storybook": "storybook dev -p 6006",
|
|
107
|
+
"build-storybook": "storybook build",
|
|
108
|
+
"lint": "eslint src --ext .ts,.tsx",
|
|
109
|
+
"lint:fix": "eslint src --ext .ts,.tsx --fix",
|
|
110
|
+
"type-check": "tsc --noEmit"
|
|
112
111
|
}
|
|
113
|
-
}
|
|
112
|
+
}
|