react-router-remix-setup

What problem does it solve?

Ensures developers correctly integrate state-in-url’s useUrlState hook into React Router or Remix while matching the correct import path and navigation option behavior for each router version.

Core Features & Use Cases

• Shared hook behavior across platforms: Keeps the hook signature, return shape, and core semantics consistent for React Router v6, v7, and Remix v2.
• Correct per-call navigation options: Supports NavigateOptions-style controls like preventScrollReset, state, and replace to preserve UX expectations during URL-driven UI updates.
• Avoids common migration and import pitfalls: Prevents breaking changes caused by using the wrong subpath for React Router v6 versus v7.
• SSR and hydration considerations: Clarifies Remix v2 hydration behavior versus React Router CSR-only defaults.

Quick Start

Load the react-router-remix-setup skill and import useUrlState from state-in-url/react-router for v7, state-in-url/react-router6 for v6, or state-in-url/remix for Remix v2 while passing your desired NavigateOptions per setUrl call.