doct-ui-auth-kit 1.0.7 → 1.0.9

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 (69) hide show
  1. package/dist/doct-ui-auth-kit.css +1 -1
  2. package/dist/index.js +28 -27
  3. package/dist/pages.js +1 -1
  4. package/dist/signup-page-DBRzdhNj.js +1546 -0
  5. package/package.json +3 -2
  6. package/dist/adapters/http-auth-adapter.d.ts +0 -8
  7. package/dist/adapters/index.d.ts +0 -1
  8. package/dist/auth/index.d.ts +0 -23
  9. package/dist/auth-methods/apple.d.ts +0 -19
  10. package/dist/auth-methods/google.d.ts +0 -5
  11. package/dist/auth-methods/index.d.ts +0 -2
  12. package/dist/auth-methods/use-google-auth.d.ts +0 -69
  13. package/dist/components/form/rhf-doct-phone-input.d.ts +0 -2
  14. package/dist/components/form/rhf-input-field.d.ts +0 -2
  15. package/dist/components/form/rhf-otp-input-field.d.ts +0 -2
  16. package/dist/components/layout/auth-layout-preset.d.ts +0 -30
  17. package/dist/components/layout/auth-layout-public.d.ts +0 -13
  18. package/dist/components/layout/auth-layout-wrapper.d.ts +0 -42
  19. package/dist/components/layout/auth-layout.d.ts +0 -89
  20. package/dist/components/layout/image-slider.d.ts +0 -28
  21. package/dist/components/layout/index.d.ts +0 -8
  22. package/dist/components/layout/main-layout.d.ts +0 -30
  23. package/dist/constants/demo-slider.d.ts +0 -14
  24. package/dist/constants/index.d.ts +0 -2
  25. package/dist/constants/layout-presets.d.ts +0 -6
  26. package/dist/core/auth-api-adapter.d.ts +0 -6
  27. package/dist/core/auth-context.d.ts +0 -17
  28. package/dist/core/auth-flow.d.ts +0 -5
  29. package/dist/core/auth-provider.d.ts +0 -6
  30. package/dist/core/auth-types.d.ts +0 -5
  31. package/dist/core/device-detection.d.ts +0 -15
  32. package/dist/core/index.d.ts +0 -11
  33. package/dist/core/sso-session.d.ts +0 -29
  34. package/dist/core/use-auth-flow.d.ts +0 -5
  35. package/dist/hooks/index.d.ts +0 -5
  36. package/dist/hooks/use-login-entry-form.d.ts +0 -8
  37. package/dist/hooks/use-main-auth-page-handlers.d.ts +0 -8
  38. package/dist/hooks/use-otp-verification.d.ts +0 -12
  39. package/dist/hooks/use-repeat-login.d.ts +0 -7
  40. package/dist/hooks/use-signup-form.d.ts +0 -7
  41. package/dist/index.d.ts +0 -11
  42. package/dist/pages/index.d.ts +0 -5
  43. package/dist/pages/login-entry.d.ts +0 -42
  44. package/dist/pages/main-login.d.ts +0 -32
  45. package/dist/pages/otp-verification.d.ts +0 -45
  46. package/dist/pages/repeat-login.d.ts +0 -49
  47. package/dist/pages/signup.d.ts +0 -6
  48. package/dist/signup-DeeuWsoF.js +0 -1718
  49. package/dist/types/auth-api-adapter.d.ts +0 -39
  50. package/dist/types/auth-layout-types.d.ts +0 -94
  51. package/dist/types/auth-provider.d.ts +0 -40
  52. package/dist/types/auth-types.d.ts +0 -70
  53. package/dist/types/device-detection.d.ts +0 -10
  54. package/dist/types/flow.d.ts +0 -122
  55. package/dist/types/forms.d.ts +0 -68
  56. package/dist/types/index.d.ts +0 -20
  57. package/dist/types/layout-presets.d.ts +0 -24
  58. package/dist/types/layout.d.ts +0 -57
  59. package/dist/types/login-form.d.ts +0 -56
  60. package/dist/types/main-login.d.ts +0 -40
  61. package/dist/types/otp-verification.d.ts +0 -40
  62. package/dist/types/pages.d.ts +0 -133
  63. package/dist/types/repeat-login.d.ts +0 -29
  64. package/dist/types/signup-form.d.ts +0 -48
  65. package/dist/types/sso-session.d.ts +0 -33
  66. package/dist/utils/index.d.ts +0 -4
  67. package/dist/utils/set-form-errors-from-zod.d.ts +0 -11
  68. package/dist/validations/index.d.ts +0 -6
  69. package/dist/validations/schemas.d.ts +0 -73
@@ -1,39 +0,0 @@
1
- import { AuthenticateWithProviderParams, CompleteProfileParams, SendOtpResponse, SSOSession, VerifyOtpResponse } from './auth-types';
2
- /** Parameters for sending OTP to phone or email. */
3
- export interface SendOtpParams {
4
- type: 'phone' | 'email';
5
- value: string;
6
- }
7
- /** Parameters for verifying OTP. */
8
- export interface VerifyOtpParams {
9
- type: 'phone' | 'email';
10
- value: string;
11
- otp: string;
12
- }
13
- /**
14
- * Adapter implemented by the consumer to talk to the central auth service.
15
- * All methods return promises; the SDK handles loading/error state.
16
- */
17
- export interface AuthApiAdapter {
18
- /** Send OTP to the given phone or email. */
19
- sendOtp(params: SendOtpParams): Promise<SendOtpResponse>;
20
- /**
21
- * Verify OTP. Returns session if existing user, or isNewUser flag for profile completion.
22
- * May return conflict error when identifier is linked to another account.
23
- */
24
- verifyOtp(params: VerifyOtpParams): Promise<VerifyOtpResponse>;
25
- /** Complete profile for new users; returns SSO session. */
26
- completeProfile(params: CompleteProfileParams): Promise<SSOSession>;
27
- /** Authenticate with a third-party provider (Google/Apple) credential. */
28
- authenticateWithProvider(params: AuthenticateWithProviderParams): Promise<VerifyOtpResponse>;
29
- /** Validate an existing SSO session token; called on SDK mount. Returns null if invalid/expired. */
30
- validateSession(token: string): Promise<SSOSession | null>;
31
- /**
32
- * Optional: validate session using server-read cookie (no token from client).
33
- * Required when using serverCookieTokenStorage. Client sends credentials;
34
- * server reads cookie from the request and returns session or null.
35
- */
36
- validateSessionFromCookie?(): Promise<SSOSession | null>;
37
- /** Optional: refresh an expired SSO session using refresh token. */
38
- refreshSession?(refreshToken: string): Promise<SSOSession | null>;
39
- }
@@ -1,94 +0,0 @@
1
- import { ReactNode } from 'react';
2
- /**
3
- * Layout configuration types
4
- */
5
- export type AuthLayoutVariant = 'mobile' | 'desktop';
6
- export type AuthLayoutMaxWidth = 'sm' | 'md' | 'lg';
7
- /** Text/alignment variant for Logo, Title, Description slots */
8
- export type AuthLayoutAlign = 'left' | 'center' | 'right';
9
- /**
10
- * Props for AuthLayout.Root component
11
- */
12
- export interface AuthLayoutRootProps {
13
- /** Main content (compound components) */
14
- children: ReactNode;
15
- /** Layout variation for spacing and alignment */
16
- variant?: AuthLayoutVariant;
17
- /** Maximum width constraint for the content area */
18
- maxWidth?: AuthLayoutMaxWidth;
19
- /** Additional className for the root container */
20
- className?: string;
21
- /** Additional className for the content wrapper */
22
- contentClassName?: string;
23
- }
24
- /**
25
- * Props for AuthLayout.Header component
26
- */
27
- export interface AuthLayoutHeaderProps {
28
- /** Header content */
29
- children: ReactNode;
30
- /** Additional className */
31
- className?: string;
32
- }
33
- /**
34
- * Props for AuthLayout.Logo component
35
- */
36
- export interface AuthLayoutLogoProps {
37
- /** Logo content */
38
- children: ReactNode;
39
- /** Alignment: left, center (default), or right */
40
- align?: AuthLayoutAlign;
41
- /** Additional className */
42
- className?: string;
43
- }
44
- /**
45
- * Props for AuthLayout.Title component
46
- */
47
- export interface AuthLayoutTitleProps {
48
- /** Title content */
49
- children: ReactNode;
50
- /** Alignment: left, center (default), or right */
51
- align?: AuthLayoutAlign;
52
- /** Additional className */
53
- className?: string;
54
- }
55
- /**
56
- * Props for AuthLayout.Description component
57
- */
58
- export interface AuthLayoutDescriptionProps {
59
- /** Description content */
60
- children: ReactNode;
61
- /** Alignment: left, center (default), or right */
62
- align?: AuthLayoutAlign;
63
- /** Additional className */
64
- className?: string;
65
- }
66
- /**
67
- * Props for AuthLayout.Body component
68
- */
69
- export interface AuthLayoutBodyProps {
70
- /** Body content (forms, buttons, etc.) */
71
- children: ReactNode;
72
- /** Additional className */
73
- className?: string;
74
- }
75
- /**
76
- * Props for AuthLayout.Main component
77
- */
78
- export interface AuthLayoutMainProps {
79
- /** Main content (Logo, Title, Description, Body slots) */
80
- children: ReactNode;
81
- /** When true, constrains main content width to 320px (max-w-[320px]) */
82
- sm?: boolean;
83
- /** Additional className */
84
- className?: string;
85
- }
86
- /**
87
- * Props for AuthLayout.Footer component
88
- */
89
- export interface AuthLayoutFooterProps {
90
- /** Footer content */
91
- children: ReactNode;
92
- /** Additional className */
93
- className?: string;
94
- }
@@ -1,40 +0,0 @@
1
- import { ReactNode } from 'react';
2
- import { AuthApiAdapter } from './auth-api-adapter';
3
- import { AuthError, SSOSession } from './auth-types';
4
- import { TokenStorageStrategy } from './sso-session';
5
- /** Consumer-provided config for SSOAuthProvider. */
6
- export interface SSOAuthConfig {
7
- /** Consumer-provided adapter to their central auth service. */
8
- apiAdapter: AuthApiAdapter;
9
- /** Auth method configs (Google client ID, Apple client ID, etc.). */
10
- providers?: {
11
- google?: {
12
- clientId: string;
13
- enableOneTap?: boolean;
14
- };
15
- apple?: {
16
- clientId: string;
17
- redirectUri: string;
18
- };
19
- };
20
- /** Called when SSO session is established (any method). */
21
- onAuthSuccess: (session: SSOSession) => void;
22
- /** Called on auth errors. */
23
- onAuthError?: (error: AuthError) => void;
24
- /** Optional: called when user signs out. */
25
- onSignOut?: () => void;
26
- /** SSO token persistence strategy. Defaults to localStorage. */
27
- tokenStorage?: TokenStorageStrategy;
28
- /** Branding customization (logo, slider images). */
29
- branding?: {
30
- logo?: ReactNode;
31
- sliderImages?: string[];
32
- };
33
- }
34
- /** Props for the SSOAuthProvider context wrapper that supplies auth state to the component tree. */
35
- export interface SSOAuthProviderProps {
36
- /** Auth configuration including API adapter, provider settings, and callbacks. */
37
- config: SSOAuthConfig;
38
- /** Child components that will have access to the SSO auth context. */
39
- children: ReactNode;
40
- }
@@ -1,70 +0,0 @@
1
- /**
2
- * SSO auth domain types: session, flow steps, adapter contracts, and error codes.
3
- * Used by the flow engine, provider, and adapter implementations.
4
- */
5
- /** Auth methods available in the SSO system. */
6
- export type AuthMethod = 'phone' | 'email' | 'google' | 'apple';
7
- /** User payload in the SSO session. */
8
- export interface SSOUser {
9
- id: string;
10
- name: string;
11
- email?: string;
12
- phone?: string;
13
- avatar?: string;
14
- isNewUser: boolean;
15
- }
16
- /** The SSO session — same structure regardless of auth method used. */
17
- export interface SSOSession {
18
- accessToken: string;
19
- refreshToken?: string;
20
- expiresAt: number;
21
- user: SSOUser;
22
- authMethod: AuthMethod;
23
- }
24
- /** User type for layout and OTP routing: Indian (+91) vs Foreign (non +91). */
25
- export type UserType = 'INDIAN' | 'FOREIGN';
26
- /** Flow states for the state machine. */
27
- export type AuthStep = 'CHECKING_SESSION' | 'REPEAT_LOGIN' | 'METHOD_SELECT' | 'PHONE_ENTRY' | 'EMAIL_ENTRY' | 'OTP_VERIFICATION' | 'SIGNUP_DETAILS' | 'PROVIDER_PENDING' | 'AUTHENTICATED';
28
- /** Error codes from the central auth service. */
29
- export type AuthErrorCode = 'IDENTIFIER_CONFLICT' | 'OTP_EXPIRED' | 'OTP_INVALID' | 'OTP_RATE_LIMIT' | 'SESSION_EXPIRED' | 'PROVIDER_AUTH_FAILED' | 'NETWORK_ERROR' | 'UNKNOWN';
30
- /** Auth error with code and optional message / linked identifier. */
31
- export interface AuthError {
32
- code: AuthErrorCode;
33
- message?: string;
34
- /** Masked linked identifier when conflict (e.g. "+91 98XXXX0X0X"). */
35
- linkedIdentifier?: string;
36
- }
37
- /** Response from sendOtp. */
38
- export interface SendOtpResponse {
39
- success: boolean;
40
- /** Masked value for display (e.g. "+91 9825910X0X" or "j***@gmail.com"). */
41
- maskedValue?: string;
42
- error?: AuthError;
43
- }
44
- /** Result of verifyOtp or authenticateWithProvider: existing user gets session, new user gets profile step. */
45
- export interface VerifyOtpResponse {
46
- /** Present when user exists and is authenticated. */
47
- session?: SSOSession;
48
- /** True when user is new and must complete profile. */
49
- isNewUser: boolean;
50
- /** When isNewUser and conflict (e.g. email already linked), masked linked identifier. */
51
- conflict?: AuthError;
52
- }
53
- /** Input for completeProfile (new users). */
54
- export interface CompleteProfileParams {
55
- fullName: string;
56
- email?: string;
57
- phone?: string;
58
- }
59
- /** Input for authenticateWithProvider (Google/Apple credential). */
60
- export interface AuthenticateWithProviderParams {
61
- provider: 'google' | 'apple';
62
- /** Id token or equivalent from the provider. */
63
- credential: string;
64
- }
65
- /** Repeat-login device history (method + masked identifier). */
66
- export interface RepeatLoginInfo {
67
- method: AuthMethod;
68
- maskedIdentifier: string;
69
- timestamp: number;
70
- }
@@ -1,10 +0,0 @@
1
- import { AuthMethod } from './auth-types';
2
- /** Stored repeat-login info (method + masked identifier). */
3
- export interface StoredRepeatLogin {
4
- /** The authentication method used in the previous login (e.g. `'phone'`, `'email'`, `'google'`). */
5
- method: AuthMethod;
6
- /** Partially masked identifier shown to the user (e.g. `"****1234"` or `"j***@example.com"`). */
7
- maskedIdentifier: string;
8
- /** Unix epoch (ms) when this login record was stored. Used for expiry checks. */
9
- timestamp: number;
10
- }
@@ -1,122 +0,0 @@
1
- import { AuthStep, SSOSession, UserType } from './auth-types';
2
- /** Identifier type for OTP / profile steps. */
3
- export type IdentifierType = 'phone' | 'email';
4
- /** Full state for the auth flow. */
5
- export interface AuthFlowState {
6
- step: AuthStep;
7
- /** Previous step for goBack. */
8
- lastStep: AuthStep;
9
- /** Indian (+91) vs Foreign (non +91); drives layout and OTP routing. */
10
- userType: UserType;
11
- /** Current identifier value (phone or email) when in OTP or signup. */
12
- identifierValue: string;
13
- /** Type of identifier (phone vs email). */
14
- identifierType: IdentifierType;
15
- /** Masked value for display (e.g. "+91 9825910X0X"). */
16
- maskedRecipient: string;
17
- /** For SIGNUP_DETAILS (Indian): which field to collect (phone or email). */
18
- signupCollectField: IdentifierType;
19
- /** For REPEAT_LOGIN: last used method label. */
20
- lastMethod: string;
21
- /** Set when step is AUTHENTICATED. */
22
- session: SSOSession | null;
23
- /** Foreign flow: phone value when user entered phone before signup details. */
24
- pendingPhone: string;
25
- /** Foreign flow: signup form data for completeProfile after OTP verify. */
26
- pendingFullName: string;
27
- pendingEmail: string;
28
- }
29
- /** Pure reducer actions. */
30
- export type AuthFlowAction = {
31
- type: 'SET_SESSION';
32
- session: SSOSession;
33
- } | {
34
- type: 'SET_STEP_REPEAT_LOGIN';
35
- lastMethod: string;
36
- maskedIdentifier: string;
37
- } | {
38
- type: 'SET_STEP_METHOD_SELECT';
39
- } | {
40
- type: 'SET_STEP_PHONE_ENTRY';
41
- } | {
42
- type: 'SET_STEP_EMAIL_ENTRY';
43
- } | {
44
- type: 'SET_STEP_OTP_VERIFICATION';
45
- userType: UserType;
46
- identifierType: IdentifierType;
47
- value: string;
48
- maskedValue: string;
49
- /** Foreign flow: for completeProfile after OTP. */
50
- pendingFullName?: string;
51
- pendingEmail?: string;
52
- pendingPhone?: string;
53
- } | {
54
- type: 'SET_STEP_SIGNUP_DETAILS';
55
- userType: UserType;
56
- /** Indian: which field to collect (phone or email). Foreign: ignored. */
57
- signupCollectField: IdentifierType;
58
- /** Foreign only: phone value when user entered phone before signup. */
59
- pendingPhone?: string;
60
- /** When coming from identifier entry (foreign): preserve for later OTP. */
61
- identifierType?: IdentifierType;
62
- identifierValue?: string;
63
- maskedRecipient?: string;
64
- } | {
65
- type: 'SET_STEP_PROVIDER_PENDING';
66
- } | {
67
- type: 'SET_STEP_AUTHENTICATED';
68
- session: SSOSession;
69
- } | {
70
- type: 'GO_BACK';
71
- } | {
72
- type: 'RESET';
73
- } | {
74
- type: 'SIGN_OUT';
75
- };
76
- /** Provider config slice exposed to flow for Google/Apple wiring. */
77
- export interface AuthFlowProviderConfig {
78
- google?: {
79
- clientId: string;
80
- enableOneTap?: boolean;
81
- };
82
- apple?: {
83
- clientId: string;
84
- redirectUri: string;
85
- };
86
- }
87
- /** Async actions that perform I/O and dispatch to the flow reducer. */
88
- export interface AuthFlowActions {
89
- selectMethod: (method: 'phone' | 'email' | 'google' | 'apple') => void;
90
- /** From REPEAT_LOGIN: continue with last used method. */
91
- continueWithLastMethod: () => void;
92
- submitIdentifier: (data: {
93
- phone?: string;
94
- email?: string;
95
- }) => void;
96
- /** SIGNUP_DETAILS step: submit name + phone/email, then OTP (foreign) or complete (Indian). */
97
- submitSignupDetails: (data: {
98
- fullName: string;
99
- phone?: string;
100
- email?: string;
101
- }) => void;
102
- verifyOtp: (otp: string) => void;
103
- resendOtp: () => void;
104
- providerCallback: (params: {
105
- provider: 'google' | 'apple';
106
- credential: string;
107
- }) => void;
108
- goBack: () => void;
109
- reset: () => void;
110
- signOut: () => void;
111
- }
112
- /** Auth flow context value provided by SSOAuthProvider. */
113
- export interface AuthFlowContextValue {
114
- state: AuthFlowState;
115
- actions: AuthFlowActions;
116
- /** Session when step is AUTHENTICATED. */
117
- session: SSOSession | null;
118
- /** True while step is CHECKING_SESSION. */
119
- isLoading: boolean;
120
- /** Provider config for Google/Apple (One Tap, Sign-In button). */
121
- providerConfig: AuthFlowProviderConfig | undefined;
122
- }
@@ -1,68 +0,0 @@
1
- import { KeyboardEvent } from 'react';
2
- import { Control, FieldValues } from 'react-hook-form';
3
- /** Base props shared by RHF form field components. */
4
- export interface BaseFormFieldProps {
5
- /** Field name used by react-hook-form for registration and validation. */
6
- name: string;
7
- /** Visible label rendered above or beside the input. */
8
- label?: string;
9
- /** Placeholder text shown when the input is empty. */
10
- placeholder?: string;
11
- /** Whether the field is required for form submission. */
12
- required?: boolean;
13
- /** Whether the field is disabled (non-interactive). */
14
- disabled?: boolean;
15
- /** Additional CSS class name(s) applied to the field wrapper. */
16
- className?: string;
17
- /** Validation error message to display below the input. */
18
- error?: string;
19
- /** Supplementary helper text shown below the input when there is no error. */
20
- helperText?: string;
21
- /** Focus this field when form/screen opens (PRODUCT_PROTOCOLS #26). */
22
- autoFocus?: boolean;
23
- }
24
- /** Props for the text/email/number input field component. */
25
- export interface RHFInputFieldProps extends BaseFormFieldProps {
26
- /** HTML input type. Allowed: `'text'`, `'email'`, `'password'`, `'number'`, `'tel'`, `'url'`, `'search'`. */
27
- type?: 'text' | 'email' | 'password' | 'number' | 'tel' | 'url' | 'search';
28
- /** HTML `autocomplete` attribute value (e.g. `'email'`, `'tel'`). */
29
- autoComplete?: string;
30
- /** Maximum character length enforced on the input. */
31
- maxLength?: number;
32
- /** Minimum character length enforced on the input. */
33
- minLength?: number;
34
- /** Regex pattern string for native HTML validation. */
35
- pattern?: string;
36
- /** react-hook-form `Control` instance. When omitted, the field uses the nearest `FormProvider`. */
37
- control?: Control<FieldValues>;
38
- /** Called when a key is pressed while the input is focused. */
39
- onKeyDown?: (event: KeyboardEvent<HTMLInputElement>) => void;
40
- /** When true, restricts input to numeric characters only. */
41
- numericOnly?: boolean;
42
- }
43
- /** Props for RHF wrapper around DoctPhoneInput (docthub-core-components). */
44
- export interface RHFDoctPhoneInputFieldProps extends BaseFormFieldProps {
45
- /** ISO 3166-1 alpha-2 country code pre-selected in the phone input (e.g. `'IN'`, `'US'`). */
46
- defaultCountry?: string;
47
- /** Display variant: `'default'` shows full country selector, `'flag'` shows flag icon only. */
48
- variant?: 'default' | 'flag';
49
- /** react-hook-form `Control` instance. When omitted, the field uses the nearest `FormProvider`. */
50
- control?: Control<FieldValues>;
51
- }
52
- /** Props for the OTP input field component. */
53
- export interface RHFOtpInputFieldProps extends BaseFormFieldProps {
54
- /** Number of OTP digit boxes to render. @default 6 */
55
- length?: number;
56
- /** Input type for each OTP box: `'text'`, `'number'`, or `'password'` (masked). */
57
- type?: 'text' | 'number' | 'password';
58
- /** Focus the first OTP box on mount. */
59
- autoFocus?: boolean;
60
- /** Automatically trigger submission when all boxes are filled. */
61
- autoSubmit?: boolean;
62
- /** Called with the complete OTP string once all boxes are filled. */
63
- onComplete?: (otp: string) => void;
64
- /** CSS class name(s) applied to each individual OTP input box. */
65
- inputClassName?: string;
66
- /** react-hook-form `Control` instance. When omitted, the field uses the nearest `FormProvider`. */
67
- control?: Control<FieldValues>;
68
- }
@@ -1,20 +0,0 @@
1
- /**
2
- * Central export file for all types and interfaces.
3
- * Import types from here: import type { RHFInputFieldProps } from '@/types';
4
- */
5
- export * from './auth-api-adapter';
6
- export * from './auth-layout-types';
7
- export * from './auth-provider';
8
- export * from './auth-types';
9
- export * from './device-detection';
10
- export * from './flow';
11
- export * from './forms';
12
- export * from './layout';
13
- export * from './layout-presets';
14
- export * from './login-form';
15
- export * from './main-login';
16
- export * from './otp-verification';
17
- export * from './pages';
18
- export * from './repeat-login';
19
- export * from './signup-form';
20
- export * from './sso-session';
@@ -1,24 +0,0 @@
1
- import { AuthLayoutAlign, AuthLayoutMaxWidth, AuthLayoutVariant } from './auth-layout-types';
2
- /** Layout type: two-panel with slider vs single centered column. */
3
- export type LayoutType = 'withSlider' | 'standalone';
4
- /**
5
- * Named presets for auth screens. Kept minimal to avoid preset explosion.
6
- * Add new presets only for distinct layout structures, not for auth methods.
7
- */
8
- export type LayoutPresetName = 'login' | 'signup' | 'verification' | '';
9
- /**
10
- * Structure-only config derived from a preset.
11
- * Used by AuthLayout to render the correct shell (slider, width, alignment).
12
- */
13
- export interface LayoutPresetConfig {
14
- /** Whether to show the two-panel slider (e.g. login) or standalone column. */
15
- layoutType: LayoutType;
16
- /** Mobile vs desktop spacing/breakpoints. */
17
- variant: AuthLayoutVariant;
18
- /** Max width of the content area. */
19
- maxWidth: AuthLayoutMaxWidth;
20
- /** Constrain main content to 320px when 'sm'. */
21
- contentWidth: 'sm' | 'default';
22
- /** Title/description alignment. */
23
- align: AuthLayoutAlign;
24
- }
@@ -1,57 +0,0 @@
1
- import { ReactNode } from 'react';
2
- /** Props for the ImageSlider component. */
3
- export interface ImageSliderProps {
4
- /** Array of image URLs to display */
5
- images: string[];
6
- /** Auto-play interval in milliseconds (0 to disable) */
7
- autoPlayInterval?: number;
8
- /** Additional className for the root container */
9
- className?: string;
10
- /** Whether to hide the built-in slider indicators */
11
- hideIndicators?: boolean;
12
- /** Optional callback fired whenever the active slide changes */
13
- onSlideChange?: (index: number) => void;
14
- /** Controlled active index (makes component controlled) */
15
- activeIndex?: number;
16
- /** Callback for manual slide navigation in controlled mode */
17
- onNavigate?: (index: number) => void;
18
- }
19
- /**
20
- * Props for the MainLayout component.
21
- * Two-panel auth page: left panel (marketing/slider), right panel (auth content).
22
- */
23
- export interface MainLayoutProps {
24
- /** Array of image URLs for the slider */
25
- sliderImages?: string[];
26
- /** Auto-play interval for slider in milliseconds (0 to disable) */
27
- sliderAutoPlayInterval?: number;
28
- /** Call-to-action text displayed above the image card. Set to null to hide */
29
- ctaText?: ReactNode | null;
30
- /** Per-slide title/CTA (overrides ctaText when provided; uses active slide index) */
31
- sliderTitles?: (ReactNode | string)[] | undefined;
32
- /** Additional className for the root container */
33
- className?: string;
34
- /** Additional className for the marketing panel (left side) */
35
- marketingClassName?: string;
36
- /** Additional className for the content panel (right side) */
37
- contentClassName?: string;
38
- /** Main authentication content (typically AuthLayout.Root with slots) */
39
- children: ReactNode;
40
- }
41
- /** Props for the MarketingPanel component (left side). */
42
- export interface MarketingPanelProps {
43
- /** Array of image URLs for the slider */
44
- sliderImages: string[];
45
- /** Auto-play interval for slider in milliseconds */
46
- sliderAutoPlayInterval: number;
47
- /** Active slide index (controlled) */
48
- activeSlideIndex: number;
49
- /** Callback when slide changes */
50
- onSlideChange: (index: number) => void;
51
- /** Call-to-action text */
52
- ctaText?: ReactNode | null;
53
- /** Per-slide title/CTA (overrides ctaText when provided) */
54
- sliderTitles?: (ReactNode | string)[] | undefined;
55
- /** Additional className */
56
- className?: string;
57
- }
@@ -1,56 +0,0 @@
1
- import { UseFormReturn } from 'react-hook-form';
2
- import { z } from 'zod';
3
- import { loginEmailFormSchema, loginPhoneFormSchema } from '../validations';
4
- /** Login mode: phone number or email */
5
- export type LoginEntryMode = 'phone' | 'email';
6
- /** Form values for phone-based login, inferred from the Zod schema. */
7
- export type PhoneFormValues = z.infer<typeof loginPhoneFormSchema>;
8
- /** Form values for email-based login, inferred from the Zod schema. */
9
- export type EmailFormValues = z.infer<typeof loginEmailFormSchema>;
10
- /** Discriminated union of phone or email login form values. */
11
- export type LoginEntryFormValues = PhoneFormValues | EmailFormValues;
12
- /** Payload when login entry form is valid (phone or email). */
13
- export type LoginEntrySubmitData = {
14
- phone?: string;
15
- email?: string;
16
- };
17
- /**
18
- * Params passed to onSuccess after submitApi resolves.
19
- * Lets the consumer redirect to OTP with mode and recipient (for recipientDisplay) without storing them in refs.
20
- */
21
- export interface LoginEntrySuccessParams {
22
- /** Current login entry mode (phone or email). */
23
- mode: LoginEntryMode;
24
- /** Submitted phone or email string; use for OTP page recipientDisplay or verify API. */
25
- recipient: string;
26
- }
27
- export interface UseLoginEntryFormOptions {
28
- mode: LoginEntryMode;
29
- /**
30
- * Sync callback with valid form data. Used when parent owns API (e.g. AuthFlow passes actions.submitIdentifier).
31
- * Ignored when submitApi is provided.
32
- */
33
- onSubmit?: ((data: LoginEntrySubmitData) => void) | undefined;
34
- /**
35
- * When provided, hook runs business logic: validate → call submitApi(data) → onSuccess(params).
36
- * Use from consumer (e.g. Next.js): submitApi = sendOtp, onSuccess = (params) => router.push(`/otp?mode=${params.mode}&recipient=${encodeURIComponent(params.recipient)}`).
37
- */
38
- submitApi?: (data: LoginEntrySubmitData) => Promise<void>;
39
- /** Called after submitApi resolves successfully; receives mode and recipient for OTP redirect/display. */
40
- onSuccess?: (params: LoginEntrySuccessParams) => void;
41
- /** Called when submitApi rejects or throws. */
42
- onError?: (error: unknown) => void;
43
- }
44
- /** Return value of the `useLoginEntryForm` hook, providing form state and mode info. */
45
- export interface UseLoginEntryFormReturn {
46
- /** react-hook-form methods bound to the current login mode's schema. */
47
- methods: UseFormReturn<LoginEntryFormValues>;
48
- /** Submit handler to pass to the form's `onSubmit`. Validates and dispatches the login data. */
49
- handleSubmit: (data: LoginEntryFormValues) => void;
50
- /** True when the current mode is `'phone'`; use for conditional field rendering. */
51
- isPhone: boolean;
52
- /** True when current form values pass validation (for disabling Continue until valid – edge cases 3, 4). */
53
- isFormValid: (data: LoginEntryFormValues) => boolean;
54
- /** True while submitApi is in flight. Use to disable Continue button and show loading. */
55
- isSubmitting: boolean;
56
- }
@@ -1,40 +0,0 @@
1
- /** Handlers exposed by the main auth page (method select). */
2
- export interface MainAuthPageHandlers {
3
- /** Called when the user selects "Continue with Mobile". */
4
- onContinueWithMobile: () => void;
5
- /** Called when the user selects "Continue with Email". */
6
- onContinueWithEmail: () => void;
7
- /** Called when the user selects "Continue with Google". */
8
- onContinueWithGoogle: () => void;
9
- /** Called when the user selects "Continue with Apple". */
10
- onContinueWithApple: () => void;
11
- }
12
- /** Config for lib-handled Google sign-in. When set, the lib runs the OAuth flow and calls onCredential. */
13
- export interface MainLoginGoogleProviderConfig {
14
- /** Google OAuth 2.0 client ID. */
15
- clientId: string;
16
- /** Called with ID token (One Tap) or auth code (button popup). Send to your backend to verify. */
17
- onCredential: (credential: string) => void;
18
- /** Enable Google One Tap prompt for automatic sign-in. */
19
- enableOneTap?: boolean;
20
- }
21
- /** Config for lib-handled Apple sign-in (stub). When set, the lib will run the flow and call onCredential when implemented. */
22
- export interface MainLoginAppleProviderConfig {
23
- /** Apple Services ID (client ID) configured in the Apple Developer portal. */
24
- clientId: string;
25
- /** OAuth redirect URI registered with Apple for the sign-in flow. */
26
- redirectUri: string;
27
- /** Called with the Apple identity token after a successful sign-in. Send to your backend to verify. */
28
- onCredential: (credential: string) => void;
29
- }
30
- /** Optional provider config so the lib handles Google/Apple API calls. */
31
- export interface MainLoginPageProvidersConfig {
32
- /** Google sign-in configuration. When set, the lib handles the Google OAuth flow. */
33
- google?: MainLoginGoogleProviderConfig;
34
- /** Apple sign-in configuration. When set, the lib handles the Apple OAuth flow. */
35
- apple?: MainLoginAppleProviderConfig;
36
- }
37
- /** Options for useMainAuthPageHandlers: optional callback overrides + optional provider config for lib-handled OAuth. */
38
- export type UseMainAuthPageHandlersOptions = Partial<MainAuthPageHandlers> & {
39
- providers?: MainLoginPageProvidersConfig;
40
- };