useGestureMotion

@hua-labs/hua/motion

bash

npm install @hua-labs/hua

tsx

import { useGestureMotion } from "@hua-labs/hua/framework";

tsx

const { ref, motionStyle, isActive } = useGestureMotion({
  gestureType: "hover",
  duration: 200,
});

return (
  <div ref={ref} style={motionStyle} className="card">
    {isActive ? 'Hovering!' : 'Hover me'}
  </div>
);


gestureType*	"hover" \| "drag" \| "pinch" \| "swipe" \| "tilt"	-	Gesture type that triggers motion
duration	number	300	Animation duration in milliseconds
easing	string	"ease-out"	CSS easing function
sensitivity	number	1	Gesture sensitivity multiplier
enabled	boolean	true	Enable/disable gesture detection
onGestureStart	() => void	-	Callback when gesture begins
onGestureEnd	() => void	-	Callback when gesture ends


ref	RefObject<HTMLElement \| null>	Ref to attach to target element
motionStyle	CSSProperties	Animated CSS style based on gesture
isActive	boolean	Whether gesture is active
gestureState	GestureState	Current gesture state (x, y, scale, rotation, delta)

useHoverMotion useToggleMotion