/**
 * 响应式相关类型定义
 */

// ==================== 断点定义 ====================
export const BREAKPOINTS = {
  mobile: 0,      // 手机
  tablet: 768,    // 平板竖屏
  desktop: 1024,  // 平板横屏/桌面
  wide: 1440,     // 宽屏桌面
} as const;

export type BreakpointKey = keyof typeof BREAKPOINTS;
export type BreakpointValue = typeof BREAKPOINTS[BreakpointKey];

// ==================== 更细粒度的断点定义 ====================
export const FINE_BREAKPOINTS = {
  xs: 0,      // 超小屏手机
  sm: 375,    // 小屏手机 (iPhone SE, 小屏安卓)
  md: 414,    // 中屏手机 (iPhone Pro Max, 大屏安卓)
  lg: 768,    // 平板竖屏 / 大折叠屏手机展开
  xl: 1024,   // 平板横屏 / 小桌面
  '2xl': 1280, // 桌面
  '3xl': 1440, // 大桌面
  '4xl': 1920, // 超大屏
} as const;

export type FineBreakpointKey = keyof typeof FINE_BREAKPOINTS;

// ==================== 响应式值类型 ====================
export type ResponsiveValue<T> = T | Partial<Record<FineBreakpointKey, T>>;

// ==================== 方向类型 ====================
export type Orientation = 'portrait' | 'landscape';

// ==================== 平台类型 ====================
export interface PlatformInfo {
  OS: 'ios' | 'android' | 'windows' | 'macos' | 'web';
  isWeb: boolean;
  isIOS: boolean;
  isAndroid: boolean;
  isNative: boolean;
}

// ==================== 屏幕尺寸类型 ====================
export interface ScreenSize {
  width: number;
  height: number;
  isMobile: boolean;
  isTablet: boolean;
  isDesktop: boolean;
  isWide: boolean;
}

// ==================== 媒体查询选项 ====================
export interface MediaQueryOptions {
  minWidth?: number;
  maxWidth?: number;
  minHeight?: number;
  maxHeight?: number;
  orientation?: Orientation;
}
