@rationalbloks/frontblok-components 0.1.0

package/dist/index.d.ts

@@ -0,0 +1,256 @@
+import { Component } from 'react';
+import { default as default_2 } from 'react';
+import { ErrorInfo } from 'react';
+import { JSX } from 'react/jsx-runtime';
+import { JSXElementConstructor } from 'react';
+import { ReactElement } from 'react';
+import { ReactNode } from 'react';
+import { ReactPortal } from 'react';
+
+/**
+ * Auth API interface - matches frontblok-auth's authApi.
+ * Components need these methods to work.
+ */
+export declare interface AuthApi {
+    requestPasswordReset: (email: string) => Promise<{
+        message: string;
+        dev_token?: string;
+    }>;
+    resetPassword: (token: string, newPassword: string) => Promise<{
+        message: string;
+    }>;
+    verifyEmail: (token: string) => Promise<{
+        message: string;
+    }>;
+    googleLogin: (credential: string) => Promise<{
+        is_new_user?: boolean;
+    }>;
+}
+
+/**
+ * Auth hook return type - matches useClientAuth from frontblok-auth.
+ */
+export declare interface AuthHook {
+    login: (email: string, password: string) => Promise<boolean>;
+    register: (email: string, password: string, firstName: string, lastName: string) => Promise<boolean>;
+    isLoading: boolean;
+    error: string | null;
+}
+
+export declare const AuthView: default_2.FC<AuthViewProps>;
+
+/**
+ * Props for AuthView which also needs the auth hook and nonce generator.
+ */
+export declare interface AuthViewProps extends ViewProps {
+    /** Auth hook (login, register, isLoading, error) */
+    useAuth: () => AuthHook;
+    /** Generate OAuth nonce for Google login */
+    generateOAuthNonce: () => string;
+}
+
+export declare interface BrandConfig {
+    name: string;
+    logo: string;
+}
+
+/**
+ * Branding configuration passed to components.
+ * Customize the look and feel of auth components.
+ */
+export declare interface Branding {
+    /** App name displayed in headers */
+    appName: string;
+    /** Short tagline for auth pages */
+    tagline: string;
+    /** Single letter for logo icon */
+    logoLetter: string;
+    /** CSS gradient for primary buttons and logo */
+    primaryGradient: string;
+    /** CSS gradient for hover state */
+    primaryGradientHover: string;
+    /** Box shadow for logo */
+    logoShadow: string;
+    /** Route to redirect after login */
+    dashboardRoute: string;
+    /** Success messages */
+    messages: {
+        loginSuccess: string;
+        registerSuccess: string;
+        googleNewUser: string;
+    };
+    /** Security badge text */
+    securityBadge: string;
+}
+
+export declare const ConfirmationModal: default_2.FC<ConfirmationModalProps_2>;
+
+export declare interface ConfirmationModalProps {
+    open: boolean;
+    onClose: () => void;
+    onConfirm: () => void;
+    title: string;
+    message: string | ReactNode;
+    confirmText?: string;
+    cancelText?: string;
+    severity?: ConfirmationModalSeverity;
+    isLoading?: boolean;
+    warning?: string;
+    details?: {
+        label: string;
+        oldValue: string;
+        newValue: string;
+    }[];
+    bulletPoints?: string[];
+}
+
+declare interface ConfirmationModalProps_2 {
+    open: boolean;
+    onClose: () => void;
+    onConfirm: () => void;
+    title: string;
+    message: string | default_2.ReactNode;
+    confirmText?: string;
+    cancelText?: string;
+    severity?: ConfirmationModalSeverity_2;
+    isLoading?: boolean;
+    warning?: string;
+    details?: {
+        label: string;
+        oldValue: string;
+        newValue: string;
+    }[];
+    bulletPoints?: string[];
+}
+
+/**
+ * Props for ConfirmationModal.
+ */
+export declare type ConfirmationModalSeverity = 'info' | 'warning' | 'error' | 'success';
+
+declare type ConfirmationModalSeverity_2 = 'info' | 'warning' | 'error' | 'success';
+
+export declare function createNavbar(config: NavbarConfig): () => JSX.Element;
+
+export declare class ErrorBoundary extends Component<Props, State> {
+    constructor(props: Props);
+    static getDerivedStateFromError(error: Error): Partial<State>;
+    componentDidCatch(error: Error, errorInfo: ErrorInfo): void;
+    resetError: () => void;
+    render(): string | number | bigint | boolean | Iterable<ReactNode> | Promise<string | number | bigint | boolean | ReactPortal | ReactElement<unknown, string | JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | JSX.Element | null | undefined;
+}
+
+/**
+ * Props for ErrorBoundary.
+ */
+export declare interface ErrorBoundaryProps {
+    children: ReactNode;
+    supportEmail?: string;
+}
+
+export declare const ErrorFallback: default_2.FC<ErrorFallbackProps>;
+
+export declare interface ErrorFallbackProps {
+    error: Error | null;
+    errorInfo: default_2.ErrorInfo | null;
+    resetError: () => void;
+    supportEmail: string;
+}
+
+export declare function ForgotPasswordView({ authApi, authRoute }: ForgotPasswordViewProps): JSX.Element;
+
+export declare interface ForgotPasswordViewProps {
+    /** Auth API object with requestPasswordReset method */
+    authApi: {
+        requestPasswordReset: (email: string) => Promise<{
+            dev_token?: string;
+        }>;
+    };
+    /** Route to navigate back to login (default: '/auth') */
+    authRoute?: string;
+}
+
+export declare interface NavbarAuthHookResult {
+    user: {
+        first_name?: string;
+        last_name?: string;
+        email?: string;
+    } | null;
+    isAuthenticated: boolean;
+    logout: () => void;
+}
+
+export declare interface NavbarConfig {
+    brand: BrandConfig;
+    navigation: NavigationConfig;
+    useAuth: () => NavbarAuthHookResult;
+    /** Gradient colors for navbar background */
+    navbarGradient: {
+        start: string;
+        end: string;
+    };
+    userRoleLabel?: string;
+    authRoute?: string;
+    settingsRoute?: string;
+    isActiveOverride?: (path: string, locationPath: string) => boolean;
+}
+
+export declare interface NavigationConfig {
+    public: NavigationItem[];
+    authenticated: NavigationItem[];
+}
+
+export declare interface NavigationItem {
+    id: string;
+    label: string;
+    icon: default_2.ReactElement;
+}
+
+declare interface Props {
+    children: ReactNode;
+    supportEmail?: string;
+}
+
+export declare function ResetPasswordView({ authApi, authRoute }: ResetPasswordViewProps): JSX.Element;
+
+export declare interface ResetPasswordViewProps {
+    /** Auth API object with resetPassword method */
+    authApi: {
+        resetPassword: (token: string, newPassword: string) => Promise<void>;
+    };
+    /** Route to navigate after successful reset (default: '/auth') */
+    authRoute?: string;
+}
+
+declare interface State {
+    hasError: boolean;
+    error: Error | null;
+    errorInfo: ErrorInfo | null;
+}
+
+export declare const SupportView: () => JSX.Element;
+
+export declare function VerifyEmailView({ authApi, successRoute, errorRoute }: VerifyEmailViewProps): JSX.Element;
+
+export declare interface VerifyEmailViewProps {
+    /** Auth API object with verifyEmail method */
+    authApi: {
+        verifyEmail: (token: string) => Promise<void>;
+    };
+    /** Route to navigate after successful verification (default: '/projects') */
+    successRoute?: string;
+    /** Route to navigate on error (default: '/settings') */
+    errorRoute?: string;
+}
+
+/**
+ * Common props for all views that need auth and branding.
+ */
+export declare interface ViewProps {
+    /** Branding configuration */
+    branding: Branding;
+    /** Auth API instance */
+    authApi: AuthApi;
+}
+
+export { }