@insforge/react 0.1.1 → 0.1.3
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/dist/atoms.d.mts +366 -0
- package/dist/atoms.d.ts +366 -0
- package/dist/atoms.js +731 -0
- package/dist/atoms.js.map +1 -0
- package/dist/atoms.mjs +716 -0
- package/dist/atoms.mjs.map +1 -0
- package/dist/forms.d.mts +185 -0
- package/dist/forms.d.ts +185 -0
- package/dist/forms.js +1029 -0
- package/dist/forms.js.map +1 -0
- package/dist/forms.mjs +1023 -0
- package/dist/forms.mjs.map +1 -0
- package/dist/index-C9pisdfX.d.mts +404 -0
- package/dist/index-C9pisdfX.d.ts +404 -0
- package/dist/index.d.mts +7 -941
- package/dist/index.d.ts +7 -941
- package/dist/index.js +99 -55
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +99 -56
- package/dist/index.mjs.map +1 -1
- package/dist/styles.css +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1,404 @@
|
|
|
1
|
+
import { ReactNode, FormEvent, InputHTMLAttributes, CSSProperties } from 'react';
|
|
2
|
+
import { OAuthProvidersSchema, GetPublicEmailAuthConfigResponse } from '@insforge/shared-schemas';
|
|
3
|
+
|
|
4
|
+
type OAuthProvider = OAuthProvidersSchema;
|
|
5
|
+
type EmailAuthConfig = GetPublicEmailAuthConfigResponse;
|
|
6
|
+
/**
|
|
7
|
+
* Insforge User type
|
|
8
|
+
*/
|
|
9
|
+
interface InsforgeUser {
|
|
10
|
+
id: string;
|
|
11
|
+
email: string;
|
|
12
|
+
name?: string;
|
|
13
|
+
avatarUrl?: string;
|
|
14
|
+
}
|
|
15
|
+
/**
|
|
16
|
+
* Base appearance props for styling components
|
|
17
|
+
*/
|
|
18
|
+
interface BaseAppearance {
|
|
19
|
+
containerClassName?: string;
|
|
20
|
+
[key: string]: string | undefined;
|
|
21
|
+
}
|
|
22
|
+
/**
|
|
23
|
+
* Props for AuthContainer component
|
|
24
|
+
*/
|
|
25
|
+
interface AuthContainerProps {
|
|
26
|
+
children: ReactNode;
|
|
27
|
+
appearance?: {
|
|
28
|
+
containerClassName?: string;
|
|
29
|
+
cardClassName?: string;
|
|
30
|
+
};
|
|
31
|
+
}
|
|
32
|
+
/**
|
|
33
|
+
* Props for AuthHeader component
|
|
34
|
+
*/
|
|
35
|
+
interface AuthHeaderProps {
|
|
36
|
+
title: string;
|
|
37
|
+
subtitle?: string;
|
|
38
|
+
appearance?: {
|
|
39
|
+
containerClassName?: string;
|
|
40
|
+
titleClassName?: string;
|
|
41
|
+
subtitleClassName?: string;
|
|
42
|
+
};
|
|
43
|
+
}
|
|
44
|
+
/**
|
|
45
|
+
* Props for AuthErrorBanner component
|
|
46
|
+
*/
|
|
47
|
+
interface AuthErrorBannerProps {
|
|
48
|
+
error: string;
|
|
49
|
+
className?: string;
|
|
50
|
+
}
|
|
51
|
+
/**
|
|
52
|
+
* Props for AuthFormField component
|
|
53
|
+
*/
|
|
54
|
+
interface AuthFormFieldProps extends InputHTMLAttributes<HTMLInputElement> {
|
|
55
|
+
label: string;
|
|
56
|
+
id: string;
|
|
57
|
+
appearance?: {
|
|
58
|
+
containerClassName?: string;
|
|
59
|
+
labelClassName?: string;
|
|
60
|
+
inputClassName?: string;
|
|
61
|
+
};
|
|
62
|
+
}
|
|
63
|
+
/**
|
|
64
|
+
* Props for AuthPasswordField component
|
|
65
|
+
*/
|
|
66
|
+
interface AuthPasswordFieldProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type'> {
|
|
67
|
+
label: string;
|
|
68
|
+
id: string;
|
|
69
|
+
showStrengthIndicator?: boolean;
|
|
70
|
+
emailAuthConfig: EmailAuthConfig;
|
|
71
|
+
forgotPasswordLink?: {
|
|
72
|
+
href: string;
|
|
73
|
+
text?: string;
|
|
74
|
+
};
|
|
75
|
+
appearance?: {
|
|
76
|
+
containerClassName?: string;
|
|
77
|
+
labelClassName?: string;
|
|
78
|
+
inputClassName?: string;
|
|
79
|
+
};
|
|
80
|
+
}
|
|
81
|
+
/**
|
|
82
|
+
* Props for AuthPasswordStrengthIndicator component
|
|
83
|
+
*/
|
|
84
|
+
interface AuthPasswordStrengthIndicatorProps {
|
|
85
|
+
password: string;
|
|
86
|
+
config: EmailAuthConfig;
|
|
87
|
+
appearance?: {
|
|
88
|
+
containerClassName?: string;
|
|
89
|
+
requirementClassName?: string;
|
|
90
|
+
};
|
|
91
|
+
}
|
|
92
|
+
/**
|
|
93
|
+
* Props for AuthSubmitButton component
|
|
94
|
+
*/
|
|
95
|
+
interface AuthSubmitButtonProps {
|
|
96
|
+
children: ReactNode;
|
|
97
|
+
isLoading?: boolean;
|
|
98
|
+
confirmed?: boolean;
|
|
99
|
+
disabled?: boolean;
|
|
100
|
+
className?: string;
|
|
101
|
+
}
|
|
102
|
+
/**
|
|
103
|
+
* Props for AuthLink component
|
|
104
|
+
*/
|
|
105
|
+
interface AuthLinkProps {
|
|
106
|
+
text: string;
|
|
107
|
+
linkText: string;
|
|
108
|
+
href: string;
|
|
109
|
+
appearance?: {
|
|
110
|
+
containerClassName?: string;
|
|
111
|
+
linkClassName?: string;
|
|
112
|
+
};
|
|
113
|
+
}
|
|
114
|
+
/**
|
|
115
|
+
* Props for AuthDivider component
|
|
116
|
+
*/
|
|
117
|
+
interface AuthDividerProps {
|
|
118
|
+
text?: string;
|
|
119
|
+
className?: string;
|
|
120
|
+
}
|
|
121
|
+
/**
|
|
122
|
+
* Props for AuthOAuthButton component
|
|
123
|
+
*/
|
|
124
|
+
interface AuthOAuthButtonProps {
|
|
125
|
+
provider: OAuthProvider;
|
|
126
|
+
onClick: (provider: OAuthProvider) => void;
|
|
127
|
+
disabled?: boolean;
|
|
128
|
+
loading?: boolean;
|
|
129
|
+
displayMode?: 'full' | 'short' | 'icon';
|
|
130
|
+
style?: CSSProperties;
|
|
131
|
+
className?: string;
|
|
132
|
+
}
|
|
133
|
+
/**
|
|
134
|
+
* Props for AuthOAuthProviders component
|
|
135
|
+
*/
|
|
136
|
+
interface AuthOAuthProvidersProps {
|
|
137
|
+
providers: OAuthProvider[];
|
|
138
|
+
onClick: (provider: OAuthProvider) => void;
|
|
139
|
+
disabled?: boolean;
|
|
140
|
+
loading: OAuthProvider | null;
|
|
141
|
+
appearance?: {
|
|
142
|
+
containerClassName?: string;
|
|
143
|
+
buttonClassName?: string;
|
|
144
|
+
};
|
|
145
|
+
}
|
|
146
|
+
/**
|
|
147
|
+
* Props for AuthVerificationCodeInput component
|
|
148
|
+
*/
|
|
149
|
+
interface AuthVerificationCodeInputProps {
|
|
150
|
+
length?: number;
|
|
151
|
+
value: string;
|
|
152
|
+
email: string;
|
|
153
|
+
onChange: (value: string) => void;
|
|
154
|
+
disabled?: boolean;
|
|
155
|
+
appearance?: {
|
|
156
|
+
containerClassName?: string;
|
|
157
|
+
inputClassName?: string;
|
|
158
|
+
};
|
|
159
|
+
}
|
|
160
|
+
/**
|
|
161
|
+
* Configuration for an OAuth provider
|
|
162
|
+
*/
|
|
163
|
+
interface OAuthProviderConfig {
|
|
164
|
+
name: string;
|
|
165
|
+
svg: ReactNode;
|
|
166
|
+
className: string;
|
|
167
|
+
}
|
|
168
|
+
/**
|
|
169
|
+
* Props for SignInForm component
|
|
170
|
+
*/
|
|
171
|
+
interface SignInFormProps {
|
|
172
|
+
email: string;
|
|
173
|
+
password: string;
|
|
174
|
+
onEmailChange: (email: string) => void;
|
|
175
|
+
onPasswordChange: (password: string) => void;
|
|
176
|
+
onSubmit: (e: FormEvent<HTMLFormElement>) => void;
|
|
177
|
+
error?: string;
|
|
178
|
+
loading?: boolean;
|
|
179
|
+
oauthLoading?: OAuthProvider | null;
|
|
180
|
+
availableProviders?: OAuthProvider[];
|
|
181
|
+
onOAuthClick?: (provider: OAuthProvider) => void;
|
|
182
|
+
emailAuthConfig?: EmailAuthConfig;
|
|
183
|
+
appearance?: {
|
|
184
|
+
containerClassName?: string;
|
|
185
|
+
cardClassName?: string;
|
|
186
|
+
formClassName?: string;
|
|
187
|
+
buttonClassName?: string;
|
|
188
|
+
};
|
|
189
|
+
title?: string;
|
|
190
|
+
subtitle?: string;
|
|
191
|
+
emailLabel?: string;
|
|
192
|
+
emailPlaceholder?: string;
|
|
193
|
+
passwordLabel?: string;
|
|
194
|
+
passwordPlaceholder?: string;
|
|
195
|
+
forgotPasswordText?: string;
|
|
196
|
+
forgotPasswordUrl?: string;
|
|
197
|
+
submitButtonText?: string;
|
|
198
|
+
loadingButtonText?: string;
|
|
199
|
+
signUpText?: string;
|
|
200
|
+
signUpLinkText?: string;
|
|
201
|
+
signUpUrl?: string;
|
|
202
|
+
dividerText?: string;
|
|
203
|
+
}
|
|
204
|
+
/**
|
|
205
|
+
* Props for SignUpForm component
|
|
206
|
+
*/
|
|
207
|
+
interface SignUpFormProps {
|
|
208
|
+
email: string;
|
|
209
|
+
password: string;
|
|
210
|
+
onEmailChange: (email: string) => void;
|
|
211
|
+
onPasswordChange: (password: string) => void;
|
|
212
|
+
onSubmit: (e: FormEvent<HTMLFormElement>) => void;
|
|
213
|
+
error?: string;
|
|
214
|
+
loading?: boolean;
|
|
215
|
+
oauthLoading?: OAuthProvider | null;
|
|
216
|
+
availableProviders?: OAuthProvider[];
|
|
217
|
+
onOAuthClick?: (provider: OAuthProvider) => void;
|
|
218
|
+
emailAuthConfig?: EmailAuthConfig;
|
|
219
|
+
appearance?: {
|
|
220
|
+
containerClassName?: string;
|
|
221
|
+
cardClassName?: string;
|
|
222
|
+
formClassName?: string;
|
|
223
|
+
buttonClassName?: string;
|
|
224
|
+
};
|
|
225
|
+
title?: string;
|
|
226
|
+
subtitle?: string;
|
|
227
|
+
emailLabel?: string;
|
|
228
|
+
emailPlaceholder?: string;
|
|
229
|
+
passwordLabel?: string;
|
|
230
|
+
passwordPlaceholder?: string;
|
|
231
|
+
submitButtonText?: string;
|
|
232
|
+
loadingButtonText?: string;
|
|
233
|
+
signInText?: string;
|
|
234
|
+
signInLinkText?: string;
|
|
235
|
+
signInUrl?: string;
|
|
236
|
+
dividerText?: string;
|
|
237
|
+
}
|
|
238
|
+
/**
|
|
239
|
+
* Props for ForgotPasswordForm component
|
|
240
|
+
*/
|
|
241
|
+
interface ForgotPasswordFormProps {
|
|
242
|
+
email: string;
|
|
243
|
+
onEmailChange: (email: string) => void;
|
|
244
|
+
onSubmit: (e: FormEvent<HTMLFormElement>) => void;
|
|
245
|
+
error?: string;
|
|
246
|
+
loading?: boolean;
|
|
247
|
+
success?: boolean;
|
|
248
|
+
appearance?: {
|
|
249
|
+
containerClassName?: string;
|
|
250
|
+
cardClassName?: string;
|
|
251
|
+
formClassName?: string;
|
|
252
|
+
buttonClassName?: string;
|
|
253
|
+
};
|
|
254
|
+
title?: string;
|
|
255
|
+
subtitle?: string;
|
|
256
|
+
emailLabel?: string;
|
|
257
|
+
emailPlaceholder?: string;
|
|
258
|
+
submitButtonText?: string;
|
|
259
|
+
loadingButtonText?: string;
|
|
260
|
+
backToSignInText?: string;
|
|
261
|
+
backToSignInUrl?: string;
|
|
262
|
+
successTitle?: string;
|
|
263
|
+
successMessage?: string;
|
|
264
|
+
}
|
|
265
|
+
/**
|
|
266
|
+
* Props for ResetPasswordForm component
|
|
267
|
+
*/
|
|
268
|
+
interface ResetPasswordFormProps {
|
|
269
|
+
newPassword: string;
|
|
270
|
+
confirmPassword: string;
|
|
271
|
+
onNewPasswordChange: (password: string) => void;
|
|
272
|
+
onConfirmPasswordChange: (password: string) => void;
|
|
273
|
+
onSubmit: (e: FormEvent<HTMLFormElement>) => void;
|
|
274
|
+
error?: string;
|
|
275
|
+
loading?: boolean;
|
|
276
|
+
emailAuthConfig?: EmailAuthConfig;
|
|
277
|
+
appearance?: {
|
|
278
|
+
containerClassName?: string;
|
|
279
|
+
cardClassName?: string;
|
|
280
|
+
formClassName?: string;
|
|
281
|
+
buttonClassName?: string;
|
|
282
|
+
};
|
|
283
|
+
title?: string;
|
|
284
|
+
subtitle?: string;
|
|
285
|
+
newPasswordLabel?: string;
|
|
286
|
+
newPasswordPlaceholder?: string;
|
|
287
|
+
confirmPasswordLabel?: string;
|
|
288
|
+
confirmPasswordPlaceholder?: string;
|
|
289
|
+
submitButtonText?: string;
|
|
290
|
+
loadingButtonText?: string;
|
|
291
|
+
backToSignInText?: string;
|
|
292
|
+
backToSignInUrl?: string;
|
|
293
|
+
}
|
|
294
|
+
/**
|
|
295
|
+
* Props for VerifyEmailStatus component
|
|
296
|
+
*/
|
|
297
|
+
interface VerifyEmailStatusProps {
|
|
298
|
+
status: 'verifying' | 'success' | 'error';
|
|
299
|
+
error?: string;
|
|
300
|
+
appearance?: {
|
|
301
|
+
containerClassName?: string;
|
|
302
|
+
cardClassName?: string;
|
|
303
|
+
};
|
|
304
|
+
verifyingTitle?: string;
|
|
305
|
+
successTitle?: string;
|
|
306
|
+
successMessage?: string;
|
|
307
|
+
errorTitle?: string;
|
|
308
|
+
}
|
|
309
|
+
/**
|
|
310
|
+
* Props for the SignIn component
|
|
311
|
+
*/
|
|
312
|
+
interface SignInProps {
|
|
313
|
+
afterSignInUrl?: string;
|
|
314
|
+
appearance?: {
|
|
315
|
+
containerClassName?: string;
|
|
316
|
+
cardClassName?: string;
|
|
317
|
+
formClassName?: string;
|
|
318
|
+
buttonClassName?: string;
|
|
319
|
+
};
|
|
320
|
+
title?: string;
|
|
321
|
+
subtitle?: string;
|
|
322
|
+
emailLabel?: string;
|
|
323
|
+
emailPlaceholder?: string;
|
|
324
|
+
passwordLabel?: string;
|
|
325
|
+
passwordPlaceholder?: string;
|
|
326
|
+
forgotPasswordText?: string;
|
|
327
|
+
forgotPasswordUrl?: string;
|
|
328
|
+
submitButtonText?: string;
|
|
329
|
+
loadingButtonText?: string;
|
|
330
|
+
signUpText?: string;
|
|
331
|
+
signUpLinkText?: string;
|
|
332
|
+
signUpUrl?: string;
|
|
333
|
+
dividerText?: string;
|
|
334
|
+
onSuccess?: (user: {
|
|
335
|
+
id: string;
|
|
336
|
+
email: string;
|
|
337
|
+
name: string;
|
|
338
|
+
}, accessToken: string) => void;
|
|
339
|
+
onError?: (error: Error) => void;
|
|
340
|
+
onRedirect?: (url: string) => void;
|
|
341
|
+
}
|
|
342
|
+
/**
|
|
343
|
+
* Props for the SignUp component
|
|
344
|
+
*/
|
|
345
|
+
interface SignUpProps {
|
|
346
|
+
afterSignUpUrl?: string;
|
|
347
|
+
appearance?: {
|
|
348
|
+
containerClassName?: string;
|
|
349
|
+
cardClassName?: string;
|
|
350
|
+
formClassName?: string;
|
|
351
|
+
buttonClassName?: string;
|
|
352
|
+
};
|
|
353
|
+
title?: string;
|
|
354
|
+
subtitle?: string;
|
|
355
|
+
emailLabel?: string;
|
|
356
|
+
emailPlaceholder?: string;
|
|
357
|
+
passwordLabel?: string;
|
|
358
|
+
passwordPlaceholder?: string;
|
|
359
|
+
submitButtonText?: string;
|
|
360
|
+
loadingButtonText?: string;
|
|
361
|
+
signInText?: string;
|
|
362
|
+
signInLinkText?: string;
|
|
363
|
+
signInUrl?: string;
|
|
364
|
+
dividerText?: string;
|
|
365
|
+
onSuccess?: (user: {
|
|
366
|
+
id: string;
|
|
367
|
+
email: string;
|
|
368
|
+
name: string;
|
|
369
|
+
}, accessToken: string) => void;
|
|
370
|
+
onError?: (error: Error) => void;
|
|
371
|
+
onRedirect?: (url: string) => void;
|
|
372
|
+
}
|
|
373
|
+
/**
|
|
374
|
+
* Props for Protect component
|
|
375
|
+
*/
|
|
376
|
+
interface ProtectProps {
|
|
377
|
+
children: ReactNode;
|
|
378
|
+
fallback?: ReactNode;
|
|
379
|
+
redirectTo?: string;
|
|
380
|
+
condition?: (user: InsforgeUser) => boolean;
|
|
381
|
+
onRedirect?: (url: string) => void;
|
|
382
|
+
}
|
|
383
|
+
/**
|
|
384
|
+
* Props for conditional rendering components (SignedIn, SignedOut)
|
|
385
|
+
*/
|
|
386
|
+
interface ConditionalProps {
|
|
387
|
+
children: ReactNode;
|
|
388
|
+
}
|
|
389
|
+
/**
|
|
390
|
+
* Props for UserButton component
|
|
391
|
+
*/
|
|
392
|
+
interface UserButtonProps {
|
|
393
|
+
afterSignOutUrl?: string;
|
|
394
|
+
mode?: 'detailed' | 'simple';
|
|
395
|
+
appearance?: {
|
|
396
|
+
containerClassName?: string;
|
|
397
|
+
buttonClassName?: string;
|
|
398
|
+
nameClassName?: string;
|
|
399
|
+
emailClassName?: string;
|
|
400
|
+
dropdownClassName?: string;
|
|
401
|
+
};
|
|
402
|
+
}
|
|
403
|
+
|
|
404
|
+
export type { AuthContainerProps as A, BaseAppearance as B, ConditionalProps as C, EmailAuthConfig as E, ForgotPasswordFormProps as F, InsforgeUser as I, OAuthProvider as O, ProtectProps as P, ResetPasswordFormProps as R, SignInProps as S, UserButtonProps as U, VerifyEmailStatusProps as V, SignUpProps as a, OAuthProviderConfig as b, AuthHeaderProps as c, AuthErrorBannerProps as d, AuthFormFieldProps as e, AuthPasswordFieldProps as f, AuthPasswordStrengthIndicatorProps as g, AuthSubmitButtonProps as h, AuthLinkProps as i, AuthDividerProps as j, AuthOAuthButtonProps as k, AuthOAuthProvidersProps as l, AuthVerificationCodeInputProps as m, SignInFormProps as n, SignUpFormProps as o };
|