import { type ReactNode } from "react";
import { type PointerEvent, type StyleProp, type ViewStyle } from "react-native";
import type { ColorTokens } from "./tokens.js";
/** The pointer handlers to spread on the node that does not move. */
export interface HoverTarget {
    onPointerEnter?: (event: PointerEvent) => void;
    onPointerLeave?: (event: PointerEvent) => void;
}
/** A timed hover change: how far the surface rises (0 for a wash) and how long it takes. */
export interface HoverMotion {
    distance: number;
    duration: number;
}
/**
 * The fill a resting control takes under the pointer: the theme's translucent `hover`
 * wash, or `accent` for a token map that omits the optional role (tokens.ts documents the
 * fallback; the Sidebar's wash reads it the same way).
 */
export declare function hoverFill(tokens: Pick<ColorTokens, "hover" | "accent">): string;
/**
 * A skin's hover look, declared on the web only. A skin that one component shares across
 * every platform (its native skins alias the web one) declares its hover feedback through
 * this, so native builds carry none until the owner decides native pointer hover, as the
 * separate iOS and Android skins already do. Platform-parameterized for tests, like
 * `rippleClipWrapperStyle`.
 */
export declare function webHover<T>(look: T, os?: string): T | null;
/**
 * Whether a mouse, trackpad or pen hovers the node `target` is spread on, while
 * `enabled` (the control declares hover feedback at all). A disabled control keeps its
 * handlers and masks the state instead (`hovered && !disabled`), so one enabled under a
 * resting pointer shows its hover without waiting for the pointer to move. When
 * `enabled` turns false the handlers come off and the state clears: a leave the handlers
 * never saw must not leave the control hovered when they come back. An
 * InteractionOverride ancestor that pins `hovered` reports it hovered while `enabled`
 * (src/style/interaction-override.tsx).
 */
export declare function useHover(enabled?: boolean): {
    hovered: boolean;
    target: HoverTarget;
};
export type HoverProperty = "transform" | "box-shadow" | "background-color";
/**
 * The web transition for a hover change: `properties` (their CSS names, which
 * react-native-web copies into `transition-property`) change over `duration` on the
 * reference's `ease`, and at once under Reduce Motion.
 */
export declare function hoverTransition(properties: readonly HoverProperty[], duration: number, reduced: boolean): ViewStyle;
/**
 * The moving half of a hover lift, for the surface inside the hover target: it rises
 * `motion.distance` while hovered, and the rise runs the transition, with the shadow when
 * `shadow` says the hovered elevation differs (the style's own `boxShadow` switches, the
 * browser interpolates the geometry).
 */
export declare function liftStyle(hovered: boolean, motion: HoverMotion, reduced: boolean, shadow?: boolean): ViewStyle;
/**
 * A hover wash painted on the hover target itself, beneath the control: `color` while
 * hovered, the same colour transparent at rest, so the fade never passes through grey.
 * The control's own fills (pressed, selected) stay on the control and switch at once.
 */
export declare function washStyle(hovered: boolean, color: string, motion: HoverMotion, reduced: boolean): ViewStyle;
/** The layer a lifted surface stacks at while it lifts and settles: the hand-off's `--z-raised`. */
export declare const RAISED: ViewStyle;
/**
 * True while `active`, and for `duration` ms after it turns false: the time the leave
 * transition takes, so a surface stays raised until it has settled back.
 */
export declare function useSettling(active: boolean, duration: number): boolean;
/** Stack the nearest kit layout cell above its neighbours while `raised` (outside one, nothing). */
export declare function useRaiseCell(raised: boolean): void;
/** A layout cell (a Grid cell, a Row span cell) that stacks above its neighbours while a descendant is raised. */
export declare function RaiseCell({ style, children }: {
    style?: StyleProp<ViewStyle>;
    children?: ReactNode;
}): ReactNode;
//# sourceMappingURL=hover.d.ts.map