---

Route

Component that only renders at a certain path. Note: This component mainly uses useMatchRoute hook.

import { Route } from '@resourge/react-router'

<Route 
	path={'/'} // Route path(s), can be an array
	// exact // Makes it so 'URL' path needs to be exactly as the path (default: false)
	// hash // Turn 'route' into 'hash route' (default: false)
	// component={<>Home page</>} When defined Route children will be injected into the component
>
	Home page
</Route>

Link

Component extends element a and navigates to to. Note: This component mainly uses useLink hook to navigate to to and useMatchRoute to match route. Note: ‘to’ also gets normalize

import { Link } from '@resourge/react-router'

<Link
  to={'/'}
>
  Home Link
</Link>

Navigate

Navigates to to. Note: This component mainly uses useNavigate hook to navigate to to. Note: ‘to’ also gets normalize

import { Navigate } from '@resourge/react-router'

<Navigate
  to={'/'}
/>

Prompt

Component for prompting the user before navigating. Note: This component mainly uses usePrompt hook.

import { Prompt } from '@resourge/react-router'

<Prompt
  // Boolean that defines if it's going to be triggered on route change
  // Can be a method "(routeUrl: URL, url: URL, action: EVENTS) => boolean"
  when={true} 
/>

Redirect

Navigates from path to to. Note: This component uses the component Route and Navigate. Note: ‘to’ also gets normalize

import { Redirect } from '@resourge/react-router'

<Redirect from={'*'} to={'/'} />

SearchRoute

Component that only renders at a certain search. Note: This component mainly uses useSearchRoute hook.

import { SearchRoute } from '@resourge/react-router'

<SearchRoute 
  search={'name'} // Path SearchParams, can be an array
  // exact // Makes it so 'URL' path needs to be exactly as the path (default: false)
  // hash // Turn 'route' into 'hash route' (default: false)
  // component={<>Home page</>} When defined Route children will be injected into the component
>
  Component
</SearchRoute>

Switch

Component that makes sure the first matching path renders. Note: This component mainly uses useSwitch hook.

import { Switch } from '@resourge/react-router'

<Switch>
  <Route path={'/'}>
    HomePage
  </Route>
  <Route path={'/product'}>
    ProductPage
  </Route>
</Switch>

---