Device & Sensors

/**
 * Reactive device motion sensor data
 * @param options - Configuration options
 * @returns Device motion state
 */
function useDeviceMotion(options?: UseDeviceMotionOptions): UseDeviceMotionReturn;

interface UseDeviceMotionReturn {
  acceleration: Ref<DeviceMotionEventAcceleration | null>;
  accelerationIncludingGravity: Ref<DeviceMotionEventAcceleration | null>;
  rotationRate: Ref<DeviceMotionEventRotationRate | null>;
  interval: Ref<number>;
}

interface UseDeviceMotionOptions extends ConfigurableWindow, ConfigurableEventFilter {
  immediate?: boolean;
}

/**
 * Reactive device orientation sensor
 * @param options - Configuration options
 * @returns Device orientation state
 */
function useDeviceOrientation(options?: UseDeviceOrientationOptions): UseDeviceOrientationReturn;

interface UseDeviceOrientationReturn {
  isAbsolute: Ref<boolean>;
  alpha: Ref<number | null>;
  beta: Ref<number | null>;
  gamma: Ref<number | null>;
}

interface UseDeviceOrientationOptions extends ConfigurableWindow, ConfigurableEventFilter {
  immediate?: boolean;
}

/**
 * Reactive screen orientation API
 * @param options - Configuration options
 * @returns Screen orientation state and controls
 */
function useScreenOrientation(options?: UseScreenOrientationOptions): UseScreenOrientationReturn;

interface UseScreenOrientationReturn {
  isSupported: ComputedRef<boolean>;
  orientation: Ref<ScreenOrientation | undefined>;
  angle: ComputedRef<number>;
  type: ComputedRef<OrientationType>;
  lockOrientation: (type: OrientationLockType) => Promise<void>;
  unlockOrientation: () => void;
}

/**
 * Reactive battery status API
 * @param options - Configuration options
 * @returns Battery status state
 */
function useBattery(options?: UseBatteryOptions): UseBatteryReturn;

interface UseBatteryReturn {
  isSupported: Ref<boolean>;
  charging: Ref<boolean>;
  chargingTime: Ref<number>;
  dischargingTime: Ref<number>;
  level: Ref<number>;
}

interface UseBatteryOptions extends ConfigurableNavigator, ConfigurableEventFilter {
  immediate?: boolean;
}

/**
 * Reactive device memory information
 * @param options - Configuration options
 * @returns Memory information state
 */
function useMemory(options?: UseMemoryOptions): UseMemoryReturn;

interface UseMemoryReturn {
  isSupported: Ref<boolean>;
  deviceMemory?: Ref<number>;
  totalJSHeapSize?: Ref<number>;
  usedJSHeapSize?: Ref<number>;
  jsHeapSizeLimit?: Ref<number>;
}

/**
 * Reactive network connection status
 * @param options - Configuration options
 * @returns Network status state
 */
function useNetwork(options?: UseNetworkOptions): UseNetworkReturn;

interface UseNetworkReturn {
  isSupported: Ref<boolean>;
  isOnline: Ref<boolean>;
  saveData: Ref<boolean | undefined>;
  offlineAt: Ref<number | undefined>;
  onlineAt: Ref<number | undefined>;
  downlink: Ref<number | undefined>;
  downlinkMax: Ref<number | undefined>;
  rtt: Ref<number | undefined>;
  effectiveType: Ref<string | undefined>;
  type: Ref<string>;
}

interface UseNetworkOptions extends ConfigurableWindow, ConfigurableEventFilter {
  immediate?: boolean;
}

/**
 * Simple reactive online/offline status
 * @param options - Configuration options
 * @returns Online status state
 */
function useOnline(options?: ConfigurableWindow): Ref<boolean>;

/**
 * Reactive viewport breakpoints with shortcuts
 * @param breakpoints - Breakpoint definitions
 * @param options - Configuration options
 * @returns Breakpoint utilities
 */
function useBreakpoints<K extends string>(
  breakpoints: Record<K, number | string>,
  options?: UseBreakpointsOptions
): UseBreakpointsReturn<K>;

interface UseBreakpointsReturn<K extends string> {
  greater: (k: K) => ComputedRef<boolean>;
  greaterOrEqual: (k: K) => ComputedRef<boolean>;
  smaller: (k: K) => ComputedRef<boolean>;
  smallerOrEqual: (k: K) => ComputedRef<boolean>;
  between: (a: K, b: K) => ComputedRef<boolean>;
  isGreater: (k: K) => boolean;
  isGreaterOrEqual: (k: K) => boolean;
  isSmaller: (k: K) => boolean;
  isSmallerOrEqual: (k: K) => boolean;
  isInBetween: (a: K, b: K) => boolean;
  current: () => ComputedRef<K[]>;
  active: () => ComputedRef<K>;
}

interface UseBreakpointsOptions extends ConfigurableWindow {
  strategy?: 'min-width' | 'max-width';
}

import { useBreakpoints } from "@vueuse/core";

// Define breakpoints
const breakpoints = useBreakpoints({
  tablet: 768,
  laptop: 1024,
  desktop: 1280,
});

// Use breakpoint utilities
const laptop = breakpoints.greater('tablet'); // tablet < screen
const desktop = breakpoints.between('laptop', 'desktop'); // laptop <= screen < desktop

// Current active breakpoint
const current = breakpoints.current(); // ['tablet', 'laptop']
const active = breakpoints.active(); // 'laptop'

/**
 * Reactive media query matching
 * @param query - Media query string
 * @param options - Configuration options
 * @returns Reactive media query match state
 */
function useMediaQuery(
  query: MaybeRefOrGetter<string>,
  options?: UseMediaQueryOptions
): Ref<boolean>;

interface UseMediaQueryOptions extends ConfigurableWindow {
  immediate?: boolean;
}

/**
 * Reactive device pixel ratio
 * @param options - Configuration options
 * @returns Reactive pixel ratio state
 */
function useDevicePixelRatio(options?: UseDevicePixelRatioOptions): UseDevicePixelRatioReturn;

interface UseDevicePixelRatioReturn {
  pixelRatio: Ref<number>;
}

/**
 * Reactive screen safe area insets
 * @returns Safe area inset values
 */
function useScreenSafeArea(): {
  top: Ref<string>;
  right: Ref<string>;
  bottom: Ref<string>;
  left: Ref<string>;
  update: () => void;
};

/**
 * List available input/output devices
 * @param options - Configuration options
 * @returns Device list state and utilities
 */
function useDevicesList(options?: UseDevicesListOptions): UseDevicesListReturn;

interface UseDevicesListReturn {
  devices: Ref<MediaDeviceInfo[]>;
  videoInputs: ComputedRef<MediaDeviceInfo[]>;
  audioInputs: ComputedRef<MediaDeviceInfo[]>;
  audioOutputs: ComputedRef<MediaDeviceInfo[]>;
  isSupported: Ref<boolean>;
  permissionGranted: Ref<boolean>;
  ensurePermissions: () => Promise<boolean>;
  update: () => Promise<void>;
}

interface UseDevicesListOptions extends ConfigurableNavigator {
  onUpdated?: (devices: MediaDeviceInfo[]) => void;
  immediate?: boolean;
  constraints?: MediaStreamConstraints;
}

/**
 * Reactive window size
 * @param options - Configuration options
 * @returns Reactive window dimensions
 */
function useWindowSize(options?: UseWindowSizeOptions): {
  width: Ref<number>;
  height: Ref<number>;
};

interface UseWindowSizeOptions extends ConfigurableWindow {
  initialWidth?: number;
  initialHeight?: number;
  listenOrientation?: boolean;
  includeScrollbar?: boolean;
}

/**
 * Reactive window focus state
 * @param options - Configuration options
 * @returns Reactive focus state
 */
function useWindowFocus(options?: ConfigurableWindow): Ref<boolean>;

/**
 * Reactive idle state detection
 * @param timeout - Idle timeout in milliseconds
 * @param options - Configuration options
 * @returns Idle state and utilities
 */
function useIdle(
  timeout?: number,
  options?: UseIdleOptions
): UseIdleReturn;

interface UseIdleReturn {
  idle: Ref<boolean>;
  lastActive: Ref<number>;
  reset: () => void;
}

interface UseIdleOptions extends ConfigurableWindow, ConfigurableEventFilter {
  events?: UseIdleEvents[];
  listenForVisibilityChange?: boolean;
  initialState?: boolean;
}

type UseIdleEvents = 'mousemove' | 'mousedown' | 'resize' | 'keydown' | 'touchstart' | 'wheel';

/**
 * Reactive Gamepad API for controller input
 * @param options - Configuration options
 * @returns Gamepad state and utilities
 */
function useGamepad(options?: UseGamepadOptions): UseGamepadReturn;

interface UseGamepadReturn {
  isSupported: Ref<boolean>;
  gamepads: Ref<(Gamepad | null)[]>;
  start: () => void;
  stop: () => void;
  pause: () => void;
  resume: () => void;
  mapGamepad: (gamepad: Gamepad) => Record<string, any>;
}