Next.js & SSR

TapTickit’s React hook uses client-only browser APIs (navigator, document, requestAnimationFrame). It must run in a Client Component.

Add "use client"

Put the directive at the top of the file that calls useTaptic (or any file that imports a component which uses it transitively from a file without "use client").

"use client";

import { useTaptic } from "taptickit/react";

You cannot call useTaptic from a Server Component. Keep haptics in leaf components (buttons, sheets) that are marked as client components.

App Router

• Place interactive UI in app/.../client.tsx (or colocate with "use client" in the same module as the button).
• Pass callbacks from server parents only as props into client children; do not import the hook in page.tsx unless that page is a client component.

Pages Router

Same rule: use the hook only in components that execute in the browser (not in getServerSideProps / getStaticProps).

Vue / Svelte / Nuxt / SvelteKit

Use the Vue or Svelte integrations only in client-rendered code paths. SSR-rendered markup should not instantiate TapticKit during Node render without guarding for typeof window.