import { MantineStyleProp } from '@mantine/core';
import { AuthProvider } from '../../types';

export interface SignUpProps {
  // Routing
  routing?: 'path' | 'virtual';
  path?: string;
  redirectUrl?: string;
  afterSignUpUrl?: string;

  // Providers
  providers?: AuthProvider[];
  
  // Customization
  appearance?: SignUpAppearance;
  
  // Callbacks
  onSuccess?: (user: any) => void;
  onError?: (error: any) => void;
  
  // Initial values
  initialValues?: {
    email?: string;
    firstName?: string;
    lastName?: string;
  };
  
  // Metadata
  unsafeMetadata?: Record<string, any>;
  
  // Features
  showDivider?: boolean;
  signInUrl?: string;
  requireDisplayName?: boolean;
  passwordRequirements?: PasswordRequirements;
  customValidation?: {
    email?: (email: string) => string | null;
    password?: (password: string) => string | null;
    displayName?: (name: string) => string | null;
  };
  
  // Component props
  className?: string;
  style?: MantineStyleProp;
}

export interface SignUpAppearance {
  layout?: {
    socialButtonsPlacement?: 'top' | 'bottom';
    socialButtonsVariant?: 'iconButton' | 'blockButton';
    showDivider?: boolean;
    logoPlacement?: 'inside' | 'outside';
  };
  elements?: {
    card?: string;
    headerTitle?: string;
    headerSubtitle?: string;
    socialButtonsContainer?: string;
    divider?: string;
    formButtonPrimary?: string;
    footerActionLink?: string;
    [key: string]: string | undefined;
  };
  variables?: {
    colorPrimary?: string;
    colorDanger?: string;
    borderRadius?: string;
    fontFamily?: string;
    [key: string]: string | undefined;
  };
}

export interface PasswordRequirements {
  minLength?: number;
  requireUppercase?: boolean;
  requireLowercase?: boolean;
  requireNumbers?: boolean;
  requireSymbols?: boolean;
}

export interface SignUpFormData {
  email: string;
  password: string;
  confirmPassword: string;
  firstName?: string;
  lastName?: string;
  displayName?: string;
}