Function useEnhancer

Attach any Hydrateless enhancer to the element in ref for the lifetime of a component. Returns a ref holding the enhancer's imperative API (for example setValue/setOpen), or null while nothing is enhanced. The instance is destroyed on unmount, and destroyed and re-created when deps change, so no listeners leak across renders.

Function-valued options (onValueChange, onOpenChange, ...) always call the handler from the latest render, so they never need to appear in deps. Other options are read when the enhancer is created; list the ones that should trigger re-enhancement in deps.

const ref = useRef<HTMLDivElement>(null);
const api = useEnhancer(ref, enhanceTabs, { onValueChange: setTab });
// api.current?.setValue('install');
return <div data-hl-tabs ref={ref}>...</div>;
Copy