import { useSpring } from "rooks";

function App() {
  const [target, setTarget] = useState(0);
  const value = useSpring(target, {
      stiffness: 170,
      damping: 26,
      mass: 1
  });

  return (
    <div>
        <button onClick={() => setTarget(target === 0 ? 100 : 0)}>
            Toggle
        </button>
        <div style={{ transform: `translateX(${value}px)` }}>
            Moving Box
        </div>
    </div>
  );
}