@nibssplc/cams-sdk-react 0.0.1-beta.9 → 0.0.1-beta.91

package/README.md

@@ -1,160 +1,295 @@
-# NIBSS CAMS SDK - React
+# @nibssplc/cams-sdk-react
 
-React hooks and components for NIBSS CAMS SDK with support for both popup and redirect authentication flows.
+React hooks and components for NIBSS CAMS SDK with support for both regular CAMS authentication and Azure AD MSAL integration.
 
 ## Installation
 
 ```bash
 npm install @nibssplc/cams-sdk-react
+```
 
-# For MSAL redirect support (optional)
+For MSAL mode, also install:
+```bash
 npm install @azure/msal-browser @azure/msal-react
 ```
 
-## Usage
+## Features
+
+- ⚛️ React hooks for authentication
+- 🔄 Unified provider supporting both REGULAR and MSAL modes
+- 🎨 Pre-built UI components (login page, MFA gate)
+- 🛡️ Protected route component
+- 🎯 TypeScript support
+- 🪝 Context-based state management
+- 📱 Next.js compatible
 
-### Popup Authentication (Default)
+## Quick Start
+
+### MSAL Mode (Azure AD + MFA)
 
 ```tsx
-import { CAMSProvider, useCAMSAuth } from '@nibssplc/cams-sdk-react';
+import { UnifiedCAMSProvider, useCAMSContext } from '@nibssplc/cams-sdk-react';
+
+const msalConfig = {
+  auth: {
+    clientId: 'your-client-id',
+    authority: 'https://login.microsoftonline.com/your-tenant-id',
+    redirectUri: window.location.origin
+  }
+};
 
 function App() {
   return (
-    <CAMSProvider>
-      <LoginComponent />
-    </CAMSProvider>
+    <UnifiedCAMSProvider
+      mode="MSAL"
+      appCode="your-app-guid"
+      msalConfig={msalConfig}
+      MFAEndpoint="https://your-mfa-endpoint.com"
+    >
+      <YourApp />
+    </UnifiedCAMSProvider>
   );
 }
 
-function LoginComponent() {
-  const { login, logout, isAuthenticated, isLoading } = useCAMSAuth();
+function YourApp() {
+  const { login, logout, isAuthenticated, userProfile } = useCAMSContext();
 
-  const handleLogin = () => {
-    login({
-      camsUrl: 'https://your-cams-instance.com/auth',
-      messageOrigin: 'your-cams-instance.com',
-      windowWidth: 500,
-      windowHeight: 600,
-    });
-  };
+  return (
+    <div>
+      {isAuthenticated ? (
+        <>
+          <p>Welcome, {userProfile?.name}</p>
+          <button onClick={logout}>Logout</button>
+        </>
+      ) : (
+        <button onClick={login}>Login</button>
+      )}
+    </div>
+  );
+}
+```
 
-  if (isAuthenticated) {
-    return <button onClick={logout}>Logout</button>;
-  }
+### REGULAR Mode (Popup Authentication)
 
+```tsx
+import { UnifiedCAMSProvider, useCAMSContext } from '@nibssplc/cams-sdk-react';
+
+function App() {
   return (
-    <button onClick={handleLogin} disabled={isLoading}>
-      {isLoading ? 'Logging in...' : 'Login'}
-    </button>
+    <UnifiedCAMSProvider
+      mode="REGULAR"
+      appCode="your-app-guid"
+      camsUrl="https://your-cams-url.com"
+      messageOrigin="https://your-cams-url.com"
+      windowWidth={500}
+      windowHeight={600}
+    >
+      <YourApp />
+    </UnifiedCAMSProvider>
   );
 }
 ```
 
-### MSAL Redirect Authentication with MFA
+## Components
+
+### UnifiedCAMSProvider
+
+Main provider component supporting both authentication modes.
+
+**Props (MSAL Mode):**
+```tsx
+interface MSALProviderProps {
+  mode: "MSAL";
+  appCode: string;
+  msalConfig: Configuration;
+  msalInstance?: PublicClientApplication;
+  MFAEndpoint: string;
+  children: React.ReactNode;
+}
+```
 
+**Props (REGULAR Mode):**
 ```tsx
-import { CAMSMSALProvider, useCAMSMSALAuth } from '@nibssplc/cams-sdk-react';
+interface RegularProviderProps {
+  mode: "REGULAR";
+  appCode: string;
+  camsUrl: string;
+  messageOrigin: string;
+  windowWidth: number;
+  windowHeight: number;
+  authTimeout?: number;
+  debug?: boolean;
+  children: React.ReactNode;
+}
+```
 
-const msalConfig = {
-  auth: {
-    clientId: 'your-client-id',
-    authority: 'https://login.microsoftonline.com/your-tenant-id',
-    redirectUri: window.location.origin,
-  },
-};
+### DefaultLoginPage
+
+Pre-built login page with Microsoft and AD authentication options.
+
+```tsx
+import { DefaultLoginPage } from '@nibssplc/cams-sdk-react';
 
 function App() {
   return (
-    <CAMSMSALProvider msalConfig={msalConfig}>
-      <LoginComponent />
-    </CAMSMSALProvider>
+    <UnifiedCAMSProvider mode="MSAL" {...config}>
+      <DefaultLoginPage />
+    </UnifiedCAMSProvider>
   );
 }
+```
 
-function LoginComponent() {
-  const { 
-    login, 
-    logout, 
-    completeMFA,
-    isAuthenticated, 
-    isLoading, 
-    isMFAPending,
-    account 
-  } = useCAMSMSALAuth({
-    scopes: ['openid', 'profile', 'email'],
-    mfaUrl: 'https://your-mfa-page.com/verify',
-    onAuthSuccess: (token) => console.log('Auth complete:', token),
-    onMFARequired: (msalToken, account) => console.log('MFA required for:', account.name),
-  });
-
-  // Handle MFA completion (call this after MFA verification)
-  const handleMFAComplete = (mfaToken: string) => {
-    completeMFA(mfaToken);
-  };
-
-  if (isAuthenticated) {
-    return (
-      <div>
-        <p>Welcome, {account?.name}</p>
-        <button onClick={logout}>Logout</button>
-      </div>
-    );
-  }
+### MFAGate
 
-  if (isMFAPending) {
-    return <div>Completing MFA verification...</div>;
-  }
+Component that enforces MFA completion before rendering children.
 
+```tsx
+import { MFAGate } from '@nibssplc/cams-sdk-react';
+
+function ProtectedContent() {
   return (
-    <button onClick={login} disabled={isLoading}>
-      {isLoading ? 'Redirecting...' : 'Login with Azure AD'}
-    </button>
+    <MFAGate>
+      <YourProtectedContent />
+    </MFAGate>
   );
 }
 ```
 
-## API Reference
+### ProtectedRoute
 
-### useCAMSMSALAuth
+Route wrapper that requires authentication.
+
+```tsx
+import { ProtectedRoute } from '@nibssplc/cams-sdk-react';
+
+function App() {
+  return (
+    <ProtectedRoute>
+      <YourProtectedPage />
+    </ProtectedRoute>
+  );
+}
+```
+
+## Hooks
+
+### useCAMSContext
+
+Access authentication state and methods.
+
+```tsx
+import { useCAMSContext } from '@nibssplc/cams-sdk-react';
+
+function MyComponent() {
+  const {
+    isAuthenticated,
+    isLoading,
+    userProfile,
+    login,
+    logout,
+    error,
+    authMode
+  } = useCAMSContext();
 
-Hook for MSAL redirect authentication.
+  return (
+    <div>
+      {isAuthenticated && <p>Hello, {userProfile?.name}</p>}
+    </div>
+  );
+}
+```
+
+**Return Values:**
+
+| Property | Type | Description |
+|----------|------|-------------|
+| `isAuthenticated` | boolean | Authentication status |
+| `isLoading` | boolean | Loading state |
+| `userProfile` | Profile \| null | User profile data |
+| `login` | function | Trigger login flow |
+| `logout` | function | Logout user |
+| `error` | Error \| null | Authentication error |
+| `authMode` | 'REGULAR' \| 'MSAL' | Current auth mode |
+| `requiresMFA` | boolean | MFA required (MSAL only) |
+
+### useCAMSAuth
+
+Hook for REGULAR mode authentication.
 
 ```tsx
-const {
-  login,
-  logout,
-  isAuthenticated,
-  isLoading,
-  error,
-  token,
-  profile,
-  account
-} = useCAMSMSALAuth(options);
+import { useCAMSAuth } from '@nibssplc/cams-sdk-react';
+
+const auth = useCAMSAuth({
+  appCode: 'your-app-guid',
+  camsUrl: 'https://your-cams-url.com',
+  messageOrigin: 'https://your-cams-url.com',
+  windowWidth: 500,
+  windowHeight: 600
+});
 ```
 
-**Options:**
-- `scopes?: string[]` - OAuth scopes (default: `['openid', 'profile', 'email']`)
-- `mfaUrl?: string` - Custom MFA page URL for redirect after MSAL login
-- `onAuthSuccess?: (token: string) => void` - Success callback (after MFA completion)
-- `onAuthError?: (error: CAMSError) => void` - Error callback
-- `onTokenExpired?: () => void` - Token expiration callback
-- `onMFARequired?: (msalToken: string, account: AccountInfo) => void` - MFA required callback
+### useCAMSMSALAuth
+
+Hook for MSAL mode authentication.
 
-**Returns:**
-- `completeMFA: (mfaToken: string) => void` - Complete MFA verification
-- `isMFAPending: boolean` - Whether MFA verification is pending
+```tsx
+import { useCAMSMSALAuth } from '@nibssplc/cams-sdk-react';
 
-### CAMSMSALProvider
+const auth = useCAMSMSALAuth({
+  appCode: 'your-app-guid',
+  MFAEndpoint: 'https://your-mfa-endpoint.com'
+});
+```
 
-Provider component for MSAL integration.
+## Next.js Integration
 
 ```tsx
-<CAMSMSALProvider msalConfig={config} msalInstance={instance}>
-  {children}
-</CAMSMSALProvider>
+// app/providers.tsx
+'use client';
+
+import { UnifiedCAMSProvider } from '@nibssplc/cams-sdk-react';
+
+export function Providers({ children }: { children: React.ReactNode }) {
+  return (
+    <UnifiedCAMSProvider mode="MSAL" {...config}>
+      {children}
+    </UnifiedCAMSProvider>
+  );
+}
+
+// app/layout.tsx
+import { Providers } from './providers';
+
+export default function RootLayout({ children }) {
+  return (
+    <html>
+      <body>
+        <Providers>{children}</Providers>
+      </body>
+    </html>
+  );
+}
+```
+
+## Styling
+
+Components use Tailwind CSS. Ensure Tailwind is configured in your project:
+
+```bash
+npm install -D tailwindcss
+npx tailwindcss init
 ```
 
-**Props:**
-- `msalConfig: Configuration` - MSAL configuration object
-- `msalInstance?: PublicClientApplication` - Optional pre-configured MSAL instance
-- `children: ReactNode` - Child components
+## Examples
+
+See the [examples](../../examples) directory for complete implementations:
+- `integrated-mfa-example.tsx` - MSAL mode with MFA
+- `popup-auth-example.tsx` - Regular popup authentication
+
+## License
+
+MIT
+
+## Author
+
+NIBSS PLC, Caleb Boluwade

package/dist/components/ADLoginModal.d.ts

@@ -0,0 +1,7 @@
+interface ADLoginModalProps {
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+    onLogin: (credentials: Credentials) => Promise<void>;
+}
+export declare const ADLoginModal: ({ open, onOpenChange, onLogin, }: ADLoginModalProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/AuthFailureAnimation.d.ts

@@ -0,0 +1,5 @@
+interface AuthFailureAnimationProps {
+    onComplete?: () => void;
+}
+export declare const AuthFailureAnimation: ({ onComplete }: AuthFailureAnimationProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/AuthSuccessAnimation.d.ts

@@ -0,0 +1,5 @@
+interface AuthSuccessAnimationProps {
+    onComplete?: () => void;
+}
+export declare const AuthSuccessAnimation: ({ onComplete }: AuthSuccessAnimationProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/CAMSMSALProvider.d.ts

@@ -1,8 +1,16 @@
-import { ReactNode } from 'react';
-import { PublicClientApplication, Configuration } from '@azure/msal-browser';
-export interface CAMSMSALProviderProps {
-    children: ReactNode;
+import React from "react";
+import { PublicClientApplication, Configuration } from "@azure/msal-browser";
+import { Profile } from "@nibssplc/cams-sdk";
+import { UseCAMSMSALAuthReturn, UseCAMSMSALAuthOptions } from "../hooks/useCAMSMSALAuth";
+interface CAMSMSALContextValue extends UseCAMSMSALAuthReturn {
+    userProfile: Profile | null;
+    setUserProfile: (profile: Profile | null) => void;
+}
+export interface CAMSMSALProviderProps extends UseCAMSMSALAuthOptions {
+    children: React.ReactNode;
     msalConfig: Configuration;
     msalInstance?: PublicClientApplication;
 }
-export declare function CAMSMSALProvider({ children, msalConfig, msalInstance }: CAMSMSALProviderProps): import("react/jsx-runtime").JSX.Element;
+export declare function CAMSMSALProvider(props: Readonly<CAMSMSALProviderProps>): import("react/jsx-runtime").JSX.Element;
+export declare function useCAMSMSALContext(): CAMSMSALContextValue;
+export {};

package/dist/components/CAMSProvider.d.ts

@@ -1,13 +1,13 @@
-import { ReactNode } from 'react';
-import { CAMSConfig } from '@nibssplc/cams-sdk';
+import React from "react";
+import { Profile } from '@nibssplc/cams-sdk';
 import { UseCAMSAuthReturn, UseCAMSAuthOptions } from '../hooks/useCAMSAuth';
 interface CAMSContextValue extends UseCAMSAuthReturn {
-    defaultConfig?: Partial<CAMSConfig>;
+    userProfile: Profile | null;
+    setUserProfile: (profile: Profile | null) => void;
 }
 export interface CAMSProviderProps extends UseCAMSAuthOptions {
-    children: ReactNode;
-    defaultConfig?: Partial<CAMSConfig>;
+    children: React.ReactNode;
 }
-export declare function CAMSProvider({ children, defaultConfig, ...authOptions }: CAMSProviderProps): import("react/jsx-runtime").JSX.Element;
+export declare function CAMSProvider({ children, ...authOptions }: Readonly<CAMSProviderProps>): import("react/jsx-runtime").JSX.Element;
 export declare function useCAMSContext(): CAMSContextValue;
 export {};

package/dist/components/ClientOnly.d.ts

@@ -0,0 +1,6 @@
+interface ClientOnlyProps {
+    children: React.ReactNode;
+    fallback?: React.ReactNode;
+}
+declare const ClientOnly: ({ children, fallback }: ClientOnlyProps) => import("react/jsx-runtime").JSX.Element;
+export default ClientOnly;

package/dist/components/CoreFIDO.d.ts

@@ -0,0 +1,20 @@
+/**
+ * Initiates the WebAuthn registration process.
+ * It takes server-provided options, converts them for the browser API,
+ * calls navigator.credentials.create(), and then converts the result
+ * back into a JSON-friendly format.
+ *
+ * @param options - The PublicKeyCredentialCreationOptions from the server.
+ * @returns A promise that resolves to a JSON-serializable representation of the PublicKeyCredential.
+ */
+export declare function register(options: PublicKeyCredentialCreationOptions): Promise<PublicKeyCredential>;
+/**
+ * Initiates the WebAuthn authentication process.
+ * It takes server-provided options, converts them for the browser API,
+ * calls navigator.credentials.get(), and then converts the result
+ * back into a JSON-friendly format.
+ *
+ * @param options - The PublicKeyCredentialRequestOptions from the server.
+ * @returns A promise that resolves to a JSON-serializable representation of the PublicKeyCredential.
+ */
+export declare function authenticate(options: PublicKeyCredentialRequestOptions): Promise<PublicKeyCredential>;

package/dist/components/DefaultLoginPage.d.ts

@@ -0,0 +1,2 @@
+declare const DefaultLoginPage: () => import("react/jsx-runtime").JSX.Element;
+export default DefaultLoginPage;

package/dist/components/ErrorFallback.d.ts

@@ -0,0 +1,5 @@
+interface ErrorFallbackProps {
+    message: string;
+}
+declare const ErrorFallback: ({ message }: ErrorFallbackProps) => import("react/jsx-runtime").JSX.Element;
+export default ErrorFallback;

package/dist/components/GenericOTP.d.ts

@@ -0,0 +1,13 @@
+interface GenericOTPProps {
+    value: string;
+    setValue: (v: string) => void;
+    setLoading?: React.Dispatch<React.SetStateAction<boolean>>;
+    isDisabled: boolean;
+    onChangeOTP: (val: string) => void;
+    fieldName: "AuthenticatorCode" | "EmailOTP";
+    attemptCount?: number;
+    remainingAttempts?: number;
+    isMaxAttemptsReached?: boolean;
+}
+export declare const GenericOTPVerifier: ({ value, setValue, setLoading, onChangeOTP, fieldName, attemptCount, remainingAttempts, isMaxAttemptsReached, }: GenericOTPProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Loading.d.ts

@@ -0,0 +1,6 @@
+import "ldrs/waveform";
+import "ldrs/react/Waveform.css";
+declare const LoadingSpinner: ({ loadingText }: {
+    loadingText?: string;
+}) => import("react/jsx-runtime").JSX.Element;
+export default LoadingSpinner;

package/dist/components/MFAGate.d.ts

@@ -0,0 +1,12 @@
+import z from "zod";
+declare const MFAEndpointsSchema: z.ZodObject<{
+    ValidateMFA: z.ZodURL;
+}, z.core.$strip>;
+export type MFAEndpoints = z.infer<typeof MFAEndpointsSchema>;
+interface MFAGateProps {
+    children: React.ReactNode;
+    fallback?: React.ReactNode;
+    MFAEndpoints?: MFAEndpoints;
+}
+declare const MFAGate: ({ children, fallback, MFAEndpoints, }: MFAGateProps) => string | number | bigint | boolean | Iterable<import("react").ReactNode> | Promise<string | number | bigint | boolean | import("react").ReactPortal | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | Iterable<import("react").ReactNode> | null | undefined> | import("react/jsx-runtime").JSX.Element | null;
+export default MFAGate;

package/dist/components/MFAOptions.d.ts

@@ -0,0 +1,7 @@
+interface MFAOptionsProps {
+    onComplete?: (success: boolean) => void;
+    onAuthFailed?: () => void;
+    MFAEndpoint?: string;
+}
+declare const MFAOptions: ({ onComplete, onAuthFailed, MFAEndpoint, }?: MFAOptionsProps) => import("react/jsx-runtime").JSX.Element;
+export default MFAOptions;

package/dist/components/ProtectedRoute.d.ts

@@ -4,4 +4,4 @@ export interface ProtectedRouteProps {
     fallback?: ReactNode;
     redirectTo?: string;
 }
-export declare function ProtectedRoute({ children, fallback, redirectTo }: ProtectedRouteProps): string | number | true | Iterable<React.ReactNode> | import("react/jsx-runtime").JSX.Element | null;
+export declare function ProtectedRoute({ children, fallback, redirectTo }: ProtectedRouteProps): string | number | bigint | true | Iterable<React.ReactNode> | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined> | import("react/jsx-runtime").JSX.Element | null;

package/dist/components/UnifiedCAMSProvider.d.ts

@@ -0,0 +1,22 @@
+import React from "react";
+import { PublicClientApplication, Configuration } from "@azure/msal-browser";
+import { UseCAMSAuthOptions } from "../hooks/useCAMSAuth";
+import { UseCAMSMSALAuthOptions } from "../hooks/useCAMSMSALAuth";
+import { useCAMSContext } from "../context/CAMSContext";
+interface BaseProviderProps {
+    children: React.ReactNode;
+    appCode: string;
+}
+interface RegularProviderProps extends BaseProviderProps, Omit<UseCAMSAuthOptions, "appCode"> {
+    mode: "REGULAR";
+}
+interface MSALProviderProps extends BaseProviderProps, Omit<UseCAMSMSALAuthOptions, "MFAEndpoint"> {
+    mode: "MSAL";
+    msalConfig: Configuration;
+    msalInstance?: PublicClientApplication;
+}
+type UnifiedCAMSProviderProps = RegularProviderProps | MSALProviderProps;
+export declare function UnifiedCAMSProvider(props: UnifiedCAMSProviderProps): import("react/jsx-runtime").JSX.Element;
+export declare const CAMSProvider: (props: Omit<RegularProviderProps, "mode">) => import("react/jsx-runtime").JSX.Element;
+export declare const CAMSMSALProvider: (props: Omit<MSALProviderProps, "mode">) => import("react/jsx-runtime").JSX.Element;
+export { useCAMSContext };

package/dist/components/ui/button.d.ts

@@ -0,0 +1,10 @@
+import * as React from "react";
+import { type VariantProps } from "class-variance-authority";
+declare const buttonVariants: (props?: ({
+    variant?: "link" | "default" | "destructive" | "outline" | "secondary" | "ghost" | null | undefined;
+    size?: "default" | "sm" | "lg" | "icon" | null | undefined;
+} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+declare function Button({ className, variant, size, asChild, ...props }: React.ComponentProps<"button"> & VariantProps<typeof buttonVariants> & {
+    asChild?: boolean;
+}): import("react/jsx-runtime").JSX.Element;
+export { Button, buttonVariants };

package/dist/components/ui/card.d.ts

@@ -0,0 +1,9 @@
+import * as React from "react";
+declare function Card({ className, ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
+declare function CardHeader({ className, ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
+declare function CardTitle({ className, ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
+declare function CardDescription({ className, ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
+declare function CardAction({ className, ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
+declare function CardContent({ className, ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
+declare function CardFooter({ className, ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
+export { Card, CardHeader, CardFooter, CardTitle, CardAction, CardDescription, CardContent, };

package/dist/components/ui/dialog.d.ts

@@ -0,0 +1,15 @@
+import * as React from "react";
+import * as DialogPrimitive from "@radix-ui/react-dialog";
+declare function Dialog({ ...props }: React.ComponentProps<typeof DialogPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
+declare function DialogTrigger({ ...props }: React.ComponentProps<typeof DialogPrimitive.Trigger>): import("react/jsx-runtime").JSX.Element;
+declare function DialogPortal({ ...props }: React.ComponentProps<typeof DialogPrimitive.Portal>): import("react/jsx-runtime").JSX.Element;
+declare function DialogClose({ ...props }: React.ComponentProps<typeof DialogPrimitive.Close>): import("react/jsx-runtime").JSX.Element;
+declare function DialogOverlay({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Overlay>): import("react/jsx-runtime").JSX.Element;
+declare function DialogContent({ className, children, showCloseButton, ...props }: React.ComponentProps<typeof DialogPrimitive.Content> & {
+    showCloseButton?: boolean;
+}): import("react/jsx-runtime").JSX.Element;
+declare function DialogHeader({ className, ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
+declare function DialogFooter({ className, ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
+declare function DialogTitle({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Title>): import("react/jsx-runtime").JSX.Element;
+declare function DialogDescription({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Description>): import("react/jsx-runtime").JSX.Element;
+export { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, };

package/dist/components/ui/form.d.ts

@@ -0,0 +1,24 @@
+import * as React from "react";
+import * as LabelPrimitive from "@radix-ui/react-label";
+import { Slot } from "@radix-ui/react-slot";
+import { type ControllerProps, type FieldPath, type FieldValues } from "react-hook-form";
+declare const Form: <TFieldValues extends FieldValues, TContext = any, TTransformedValues = TFieldValues>(props: import("react-hook-form").FormProviderProps<TFieldValues, TContext, TTransformedValues>) => React.JSX.Element;
+declare const FormField: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ ...props }: ControllerProps<TFieldValues, TName>) => import("react/jsx-runtime").JSX.Element;
+declare const useFormField: () => {
+    invalid: boolean;
+    isDirty: boolean;
+    isTouched: boolean;
+    isValidating: boolean;
+    error?: import("react-hook-form").FieldError;
+    id: string;
+    name: string;
+    formItemId: string;
+    formDescriptionId: string;
+    formMessageId: string;
+};
+declare function FormItem({ className, ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
+declare function FormLabel({ className, ...props }: React.ComponentProps<typeof LabelPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
+declare function FormControl({ ...props }: React.ComponentProps<typeof Slot>): import("react/jsx-runtime").JSX.Element;
+declare function FormDescription({ className, ...props }: React.ComponentProps<"p">): import("react/jsx-runtime").JSX.Element;
+declare function FormMessage({ className, ...props }: React.ComponentProps<"p">): import("react/jsx-runtime").JSX.Element | null;
+export { useFormField, Form, FormItem, FormLabel, FormControl, FormDescription, FormMessage, FormField, };

package/dist/components/ui/input-otp.d.ts

@@ -0,0 +1,11 @@
+import * as React from "react";
+import { OTPInput } from "input-otp";
+declare function InputOTP({ className, containerClassName, ...props }: React.ComponentProps<typeof OTPInput> & {
+    containerClassName?: string;
+}): import("react/jsx-runtime").JSX.Element;
+declare function InputOTPGroup({ className, ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
+declare function InputOTPSlot({ index, className, ...props }: React.ComponentProps<"div"> & {
+    index: number;
+}): import("react/jsx-runtime").JSX.Element;
+declare function InputOTPSeparator({ ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
+export { InputOTP, InputOTPGroup, InputOTPSlot, InputOTPSeparator };