\n\n[](https://www.npmjs.com/package/holocron-module-route)\n\n> This uses **[@americanexpress/one-app-router](https://github.com/americanexpress/one-app-router)**\n> which is a fork of **`react-router@3`**. It extends its `Route` component which uses\n> **`holocron`**'s `loadModule` to dynamically load modules for specified routes.\n\n> In `createModuleRoute`, we check for the `moduleName` prop from the `ModuleRoute`. If `moduleName`\n> exists, we define methods we know **[@americanexpress/one-app-router](https://github.com/americanexpress/one-app-router)**\n> will leverage during the initialization of routes in the router.\n\n> If `moduleName` exists, `createModuleRoute` will add the methods for `getIndexRoute`,\n> `getChildRoutes`, and `getComponent` to the that route in the route configuration.\n\n## ๐ Table of Contents\n\n* [Usage](#-usage)\n* [API](#%EF%B8%8F-api)\n* [Available Scripts](#-available-scripts)\n\n## ๐คนโ Usage\n\n### Installation\n\n```bash\nyarn add holocron-module-route\n\n# or\n\nnpm install --save holocron-module-route\n```\n\n### Usage within your module\n\nRegister child routes by adding the property childRoutes to the container component of your Module.\n\n**`src/components/MyModule.jsx`**\n\n``` javascript\nimport React from 'react';\n\nimport childRoutes from '../childRoutes';\n\nfunction MyModule({ children }) {\n return
{children}
;\n}\n\nMyModule.childRoutes = childRoutes;\n\nexport default MyModule;\n```\n\n### Child routes\n\nDefine your child routes as either a single route, an array of routes or a function that takes the\nredux store and returns a single route or an array of routes.\n\n\n**`src/childRoutes.jsx`**\n\n``` javascript\nimport React from 'react';\nimport ModuleRoute from 'holocron-module-route';\n\nexport default function getChildRoutes(store) {\n return (\n {\n // this is just an example, not really how auth works :P\n !store.getState.isLoggedIn && replace('/login');\n callback();\n }}\n />\n );\n}\n```\n\n## ๐๏ธ API\n\n\n\n### `ModuleRoute`\n\n`ModuleRoute` extends [`one-app-router`](https://github.com/americanexpress/one-app-router)'s\n[`Route`](https://github.com/americanexpress/one-app-router/blob/main/docs/API.md#route). It has\nall the functionality of `Route`, with the addition of loading a\n[holocron module](https://github.com/americanexpress/one-app#modules) instead of a component.\n\n#### Extended [`Route`](https://github.com/americanexpress/one-app-router/blob/main/docs/API.md#route) Props\n\n| name | type | required | value |\n|---|---|---|---|\n| `moduleName` | `String` | `false` | The name of the Holocron module to render when the route is matched |\n\n#### Usage\n\n```js\nconst myRoutes = [\n ,\n];\n```\n\n\n\n#### Module Lifecycle Hooks\n\nThese are a few statics that can be attached to modules loaded as `ModuleRoute`s.\n\n\n\n##### `childRoutes`\n\nWhile child routes can be defined by nesting, frequently a module will need to load its own child\nroutes rather than relying on its parent to define them.\n\n`childRoutes` can be an array of routes, a single route, or a function that accepts the Redux store\nas a single parameter and returns either an array of routes or a single route.\n\n###### As an Array:\n\n```jsx\nconst MyModule = () => { /* jsx */ };\n\nMyModule.childRoutes = [\n ,\n ,\n];\n```\n\n###### As a single route:\n\n```jsx\nconst MyModule = () => { /* jsx */ };\n\nMyModule.childRoutes = ;\n```\n\n###### As a function:\n\n**Arguments**\n\n| name | type | value |\n|---|---|---|\n| `store` | `Object` | [Redux store](https://redux.js.org/basics/store/) |\n\n**Usage:**\n\n```jsx\nconst MyModule = () => { /* jsx */ };\n\nMyModule.childRoutes = (store) => (\n \n);\n```\n\n\n\n\n\n##### `onEnterRouteHook`\n\nWhen setting `ModuleRoutes`, you may set an `onEnter` hook as a prop on the ``\nitself. However, it is often useful for the module being loded to define its on `onEnter` hook. We\ncan do so via `onEnterRouteHook`. `onEnterRouteHook` can take one, two, or three arguments, with\ndifferent behavior for each.\n\n**One Argument**\n\nWhen using only one argument, `onEnterRouteHook` will receive the [Redux store](https://redux.js.org/basics/store/)\nan must return an `onEnter` hook, which has the same API as [defined in `one-app-router`](https://github.com/americanexpress/one-app-router/blob/main/docs/API.md#onenternextstate-replace-callback).\n\n| name | type | value |\n|---|---|---|\n| `store` | `Object` | Redux store |\n\n**Two or Three Arguments**\n\nWhen using two or three arguments, the API is the same as the `onEnter` in `one-app-router`, where\nthe first two arguments are `nextState` and `replace` and the optional third argument is a callback,\nwhich, when used, will block the transition until it is called. See the\n[`one-app-router` documentation](https://github.com/americanexpress/one-app-router/blob/main/docs/API.md#onenternextstate-replace-callback)\nfor more details.\n\n| name | type | value |\n|---|---|---|\n| `nextState` | `Object` | Next router state |\n| `replace` | `Function` | Redirects to another path |\n| `callback` | `Function` | Blocks route transition until called |\n\n**Usage**\n\n```jsx\nconst MyModule = () => { /* jsx */ };\n\nMyModule.onEnterRouteHook = (store) => (nextState, replace, callback) => {\n store.dispatch(authenticate()).then(() => {\n if (!store.getState().isAuthenticated) replace('/login');\n callback();\n });\n};\n```\n\n\n\n\n\n### `moduleRoutePrefetch`\n\n`moduleRoutePrefetch` can be used to prefetch the modules and data for any route. It is a\n[Redux Thunk](https://redux.js.org/advanced/async-actions/) action creator.\n\n#### Arguments\n\n| name | type | required | value |\n|---|---|---|---|\n| `routes` | `Object` | `true` | Routes as given by [`one-app-router`](https://github.com/americanexpress/one-app-router) to its routes |\n| `location` | `String` | `true` | Route to be prefetched |\n\n#### Usage\n\n```jsx\nconst PrefetchLink = ({ routes, location, prefetch }) => (\n prefetch(location)}>\n { children }\n \n);\n\nconst mapDispatchToProps = (dispatch, { router: { routes } = { routes: [] } }) => ({\n prefetch: (location) => dispatch(moduleRoutePrefetch({ location, routes })),\n});\n\nexport default connect(null, mapDispatchToProps)(PrefetchLink);\n```\n\n\n\n## ๐ Available Scripts\n\nTo test out any changes that you've made locally, run `yarn pack` then install this within your\napplication.\n\nThe scripts below are available to run and use:\n\n**`yarn babel`**\n\nThis deletes the current JS files within the `lib` directory and compiles the ECMAScript 6 code\nwithin the `src` file to a version of ECMAScript that can run in current browsers using Babel\nafterwards it copies them to the lib folder.\n\n**`yarn build`**\n\nThis runs `yarn babel`\n\n**`yarn prepublish`**\n\nThis runs `yarn build`\n","readmeFilename":"README.md","_id":"holocron-module-route@1.9.3-alpha.7","_nodeVersion":"18.19.0","_npmVersion":"lerna/3.22.1/node@v18.19.0+x64 (linux)","dist":{"integrity":"sha512-+jyIYg294NDYocSOnUicDV3aXfg5aVsvaD+UPMAacXckxEOV3tJw6O2AXcxZelD+NDCMZpgjwqtb/umLBTBhoQ==","shasum":"4f44cdb605d489cc7c5a050d9607d20425552367","tarball":"https://registry.npmjs.org/holocron-module-route/-/holocron-module-route-1.9.3-alpha.7.tgz","fileCount":12,"unpackedSize":45674,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFQm+EQHIwASqrLj+6Ivu0JT16BP9tect350ea5Uz45ZAiEAjXX00521piNbuubkoWBb6zBdko+a6XbCsRASiM1JwSc="}]},"_npmUser":{"name":"amexopensource","email":"open-source-ops@aexp.com"},"directories":{},"maintainers":[{"name":"amexopensource","email":"open-source-ops@aexp.com"},{"name":"10xlacroixdrinker","email":"hello@jamieking.me"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/holocron-module-route_1.9.3-alpha.7_1708036954232_0.38294640327509"},"_hasShrinkwrap":false},"1.9.3-alpha.8":{"name":"holocron-module-route","version":"1.9.3-alpha.8","keywords":["holocron","amex","one-app"],"description":"This extends one-app-router's Route component to dynamically load modules for specified routes","contributors":[{"name":"Andres Escobar","email":"Andres.Escobar@aexp.com","url":"https://github.com/anescobar1991"},{"name":"James Singleton","email":"James.Singleton1@aexp.com","url":"https://github.com/JamesSingleton"},{"name":"Jamie King","email":"Jamie.King@aexp.com","url":"https://github.com/10xLaCroixDrinker"},{"name":"Jonathan Adshead","email":"Jonathan.Adshead@aexp.com","url":"https://github.com/JAdshead"},{"name":"Michael Tobia","email":"Michael.M.Tobia@aexp.com","url":"https://github.com/Francois-Esquire"},{"name":"Michael Tomcal","email":"Michael.A.Tomcal@aexp.com","url":"https://github.com/mtomcal"},{"name":"Stephanie Coates","email":"Stephanie.Coates1@aexp.com","url":"https://github.com/stephaniecoates"},{"name":"Nelly Kiboi","email":"Nelly.J.Kiboi@aexp.com","url":"https://github.com/nellyk"},{"name":"Nickolas Oliver","email":"nickolas.oliver@aexp.com","url":"https://github.com/PixnBits"}],"main":"lib/index.js","module":"src/index.js","scripts":{"clean":"rimraf lib","prebuild":"yarn clean","build":"babel src --out-dir lib --copy-files","prepack":"yarn build","prepublish":"yarn build"},"license":"Apache-2.0","peerDependencies":{"holocron":">=1.1.1","react":">=18.2.0"},"dependencies":{"@americanexpress/one-app-router":"^1.1.0","prop-types":"^15.5.10"},"devDependencies":{"babel-loader":"^8.0.5","holocron":"^1.9.3-alpha.8+7e2e9dc","react":"^18.2.0","rimraf":"^2.5.4"},"repository":{"type":"git","url":"git+https://github.com/americanexpress/holocron.git","directory":"packages/holocron-module-route"},"homepage":"https://github.com/americanexpress/holocron","bugs":{"url":"https://github.com/americanexpress/holocron/issues"},"gitHead":"7e2e9dca1d961df8fe34346074a5b21610d71ce0","readme":"
\n \n
\n\n[](https://www.npmjs.com/package/holocron-module-route)\n\n> This uses **[@americanexpress/one-app-router](https://github.com/americanexpress/one-app-router)**\n> which is a fork of **`react-router@3`**. It extends its `Route` component which uses\n> **`holocron`**'s `loadModule` to dynamically load modules for specified routes.\n\n> In `createModuleRoute`, we check for the `moduleName` prop from the `ModuleRoute`. If `moduleName`\n> exists, we define methods we know **[@americanexpress/one-app-router](https://github.com/americanexpress/one-app-router)**\n> will leverage during the initialization of routes in the router.\n\n> If `moduleName` exists, `createModuleRoute` will add the methods for `getIndexRoute`,\n> `getChildRoutes`, and `getComponent` to the that route in the route configuration.\n\n## ๐ Table of Contents\n\n* [Usage](#-usage)\n* [API](#%EF%B8%8F-api)\n* [Available Scripts](#-available-scripts)\n\n## ๐คนโ Usage\n\n### Installation\n\n```bash\nyarn add holocron-module-route\n\n# or\n\nnpm install --save holocron-module-route\n```\n\n### Usage within your module\n\nRegister child routes by adding the property childRoutes to the container component of your Module.\n\n**`src/components/MyModule.jsx`**\n\n``` javascript\nimport React from 'react';\n\nimport childRoutes from '../childRoutes';\n\nfunction MyModule({ children }) {\n return
{children}
;\n}\n\nMyModule.childRoutes = childRoutes;\n\nexport default MyModule;\n```\n\n### Child routes\n\nDefine your child routes as either a single route, an array of routes or a function that takes the\nredux store and returns a single route or an array of routes.\n\n\n**`src/childRoutes.jsx`**\n\n``` javascript\nimport React from 'react';\nimport ModuleRoute from 'holocron-module-route';\n\nexport default function getChildRoutes(store) {\n return (\n {\n // this is just an example, not really how auth works :P\n !store.getState.isLoggedIn && replace('/login');\n callback();\n }}\n />\n );\n}\n```\n\n## ๐๏ธ API\n\n\n\n### `ModuleRoute`\n\n`ModuleRoute` extends [`one-app-router`](https://github.com/americanexpress/one-app-router)'s\n[`Route`](https://github.com/americanexpress/one-app-router/blob/main/docs/API.md#route). It has\nall the functionality of `Route`, with the addition of loading a\n[holocron module](https://github.com/americanexpress/one-app#modules) instead of a component.\n\n#### Extended [`Route`](https://github.com/americanexpress/one-app-router/blob/main/docs/API.md#route) Props\n\n| name | type | required | value |\n|---|---|---|---|\n| `moduleName` | `String` | `false` | The name of the Holocron module to render when the route is matched |\n\n#### Usage\n\n```js\nconst myRoutes = [\n ,\n];\n```\n\n\n\n#### Module Lifecycle Hooks\n\nThese are a few statics that can be attached to modules loaded as `ModuleRoute`s.\n\n\n\n##### `childRoutes`\n\nWhile child routes can be defined by nesting, frequently a module will need to load its own child\nroutes rather than relying on its parent to define them.\n\n`childRoutes` can be an array of routes, a single route, or a function that accepts the Redux store\nas a single parameter and returns either an array of routes or a single route.\n\n###### As an Array:\n\n```jsx\nconst MyModule = () => { /* jsx */ };\n\nMyModule.childRoutes = [\n ,\n ,\n];\n```\n\n###### As a single route:\n\n```jsx\nconst MyModule = () => { /* jsx */ };\n\nMyModule.childRoutes = ;\n```\n\n###### As a function:\n\n**Arguments**\n\n| name | type | value |\n|---|---|---|\n| `store` | `Object` | [Redux store](https://redux.js.org/basics/store/) |\n\n**Usage:**\n\n```jsx\nconst MyModule = () => { /* jsx */ };\n\nMyModule.childRoutes = (store) => (\n \n);\n```\n\n\n\n\n\n##### `onEnterRouteHook`\n\nWhen setting `ModuleRoutes`, you may set an `onEnter` hook as a prop on the ``\nitself. However, it is often useful for the module being loded to define its on `onEnter` hook. We\ncan do so via `onEnterRouteHook`. `onEnterRouteHook` can take one, two, or three arguments, with\ndifferent behavior for each.\n\n**One Argument**\n\nWhen using only one argument, `onEnterRouteHook` will receive the [Redux store](https://redux.js.org/basics/store/)\nan must return an `onEnter` hook, which has the same API as [defined in `one-app-router`](https://github.com/americanexpress/one-app-router/blob/main/docs/API.md#onenternextstate-replace-callback).\n\n| name | type | value |\n|---|---|---|\n| `store` | `Object` | Redux store |\n\n**Two or Three Arguments**\n\nWhen using two or three arguments, the API is the same as the `onEnter` in `one-app-router`, where\nthe first two arguments are `nextState` and `replace` and the optional third argument is a callback,\nwhich, when used, will block the transition until it is called. See the\n[`one-app-router` documentation](https://github.com/americanexpress/one-app-router/blob/main/docs/API.md#onenternextstate-replace-callback)\nfor more details.\n\n| name | type | value |\n|---|---|---|\n| `nextState` | `Object` | Next router state |\n| `replace` | `Function` | Redirects to another path |\n| `callback` | `Function` | Blocks route transition until called |\n\n**Usage**\n\n```jsx\nconst MyModule = () => { /* jsx */ };\n\nMyModule.onEnterRouteHook = (store) => (nextState, replace, callback) => {\n store.dispatch(authenticate()).then(() => {\n if (!store.getState().isAuthenticated) replace('/login');\n callback();\n });\n};\n```\n\n\n\n\n\n### `moduleRoutePrefetch`\n\n`moduleRoutePrefetch` can be used to prefetch the modules and data for any route. It is a\n[Redux Thunk](https://redux.js.org/advanced/async-actions/) action creator.\n\n#### Arguments\n\n| name | type | required | value |\n|---|---|---|---|\n| `routes` | `Object` | `true` | Routes as given by [`one-app-router`](https://github.com/americanexpress/one-app-router) to its routes |\n| `location` | `String` | `true` | Route to be prefetched |\n\n#### Usage\n\n```jsx\nconst PrefetchLink = ({ routes, location, prefetch }) => (\n prefetch(location)}>\n { children }\n \n);\n\nconst mapDispatchToProps = (dispatch, { router: { routes } = { routes: [] } }) => ({\n prefetch: (location) => dispatch(moduleRoutePrefetch({ location, routes })),\n});\n\nexport default connect(null, mapDispatchToProps)(PrefetchLink);\n```\n\n\n\n## ๐ Available Scripts\n\nTo test out any changes that you've made locally, run `yarn pack` then install this within your\napplication.\n\nThe scripts below are available to run and use:\n\n**`yarn babel`**\n\nThis deletes the current JS files within the `lib` directory and compiles the ECMAScript 6 code\nwithin the `src` file to a version of ECMAScript that can run in current browsers using Babel\nafterwards it copies them to the lib folder.\n\n**`yarn build`**\n\nThis runs `yarn babel`\n\n**`yarn prepublish`**\n\nThis runs `yarn build`\n","readmeFilename":"README.md","_id":"holocron-module-route@1.9.3-alpha.8","_nodeVersion":"18.19.0","_npmVersion":"lerna/3.22.1/node@v18.19.0+x64 (linux)","dist":{"integrity":"sha512-Clnev8RMebSNrxqqzrtrZjN+KQ9PWPLcciQck0i/L21c7+k/aWxsjUOngQw+oPj/F1UtPd7eGqb2YnSwuponPA==","shasum":"7f8f50f3012056e88de8550e43db26cff95a7e07","tarball":"https://registry.npmjs.org/holocron-module-route/-/holocron-module-route-1.9.3-alpha.8.tgz","fileCount":12,"unpackedSize":45674,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFvQ6fy1bgTFZpODvIIxTIj/smjmMaHI4dmZCV9W6cccAiBm34MwN+vPvPBSE3OBAz8/a6Giicl9NUp2pskvu+wHUQ=="}]},"_npmUser":{"name":"amexopensource","email":"open-source-ops@aexp.com"},"directories":{},"maintainers":[{"name":"amexopensource","email":"open-source-ops@aexp.com"},{"name":"10xlacroixdrinker","email":"hello@jamieking.me"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/holocron-module-route_1.9.3-alpha.8_1708044514421_0.5064800066848467"},"_hasShrinkwrap":false},"1.9.3-alpha.9":{"name":"holocron-module-route","version":"1.9.3-alpha.9","keywords":["holocron","amex","one-app"],"description":"This extends one-app-router's Route component to dynamically load modules for specified routes","contributors":[{"name":"Andres Escobar","email":"Andres.Escobar@aexp.com","url":"https://github.com/anescobar1991"},{"name":"James Singleton","email":"James.Singleton1@aexp.com","url":"https://github.com/JamesSingleton"},{"name":"Jamie King","email":"Jamie.King@aexp.com","url":"https://github.com/10xLaCroixDrinker"},{"name":"Jonathan Adshead","email":"Jonathan.Adshead@aexp.com","url":"https://github.com/JAdshead"},{"name":"Michael Tobia","email":"Michael.M.Tobia@aexp.com","url":"https://github.com/Francois-Esquire"},{"name":"Michael Tomcal","email":"Michael.A.Tomcal@aexp.com","url":"https://github.com/mtomcal"},{"name":"Stephanie Coates","email":"Stephanie.Coates1@aexp.com","url":"https://github.com/stephaniecoates"},{"name":"Nelly Kiboi","email":"Nelly.J.Kiboi@aexp.com","url":"https://github.com/nellyk"},{"name":"Nickolas Oliver","email":"nickolas.oliver@aexp.com","url":"https://github.com/PixnBits"}],"main":"lib/index.js","module":"src/index.js","scripts":{"clean":"rimraf lib","prebuild":"yarn clean","build":"babel src --out-dir lib --copy-files","prepack":"yarn build","prepublish":"yarn build"},"license":"Apache-2.0","peerDependencies":{"holocron":">=1.1.1","react":">=18.2.0"},"dependencies":{"@americanexpress/one-app-router":"^1.1.0","prop-types":"^15.5.10"},"devDependencies":{"babel-loader":"^8.0.5","holocron":"^1.9.3-alpha.9+b911ba1","react":"^18.2.0","rimraf":"^2.5.4"},"repository":{"type":"git","url":"git+https://github.com/americanexpress/holocron.git","directory":"packages/holocron-module-route"},"homepage":"https://github.com/americanexpress/holocron","bugs":{"url":"https://github.com/americanexpress/holocron/issues"},"gitHead":"b911ba1c129f0ddf8e2f1039e781c5c8e04ecc32","readme":"
\n \n
\n\n[](https://www.npmjs.com/package/holocron-module-route)\n\n> This uses **[@americanexpress/one-app-router](https://github.com/americanexpress/one-app-router)**\n> which is a fork of **`react-router@3`**. It extends its `Route` component which uses\n> **`holocron`**'s `loadModule` to dynamically load modules for specified routes.\n\n> In `createModuleRoute`, we check for the `moduleName` prop from the `ModuleRoute`. If `moduleName`\n> exists, we define methods we know **[@americanexpress/one-app-router](https://github.com/americanexpress/one-app-router)**\n> will leverage during the initialization of routes in the router.\n\n> If `moduleName` exists, `createModuleRoute` will add the methods for `getIndexRoute`,\n> `getChildRoutes`, and `getComponent` to the that route in the route configuration.\n\n## ๐ Table of Contents\n\n* [Usage](#-usage)\n* [API](#%EF%B8%8F-api)\n* [Available Scripts](#-available-scripts)\n\n## ๐คนโ Usage\n\n### Installation\n\n```bash\nyarn add holocron-module-route\n\n# or\n\nnpm install --save holocron-module-route\n```\n\n### Usage within your module\n\nRegister child routes by adding the property childRoutes to the container component of your Module.\n\n**`src/components/MyModule.jsx`**\n\n``` javascript\nimport React from 'react';\n\nimport childRoutes from '../childRoutes';\n\nfunction MyModule({ children }) {\n return
{children}
;\n}\n\nMyModule.childRoutes = childRoutes;\n\nexport default MyModule;\n```\n\n### Child routes\n\nDefine your child routes as either a single route, an array of routes or a function that takes the\nredux store and returns a single route or an array of routes.\n\n\n**`src/childRoutes.jsx`**\n\n``` javascript\nimport React from 'react';\nimport ModuleRoute from 'holocron-module-route';\n\nexport default function getChildRoutes(store) {\n return (\n {\n // this is just an example, not really how auth works :P\n !store.getState.isLoggedIn && replace('/login');\n callback();\n }}\n />\n );\n}\n```\n\n## ๐๏ธ API\n\n\n\n### `ModuleRoute`\n\n`ModuleRoute` extends [`one-app-router`](https://github.com/americanexpress/one-app-router)'s\n[`Route`](https://github.com/americanexpress/one-app-router/blob/main/docs/API.md#route). It has\nall the functionality of `Route`, with the addition of loading a\n[holocron module](https://github.com/americanexpress/one-app#modules) instead of a component.\n\n#### Extended [`Route`](https://github.com/americanexpress/one-app-router/blob/main/docs/API.md#route) Props\n\n| name | type | required | value |\n|---|---|---|---|\n| `moduleName` | `String` | `false` | The name of the Holocron module to render when the route is matched |\n\n#### Usage\n\n```js\nconst myRoutes = [\n ,\n];\n```\n\n\n\n#### Module Lifecycle Hooks\n\nThese are a few statics that can be attached to modules loaded as `ModuleRoute`s.\n\n\n\n##### `childRoutes`\n\nWhile child routes can be defined by nesting, frequently a module will need to load its own child\nroutes rather than relying on its parent to define them.\n\n`childRoutes` can be an array of routes, a single route, or a function that accepts the Redux store\nas a single parameter and returns either an array of routes or a single route.\n\n###### As an Array:\n\n```jsx\nconst MyModule = () => { /* jsx */ };\n\nMyModule.childRoutes = [\n ,\n ,\n];\n```\n\n###### As a single route:\n\n```jsx\nconst MyModule = () => { /* jsx */ };\n\nMyModule.childRoutes = ;\n```\n\n###### As a function:\n\n**Arguments**\n\n| name | type | value |\n|---|---|---|\n| `store` | `Object` | [Redux store](https://redux.js.org/basics/store/) |\n\n**Usage:**\n\n```jsx\nconst MyModule = () => { /* jsx */ };\n\nMyModule.childRoutes = (store) => (\n \n);\n```\n\n\n\n\n\n##### `onEnterRouteHook`\n\nWhen setting `ModuleRoutes`, you may set an `onEnter` hook as a prop on the ``\nitself. However, it is often useful for the module being loded to define its on `onEnter` hook. We\ncan do so via `onEnterRouteHook`. `onEnterRouteHook` can take one, two, or three arguments, with\ndifferent behavior for each.\n\n**One Argument**\n\nWhen using only one argument, `onEnterRouteHook` will receive the [Redux store](https://redux.js.org/basics/store/)\nan must return an `onEnter` hook, which has the same API as [defined in `one-app-router`](https://github.com/americanexpress/one-app-router/blob/main/docs/API.md#onenternextstate-replace-callback).\n\n| name | type | value |\n|---|---|---|\n| `store` | `Object` | Redux store |\n\n**Two or Three Arguments**\n\nWhen using two or three arguments, the API is the same as the `onEnter` in `one-app-router`, where\nthe first two arguments are `nextState` and `replace` and the optional third argument is a callback,\nwhich, when used, will block the transition until it is called. See the\n[`one-app-router` documentation](https://github.com/americanexpress/one-app-router/blob/main/docs/API.md#onenternextstate-replace-callback)\nfor more details.\n\n| name | type | value |\n|---|---|---|\n| `nextState` | `Object` | Next router state |\n| `replace` | `Function` | Redirects to another path |\n| `callback` | `Function` | Blocks route transition until called |\n\n**Usage**\n\n```jsx\nconst MyModule = () => { /* jsx */ };\n\nMyModule.onEnterRouteHook = (store) => (nextState, replace, callback) => {\n store.dispatch(authenticate()).then(() => {\n if (!store.getState().isAuthenticated) replace('/login');\n callback();\n });\n};\n```\n\n\n\n\n\n### `moduleRoutePrefetch`\n\n`moduleRoutePrefetch` can be used to prefetch the modules and data for any route. It is a\n[Redux Thunk](https://redux.js.org/advanced/async-actions/) action creator.\n\n#### Arguments\n\n| name | type | required | value |\n|---|---|---|---|\n| `routes` | `Object` | `true` | Routes as given by [`one-app-router`](https://github.com/americanexpress/one-app-router) to its routes |\n| `location` | `String` | `true` | Route to be prefetched |\n\n#### Usage\n\n```jsx\nconst PrefetchLink = ({ routes, location, prefetch }) => (\n prefetch(location)}>\n { children }\n \n);\n\nconst mapDispatchToProps = (dispatch, { router: { routes } = { routes: [] } }) => ({\n prefetch: (location) => dispatch(moduleRoutePrefetch({ location, routes })),\n});\n\nexport default connect(null, mapDispatchToProps)(PrefetchLink);\n```\n\n\n\n## ๐ Available Scripts\n\nTo test out any changes that you've made locally, run `yarn pack` then install this within your\napplication.\n\nThe scripts below are available to run and use:\n\n**`yarn babel`**\n\nThis deletes the current JS files within the `lib` directory and compiles the ECMAScript 6 code\nwithin the `src` file to a version of ECMAScript that can run in current browsers using Babel\nafterwards it copies them to the lib folder.\n\n**`yarn build`**\n\nThis runs `yarn babel`\n\n**`yarn prepublish`**\n\nThis runs `yarn build`\n","readmeFilename":"README.md","_id":"holocron-module-route@1.9.3-alpha.9","_nodeVersion":"18.19.0","_npmVersion":"lerna/3.22.1/node@v18.19.0+x64 (linux)","dist":{"integrity":"sha512-9zneqvaEVgVsPs5UBijsW6VH8waoEFeWWq7w3gNE/N6jBibZmmNf5reMobHVObB151dgWmGFLjYICXWvrkIdcw==","shasum":"8c424ff542c5c5df64dfd6e757f4d7e002a83ed2","tarball":"https://registry.npmjs.org/holocron-module-route/-/holocron-module-route-1.9.3-alpha.9.tgz","fileCount":12,"unpackedSize":45674,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGWDhWT2VYjNBHecxjfOrgdLSLBRCeaLnv12Vp+v089kAiB9Mm1j/2IrlpvpT05eQ7bgQdqUPsygN9vxHn165OOwrg=="}]},"_npmUser":{"name":"amexopensource","email":"open-source-ops@aexp.com"},"directories":{},"maintainers":[{"name":"amexopensource","email":"open-source-ops@aexp.com"},{"name":"10xlacroixdrinker","email":"hello@jamieking.me"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/holocron-module-route_1.9.3-alpha.9_1708386093616_0.7484150020101152"},"_hasShrinkwrap":false},"1.10.0":{"name":"holocron-module-route","version":"1.10.0","keywords":["holocron","amex","one-app"],"description":"This extends one-app-router's Route component to dynamically load modules for specified routes","contributors":[{"name":"Andres Escobar","email":"Andres.Escobar@aexp.com","url":"https://github.com/anescobar1991"},{"name":"James Singleton","email":"James.Singleton1@aexp.com","url":"https://github.com/JamesSingleton"},{"name":"Jamie King","email":"Jamie.King@aexp.com","url":"https://github.com/10xLaCroixDrinker"},{"name":"Jonathan Adshead","email":"Jonathan.Adshead@aexp.com","url":"https://github.com/JAdshead"},{"name":"Michael Tobia","email":"Michael.M.Tobia@aexp.com","url":"https://github.com/Francois-Esquire"},{"name":"Michael Tomcal","email":"Michael.A.Tomcal@aexp.com","url":"https://github.com/mtomcal"},{"name":"Stephanie Coates","email":"Stephanie.Coates1@aexp.com","url":"https://github.com/stephaniecoates"},{"name":"Nelly Kiboi","email":"Nelly.J.Kiboi@aexp.com","url":"https://github.com/nellyk"},{"name":"Nickolas Oliver","email":"nickolas.oliver@aexp.com","url":"https://github.com/PixnBits"}],"main":"lib/index.js","module":"src/index.js","scripts":{"clean":"rimraf lib","prebuild":"yarn clean","build":"babel src --out-dir lib --copy-files","prepack":"yarn build","prepublish":"yarn build"},"license":"Apache-2.0","peerDependencies":{"holocron":"^1.1.1","react":">=16.13.1"},"dependencies":{"@americanexpress/one-app-router":"^1.1.0","prop-types":"^15.5.10"},"devDependencies":{"babel-loader":"^8.0.5","holocron":"^1.10.0","react":"^16.13.1","rimraf":"^2.5.4"},"repository":{"type":"git","url":"git+https://github.com/americanexpress/holocron.git","directory":"packages/holocron-module-route"},"homepage":"https://github.com/americanexpress/holocron","bugs":{"url":"https://github.com/americanexpress/holocron/issues"},"gitHead":"3488f50ac4fc4cfe2740c1df5d46a05ca2dd530b","_id":"holocron-module-route@1.10.0","_nodeVersion":"18.19.1","_npmVersion":"lerna/3.22.1/node@v18.19.1+x64 (linux)","dist":{"integrity":"sha512-pdSKnoS2uBaUQFCIc/ErPnQOOsoFSW9EDVcDRj1+FJohYTlZlEnD5aMcRd6gjgXQM949Kfxl/aVoS2L5mYq2Tg==","shasum":"7b17bc9c8db66ec6557f6e2ed6474eeb7337c641","tarball":"https://registry.npmjs.org/holocron-module-route/-/holocron-module-route-1.10.0.tgz","fileCount":12,"unpackedSize":45789,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIEJYpzMqpbSWo50hW4mCkoLQd3blpHiBx+XwUMbMstPXAiArva/XiOT+HgEu9azAoRMWK0eqhgQJ3+uvVHlWRPo0Xw=="}]},"_npmUser":{"name":"amexopensource","email":"open-source-ops@aexp.com"},"directories":{},"maintainers":[{"name":"amexopensource","email":"open-source-ops@aexp.com"},{"name":"10xlacroixdrinker","email":"hello@jamieking.me"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/holocron-module-route_1.10.0_1708549817553_0.6846529999480511"},"_hasShrinkwrap":false},"1.10.1":{"name":"holocron-module-route","version":"1.10.1","keywords":["holocron","amex","one-app"],"description":"This extends one-app-router's Route component to dynamically load modules for specified routes","contributors":[{"name":"Andres Escobar","email":"Andres.Escobar@aexp.com","url":"https://github.com/anescobar1991"},{"name":"James Singleton","email":"James.Singleton1@aexp.com","url":"https://github.com/JamesSingleton"},{"name":"Jamie King","email":"Jamie.King@aexp.com","url":"https://github.com/10xLaCroixDrinker"},{"name":"Jonathan Adshead","email":"Jonathan.Adshead@aexp.com","url":"https://github.com/JAdshead"},{"name":"Michael Tobia","email":"Michael.M.Tobia@aexp.com","url":"https://github.com/Francois-Esquire"},{"name":"Michael Tomcal","email":"Michael.A.Tomcal@aexp.com","url":"https://github.com/mtomcal"},{"name":"Stephanie Coates","email":"Stephanie.Coates1@aexp.com","url":"https://github.com/stephaniecoates"},{"name":"Nelly Kiboi","email":"Nelly.J.Kiboi@aexp.com","url":"https://github.com/nellyk"},{"name":"Nickolas Oliver","email":"nickolas.oliver@aexp.com","url":"https://github.com/PixnBits"}],"main":"lib/index.js","module":"src/index.js","scripts":{"clean":"rimraf lib","prebuild":"yarn clean","build":"babel src --out-dir lib --copy-files","prepack":"yarn build","prepublish":"yarn build"},"license":"Apache-2.0","peerDependencies":{"holocron":"^1.1.1","react":">=16.13.1"},"dependencies":{"@americanexpress/one-app-router":"^1.1.0","prop-types":"^15.5.10"},"devDependencies":{"babel-loader":"^8.0.5","holocron":"^1.10.1","react":"^16.13.1","rimraf":"^2.5.4"},"repository":{"type":"git","url":"git+https://github.com/americanexpress/holocron.git","directory":"packages/holocron-module-route"},"homepage":"https://github.com/americanexpress/holocron","bugs":{"url":"https://github.com/americanexpress/holocron/issues"},"gitHead":"1992d3df16a4bab69575b918acec7ce3c84d5c64","_id":"holocron-module-route@1.10.1","_nodeVersion":"18.19.1","_npmVersion":"lerna/3.22.1/node@v18.19.1+x64 (linux)","dist":{"integrity":"sha512-kOcEXCrQz3U3HVB7FK6nhHzeSYZzTOLsdWAEycHz5CDhamCwjp+OwXha2KV/0Y1nCg6Jn3DuvobwiIcHoyy8Jg==","shasum":"f635326ded8515c103dbdacce048038db48346c2","tarball":"https://registry.npmjs.org/holocron-module-route/-/holocron-module-route-1.10.1.tgz","fileCount":12,"unpackedSize":45995,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCICGxO6CPqrZS5NTJTuq6afEuz8bT0yG0c0QyRp1YWX4OAiEA2vwcSeQHVq9ptQF8zOWW/P0p9tca3Pw0NWX+6eA9BXo="}]},"_npmUser":{"name":"amexopensource","email":"open-source-ops@aexp.com"},"directories":{},"maintainers":[{"name":"amexopensource","email":"open-source-ops@aexp.com"},{"name":"10xlacroixdrinker","email":"hello@jamieking.me"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/holocron-module-route_1.10.1_1708616769741_0.30878346499673937"},"_hasShrinkwrap":false},"1.10.2":{"name":"holocron-module-route","version":"1.10.2","keywords":["holocron","amex","one-app"],"description":"This extends one-app-router's Route component to dynamically load modules for specified routes","contributors":[{"name":"Andres Escobar","email":"Andres.Escobar@aexp.com","url":"https://github.com/anescobar1991"},{"name":"James Singleton","email":"James.Singleton1@aexp.com","url":"https://github.com/JamesSingleton"},{"name":"Jamie King","email":"Jamie.King@aexp.com","url":"https://github.com/10xLaCroixDrinker"},{"name":"Jonathan Adshead","email":"Jonathan.Adshead@aexp.com","url":"https://github.com/JAdshead"},{"name":"Michael Tobia","email":"Michael.M.Tobia@aexp.com","url":"https://github.com/Francois-Esquire"},{"name":"Michael Tomcal","email":"Michael.A.Tomcal@aexp.com","url":"https://github.com/mtomcal"},{"name":"Stephanie Coates","email":"Stephanie.Coates1@aexp.com","url":"https://github.com/stephaniecoates"},{"name":"Nelly Kiboi","email":"Nelly.J.Kiboi@aexp.com","url":"https://github.com/nellyk"},{"name":"Nickolas Oliver","email":"nickolas.oliver@aexp.com","url":"https://github.com/PixnBits"}],"main":"lib/index.js","module":"src/index.js","scripts":{"clean":"rimraf lib","prebuild":"yarn clean","build":"babel src --out-dir lib --copy-files","prepack":"yarn build","prepublish":"yarn build"},"license":"Apache-2.0","peerDependencies":{"holocron":"^1.1.1","react":">=16.13.1"},"dependencies":{"@americanexpress/one-app-router":"^1.1.0","prop-types":"^15.5.10"},"devDependencies":{"babel-loader":"^8.0.5","holocron":"^1.10.2","react":"^16.13.1","rimraf":"^2.5.4"},"repository":{"type":"git","url":"git+https://github.com/americanexpress/holocron.git","directory":"packages/holocron-module-route"},"homepage":"https://github.com/americanexpress/holocron","bugs":{"url":"https://github.com/americanexpress/holocron/issues"},"gitHead":"cbf4fad359c697778640a14ec7aacc82308fc247","_id":"holocron-module-route@1.10.2","_nodeVersion":"18.19.1","_npmVersion":"lerna/3.22.1/node@v18.19.1+x64 (linux)","dist":{"integrity":"sha512-6pzSHhGoXI9pkc6D9DT6mLBZg1Ld+yZnWPjmMTNmd+X4zaOFlqYoCYlRfqD4CspUGeG7KXHFly5aXuIZjYaLNQ==","shasum":"9c76464c54c1d09fc8c8fc4d0926d03d53c9792a","tarball":"https://registry.npmjs.org/holocron-module-route/-/holocron-module-route-1.10.2.tgz","fileCount":12,"unpackedSize":46201,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFBdEDi4mSJhGlQ+aPFvWNAmoc5VCk0zmkv2a7A3BCLFAiEAuEjpSkI0UMIK1UCVAeVBYQiLhAs2X5MyB630awHuvmc="}]},"_npmUser":{"name":"amexopensource","email":"open-source-ops@aexp.com"},"directories":{},"maintainers":[{"name":"amexopensource","email":"open-source-ops@aexp.com"},{"name":"10xlacroixdrinker","email":"hello@jamieking.me"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/holocron-module-route_1.10.2_1708628934143_0.016582784770707182"},"_hasShrinkwrap":false},"1.10.3":{"name":"holocron-module-route","version":"1.10.3","keywords":["holocron","amex","one-app"],"description":"This extends one-app-router's Route component to dynamically load modules for specified routes","contributors":[{"name":"Andres Escobar","email":"Andres.Escobar@aexp.com","url":"https://github.com/anescobar1991"},{"name":"James Singleton","email":"James.Singleton1@aexp.com","url":"https://github.com/JamesSingleton"},{"name":"Jamie King","email":"Jamie.King@aexp.com","url":"https://github.com/10xLaCroixDrinker"},{"name":"Jonathan Adshead","email":"Jonathan.Adshead@aexp.com","url":"https://github.com/JAdshead"},{"name":"Michael Tobia","email":"Michael.M.Tobia@aexp.com","url":"https://github.com/Francois-Esquire"},{"name":"Michael Tomcal","email":"Michael.A.Tomcal@aexp.com","url":"https://github.com/mtomcal"},{"name":"Stephanie Coates","email":"Stephanie.Coates1@aexp.com","url":"https://github.com/stephaniecoates"},{"name":"Nelly Kiboi","email":"Nelly.J.Kiboi@aexp.com","url":"https://github.com/nellyk"},{"name":"Nickolas Oliver","email":"nickolas.oliver@aexp.com","url":"https://github.com/PixnBits"}],"main":"lib/index.js","module":"src/index.js","scripts":{"clean":"rimraf lib","prebuild":"yarn clean","build":"babel src --out-dir lib --copy-files","prepack":"yarn build","prepublish":"yarn build"},"license":"Apache-2.0","peerDependencies":{"holocron":"^1.1.1","react":">=16.13.1"},"dependencies":{"@americanexpress/one-app-router":"^1.1.0","prop-types":"^15.5.10"},"devDependencies":{"babel-loader":"^8.0.5","holocron":"^1.10.3","react":"^16.13.1","rimraf":"^2.5.4"},"repository":{"type":"git","url":"git+https://github.com/americanexpress/holocron.git","directory":"packages/holocron-module-route"},"homepage":"https://github.com/americanexpress/holocron","bugs":{"url":"https://github.com/americanexpress/holocron/issues"},"gitHead":"eb6460bee3c9e67b8e81afade0b0586faaf8d64b","_id":"holocron-module-route@1.10.3","_nodeVersion":"18.20.2","_npmVersion":"lerna/3.22.1/node@v18.20.2+x64 (linux)","dist":{"integrity":"sha512-tZdMSewh6RDvJvaSPRDxgPkeAcVH7CcxMnIbKdAFLTQvUCJftDmWW71MVRtylbUpKkqAxDK7vRNAKlW/fGMCOg==","shasum":"70ead33b2888bddb809fdfa3745b6e43e5187a23","tarball":"https://registry.npmjs.org/holocron-module-route/-/holocron-module-route-1.10.3.tgz","fileCount":12,"unpackedSize":46407,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQD03Aiwx0A2XH92m4Bme14oEJrxf1ZCWdYnDI/7yhYpsAIgPS64VJu1v3moUFDkAl+mVrCNot0Oy/CXQ1n98Zzv6nk="}]},"_npmUser":{"name":"amexopensource","email":"open-source-ops@aexp.com"},"directories":{},"maintainers":[{"name":"amexopensource","email":"open-source-ops@aexp.com"},{"name":"10xlacroixdrinker","email":"hello@jamieking.me"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/holocron-module-route_1.10.3_1713807752999_0.7804883024136688"},"_hasShrinkwrap":false}},"time":{"created":"2019-12-18T22:47:44.298Z","1.0.0":"2019-12-18T22:47:44.433Z","modified":"2024-04-22T17:42:33.336Z","1.1.0":"2020-03-27T18:24:51.108Z","1.1.1":"2020-09-16T18:11:59.038Z","1.1.2":"2020-10-01T17:05:45.062Z","1.1.3":"2021-01-21T17:41:09.954Z","1.1.4":"2021-01-27T19:06:12.424Z","1.2.0":"2021-12-16T19:13:58.047Z","1.2.1":"2022-02-11T20:26:32.195Z","1.2.2":"2022-04-11T22:17:23.145Z","1.3.0":"2022-06-07T17:13:00.454Z","1.4.0":"2023-02-15T17:22:34.070Z","1.5.0":"2023-03-07T10:23:58.362Z","1.6.0":"2023-03-14T13:38:12.028Z","1.7.0":"2023-03-27T20:47:16.080Z","1.8.0":"2023-08-18T15:56:22.089Z","1.8.1":"2023-08-24T21:12:26.613Z","1.8.2":"2023-09-18T21:29:44.969Z","2.0.0-alpha-004.0":"2023-09-19T14:21:37.866Z","1.9.0":"2023-10-25T13:34:04.452Z","1.9.1":"2023-11-08T17:41:27.314Z","1.9.2":"2023-11-16T16:25:45.405Z","1.9.3-alpha.7":"2024-02-15T22:42:34.415Z","1.9.3-alpha.8":"2024-02-16T00:48:34.612Z","1.9.3-alpha.9":"2024-02-19T23:41:33.747Z","1.10.0":"2024-02-21T21:10:17.702Z","1.10.1":"2024-02-22T15:46:09.993Z","1.10.2":"2024-02-22T19:08:54.361Z","1.10.3":"2024-04-22T17:42:33.176Z"},"maintainers":[{"name":"amexopensource","email":"open-source-ops@aexp.com"},{"name":"10xlacroixdrinker","email":"hello@jamieking.me"}],"description":"This extends one-app-router's Route component to dynamically load modules for specified routes","homepage":"https://github.com/americanexpress/holocron","keywords":["holocron","amex","one-app"],"repository":{"type":"git","url":"git+https://github.com/americanexpress/holocron.git","directory":"packages/holocron-module-route"},"contributors":[{"name":"Andres Escobar","email":"Andres.Escobar@aexp.com","url":"https://github.com/anescobar1991"},{"name":"James Singleton","email":"James.Singleton1@aexp.com","url":"https://github.com/JamesSingleton"},{"name":"Jamie King","email":"Jamie.King@aexp.com","url":"https://github.com/10xLaCroixDrinker"},{"name":"Jonathan Adshead","email":"Jonathan.Adshead@aexp.com","url":"https://github.com/JAdshead"},{"name":"Michael Tobia","email":"Michael.M.Tobia@aexp.com","url":"https://github.com/Francois-Esquire"},{"name":"Michael Tomcal","email":"Michael.A.Tomcal@aexp.com","url":"https://github.com/mtomcal"},{"name":"Stephanie Coates","email":"Stephanie.Coates1@aexp.com","url":"https://github.com/stephaniecoates"},{"name":"Nelly Kiboi","email":"Nelly.J.Kiboi@aexp.com","url":"https://github.com/nellyk"},{"name":"Nickolas Oliver","email":"nickolas.oliver@aexp.com","url":"https://github.com/PixnBits"}],"bugs":{"url":"https://github.com/americanexpress/holocron/issues"},"license":"Apache-2.0","readme":"
\n \n
\n\n[](https://www.npmjs.com/package/holocron-module-route)\n\n> This uses **[@americanexpress/one-app-router](https://github.com/americanexpress/one-app-router)**\n> which is a fork of **`react-router@3`**. It extends its `Route` component which uses\n> **`holocron`**'s `loadModule` to dynamically load modules for specified routes.\n\n> In `createModuleRoute`, we check for the `moduleName` prop from the `ModuleRoute`. If `moduleName`\n> exists, we define methods we know **[@americanexpress/one-app-router](https://github.com/americanexpress/one-app-router)**\n> will leverage during the initialization of routes in the router.\n\n> If `moduleName` exists, `createModuleRoute` will add the methods for `getIndexRoute`,\n> `getChildRoutes`, and `getComponent` to the that route in the route configuration.\n\n## ๐ Table of Contents\n\n* [Usage](#-usage)\n* [API](#%EF%B8%8F-api)\n* [Available Scripts](#-available-scripts)\n\n## ๐คนโ Usage\n\n### Installation\n\n```bash\nyarn add holocron-module-route\n\n# or\n\nnpm install --save holocron-module-route\n```\n\n### Usage within your module\n\nRegister child routes by adding the property childRoutes to the container component of your Module.\n\n**`src/components/MyModule.jsx`**\n\n``` javascript\nimport React from 'react';\n\nimport childRoutes from '../childRoutes';\n\nfunction MyModule({ children }) {\n return
{children}
;\n}\n\nMyModule.childRoutes = childRoutes;\n\nexport default MyModule;\n```\n\n### Child routes\n\nDefine your child routes as either a single route, an array of routes or a function that takes the\nredux store and returns a single route or an array of routes.\n\n\n**`src/childRoutes.jsx`**\n\n``` javascript\nimport React from 'react';\nimport ModuleRoute from 'holocron-module-route';\n\nexport default function getChildRoutes(store) {\n return (\n {\n // this is just an example, not really how auth works :P\n !store.getState.isLoggedIn && replace('/login');\n callback();\n }}\n />\n );\n}\n```\n\n## ๐๏ธ API\n\n\n\n### `ModuleRoute`\n\n`ModuleRoute` extends [`one-app-router`](https://github.com/americanexpress/one-app-router)'s\n[`Route`](https://github.com/americanexpress/one-app-router/blob/main/docs/API.md#route). It has\nall the functionality of `Route`, with the addition of loading a\n[holocron module](https://github.com/americanexpress/one-app#modules) instead of a component.\n\n#### Extended [`Route`](https://github.com/americanexpress/one-app-router/blob/main/docs/API.md#route) Props\n\n| name | type | required | value |\n|---|---|---|---|\n| `moduleName` | `String` | `false` | The name of the Holocron module to render when the route is matched |\n\n#### Usage\n\n```js\nconst myRoutes = [\n ,\n];\n```\n\n\n\n#### Module Lifecycle Hooks\n\nThese are a few statics that can be attached to modules loaded as `ModuleRoute`s.\n\n\n\n##### `childRoutes`\n\nWhile child routes can be defined by nesting, frequently a module will need to load its own child\nroutes rather than relying on its parent to define them.\n\n`childRoutes` can be an array of routes, a single route, or a function that accepts the Redux store\nas a single parameter and returns either an array of routes or a single route.\n\n###### As an Array:\n\n```jsx\nconst MyModule = () => { /* jsx */ };\n\nMyModule.childRoutes = [\n ,\n ,\n];\n```\n\n###### As a single route:\n\n```jsx\nconst MyModule = () => { /* jsx */ };\n\nMyModule.childRoutes = ;\n```\n\n###### As a function:\n\n**Arguments**\n\n| name | type | value |\n|---|---|---|\n| `store` | `Object` | [Redux store](https://redux.js.org/basics/store/) |\n\n**Usage:**\n\n```jsx\nconst MyModule = () => { /* jsx */ };\n\nMyModule.childRoutes = (store) => (\n \n);\n```\n\n\n\n\n\n##### `onEnterRouteHook`\n\nWhen setting `ModuleRoutes`, you may set an `onEnter` hook as a prop on the ``\nitself. However, it is often useful for the module being loded to define its on `onEnter` hook. We\ncan do so via `onEnterRouteHook`. `onEnterRouteHook` can take one, two, or three arguments, with\ndifferent behavior for each.\n\n**One Argument**\n\nWhen using only one argument, `onEnterRouteHook` will receive the [Redux store](https://redux.js.org/basics/store/)\nan must return an `onEnter` hook, which has the same API as [defined in `one-app-router`](https://github.com/americanexpress/one-app-router/blob/main/docs/API.md#onenternextstate-replace-callback).\n\n| name | type | value |\n|---|---|---|\n| `store` | `Object` | Redux store |\n\n**Two or Three Arguments**\n\nWhen using two or three arguments, the API is the same as the `onEnter` in `one-app-router`, where\nthe first two arguments are `nextState` and `replace` and the optional third argument is a callback,\nwhich, when used, will block the transition until it is called. See the\n[`one-app-router` documentation](https://github.com/americanexpress/one-app-router/blob/main/docs/API.md#onenternextstate-replace-callback)\nfor more details.\n\n| name | type | value |\n|---|---|---|\n| `nextState` | `Object` | Next router state |\n| `replace` | `Function` | Redirects to another path |\n| `callback` | `Function` | Blocks route transition until called |\n\n**Usage**\n\n```jsx\nconst MyModule = () => { /* jsx */ };\n\nMyModule.onEnterRouteHook = (store) => (nextState, replace, callback) => {\n store.dispatch(authenticate()).then(() => {\n if (!store.getState().isAuthenticated) replace('/login');\n callback();\n });\n};\n```\n\n\n\n\n\n### `moduleRoutePrefetch`\n\n`moduleRoutePrefetch` can be used to prefetch the modules and data for any route. It is a\n[Redux Thunk](https://redux.js.org/advanced/async-actions/) action creator.\n\n#### Arguments\n\n| name | type | required | value |\n|---|---|---|---|\n| `routes` | `Object` | `true` | Routes as given by [`one-app-router`](https://github.com/americanexpress/one-app-router) to its routes |\n| `location` | `String` | `true` | Route to be prefetched |\n\n#### Usage\n\n```jsx\nconst PrefetchLink = ({ routes, location, prefetch }) => (\n prefetch(location)}>\n { children }\n \n);\n\nconst mapDispatchToProps = (dispatch, { router: { routes } = { routes: [] } }) => ({\n prefetch: (location) => dispatch(moduleRoutePrefetch({ location, routes })),\n});\n\nexport default connect(null, mapDispatchToProps)(PrefetchLink);\n```\n\n\n\n## ๐ Available Scripts\n\nTo test out any changes that you've made locally, run `yarn pack` then install this within your\napplication.\n\nThe scripts below are available to run and use:\n\n**`yarn babel`**\n\nThis deletes the current JS files within the `lib` directory and compiles the ECMAScript 6 code\nwithin the `src` file to a version of ECMAScript that can run in current browsers using Babel\nafterwards it copies them to the lib folder.\n\n**`yarn build`**\n\nThis runs `yarn babel`\n\n**`yarn prepublish`**\n\nThis runs `yarn build`\n","readmeFilename":"README.md"}
\n