/** * Stage 4.4 port of Base UI React's `useHoverReferenceInteraction`. * * React source: * `base-ui/packages/react/src/floating-ui-react/hooks/useHoverReferenceInteraction.ts` * * Attaches the hover event handlers that belong on the reference (trigger) * element. Coordinates with the floating-side counterpart (below) via * `HoverInteraction`, the shared mutable bag on `dataRef`. * * Returns a prop bag (`onPointerDown`, `onPointerEnter`, `onMouseMove`) * applied via the `reference` slot of `useInteractions`. The heavy * `mouseenter` / `mouseleave` wiring is installed imperatively with * `addEventListener` so disabled-element gaps don't swallow the events * (React's delegation system has the same quirk). * * ### React → Solid deviations * * 1. `useRef` → plain `MutableRef` objects or closure `let`s. The * `HoverInteraction` shared bag is pure mutables so no signals are * involved — the hover logic runs entirely in event callbacks and * effect bodies. * 2. `useValueAsRef` → not needed for options read inside event * handlers — we capture them at setup. Options are read at event * time off the captured `props` reference so late-bound changes * observed by callers still apply (plain JS behaviour). * 3. `useStableCallback` → `createStableCallback` from * `src/internals/stable-callback.ts`. Same identity-stability * guarantee — ensures `addEventListener` / `removeEventListener` * pair up across re-installations. * 4. React's `useEffect` with dep arrays → `createEffect` in the * split `(compute, apply)` form. The compute branch returns a * tracked snapshot keyed on `enabled` / the signals we want to * re-run on; the apply branch installs listeners and registers * `onCleanup`. * 5. `ReactDOM.flushSync` (used on the touch open path) → Solid's * `flush()` from `solid-js`. Same semantics: apply all pending * updates before the next tick, so downstream reactive readers * see the touch-opened state synchronously. * 6. React returns `HTMLProps | undefined` from `useMemo`; the Solid * port returns a plain object since the body runs once. */ import { type MaybeAccessor } from "../../maybe-accessor.js"; import type { FloatingTreeStore } from "../components/floating-tree-store.js"; import type { Delay, ElementPropsBag, FloatingContext, FloatingRootContext, MutableRef } from "../types.js"; import type { HandleClose, HandleCloseContextBase } from "./use-hover-shared.js"; export interface UseHoverReferenceInteractionProps { enabled?: MaybeAccessor | undefined; handleClose?: HandleClose | null | undefined; restMs?: number | (() => number) | undefined; delay?: Delay | (() => Delay) | undefined; move?: boolean | undefined; mouseOnly?: boolean | undefined; externalTree?: FloatingTreeStore | undefined; /** * Whether the hook controls the active trigger. When `false`, consumers * spread the returned props on an inactive trigger via * `getTriggerProps`. * @default true */ isActiveTrigger?: MaybeAccessor | undefined; /** * Reactive trigger element — re-arms `mouseenter` / `mouseleave` listeners * when the ref callback mounts (split-effect compute phase). */ triggerElement?: MaybeAccessor | undefined; triggerElementRef?: Readonly> | undefined; getHandleCloseContext?: (() => HandleCloseContextBase | null) | undefined; isClosing?: (() => boolean) | undefined; } /** * Provides hover interactions that should be attached to reference or trigger * elements. */ export declare function useHoverReferenceInteraction(context: FloatingRootContext | FloatingContext, props?: UseHoverReferenceInteractionProps): ElementPropsBag | undefined; //# sourceMappingURL=use-hover-reference-interaction.d.ts.map