import type { ReactNode } from 'react';

// Position & Alignment
export type TourPosition = 'top' | 'bottom' | 'left' | 'right' | 'auto';
export type TourAlign = 'start' | 'center' | 'end';
export type ProgressVariant = 'dots' | 'bar' | 'fraction' | 'none';

// Step Action
export interface TourAction {
  label: ReactNode;
  onClick: () => void;
  variant?: 'default' | 'outline' | 'ghost' | 'destructive';
}

// Step Definition
export interface TourStep {
  /** Unique step identifier */
  id: string;
  /** CSS selector or data-tour-step-id value to find target element */
  target?: string;
  /** Step title */
  title: ReactNode;
  /** Step description/content */
  content: ReactNode;
  /** Popover position relative to target */
  position?: TourPosition;
  /** Offset from target in pixels */
  offset?: number;
  /** Alignment along the position axis */
  align?: TourAlign;
  /** Alignment offset in pixels */
  alignOffset?: number;
  /** Custom class for this step's popover */
  className?: string;
  /** Route to navigate on Next (for multi-page tours) */
  nextRoute?: string;
  /** Route to navigate on Previous */
  previousRoute?: string;
  /** Custom Next button label */
  nextLabel?: ReactNode;
  /** Custom Previous button label */
  previousLabel?: ReactNode;
  /** Disable spotlight for this step */
  disableSpotlight?: boolean;
  /** Spotlight padding around target */
  spotlightPadding?: number;
  /** Custom spotlight border radius */
  spotlightRadius?: number;
  /** Allow interaction with target while step is active */
  allowTargetInteraction?: boolean;
  /** Auto-advance after delay (ms) */
  autoAdvance?: number;
  /** Custom action buttons */
  actions?: TourAction[];
  /** Called before step shows, return false to skip */
  onBeforeShow?: () => boolean | Promise<boolean>;
  /** Called after step renders */
  onShow?: () => void;
  /** Called before step hides */
  onHide?: () => void;
}

// Tour Definition
export interface Tour {
  id: string;
  steps: TourStep[];
  /** Tour-level defaults for steps */
  defaults?: Partial<TourStep>;
}

// State
export interface TourState {
  isActive: boolean;
  activeTourId: string | null;
  currentStepIndex: number;
  isTransitioning: boolean;
  direction: 'forward' | 'backward';
}

// Callbacks
export interface TourCallbacks {
  /** Called when tour starts */
  onStart?: (tourId: string) => void;
  /** Called when tour completes (last step finished) */
  onComplete?: (tourId: string) => void;
  /** Called when tour is skipped/closed early */
  onSkip?: (tourId: string, stepIndex: number) => void;
  /** Called on step change */
  onStepChange?: (stepIndex: number, step: TourStep, direction: 'forward' | 'backward') => void;
  /** Called before step transition, return false to cancel */
  onBeforeStepChange?: (currentIndex: number, nextIndex: number) => boolean | Promise<boolean>;
}

// Provider Props
export interface TourProviderProps extends TourCallbacks {
  tours: Tour[];
  children: ReactNode;
  /** Enable spotlight (default: true) */
  spotlight?: boolean;
  /** Spotlight opacity 0-1 (default: 0.5) */
  spotlightOpacity?: number;
  /** Spotlight blur amount in pixels (default: 0) */
  spotlightBlur?: number;
  /** Enable spotlight animations (default: true) */
  animated?: boolean;
  /** Show pulsing ring around target (default: false) */
  pulseRing?: boolean;
  /** Show arrow pointing to target (default: false) */
  showArrow?: boolean;
  /** Enable keyboard navigation (default: true) */
  keyboardNavigation?: boolean;
  /** Close on overlay click (default: false) */
  closeOnOverlayClick?: boolean;
  /** Close on Escape key (default: true) */
  closeOnEscape?: boolean;
  /** Scroll target into view (default: true) */
  scrollToTarget?: boolean;
  /** Scroll behavior (default: 'smooth') */
  scrollBehavior?: ScrollBehavior;
  /** Progress indicator variant (default: 'dots') */
  progressVariant?: ProgressVariant;
  /** Show skip button (default: true) */
  showSkipButton?: boolean;
  /** Custom skip button label */
  skipLabel?: ReactNode;
  /** Custom finish button label */
  finishLabel?: ReactNode;
  /** Portal container (default: document.body) */
  portalContainer?: HTMLElement;
  /** Z-index for overlay (default: 50) */
  zIndex?: number;
}

// Hook Return
export interface UseTourReturn {
  /** Start a tour by ID */
  start: (tourId: string, startIndex?: number) => void;
  /** Go to next step */
  next: () => void;
  /** Go to previous step */
  previous: () => void;
  /** Go to specific step */
  goTo: (index: number) => void;
  /** Close/skip tour */
  close: () => void;
  /** Is tour currently active */
  isActive: boolean;
  /** Currently active tour ID */
  activeTourId: string | null;
  /** Current step object */
  currentStep: TourStep | null;
  /** Current step index */
  currentStepIndex: number;
  /** Total number of steps */
  totalSteps: number;
  /** Is first step */
  isFirstStep: boolean;
  /** Is last step */
  isLastStep: boolean;
  /** Progress 0-1 */
  progress: number;
}

// Spotlight Target
export interface SpotlightTarget {
  element: HTMLElement;
  rect: DOMRect;
  padding: number;
  radius: number;
}

// Component Props
export interface TourSpotlightProps {
  targets: SpotlightTarget[];
  opacity?: number;
  blur?: number;
  animated?: boolean;
  pulseRing?: boolean;
  className?: string;
  onClick?: () => void;
  allowInteraction?: boolean;
}

export interface TourProgressProps {
  current: number;
  total: number;
  variant?: ProgressVariant;
  onDotClick?: (index: number) => void;
  className?: string;
}

export interface TourNavigationProps {
  onNext: () => void;
  onPrevious: () => void;
  isFirstStep: boolean;
  isLastStep: boolean;
  nextLabel?: ReactNode;
  previousLabel?: ReactNode;
  finishLabel?: ReactNode;
  nextRoute?: string;
  previousRoute?: string;
  className?: string;
}

export interface TourContentProps {
  step: TourStep;
  targetRect: DOMRect;
  currentIndex: number;
  totalSteps: number;
  onNext: () => void;
  onPrevious: () => void;
  onClose: () => void;
  progressVariant?: ProgressVariant;
  showSkipButton?: boolean;
  showArrow?: boolean;
  skipLabel?: ReactNode;
  finishLabel?: ReactNode;
  onGoTo?: (index: number) => void;
  className?: string;
}

export interface TourProps extends Omit<TourProviderProps, 'children'> {
  children?: ReactNode;
}
