index.d.ts 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371
  1. import { StoryData } from './utils.js';
  2. export { DEEPLY_EQUAL, buildArgsParam, deepDiff, getMatch, parsePath, queryFromLocation, queryFromString, stringifyQuery } from './utils.js';
  3. import * as React from 'react';
  4. import React__default, { ReactNode, ReactElement } from 'react';
  5. /**
  6. * Actions represent the type of change to a location value.
  7. *
  8. * @see https://github.com/remix-run/history/tree/main/docs/api-reference.md#action
  9. */
  10. declare enum Action {
  11. /**
  12. * A POP indicates a change to an arbitrary index in the history stack, such
  13. * as a back or forward navigation. It does not describe the direction of the
  14. * navigation, only that the current index changed.
  15. *
  16. * Note: This is the default action for newly created history objects.
  17. */
  18. Pop = "POP",
  19. /**
  20. * A PUSH indicates a new entry being added to the history stack, such as when
  21. * a link is clicked and a new page loads. When this happens, all subsequent
  22. * entries in the stack are lost.
  23. */
  24. Push = "PUSH",
  25. /**
  26. * A REPLACE indicates the entry at the current index in the history stack
  27. * being replaced by a new one.
  28. */
  29. Replace = "REPLACE"
  30. }
  31. /**
  32. * A URL pathname, beginning with a /.
  33. *
  34. * @see https://github.com/remix-run/history/tree/main/docs/api-reference.md#location.pathname
  35. */
  36. declare type Pathname = string;
  37. /**
  38. * A URL search string, beginning with a ?.
  39. *
  40. * @see https://github.com/remix-run/history/tree/main/docs/api-reference.md#location.search
  41. */
  42. declare type Search = string;
  43. /**
  44. * A URL fragment identifier, beginning with a #.
  45. *
  46. * @see https://github.com/remix-run/history/tree/main/docs/api-reference.md#location.hash
  47. */
  48. declare type Hash = string;
  49. /**
  50. * A unique string associated with a location. May be used to safely store
  51. * and retrieve data in some other storage API, like `localStorage`.
  52. *
  53. * @see https://github.com/remix-run/history/tree/main/docs/api-reference.md#location.key
  54. */
  55. declare type Key = string;
  56. /**
  57. * The pathname, search, and hash values of a URL.
  58. */
  59. interface Path {
  60. /**
  61. * A URL pathname, beginning with a /.
  62. *
  63. * @see https://github.com/remix-run/history/tree/main/docs/api-reference.md#location.pathname
  64. */
  65. pathname: Pathname;
  66. /**
  67. * A URL search string, beginning with a ?.
  68. *
  69. * @see https://github.com/remix-run/history/tree/main/docs/api-reference.md#location.search
  70. */
  71. search: Search;
  72. /**
  73. * A URL fragment identifier, beginning with a #.
  74. *
  75. * @see https://github.com/remix-run/history/tree/main/docs/api-reference.md#location.hash
  76. */
  77. hash: Hash;
  78. }
  79. /**
  80. * An entry in a history stack. A location contains information about the
  81. * URL path, as well as possibly some arbitrary state and a key.
  82. *
  83. * @see https://github.com/remix-run/history/tree/main/docs/api-reference.md#location
  84. */
  85. interface Location$1 extends Path {
  86. /**
  87. * A value of arbitrary data associated with this location.
  88. *
  89. * @see https://github.com/remix-run/history/tree/main/docs/api-reference.md#location.state
  90. */
  91. state: unknown;
  92. /**
  93. * A unique string associated with this location. May be used to safely store
  94. * and retrieve data in some other storage API, like `localStorage`.
  95. *
  96. * Note: This value is always "default" on the initial location.
  97. *
  98. * @see https://github.com/remix-run/history/tree/main/docs/api-reference.md#location.key
  99. */
  100. key: Key;
  101. }
  102. /**
  103. * A change to the current location.
  104. */
  105. interface Update {
  106. /**
  107. * The action that triggered the change.
  108. */
  109. action: Action;
  110. /**
  111. * The new location.
  112. */
  113. location: Location$1;
  114. }
  115. /**
  116. * A function that receives notifications about location changes.
  117. */
  118. interface Listener {
  119. (update: Update): void;
  120. }
  121. /**
  122. * A change to the current location that was blocked. May be retried
  123. * after obtaining user confirmation.
  124. */
  125. interface Transition extends Update {
  126. /**
  127. * Retries the update to the current location.
  128. */
  129. retry(): void;
  130. }
  131. /**
  132. * A function that receives transitions when navigation is blocked.
  133. */
  134. interface Blocker {
  135. (tx: Transition): void;
  136. }
  137. /**
  138. * Describes a location that is the destination of some navigation, either via
  139. * `history.push` or `history.replace`. May be either a URL or the pieces of a
  140. * URL path.
  141. */
  142. declare type To = string | Partial<Path>;
  143. /**
  144. * A history is an interface to the navigation stack. The history serves as the
  145. * source of truth for the current location, as well as provides a set of
  146. * methods that may be used to change it.
  147. *
  148. * It is similar to the DOM's `window.history` object, but with a smaller, more
  149. * focused API.
  150. */
  151. interface History {
  152. /**
  153. * The last action that modified the current location. This will always be
  154. * Action.Pop when a history instance is first created. This value is mutable.
  155. *
  156. * @see https://github.com/remix-run/history/tree/main/docs/api-reference.md#history.action
  157. */
  158. readonly action: Action;
  159. /**
  160. * The current location. This value is mutable.
  161. *
  162. * @see https://github.com/remix-run/history/tree/main/docs/api-reference.md#history.location
  163. */
  164. readonly location: Location$1;
  165. /**
  166. * Returns a valid href for the given `to` value that may be used as
  167. * the value of an <a href> attribute.
  168. *
  169. * @param to - The destination URL
  170. *
  171. * @see https://github.com/remix-run/history/tree/main/docs/api-reference.md#history.createHref
  172. */
  173. createHref(to: To): string;
  174. /**
  175. * Pushes a new location onto the history stack, increasing its length by one.
  176. * If there were any entries in the stack after the current one, they are
  177. * lost.
  178. *
  179. * @param to - The new URL
  180. * @param state - Data to associate with the new location
  181. *
  182. * @see https://github.com/remix-run/history/tree/main/docs/api-reference.md#history.push
  183. */
  184. push(to: To, state?: any): void;
  185. /**
  186. * Replaces the current location in the history stack with a new one. The
  187. * location that was replaced will no longer be available.
  188. *
  189. * @param to - The new URL
  190. * @param state - Data to associate with the new location
  191. *
  192. * @see https://github.com/remix-run/history/tree/main/docs/api-reference.md#history.replace
  193. */
  194. replace(to: To, state?: any): void;
  195. /**
  196. * Navigates `n` entries backward/forward in the history stack relative to the
  197. * current index. For example, a "back" navigation would use go(-1).
  198. *
  199. * @param delta - The delta in the stack index
  200. *
  201. * @see https://github.com/remix-run/history/tree/main/docs/api-reference.md#history.go
  202. */
  203. go(delta: number): void;
  204. /**
  205. * Navigates to the previous entry in the stack. Identical to go(-1).
  206. *
  207. * Warning: if the current location is the first location in the stack, this
  208. * will unload the current document.
  209. *
  210. * @see https://github.com/remix-run/history/tree/main/docs/api-reference.md#history.back
  211. */
  212. back(): void;
  213. /**
  214. * Navigates to the next entry in the stack. Identical to go(1).
  215. *
  216. * @see https://github.com/remix-run/history/tree/main/docs/api-reference.md#history.forward
  217. */
  218. forward(): void;
  219. /**
  220. * Sets up a listener that will be called whenever the current location
  221. * changes.
  222. *
  223. * @param listener - A function that will be called when the location changes
  224. * @returns unlisten - A function that may be used to stop listening
  225. *
  226. * @see https://github.com/remix-run/history/tree/main/docs/api-reference.md#history.listen
  227. */
  228. listen(listener: Listener): () => void;
  229. /**
  230. * Prevents the current location from changing and sets up a listener that
  231. * will be called instead.
  232. *
  233. * @param blocker - A function that will be called when a transition is blocked
  234. * @returns unblock - A function that may be used to stop blocking
  235. *
  236. * @see https://github.com/remix-run/history/tree/main/docs/api-reference.md#history.block
  237. */
  238. block(blocker: Blocker): () => void;
  239. }
  240. /**
  241. * A Navigator is a "location changer"; it's how you get to different locations.
  242. *
  243. * Every history instance conforms to the Navigator interface, but the
  244. * distinction is useful primarily when it comes to the low-level <Router> API
  245. * where both the location and a navigator must be provided separately in order
  246. * to avoid "tearing" that may occur in a suspense-enabled app if the action
  247. * and/or location were to be read directly from the history instance.
  248. */
  249. declare type Navigator = Omit<History, "action" | "location" | "back" | "forward" | "listen" | "block">;
  250. interface RouterProps {
  251. basename?: string;
  252. children?: React.ReactNode;
  253. location: Partial<Location$1> | string;
  254. navigationType?: Action;
  255. navigator: Navigator;
  256. static?: boolean;
  257. }
  258. /**
  259. * Provides location context for the rest of the app.
  260. *
  261. * Note: You usually won't render a <Router> directly. Instead, you'll render a
  262. * router that is more specific to your environment such as a <BrowserRouter>
  263. * in web browsers or a <StaticRouter> for server rendering.
  264. *
  265. * @see https://reactrouter.com/docs/en/v6/api#router
  266. */
  267. declare function Router({ basename: basenameProp, children, location: locationProp, navigationType, navigator, static: staticProp }: RouterProps): React.ReactElement | null;
  268. interface NavigateOptions$1 {
  269. replace?: boolean;
  270. state?: any;
  271. }
  272. interface BrowserRouterProps {
  273. basename?: string;
  274. children?: React.ReactNode;
  275. window?: Window;
  276. }
  277. /**
  278. * A <Router> for use in web browsers. Provides the cleanest URLs.
  279. */
  280. declare function BrowserRouter({ basename, children, window }: BrowserRouterProps): JSX.Element;
  281. interface Other extends StoryData {
  282. path: string;
  283. singleStory?: boolean;
  284. }
  285. type NavigateOptions = NavigateOptions$1 & {
  286. plain?: boolean;
  287. };
  288. type NavigateFunction = (to: To | number, options?: NavigateOptions) => void;
  289. type RouterData = {
  290. location: Partial<Location$1>;
  291. navigate: NavigateFunction;
  292. } & Other;
  293. type RenderData = Pick<RouterData, 'location'> & Other;
  294. interface LinkProps {
  295. to: string;
  296. children: ReactNode;
  297. }
  298. interface MatchingData {
  299. match: null | {
  300. path: string;
  301. };
  302. }
  303. interface LocationProps {
  304. children: (renderData: RenderData) => any;
  305. }
  306. interface MatchPropsStartsWith {
  307. path: string;
  308. startsWith: boolean;
  309. children: (matchingData: MatchingData) => ReactNode;
  310. }
  311. interface MatchPropsDefault {
  312. path: RegExp;
  313. startsWith: false;
  314. children: (matchingData: MatchingData) => ReactNode;
  315. }
  316. interface RoutePropsStartsWith {
  317. path: string;
  318. startsWith?: boolean;
  319. hideOnly?: boolean;
  320. children: ReactNode;
  321. }
  322. interface RoutePropsDefault {
  323. path: RegExp;
  324. startsWith?: false;
  325. hideOnly?: boolean;
  326. children: ReactNode;
  327. }
  328. declare const useNavigate: () => (to: To | number, { plain, ...options }?: any) => void;
  329. /**
  330. * A component that will navigate to a new location/path when clicked
  331. */
  332. declare const Link: {
  333. ({ to, children, ...rest }: LinkProps): React__default.JSX.Element;
  334. displayName: string;
  335. };
  336. /**
  337. * A render-prop component where children is called with a location
  338. * and will be called whenever it changes when it changes
  339. */
  340. declare const Location: {
  341. ({ children }: LocationProps): React__default.JSX.Element;
  342. displayName: string;
  343. };
  344. /**
  345. * A render-prop component for rendering when a certain path is hit.
  346. * It's immensely similar to `Location` but it receives an addition data property: `match`.
  347. * match has a truthy value when the path is hit.
  348. */
  349. declare function Match(props: MatchPropsStartsWith): ReactElement;
  350. declare function Match(props: MatchPropsDefault): ReactElement;
  351. declare namespace Match {
  352. var displayName: string;
  353. }
  354. /**
  355. * A component to conditionally render children based on matching a target path
  356. */
  357. declare function Route(props: RoutePropsDefault): ReactElement;
  358. declare function Route(props: RoutePropsStartsWith): ReactElement;
  359. declare namespace Route {
  360. var displayName: string;
  361. }
  362. declare const LocationProvider: typeof BrowserRouter;
  363. declare const BaseLocationProvider: typeof Router;
  364. export { BaseLocationProvider, Link, LinkProps, Location, LocationProvider, Match, NavigateFunction, NavigateOptions, Other, RenderData, Route, RouterData, StoryData, useNavigate };