import React from "react";
import { Text as RNText, type TextProps as RNTextProps } from "react-native";
import { cn } from "../utils/cn";

export interface TextProps extends RNTextProps {
  className?: string;
  children?: React.ReactNode;
}

/**
 * Text component with NativeWind styling. Provides consistent typography
 * across consumer apps with dark-mode support.
 */
export function Text({ className, children, ...props }: TextProps) {
  return (
    <RNText className={cn("text-base text-foreground dark:text-white", className)} {...props}>
      {children}
    </RNText>
  );
}

/** Heading variant with larger size and bold weight. */
export function Heading({ className, children, ...props }: TextProps) {
  return (
    <RNText
      className={cn("text-2xl font-bold text-foreground dark:text-white", className)}
      {...props}
    >
      {children}
    </RNText>
  );
}

/** Label variant for form labels and small text. */
export function Label({ className, children, ...props }: TextProps) {
  return (
    <RNText
      className={cn("text-sm text-muted-foreground dark:text-neutral-400", className)}
      {...props}
    >
      {children}
    </RNText>
  );
}

/** Muted text variant for less prominent content. */
export function MutedText({ className, children, ...props }: TextProps) {
  return (
    <RNText
      className={cn("text-base text-muted-foreground dark:text-neutral-400", className)}
      {...props}
    >
      {children}
    </RNText>
  );
}

/** Monospace text variant for codes, passwords, and technical content. */
export function MonoText({ className, children, ...props }: TextProps) {
  return (
    <RNText
      className={cn("font-mono text-base text-foreground dark:text-white", className)}
      {...props}
    >
      {children}
    </RNText>
  );
}

/** Error text variant for validation messages. */
export function ErrorText({ className, children, ...props }: TextProps) {
  return (
    <RNText className={cn("text-sm text-destructive dark:text-red-400", className)} {...props}>
      {children}
    </RNText>
  );
}