Types and Interfaces

import type {
  ScreenProps,
  ScreenContainerProps,
  ScreenStackProps,
  ScreenStackHeaderConfigProps,
  SearchBarProps,
  SearchBarCommands,
  StackPresentationTypes,
  StackAnimationTypes,
  BlurEffectTypes,
  ScreenOrientationTypes,
  SearchBarPlacement,
  BackButtonDisplayMode,
  BottomTabsProps,
  BottomTabsScreenProps,
  SplitViewHostProps,
  SplitViewScreenProps,
  SplitViewDisplayMode,
  HeaderHeightChangeEventType,
  TransitionProgressEventType,
  GestureResponseDistanceType,
  GoBackGesture,
  AnimatedScreenTransition,
  GestureProps
} from "react-native-screens";

interface ScreenProps extends ViewProps {
  /** Screen active state (0 = inactive, 1 = active, or animated value) */
  active?: 0 | 1 | Animated.AnimatedInterpolation<number>;
  
  /** How the screen should be presented in the stack */
  stackPresentation?: StackPresentationTypes;
  
  /** Transition animation type */
  stackAnimation?: StackAnimationTypes;
  
  /** Whether dismiss gestures are enabled */
  gestureEnabled?: boolean;
  
  /** Custom gesture response distances */
  gestureResponseDistance?: GestureResponseDistanceType;
  
  /** Full screen swipe area */
  fullScreenSwipeEnabled?: boolean;
  
  /** Whether swipe-to-dismiss is enabled */
  swipeDirection?: 'horizontal' | 'vertical';
  
  /** Whether screen prevents auto-dismiss */
  preventNativeDismiss?: boolean;
  
  /** Native back button dismissal (iOS) */
  nativeBackButtonDismissalEnabled?: boolean;
  
  /** Status bar style for this screen */
  statusBarStyle?: 'inverted' | 'auto' | 'light' | 'dark';
  
  /** Whether the status bar is hidden */
  statusBarHidden?: boolean;
  
  /** Status bar animation when hidden/shown */
  statusBarAnimation?: 'none' | 'fade' | 'slide';
  
  /** Status bar background color (Android) */
  statusBarBackgroundColor?: ColorValue;
  
  /** Status bar translucent (Android) */
  statusBarTranslucent?: boolean;
  
  /** Screen orientation preferences */
  screenOrientation?: ScreenOrientationTypes;
  
  /** Navigation bar color (Android) */
  navigationBarColor?: ColorValue;
  
  /** Whether navigation bar is hidden (Android) */
  navigationBarHidden?: boolean;
  
  /** Navigation bar style (Android) */
  navigationBarStyle?: 'light' | 'dark';
  
  /** Navigation bar translucent (Android) */
  navigationBarTranslucent?: boolean;
  
  /** Sheet presentation detents (iOS) */
  sheetAllowedDetents?: (number | 'medium' | 'large' | 'all')[] | number[];
  
  /** Sheet corner radius (iOS) */
  sheetCornerRadius?: number;
  
  /** Whether sheet grabs are visible (iOS) */
  sheetGrabberVisible?: boolean;
  
  /** Sheet largest undimmed detent identifier (iOS) */
  sheetLargestUndimmedDetentIdentifier?: number | 'medium' | 'large';
  
  /** Whether sheet expands on scroll (iOS) */
  sheetExpandsWhenScrolledToEdge?: boolean;
  
  /** Auto keyboard dismiss mode */
  autoKeyboardInsets?: boolean;
  
  /** Keyboard handling mode */
  keyboardHandlingEnabled?: boolean;
  
  /** Home indicator auto-hidden (iOS) */
  homeIndicatorHidden?: boolean;
  
  /** Freeze on prevent remove */
  freezeOnPreventRemove?: boolean;
  
  /** Activity state */
  activityState?: 0 | 1 | 2;
  
  /** Callback when screen appears */
  onAppear?: (event: NativeSyntheticEvent<TargetedEvent>) => void;
  
  /** Callback when screen disappears */
  onDisappear?: (event: NativeSyntheticEvent<TargetedEvent>) => void;
  
  /** Callback when screen will appear */
  onWillAppear?: (event: NativeSyntheticEvent<TargetedEvent>) => void;
  
  /** Callback when screen will disappear */
  onWillDisappear?: (event: NativeSyntheticEvent<TargetedEvent>) => void;
  
  /** Callback when dismiss gesture starts */
  onDismissed?: (event: NativeSyntheticEvent<TargetedEvent>) => void;
  
  /** Callback for header height changes */
  onHeaderHeightChange?: (event: NativeSyntheticEvent<HeaderHeightChangeEventType>) => void;
  
  /** Callback for transition progress updates */
  onTransitionProgress?: (event: NativeSyntheticEvent<TransitionProgressEventType>) => void;
  
  /** Callback when gesture cancellation occurs */
  onGestureCanceled?: (event: NativeSyntheticEvent<TargetedEvent>) => void;
}

interface ScreenContainerProps extends ViewProps {
  /** Whether to use screens functionality */
  enabled?: boolean;
  
  /** Optimization for single-screen navigators */
  hasTwoStates?: boolean;
  
  /** Screen container style */
  style?: StyleProp<ViewStyle>;
}

interface ScreenStackProps extends ViewProps, GestureProps {
  /** Child screen components */
  children?: React.ReactNode;
}

interface ScreenStackHeaderConfigProps {
  /** Header title text */
  title?: string;
  
  /** Title font family */
  titleFontFamily?: string;
  
  /** Title font size */
  titleFontSize?: number;
  
  /** Title font weight */
  titleFontWeight?: 'normal' | 'bold' | '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900';
  
  /** Title color */
  titleColor?: ColorValue;
  
  /** Whether header is hidden */
  hidden?: boolean;
  
  /** Header background color */
  backgroundColor?: ColorValue;
  
  /** Header blur effect (iOS) */
  blurEffect?: BlurEffectTypes;
  
  /** Large title display (iOS) */
  largeTitle?: boolean;
  
  /** Large title font family (iOS) */
  largeTitleFontFamily?: string;
  
  /** Large title font size (iOS) */
  largeTitleFontSize?: number;
  
  /** Large title font weight (iOS) */
  largeTitleFontWeight?: 'normal' | 'bold' | '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900';
  
  /** Large title color (iOS) */
  largeTitleColor?: ColorValue;
  
  /** Large title background color (iOS) */
  largeTitleBackgroundColor?: ColorValue;
  
  /** Large title hide shadow (iOS) */
  largeTitleHideShadow?: boolean;
  
  /** Back button title (iOS) */
  backTitle?: string;
  
  /** Back button font family (iOS) */
  backTitleFontFamily?: string;
  
  /** Back button font size (iOS) */
  backTitleFontSize?: number;
  
  /** Back button display mode (iOS) */
  backButtonDisplayMode?: BackButtonDisplayMode;
  
  /** Back button tint color */
  backButtonColor?: ColorValue;
  
  /** Whether back button is hidden */
  hideBackButton?: boolean;
  
  /** Whether shadow is hidden */
  hideShadow?: boolean;
  
  /** Translucent header appearance */
  translucent?: boolean;
  
  /** Direction for RTL support */
  direction?: 'rtl' | 'ltr';
  
  /** Color for header items */
  color?: ColorValue;
  
  /** Disable back button menu (iOS) */
  disableBackButtonMenu?: boolean;
  
  /** Top inset enabled */
  topInsetEnabled?: boolean;
  
  /** Callback when back button is pressed */
  onBackButtonPress?: () => void;
  
  /** Children components (header subviews) */
  children?: React.ReactNode;
}

interface SearchBarProps {
  /** Placeholder text */
  placeholder?: string;
  
  /** Search bar placement */
  placement?: SearchBarPlacement;
  
  /** Whether search bar is obscured during presentation */
  obscureBackground?: boolean;
  
  /** Whether search bar hides navigation bar during search */
  hideNavigationBar?: boolean;
  
  /** Whether search bar hides when scrolling */
  hideWhenScrolling?: boolean;
  
  /** Auto-capitalize behavior */
  autoCapitalize?: 'none' | 'words' | 'sentences' | 'characters';
  
  /** Auto-focus behavior */
  autoFocus?: boolean;
  
  /** Input type */
  inputType?: 'text' | 'phone' | 'number' | 'email';
  
  /** Right button displayed in search bar (iOS) */
  rightButtonDisplayMode?: 'never' | 'whileEditing' | 'unlessEditing' | 'always';
  
  /** Callback when text changes */
  onChangeText?: (text: string) => void;
  
  /** Callback when search button is pressed */
  onSearchButtonPress?: (event: NativeSyntheticEvent<{ text: string }>) => void;
  
  /** Callback when cancel button is pressed */
  onCancelButtonPress?: (event: NativeSyntheticEvent<{}>) => void;
  
  /** Callback when search bar gains focus */
  onFocus?: (event: NativeSyntheticEvent<{}>) => void;
  
  /** Callback when search bar loses focus */
  onBlur?: (event: NativeSyntheticEvent<{}>) => void;
  
  /** Text color */
  textColor?: ColorValue;
  
  /** Tint color */
  tintColor?: ColorValue;
  
  /** Bar tint color (iOS) */
  barTintColor?: ColorValue;
  
  /** Search bar style (iOS) */
  searchBarStyle?: 'default' | 'prominent' | 'minimal';
  
  /** Cursor color */
  cursorColor?: ColorValue;
}

interface SearchBarCommands {
  /** Focus the search bar */
  focus(): void;
  
  /** Blur the search bar */
  blur(): void;
  
  /** Clear search text */
  clearText(): void;
  
  /** Set search text programmatically */
  setText(text: string): void;
  
  /** Toggle cancel button visibility */
  toggleCancelButton(show: boolean): void;
  
  /** Cancel current search */
  cancelSearch(): void;
}

type StackPresentationTypes = 
  | 'push'                      // Standard push navigation
  | 'modal'                     // Modal presentation 
  | 'transparentModal'          // Transparent modal
  | 'containedModal'           // Contained modal (iOS 13+)
  | 'containedTransparentModal' // Contained transparent modal (iOS 13+)
  | 'fullScreenModal'          // Full screen modal
  | 'formSheet'                // Form sheet (iOS 13+)
  | 'pageSheet';               // Page sheet (iOS 15+)

type StackAnimationTypes = 
  | 'default'           // Platform default animation
  | 'fade'              // Fade in/out
  | 'fade_from_bottom'  // Fade from bottom
  | 'flip'              // Flip animation (iOS only)
  | 'none'              // No animation
  | 'simple_push'       // Simple push without shadow
  | 'slide_from_bottom' // Slide from bottom
  | 'slide_from_right'  // Slide from right
  | 'slide_from_left'   // Slide from left
  | 'ios_from_right'    // iOS-style from right
  | 'ios_from_left';    // iOS-style from left

type BlurEffectTypes = 
  | 'none'
  | 'extraLight'
  | 'light'
  | 'dark'
  | 'regular'
  | 'prominent'
  | 'systemUltraThinMaterial'
  | 'systemThinMaterial'
  | 'systemMaterial'
  | 'systemThickMaterial'
  | 'systemChromeMaterial'
  | 'systemUltraThinMaterialLight'
  | 'systemThinMaterialLight'
  | 'systemMaterialLight'
  | 'systemThickMaterialLight'
  | 'systemChromeMaterialLight'
  | 'systemUltraThinMaterialDark'
  | 'systemThinMaterialDark'
  | 'systemMaterialDark'
  | 'systemThickMaterialDark'
  | 'systemChromeMaterialDark';

type ScreenOrientationTypes = 
  | 'default'       // Use app default
  | 'all'           // All orientations
  | 'portrait'      // Portrait orientations
  | 'portrait_up'   // Portrait up only
  | 'portrait_down' // Portrait down only  
  | 'landscape'     // Landscape orientations
  | 'landscape_left' // Landscape left
  | 'landscape_right'; // Landscape right

type SearchBarPlacement = 
  | 'automatic'         // System determines placement
  | 'inline'            // Inline with navigation bar
  | 'stacked'           // Below navigation bar
  | 'integrated'        // Integrated into title area (iOS 16.0+)
  | 'integratedButton'  // Integrated as button (iOS 16.0+)
  | 'integratedCentered'; // Integrated and centered (iOS 16.0+)

type BackButtonDisplayMode = 
  | 'default'  // Show back title if available
  | 'generic'  // Show generic back button
  | 'minimal'; // Show minimal back button

interface BottomTabsProps {
  /** Currently selected tab index */
  selectedTab?: number;
  
  /** Callback when tab selection changes */
  onTabChange?: (event: NativeSyntheticEvent<NativeFocusChangeEvent>) => void;
  
  /** Whether tabs should be scrollable (Android) */
  scrollable?: boolean;
  
  /** Tab bar background color */
  barTintColor?: ColorValue;
  
  /** Selected tab tint color */
  selectedItemColor?: ColorValue;
  
  /** Unselected tab tint color */
  unselectedItemColor?: ColorValue;
  
  /** Tab bar style (iOS) */
  barStyle?: 'default' | 'black';
  
  /** Whether tab bar is translucent (iOS) */
  translucent?: boolean;
  
  /** Tab bar appearance (iOS) */
  appearance?: 'default' | 'opaque';
  
  /** Content inset adjustment behavior (iOS) */
  contentInsetAdjustmentBehavior?: 'automatic' | 'scrollableAxes' | 'never' | 'always';
  
  /** Children tab screen components */
  children?: React.ReactNode;
}

interface BottomTabsScreenProps {
  /** Tab title */
  title?: string;
  
  /** Tab bar icon name or component */
  tabBarIcon?: string | React.ComponentType<any>;
  
  /** Badge text to display on tab */
  badge?: string;
  
  /** Badge background color */
  badgeColor?: ColorValue;
  
  /** Whether tab is enabled */
  enabled?: boolean;
  
  /** Tab tint color when selected */
  activeTintColor?: ColorValue;
  
  /** Tab tint color when unselected */
  inactiveTintColor?: ColorValue;
  
  /** Tab background color */
  backgroundColor?: ColorValue;
  
  /** Whether tab should show title */
  showTitle?: boolean;
  
  /** Custom tab bar component */
  tabBarComponent?: React.ComponentType<any>;
  
  /** Tab press callback */
  onTabPress?: () => void;
  
  /** Tab long press callback */
  onTabLongPress?: () => void;
  
  /** Tab screen content */
  children?: React.ReactNode;
}

interface SplitViewHostProps extends ViewProps {
  /** Split view display mode */
  displayMode?: SplitViewDisplayMode;
  
  /** Primary column width */
  primaryColumnWidth?: number;
  
  /** Secondary column width */
  secondaryColumnWidth?: number;
  
  /** Minimum primary column width */
  minimumPrimaryColumnWidth?: number;
  
  /** Maximum primary column width */
  maximumPrimaryColumnWidth?: number;
  
  /** Preferred display mode */
  preferredDisplayMode?: SplitViewDisplayMode;
  
  /** Whether primary column is shown */
  showsPrimaryColumn?: boolean;
  
  /** Whether secondary column is shown */
  showsSecondaryColumn?: boolean;
  
  /** Callback when display mode changes */
  onDisplayModeChange?: (event: NativeSyntheticEvent<{ displayMode: SplitViewDisplayMode }>) => void;
  
  /** Callback when column visibility changes */
  onColumnVisibilityChange?: (event: NativeSyntheticEvent<{ 
    primaryVisible: boolean; 
    secondaryVisible: boolean; 
  }>) => void;
  
  /** Children split view screens */
  children?: React.ReactNode;
}

interface SplitViewScreenProps extends ViewProps {
  /** Which column this screen represents */
  column: 'primary' | 'secondary';
  
  /** Whether this column is currently visible */
  visible?: boolean;
  
  /** Column background color */
  backgroundColor?: ColorValue;
  
  /** Column border configuration */
  borderColor?: ColorValue;
  borderWidth?: number;
  
  /** Callback when column becomes visible */
  onAppear?: () => void;
  
  /** Callback when column becomes hidden */
  onDisappear?: () => void;
  
  /** Column content */
  children?: React.ReactNode;
}

type SplitViewDisplayMode = 
  | 'automatic'              // System determines layout
  | 'secondaryOnly'          // Show only secondary column
  | 'oneBesideSecondary'     // Primary beside secondary
  | 'oneOverSecondary'       // Primary over secondary
  | 'twoBesideSecondary'     // Two columns beside secondary
  | 'twoOverSecondary'       // Two columns over secondary
  | 'twoDisplaceSecondary';  // Two columns displacing secondary

interface HeaderHeightChangeEventType {
  /** Current header height in points */
  headerHeight: number;
}

interface TransitionProgressEventType {
  /** Transition progress from 0 to 1 */
  progress: number;
  
  /** Whether screen is being closed (0 or 1) */
  closing: number;
  
  /** Whether navigation is going forward (0 or 1) */
  goingForward: number;
}

interface NativeFocusChangeEvent {
  /** Index of the newly focused tab */
  focusedTab: number;
  
  /** Index of the previously focused tab */
  previouslyFocusedTab: number;
}

interface GestureResponseDistanceType {
  /** Distance from start edge */
  start?: number;
  
  /** Distance from end edge */
  end?: number;
  
  /** Distance from top edge */
  top?: number;
  
  /** Distance from bottom edge */
  bottom?: number;
}

type GoBackGesture = 
  | 'swipeRight'
  | 'swipeLeft' 
  | 'swipeUp'
  | 'swipeDown'
  | 'verticalSwipe'
  | 'horizontalSwipe'
  | 'twoDimensionalSwipe';

interface GestureProps {
  /** Go back gesture types */
  goBackGesture?: GoBackGesture;
  
  /** Custom animated screen transitions */
  customAnimationOnSwipe?: boolean;
  
  /** Full screen swipe enabled */
  fullScreenSwipeEnabled?: boolean;
  
  /** Animated screen transition configuration */
  screenTransition?: AnimatedScreenTransition;
}

interface AnimatedScreenTransition {
  /** Top screen frame during transition */
  topScreenFrame?: {
    x: number;
    y: number;
    width: number;
    height: number;
  };
  
  /** Below top screen frame during transition */
  belowTopScreenFrame?: {
    x: number;
    y: number;
    width: number;
    height: number;
  };
}

interface CompatibilityFlags {
  /** Indicates new back title implementation (v3.21+) */
  isNewBackTitleImplementation: boolean;
  
  /** Indicates new header implementation (v4.0+) */
  usesHeaderFlexboxImplementation: boolean;
}

interface FeatureFlags {
  /** Experimental feature flags */
  experiment: {
    /** Experimental bottom tabs control */
    controlledBottomTabs: boolean;
  };
  
  /** Stable configuration flags (currently empty) */
  stable: {};
}

type ColorValue = string | number;

type StyleProp<T> = T | null | undefined | false | Array<StyleProp<T>>;

interface ViewProps {
  style?: StyleProp<ViewStyle>;
  children?: React.ReactNode;
  testID?: string;
  accessible?: boolean;
  accessibilityLabel?: string;
  accessibilityHint?: string;
  accessibilityRole?: string;
}

interface ViewStyle {
  flex?: number;
  flexDirection?: 'row' | 'column' | 'row-reverse' | 'column-reverse';
  justifyContent?: 'flex-start' | 'flex-end' | 'center' | 'space-between' | 'space-around' | 'space-evenly';
  alignItems?: 'flex-start' | 'flex-end' | 'center' | 'stretch' | 'baseline';
  backgroundColor?: ColorValue;
  width?: number | string;
  height?: number | string;
  margin?: number;
  padding?: number;
  position?: 'absolute' | 'relative';
  top?: number | string;
  left?: number | string;
  right?: number | string;
  bottom?: number | string;
  zIndex?: number;
  opacity?: number;
  transform?: Array<{
    perspective?: number;
    rotate?: string;
    rotateX?: string;
    rotateY?: string;
    rotateZ?: string;
    scale?: number;
    scaleX?: number;
    scaleY?: number;
    translateX?: number;
    translateY?: number;
    skewX?: string;
    skewY?: string;
  }>;
}

// Type guard for checking if a value is a valid stack presentation
function isStackPresentationType(value: any): value is StackPresentationTypes {
  return typeof value === 'string' && [
    'push', 'modal', 'transparentModal', 'containedModal',
    'containedTransparentModal', 'fullScreenModal', 'formSheet', 'pageSheet'
  ].includes(value);
}

// Type guard for checking if a value is a valid stack animation
function isStackAnimationType(value: any): value is StackAnimationTypes {
  return typeof value === 'string' && [
    'default', 'fade', 'fade_from_bottom', 'flip', 'none',
    'simple_push', 'slide_from_bottom', 'slide_from_right',
    'slide_from_left', 'ios_from_right', 'ios_from_left'
  ].includes(value);
}

// Type guard for checking screen orientation
function isScreenOrientationType(value: any): value is ScreenOrientationTypes {
  return typeof value === 'string' && [
    'default', 'all', 'portrait', 'portrait_up', 'portrait_down',
    'landscape', 'landscape_left', 'landscape_right'
  ].includes(value);
}

// iOS specific sheet detent values
type iOSSheetDetentIdentifier = 'medium' | 'large' | number;

// iOS specific blur effects (subset for common usage)
type iOSBlurEffect = 
  | 'extraLight'
  | 'light'
  | 'dark'
  | 'systemMaterial'
  | 'systemMaterialLight'
  | 'systemMaterialDark';

// iOS specific search bar styles
type iOSSearchBarStyle = 'default' | 'prominent' | 'minimal';

// Android specific navigation bar styles
type AndroidNavigationBarStyle = 'light' | 'dark';

// Android specific status bar styles
type AndroidStatusBarStyle = 'default' | 'light-content' | 'dark-content';

/** @deprecated Use StackPresentationTypes instead */
type StackPresentationType = StackPresentationTypes;

/** @deprecated Use StackAnimationTypes instead */
type StackAnimationType = StackAnimationTypes;

/** @deprecated Use SearchBarPlacement instead */
type SearchBarPlacementTypes = SearchBarPlacement;

/** @deprecated Legacy sheet detent values, use numeric arrays instead */
type LegacySheetDetent = 'medium' | 'large' | 'all';