@insforge/react 0.1.1 → 0.1.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.
@@ -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 };