View Containers

/**
 * Basic view container component
 * @supported all platforms
 */
const View: ComponentType<ViewProps>;

interface ViewProps extends StandardProps {
  /** Whether to enable flexible layout
   * @supported weapp, alipay, swan, tt, qq, jd, h5
   * @default false
   */
  enableFlex?: boolean;
  /** Hover class name applied when the view is pressed
   * @supported weapp, alipay, swan, tt, qq, jd
   */
  hoverClass?: string;
  /** Time delay in milliseconds before hover class is applied
   * @supported weapp, alipay, swan, tt, qq, jd
   * @default 50
   */
  hoverStartTime?: number;
  /** Time delay in milliseconds before hover class is removed
   * @supported weapp, alipay, swan, tt, qq, jd
   * @default 400
   */
  hoverStayTime?: number;
  /** Whether hover effect is disabled
   * @supported weapp, alipay, swan, tt, qq, jd
   * @default false
   */
  hoverStopPropagation?: boolean;
}

/**
 * Scrollable view container
 * @supported all platforms
 */
const ScrollView: ComponentType<ScrollViewProps>;

interface ScrollViewProps extends StandardProps {
  /** Allow horizontal scrolling
   * @default false
   */
  scrollX?: boolean;
  /** Allow vertical scrolling
   * @default false
   */
  scrollY?: boolean;
  /** Distance from top edge to trigger upper pull refresh
   * @default 50
   */
  upperThreshold?: number;
  /** Distance from bottom edge to trigger lower pull refresh
   * @default 50
   */
  lowerThreshold?: number;
  /** Top scroll position
   * @supported weapp, alipay, swan, tt, qq, jd, h5, rn
   */
  scrollTop?: number;
  /** Left scroll position
   * @supported weapp, alipay, swan, tt, qq, jd, h5, rn
   */
  scrollLeft?: number;
  /** Child element ID to scroll into view
   * @supported weapp, alipay, swan, tt, qq, jd, h5
   */
  scrollIntoView?: string;
  /** Enable scrolling with animation
   * @supported weapp, alipay, swan, tt, qq, jd, h5, rn
   * @default false
   */
  scrollWithAnimation?: boolean;
  /** Enable bounce effect on iOS
   * @supported weapp, tt, qq, jd, h5
   * @default true
   */
  enableBackToTop?: boolean;
  /** Enable pull-down refresh
   * @supported weapp, tt, qq, jd
   * @default false
   */
  enablePullDownRefresh?: boolean;
  /** Background color for pull-down refresh
   * @supported weapp, tt, qq, jd
   * @default "#FFF"
   */
  refresherBackground?: string;
  /** Whether refresh indicator is triggered
   * @supported weapp, tt, qq, jd
   * @default false
   */
  refresherTriggered?: boolean;
  /** Threshold distance to trigger refresh
   * @supported weapp, tt, qq, jd
   * @default 45
   */
  refresherThreshold?: number;
  /** Maximum pull-down distance
   * @supported weapp, tt, qq, jd
   * @default 100
   */
  refresherMaxDragDistance?: number;
  /** Default refresh indicator style
   * @supported weapp, tt, qq, jd
   * @default "black"
   */
  refresherDefaultStyle?: string;
  /** Scroll event callback */
  onScroll?: (event: ScrollViewScrollEvent) => void;
  /** Upper threshold reached callback */
  onScrollToUpper?: (event: TaroEvent) => void;
  /** Lower threshold reached callback */
  onScrollToLower?: (event: TaroEvent) => void;
  /** Pull-down refresh triggered callback */
  onRefresherPulling?: (event: TaroEvent) => void;
  /** Refresh state change callback */
  onRefresherRefresh?: (event: TaroEvent) => void;
  /** Refresh restoration callback */
  onRefresherRestore?: (event: TaroEvent) => void;
  /** Pull-down refresh abort callback */
  onRefresherAbort?: (event: TaroEvent) => void;
}

/**
 * Basic block container component
 * @supported all platforms
 */
const Block: ComponentType<BlockProps>;

interface BlockProps extends StandardProps {
  // No specific props beyond StandardProps
}

/**
 * Swiper container for slides
 * @supported all platforms
 */
const Swiper: ComponentType<SwiperProps>;

interface SwiperProps extends StandardProps {
  /** Whether dots indicator is shown
   * @default false
   */
  indicatorDots?: boolean;
  /** Active dot color
   * @default "rgba(0, 0, 0, .3)"
   */
  indicatorColor?: string;
  /** Active dot color
   * @default "#000000"
   */
  indicatorActiveColor?: string;
  /** Whether auto play is enabled
   * @default false
   */
  autoplay?: boolean;
  /** Current slide index
   * @default 0
   */
  current?: number;
  /** Auto play interval in milliseconds
   * @default 5000
   */
  interval?: number;
  /** Animation duration in milliseconds
   * @default 500
   */
  duration?: number;
  /** Whether circular swiping is enabled
   * @default false
   */
  circular?: boolean;
  /** Whether vertical swiping is enabled
   * @default false
   */
  vertical?: boolean;
  /** Previous margin for showing previous slide
   * @supported weapp, alipay, swan, tt, qq, jd, h5
   * @default "0px"
   */
  previousMargin?: string;
  /** Next margin for showing next slide
   * @supported weapp, alipay, swan, tt, qq, jd, h5
   * @default "0px"
   */
  nextMargin?: string;
  /** Zoom multiple for pinch zoom
   * @supported weapp, alipay, swan, tt, qq, jd
   * @default 1
   */
  displayMultipleItems?: number;
  /** Animation change callback */
  onChange?: (event: SwiperChangeEvent) => void;
  /** Transition callback */
  onTransition?: (event: SwiperTransitionEvent) => void;
  /** Animation end callback */
  onAnimationFinish?: (event: SwiperAnimationFinishEvent) => void;
}

/**
 * Individual slide item for Swiper
 * @supported all platforms
 */
const SwiperItem: ComponentType<SwiperItemProps>;

interface SwiperItemProps extends StandardProps {
  /** Unique identifier for the slide item
   * @supported weapp, alipay, swan, tt, qq, jd, h5
   */
  itemId?: string;
}

/**
 * Movable area container for draggable content
 * @supported weapp, alipay, swan, tt, qq, jd, h5
 */
const MovableArea: ComponentType<MovableAreaProps>;

interface MovableAreaProps extends StandardProps {
  /** Scale ratio
   * @supported weapp, alipay, swan, tt, qq, jd, h5
   * @default false
   */
  scaleArea?: boolean;
}

/**
 * Draggable view component within MovableArea
 * @supported weapp, alipay, swan, tt, qq, jd, h5
 */
const MovableView: ComponentType<MovableViewProps>;

interface MovableViewProps extends StandardProps {
  /** Movement direction
   * @default "none"
   */
  direction?: 'all' | 'vertical' | 'horizontal' | 'none';
  /** Whether element is inert (not draggable)
   * @default false
   */
  inertia?: boolean;
  /** Distance threshold for smooth transition
   * @default 0
   */
  outOfBounds?: boolean;
  /** X-coordinate position
   * @supported weapp, alipay, swan, tt, qq, jd, h5
   */
  x?: number;
  /** Y-coordinate position
   * @supported weapp, alipay, swan, tt, qq, jd, h5
   */
  y?: number;
  /** Whether damping is enabled
   * @supported weapp, alipay, swan, tt, qq, jd, h5
   * @default false
   */
  damping?: number;
  /** Friction coefficient
   * @supported weapp, alipay, swan, tt, qq, jd, h5
   * @default 2
   */
  friction?: number;
  /** Whether scaling is disabled
   * @supported weapp, alipay, swan, tt, qq, jd, h5
   * @default false
   */
  disabled?: boolean;
  /** Scale value
   * @supported weapp, alipay, swan, tt, qq, jd, h5
   * @default 1
   */
  scale?: number;
  /** Minimum scale value
   * @supported weapp, alipay, swan, tt, qq, jd, h5
   * @default 0.5
   */
  scaleMin?: number;
  /** Maximum scale value
   * @supported weapp, alipay, swan, tt, qq, jd, h5
   * @default 10
   */
  scaleMax?: number;
  /** Scale value for double tap
   * @supported weapp, alipay, swan, tt, qq, jd, h5
   * @default 1
   */
  scaleValue?: number;
  /** Animation flag
   * @supported weapp, alipay, swan, tt, qq, jd, h5
   * @default false
   */
  animation?: boolean;
  /** Position change callback */
  onChange?: (event: MovableViewChangeEvent) => void;
  /** Scale change callback */
  onScale?: (event: MovableViewScaleEvent) => void;
}

/**
 * Cover view component for overlaying native components
 * @supported weapp, alipay, swan, tt, qq, jd
 */
const CoverView: ComponentType<CoverViewProps>;

interface CoverViewProps extends StandardProps {
  /** Scroll position when using scroll-view
   * @supported weapp, alipay, swan, tt, qq, jd
   */
  scrollTop?: number;
}

/**
 * Cover image component for overlaying content
 * @supported weapp, alipay, swan, tt, qq, jd
 */
const CoverImage: ComponentType<CoverImageProps>;

interface CoverImageProps extends StandardProps {
  /** Image source URL
   * @supported weapp, alipay, swan, tt, qq, jd
   */
  src?: string;
  /** Image load callback */
  onLoad?: (event: CoverImageLoadEvent) => void;
  /** Image error callback */
  onError?: (event: CoverImageErrorEvent) => void;
}

/**
 * Page container wrapper component
 * @supported weapp, tt, qq, jd
 */
const PageContainer: ComponentType<PageContainerProps>;

interface PageContainerProps extends StandardProps {
  /** Whether container is shown
   * @default false
   */
  show?: boolean;
  /** Container duration in milliseconds
   * @default 300
   */
  duration?: number;
  /** Z-index value
   * @default 100
   */
  zIndex?: number;
  /** Overlay mask
   * @default true
   */
  overlay?: boolean;
  /** Container position
   * @default "bottom"
   */
  position?: 'top' | 'bottom' | 'right' | 'center';
  /** Round corner radius
   * @default 0
   */
  round?: number;
  /** Close on overlay click
   * @default false
   */
  closeOnOverlayClick?: boolean;
  /** Container enter callback */
  onEnter?: (event: TaroEvent) => void;
  /** Container after enter callback */
  onAfterEnter?: (event: TaroEvent) => void;
  /** Container leave callback */
  onLeave?: (event: TaroEvent) => void;
  /** Container after leave callback */
  onAfterLeave?: (event: TaroEvent) => void;
  /** Click overlay callback */
  onClickOverlay?: (event: TaroEvent) => void;
}

/**
 * Portal component for rendering outside component tree
 * @supported weapp, tt, qq, jd
 */
const RootPortal: ComponentType<RootPortalProps>;

interface RootPortalProps extends StandardProps {
  /** Whether portal is enabled
   * @default true
   */
  enable?: boolean;
}

/**
 * Media query matching component
 * @supported weapp, alipay, swan, tt, qq, jd, h5
 */
const MatchMedia: ComponentType<MatchMediaProps>;

interface MatchMediaProps extends StandardProps {
  /** Minimum width for media query
   * @supported weapp, alipay, swan, tt, qq, jd, h5
   */
  minWidth?: number;
  /** Maximum width for media query
   * @supported weapp, alipay, swan, tt, qq, jd, h5
   */
  maxWidth?: number;
  /** Width for media query
   * @supported weapp, alipay, swan, tt, qq, jd, h5
   */
  width?: number;
  /** Minimum height for media query
   * @supported weapp, alipay, swan, tt, qq, jd, h5
   */
  minHeight?: number;
  /** Maximum height for media query
   * @supported weapp, alipay, swan, tt, qq, jd, h5
   */
  maxHeight?: number;
  /** Height for media query
   * @supported weapp, alipay, swan, tt, qq, jd, h5
   */
  height?: number;
  /** Orientation for media query
   * @supported weapp, alipay, swan, tt, qq, jd, h5
   */
  orientation?: 'landscape' | 'portrait';
}

/**
 * Animated view container
 * @supported weapp, tt, qq, jd
 */
const AnimationView: ComponentType<AnimationViewProps>;

interface AnimationViewProps extends StandardProps {
  // Animation-specific props would be defined based on platform capabilities
}

// Event interfaces for ScrollView
interface ScrollViewScrollEvent extends TaroEvent {
  detail: {
    scrollLeft: number;
    scrollTop: number;
    scrollHeight: number;
    scrollWidth: number;
    deltaX: number;
    deltaY: number;
  };
}

// Event interfaces for Swiper
interface SwiperChangeEvent extends TaroEvent {
  detail: {
    current: number;
    source: 'autoplay' | 'touch' | '';
  };
}

interface SwiperTransitionEvent extends TaroEvent {
  detail: {
    dx: number;
    dy: number;
  };
}

interface SwiperAnimationFinishEvent extends TaroEvent {
  detail: {
    current: number;
    source: 'autoplay' | 'touch' | '';
  };
}

// Event interfaces for MovableView
interface MovableViewChangeEvent extends TaroEvent {
  detail: {
    x: number;
    y: number;
    source: 'touch' | 'touch-out-of-bounds' | 'out-of-bounds' | 'friction' | '';
  };
}

interface MovableViewScaleEvent extends TaroEvent {
  detail: {
    x: number;
    y: number;
    scale: number;
  };
}

// Event interfaces for Cover components
interface CoverImageLoadEvent extends TaroEvent {
  detail: {
    // Load event details
  };
}

interface CoverImageErrorEvent extends TaroEvent {
  detail: {
    errMsg: string;
  };
}