import { ReactNode } from 'react';
import { MantineStyleProp } from '@mantine/core';

export interface UserProfileProps {
  // Customization
  appearance?: UserProfileAppearance;
  
  // Custom pages
  children?: ReactNode;
  
  // Component props
  className?: string;
  style?: MantineStyleProp;
}

export interface UserProfileAppearance {
  elements?: {
    card?: string;
    navbar?: string;
    navbarMobileMenuButton?: string;
    headerTitle?: string;
    headerSubtitle?: string;
    [key: string]: string | undefined;
  };
  variables?: {
    colorPrimary?: string;
    [key: string]: string | undefined;
  };
}

export interface UserProfilePageProps {
  label: string;
  labelIcon?: ReactNode;
  children: ReactNode;
  url?: string;
}