import { usePrefersReducedMotion } from "rooks";
 
function App() {
  const prefersReducedMotion = usePrefersReducedMotion();
 
  return (
    <div>
      <p>Prefers Reduced Motion: {prefersReducedMotion ? "Yes" : "No"}</p>
      <div
        style={{
          transition: prefersReducedMotion ? "none" : "all 0.3s ease",
          opacity: 1,
        }}
      >
        Animated Content
      </div>
    </div>
  );
}