import { UseViewportPositionReturn, ViewportInfo, ViewportPosition, VisibilityState } from '../types';
/**
 * Hook to track an element's position relative to the viewport.
 *
 * @remarks
 * This hook provides comprehensive information about an element's
 * position in the viewport, including visibility state, intersection
 * ratio, and distance from viewport edges.
 *
 * @returns Viewport position information and utilities
 *
 * @example
 * ```tsx
 * function MyComponent() {
 *   const {
 *     position,
 *     isVisible,
 *     isFullyVisible,
 *     visibility,
 *     ref,
 *     scrollIntoView,
 *   } = useViewportPosition();
 *
 *   return (
 *     <div ref={ref}>
 *       {isVisible && <span>I'm visible!</span>}
 *       {!isFullyVisible && (
 *         <button onClick={() => scrollIntoView()}>
 *           Scroll into view
 *         </button>
 *       )}
 *     </div>
 *   );
 * }
 * ```
 */
export declare function useViewportPosition(): UseViewportPositionReturn;
/**
 * Hook to track visibility state only (optimized for performance).
 *
 * @returns Visibility state
 *
 * @example
 * ```tsx
 * function LazyImage({ src }: { src: string }) {
 *   const { isVisible, ref } = useVisibility();
 *
 *   return (
 *     <div ref={ref}>
 *       {isVisible ? <img src={src} /> : <Placeholder />}
 *     </div>
 *   );
 * }
 * ```
 */
export declare function useVisibility(): {
    isVisible: boolean;
    isFullyVisible: boolean;
    visibility: VisibilityState;
    ref: {
        readonly current: HTMLElement | null;
    };
};
/**
 * Hook to get intersection ratio with the viewport.
 *
 * @returns Intersection ratio (0-1) and ref
 *
 * @example
 * ```tsx
 * function AnimatedElement() {
 *   const { ratio, ref } = useIntersectionRatio();
 *
 *   return (
 *     <div
 *       ref={ref}
 *       style={{ opacity: ratio, transform: `scale(${0.5 + ratio * 0.5})` }}
 *     >
 *       Animated content
 *     </div>
 *   );
 * }
 * ```
 */
export declare function useIntersectionRatio(): {
    ratio: number;
    ref: {
        readonly current: HTMLElement | null;
    };
};
/**
 * Hook to track distance from viewport edges.
 *
 * @returns Distance object and ref
 *
 * @example
 * ```tsx
 * function DistanceDisplay() {
 *   const { distance, ref } = useDistanceFromViewport();
 *
 *   return (
 *     <div ref={ref}>
 *       Top: {distance?.top}px, Bottom: {distance?.bottom}px
 *     </div>
 *   );
 * }
 * ```
 */
export declare function useDistanceFromViewport(): {
    distance: ViewportPosition['distanceFromViewport'] | null;
    ref: {
        readonly current: HTMLElement | null;
    };
};
/**
 * Hook to track distance from viewport center.
 *
 * @returns Distance from center and ref
 *
 * @example
 * ```tsx
 * function CenterFocusedElement() {
 *   const { distanceFromCenter, ref } = useDistanceFromCenter();
 *
 *   // Scale based on proximity to center
 *   const scale = Math.max(0.5, 1 - (distanceFromCenter / 500) * 0.5);
 *
 *   return (
 *     <div ref={ref} style={{ transform: `scale(${scale})` }}>
 *       Focus me!
 *     </div>
 *   );
 * }
 * ```
 */
export declare function useDistanceFromCenter(): {
    distanceFromCenter: number;
    ref: {
        readonly current: HTMLElement | null;
    };
};
/**
 * Hook to get current viewport information.
 *
 * @returns Viewport info
 *
 * @example
 * ```tsx
 * function ViewportDisplay() {
 *   const viewport = useViewport();
 *
 *   return (
 *     <div>
 *       {viewport.width}x{viewport.height}
 *       {viewport.orientation === 'portrait' && ' (Portrait)'}
 *     </div>
 *   );
 * }
 * ```
 */
export declare function useViewport(): ViewportInfo;
/**
 * Hook to get viewport dimensions.
 *
 * @returns Viewport width and height
 *
 * @example
 * ```tsx
 * function ResponsiveComponent() {
 *   const { width, height } = useViewportDimensions();
 *
 *   if (width < 768) {
 *     return <MobileLayout />;
 *   }
 *
 *   return <DesktopLayout />;
 * }
 * ```
 */
export declare function useViewportDimensions(): {
    width: number;
    height: number;
};
/**
 * Hook to get viewport scroll position.
 *
 * @returns Scroll x and y positions
 *
 * @example
 * ```tsx
 * function ScrollProgress() {
 *   const { scrollY } = useViewportScroll();
 *   const viewport = useViewport();
 *
 *   const progress = scrollY / (viewport.scrollHeight - viewport.height);
 *
 *   return <ProgressBar value={progress} />;
 * }
 * ```
 */
export declare function useViewportScroll(): {
    scrollX: number;
    scrollY: number;
};
/**
 * Hook to check if on a touch device.
 *
 * @returns Whether device supports touch
 *
 * @example
 * ```tsx
 * function InteractiveElement() {
 *   const isTouch = useIsTouch();
 *
 *   return (
 *     <div
 *       onMouseEnter={!isTouch ? handleHover : undefined}
 *       onTouchStart={isTouch ? handleTouch : undefined}
 *     >
 *       Interact with me
 *     </div>
 *   );
 * }
 * ```
 */
export declare function useIsTouch(): boolean;
/**
 * Hook to get device orientation.
 *
 * @returns Current orientation
 *
 * @example
 * ```tsx
 * function OrientationAware() {
 *   const orientation = useOrientation();
 *
 *   return (
 *     <div className={`layout-${orientation}`}>
 *       Current: {orientation}
 *     </div>
 *   );
 * }
 * ```
 */
export declare function useOrientation(): 'portrait' | 'landscape';
/**
 * Hook to get safe area insets.
 *
 * @returns Safe area insets
 *
 * @example
 * ```tsx
 * function SafeContainer({ children }) {
 *   const safeArea = useSafeAreaInsets();
 *
 *   return (
 *     <div
 *       style={{
 *         paddingTop: safeArea.top,
 *         paddingBottom: safeArea.bottom,
 *         paddingLeft: safeArea.left,
 *         paddingRight: safeArea.right,
 *       }}
 *     >
 *       {children}
 *     </div>
 *   );
 * }
 * ```
 */
export declare function useSafeAreaInsets(): ViewportInfo['safeAreaInsets'];