/**
 * Lynx JSX 类型声明
 * 这些类型在实际 Lynx 项目中由 @lynx-js/react 提供
 * 
 * 本文件为开发环境提供类型支持
 */

// =============================================
// JSX 命名空间
// =============================================
declare namespace JSX {
  interface Element {}
  interface ElementClass {
    render(): Element
  }
  interface ElementAttributesProperty {
    props: {}
  }
  interface ElementChildrenAttribute {
    children: {}
  }
  
  interface IntrinsicAttributes {
    key?: string | number
  }
  
  interface IntrinsicElements {
    // Lynx 基础元素
    view: ViewProps
    text: TextProps
    image: ImageProps
    input: InputProps
    textarea: TextareaProps
    'scroll-view': ScrollViewProps
    // 其他元素按需添加
    [elemName: string]: any
  }
}

// =============================================
// Lynx 元素属性类型
// =============================================
interface BaseProps {
  className?: string
  style?: Record<string, any>
  children?: any
  key?: string | number
  bindtap?: (event?: any) => void
  bindtouchstart?: (event?: any) => void
  bindtouchend?: (event?: any) => void
  bindtouchmove?: (event?: any) => void
  'accessibility-element'?: boolean
  'accessibility-exclusive-focus'?: boolean
  'event-through'?: boolean
  'block-native-event'?: boolean
  [key: string]: any
}

interface ViewProps extends BaseProps {}

interface TextProps extends BaseProps {
  numberOfLines?: number
}

interface ImageProps extends BaseProps {
  src?: string
  mode?: 'scaleToFill' | 'aspectFit' | 'aspectFill'
  placeholder?: string
  'blur-radius'?: string
  'auto-size'?: boolean
}

/**
 * Lynx Input 元素属性
 * 
 * ⚠️ 重要：Lynx 的 input 是非受控组件！
 * - 不支持 value 属性进行受控
 * - 使用 defaultValue 设置初始值
 * - 使用 bindinput 事件获取输入值
 * - 如需清空输入框，需使用 ref 调用 setValue 方法
 */
interface InputProps extends BaseProps {
  type?: 'text' | 'number' | 'password' | 'email' | 'tel' | 'url' | 'search' | string
  /** 初始值（Lynx 不支持受控 value，只能用 defaultValue） */
  defaultValue?: any
  placeholder?: string
  disabled?: boolean
  readOnly?: boolean
  required?: boolean
  autoComplete?: string
  autoFocus?: boolean
  name?: string
  id?: string
  maxlength?: number
  'aria-invalid'?: boolean
  'aria-describedby'?: string
  /** 输入事件，e.detail.value 获取当前值 */
  bindinput?: (event?: any) => void
  bindfocus?: (event?: any) => void
  bindblur?: (event?: any) => void
  /** 确认按钮点击事件（键盘回车） */
  bindconfirm?: (event?: any) => void
}

interface TextareaProps extends InputProps {
  rows?: number
}

interface ScrollViewProps extends BaseProps {
  'scroll-orientation'?: 'vertical' | 'horizontal'
  'scroll-x'?: boolean
  'scroll-y'?: boolean
  bindscroll?: (event?: any) => void
}

// =============================================
// React JSX Runtime 模块声明
// =============================================
declare module 'react/jsx-runtime' {
  export const jsx: any
  export const jsxs: any
  export const Fragment: any
}

declare module 'react/jsx-dev-runtime' {
  export const jsxDEV: any
  export const Fragment: any
}

// =============================================
// React Hooks 声明 (Lynx 兼容)
// =============================================
declare module '@lynx-js/react' {
  export function useState<T>(initial: T | (() => T)): [T, (value: T | ((prev: T) => T)) => void]
  export function useEffect(effect: () => void | (() => void), deps?: any[]): void
  export function useLayoutEffect(effect: () => void | (() => void), deps?: any[]): void
  export function useCallback<T extends (...args: any[]) => any>(callback: T, deps: any[]): T
  export function useMemo<T>(factory: () => T, deps: any[]): T
  export function useRef<T>(initial: T): { current: T }
  export function useContext<T>(context: any): T
  export function useReducer<S, A>(reducer: (state: S, action: A) => S, initialState: S): [S, (action: A) => void]
  export function useImperativeHandle<T>(ref: any, createHandle: () => T, deps?: any[]): void
  export function forwardRef<T, P>(render: (props: P, ref: any) => any): any
  export function createContext<T>(defaultValue: T): any
  export function memo<P>(component: (props: P) => any): any
  export function Fragment(props: { children?: any }): any
  export const root: { render: (element: any) => void }
}

// 全局 hooks 声明 (用于组件内部)
declare function useState<T>(initial: T | (() => T)): [T, (value: T | ((prev: T) => T)) => void]
declare function useEffect(effect: () => void | (() => void), deps?: any[]): void
declare function useLayoutEffect(effect: () => void | (() => void), deps?: any[]): void
declare function useCallback<T extends (...args: any[]) => any>(callback: T, deps: any[]): T
declare function useMemo<T>(factory: () => T, deps: any[]): T
declare function useRef<T>(initial: T): { current: T }